/* NXTGEN product-family skin. Reference: nxtgen-app AGENTS.md (Flow Deck),
   athlete app-theme.css and index.css at 980b15fa. Brand yellow stays #FFC813.
   Layout and learning semantics remain in the existing views. */
:root {
  color-scheme: dark;
  --nxt-base: #080b0f;
  --nxt-surface: #0e1217;
  --nxt-raised: #141920;
  --nxt-selected: #1b2129;
  --nxt-text: #f4f2ec;
  --nxt-muted: #a9b1bb;
  --nxt-line: rgba(244,242,236,.12);
  --nxt-yellow: #ffc813;
  --nxt-positive: #49cf83;
  --nxt-negative: #ee6672;
  --nxt-safe-bottom: env(safe-area-inset-bottom,0px);
  background: var(--nxt-base);
  color: var(--nxt-text);
  font-family: Poppins,system-ui,sans-serif;
}
html { scroll-padding-top: 90px; -webkit-text-size-adjust:100%; }
body,.shell { background:var(--nxt-base); color:var(--nxt-text); }
body { line-height:1.6; -webkit-tap-highlight-color:transparent; }
header { height:76px; background:var(--nxt-base); border-color:var(--nxt-line); }
.brand { gap:10px; }
.brand small { color:var(--nxt-muted); font-size:10px; }
.brand strong span,.eyebrow { color:var(--nxt-yellow); }
.brand img { width:40px; height:40px; }
main { max-width:1100px; padding:28px 32px 48px; }
h1,h2,h3,p { overflow-wrap:break-word; }
h1,h2,h3 { color:var(--nxt-text); line-height:1.3; letter-spacing:-.025em; }
h1 { font-size:28px; margin:0 0 16px; }
h2 { font-size:22px; }
h3 { font-size:18px; }
p { margin:12px 0; }
.eyebrow { font-size:11px; letter-spacing:.12em; }
.hero { padding:24px 0; border:0; border-radius:0; background:none; }
.hero h1 { font-size:clamp(25px,3.5vw,36px); line-height:1.2; margin:10px 0; }
.hero p { color:var(--nxt-muted); line-height:1.65; margin-bottom:0; }
.section-title { margin:28px 0 14px; }
.section-title h2 { font-size:22px; }
.panel,.card,.question,fieldset.skill-card { background:var(--nxt-surface); border-color:var(--nxt-line); border-radius:16px; }
.panel,.card { padding:22px; }
.card:hover { border-color:rgba(244,242,236,.22); }
.card p,.muted,.item small,.label,.gap,details.other-options p,.exercise-bar,.breadcrumbs,ul.missing,ul.milestones { color:var(--nxt-muted); }
.today-head { padding:24px; border:0; border-block:1px solid var(--nxt-line); border-radius:0; background:var(--nxt-surface); }
.today-head h1 { font-size:28px; margin:0 0 12px; }
.today-head .next-step { max-width:65ch; margin:0 0 20px; font-size:15px; color:var(--nxt-muted); }
.today-head .next-step strong { color:var(--nxt-text); font-weight:600; }
.today-head > .btn { min-width:190px; }
.btn { min-height:48px; padding:11px 18px; border-radius:12px; border-color:var(--nxt-yellow); background:var(--nxt-yellow); color:var(--nxt-base); font-size:14px; font-weight:600; touch-action:manipulation; transition:background .12s,border-color .12s,transform .12s; }
.btn:hover { background:#ffd769; }
.btn:active { transform:scale(.98); }
.btn:disabled { transform:none; pointer-events:none; }
.btn.secondary,.admin-tabs button { background:var(--nxt-raised); border-color:var(--nxt-line); color:var(--nxt-text); }
.btn.secondary:hover,.admin-tabs button:hover { background:var(--nxt-selected); border-color:rgba(244,242,236,.25); }
.btn.small { min-height:44px; font-size:12px; }
.btn.danger { background:rgba(238,102,114,.1); border-color:rgba(238,102,114,.45); color:#ffb5bd; }
.btn.secondary.picked,.admin-tabs button.active { border-color:var(--nxt-yellow); color:var(--nxt-yellow); }
:where(a,button,input,select,textarea,summary):focus-visible { outline:2px solid var(--nxt-yellow); outline-offset:4px; }
.field { background:var(--nxt-base); color:var(--nxt-text); border-color:rgba(244,242,236,.22); border-radius:10px; min-height:48px; }
.field:focus { border-color:var(--nxt-yellow); box-shadow:0 0 0 2px rgba(255,200,19,.15); }
.chip { border-color:var(--nxt-line); color:var(--nxt-muted); font-size:11px; }
.chip.gold { border-color:rgba(255,200,19,.35); color:var(--nxt-yellow); }
.chip.warn { border-color:rgba(255,200,19,.4); color:var(--nxt-yellow); }
.notice,.notice.synthetic,.notice.demo-flag { border-color:var(--nxt-line); background:var(--nxt-surface); color:var(--nxt-muted); }
.notice.demo-flag,.notice.synthetic { font-size:13px; line-height:1.6; padding:12px 16px; margin-bottom:16px; border-color:rgba(255,200,19,.25); background:rgba(255,200,19,.035); }
.notice.demo-flag p,.notice.synthetic p { margin:0 0 8px; }
.demo-details summary { cursor:pointer; color:var(--nxt-muted); min-height:28px; }
.demo-details[open] p { margin-top:10px; }
.error { background:rgba(238,102,114,.09); border-color:rgba(238,102,114,.4); color:#ffb5bd; }
.success { background:rgba(73,207,131,.08); border-color:rgba(73,207,131,.4); color:#a8efc5; }
.readiness { border-left-width:3px; border-left-color:var(--nxt-muted); }
.readiness-on_track { border-left-color:var(--nxt-positive); }
.readiness-building,.readiness-gap { border-left-color:var(--nxt-yellow); }
.readiness-unknown { border-left-color:var(--nxt-line); }
.competency.status-weak { border-color:rgba(255,200,19,.35); }
.competency.status-solid { border-color:rgba(73,207,131,.3); }
dl.metrics dt { color:var(--nxt-muted); }
.result-score,.timer { color:var(--nxt-yellow); font-variant-numeric:tabular-nums; }
.progress-meter,.progress { background:var(--nxt-selected); accent-color:var(--nxt-yellow); }
.progress-meter::-webkit-progress-bar { background:var(--nxt-selected); }
.progress-meter::-webkit-progress-value,.progress>span { background:var(--nxt-yellow); }
.progress-meter::-moz-progress-bar { background:var(--nxt-yellow); }
.item,.coverage,.matching-row,.choice { border-color:var(--nxt-line); }
details.other-options { background:transparent; border-color:var(--nxt-line); border-radius:12px; padding:10px 16px; }
details.other-options summary { min-height:28px; color:var(--nxt-text); font-size:13px; font-weight:500; }
.more-area { max-width:100%; }
.answer-tile,ol.ordering li,.solution-path,.matrix-grid,fieldset.field-set { background:var(--nxt-raised); border-color:var(--nxt-line); border-radius:12px; }
.answer-tile { min-height:60px; }
.answer-tile:hover { border-color:rgba(244,242,236,.3); }
.answer-tile.picked { background:rgba(255,200,19,.06); border-color:var(--nxt-yellow); }
.answer-tile:focus-within { outline:2px solid var(--nxt-yellow); outline-offset:3px; }
.answer-tile:not(.picked):focus-within { background:var(--nxt-raised); border-color:var(--nxt-line); }
.answer-tile input,.choice input,.switch input { accent-color:var(--nxt-yellow); }
.exercise-bar { margin:16px 0; }
.question.exercise .prompt { font-size:22px; }
.feedback { border-left-color:var(--nxt-line); }
.feedback.right { border-left-color:var(--nxt-positive); }
.feedback.wrong { border-left-color:var(--nxt-negative); }
.matrix-cell { border-color:var(--nxt-line); color:var(--nxt-text); }
.matrix-cell.open { border-color:var(--nxt-yellow); color:var(--nxt-yellow); }
.memory-stimulus { background:var(--nxt-raised); border-color:rgba(255,200,19,.3); color:var(--nxt-yellow); }
.audio-player { background:var(--nxt-base); accent-color:var(--nxt-yellow); }
.audio-player.failed { outline-color:var(--nxt-negative); }
.topo-footer { display:none; }
.nav { gap:4px; flex-wrap:nowrap; }
.nav a { min-height:44px; display:flex; align-items:center; justify-content:center; gap:8px; border-radius:12px; color:var(--nxt-muted); }
.nav a svg { width:20px; height:20px; flex:0 0 auto; }
.nav a:hover,.nav .active { background:var(--nxt-selected); color:var(--nxt-yellow); }
.nav a.active { color:var(--nxt-yellow); }
@media(max-width:760px) {
  html { scroll-padding-top:80px; scroll-padding-bottom:100px; }
  header { height:auto; min-height:68px; flex-direction:row; align-items:center; padding:12px max(16px,env(safe-area-inset-right,0px)) 12px max(16px,env(safe-area-inset-left,0px)); padding-top:calc(12px + env(safe-area-inset-top,0px)); }
  .brand img { width:36px; height:36px; }
  .brand strong { font-size:18px; }
  main { padding:18px max(16px,env(safe-area-inset-right,0px)) calc(112px + var(--nxt-safe-bottom)) max(16px,env(safe-area-inset-left,0px)); }
  .nav { position:fixed; bottom:calc(12px + var(--nxt-safe-bottom)); left:max(12px,env(safe-area-inset-left,0px)); right:max(12px,env(safe-area-inset-right,0px)); width:auto; max-width:520px; margin:0 auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:6px; gap:4px; border:1px solid var(--nxt-line); border-radius:20px; background:rgba(14,18,23,.98); box-shadow:0 12px 36px rgba(0,0,0,.4); overflow:visible; z-index:50; }
  .nav>a { min-height:56px; min-width:0; padding:6px 4px; flex-direction:column; gap:3px; font-size:11px; line-height:1.4; }
  .nav>.chip { display:none; }
  .nav a.active { color:var(--nxt-yellow); background:var(--nxt-selected); }
  .hero { padding:16px 0; }
  .hero h1 { font-size:26px; }
  .hero p { font-size:14px; }
  .panel,.card,.question.exercise { padding:18px; }
  .today-head { padding:22px 18px; }
  .today-head>.btn { width:100%; }
  .today-head .next-step { font-size:14px; }
  .today-head h1 { font-size:26px; }
  input:not([type=checkbox]):not([type=radio]),textarea,select { font-size:16px; }
  .question.exercise .prompt { font-size:20px; }
  .form-actions { gap:10px; }
  .confidence { font-size:13px; }
  .recall-row input { min-width:0; }
  .matching-row>* { min-width:0; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; }
}