/* Semantic v3 tokens and controls. Legacy styles remain scoped to retained fallback views. */
:root{--font-product:'Nunito',ui-rounded,system-ui,sans-serif;--weight-body:500;--weight-emphasis:600;--weight-action:700;--weight-heading:800;--text-body:17px;--text-support:15px;--text-action:17px;--text-title:28px;--ink-primary:#29213e;--ink-secondary:#655672;--source-light:#8752e8;--source-dark:#6232cb;--target-light:#f0fff7;--target-base:#cceadd;--target-ink:#285949;--target-fill:#367762;--focus:#382057;--duration-press:100ms;--duration-release:160ms;--duration-sheet:180ms;--ease-soft:cubic-bezier(.2,.75,.2,1);--surface:#fcfaf7;--line-subtle:#ddd4e5}
body.v3,body.v3 :is(button,input,select,textarea,dialog,a,summary){font-family:var(--font-product);font-weight:var(--weight-body);font-synthesis:none}
body.v3{font-size:var(--text-body);color:var(--ink-primary);line-height:1.45}
body.v3 :is(button,[role='button']){font-size:var(--text-action);font-weight:var(--weight-action);min-height:44px;touch-action:manipulation;transition:background-color var(--duration-release),box-shadow var(--duration-release),border-color var(--duration-release);-webkit-tap-highlight-color:transparent;cursor:pointer}
body.v3 :is(button,[role='button']):disabled{cursor:default;opacity:.5}
body.v3 :is(button,a,summary,input):focus-visible{outline:3px solid var(--focus);outline-offset:3px}
body.v3 :is(button,[role='button']):active:not(:disabled){box-shadow:inset 0 2px 5px #3b225627!important;filter:brightness(.98)}
@media(hover:hover)and(pointer:fine){body.v3 :is(button,[role='button']):hover:not(:disabled){border-color:#b7a0d7;background-color:#fff}}
body.v3 :is(h1,h2,h3,h4){font-family:var(--font-product);font-weight:var(--weight-heading);letter-spacing:-.025em;line-height:1.18}
body.v3 .v2-home h1{font-weight:800;font-size:clamp(40px,5vw,64px);line-height:1.08;letter-spacing:-.035em}
body.v3 .v2-home h1 span{color:var(--source-dark)}
body.v3 :is(.v2-home-actions button,.v2-setting-title,.v22-rank-name,.v22-rank-metric,.v22-rank-number){font-weight:700}
body.v3 :is(.v2-intro,#dialog-body,#learning-dialog p){font-weight:500;color:var(--ink-secondary)}
body.v3 :is(.v2-dialog-head h2,#learning-dialog h2,#learning-dialog h3,#a11y-title){font-weight:800;font-size:var(--text-title)}
body.v3 :is(#a11y-count,.v24-amount,.v24-value,.v24-goal,.v2-demo-tile,.v22-rank-number,.v22-rank-metric,.v2-calendar-day){font-variant-numeric:tabular-nums;letter-spacing:0}
body.v3 .v24-value{font-weight:800}body.v3 .v24-goal{font-weight:700}
body.v3 :is(.v2-setting-detail,.v24-note,.v24-role,.v2-footer,.v22-rank-note){font-weight:500}
body.v3 .v2-primary{background:linear-gradient(135deg,var(--source-light),var(--source-dark))!important}
body.v3 :is(.v2-home-actions button,.v2-nav button):hover,body.v3 :is(.v2-home-actions button,.v2-nav button):active{transform:none}
body.v3 .v2-header{min-height:66px}body.v3 .v2-shell{max-width:1160px;padding-bottom:max(20px,env(safe-area-inset-bottom))}
body.v3 .v2-nav svg{width:21px;height:21px;stroke-linejoin:round}
body.v3 .v2-home{padding:36px 22px;min-height:490px;gap:36px}
body.v3 .v2-eyebrow{font-size:12px;letter-spacing:.08em;font-weight:700;margin-bottom:18px}
body.v3 .v2-intro{font-size:17px;line-height:1.45;margin-bottom:24px}
body.v3 .v2-smallprint{font-size:14px;margin-top:18px}
body.v3 .v2-home-actions{gap:10px;max-width:390px}
body.v3 .v2-home-actions button{font-size:16px;font-weight:700}
body.v3 .v2-home-actions .v2-text-button{color:var(--ink-secondary);font-size:15px}
body.v3 .v2-footer{display:none}
.v3-main-nav{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px auto 4px;padding:6px;border:1px solid #fff;border-radius:22px;background:#ffffffb3;box-shadow:0 6px 25px #4a31500b;max-width:520px;width:100%}
.v3-main-nav button{flex:1;border:0;border-radius:16px;background:transparent;color:var(--ink-secondary);padding:10px 8px;min-width:0;display:flex;align-items:center;justify-content:center;gap:7px}
.v3-main-nav button[aria-current='page']{background:#eee6fb;color:#5630b3}
.v3-main-nav svg,.v3-row svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
body.v3[data-v2-screen='game'] .v3-main-nav{display:none}
.v3-saved-title{font-size:14px;color:var(--ink-secondary);margin:0 0 4px;text-align:center}
body.v3[data-v3-returning='true'] .v2-home{min-height:390px}body.v3[data-v3-returning='true'] .v2-home h1{font-size:clamp(34px,4vw,48px)}
body.v3 #accessible-game{margin:18px auto 22px}
body.v3 #a11y-playing{gap:34px;grid-template-columns:minmax(220px,300px) minmax(0,600px)}
body.v3 .v2-play-info{padding:0 8px 18px}
body.v3 #a11y-count{font-size:14px;margin:12px 0 18px;font-weight:600}
body.v3 #a11y-message{font-size:18px;line-height:1.4;min-height:2.8em;font-weight:600}
body.v3 :is(#v2-step,#a11y-collected,#a11y-context){display:none}
body.v3 #a11y-save{font-size:14px!important;color:var(--ink-secondary);min-height:20px;margin:12px 0 0}
body.v3 .controls{gap:8px;margin-top:16px}
body.v3 .controls button{font-size:16px;min-height:46px;padding:10px 17px;font-weight:700;min-width:94px}
body.v3 #a11y-cancel{font-size:14px;min-width:78px;padding:8px 12px}
.v3-context-bar{min-height:46px;display:flex;align-items:center;gap:10px;margin-top:4px}
.v3-context-bar #a11y-cancel{margin-left:auto;border:1px solid var(--line-subtle);background:#fff9;border-radius:14px;color:var(--ink-secondary)}
.v3-context-bar #a11y-cancel[hidden]{display:inline-flex!important;visibility:hidden;pointer-events:none}
.v3-save-actions{display:flex;gap:8px;justify-content:center;margin-top:8px}.v3-save-actions button{border:1px solid #c7adcf;border-radius:14px;background:#fff;padding:8px 14px;color:#633f6b}
body.v3 dialog.v2-dialog{font-family:var(--font-product);font-size:16px;font-weight:500;line-height:1.45}
body.v3 .v2-dialog-head{padding:16px 18px 14px 22px}body.v3 .v2-dialog-content{padding:16px 22px 20px}
body.v3 #dialog-body{font-size:16px;line-height:1.45;margin-bottom:14px}
body.v3 #dialog-actions button,body.v3 .v2-dialog-foot button{font-size:16px;font-weight:700;min-height:46px;padding:11px 14px}
body.v3 #a11y-dialog[data-kind='menu'] #dialog-actions{display:flex;flex-direction:column;gap:5px}
body.v3 #a11y-dialog[data-kind='menu'] #dialog-actions>button:not(.v2-primary){background:none;border:0;border-radius:12px;text-align:left;padding-left:12px;box-shadow:none}
body.v3 #a11y-dialog[data-kind='menu'] .v23-menu-explore{border-top:1px solid var(--line-subtle);padding-top:12px;margin-top:8px}
body.v3 #a11y-dialog[data-kind='menu'] .v23-menu-shortcuts{display:none}
body.v3 #a11y-dialog[data-kind='menu'] .v23-menu-explore>h3{display:none}
body.v3 .v3-menu-library{width:100%;text-align:left;background:#f6f2fb;border:1px solid var(--line-subtle);border-radius:14px;padding:11px 14px}
body.v3 .v23-undo-solved{font-size:14px}
body.v3 #a11y-dialog[data-kind='settings'] .v2-setting-title{font-size:16px;font-weight:700}
body.v3 .v2-setting-detail{font-size:14px;line-height:1.35}
body.v3 .v2-group{font-size:13px;font-weight:700;letter-spacing:.05em;padding:14px 0 6px}
body.v3 #a11y-dialog[data-kind='settings'] #dialog-actions>button:not(.v2-setting){font-size:14px}
.v3-utility-link{border:0;background:none;color:var(--ink-secondary);padding:8px 12px;text-align:center}
#v3-hub[open]{display:flex;flex-direction:column;width:min(540px,calc(100vw - 24px));max-height:calc(var(--v21-visible-height,100dvh) - 28px);overflow:hidden;padding:0}
#v3-hub .v2-dialog-content{overflow:auto;min-height:0}
.v3-hub-actions{display:grid;gap:12px}.v3-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;border:1px solid var(--line-subtle);border-radius:18px;background:#ffffffb3;color:var(--ink-primary);padding:14px 16px;text-align:left;min-height:56px}
.v3-row-words{display:flex;flex-direction:column;gap:3px}.v3-row-words small{font-size:14px;font-weight:500;color:var(--ink-secondary)}
.v3-hub-note{font-size:14px;color:var(--ink-secondary);line-height:1.45;margin:0 0 16px}
.v3-progress-counts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 18px}.v3-stat{padding:16px;border:1px solid var(--line-subtle);border-radius:18px;background:#fff9}.v3-stat strong{display:block;font-size:30px;font-weight:800;line-height:1.15;font-variant-numeric:tabular-nums}.v3-stat span{font-size:14px;color:var(--ink-secondary)}
.v3-progress-list{list-style:none;margin:0 0 16px;padding:0}.v3-progress-list li{border-bottom:1px solid var(--line-subtle);padding:12px 0;display:flex;justify-content:space-between;gap:12px;font-size:15px}.v3-progress-list strong{font-weight:700;font-variant-numeric:tabular-nums}.v3-progress-list small{display:block;color:var(--ink-secondary);font-size:13px}
.v3-diagnostics{white-space:pre-wrap;overflow-wrap:anywhere;font:14px/1.45 var(--font-product);background:#f4eff8;border-radius:14px;padding:14px}
.v3-coach{border:1px solid #cfbceb;border-radius:18px;background:#faf6ff;padding:14px 16px;margin:12px 0;max-width:600px}.v3-coach h3{font-size:18px;margin:0 0 5px}.v3-coach p{font-size:15px;margin:0 0 10px;color:var(--ink-secondary)}.v3-coach-actions{display:flex;gap:8px;flex-wrap:wrap}.v3-coach button{background:#fff;border:1px solid #d9cde7;border-radius:12px;padding:8px 12px;min-height:44px;font-size:14px}.v3-coach small{display:block;font-size:13px;color:#735597;margin-bottom:6px}.v3-coach-choice .v24-face{outline:3px solid #5c3aa9;outline-offset:2px}
body.v3 #learning-dialog p{font-size:16px;line-height:1.45}body.v3 #learning-notice{font-size:14px!important}body.v3 #learning-dialog button{font-size:16px;font-weight:700}body.v3 #learning-progress{font-size:13px;letter-spacing:.04em}
body.v3 .v3-solid :is(.v3-row){background:#fff}
body.v3.v3-solid :is(.v2-glass,.v2-dialog,#learning-dialog,.v3-main-nav){background:#fdfbff!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}body.v3.v3-solid :is(.v24-face,.v3-row){border-color:#977faa}
body.v3.v3-solid :is(dialog)::backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#24172e88}
body.v3.v2-still *,body.v3.v2-still *::before,body.v3.v2-still *::after{transition:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){body.v3 *,body.v3 *::before,body.v3 *::after{transition:none!important;animation:none!important}}
@media(max-width:700px){body.v3 .v2-shell{padding:12px 14px max(16px,env(safe-area-inset-bottom))}body.v3 .v2-header{min-height:60px;gap:8px}body.v3 .v2-brand img{width:154px}body.v3 .v2-nav{gap:0;padding:3px}body.v3 .v2-nav button{width:44px;padding:9px}body.v3 .v2-home{padding:28px 12px 20px;min-height:0;gap:0}body.v3 .v2-home h1{font-size:clamp(38px,10vw,48px);margin-bottom:18px}body.v3 .v2-home .v2-intro{font-size:16px;margin-bottom:22px}body.v3 .v2-home .v2-eyebrow{font-size:12px;letter-spacing:.05em;margin-bottom:16px}body.v3 .v2-home .v2-smallprint{font-size:14px;margin:18px 0 0}body.v3 #a11y-playing{display:block!important}body.v3 #a11y-title{font-size:22px}body.v3 .v2-play-info{padding:0 4px 6px}body.v3 #a11y-count{margin:10px 0 10px;font-size:14px}body.v3 #a11y-message{font-size:16px;min-height:2.8em}body.v3 .v3-context-bar{min-height:44px;margin-top:-2px}body.v3 .controls{gap:7px}body.v3 .controls button{min-width:86px;font-size:15px;padding:10px 14px}body.v3 .v2-dialog-head{padding:14px 14px 12px 18px}body.v3 .v2-dialog-content{padding:14px 18px 18px}body.v3 :is(.v2-dialog-head h2,#learning-dialog h2,#learning-dialog h3){font-size:22px!important}body.v3 .v2-setting-detail{font-size:13px}.v3-main-nav{margin-top:12px;gap:2px}.v3-main-nav button{font-size:14px;flex-direction:column;gap:4px}.v3-main-nav svg{width:18px;height:18px}}
@media(max-width:350px){body.v3 .v2-brand img{width:132px}body.v3 .v2-header{gap:2px}body.v3 .v2-nav{padding:1px}body.v3 .v2-home{padding-left:4px;padding-right:4px}body.v3 .v2-home h1{font-size:38px}.v3-main-nav button{padding:8px 4px}}
@media(forced-colors:active){body.v3 :is(button,.v3-row,.v3-stat){border:1px solid ButtonText}body.v3 .v3-main-nav button[aria-current='page']{outline:2px solid Highlight}}

/* Bounded vector controls */
body.v3 button>svg,body.v3 .v2-close>svg{width:22px;height:22px;min-width:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.v3 .v2-daily>svg{width:24px;height:24px}
body.v3 .v3-nested-back{padding:6px;min-width:40px}


/* 3.2 dialog coherence: one row language, semantic settings groups, compact progress. */
body.v3 #a11y-dialog.v32-pause{width:min(520px,calc(100vw - 24px))}
body.v3 #a11y-dialog.v32-pause .v2-dialog-content{padding-top:14px}
body.v3 #a11y-dialog.v32-pause #dialog-actions{gap:8px}
body.v3 #a11y-dialog.v32-pause #dialog-actions>[data-action="dialog:Resume"]{min-height:52px;border-radius:15px;text-align:left;padding-inline:16px}
body.v3 #a11y-dialog.v32-pause .v32-menu-row{width:100%;min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px!important;border:1px solid var(--line-subtle)!important;border-radius:14px!important;background:#ffffffa8!important;color:var(--ink-primary)!important;box-shadow:none!important;text-align:left!important}
body.v3 #a11y-dialog.v32-pause .v32-menu-row:active{background:#f4eefb!important}
body.v3 #a11y-dialog.v32-pause .v32-menu-audio{background:#faf7fd!important}
.v32-menu-label{font-weight:700}.v32-menu-value{min-width:46px;padding:4px 10px;border-radius:999px;background:#eee6fb;color:#6538bd;font-size:13px;font-weight:700;text-align:center}
body.v3 #a11y-dialog.v32-pause .v23-menu-explore{border-top:0;margin-top:8px;padding-top:0;display:grid;gap:8px}
body.v3 #a11y-dialog.v32-pause .v23-menu-explore .v32-menu-row{margin:0}
body.v3 #a11y-dialog.v32-pause .v23-menu-explore .v23-undo-solved{margin-top:0}
body.v3 #a11y-dialog.v32-settings{width:min(540px,calc(100vw - 24px))}
body.v3 #a11y-dialog.v32-settings #dialog-body:empty{display:none}
body.v3 #a11y-dialog.v32-settings #dialog-actions{display:flex;flex-direction:column;gap:0}
body.v3 #a11y-dialog.v32-settings .v2-group{margin:0;padding:15px 0 7px;font-size:12px;letter-spacing:.08em;color:#705b83}
body.v3 #a11y-dialog.v32-settings .v2-setting{border-bottom:1px solid #e9e1ef;border-radius:0;padding:10px 2px;min-height:54px}
body.v3 #a11y-dialog.v32-settings .v32-settings-link{width:100%;min-height:48px;text-align:left;border:1px solid var(--line-subtle);border-radius:14px;background:#fff9;padding:11px 14px;margin-top:8px}
body.v3 #a11y-dialog.v32-settings .v2-dialog-foot{border-top:1px solid #ebe3f1;background:#fdfbfffa;box-shadow:0 -8px 20px #4c34500a}
body.v3 #a11y-dialog.v32-settings .v2-dialog-foot .v2-primary{border-radius:14px;min-height:50px}
#v3-hub.v32-progress .v2-dialog-content{padding-bottom:18px}
#v3-hub.v32-progress .v3-progress-counts{margin-bottom:10px}
#v3-hub.v32-progress .v3-stat{padding:14px 15px;border-radius:15px}
#v3-hub.v32-progress .v3-stat strong{font-size:28px}
#v3-hub.v32-progress .v3-hub-note{margin-bottom:12px}
#v3-hub.v32-progress .v3-progress-list{display:grid;gap:8px;margin-bottom:14px}
#v3-hub.v32-progress .v32-progress-row{border:1px solid var(--line-subtle);border-radius:14px;background:#fff9;padding:11px 12px;align-items:center}
.v32-progress-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.v32-progress-title{font-weight:700;overflow-wrap:anywhere}.v32-progress-status{align-self:flex-start;border-radius:999px;padding:2px 8px;background:#eee7f8;color:#715a86;font-size:12px!important}
.v32-progress-row[data-state="complete"] .v32-progress-status{background:#e7f4ed;color:#3f6f5c}.v32-progress-metric{white-space:nowrap;font-size:14px}
#v3-hub.v32-progress .v3-hub-actions{gap:8px}
#v3-hub.v32-progress .v3-hub-actions .v3-row{min-height:54px;border-radius:14px}
@media(max-width:520px){body.v3 #a11y-dialog.v32-pause .v32-menu-row{min-height:46px;padding:10px 12px!important}body.v3 #a11y-dialog.v32-settings .v2-setting{min-height:52px}#v3-hub.v32-progress .v32-progress-row{padding:10px}}

/* v3.3 typography and spatial hierarchy: Nunito stays the product face while every active surface gets a readable, responsive scale. */
body.v3 .v2-intro{font-size:18px}
body.v3 :is(.v2-smallprint,.v3-saved-title,#a11y-count,#a11y-save,.v3-row-words small,.v3-hub-note,.v3-stat span){font-size:var(--text-support)!important}
body.v3 :is(.v2-home-actions button,.controls button,#dialog-actions button,.v2-dialog-foot button,.v3-row){font-size:var(--text-action)}
body.v3 #a11y-playing{align-items:start;gap:42px;grid-template-columns:minmax(240px,320px) minmax(0,620px)}
body.v3 #a11y-message{font-size:19px;line-height:1.45}
body.v3 #a11y-cancel{font-size:15px}
body.v3 dialog.v2-dialog{font-size:17px}
body.v3 #dialog-body{font-size:17px}
body.v3 .v2-group,body.v3 #a11y-dialog.v32-settings .v2-group{font-size:14px;line-height:1.3;letter-spacing:.06em}
body.v3 .v2-setting-detail{font-size:15px;line-height:1.4}
body.v3 #a11y-dialog[data-kind='settings'] #dialog-actions>button:not(.v2-setting){font-size:16px}
body.v3 .v3-progress-list li{font-size:16px}
body.v3 .v3-progress-list small{font-size:14px}
body.v3 .v3-coach p{font-size:16px;line-height:1.45}
body.v3 .v3-coach button{font-size:16px}
body.v3 .v3-coach small,body.v3 #learning-progress{font-size:14px}
body.v3 #learning-dialog p,body.v3 #learning-dialog button{font-size:17px}
body.v3 #learning-notice{font-size:15px!important}
body.v3 #a11y-dialog.v32-pause .v32-menu-row{font-size:17px}
body.v3 .v32-menu-value{font-size:14px}
body.v3 .v32-progress-status{font-size:14px!important;line-height:1.35}
body.v3 .v32-progress-metric{font-size:15px}

@media(max-width:700px){
 body.v3{--text-body:16px;--text-support:14px;--text-action:16px;--text-title:24px}
 body.v3 .v2-intro{font-size:16px}
 body.v3 #a11y-message{font-size:17px}
 body.v3 :is(.v2-dialog-head h2,#learning-dialog h2,#learning-dialog h3){font-size:24px!important}
 body.v3 dialog.v2-dialog,body.v3 #dialog-body{font-size:16px}
 body.v3 .v2-setting-detail{font-size:14px}
 body.v3 #a11y-dialog.v32-pause .v32-menu-row{font-size:16px}
 body.v3 .v3-row-words small,body.v3 .v3-hub-note{line-height:1.45}
}
