:root{--black:#08090a;--ivory:#eeece5;--muted:#a19e93;--gold:#c9a86b;--gold-light:#f0dbaf;--line:rgba(198,163,106,.28);--serif:'Fingertip Serif','Noto Serif SC','Songti SC','SimSun',serif;--sans:Arial,'Microsoft YaHei',sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--black);color:var(--ivory);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button{color:inherit}h1,h2,p{margin:0}h1,h2{font-family:var(--serif);font-weight:400}svg{overflow:visible}[hidden]{display:none!important}#space,.vignette,.grain{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}.vignette{background:radial-gradient(ellipse at 50% 42%,transparent 32%,rgba(4,5,6,.16) 65%,rgba(4,5,6,.64) 100%);z-index:1}.grain{z-index:50;opacity:.022;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.6' filter='url(%23n)'/%3E%3C/svg%3E")}.site-header{position:fixed;z-index:20;top:0;left:4%;right:4%;height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:flex;gap:17px;align-items:center;font-family:var(--serif);font-size:22px;letter-spacing:4px;color:var(--gold-light)}.brand-mark{font-size:19px;border:1px solid rgba(199,164,105,.58);width:34px;height:37px;display:grid;place-items:center;letter-spacing:0}.wordmark i{height:17px;width:1px;background:var(--line)}.wordmark .brand-en{font-family:var(--sans);font-size:9px;letter-spacing:3px;color:var(--ivory)}.header-right{display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:1.7px}.edition{margin-left:24px;color:#79786e;font-size:9px}.signal,.live-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold-light);box-shadow:0 0 12px #c9a86b77}.signal.live{animation:breathe 3s infinite}.header-right #language-badge{padding-right:20px;border-right:1px solid var(--line);color:var(--gold-light)}.screen{position:absolute;z-index:3;inset:105px 5% 80px;animation:appear .8s ease both}.home{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding-bottom:0;transition:padding .5s}.setup-open .home{padding-bottom:120px}.eyebrow{display:flex;align-items:center;justify-content:center;gap:18px;font-size:10px;letter-spacing:4px;color:#b7b0a0;font-weight:400}.eyebrow>span{width:24px;height:1px;background:var(--line)}.home h1{font-size:clamp(56px,6.1vw,110px);line-height:1.18;letter-spacing:9px;text-shadow:0 4px 25px #000}.foil{background:linear-gradient(145deg,#f3e4c3 4%,#d5b477 29%,#ac8451 43%,#eed7a6 59%,#b3874d 84%,#e0c593);color:transparent;background-clip:text;-webkit-background-clip:text;text-shadow:none}.intro{font-size:12px;font-weight:300;letter-spacing:3px;color:#bebcb5;line-height:2}.language-row{display:grid;grid-template-columns:repeat(3,1fr);width:min(840px,74vw);margin-top:25px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(90deg,transparent,#08090a66,transparent);min-height:142px}.language-choice{position:relative;display:flex;flex-direction:column;align-items:center;padding:17px 12px 15px;gap:8px;isolation:isolate;transition:background .3s,color .3s}.language-choice+.language-choice:before{content:'';position:absolute;left:0;top:20px;bottom:20px;width:1px;background:var(--line)}.choice-no{font-family:var(--sans);font-size:10px;color:var(--gold);letter-spacing:2px}.language-choice h2{font-size:35px;line-height:1.2;letter-spacing:3px}.language-choice h2[lang=ko]{font-family:'Fingertip Korean',var(--serif)}.language-choice h2[lang=ja]{font-family:'Fingertip Japanese',var(--serif)}.roman{font-size:8px;letter-spacing:3.5px;color:#c3c0b5}.choice-gesture{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:1px;color:#c2bfb3;margin-top:3px}.gesture-icon{display:inline-flex;color:var(--gold);width:23px;height:25px}.gesture-icon svg{width:100%;height:100%;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.choice-progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold-light);box-shadow:0 0 12px #caa86b;transform:scaleX(var(--progress,0));transform-origin:left}.language-choice.is-target,.mode-choice.is-target{background:#b78b4620;box-shadow:inset 0 0 0 1px #d6b47799}.language-choice.is-target h2{color:var(--gold-light)}.instruction{font-size:10px;letter-spacing:3px;color:#aaa599;min-height:15px}.site-footer{position:fixed;z-index:22;left:4%;right:4%;bottom:0;height:57px;display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1.8px;border-top:1px solid #b7956024;color:#aaa598}.site-footer #footer-status{display:flex;gap:12px;align-items:center;min-width:220px}.site-footer #footer-hint{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;text-align:center}.page-number{font-size:11px;color:#ddd7c7}.page-number i{font-style:normal;padding:0 8px;color:#817663}.setup-panel{z-index:30;position:fixed;left:50%;bottom:76px;transform:translateX(-50%);width:min(880px,88vw);display:flex;align-items:center;justify-content:space-between;gap:28px;padding:20px 26px;border:1px solid #cfb37a52;background:linear-gradient(125deg,#111110f5,#090a0af5);box-shadow:0 12px 70px #000b;backdrop-filter:blur(20px)}.setup-kicker{color:var(--gold);font-size:8px;letter-spacing:2.5px}.setup-copy h2{font-size:22px;margin:7px 0}.setup-copy p{font-size:10px;line-height:1.6;color:#aaa599;max-width:470px}.voice-opt{display:flex;align-items:center;gap:6px;font-size:9px;margin-top:9px;color:#c8c0ad}.voice-opt input{accent-color:var(--gold);width:12px;height:12px;margin:0 2px 0 0}.voice-opt small{color:#777369;font-size:8px;margin-left:5px}.setup-actions{flex:0 0 206px;display:flex;flex-direction:column;gap:10px}.start-button{border:1px solid #d6b77c;background:linear-gradient(125deg,#e0c695,#b98f55);color:#161511;min-height:40px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;font-size:12px}.start-button:disabled{opacity:.6;cursor:wait}.tour-button{display:flex;justify-content:space-between;background:none;border:0;color:#d2c09c;font-size:10px;padding:0 4px}.setup-actions>small{font-size:8px;color:#7c786e;text-align:center}.section-title{font-size:clamp(34px,3.3vw,60px);line-height:1.4;letter-spacing:4px}.modes{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:17px}.mode-row{display:grid;grid-template-columns:1fr 1fr;width:min(1020px,84vw);gap:50px;margin-top:21px}.mode-choice{position:relative;min-height:330px;border-top:1px solid var(--line);padding:18px 22px 13px}.mode-choice+.mode-choice:before{position:absolute;content:'';left:-25px;top:0;bottom:0;width:1px;background:var(--line)}.mode-choice h2{font-size:30px;color:var(--gold-light);letter-spacing:4px;margin:14px 0 9px}.mode-choice p{font-size:10px;color:#b0ab9f;letter-spacing:1px}.mode-preview,.write-preview{height:190px;width:100%;margin-top:8px}.mode-bottom{display:flex;align-items:center;gap:14px;border-top:1px solid var(--line);padding-top:12px;font-size:10px;letter-spacing:2px}.arrow-diagonal{margin-left:auto;font-size:23px;color:var(--gold)}.write-preview{position:relative;display:grid;place-items:center}.write-preview>span{font-family:var(--serif);font-size:145px;line-height:1;z-index:2;color:#f4eee0}.write-preview svg{position:absolute;width:70%;height:100%;z-index:3;fill:var(--gold-light);filter:drop-shadow(0 0 5px #dcb26d)}.write-preview svg path{fill:none;stroke:var(--gold-light);stroke-width:1.3;stroke-dasharray:220;animation:draw-preview 5s ease infinite}.mini-grid{position:absolute;width:145px;height:145px;border:1px solid var(--line);background:linear-gradient(45deg,transparent 49.7%,#bfb4a620 50%,transparent 50.3%),linear-gradient(-45deg,transparent 49.7%,#bfb4a620 50%,transparent 50.3%)}.section-heading{position:absolute;top:25px;left:2%;}.section-heading .eyebrow{justify-content:flex-start;font-size:8px;letter-spacing:3px}.section-heading h1{font-size:clamp(32px,3.4vw,58px);letter-spacing:4px;margin:17px 0 13px}.section-heading p{font-size:11px;letter-spacing:2px;color:#aca697;line-height:1.8}.control-readout{position:absolute;right:2%;top:31px;display:flex;flex-direction:column;align-items:flex-end;gap:13px}.control-readout #force-label{font-family:var(--serif);font-size:25px;color:var(--gold-light);letter-spacing:4px}.control-readout i{width:65px;height:1px;background:var(--gold)}.control-readout #force-subtitle{font-size:9px;letter-spacing:1px;color:#aca393}.particle-caption{position:absolute;right:2%;top:154px;font-size:8px;letter-spacing:2px;display:flex;gap:8px;align-items:center;color:#8c877a}.gesture-strip{display:flex;position:absolute;bottom:7px;left:50%;transform:translateX(-50%);border-top:1px solid var(--line);border-bottom:1px solid var(--line);width:min(680px,66vw);background:#08090a6b;backdrop-filter:blur(7px)}.gesture-state{flex:1;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:7px 9px;padding:17px 9px;min-height:85px;color:#999183;transition:background .2s,color .2s}.gesture-state+.gesture-state{border-left:1px solid #b99b6530}.gesture-state b{font-size:11px;font-weight:400;line-height:25px}.gesture-state>span:last-child{flex-basis:100%;font-size:9px;letter-spacing:2px;text-align:center}.gesture-state.active{background:#ceae7720;color:var(--gold-light)}.gesture-arrow{font-size:25px;color:var(--gold);line-height:25px}.hand-action{--progress:0;position:relative;color:#c6b995;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:10px;letter-spacing:1px;padding:12px 15px;min-height:38px;border:1px solid #a987503d;user-select:none;transition:color .2s,background .2s}.hand-action.is-target{background:#c2a06826;color:var(--gold-light);border-color:var(--gold)}.action-progress{position:absolute;height:1px;bottom:0;left:0;width:100%;transform:scaleX(var(--progress));transform-origin:left;background:var(--gold-light);box-shadow:0 0 8px #e6c485}.back-action,.voice-action{position:fixed;z-index:21;top:95px;padding:7px 12px;font-size:9px;min-height:30px;background:#090a0a55;backdrop-filter:blur(5px)}.back-action{left:4%}.back-action>span:first-child{font-size:18px}.voice-action{right:4%;}.sound-wave{display:inline-flex;gap:3px;height:14px;align-items:center;color:var(--gold)}.sound-wave i{display:inline-block;width:2px;height:7px;background:currentColor}.sound-wave i:nth-child(2){height:14px}.sound-wave i:nth-child(3){height:10px}.sound-wave i:nth-child(4){height:5px}.voice-action.listening .sound-wave i{animation:wave .7s alternate infinite}.voice-action.listening .sound-wave i:nth-child(2){animation-delay:.2s}.voice-action.listening .sound-wave i:nth-child(3){animation-delay:.4s}.next-experience{position:absolute;bottom:7px;right:0;display:flex;flex-direction:column;gap:7px;width:140px;height:85px;border:0;border-top:1px solid var(--line)}.next-experience>span:not(.action-progress){position:absolute;top:14px;right:7px}.next-experience small{font-size:8px;color:#827b6b}.character-cloud{position:absolute;inset:165px 15% 57px;}.character-option{position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;width:128px;height:132px;transform:translate(-50%,-50%);user-select:none}.character-option .select-letter{font-size:75px;font-family:var(--serif);line-height:1.1;background:linear-gradient(180deg,#fff4dc 8%,#d7c399 55%,#a7874f66 100%);background-clip:text;color:transparent;transition:filter .3s,transform .3s}.character-option:nth-child(even) .select-letter{background:linear-gradient(180deg,#f7f4eb,#c2c0b690);background-clip:text}.character-option svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--gold);stroke-width:.75;opacity:0;transform:rotate(-90deg);transition:opacity .2s}.character-option svg .dwell{stroke:var(--gold-light);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--progress,0));}.character-option.is-target svg{opacity:1}.character-option.is-target .select-letter{transform:scale(1.12);filter:drop-shadow(0 0 15px #d0b47577)}.character-option .letter-reading{font-size:9px;color:#b6a986;letter-spacing:2px;margin-top:9px;opacity:.7}.pick-bottom{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);width:60%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;padding:16px 0;border-top:1px solid var(--line);color:#a89b82}.writing{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;inset:114px 8% 73px}.writing-title{text-align:center;}.writing-title .eyebrow{font-size:8px;letter-spacing:3px}.writing-title h1{font-size:29px;letter-spacing:4px;margin-top:11px}.writing-panels{display:grid;grid-template-columns:1fr 1fr;gap:6vw;width:100%;max-width:1220px}.reference-panel,.drawing-panel{position:relative;display:flex;flex-direction:column;align-items:center;gap:11px}.drawing-panel:before{position:absolute;left:-3vw;top:0;bottom:0;width:1px;background:var(--line);content:''}.panel-heading{width:100%;display:flex;align-items:center;gap:12px;min-height:30px;border-bottom:1px solid var(--line);padding-bottom:11px}.panel-heading>span{color:var(--gold);font-size:9px}.panel-heading h2{font-size:18px;letter-spacing:2px}.panel-heading small{margin-left:auto;font-size:8px;color:#b1a994;letter-spacing:1px}.practice-square{position:relative;width:clamp(200px,calc(100svh - 395px),390px);height:clamp(200px,calc(100svh - 395px),390px);max-width:100%;aspect-ratio:1;margin-top:3px}.practice-grid{position:absolute;inset:0;border:1px solid #c1b8a628;background:linear-gradient(45deg,transparent 49.85%,#ac9c7a25 50%,transparent 50.15%),linear-gradient(-45deg,transparent 49.85%,#ac9c7a25 50%,transparent 50.15%),linear-gradient(90deg,transparent 49.85%,#ac9c7a25 50%,transparent 50.15%),linear-gradient(0deg,transparent 49.85%,#ac9c7a25 50%,transparent 50.15%)}.practice-square svg,.practice-square canvas{position:absolute;inset:0;width:100%;height:100%}#reference-glyph{overflow:hidden}#ghost-glyph{opacity:.12;overflow:hidden}#ink-canvas{filter:drop-shadow(0 0 3px #d4b37c88)}.ink-tip{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:11px;pointer-events:none;color:#cabda0;font-family:var(--serif);letter-spacing:3px;font-size:16px;text-shadow:0 1px 20px #000}.ink-tip small{font-family:var(--sans);font-size:9px;letter-spacing:1px;color:#aaa08c}.character-definition{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:1px;min-height:24px}.character-definition>span:first-child{font-family:var(--serif);font-size:18px}.character-definition #character-reading{color:var(--gold-light)}.character-definition #character-meaning{font-size:9px;color:#a89f8e}.definition-rule{width:1px;height:12px;background:var(--line)}.stroke-steps{display:flex;justify-content:center;gap:7px;width:100%;min-height:57px;max-height:70px}.stroke-step{width:48px;display:flex;align-items:center;flex-direction:column;gap:4px}.stroke-step svg{border:1px solid #beaa8324;max-width:44px;height:44px}.stroke-step span{font-size:8px;color:#8a7c61}.stroke-step.current span{color:var(--gold-light)}.stroke-step.current svg{border-color:#e5c99288}.lesson-actions{display:flex;gap:12px}.lesson-actions .hand-action{padding:8px 13px;min-height:32px;font-size:9px}.writing-meta{min-height:24px;width:100%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#a39780;padding-top:2px}.writing-meta>span:first-child{color:var(--gold-light)}.drawing-actions{display:flex;gap:9px;width:100%;justify-content:center;padding-top:6px}.drawing-actions .hand-action{padding:9px 16px;font-size:9px}.drawing-actions [data-action=complete]{background:#aa875315;color:#e6c997}.change-letter{font-size:9px;border:0;margin-top:1px;padding:8px 18px;min-height:28px}.camera-panel{position:fixed;bottom:77px;left:4%;z-index:15;width:154px;border:1px solid #b2955e38;background:#090a0a}.camera-image{height:106px;position:relative;overflow:hidden;}.camera-image video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);filter:grayscale(1) brightness(.62)}.camera-image canvas{position:absolute;inset:0;width:100%;height:100%}.camera-caption{height:27px;display:flex;gap:7px;align-items:center;font-size:8px;color:#c1b798;padding:0 8px}.camera-caption>span:last-child{margin-left:auto;font-size:6px;color:#93896f}.camera-caption .live-dot{width:4px;height:4px}#camera-no-hand{position:absolute;inset:0;display:grid;place-items:center;background:#090a0a77;color:#d1b57f;font-size:9px;letter-spacing:1px}.hand-cursor{position:fixed;left:0;top:0;z-index:60;width:54px;height:54px;transform:translate(-50%,-50%);pointer-events:none;filter:drop-shadow(0 0 8px #d3ac6099)}.hand-cursor svg{width:54px;height:54px;transform:rotate(-90deg);fill:none}.cursor-base{stroke:#c9a86b55;stroke-width:1}#cursor-progress{stroke:var(--gold-light);stroke-width:1.7;stroke-dasharray:1;stroke-dashoffset:1}.hand-cursor>i{position:absolute;left:24px;top:24px;width:6px;height:6px;background:var(--gold-light);border-radius:50%;box-shadow:0 0 15px #f0dbaf}.hand-cursor #cursor-label{position:absolute;top:56px;left:50%;transform:translateX(-50%);font-size:8px;white-space:nowrap;color:var(--gold-light);letter-spacing:1px}.hand-cursor.pen-up{opacity:.45}.tour-indicator{position:fixed;left:4%;bottom:76px;z-index:30;font-size:8px;letter-spacing:1px;color:#b7aa92;display:flex;align-items:center;gap:8px;background:#090a0add;border:1px solid var(--line);padding:12px 14px;backdrop-filter:blur(12px)}.tour-indicator button{border:0;border-left:1px solid var(--line);background:none;color:var(--gold-light);font-size:8px;margin-left:6px;padding-left:12px}#loading-line{position:fixed;top:84px;left:4%;right:4%;height:2px;z-index:40;background:#b2914c22}#loading-line>span{width:25%;height:2px;background:var(--gold-light);display:block;animation:loading 1.4s infinite ease-in-out}#loading-line p{position:absolute;top:12px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:2px;color:#d7c59f}#toast{position:fixed;z-index:80;top:100px;left:50%;transform:translate(-50%,-15px);font-size:11px;padding:12px 23px;color:var(--gold-light);background:#0c0d0cf2;border:1px solid var(--line);opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;max-width:80vw;text-align:center;line-height:1.8}#toast.visible{opacity:1;transform:translate(-50%,0)}#fly-glyph{position:fixed;z-index:44;pointer-events:none;opacity:0;font-family:var(--serif);color:var(--gold-light);display:grid;place-items:center;line-height:1;text-shadow:0 0 60px #d7ac5377}.completion{position:fixed;z-index:40;inset:84px 0 57px;background:#08090adb;backdrop-filter:blur(17px);display:grid;place-items:center;animation:appear .7s ease}.completion-inner{text-align:center;display:flex;flex-direction:column;align-items:center;gap:23px}.completion h2{font-size:36px;letter-spacing:4px}.completion p{font-size:11px;color:#b6a993;letter-spacing:2px}#finished-glyph{height:220px;width:220px;background:radial-gradient(ellipse,#d7ac5414,transparent 70%)}#finished-glyph svg{width:100%;height:100%}.completion .hand-action{margin-top:10px;padding:15px 35px}.fade-away{animation:disappear .4s ease forwards}.step-current{fill:var(--gold-light)}.line-stroke-active{animation:stroke-line 1.4s ease both}.fill-stroke-active{animation:stroke-fill 1.4s ease both}
@keyframes appear{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes disappear{to{opacity:0;transform:translateY(-10px)}}@keyframes breathe{50%{opacity:.35}}@keyframes wave{to{transform:scaleY(.3)}}@keyframes loading{0%{transform:translateX(0);opacity:.3}50%{opacity:1}100%{transform:translateX(300%);opacity:.3}}@keyframes draw-preview{0%,15%{stroke-dashoffset:220}75%,100%{stroke-dashoffset:0}}@keyframes stroke-line{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes stroke-fill{from{opacity:.1}to{opacity:1}}
@media(min-width:1600px){.language-row{min-height:173px;margin-top:33px}.language-choice{padding:22px 15px}.language-choice h2{font-size:40px}.choice-gesture{margin-top:9px}.mode-preview,.write-preview{height:240px}.mode-choice{min-height:400px}.mode-row{margin-top:35px}.writing{gap:27px}.writing-title h1{font-size:38px}.practice-square{width:clamp(260px,calc(100svh - 435px),470px);height:clamp(260px,calc(100svh - 435px),470px)}.stroke-steps{min-height:75px}.stroke-step{width:58px}.stroke-step svg{max-width:53px;height:53px}}
@media(max-height:760px) and (min-width:761px){.site-header{height:67px}.screen{inset:90px 5% 65px}.home{gap:13px}.home h1{font-size:66px}.language-row{margin-top:12px;min-height:125px}.language-choice{padding:10px}.language-choice h2{font-size:29px}.setup-panel{bottom:66px;padding:13px 23px}.setup-copy h2{font-size:19px}.setup-open .home{padding-bottom:127px}.mode-row{margin-top:5px}.modes{gap:11px}.mode-preview,.write-preview{height:154px}.mode-choice{min-height:284px}.mode-choice h2{margin:8px 0;font-size:26px}.section-title{font-size:35px}.back-action,.voice-action{top:78px}.writing{inset:94px 10% 62px;gap:9px}.writing-title h1{font-size:24px}.practice-square{width:220px;height:220px}.writing-panels{gap:6vw}.reference-panel,.drawing-panel{gap:7px}.stroke-step svg{height:37px;width:37px}.stroke-steps{min-height:48px}.panel-heading{padding-bottom:8px}.lesson-actions .hand-action,.drawing-actions .hand-action{padding:6px 12px;min-height:29px}.camera-panel{width:120px;bottom:70px}.camera-image{height:86px}.camera-caption{font-size:7px}.site-footer{height:48px}.completion{inset:67px 0 48px}#loading-line{top:67px}.control .section-heading,.pick .section-heading{top:38px}.character-cloud{inset:154px 15% 40px}.section-heading h1{font-size:36px}}
@media(max-width:1050px){.wordmark{font-size:19px;gap:12px}.brand-en{display:none}.header-right .edition{display:none}.language-row{width:78vw}.control-readout{top:170px;right:0;gap:9px}.control-readout #force-label{font-size:19px}.control-readout #force-subtitle{max-width:150px;text-align:right;line-height:1.5}.particle-caption{display:none}.gesture-strip{width:61vw}.next-experience{right:-2%;width:110px;font-size:9px}.camera-panel{left:2%;width:115px}.camera-image{height:84px}.camera-caption>span:last-child{display:none}.writing{left:8%;right:8%}.writing-panels{gap:5vw}.panel-heading small{font-size:7px}.drawing-panel:before{left:-2.5vw}.site-footer #footer-hint{font-size:8px;letter-spacing:1px}.site-footer #footer-status{min-width:160px;font-size:8px}.mode-row{gap:30px}.mode-choice+.mode-choice:before{left:-15px}.character-cloud{left:8%;right:8%}}
@media(max-width:760px){.site-header{left:6%;right:6%;height:65px}.wordmark{font-size:18px;gap:10px;letter-spacing:3px}.brand-mark{width:27px;height:29px;font-size:16px}.wordmark i{display:none}.header-right{font-size:8px;letter-spacing:.5px;gap:7px}.header-right #language-badge{display:none}.screen{inset:85px 6% 85px}.home{gap:19px}.home h1{font-size:clamp(52px,10vw,73px);letter-spacing:4px;line-height:1.22}.eyebrow{font-size:8px;letter-spacing:2px}.intro{font-size:10px;letter-spacing:1px;max-width:86vw}.language-row{width:100%;min-height:143px;margin-top:12px}.language-choice{gap:10px;padding:15px 5px}.language-choice h2{font-size:26px;letter-spacing:0}.roman{font-size:6px;letter-spacing:2px}.choice-gesture{font-size:8px;gap:5px;letter-spacing:0;flex-direction:column}.gesture-icon{width:19px;height:22px}.instruction{font-size:8px;letter-spacing:1.5px;line-height:1.8}.setup-open .home{padding-bottom:200px}.setup-open .home h1{font-size:51px}.setup-open .home .intro{display:none}.setup-open .home .eyebrow{display:none}.setup-panel{bottom:64px;width:88vw;gap:16px;flex-direction:column;padding:17px 19px}.setup-copy{width:100%}.setup-copy h2{font-size:20px;margin:5px 0}.setup-copy p{font-size:9px}.setup-actions{flex:auto;width:100%;display:grid;grid-template-columns:1.2fr 1fr;gap:12px}.setup-actions>small{grid-column:1/-1;margin-top:-4px;font-size:7px}.start-button{min-height:36px;font-size:10px;padding:0 11px}.tour-button{font-size:9px;align-items:center}.voice-opt{font-size:8px}.voice-opt small{font-size:7px}.site-footer{left:6%;right:6%;height:49px;font-size:7px}.site-footer #footer-status{min-width:auto;letter-spacing:.5px;gap:7px}.site-footer #footer-hint{display:none}.page-number{font-size:9px}.back-action,.voice-action{top:76px;min-height:27px;font-size:8px;padding:4px 9px}.modes{gap:12px;top:125px}.modes .section-title{font-size:27px;letter-spacing:2px}.modes .eyebrow{font-size:6px;letter-spacing:1.8px}.mode-row{width:100%;gap:14px;margin-top:9px}.mode-choice{min-height:280px;padding:14px 7px 11px}.mode-choice+.mode-choice:before{left:-7px}.mode-choice h2{font-size:22px;letter-spacing:2px}.mode-choice p{font-size:8px;line-height:1.8;letter-spacing:.5px;min-height:30px}.mode-preview,.write-preview{height:148px}.write-preview>span{font-size:112px}.mini-grid{width:112px;height:112px}.mode-bottom{font-size:8px;gap:6px;letter-spacing:.5px}.mode-bottom .arrow-diagonal{font-size:18px}.choice-no{font-size:8px;letter-spacing:1px}.section-heading{top:40px;left:0}.section-heading h1{font-size:32px;letter-spacing:2px}.section-heading p{font-size:9px;letter-spacing:.5px;max-width:80vw}.section-heading .eyebrow{font-size:7px;letter-spacing:2px}.control-readout{top:172px;right:0}.control-readout #force-label{font-size:15px}.control-readout #force-subtitle{font-size:7px}.gesture-strip{width:100%;bottom:40px}.gesture-state{padding:10px 4px;min-height:70px;gap:2px 6px}.gesture-state b{font-size:9px}.gesture-state>span:last-child{font-size:7px;letter-spacing:.5px}.next-experience{right:0;bottom:-1px;width:145px;height:32px;min-height:30px;flex-direction:row;border:none;gap:6px;font-size:9px}.next-experience small{display:none}.next-experience>span:not(.action-progress){position:static}.camera-panel{bottom:58px;left:6%;width:79px}.camera-image{height:54px}.camera-caption{font-size:6px;height:20px;padding:0 5px;gap:4px}.camera-caption .live-dot{width:3px;height:3px}#camera-no-hand{font-size:6px}.character-cloud{inset:180px 0 70px}.character-option{width:95px;height:100px}.character-option .select-letter{font-size:59px}.letter-reading{font-size:7px!important}.pick-bottom{width:100%;bottom:28px;font-size:7px;letter-spacing:1px}.writing{inset:121px 5% 107px;justify-content:flex-start;gap:16px}.writing-title .eyebrow{font-size:6px;letter-spacing:1.4px}.writing-title h1{font-size:23px;letter-spacing:2px;margin-top:8px}.writing-panels{gap:6vw;align-items:start}.reference-panel,.drawing-panel{gap:9px}.panel-heading{flex-wrap:wrap;gap:5px;min-height:55px;padding-bottom:7px}.panel-heading>span{font-size:7px}.panel-heading h2{font-size:15px;letter-spacing:1px}.panel-heading small{flex-basis:100%;font-size:7px;min-height:9px;margin:0}.practice-square{width:100%;height:auto;aspect-ratio:1;min-height:0}.character-definition{flex-wrap:wrap;justify-content:center;gap:5px 9px;min-height:43px;font-size:9px}.character-definition #character-meaning{flex-basis:100%;text-align:center;font-size:8px}.definition-rule{display:none}.character-definition>span:first-child{font-size:16px}.stroke-steps{gap:4px;min-height:49px;flex-wrap:wrap;max-height:none}.stroke-step{width:28px;gap:3px}.stroke-step svg{width:28px;height:28px}.stroke-step span{font-size:7px}.lesson-actions{flex-direction:column;width:100%;gap:6px}.lesson-actions .hand-action{padding:7px 10px;font-size:8px;min-height:30px}.ink-tip{font-size:10px;letter-spacing:1px;gap:7px}.ink-tip small{font-size:7px;letter-spacing:0}.writing-meta{flex-direction:column;gap:7px;min-height:43px;font-size:7px;align-items:center}.drawing-actions{flex-wrap:wrap;gap:6px;padding-top:0}.drawing-actions .hand-action{padding:7px 8px;min-height:30px;font-size:8px;flex:1;white-space:nowrap}.drawing-actions [data-action=complete]{flex-basis:100%}.change-letter{font-size:8px;margin-top:0}.tour-indicator{left:6%;bottom:62px;font-size:7px;padding:9px 10px;gap:5px}.tour-indicator button{font-size:7px;padding-left:8px;margin-left:2px}#loading-line{top:65px}#loading-line p{font-size:8px;white-space:nowrap}.completion{inset:65px 0 49px}.completion h2{font-size:27px}.completion-inner{gap:20px}#finished-glyph{width:180px;height:180px}.completion p{font-size:9px}.hand-cursor{width:44px;height:44px}.hand-cursor svg{width:44px;height:44px}.hand-cursor>i{top:19px;left:19px}.hand-cursor #cursor-label{top:47px;font-size:7px}#toast{top:110px;font-size:9px;padding:10px 17px;max-width:85vw;width:max-content}.sound-wave{height:12px;gap:2px}}
@media(prefers-reduced-motion:reduce){.screen,.completion,.write-preview svg path,.signal.live{animation:none}.line-stroke-active,.fill-stroke-active{animation-duration:.1s}.grain{display:none}}

.footer-end{display:flex;align-items:center;gap:24px}.credits-action{border:0;font-size:8px;padding:6px 10px;min-height:28px;color:#8f826a}.credits-inner{gap:19px;max-width:85vw}.credits-inner p{font-size:10px;line-height:1.9;letter-spacing:.8px}.credits-inner h2{font-size:28px}.credits-inner .hand-action{margin-top:0}@media(max-width:760px){.footer-end{gap:8px}.credits-action{font-size:7px;padding:5px}.credits-inner{gap:17px}.credits-inner p{font-size:8px}.credits-inner h2{font-size:23px}}