@font-face{font-family:Geist;src:url('./vendor/Geist.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
:root{font-family:Geist,Arial,sans-serif;--ink:#00354e;--soft:#15536d;--page:#00aae4;--button-bg:#ffffffdf}
body,button,input,select,dialog,.target-word{font-family:Geist,Arial,sans-serif}
body{font-size:14px;overflow-x:hidden}html,body,#app{width:100%;max-width:100%}
.topbar{gap:25px}.brand{font-size:18px;font-weight:750;letter-spacing:-.6px}.brand b{font-weight:750}.brand small{font-size:7px;letter-spacing:1.1px;font-weight:500}
.topbar nav button{font-size:13px;font-weight:600;padding:9px 16px}.header-actions{gap:23px;margin-left:4px}.header-link,.daily-btn{font-size:12px;font-weight:550}
.utility-controls{margin-left:auto;display:flex;align-items:center;gap:9px;flex:none}.utility-btn{width:35px;height:35px;display:grid;place-content:center;border-radius:50%;color:var(--ink)}
.utility-btn svg{width:22px;height:22px;display:block}.utility-btn:hover{background:#ffffff28}.sound-switch{display:flex;align-items:center;gap:7px;color:var(--ink);font-size:11px;min-height:35px;padding:0 7px;font-weight:550}
#soundIcon{height:18px;display:block}#soundIcon svg{width:18px;height:18px}.switch-track{width:25px;height:15px;border-radius:10px;background:#00354e35;position:relative;display:inline-block;margin-left:1px}
.switch-track:after{content:'';position:absolute;left:3px;top:3px;width:9px;height:9px;background:#ffffffc0;border-radius:50%;transition:translate .2s}.sound-switch[aria-checked=true] .switch-track{background:#00354e}.sound-switch[aria-checked=true] .switch-track:after{translate:10px 0;background:#fff}
main{width:min(1920px,100%);grid-template-columns:minmax(0,1fr) 410px;gap:45px;padding-right:50px}
#viewer{overflow:hidden;isolation:isolate}
#canvasWrap{overflow:hidden;mask-image:linear-gradient(to bottom,transparent 0,#000 4%,#000 94%,transparent 100%),linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);mask-composite:intersect;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 4%,#000 94%,transparent 100%),linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);-webkit-mask-composite:source-in}
#canvasWrap canvas{filter:drop-shadow(16px 22px 16px #00354e38) drop-shadow(2px 4px 3px #00354e20)}
#panel{min-width:0;overflow-x:hidden;overscroll-behavior-x:none;padding-right:2px;scrollbar-width:thin}
h1{font-family:Geist,Arial,sans-serif;font-size:clamp(55px,4vw,74px);font-weight:760;line-height:1.04;letter-spacing:-3px}
h2{font-size:35px;font-weight:720;letter-spacing:-1.35px}h3{font-weight:700}.map-meta{font-size:12px;margin-top:14px;font-weight:450}
.eyebrow{font-size:10px;letter-spacing:1px;font-weight:650}.region-card b{font-size:13px;font-weight:650}.region-card small{font-size:10px;font-weight:450}.region-card{min-width:0;min-height:59px;padding:11px 12px}
.primary{font-size:14px;font-weight:650;min-height:44px}.secondary{font-size:12px;font-weight:550;min-height:42px}.map-shortcuts{display:flex;gap:8px;margin-top:8px}.map-shortcuts button{flex:1;font-size:11px;min-height:35px;background:transparent}
.map-extras{gap:17px;margin-top:16px}.map-extras .text-btn{font-size:11px}.map-actions .secondary{min-width:108px}.practice-note{font-size:12px}.round-summary{font-size:11px}.lesson-link{font-size:11px}
.viewer-bottom{gap:10px;pointer-events:none;flex-wrap:wrap}.viewer-bottom>*{pointer-events:auto}.view-tools{gap:0;padding:3px}.view-tools button{font-size:11px;font-weight:550;min-height:34px;padding:8px 13px}
.view-tools button[aria-pressed=true]{background:#ffffffa8;color:#00354e}.view-tools #resetView[aria-pressed=true]{background:#ffffff35}
.motion-toggle,.isolate-toggle{display:flex;align-items:center;gap:7px;border:1px solid #00354e26;background:#ffffff0c;border-radius:20px;padding:9px 13px;color:#00354e;font-size:11px;font-weight:550;min-height:40px}
.motion-toggle[aria-pressed=true],.isolate-toggle[aria-pressed=true]{background:#ffffffc9;border-color:#ffffffb0;color:#00354e}.motion-indicator{height:5px;width:5px;border-radius:50%;background:#00354e55}.motion-toggle[aria-pressed=true] .motion-indicator{background:#086a50;box-shadow:0 0 0 3px #086a5010}
.scene-heading{font-size:11px}.view-orientation{font-size:9px}
.region-select{max-width:100%;min-width:0;font-size:13px}.explore-tabs button{font-size:12px}.bone-list{min-width:0;overflow-x:hidden;grid-template-columns:minmax(0,1fr);max-width:100%}.bone-row{min-width:0;width:100%;font-size:12px}.bone-row>span:first-child{min-width:0;overflow-wrap:anywhere}.bone-row .bone-check{flex:none;margin-left:8px}
input.search{display:block;min-width:0;max-width:100%;width:100%;background:transparent;border:0;border-bottom:1px solid #00354e3b;border-radius:0;padding:13px 2px;font-size:13px;outline:none;box-shadow:none}
input.search:focus,input.search:focus-visible{outline:none!important;box-shadow:none!important;border:0;border-bottom:2px solid #00354e;padding-bottom:12px;background:transparent}
.bone-card-head h3{font-size:25px;font-weight:700;min-width:0}.bone-card-head small{font-size:10px}.bone-card p{font-size:13px;line-height:1.75}.bone-detail{font-size:11px}.bone-actions button{font-size:12px}.explore-match{font-size:11px}
.target-word{font-size:clamp(30px,3.7vw,53px);font-weight:760;letter-spacing:-1.75px}.question-top{font-size:11px}.question-top button{font-size:11px}.feedback{font-size:12px}.answer-wrap input{font-size:15px}.answer-submit{font-size:12px}.key{font-family:Geist,Arial,sans-serif;font-size:11px;font-weight:500}
.letter{color:#00354e80}.letter.typed{color:#fff}.letter.mistyped{color:#7e2b23}.answer-wrap input:focus-visible{outline:0}.metric b{font-weight:650}.metric small{font-weight:450}.result-title{font-weight:700}
.practice-active #panel{overflow-x:clip}.practice-active #viewer{inset:0 0 370px}.practice-active .viewer-bottom{bottom:9px}.practice-active .target-word{min-height:63px}
.modal-intro{font-size:13px}.settings-row{font-size:13px}.modal-head button{font-family:Geist,Arial,sans-serif}.section-label{font-size:10px}
body[data-theme=dark]{--brand:#00aae4;--bg:#0b0e12;--bg2:#0b0e12;--page:#0b0e12;--text:#f1eee7;--muted:#a9afb6;--ink:#f1eee7;--soft:#a9afb6;--line:#ffffff22;--accent:#f5dfa9;color:#f1eee7;background:#0b0e12;color-scheme:dark}
body[data-theme=dark] #app,body[data-theme=dark] #panel,body[data-theme=dark] #viewer,body[data-theme=dark] #loading,body[data-theme=dark] .topbar,body[data-theme=dark] footer{background:#0b0e12}
body[data-theme=dark] .brand,body[data-theme=dark] .brand b,body[data-theme=dark] .topbar nav button,body[data-theme=dark] .header-link,body[data-theme=dark] .daily-btn,body[data-theme=dark] .utility-btn,body[data-theme=dark] .sound-switch{color:#f1eee7}
body[data-theme=dark] .brand small,body[data-theme=dark] .eyebrow,body[data-theme=dark] .scene-heading,body[data-theme=dark] .view-orientation,body[data-theme=dark] .map-meta,body[data-theme=dark] .map-extras .text-btn,body[data-theme=dark] .region-card small,body[data-theme=dark] .practice-note,body[data-theme=dark] .round-summary,body[data-theme=dark] .metric small,body[data-theme=dark] footer,body[data-theme=dark] footer button{color:#a9afb6}
body[data-theme=dark] .topbar nav button[aria-current=page]{background:#f4f0e9;color:#101317}body[data-theme=dark] .topbar nav button:hover,body[data-theme=dark] .utility-btn:hover{background:#ffffff18;color:#f1eee7}
body[data-theme=dark] .region-card{background:#ffffff03;border-color:#ffffff24;color:#e9e7e1}body[data-theme=dark] .region-card:hover{background:#ffffff0d;border-color:#ffffff55}body[data-theme=dark] .region-card.active{background:#f4ead6;border-color:#f4ead6;color:#15191c}body[data-theme=dark] .region-card.active small{color:#4a4d4e}
body[data-theme=dark] .primary{background:#f5efe4;color:#15191c;border-color:#f5efe4}body[data-theme=dark] .primary:hover{background:#fff;color:#15191c}body[data-theme=dark] .secondary{background:#ffffff03;border-color:#ffffff25;color:#ece9e2}body[data-theme=dark] .secondary:hover{background:#ffffff10;color:#fff}
body[data-theme=dark] .text-btn,body[data-theme=dark] .answer-submit,body[data-theme=dark] .lesson-step,body[data-theme=dark] .section-label{color:#d9d8d3}body[data-theme=dark] .section-label span{color:#a9afb6}body[data-theme=dark] .text-btn:hover{color:#fff}
body[data-theme=dark] .view-tools,body[data-theme=dark] .motion-toggle,body[data-theme=dark] .isolate-toggle{background:#ffffff05;border-color:#ffffff22;color:#e9e6de}body[data-theme=dark] .view-tools button{color:#e9e6de}body[data-theme=dark] .view-tools button[aria-pressed=true],body[data-theme=dark] .motion-toggle[aria-pressed=true],body[data-theme=dark] .isolate-toggle[aria-pressed=true]{background:#f1e8d3;color:#15191c}body[data-theme=dark] .view-tools #resetView[aria-pressed=true]{background:#ffffff17;color:#ece9e2}body[data-theme=dark] .motion-indicator{background:#ffffff50}body[data-theme=dark] .motion-toggle[aria-pressed=true] .motion-indicator{background:#177957}
body[data-theme=dark] .switch-track{background:#ffffff20}body[data-theme=dark] .sound-switch[aria-checked=true] .switch-track{background:#cfbe94}body[data-theme=dark] .sound-switch[aria-checked=true] .switch-track:after{background:#171b20}body[data-theme=dark] .daily-btn>span{background:#ffffff16;color:#d9d8d3}
body[data-theme=dark] #canvasWrap canvas{filter:drop-shadow(12px 16px 16px #0008)}body[data-theme=dark] #boneTooltip{background:#242931;color:#eee9df}
body[data-theme=dark] .region-select{background:#ffffff04;border-color:#ffffff27;color:#ece9e2}body[data-theme=dark] .region-select option{background:#171b20;color:#ece9e2}body[data-theme=dark] .explore-tabs button{color:#a9afb6}body[data-theme=dark] .explore-tabs button[aria-pressed=true]{color:#eee9df;border-color:#eee9df}
body[data-theme=dark] input.search{color:#ece9e2;border-bottom-color:#ffffff30}body[data-theme=dark] input.search::placeholder{color:#a9afb6}body[data-theme=dark] input.search:focus-visible{border-bottom-color:#eee9df}body[data-theme=dark] .bone-list{scrollbar-color:#ffffff35 transparent}body[data-theme=dark] .bone-row{color:#d3d4d3}body[data-theme=dark] .bone-row:hover{background:#ffffff0b}body[data-theme=dark] .bone-row.selected{background:#ffffff11;color:#f5dfa9}body[data-theme=dark] .bone-row small,body[data-theme=dark] .bone-row .bone-check{color:#a9afb6}
body[data-theme=dark] .bone-card{border-color:#ffffff22}body[data-theme=dark] .bone-card p,body[data-theme=dark] .bone-detail,body[data-theme=dark] .bone-card-head small,body[data-theme=dark] .explore-match,body[data-theme=dark] .intro,body[data-theme=dark] .feedback,body[data-theme=dark] .question-top,body[data-theme=dark] .question-count{color:#a9afb6}
body[data-theme=dark] .letter{color:#626970}body[data-theme=dark] .letter.typed{color:#f8f4ec}body[data-theme=dark] .letter.mistyped{color:#ffb0a7}body[data-theme=dark] .feedback.correct{color:#9ed3b4}body[data-theme=dark] .feedback.error{color:#ffb0a7}
body[data-theme=dark] .answer-wrap{border-color:#ffffff30}body[data-theme=dark] .answer-wrap input{color:#f1eee7!important}body[data-theme=dark] .answer-wrap input::placeholder{color:#a9afb6}body[data-theme=dark] .answer-wrap input.invalid{color:#ffb0a7!important}
body[data-theme=dark] .key{background:#20262d;border-color:#29313a;color:#c6cbd0;box-shadow:0 1px 0 #0004}body[data-theme=dark] .key:hover{background:#303842;color:#f1eee7}body[data-theme=dark] .key.pressed{background:#f4eee3;color:#14181c;border-color:#f4eee3}
body[data-theme=dark] .level-grid button{border-color:#ffffff25;color:#b2b7bb}body[data-theme=dark] .level-grid button.active{background:#f0e6d0;border-color:#f0e6d0;color:#15191c}body[data-theme=dark] .level-grid small{color:inherit}
body[data-theme=dark] .lesson-body{color:#eee9df}body[data-theme=dark] .fact-box{background:#ffffff06;border-color:#f5dfa970}body[data-theme=dark] .fact-box p,body[data-theme=dark] .fact-box small{color:#b2b7bb}body[data-theme=dark] .option{border-color:#ffffff25;color:#eee9df}body[data-theme=dark] .option.chosen{color:#9ed3b4;border-color:#9ed3b4;background:#9ed3b410}body[data-theme=dark] .option.wrong{color:#ffb0a7;border-color:#ffb0a7}
body[data-theme=dark] .result-star,body[data-theme=dark] .stars{color:#f5dfa9}body[data-theme=dark] .result-list>div{color:#b2b7bb;border-color:#ffffff20}body[data-theme=dark] .mini-progress{background:#ffffff16}body[data-theme=dark] .mini-progress div,body[data-theme=dark] .lesson-progress i.done{background:#ecd6a5}
body[data-theme=dark] dialog{background:#171c22;color:#f1eee7;border-color:#303740;box-shadow:0 20px 100px #0008}body[data-theme=dark] .modal-head,body[data-theme=dark] .modal-head button,body[data-theme=dark] .modal-intro,body[data-theme=dark] .settings-row small,body[data-theme=dark] .progress-region small,body[data-theme=dark] .progress-summary small,body[data-theme=dark] .help-steps p{color:#a9afb6}body[data-theme=dark] .settings-row,body[data-theme=dark] .progress-region{border-color:#ffffff20}body[data-theme=dark] .toggle{border-color:#ffffff30;color:#c5c8c9}body[data-theme=dark] .toggle[aria-pressed=true]{background:#eee2c9;color:#15191c;border-color:#eee2c9}body[data-theme=dark] .progress-summary>div{background:#ffffff04;border-color:#ffffff20}body[data-theme=dark] .help-steps span{color:#f5dfa9}body[data-theme=dark] .danger-btn{color:#ffb0a7!important}body[data-theme=dark] #loading b{color:#eee9df}body[data-theme=dark] #toast{background:#222830;color:#eee9df;border-color:#39404a}
@media(max-width:1250px){.topbar{gap:18px}.header-actions{gap:17px}.topbar nav button{padding:9px 12px}.brand{font-size:17px}.utility-controls{gap:5px}.sound-switch{font-size:10px;gap:5px}main{grid-template-columns:minmax(0,1fr) 350px;padding-right:28px;gap:20px}h1{font-size:59px}.region-card b{font-size:12px}.region-card{padding:10px}.map-shortcuts button{font-size:10px}}
@media(max-width:1100px){.topbar{height:auto;min-height:108px;flex-wrap:wrap;padding:16px 23px 8px;gap:12px 18px}.brand{order:0}.utility-controls{order:1;margin-left:auto}.topbar nav{order:2;margin-left:0}.header-actions{order:3;margin-left:0;gap:19px}.topbar nav button{font-size:12px}.header-link,.daily-btn{font-size:11px}main{height:calc(100dvh - 142px)}.practice-active main{min-height:640px}h2{font-size:32px}}
@media(max-width:760px){
 .topbar{padding:16px 18px 8px;min-height:132px;gap:12px 0}.brand{font-size:17px;order:0}.brand small{font-size:6px}.utility-controls{order:1;gap:3px;margin-left:auto}.utility-btn{width:32px;height:32px}.utility-btn svg{width:20px;height:20px}.sound-switch{padding:0 5px;gap:5px}.sound-switch>span:nth-child(2){display:none}.switch-track{width:23px;height:14px}.switch-track:after{height:8px;width:8px}.header-actions{order:3;width:100%;flex-basis:100%;gap:25px;justify-content:center;margin-left:0}.header-link,.daily-btn{font-size:11px;padding:1px 0}.topbar nav{order:2;flex-basis:100%;width:100%;gap:3px;margin:0}.topbar nav button{font-size:12px;font-weight:600;padding:9px 11px}
 main{width:100%;height:auto;display:flex;grid-template-columns:none;padding:0;gap:0}#viewer{height:51svh;min-height:330px;max-height:510px}.scene-heading{font-size:10px}.view-orientation{font-size:8px}#panel{padding:26px 22px 30px;overflow-x:hidden;max-width:100%;min-width:0}h1{font-size:54px;font-weight:760}h2{font-size:33px;font-weight:720}.map-meta{font-size:12px}.region-card b{font-size:12px}.region-card small{font-size:9px}.region-card{min-height:58px;padding:10px}.map-shortcuts{gap:7px}.map-shortcuts button{font-size:11px}.map-extras .text-btn{font-size:10px}.primary{font-size:14px}.secondary{font-size:12px}.map-actions .secondary{min-width:96px}
 .viewer-bottom{gap:6px;left:10px;right:10px;bottom:9px;flex-wrap:nowrap}.view-tools button{min-height:30px;font-size:10px;padding:7px 10px}.motion-toggle,.isolate-toggle{font-size:10px;min-height:36px;padding:8px 10px;gap:5px}.motion-indicator{height:4px;width:4px}.practice-active .view-tools button{font-size:9px;min-height:27px;padding:6px 8px}.practice-active .motion-toggle,.practice-active .isolate-toggle{min-height:33px;font-size:9px;padding:7px 9px}.practice-active .viewer-bottom{gap:5px}.practice-active #viewer{position:sticky;inset:auto;top:0;height:31svh;min-height:205px;max-height:320px}.practice-active #panel{padding:17px 18px 26px;width:100%;overflow-x:clip}.practice-active main{height:auto;min-height:0}.practice-active .target-word{font-size:32px;min-height:44px;letter-spacing:-1px}.question-top{font-size:10px}.feedback{font-size:11px}.answer-wrap input{font-size:15px}.answer-submit{font-size:11px}.key{font-size:11px}.bone-card-head h3{font-size:25px}.bone-card p{font-size:13px}.bone-row{font-size:12px}.region-select{font-size:13px}.lesson-active #viewer{height:31svh;min-height:205px}.map-extras{gap:15px}.large-text .bone-row{font-size:14px}
}
@media(max-width:370px){.topbar{padding-left:16px;padding-right:16px}.brand{font-size:16px}.brand small{font-size:5.5px}.header-actions{gap:19px}.utility-btn{width:29px}.sound-switch{gap:3px;padding:0 3px}.region-card{padding:9px 8px}.region-card b{font-size:11px}.map-actions{gap:6px}.map-extras .text-btn{font-size:9px}.viewer-bottom{gap:4px}.view-tools button{padding:6px 8px}.motion-toggle,.isolate-toggle{padding:7px 8px}.practice-active .view-tools button{padding:6px}.practice-active .motion-toggle,.practice-active .isolate-toggle{font-size:8px;padding:7px}.practice-active .target-word{font-size:29px}}
@media(prefers-reduced-motion:reduce){.switch-track:after{transition:none}}
.region-card.active:hover{background:#ffffffdf;border-color:#ffffffdf;color:#00354e}
body[data-theme=dark] .region-card.active:hover{background:#f4ead6;border-color:#f4ead6;color:#15191c}
