/* LVL original-base migration — approved sidebarless shell.
   Structural/navigation layer only. Review is retired and the bottom dock is the single primary navigation. */
:root{
  --lvl-type-secondary-lg:14px;
  --lvl-type-secondary:13px;
  --lvl-type-caption:12px;
  --lvl-type-meta:11px;
  --lvl-type-micro:10px;
  --lvl-shell-content-max:1040px;
  --lvl-shell-content-gutter:24px;
  --lvl-shell-content-gutter-mobile:20px;
  --lvl-shell-footer-reserve:82px;
  --lvl-shell-footer-reserve-mobile:76px;
  --lvl-shell-topbar-height:68px;
  --lvl-shell-topbar-height-mobile:60px;
  --lvl-shell-topbar-blur:18px;
  --lvl-shell-action-size:38px;
  --lvl-shell-action-size-mobile:35px;
  --lvl-shell-avatar-size:28px;
  --lvl-shell-avatar-size-mobile:27px;
  --lvl-shell-dock-height:68px;
  --lvl-shell-dock-height-mobile:64px;
  --lvl-shell-dock-max:620px;
  --lvl-shell-dock-columns:5;
  --lvl-shell-nav-icon-box:31px;
  --lvl-shell-nav-icon-box-mobile:29px;
  --lvl-shell-icon-size:20px;
  --lvl-shell-icon-size-mobile:19px;
  --lvl-shell-nav-active-width:30px;
  --lvl-shell-nav-active-height:2px;
  --lvl-shell-radius-control:12px;
  --lvl-shell-radius-control-mobile:11px;
  --lvl-shell-radius-avatar:9px;
  --lvl-shell-radius-card:18px;
  --lvl-shell-title-size:21px;
  --lvl-shell-title-size-mobile:18px;
}
html body .app-shell{display:block!important;min-height:100dvh!important;background:var(--lvl-color-canvas)!important}
html body :is(#sidebar,#sidebarScrim,#menuBtn,.sidebar,.sidebar-scrim,.bottom-nav,.mobile-bottom-nav,.lvl-shell-theme){display:none!important}
html body .main-content{width:min(calc(100% - var(--lvl-shell-content-gutter)),var(--lvl-shell-content-max))!important;min-width:0!important;margin:0 auto!important;padding:0 0 calc(var(--lvl-shell-footer-reserve) + env(safe-area-inset-bottom))!important;background:transparent!important}
html body .topbar{position:sticky!important;z-index:80!important;top:0!important;min-height:var(--lvl-shell-topbar-height)!important;padding:10px 0!important;border-bottom:1px solid color-mix(in srgb,var(--lvl-color-border) 78%,transparent)!important;background:color-mix(in srgb,var(--lvl-color-canvas) 88%,transparent)!important;backdrop-filter:blur(var(--lvl-shell-topbar-blur))!important;-webkit-backdrop-filter:blur(var(--lvl-shell-topbar-blur))!important}
html body .topbar>div:first-of-type .eyebrow{font-size:var(--lvl-type-meta)!important;color:var(--lvl-color-text-muted)!important}
html body .topbar #pageTitle{margin:2px 0 0!important;font-size:var(--lvl-shell-title-size)!important;line-height:1.08!important;color:var(--lvl-color-text-strong)!important}
html body .top-actions{gap:7px!important}
html body .top-actions .xp-pill{display:none!important}
html body .top-actions :is(.icon-btn,.lvl-shell-message){width:var(--lvl-shell-action-size)!important;height:var(--lvl-shell-action-size)!important;min-width:var(--lvl-shell-action-size)!important;display:grid!important;place-items:center!important;padding:0!important;border:1px solid var(--lvl-color-border)!important;border-radius:var(--lvl-shell-radius-control)!important;background:var(--lvl-color-surface)!important;color:var(--lvl-color-text)!important;box-shadow:var(--lvl-shadow-surface)!important;cursor:pointer!important}
html body .top-actions :is(.icon-btn,.lvl-shell-message) svg,html body .lvl-shell-dock svg,.lvl-profile-logout-1624 svg{width:var(--lvl-shell-icon-size);height:var(--lvl-shell-icon-size);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html body .top-actions .user-pill{min-height:var(--lvl-shell-action-size)!important;padding:4px 9px 4px 5px!important;border:1px solid var(--lvl-color-border)!important;border-radius:var(--lvl-shell-radius-control)!important;background:var(--lvl-color-surface)!important;color:var(--lvl-color-text)!important;box-shadow:var(--lvl-shadow-surface)!important}
html body .top-actions .user-pill>span{width:var(--lvl-shell-avatar-size)!important;height:var(--lvl-shell-avatar-size)!important;border-radius:var(--lvl-shell-radius-avatar)!important;background:var(--lvl-color-surface-soft)!important;color:var(--lvl-color-accent)!important}
html body .top-actions .user-pill strong{font-size:var(--lvl-type-caption)!important;color:var(--lvl-color-text-strong)!important}
html body .top-actions .user-pill b{display:none!important}

html body :is(.view,.panel,.course-card,.home-kpi-card,.module-card,.lesson-panel,.support-card,.community-n-section) :is(p,small,.muted){font-size:max(12px,var(--lvl-type-caption))!important;line-height:1.5!important}
html body :is(.view,.panel,.course-card,.home-kpi-card,.module-card,.lesson-panel,.support-card,.community-n-section) :is(.eyebrow,[class*="kicker"],.level-rank){font-size:max(10px,var(--lvl-type-micro))!important;line-height:1.35!important}
html body #view-home :is(.lvl-home-hero-copy>p,.lvl-home-continue small,.lvl-home-mission p,.lvl-home-preview-1322 p,.home-kpi-card p,.xp-line){font-size:var(--lvl-type-caption)!important;line-height:1.5!important}

.lvl-shell-dock{position:fixed;z-index:9990;left:0;right:0;bottom:0;width:100%;min-height:var(--lvl-shell-dock-height);padding:0 12px env(safe-area-inset-bottom);border:0;border-top:1px solid var(--lvl-color-border);border-radius:0;background:var(--lvl-color-surface);box-shadow:0 -1px 0 color-mix(in srgb,var(--lvl-color-border) 72%,transparent);backdrop-filter:none;-webkit-backdrop-filter:none}
.lvl-shell-dock-inner{width:min(100%,var(--lvl-shell-dock-max));min-height:var(--lvl-shell-dock-height);margin:0 auto;display:grid;grid-template-columns:repeat(var(--lvl-shell-dock-columns),minmax(0,1fr));align-items:stretch}
.lvl-shell-dock button{position:relative;min-width:0;min-height:var(--lvl-shell-dock-height);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px 3px 7px;border:0;border-radius:0;background:transparent;color:var(--lvl-color-text-muted);cursor:pointer;font:inherit;font-size:var(--lvl-type-meta);line-height:1;font-weight:800}
.lvl-shell-dock button::before{content:"";position:absolute;top:0;left:50%;width:var(--lvl-shell-nav-active-width);height:var(--lvl-shell-nav-active-height);transform:translateX(-50%) scaleX(0);transform-origin:center;border-radius:0 0 999px 999px;background:var(--lvl-color-accent);transition:transform .16s ease}
.lvl-shell-dock button .lvl-shell-dock-icon{width:var(--lvl-shell-nav-icon-box);height:var(--lvl-shell-nav-icon-box);display:grid;place-items:center;color:inherit}
.lvl-shell-dock button.is-active,.lvl-shell-dock button[aria-current="page"]{background:transparent;color:var(--lvl-color-accent)}
.lvl-shell-dock button.is-active::before,.lvl-shell-dock button[aria-current="page"]::before{transform:translateX(-50%) scaleX(1)}
.lvl-shell-dock button:hover,.lvl-shell-dock button:focus-visible{color:var(--lvl-color-accent)}
.lvl-shell-dock button:focus-visible,.lvl-shell-message:focus-visible{outline:2px solid var(--lvl-color-accent);outline-offset:-3px}

.lvl-profile-preferences-1624{margin:22px 0 8px;padding:18px;border:1px solid var(--lvl-color-border);border-radius:var(--lvl-shell-radius-card);background:var(--lvl-color-surface);box-shadow:var(--lvl-shadow-surface)}
.lvl-profile-preferences-head{padding-bottom:14px;border-bottom:1px solid var(--lvl-color-border)}
.lvl-profile-preferences-head>span{display:block;margin-bottom:5px;font-size:var(--lvl-type-meta);font-weight:900;letter-spacing:.09em;color:var(--lvl-color-accent)}
.lvl-profile-preferences-head h3{margin:0;color:var(--lvl-color-text-strong);font-size:18px;line-height:1.2}
.lvl-profile-preferences-head p{margin:5px 0 0;color:var(--lvl-color-text-muted);font-size:var(--lvl-type-secondary)!important;line-height:1.45!important}
.lvl-profile-setting-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 0;border-bottom:1px solid var(--lvl-color-border)}
.lvl-profile-setting-row>div:first-child{min-width:0}
.lvl-profile-setting-row strong,.lvl-profile-logout-1624 strong{display:block;color:var(--lvl-color-text-strong);font-size:var(--lvl-type-secondary-lg);line-height:1.25}
.lvl-profile-setting-row small,.lvl-profile-logout-1624 small{display:block;margin-top:3px;color:var(--lvl-color-text-muted);font-size:var(--lvl-type-caption)!important;line-height:1.4!important}
.lvl-profile-theme-options{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.lvl-profile-theme-options button{min-height:34px;padding:0 11px;border:1px solid var(--lvl-color-border);border-radius:10px;background:var(--lvl-color-surface-soft);color:var(--lvl-color-text);font:inherit;font-size:var(--lvl-type-caption);font-weight:800;cursor:pointer}
.lvl-profile-theme-options button.is-active{border-color:var(--lvl-color-accent);background:var(--lvl-color-accent-soft);color:var(--lvl-color-accent-strong)}
.lvl-profile-theme-options button:focus-visible,.lvl-profile-logout-1624:focus-visible{outline:2px solid var(--lvl-color-focus);outline-offset:2px}
.lvl-profile-logout-1624{width:100%;display:flex;align-items:center;gap:12px;margin-top:14px;padding:13px 12px;border:0;border-radius:12px;background:transparent;color:var(--lvl-color-danger);text-align:left;font:inherit;cursor:pointer}
.lvl-profile-logout-1624:hover{background:color-mix(in srgb,var(--lvl-color-danger) 8%,transparent)}
.lvl-profile-logout-1624 svg{flex:0 0 auto}
.lvl-profile-logout-1624 strong{color:var(--lvl-color-danger)}

.lvl-shell-arena-placeholder{padding:18px 0 4px}
.lvl-shell-arena-placeholder .lvl-shell-arena-card{padding:20px;border:1px solid var(--lvl-color-border);border-radius:var(--lvl-shell-radius-card);background:var(--lvl-color-surface);box-shadow:var(--lvl-shadow-surface)}
.lvl-shell-arena-placeholder .lvl-shell-arena-card span{font-size:var(--lvl-type-meta);font-weight:900;letter-spacing:.1em;color:var(--lvl-color-accent)}
.lvl-shell-arena-placeholder .lvl-shell-arena-card h2{margin:7px 0 6px;color:var(--lvl-color-text-strong)}
.lvl-shell-arena-placeholder .lvl-shell-arena-card p{margin:0;color:var(--lvl-color-text-muted);font-size:var(--lvl-type-secondary);line-height:1.5}

@media(max-width:720px){
  html body .main-content{width:min(calc(100% - var(--lvl-shell-content-gutter-mobile)),var(--lvl-shell-content-max))!important;padding-bottom:calc(var(--lvl-shell-footer-reserve-mobile) + env(safe-area-inset-bottom))!important}
  html body .topbar{min-height:var(--lvl-shell-topbar-height-mobile)!important;padding:8px 0!important}
  html body .topbar>div:first-of-type .eyebrow{display:none!important}
  html body .topbar #pageTitle{font-size:var(--lvl-shell-title-size-mobile)!important}
  html body .top-actions{gap:5px!important}
  html body .top-actions :is(.icon-btn,.lvl-shell-message){width:var(--lvl-shell-action-size-mobile)!important;height:var(--lvl-shell-action-size-mobile)!important;min-width:var(--lvl-shell-action-size-mobile)!important;border-radius:var(--lvl-shell-radius-control-mobile)!important}
  html body .top-actions .user-pill{width:var(--lvl-shell-action-size-mobile)!important;height:var(--lvl-shell-action-size-mobile)!important;min-width:var(--lvl-shell-action-size-mobile)!important;padding:3px!important;border-radius:var(--lvl-shell-radius-control-mobile)!important}
  html body .top-actions .user-pill>span{width:var(--lvl-shell-avatar-size-mobile)!important;height:var(--lvl-shell-avatar-size-mobile)!important}
  html body .top-actions .user-pill strong{display:none!important}
  .lvl-shell-dock{min-height:var(--lvl-shell-dock-height-mobile);padding-left:4px;padding-right:4px}
  .lvl-shell-dock-inner{min-height:var(--lvl-shell-dock-height-mobile);width:100%}
  .lvl-shell-dock button{min-height:var(--lvl-shell-dock-height-mobile);padding:6px 2px 5px;font-size:10px}
  .lvl-shell-dock button .lvl-shell-dock-icon{width:var(--lvl-shell-nav-icon-box-mobile);height:var(--lvl-shell-nav-icon-box-mobile)}
  .lvl-shell-dock svg{width:var(--lvl-shell-icon-size-mobile);height:var(--lvl-shell-icon-size-mobile)}
  .lvl-profile-preferences-1624{padding:15px;margin-top:18px}
  .lvl-profile-setting-row{align-items:flex-start;flex-direction:column;gap:10px}
  .lvl-profile-theme-options{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .lvl-profile-theme-options button{padding:0 6px}
}
