/* LOGIC Experience System — authoritative product UI layer */
@font-face { font-family:'Zain'; src:url('/assets/fonts/Zain-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Zain'; src:url('/assets/fonts/Zain-Bold.ttf') format('truetype'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Zain'; src:url('/assets/fonts/Zain-ExtraBold.ttf') format('truetype'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Doppio One'; src:url('/assets/fonts/DoppioOne-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
:root {
  --bg:#050505;
  --surface:#0c0c0c;
  --surface-raised:#111111;
  --surface-soft:#090909;
  --border:#292929;
  --border-strong:#444a50;
  --text:#f7f5f0;
  --text-soft:#d0d0d0;
  --dim:#9da2a6;
  --muted:#737a80;
  --amber:#ff5b5f;
  --amber-strong:#ff7a7d;
  --amber-ink:#160708;
  --success:#d8d8d8;
  --danger:#df8279;
  --focus:#ff8b8e;
  --radius-sm:7px;
  --radius-md:10px;
  --radius-lg:14px;
  --shadow:0 24px 70px rgba(0,0,0,.3);
}

html { color-scheme:dark; }
body {
  background:var(--bg);
  color:var(--text);
  font-family:'Zain','Segoe UI',Tahoma,sans-serif;
  font-size:17px;
  line-height:1.7;
}
body.lang-en { font-family:'Segoe UI',Arial,sans-serif; font-size:16px; }
body.lang-en h1,body.lang-en h2,body.lang-en h3,body.lang-en .brand-text,body.lang-en .nav-links>a,body.lang-en .btn { font-family:'Doppio One','Segoe UI',sans-serif; font-weight:400; }
button,input,select,textarea { font-family:inherit; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:2px solid var(--focus);
  outline-offset:3px;
}
.skip-link { position:fixed; inset-block-start:10px; inset-inline-start:12px; z-index:999; padding:10px 15px; color:var(--amber-ink); background:var(--amber-strong); border-radius:6px; transform:translateY(-150%); }
.skip-link:focus { transform:none; }

.nav { background:rgba(5,5,5,.78); border-color:transparent; backdrop-filter:blur(16px); box-shadow:0 12px 30px rgba(0,0,0,.12); }
.nav-inner { width:min(calc(100% - 48px),1240px); max-width:1240px; height:78px; padding-inline:0; gap:32px; }
.brand-text { font-size:23px; font-weight:800; line-height:.9; letter-spacing:-.035em; }
.brand-text span { margin-top:8px; font-size:12px; font-weight:700; line-height:1; color:#8c9195; letter-spacing:0; }
.nav-links { gap:8px; }
.nav-links>a { min-height:44px; display:inline-flex; align-items:center; padding:0 13px; color:#a9afb2; border-radius:var(--radius-sm); font-size:15px; font-weight:700; }
.nav-links>a:hover { color:var(--text); background:rgba(255,255,255,.045); }
.nav-links>a.active { color:var(--text); background:transparent; box-shadow:inset 0 -2px var(--amber); }
.nav-links>a.active::after { display:none; }
.language-switch { min-height:42px!important; padding-inline:13px!important; border-radius:var(--radius-sm)!important; }
.language-switch span { font-size:12px!important; }
.language-switch b { font-size:14px!important; }
.user-pill { min-height:42px; padding:4px 9px 4px 4px; border-radius:var(--radius-sm); background:transparent; }
.avatar { width:32px; height:32px; font-size:14px; }
.uname { font-size:14px; }
.icon-btn { width:42px; height:42px; border-radius:var(--radius-sm); }
.mobile-dock { display:none; }

.btn { min-height:46px; padding:0 22px; border-radius:var(--radius-sm); font-size:15px; font-weight:600; }
.btn-sm { min-height:40px; padding-inline:16px; font-size:14px; }
.btn-primary { color:var(--amber-ink); background:var(--amber); border-color:var(--amber); box-shadow:none; }
.btn-primary:hover { color:#100e09; background:var(--amber-strong); border-color:var(--amber-strong); transform:translateY(-1px); }
.btn-secondary,.btn-ghost { color:var(--text); background:#14171a; border:1px solid var(--border-strong); }
.btn-secondary:hover,.btn-ghost:hover { border-color:#596168; background:#1c2125; }

/* Authentication */
.auth-wrap { min-height:calc(100svh - 72px); padding:70px 24px; display:grid; place-items:center; background:linear-gradient(135deg,rgba(255,91,95,.045),transparent 38%); }
.auth-card { width:min(520px,100%); padding:46px 44px; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); box-shadow:0 28px 90px rgba(0,0,0,.28); }
.auth-heading { margin-bottom:30px; text-align:start; }
.auth-heading h1 { margin:0; font-size:clamp(34px,5vw,46px); font-weight:800; line-height:1.2; letter-spacing:-.035em; }
.auth-heading .sub { margin:8px 0 0; color:var(--dim); font-size:16px; line-height:1.7; text-align:start; }
.auth-card .field { margin-bottom:20px; }
.auth-card .field label { margin-bottom:8px; color:var(--text-soft); font-size:15px; font-weight:700; }
.auth-card .field input { min-height:52px; padding:0 15px; color:var(--text); border-color:var(--border); border-radius:var(--radius-sm); background:#090b0c; font-size:16px; }
.auth-card .field input:focus { border-color:#71777c; box-shadow:0 0 0 3px rgba(255,255,255,.035); }
.auth-card .btn { min-height:52px; margin-top:4px; }
.auth-alt { margin-top:23px; color:var(--dim); font-size:15px; }
.auth-alt a { color:#ff8a8d; font-weight:700; }
.form-error { margin-bottom:20px; padding:12px 14px; border-color:rgba(255,91,95,.38); border-radius:var(--radius-sm); background:rgba(255,91,95,.07); color:#ff9295; font-size:14px; }

@media (max-width:620px) {
  .auth-wrap { min-height:calc(100svh - 64px); padding:28px 16px; align-items:start; }
  .auth-card { padding:34px 24px; box-shadow:none; }
}

.product-shell { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:58px 0 96px; }
.dashboard-welcome { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:28px; }
.dashboard-welcome h1 { margin:5px 0 3px; font-size:clamp(30px,4vw,44px); line-height:1.25; font-weight:600; letter-spacing:-.025em; }
.dashboard-welcome p { max-width:670px; color:var(--dim); font-size:16px; }
.context-label { display:block; color:var(--dim); font-size:15px; font-weight:700; }
.quiet-link { color:#ff888b; font-size:15px; font-weight:700; text-decoration:none; white-space:nowrap; }
.quiet-link:hover { color:#ffafb1; }

.dashboard-focus-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(310px,.75fr); gap:16px; }
.learning-resume-card,.weekly-card,.level-card-compact,.journey-preview,.practice-card { border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); }
.learning-resume-card { position:relative; min-height:410px; overflow:hidden; padding:38px 40px; background:var(--surface); }
.learning-resume-card::after { display:none; }
.resume-card-top { position:relative; z-index:1; display:flex; justify-content:space-between; gap:20px; }
.resume-eyebrow { color:var(--dim); font-size:15px; font-weight:700; }
.status-label { display:inline-flex; min-height:32px; align-items:center; padding:0 10px; border-radius:5px; font-size:14px; font-weight:600; }
.status-progress { color:#d1d4d5; border:1px solid #3d4348; background:#15181a; }
.resume-percent { color:var(--amber-strong); font-size:15px; }
.resume-path-name { position:relative; z-index:1; margin-top:40px; color:var(--dim); font-size:15px; font-weight:600; }
.learning-resume-card h2 { position:relative; z-index:1; max-width:650px; margin:6px 0 10px; font-size:clamp(28px,4vw,40px); line-height:1.35; font-weight:600; }
.resume-description { position:relative; z-index:1; max-width:700px; color:var(--text-soft); font-size:16px; line-height:1.9; }
.resume-context { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px 20px; margin-top:22px; color:var(--dim); font-size:14px; }
.resume-context span+span::before { content:'•'; margin-inline-end:20px; color:var(--muted); }
.progress-line { height:7px; overflow:hidden; border-radius:99px; background:#090b0d; }
.progress-line i { display:block; height:100%; border-radius:inherit; background:var(--amber); }
.learning-resume-card>.progress-line { position:relative; z-index:1; margin:26px 0 16px; }
.resume-footer { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.resume-footer>span { color:var(--dim); font-size:14px; }

.dashboard-side-stack { display:grid; gap:16px; }
.weekly-card,.level-card-compact { padding:26px; }
.section-title-row { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.section-title-row h2 { margin-top:3px; font-size:22px; font-weight:600; }
.weekly-card p { margin-top:18px; color:var(--dim); font-size:14px; }
.goal-ring { width:70px; height:70px; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; background:conic-gradient(var(--amber) var(--goal),#272c30 0); position:relative; }
.goal-ring::after { content:''; position:absolute; inset:7px; border-radius:50%; background:var(--surface); }
.goal-ring b { position:relative; z-index:1; color:var(--text); font:600 13px Consolas,monospace; }
.level-card-compact { display:flex; flex-direction:column; justify-content:center; }
.level-card-compact h3 { margin-top:3px; font-size:22px; }
.level-card-compact .progress-line { margin:25px 0 19px; }
.compact-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.compact-metrics span { color:var(--dim); font-size:13px; }
.compact-metrics b { display:block; color:var(--text); font:600 15px Consolas,monospace; }

.dashboard-next-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:16px; margin-top:16px; }
.journey-preview,.practice-card { padding:28px; }
.journey-steps { display:grid; gap:0; margin-top:24px; }
.journey-step { position:relative; display:grid; grid-template-columns:54px 1fr; gap:14px; min-height:68px; padding-bottom:15px; }
.journey-step::before { content:''; position:absolute; inset-inline-start:25px; top:29px; bottom:-2px; width:1px; background:var(--border); }
.journey-step:last-child::before { display:none; }
.journey-step>span { position:relative; z-index:1; width:50px; height:30px; display:grid; place-items:center; color:var(--muted); border:1px solid var(--border); border-radius:5px; background:var(--surface); font-size:12px; font-weight:600; }
.journey-step.current>span { color:var(--amber-ink); border-color:var(--amber); background:var(--amber); }
.journey-step b { display:block; color:var(--text-soft); font-size:15px; }
.journey-step small { color:var(--dim); font-size:13px; }
.practice-heading { display:flex; align-items:center; gap:14px; margin-top:22px; }
.practice-icon { width:48px; height:48px; display:grid; place-items:center; color:var(--spot,var(--amber)); border:1px solid color-mix(in srgb,var(--spot,var(--amber)) 45%,transparent); border-radius:var(--radius-md); background:color-mix(in srgb,var(--spot,var(--amber)) 10%,transparent); }
.practice-icon .ic-svg { width:25px; height:25px; }
.practice-heading h2 { font-size:20px; }
.practice-heading p { color:var(--dim); font-size:14px; }
.practice-description { margin-top:18px; color:var(--text-soft); font-size:14px; line-height:1.85; }
.practice-footer { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:23px; }
.practice-footer>span { color:var(--dim); font-size:14px; }
.empty-copy { color:var(--dim); font-size:15px; }

@media (max-width:960px) {
  .nav-inner { padding-inline:22px; }
  .dashboard-focus-grid,.dashboard-next-grid { grid-template-columns:1fr; }
  .dashboard-side-stack { grid-template-columns:1fr 1fr; }
}
@media (max-width:700px) {
  .product-shell { width:min(100% - 32px,1180px); padding-top:30px; }
  .dashboard-welcome { display:block; }
  .dashboard-welcome .quiet-link { display:inline-block; margin-top:14px; }
  .learning-resume-card { min-height:0; padding:26px 22px; }
  .resume-path-name { margin-top:30px; }
  .resume-footer,.practice-footer { align-items:stretch; flex-direction:column; }
  .resume-footer .btn,.practice-footer .btn { width:100%; }
  .dashboard-side-stack { grid-template-columns:1fr; }
  .weekly-card,.level-card-compact,.journey-preview,.practice-card { padding:22px; }
  .compact-metrics { gap:6px; }
}

/* Guided onboarding */
.onboarding-shell { width:min(1040px,calc(100% - 48px)); margin:0 auto; padding:64px 0 100px; }
.onboarding-intro { max-width:780px; margin-bottom:48px; }
.onboarding-intro h1 { margin:7px 0 10px; font-size:clamp(38px,5vw,58px); line-height:1.25; font-weight:800; letter-spacing:-.035em; }
.onboarding-intro p { color:var(--dim); font-size:17px; line-height:1.9; }
.onboarding-form { display:grid; gap:40px; }
.onboarding-form fieldset { min-width:0; padding:0; border:0; }
.onboarding-form legend { display:flex; align-items:center; gap:13px; margin-bottom:17px; color:var(--text); font-size:20px; font-weight:700; }
.onboarding-form legend span { color:var(--amber); background:transparent; font:400 14px 'Doppio One',Consolas,sans-serif; }
.choice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.choice-card { position:relative; min-height:164px; display:flex; flex-direction:column; padding:23px; cursor:pointer; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); transition:.18s ease; }
.choice-card:hover { border-color:var(--border-strong); background:var(--surface-raised); }
.choice-card input { position:absolute; opacity:0; pointer-events:none; }
.choice-marker { width:20px; height:20px; margin-bottom:27px; border:1.5px solid #596168; border-radius:50%; background:var(--surface-soft); }
.choice-card b { font-size:18px; font-weight:700; }
.choice-card small { margin-top:7px; color:var(--dim); font-size:14px; line-height:1.75; }
.choice-card:has(input:checked) { border-color:#7f4144; box-shadow:0 0 0 3px rgba(255,91,95,.07); background:linear-gradient(145deg,rgba(255,91,95,.045),var(--surface)); }
.choice-card input:focus-visible+.choice-marker { outline:2px solid var(--focus); outline-offset:4px; }
.choice-card:has(input:checked) .choice-marker { border:6px solid var(--amber); background:#17130c; }
.choice-card.compact { min-height:118px; }
.choice-card.compact .choice-marker { margin-bottom:18px; }
.weekly-choice-grid .choice-card { min-height:130px; }
.onboarding-submit { display:flex; align-items:center; justify-content:space-between; gap:28px; padding-top:18px; }
.onboarding-submit p { max-width:620px; color:var(--dim); font-size:14px; }

/* Learning library */
.library-header { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:60px; padding-bottom:12px; }
.library-header h1 { margin:6px 0 10px; font-size:clamp(38px,5vw,56px); line-height:1.25; font-weight:800; letter-spacing:-.035em; }
.library-header>div:first-child>p { max-width:720px; color:var(--dim); font-size:16px; line-height:1.9; }
.library-summary { display:flex; gap:34px; }
.library-summary span { color:var(--dim); font-size:13px; white-space:nowrap; }
.library-summary b { display:block; margin-bottom:1px; color:var(--text); font:600 24px Consolas,monospace; }
.library-tabs { display:flex; gap:8px; margin:28px 0 18px; }
.library-tabs button { min-height:42px; padding:0 15px; color:var(--dim); border:1px solid transparent; border-radius:var(--radius-sm); background:transparent; font-size:14px; cursor:pointer; }
.library-tabs button.active { color:var(--text); border-color:var(--border); background:var(--surface); }
.library-tabs button[disabled] { cursor:not-allowed; opacity:.55; }
.learning-paths-list { display:grid!important; gap:16px!important; max-width:none!important; padding:30px 0 0!important; }
.path-library-card { display:grid; grid-template-columns:minmax(0,1fr) 330px; min-height:390px; overflow:hidden; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); }
.path-card-main { position:relative; padding:38px 40px; background:transparent; }
.status-new { color:#b7c0c5; border:1px solid #3b444a; background:#12171a; }
.status-complete { color:#d8d8d8; border:1px solid #3a3a3a; background:#141414; }
.status-practical { color:#a9c5cb; border:1px solid #385158; background:#0d1719; }
.status-check { color:#ff9699; border:1px solid #66383a; background:#1a1011; }
.path-card-role { margin-top:42px; color:var(--dim); font-size:14px; font-weight:600; }
.path-card-main h2 { margin:5px 0 12px; font-size:clamp(30px,3vw,40px); line-height:1.3; font-weight:800; }
.path-card-main h2 a { color:inherit; text-decoration:none; }
.path-card-main>p:not(.path-card-role) { max-width:720px; color:var(--text-soft); font-size:16px; line-height:1.9; }
.skill-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:25px; }
.skill-tags span { min-height:34px; display:inline-flex; align-items:center; padding:0 10px; color:#aeb4b7; border:1px solid var(--border); border-radius:5px; background:#0d1012; font-size:13px; }
.skill-tags.large span { min-height:38px; padding-inline:12px; font-size:14px; }
.path-card-aside { padding:32px; border:0; background:#0c0e10; }
.path-card-metric strong { display:block; font:600 38px Consolas,monospace; }
.path-card-metric span { color:var(--dim); font-size:14px; }
.path-card-aside>.progress-line { margin:18px 0 24px; }
.path-card-aside dl { display:grid; margin-bottom:27px; }
.path-card-aside dl div { display:flex; justify-content:space-between; gap:18px; padding:10px 0; }
.path-card-aside dt { color:var(--dim); font-size:13px; }
.path-card-aside dd { color:var(--text-soft); font-size:14px; text-align:end; }
.path-card-aside .btn { width:100%; }

/* Path map */
.back-link { display:inline-flex; min-height:40px; align-items:center; color:var(--dim); text-decoration:none; font-size:14px; font-weight:600; }
.back-link:hover { color:var(--text); }
.path-detail-hero { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:70px; align-items:start; padding:37px 0 44px; }
.path-hero-copy h1 { max-width:800px; margin:9px 0 14px; font-size:clamp(44px,6vw,70px); line-height:1.18; font-weight:800; letter-spacing:-.045em; }
.path-outcome { max-width:760px; color:var(--text-soft); font-size:18px; line-height:1.95; }
.path-hero-actions { display:flex; align-items:center; gap:20px; margin-top:30px; }
.path-hero-actions>span { max-width:310px; color:var(--dim); font-size:13px; line-height:1.6; }
.path-progress-panel { padding:28px; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); }
.progress-panel-top { display:flex; justify-content:space-between; align-items:baseline; gap:20px; }
.progress-panel-top>span { color:var(--dim); font-size:14px; font-weight:600; }
.progress-panel-top strong { font:600 32px Consolas,monospace; }
.path-progress-panel>.progress-line { margin:18px 0 9px; }
.path-progress-panel>p { color:var(--dim); font-size:13px; }
.path-progress-panel dl { display:grid; margin-top:23px; }
.path-progress-panel dl div { padding:10px 0; }
.path-progress-panel dt { color:var(--dim); font-size:13px; }
.path-progress-panel dd { margin-top:3px; color:var(--text-soft); font-size:14px; }
.path-information-grid { display:grid; grid-template-columns:1.35fr .65fr; gap:16px; margin-bottom:60px; }
.path-information-grid article { padding:25px 28px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface-soft); }
.path-information-grid .skill-tags { margin-top:16px; }
.path-information-grid ul { display:grid; gap:9px; margin-top:16px; padding:0; list-style:none; }
.path-information-grid li { color:var(--text-soft); font-size:14px; }
.path-information-grid li::before { content:'✓'; margin-inline-end:9px; color:var(--success); }
.roadmap-heading { display:flex; align-items:end; justify-content:space-between; gap:50px; margin-bottom:30px; }
.roadmap-heading h2 { margin-top:4px; font-size:30px; }
.roadmap-heading>p { max-width:520px; color:var(--dim); font-size:14px; line-height:1.8; }
.roadmap-phases { display:grid; gap:18px; }
.roadmap-phase { display:grid; grid-template-columns:72px minmax(0,1fr); border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); }
.roadmap-phase.current { border-color:#6d393b; box-shadow:0 0 0 3px rgba(255,91,95,.04); }
.roadmap-phase.complete { border-color:#3a3a3a; }
.phase-rail { position:relative; display:flex; justify-content:center; padding-top:32px; border:0; background:#0c0f11; border-start-start-radius:inherit; border-end-start-radius:inherit; }
.phase-rail::after { display:none; }
.phase-rail span { position:relative; z-index:1; color:var(--amber); background:#0c0f11; font:400 14px 'Doppio One',Consolas,sans-serif; }
.phase-content { padding:30px; }
.phase-header { display:flex; justify-content:space-between; align-items:center; gap:30px; }
.phase-header h3 { margin:9px 0 5px; font-size:27px; font-weight:600; }
.phase-header p { max-width:700px; color:var(--dim); font-size:14px; line-height:1.85; }
.phase-progress { display:grid; grid-template-columns:auto minmax(160px,310px); align-items:center; justify-content:end; gap:16px; margin:24px 0 8px; }
.phase-progress>span { color:var(--dim); font-size:13px; }
.phase-lessons { display:grid; gap:6px; margin:0; padding:8px 0 0; list-style:none; }
.phase-lessons li>a { display:grid; grid-template-columns:44px minmax(0,1fr) 90px 105px; gap:16px; align-items:center; min-height:88px; padding-inline:12px; color:inherit; text-decoration:none; border:0; border-radius:7px; background:#0d1012; transition:.18s ease; }
.phase-lessons li>a:hover { padding-inline:10px; background:#121619; }
.lesson-state { width:32px; height:32px; display:grid; place-items:center; color:var(--muted); border:1px solid var(--border); border-radius:50%; font:500 11px Consolas,monospace; }
.phase-lessons li.complete .lesson-state { color:#111; border-color:var(--success); background:var(--success); }
.phase-lessons b { display:block; font-size:15px; font-weight:600; }
.phase-lessons small { display:block; margin-top:2px; color:var(--dim); font-size:13px; line-height:1.6; }
.lesson-duration { color:var(--dim); font-size:13px; }
.phase-lessons strong { color:#ff9699; font-size:14px; font-weight:700; text-align:end; }

/* Learning reader */
.learning-reader { min-height:calc(100vh - 78px); background:var(--bg); }
.reader-toolbar { position:sticky; top:78px; z-index:35; background:rgba(5,5,5,.95); border:0; box-shadow:0 12px 28px rgba(0,0,0,.14); backdrop-filter:blur(16px); }
.reader-toolbar-inner { min-height:64px; display:flex; align-items:center; gap:18px; padding:0 26px; }
.outline-toggle { display:none; width:42px; height:42px; color:var(--text); border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); cursor:pointer; }
.reader-back { color:var(--text-soft); text-decoration:none; font-size:14px; font-weight:600; }
.reader-toolbar-meta { display:flex; align-items:center; gap:20px; margin-inline-start:auto; color:var(--dim); font-size:13px; }
.bookmark-button { min-height:38px; padding:0 12px; color:var(--text-soft); border:1px solid var(--border); border-radius:var(--radius-sm); background:transparent; cursor:pointer; font-size:13px; }
.bookmark-button.active { color:#ff9a9d; border-color:#65383a; background:#1a1011; }
.reader-progress { height:3px; margin:0!important; background:#181d20; }
.reader-progress i { display:block; height:100%; background:var(--amber); }
.reader-layout { display:grid; grid-template-columns:300px minmax(0,1fr); align-items:start; width:min(1460px,100%); margin:0 auto; }
.outline-scrim { display:none; }
.lesson-outline { position:relative; top:auto; height:auto; max-height:none; overflow:visible; padding:28px 20px 60px; border:0; background:transparent; }
.outline-head { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.outline-head strong { color:var(--amber); font:600 14px Consolas,monospace; }
.lesson-outline>.progress-line { margin:13px 0 28px; }
.outline-module+.outline-module { margin-top:30px; }
.outline-module-title { display:grid; grid-template-columns:30px 1fr; gap:9px; align-items:start; padding-inline:6px; }
.outline-module-title span { color:var(--muted); font:500 12px Consolas,monospace; }
.outline-module-title b { font-size:14px; font-weight:600; line-height:1.6; }
.outline-module ol { display:grid; gap:4px; margin:13px 0 0; padding:0; list-style:none; }
.outline-module li a { display:grid; grid-template-columns:28px 1fr; gap:9px; align-items:center; min-height:47px; padding:7px 8px; color:var(--dim); text-decoration:none; border:1px solid transparent; border-radius:6px; }
.outline-module li a:hover { color:var(--text-soft); background:#121619; }
.outline-module li.current a { color:var(--text); border-color:#613739; background:#191112; }
.outline-module li.complete a { color:#cfcfcf; }
.outline-module li a>span { font:500 10px Consolas,monospace; text-align:center; }
.outline-module li a>b { overflow:hidden; font-size:13px; font-weight:500; line-height:1.55; text-overflow:ellipsis; white-space:nowrap; }
.reader-notes { margin-top:38px; padding-top:8px; }
.reader-notes label { display:block; margin-bottom:9px; color:var(--text-soft); font-size:14px; font-weight:600; }
.reader-notes textarea { width:100%; min-height:120px; padding:11px 12px; color:var(--text-soft); border:1px solid var(--border); border-radius:var(--radius-sm); outline:0; resize:vertical; background:#080a0c; font-size:13px; line-height:1.7; }
.reader-notes textarea:focus { border-color:#8a4a4d; }
.reader-notes span { display:block; margin-top:6px; color:var(--muted); font-size:12px; }
.lesson-content { min-width:0; }
.lesson-article { width:min(860px,calc(100% - 56px)); margin:0 auto; padding:64px 0 110px; }
.lesson-intro { padding-bottom:38px; }
.lesson-breadcrumb { display:flex; flex-wrap:wrap; gap:10px 22px; color:var(--dim); font-size:14px; font-weight:600; }
.lesson-breadcrumb span+span::before { content:'•'; margin-inline-end:22px; color:var(--muted); }
.lesson-intro h1 { max-width:800px; margin:18px 0 14px; font-size:clamp(42px,6vw,66px); line-height:1.22; font-weight:800; letter-spacing:-.04em; }
.lesson-intro>p { max-width:760px; color:var(--text-soft); font-size:18px; line-height:2; }
.lesson-objective { display:grid; grid-template-columns:120px 1fr; gap:20px; margin-top:34px; padding:20px 22px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); }
.lesson-objective span { color:var(--dim); font-size:13px; font-weight:600; }
.lesson-objective b { color:var(--text-soft); font-size:15px; font-weight:500; line-height:1.8; }
.reading-section { padding:54px 0 34px; scroll-margin-top:160px; }
.section-index { display:block; margin-bottom:12px; color:var(--dim); font-size:15px; font-weight:700; }
.reading-section h2 { margin-bottom:22px; font-size:34px; line-height:1.4; font-weight:800; }
.reading-section>p { margin:0 0 20px; color:#d1d1d1; font-size:18px; line-height:2.05; }
.learning-note { margin-top:30px; padding:22px 24px; border:1px solid #533033; border-inline-start:3px solid var(--amber); border-radius:var(--radius-sm); background:#160e0f; }
.learning-note b { display:block; color:#ff9699; font-size:15px; }
.learning-note p { margin-top:6px; color:#d9c7c8; font-size:16px; line-height:1.9; }
.code-block { margin:30px 0 10px; overflow:hidden; border:1px solid #30373c; border-radius:var(--radius-md); background:#07090a; direction:ltr; text-align:left; }
.code-toolbar { min-height:44px; display:flex; align-items:center; justify-content:space-between; padding:0 12px 0 17px; border-bottom:1px solid #252b30; background:#101417; }
.code-toolbar span { color:#879097; font:500 12px Consolas,monospace; }
.code-toolbar button { min-height:32px; padding:0 10px; color:#b6bdc1; border:1px solid #353d42; border-radius:4px; background:#171c20; cursor:pointer; font-size:12px; }
.code-block pre { margin:0!important; padding:24px!important; border:0!important; border-radius:0!important; background:transparent!important; }
.code-block code { color:#dbdbdb; font:14px/1.9 Consolas,monospace; }
.lesson-media { margin:30px 0 10px!important; padding:12px!important; border:1px solid var(--border)!important; border-radius:var(--radius-md)!important; background:var(--surface)!important; }
.lesson-media img { display:block; width:100%; max-height:520px!important; object-fit:contain; border-radius:6px!important; }
.lesson-media figcaption { margin-top:11px!important; color:var(--dim)!important; font-size:13px!important; line-height:1.7; text-align:center; }

.lab-workspace { margin:64px 0 0; padding:34px; border:1px solid #385158; border-radius:var(--radius-lg); background:linear-gradient(145deg,rgba(93,138,148,.08),var(--surface)); }
.lab-workspace>header { display:flex; justify-content:space-between; align-items:start; gap:24px; }
.lab-workspace h2 { margin:12px 0 7px; font-size:30px; }
.lab-workspace header p { max-width:650px; color:var(--dim); font-size:15px; line-height:1.8; }
.lab-requirement { flex:0 0 auto; color:#a9c5cb; font-size:13px; }
.machine-preview { min-height:430px!important; margin:30px 0 0!important; border-radius:var(--radius-md)!important; }
.machine-preview-idle { max-width:520px; }
.machine-preview-idle h3 { font-size:21px!important; }
.machine-preview-idle p { margin:8px 0 24px!important; color:var(--dim)!important; font-size:14px!important; line-height:1.75; }
.machine-glyph { color:#b9d0d4!important; font-size:36px!important; }
.learning-question { display:grid; gap:17px; margin-top:26px; padding:24px!important; border:1px solid var(--border)!important; border-radius:var(--radius-md); background:#0b0e10; }
.learning-question>div:first-child>span { display:block; color:#91afb5; font-size:13px; font-weight:600; }
.learning-question label { margin:5px 0 0!important; color:var(--text)!important; font-size:16px!important; line-height:1.7; }
.answer-control { display:grid!important; grid-template-columns:1fr auto; gap:9px!important; }
.learning-question input { min-height:46px!important; padding-inline:14px!important; font-size:14px!important; }
.learning-question>p { min-height:23px; margin:0!important; font-size:14px!important; }
.learning-question>p a { color:var(--amber); }

.knowledge-check-section { margin:64px 0 0!important; padding:34px!important; border-color:#533033!important; border-radius:var(--radius-lg)!important; background:linear-gradient(145deg,rgba(255,91,95,.04),var(--surface))!important; }
.knowledge-check-head h2 { margin:12px 0 7px!important; font-size:30px!important; }
.knowledge-check-head p { color:var(--dim)!important; font-size:15px!important; }
.knowledge-check-section form { gap:12px!important; margin-top:26px!important; }
.knowledge-check-item { grid-template-columns:38px 1fr!important; gap:9px 15px!important; padding:22px!important; border-radius:var(--radius-md)!important; }
.knowledge-check-item>span { font-size:12px!important; }
.knowledge-check-item>b { font-size:16px!important; font-weight:600!important; }
.knowledge-check-item input { min-height:46px!important; padding-inline:14px!important; font-size:14px!important; }
.knowledge-check-status { font-size:14px!important; }
.lesson-takeaway { margin-top:64px!important; padding:32px!important; border:1px solid #404040!important; border-radius:var(--radius-lg); background:#131313; }
.lesson-takeaway h2 { margin:5px 0 20px; font-size:25px; }
.lesson-takeaway ul { gap:12px!important; margin-top:0!important; }
.lesson-takeaway li { color:#d2d2d2!important; font-size:15px!important; line-height:1.75; }
.academy-reader-nav { gap:14px!important; margin-top:34px!important; }
.academy-reader-nav>a,.academy-reader-nav>button { min-height:118px!important; padding:23px 25px!important; border:1px solid var(--border)!important; border-radius:var(--radius-md)!important; background:var(--surface)!important; }
.academy-reader-nav>a:hover,.academy-reader-nav>button:hover { border-color:var(--border-strong)!important; background:var(--surface-raised)!important; }
.academy-reader-nav span { color:var(--dim)!important; font-size:13px!important; }
.academy-reader-nav b { margin-top:7px!important; font-size:16px!important; }
.reader-next { border-color:#603638!important; background:#191112!important; }
.completion-hint { align-self:center; padding:20px; color:var(--dim); font-size:14px; text-align:center; }

@media (max-width:1080px) {
  .path-library-card { grid-template-columns:1fr 300px; }
  .path-detail-hero { gap:35px; }
  .reader-layout { grid-template-columns:270px minmax(0,1fr); }
}
@media (max-width:900px) {
  .choice-grid { grid-template-columns:1fr; }
  .choice-card { min-height:120px; }
  .choice-marker { margin-bottom:18px; }
  .library-header,.path-library-card,.path-detail-hero,.path-information-grid { grid-template-columns:1fr; }
  .library-summary { justify-content:flex-start; }
  .path-card-aside { border:0; }
  .path-detail-hero { gap:24px; }
  .roadmap-heading { display:block; }
  .roadmap-heading>p { margin-top:10px; }
  .phase-lessons li>a { grid-template-columns:42px minmax(0,1fr) 82px; }
  .phase-lessons strong { display:none; }
  .outline-toggle { display:grid; place-items:center; }
  .reader-layout { grid-template-columns:1fr; }
  body.reader-outline-open { overflow:hidden; }
  .outline-scrim { position:fixed; inset:142px 0 0; z-index:44; display:block; padding:0; border:0; background:rgba(0,0,0,.58); opacity:0; pointer-events:none; transition:opacity .2s ease; }
  body.reader-outline-open .outline-scrim { opacity:1; pointer-events:auto; }
  .lesson-outline { position:fixed; inset-block:142px 0; inset-inline-start:0; z-index:45; width:min(340px,88vw); height:auto; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; background:#0b0e10; transform:translateX(calc(-100% * var(--reader-side,-1))); transition:transform .22s ease; box-shadow:var(--shadow); }
  .lesson-outline::-webkit-scrollbar { display:none; }
  html[dir="rtl"] .lesson-outline { --reader-side:1; }
  html[dir="ltr"] .lesson-outline { --reader-side:-1; }
  .lesson-outline.open { transform:none; }
}
@media (max-width:700px) {
  .onboarding-shell { width:calc(100% - 32px); padding-top:36px; }
  .onboarding-submit { align-items:stretch; flex-direction:column; }
  .onboarding-submit .btn { width:100%; }
  .library-header { gap:25px; }
  .library-summary { gap:20px; flex-wrap:wrap; }
  .path-card-main,.path-card-aside { padding:25px 22px; }
  .path-card-role { margin-top:30px; }
  .path-hero-actions { align-items:stretch; flex-direction:column; }
  .path-hero-actions .btn { width:100%; }
  .path-information-grid { margin-bottom:42px; }
  .roadmap-phase { grid-template-columns:1fr; }
  .phase-rail { justify-content:flex-start; padding:20px 22px 0; border-inline-end:0; background:transparent; }
  .phase-rail::after { display:none; }
  .phase-content { padding:22px; }
  .phase-header { align-items:stretch; flex-direction:column; }
  .phase-header .btn { width:100%; }
  .phase-progress { grid-template-columns:1fr; justify-content:stretch; }
  .phase-lessons li>a { grid-template-columns:38px 1fr; padding:14px 0; }
  .lesson-duration { grid-column:2; }
  .reader-toolbar-inner { padding-inline:14px; gap:10px; }
  .reader-toolbar { top:64px; }
  .outline-scrim { inset:128px 0 68px; }
  .lesson-outline { inset-block:128px 68px; }
  .reader-back { max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .reader-toolbar-meta>span { display:none; }
  .reader-toolbar-meta { gap:8px; }
  .bookmark-button { padding-inline:9px; }
  .lesson-article { width:calc(100% - 32px); padding-top:42px; }
  .lesson-intro { padding-bottom:42px; }
  .lesson-intro h1 { font-size:36px; }
  .lesson-intro>p,.reading-section>p { font-size:16px; line-height:2; }
  .lesson-objective { grid-template-columns:1fr; gap:5px; }
  .reading-section { padding:44px 0 40px; }
  .reading-section h2 { font-size:27px; }
  .lab-workspace,.knowledge-check-section { padding:24px 18px!important; }
  .lab-workspace>header { display:block; }
  .lab-requirement { display:block; margin-top:9px; }
  .answer-control { grid-template-columns:1fr!important; }
  .knowledge-check-item { grid-template-columns:1fr!important; }
  .knowledge-check-item small { grid-column:1!important; }
  .academy-reader-nav { grid-template-columns:1fr!important; }
  .academy-reader-nav>span:empty { display:none; }
}

/* Practice arena */
.practice-library-header { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:70px; align-items:end; padding-bottom:16px; }
.practice-library-header h1,.leaderboard-header h1 { margin:7px 0 11px; font-size:clamp(36px,5vw,54px); line-height:1.3; font-weight:600; letter-spacing:-.03em; }
.practice-library-header>div:first-child>p,.leaderboard-header>div:first-child>p { max-width:740px; color:var(--dim); font-size:16px; line-height:1.9; }
.practice-summary { padding:24px; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface); }
.practice-summary strong { font:600 31px Consolas,monospace; }
.practice-summary strong span { color:var(--dim); font-size:18px; }
.practice-summary p { margin:3px 0 15px; color:var(--dim); font-size:13px; }
.practice-fields { padding-top:38px; }
.practice-fields .section-title-row h2 { font-size:28px; }
.rooms-grid.category-launcher { max-width:none!important; margin:24px 0 0!important; padding:0!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px!important; }
.category-launcher .room-card { min-height:260px!important; padding:24px!important; align-items:stretch!important; justify-content:flex-start!important; color:inherit; text-align:start!important; text-decoration:none; border:1px solid var(--border)!important; border-radius:var(--radius-lg)!important; background:var(--surface)!important; aspect-ratio:auto!important; transition:.18s ease; }
.category-launcher .room-card:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--rc) 55%,var(--border))!important; background:var(--surface-raised)!important; }
.category-launcher .room-card::after { opacity:.055!important; }
.room-card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }
.category-launcher .room-icon { width:50px!important; height:50px!important; margin:0!important; }
.category-launcher .room-icon .ic-svg { margin:0!important; }
.category-launcher .room-card .room-index { margin:0; color:var(--muted); font-size:12px; }
.category-launcher .room-card>b { font-size:20px!important; font-weight:600; }
.category-launcher .room-card>p { min-height:54px; margin-top:7px; color:var(--dim); font-size:14px; line-height:1.8; }
.room-card-foot { display:flex; align-items:end; justify-content:space-between; gap:14px; margin-top:auto; padding-top:24px; }
.category-launcher .room-card-foot span { color:var(--dim)!important; font-size:13px!important; }
.category-launcher .room-card-foot em { margin:0!important; color:var(--rc)!important; font-size:13px!important; }

.challenge-category-header { display:grid; grid-template-columns:78px minmax(0,1fr) 130px; gap:24px; align-items:center; margin-top:30px; padding:34px; border:0; border-radius:var(--radius-lg); background:linear-gradient(120deg,color-mix(in srgb,var(--cat-c) 8%,var(--surface)),var(--surface) 65%); }
.challenge-category-header .category-hero-icon { width:66px; height:66px; display:grid; place-items:center; color:var(--cat-c); border:1px solid color-mix(in srgb,var(--cat-c) 45%,transparent); border-radius:var(--radius-md); }
.challenge-category-header .category-hero-icon .ic-svg { width:32px; height:32px; }
.challenge-category-header h1 { margin:3px 0; font-size:38px; }
.challenge-category-header p { max-width:720px; color:var(--dim); font-size:15px; line-height:1.8; }
.category-count { margin:0!important; text-align:center; }
.category-count b { display:block; color:var(--cat-c)!important; font:600 29px Consolas,monospace!important; }
.category-count small { color:var(--dim)!important; font-size:16px!important; }
.category-count span { color:var(--dim)!important; font-size:13px!important; }
.challenge-tools { margin-top:24px; padding:22px 24px; border:0; border-radius:var(--radius-md); background:var(--surface-soft); }
.challenge-tools .room-bar { max-width:none!important; margin:10px 0 0!important; padding:0!important; border:0!important; background:transparent!important; }
.challenge-tools .room-bar>b,.challenge-tools .room-bar>.f-label { display:none!important; }
.filters.category-filters { max-width:none!important; margin:14px 0 0!important; padding:8px 0 0!important; border:0; }
.f-label { color:var(--dim)!important; font-size:14px!important; }
.chip { min-height:38px; padding:0 13px!important; border-radius:5px!important; font-size:14px!important; }
.chip.on { color:#ff9a9d!important; border-color:#68383b!important; background:#1a1011!important; }
.challenge-category-page .ch-grid { max-width:none!important; margin:18px 0 0!important; padding:0!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px!important; }
.ch-card { min-height:250px; display:flex; flex-direction:column; padding:23px!important; color:inherit; text-align:start; text-decoration:none; border-radius:var(--radius-md)!important; background:var(--surface)!important; font-family:inherit; }
.ch-card::before { width:3px!important; }
.ch-card:hover { transform:translateY(-3px); border-color:var(--border-strong)!important; background:var(--surface-raised)!important; }
.ch-card.solved { border-color:#4a4a4a!important; }
.solved-check { top:16px!important; inset-inline-end:16px!important; min-height:28px; display:flex; align-items:center; padding-inline:9px!important; color:#d8d8d8!important; border-color:#3a3a3a!important; border-radius:5px!important; background:#141414; font-size:13px!important; }
.ch-top { margin-bottom:22px!important; }
.ch-cat { font-size:14px!important; }
.ch-diff { min-height:28px; display:flex; align-items:center; padding-inline:9px!important; border-radius:5px!important; font-size:13px!important; }
.ch-title { font-size:20px!important; }
.ch-desc { color:var(--dim)!important; font-size:14px!important; line-height:1.8!important; }
.ch-foot { margin-top:auto!important; padding-top:22px; }
.ch-points,.ch-solves { font-size:13px!important; }

.modal:has(.challenge-modal-layout) { width:min(1080px,100%); padding:0; overflow:hidden; border-radius:var(--radius-lg); }
.modal:has(.challenge-modal-layout)>.modal-close { position:absolute; z-index:3; top:22px; inset-inline-end:24px; float:none; width:42px; height:42px; display:grid; place-items:center; color:var(--dim); border:1px solid var(--border); border-radius:var(--radius-sm); background:#121619; }
.challenge-modal-layout { --modal-pad:36px; }
.challenge-modal-header { padding:36px var(--modal-pad) 30px; border:0; background:linear-gradient(135deg,color-mix(in srgb,var(--cat-c) 7%,var(--surface)),var(--surface)); }
.challenge-modal-header .ch-meta { padding-inline-end:55px; }
.challenge-modal-header .status-label[style] { color:var(--diff-c); border:1px solid color-mix(in srgb,var(--diff-c) 55%,transparent); background:color-mix(in srgb,var(--diff-c) 8%,#101316); }
.challenge-modal-header h3 { margin:24px 0 8px!important; font-size:34px!important; }
.challenge-modal-header p { max-width:760px; color:var(--text-soft); font-size:16px; line-height:1.85; }
.challenge-modal-grid { display:grid; grid-template-columns:minmax(0,1fr) 350px; }
.challenge-brief { padding:32px var(--modal-pad); }
.challenge-brief section+section { margin-top:38px; padding-top:4px; }
.challenge-brief h4 { margin-top:8px; font-size:19px; line-height:1.65; }
.challenge-brief section>p { margin-top:9px; color:var(--dim); font-size:14px; line-height:1.85; }
.challenge-brief ul { display:grid; gap:10px; margin:17px 0 0; padding:0; list-style:none; }
.challenge-brief li { color:var(--text-soft); font-size:14px; }
.challenge-brief li::before { content:'✓'; margin-inline-end:9px; color:var(--success); }
.challenge-actions { display:flex; flex-wrap:wrap; gap:9px; margin-top:14px; }
.resource-button { min-height:44px; display:inline-flex; align-items:center; padding:0 14px; color:var(--text); text-decoration:none; border:1px solid var(--border-strong); border-radius:var(--radius-sm); background:#161a1e; cursor:pointer; font-size:14px; }
.resource-button:hover { border-color:#5b646a; background:#1b2024; }
.challenge-submit-panel { padding:32px 28px; border:0; background:#0c0f11; }
.challenge-rewards { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-bottom:30px; }
.challenge-rewards span { min-height:70px; display:flex; flex-direction:column; justify-content:center; padding:10px; color:var(--dim); border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); font-size:12px; text-align:center; }
.challenge-rewards b { display:block; color:var(--text); font:600 18px Consolas,monospace; }
.challenge-submit-panel>label { display:block; font-size:16px; font-weight:600; }
.challenge-submit-panel>p { margin-top:3px; color:var(--dim); font-size:13px; }
.challenge-submit-panel .flag-row { display:grid; grid-template-columns:1fr; margin-top:15px; }
.challenge-submit-panel .flag-row input { min-height:48px; border-radius:var(--radius-sm); font-size:14px; }
.challenge-submit-panel .flag-row .btn { width:100%; }
.challenge-hint { margin-top:28px; padding-top:4px; }
.hint-toggle { color:var(--amber)!important; font-size:14px!important; }
.hint-box { font-size:14px!important; }
.completed-notice { margin-top:24px; padding:14px; color:#b8b8b8; border:1px solid #484848; border-radius:var(--radius-sm); background:#141414; font-size:13px; line-height:1.7; }
.first-solve-note { display:flex; justify-content:space-between; gap:14px; margin-top:20px; color:var(--dim); font-size:13px; }
.first-solve-note b { color:var(--text-soft); }
.challenge-lab-mount { grid-column:1/-1; margin-top:28px; }
.challenge-lab-mount .desktop-lab { min-height:620px; }

/* Full challenge workspace */
.challenge-workspace-page { --workspace-accent:var(--cat-c,var(--amber)); }
.challenge-workspace-header { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:48px; align-items:end; margin-top:28px; padding:38px 40px; border-radius:var(--radius-lg); background:linear-gradient(130deg,color-mix(in srgb,var(--workspace-accent) 8%,var(--surface)),var(--surface) 64%); }
.challenge-workspace-title { display:grid; grid-template-columns:64px minmax(0,1fr); gap:22px; align-items:start; }
.workspace-category-icon { width:62px; height:62px; display:grid; place-items:center; color:var(--workspace-accent); border-radius:var(--radius-md); background:color-mix(in srgb,var(--workspace-accent) 10%,#111416); }
.workspace-category-icon .ic-svg { width:31px; height:31px; }
.challenge-workspace-meta { display:flex; flex-wrap:wrap; gap:8px; color:var(--dim); font-size:15px; font-weight:700; }
.challenge-workspace-meta span { color:#5e6469; }
.challenge-workspace-title h1 { margin:5px 0 9px; font-size:clamp(38px,5vw,58px); line-height:1.2; font-weight:800; letter-spacing:-.035em; }
.challenge-workspace-title>div>p:last-child { max-width:760px; color:var(--text-soft); font-size:17px; line-height:1.8; }
.workspace-metrics { display:grid; grid-template-columns:repeat(3,minmax(72px,1fr)); gap:8px; min-width:270px; }
.workspace-metrics div { padding:13px 14px; border-radius:8px; background:#0b0d0f; }
.workspace-metrics dt { color:var(--dim); font-size:13px; }
.workspace-metrics dd { margin-top:2px; color:var(--text); font:400 20px 'Doppio One',Consolas,sans-serif; }
.challenge-workspace-grid { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:16px; margin-top:18px; align-items:start; }
.workspace-main { min-width:0; display:grid; gap:14px; }
.workspace-section { padding:31px 34px; border-radius:var(--radius-lg); background:var(--surface); }
.workspace-section h2 { margin:7px 0 13px; font-size:27px; font-weight:800; }
.workspace-section>p,.workspace-section li { color:var(--text-soft); font-size:16px; line-height:1.9; }
.workspace-section ul { display:grid; gap:9px; margin-top:16px; padding:0; list-style:none; }
.workspace-section li::before { content:'✓'; margin-inline-end:10px; color:var(--success); }
.workspace-section .challenge-actions { margin-top:18px; }
.challenge-submit-sticky { position:sticky; top:90px; border-radius:var(--radius-lg); }
.challenge-submit-sticky h2 { margin:7px 0 4px; font-size:26px; font-weight:800; }
.challenge-submit-sticky>p { font-size:15px; line-height:1.7; }
.challenge-submit-sticky .flag-row { gap:9px; }
.challenge-submit-sticky .flag-row input { width:100%; min-height:52px; padding-inline:14px; color:var(--text); border:1px solid var(--border-strong); border-radius:var(--radius-sm); outline:0; background:#07090a; font:15px Consolas,monospace; direction:ltr; }
.challenge-submit-sticky .flag-row input:focus { border-color:#8a4a4d; }
.workspace-lab-placeholder { min-height:230px; display:grid; place-items:center; padding:30px; border-radius:var(--radius-lg); background:#0b0e10; text-align:center; }
.workspace-lab-placeholder h3 { font-size:22px; }
.workspace-lab-placeholder p { margin-top:6px; color:var(--dim); font-size:15px; }

/* Skill profile */
.profile-identity { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:22px; align-items:center; padding-bottom:18px; }
.profile-avatar { width:92px!important; height:92px!important; border-radius:var(--radius-lg)!important; font-size:32px!important; }
.profile-avatar.small { width:60px!important; height:60px!important; font-size:21px!important; }
.profile-identity h1 { margin:3px 0 0; font-size:40px; font-weight:800; }
.profile-identity-copy>p { color:var(--dim); font-size:14px; }
.profile-bio { max-width:690px; margin-top:9px; color:var(--text-soft); font-size:15px; line-height:1.8; }
.profile-snapshot { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:20px; }
.profile-snapshot article { min-height:105px; padding:20px; border:0; border-radius:var(--radius-md); background:var(--surface); }
.profile-snapshot span { display:block; color:var(--dim); font-size:13px; }
.profile-snapshot b { display:block; margin-top:7px; font-size:17px; font-weight:600; }
.profile-section { margin-top:52px; }
.profile-section-heading { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:20px; }
.profile-section-heading h2 { margin-top:4px; font-size:28px; }
.profile-section-heading>p { max-width:430px; color:var(--dim); font-size:14px; }
.profile-section-heading.compact { margin-bottom:24px; }
.skill-matrix { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.skill-matrix article { min-height:190px; padding:23px; border:0; border-radius:var(--radius-md); background:linear-gradient(145deg,color-mix(in srgb,var(--skill-c) 6%,var(--surface)),var(--surface)); }
.skill-card-head { display:flex; justify-content:space-between; align-items:center; }
.skill-icon { width:42px; height:42px; display:grid; place-items:center; color:var(--skill-c); border:1px solid color-mix(in srgb,var(--skill-c) 40%,transparent); border-radius:var(--radius-sm); background:color-mix(in srgb,var(--skill-c) 8%,transparent); }
.skill-icon .ic-svg { width:22px; height:22px; }
.skill-card-head>span:last-child { color:var(--dim); font-size:13px; }
.skill-matrix h3 { margin:20px 0 13px; font-size:18px; }
.skill-matrix p { margin-top:8px; color:var(--dim); font-size:13px; }
.profile-detail-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; margin-top:52px; }
.profile-learning-card,.profile-rank-card { padding:26px; border:0; border-radius:var(--radius-lg); background:var(--surface); }
.profile-path-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; margin-top:7px; padding:17px 15px; color:inherit; text-decoration:none; border:0; border-radius:7px; background:var(--surface-soft); }
.profile-path-row b { display:block; font-size:16px; }
.profile-path-row span { color:var(--dim); font-size:13px; }
.profile-path-row strong { color:var(--amber); font:600 16px Consolas,monospace; }
.profile-path-row>.progress-line { grid-column:1/-1; }
.profile-level { display:flex; align-items:center; gap:17px; margin:20px 0; }
.profile-level>strong { width:68px; height:68px; display:grid; place-items:center; color:var(--amber-ink); border-radius:50%; background:var(--amber); font:700 28px Consolas,monospace; }
.profile-level span { color:var(--dim); font-size:13px; }
.profile-level b { display:block; font-size:17px; }
.profile-rank-card dl { margin-top:22px; }
.profile-rank-card dl div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; }
.profile-rank-card dt { color:var(--dim); font-size:13px; }
.profile-rank-card dd { font:600 14px Consolas,monospace; }
.profile-activity-list { border:0; border-radius:var(--radius-lg); overflow:visible; background:transparent; }
.profile-activity-row { display:grid; grid-template-columns:44px minmax(0,1fr) auto 70px; gap:14px; align-items:center; min-height:82px; margin-bottom:6px; padding:14px 20px; border:0; border-radius:7px; background:var(--surface-soft); }
.activity-icon { width:40px; height:40px; display:grid; place-items:center; color:var(--activity-c); border:1px solid color-mix(in srgb,var(--activity-c) 40%,transparent); border-radius:var(--radius-sm); }
.activity-icon .ic-svg { width:21px; height:21px; }
.profile-activity-row b { display:block; font-size:15px; }
.profile-activity-row div>span { color:var(--dim); font-size:13px; }
.profile-activity-row>strong { color:var(--amber); font:600 14px Consolas,monospace; text-align:end; }

/* Leaderboard */
.leaderboard-header { display:flex; align-items:end; justify-content:space-between; gap:50px; padding-bottom:16px; }
.score-legend { display:flex; gap:18px; color:var(--dim); font-size:13px; }
.podium { margin:44px auto 25px!important; }
.podium-card { min-height:220px; padding:26px!important; border:0!important; border-radius:var(--radius-lg)!important; background:var(--surface)!important; }
.podium-card.place-1 { background:linear-gradient(rgba(255,91,95,.055),var(--surface))!important; }
.podium-avatar { width:58px!important; height:58px!important; font-size:21px!important; }
.podium-rank { font-size:13px!important; }
.podium-card h3 { font-size:17px!important; }
.podium-card>span:not(.podium-rank),.podium-card>b { font-size:13px!important; }
.leaderboard-page .sb-table-wrap { max-width:100%!important; margin:0!important; padding:0!important; }
.sb-table { border-collapse:separate!important; border-spacing:0 7px!important; min-width:700px; }
.sb-table th { padding:13px 18px!important; color:var(--dim)!important; border:0; font-size:13px!important; }
.sb-row { background:transparent!important; }
.sb-row td { padding:17px 18px!important; border:0; background:var(--surface); }
.sb-row td:first-child { border-start-start-radius:8px; border-end-start-radius:8px; }
.sb-row td:last-child { border-start-end-radius:8px; border-end-end-radius:8px; }
.sb-user { font-size:15px!important; }
.me-tag { font-size:12px!important; border-radius:5px!important; }
.table-level { font-size:12px!important; }

@media (max-width:960px) {
  .rooms-grid.category-launcher,.challenge-category-page .ch-grid,.skill-matrix { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .challenge-modal-grid { grid-template-columns:1fr; }
  .challenge-submit-panel { border:0; }
  .challenge-workspace-header,.challenge-workspace-grid { grid-template-columns:1fr; }
  .workspace-metrics { min-width:0; }
  .challenge-submit-sticky { position:static; }
  .profile-snapshot { grid-template-columns:repeat(2,1fr); }
  .profile-detail-grid { grid-template-columns:1fr; }
}
@media (max-width:700px) {
  .practice-library-header,.challenge-category-header { grid-template-columns:1fr; gap:22px; }
  .practice-summary { width:100%; }
  .rooms-grid.category-launcher,.challenge-category-page .ch-grid,.skill-matrix { grid-template-columns:1fr!important; }
  .challenge-category-header { padding:24px; }
  .category-count { text-align:start; }
  .modal:has(.challenge-modal-layout) { max-height:calc(100vh - 30px); }
  .challenge-modal-layout { --modal-pad:20px; }
  .challenge-modal-header h3 { padding-inline-end:40px; font-size:28px!important; }
  .challenge-brief,.challenge-submit-panel { padding:25px 20px; }
  .challenge-workspace-header { padding:28px 23px; }
  .challenge-workspace-title { grid-template-columns:1fr; }
  .workspace-category-icon { width:52px; height:52px; }
  .workspace-section { padding:26px 22px; }
  .workspace-metrics { grid-template-columns:repeat(3,1fr); }
  .profile-identity { grid-template-columns:auto 1fr; }
  .profile-identity>.btn { grid-column:1/-1; width:100%; }
  .profile-avatar { width:72px!important; height:72px!important; }
  .profile-identity h1 { font-size:30px; }
  .profile-snapshot { grid-template-columns:1fr 1fr; }
  .profile-section-heading,.leaderboard-header { display:block; }
  .profile-section-heading>p,.score-legend { margin-top:10px; }
  .profile-activity-row { grid-template-columns:40px 1fr auto; }
  .profile-activity-row .status-label { display:none; }
}

/* Correct the mobile outline direction without relying on arithmetic in transforms. */
@media (max-width:900px) {
  html[dir="rtl"] .lesson-outline { transform:translateX(105%); }
  html[dir="ltr"] .lesson-outline { transform:translateX(-105%); }
  .lesson-outline.open { transform:none!important; }
}

/* Forms, authentication, administration and shared feedback */
.auth-wrap { min-height:calc(100svh - 72px)!important; padding:70px 24px!important; }
.auth-card { width:min(520px,100%)!important; padding:46px 44px!important; border-radius:var(--radius-lg)!important; background:var(--surface)!important; box-shadow:0 28px 90px rgba(0,0,0,.28); }
.auth-card .sub { margin:8px 0 0!important; color:var(--dim)!important; font-size:16px!important; }
.field { margin-bottom:18px!important; }
.field label { margin-bottom:8px!important; color:var(--text-soft)!important; font-size:15px!important; font-weight:700!important; }
.field input,.field select,.field textarea,.role-select {
  width:100%; min-height:50px; padding:10px 14px; color:var(--text); border:1px solid var(--border); border-radius:var(--radius-sm); outline:0; background:#090b0c; font-size:16px;
}
.field textarea { min-height:100px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus,.role-select:focus { border-color:#8a4a4d; }
.field small { color:var(--dim)!important; font-size:13px!important; }
.auth-alt { font-size:14px!important; }
.form-error { font-size:14px!important; }
.check-field { min-height:44px; display:flex; align-items:center; gap:9px; color:var(--text-soft); font-size:14px; }
.check-field input { width:18px; height:18px; accent-color:var(--amber); }
.modal-backdrop { padding:30px 18px!important; align-items:center!important; }
.modal { width:min(680px,100%); max-height:calc(100vh - 60px)!important; padding:30px; border-radius:var(--radius-lg)!important; background:var(--surface)!important; box-shadow:var(--shadow); }
.modal-close { width:40px; height:40px; color:var(--dim); }
.modal h3 { font-size:25px!important; }
.text-button { min-height:40px; font-size:14px!important; }
.toast { min-width:280px!important; padding:14px 18px!important; border-radius:var(--radius-sm)!important; font-size:14px!important; }

.page-head { max-width:1180px!important; padding-top:48px!important; }
.page-head h1 { font-size:40px!important; }
.page-head p { color:var(--dim)!important; font-size:15px!important; }
.hello-kicker,.eyebrow { display:block!important; color:var(--dim)!important; border:0!important; background:transparent!important; font-size:15px!important; font-weight:700!important; letter-spacing:0!important; text-transform:none!important; }
.panel { border-radius:var(--radius-md)!important; background:var(--surface)!important; }
.panel h3.panel-title { font-size:17px!important; }
.panel-heading>span { font-size:14px!important; }
.admin-grid { max-width:1180px!important; }
.admin-head { margin-bottom:22px!important; padding-bottom:0!important; border:0!important; }
.admin-summary { width:min(1180px,calc(100% - 48px)); margin:0 auto 16px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.admin-summary article { min-height:108px; padding:20px 22px; border-radius:var(--radius-md); background:var(--surface); }
.admin-summary b { display:block; color:var(--text); font:400 25px 'Doppio One',Consolas,sans-serif; }
.admin-summary span { display:block; margin-top:5px; color:var(--dim); font-size:14px; }
.admin-grid { gap:14px!important; }
.admin-grid .panel { padding:26px!important; border:0!important; box-shadow:none!important; }
.panel-heading { margin-bottom:18px!important; padding-bottom:0!important; border:0!important; }
.admin-table { border-collapse:separate!important; border-spacing:0 6px!important; }
.admin-table th { padding:10px 12px!important; color:var(--dim)!important; border:0!important; font-size:13px!important; font-weight:700!important; letter-spacing:0!important; text-transform:none!important; }
.admin-table td { padding:14px 12px!important; border:0!important; background:var(--surface-soft); font-size:14px!important; }
.admin-table td:first-child { border-start-start-radius:7px; border-end-start-radius:7px; }
.admin-table td:last-child { border-start-end-radius:7px; border-end-end-radius:7px; }
.row-sub { color:var(--dim)!important; font-size:12px!important; }
.row-actions button { min-height:38px; padding-inline:8px; font-size:14px!important; font-weight:700; }
.publish-state,.activity-status { min-height:28px; display:inline-flex; align-items:center; padding-inline:8px!important; border-radius:5px!important; font-size:12px!important; }
.admin-challenge small,.activity-row small { font-size:13px!important; }
.admin-challenge,.activity-row { padding:14px!important; border:0!important; background:var(--surface-soft)!important; }

@media (max-width:760px) {
  .admin-summary { width:calc(100% - 32px); grid-template-columns:1fr 1fr; }
}

@media (max-width:900px) {
  .burger { width:44px; height:44px; display:flex!important; align-items:center; justify-content:center; padding:0!important; }
  .nav-links { top:76px!important; padding:18px 22px 24px!important; gap:7px!important; background:rgba(9,11,13,.98)!important; }
  .nav-links>a { width:100%; justify-content:flex-start; }
  .nav-links .language-switch { width:100%; justify-content:center; }
  .user-area { width:100%; }
  .user-pill { flex:1; }
}
@media (max-width:560px) {
  .nav-inner { height:70px; padding-inline:16px; }
  .nav-links { top:70px!important; }
  .brand-text { font-size:17px; }
  .brand-mark { width:31px; height:31px; }
  .auth-wrap { padding:28px 16px!important; }
  .auth-card { padding:34px 24px!important; }
  .profile-snapshot { grid-template-columns:1fr; }
  .modal-backdrop { padding:12px!important; }
  .modal { max-height:calc(100vh - 24px)!important; padding:24px 18px; }
}

@media (max-width:700px) {
  body.is-authenticated { padding-bottom:68px; }
  body.is-authenticated .burger { display:none!important; }
  body.is-authenticated .nav-inner { height:64px; padding-inline:16px; }
  body.is-authenticated .nav-links { position:static!important; display:flex!important; width:auto; margin-inline-start:auto; padding:0!important; border:0!important; background:transparent!important; box-shadow:none!important; }
  body.is-authenticated .nav-links>a,body.is-authenticated .nav-links>.user-area { display:none!important; }
  body.is-authenticated .nav-links>.language-switch { display:inline-flex!important; width:auto; min-height:40px!important; }
  .mobile-dock { position:fixed; z-index:90; inset-inline:0; bottom:0; height:68px; display:grid; grid-template-columns:repeat(4,1fr); padding:0 max(8px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px,env(safe-area-inset-left)); border:0; background:rgba(9,10,11,.96); box-shadow:0 -12px 30px rgba(0,0,0,.22); backdrop-filter:blur(18px); }
  .mobile-dock .dock-link { position:relative; min-height:64px; display:flex!important; align-items:center; justify-content:center!important; padding:0 4px!important; color:#90969a!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; font-size:14px!important; font-weight:700!important; text-align:center; }
  .mobile-dock .dock-link.active { color:var(--text)!important; }
  .mobile-dock .dock-link.active::before { content:''; position:absolute; top:0; inset-inline:22%; height:2px; background:var(--amber); }
}

/* Calm content surfaces: hierarchy comes from spacing and type, not stacked grey cards. */
.learning-resume-card,
.weekly-card,
.level-card-compact,
.journey-preview,
.practice-card,
.path-library-card,
.path-progress-panel,
.path-information-grid article,
.roadmap-phase,
.practice-summary,
.challenge-category-header,
.challenge-tools,
.challenge-workspace-header,
.workspace-section,
.challenge-submit-panel,
.workspace-lab-placeholder,
.profile-snapshot article,
.skill-matrix article,
.profile-learning-card,
.profile-rank-card,
.profile-path-row,
.profile-activity-row,
.admin-summary article {
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}

.goal-ring::after { background:var(--bg); }
.journey-step::before { display:none; }
.journey-step>span { border-color:transparent; background:transparent; }
.journey-step.current>span { border-color:var(--amber); background:var(--amber); }

.path-library-card { gap:28px; overflow:visible; }
.path-card-aside,
.phase-rail,
.phase-rail span,
.phase-lessons li>a { background:transparent; }
.roadmap-phase.current,
.roadmap-phase.complete { border-color:transparent; box-shadow:none; }
.phase-lessons li>a:hover { background:rgba(255,255,255,.025); }

.category-launcher .room-card,
.ch-card {
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}
.category-launcher .room-card:hover,
.ch-card:hover {
  border-color:transparent!important;
  background:rgba(255,255,255,.025)!important;
}
.ch-card.solved { border-color:transparent!important; }
.workspace-metrics div,
.challenge-rewards span { border-color:transparent; background:transparent; }

.podium-card,
.podium-card.place-1,
.sb-row td,
.panel,
.admin-table td,
.admin-challenge,
.activity-row {
  border-color:transparent!important;
  background:transparent!important;
  box-shadow:none!important;
}

.profile-path-row:hover,
.profile-activity-row:hover,
.sb-row:hover td,
.admin-table tr:hover td,
.admin-challenge:hover,
.activity-row:hover { background:rgba(255,255,255,.025)!important; }

/* Authentication — minimal editorial composition inspired by the supplied references. */
body.is-auth-route { background:#050505; }
body.is-auth-route .nav {
  position:absolute;
  min-height:0;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
body.is-auth-route .nav-inner {
  position:relative;
  width:min(calc(100% - 48px),1024px);
  max-width:1024px;
  height:88px;
  margin:0 auto;
  padding:0;
  gap:30px;
}
body.is-auth-route .brand {
  position:absolute;
  top:50%;
  right:0;
  left:auto;
  display:inline-flex!important;
  transform:translateY(-50%);
}
body.is-auth-route .brand-text {
  font-size:24px;
  font-weight:800;
  line-height:.9;
  letter-spacing:-.035em;
}
body.is-auth-route .brand-text span {
  margin-top:8px;
  color:#909090;
  font-size:13px;
  font-weight:700;
}
body.is-auth-route .burger { display:none!important; }
body.is-auth-route .nav-links {
  position:absolute!important;
  top:50%!important;
  right:auto!important;
  left:0!important;
  width:auto!important;
  display:flex!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  transform:translateY(-50%);
}
.auth-utility {
  position:static;
  display:flex;
  align-items:center;
  gap:26px;
  direction:rtl;
}
.auth-contact-direct {
  color:#c8c8c8;
  font-size:18px;
  font-weight:700;
  white-space:nowrap;
}
.auth-language-direct {
  min-height:40px;
  display:inline-flex;
  align-items:center;
  padding:0;
  color:#fff;
  border:0;
  background:transparent;
  cursor:pointer;
  font-family:inherit;
  font-size:18px;
  font-weight:700;
}
.auth-language-direct:hover { color:#ff8588; }
.auth-language-direct span { display:none; }
.auth-language-direct b { font-size:18px; font-weight:700; }

body.is-auth-route .auth-wrap {
  min-height:100svh!important;
  place-items:start center;
  padding:112px 24px 90px!important;
  background:#050505!important;
}
body.is-auth-route .auth-wrap.auth-login { padding-top:198px!important; }
body.is-auth-route .auth-card {
  width:min(360px,100%)!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.is-auth-route .auth-heading { margin-bottom:32px; text-align:center; }
body.is-auth-route .auth-heading h1 {
  margin:0;
  font-size:clamp(38px,5vw,48px);
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.035em;
}
body.is-auth-route .auth-card .sub {
  margin:12px 0 0!important;
  color:#c2c2c2!important;
  font-size:16px!important;
  line-height:1.65;
  text-align:center;
}
body.is-auth-route #authForm {
  width:min(264px,100%);
  display:grid;
  justify-self:center;
  margin-inline:auto;
}
body.is-auth-route .auth-card .field { margin-bottom:19px!important; }
body.is-auth-route .auth-card .field label {
  margin-bottom:8px!important;
  color:#efefef!important;
  font-size:14px!important;
  font-weight:600!important;
}
body.lang-en.is-auth-route .auth-card .field label {
  font-family:'Doppio One','Segoe UI',sans-serif;
  font-size:12px!important;
  font-weight:400!important;
  letter-spacing:.14em;
  text-transform:uppercase;
}
body.is-auth-route .auth-card .field input {
  min-height:52px;
  padding:0 15px;
  color:#fff;
  border:1px solid #666;
  border-radius:0;
  background:transparent;
  font-size:16px;
  box-shadow:none;
}
body.is-auth-route .auth-card .field input:hover { border-color:#8a8a8a; }
body.is-auth-route .auth-card .field input:focus {
  border-color:var(--amber);
  box-shadow:0 0 0 1px var(--amber);
}
body.is-auth-route .auth-submit {
  width:172px;
  min-height:48px;
  justify-self:center;
  margin-top:9px!important;
  color:#050505;
  border-color:#fff;
  border-radius:0;
  background:#fff;
  font-size:16px;
  font-weight:800;
}
body.is-auth-route .auth-submit:hover {
  color:#050505;
  border-color:#ff777a;
  background:#ff777a;
  transform:translateY(-2px);
}
body.is-auth-route .auth-alt {
  margin-top:24px;
  color:#bcbcbc;
  font-size:15px;
}
body.is-auth-route .auth-alt a { color:#fff; text-decoration:underline; text-underline-offset:4px; }
body.is-auth-route .auth-alt a:hover { color:#ff8588; }
body.is-auth-route .form-error { margin-bottom:22px; border-radius:0; }

@media (max-width:560px) {
  body.is-auth-route .nav-inner { width:calc(100% - 32px); height:78px; }
  body.is-auth-route .brand-text { font-size:21px; }
  body.is-auth-route .brand-text span { font-size:12px; }
  .auth-utility { gap:17px; }
  .auth-contact-direct,.auth-language-direct,.auth-language-direct b { font-size:14px; }
  body.is-auth-route .auth-wrap { padding:108px 20px 72px!important; }
  body.is-auth-route .auth-wrap.auth-login { padding-top:154px!important; }
  body.is-auth-route .auth-heading h1 { font-size:36px; }
}

/* One visual language across landing, authentication, and the product. */
.brand-text { font-size:24px; }
.brand-text span { color:#909090; font-size:13px; }
.btn { border-radius:8px; }
.context-label,.hello-kicker,.eyebrow { color:#8d8d8d!important; }
.dashboard-welcome h1,
.learning-resume-card h2,
.practice-library-header h1,
.leaderboard-header h1 { font-weight:700; }

/* Practice domains stay adjacent, compact, and equal-sized. */
.rooms-grid.category-launcher {
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:18px!important;
}
.category-launcher .room-card {
  min-width:0;
  min-height:238px!important;
  height:100%;
  padding:22px 18px!important;
  border-radius:0!important;
}
.category-launcher .room-card::after { display:none; }
.category-launcher .room-card:hover { transform:translateY(-3px); }
.room-card-head {
  width:100%;
  justify-content:flex-start;
  margin-bottom:20px;
}
.category-launcher .room-card .room-index { display:none; }
.category-launcher .room-card .room-icon {
  width:52px;
  height:52px;
  flex:0 0 52px;
  margin:0;
  border-radius:10px;
}
.category-launcher .room-card .room-icon .ic-svg { width:27px; height:27px; }
.category-launcher .room-card>b { font-size:19px!important; }
.category-launcher .room-card>p {
  min-height:68px;
  margin-top:8px;
  font-size:14px;
  line-height:1.75;
}
.category-launcher .room-card-foot {
  align-items:flex-start;
  flex-direction:column;
  gap:5px;
  margin-top:auto;
  padding-top:18px;
  border:0!important;
}

@media (max-width:1120px) {
  .rooms-grid.category-launcher { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
}
@media (max-width:700px) {
  .rooms-grid.category-launcher { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; }
  .category-launcher .room-card { min-height:210px!important; padding:18px 16px!important; }
  .category-launcher .room-card>p { min-height:58px; }
}
@media (max-width:430px) {
  .rooms-grid.category-launcher { gap:9px!important; }
  .category-launcher .room-card { min-height:170px!important; padding:16px 13px!important; }
  .category-launcher .room-card .room-icon { width:46px; height:46px; flex-basis:46px; }
  .category-launcher .room-card>b { font-size:16px!important; }
  .category-launcher .room-card>p,
  .category-launcher .room-card-foot em { display:none; }
  .category-launcher .room-card-foot { padding-top:13px; }
  .category-launcher .room-card-foot span { font-size:12px!important; }
}