:root{font-family:-apple-system,BlinkMacSystemFont,"PingFang HK","Microsoft JhengHei",sans-serif;color:#f6ebd1;background:#0a1c23;--gold:#efd198;--ink:#142e32;--muted:#c2cec7;font-synthesis:none}*{box-sizing:border-box}body{margin:0;font-size:16px;line-height:1.6}button,input,textarea{font:inherit}button{cursor:pointer;min-height:44px;color:inherit;border:0;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.4;cursor:default}button:hover:not(:disabled){filter:brightness(1.13)}button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #f1c777;outline-offset:4px}[hidden]{display:none!important}.arena{position:relative;height:100svh;min-height:680px;width:100%;overflow:hidden;background:#153f42;isolation:isolate}.world,.forest-backdrop,.atmosphere,.scene-vignette{position:absolute;inset:0;pointer-events:none}.world{z-index:0;transform-origin:50% 65%}.forest-backdrop{inset:-3%;background-image:url('forest.webp');background-size:cover;background-position:center 58%;filter:brightness(.73) saturate(.85);transform:scale(1.02)}.atmosphere{background:linear-gradient(90deg,#061b284f,transparent 60%),radial-gradient(ellipse at 75% 42%,#acded015,transparent 65%)}.ground-light{position:absolute;width:400px;height:70px;background:radial-gradient(ellipse,#a2cbaa38,transparent 65%);right:5%;bottom:12%;filter:blur(8px)}.scene-vignette{z-index:1;background:linear-gradient(180deg,#03141cdb,transparent 32%,transparent 63%,#04191bf0),linear-gradient(90deg,#051c2777,transparent 80%)}.character-wrap{position:absolute;right:4%;bottom:11%;height:76%;width:37%;transform-origin:50% 92%;animation:npcBreath 5s ease-in-out infinite}.character{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 12px 22px #031820ad);user-select:none;-webkit-user-drag:none}.opponent-aura{position:absolute;right:9%;bottom:15%;width:22%;height:46%;border-radius:50%;background:radial-gradient(ellipse,#45dbc322,transparent 70%);opacity:0;transition:opacity .6s}.arena[data-kind=enemy] .forest-backdrop{filter:brightness(.57) saturate(.75) hue-rotate(10deg)}.arena[data-kind=enemy] .opponent-aura{opacity:1}.arena canvas{position:absolute;inset:0;width:100%;height:100%;display:block;background:transparent;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#inkCanvas{z-index:3;cursor:crosshair;transform-origin:50% 60%}#inkEffects{z-index:4;pointer-events:none}.hud-top{position:absolute;top:0;left:0;right:0;z-index:6;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:calc(18px + env(safe-area-inset-top)) max(30px,env(safe-area-inset-right)) 12px max(30px,env(safe-area-inset-left));pointer-events:none}.game-mark{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:700;letter-spacing:.1em;text-shadow:0 2px 10px #082027}.seal{display:grid;place-items:center;width:44px;height:48px;border:1px solid #c6ad7877;font-size:27px;font-family:serif;color:var(--gold);background:#13342c66}.game-mark small{display:block;color:#c6d7c8;font-size:12px;letter-spacing:.12em;font-weight:500}.header-actions{display:flex;gap:10px;pointer-events:auto}.hud-button{background:#0a232c8c;border:1px solid #b1c9b336;border-radius:6px;padding:8px 16px;font-size:14px;backdrop-filter:blur(10px)}.hud-button.square{width:44px;padding:6px;font-size:23px}.encounter-status{position:absolute;right:7%;top:105px;z-index:2;width:25%;text-align:center;pointer-events:none;text-shadow:0 2px 12px #021a20}.encounter-type{font-size:12px;color:#d5ca9c;letter-spacing:.16em}.encounter-status h1{font-size:22px;font-family:serif;margin:3px 0 10px;font-weight:600;letter-spacing:.13em}.opponent-health{height:5px;width:100%;background:#02131cad;border:1px solid #bccab74f;border-radius:5px;overflow:hidden}.opponent-health>div{height:100%;width:100%;background:linear-gradient(90deg,#528d80,#c9dfb6);transition:width .7s}.arena[data-kind=enemy] .opponent-health>div{background:linear-gradient(90deg,#397f94,#84c9d1)}#roundLabel{font-size:12px;letter-spacing:.06em;color:#ccdbcf;display:block;margin-top:7px}.dialogue{position:absolute;top:111px;left:4.5%;width:47%;max-width:600px;z-index:5;pointer-events:none;text-shadow:0 2px 5px #021721,0 0 18px #031722;background:linear-gradient(90deg,#091e289e,#0b212747,transparent);padding:14px 17px 18px 20px;border-left:2px solid #cbb2739c}.speaker-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.speaker{color:#f2d39a;font-weight:700;font-size:16px;letter-spacing:.08em}#modeLabel{font-size:12px;color:#b7cbcb}.scene-text{font-size:14px;line-height:1.85;color:#d1dfdb;margin:9px 0 4px;max-width:490px}.question-text{font-size:23px;line-height:1.8;color:#fffae9;margin:7px 0 0;font-weight:500;letter-spacing:.03em}.blank{display:inline-block;min-width:70px;border-bottom:2px solid #dfc695;margin:0 4px;line-height:1.5}.floating-example{font-family:serif;font-size:39px;letter-spacing:.22em;color:#ffe3a4;line-height:1.5;margin-top:6px}.floating-example:empty{display:none}.listen{pointer-events:auto;border:1px solid #d4c19755;border-radius:20px;background:#17372ea1;color:var(--gold);font-size:13px;padding:5px 13px;min-height:36px}.word-bank,.rune-fragments{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.word-bank:empty,.rune-fragments:empty{display:none}.word-pill{font-family:serif;font-size:19px;padding:1px 10px;border-bottom:1px solid #dfc1846e;color:#ffe3a9}.rune-fragments span{display:grid;place-items:center;width:38px;min-height:38px;border:1px solid #dece8c52;background:#123c3c73;transform:rotate(-5deg);font-family:serif;font-size:24px;color:#fff3be}.rune-fragments span:nth-child(2n){transform:rotate(7deg)}.hint{color:#e5d49b;font-size:14px;line-height:1.7;margin-top:12px}.hint:empty{display:none}.air-cue{position:absolute;left:27%;top:57%;transform:translate(-50%,-50%);z-index:2;text-align:center;color:#dce8dbb5;pointer-events:none;text-shadow:0 2px 10px #031824}.air-cue span{font-size:40px;color:#e9c685}.air-cue p{font-size:15px;line-height:2;letter-spacing:.15em;margin:0}.npc-caption{position:absolute;bottom:22%;right:5%;width:31%;z-index:2;pointer-events:none;text-align:center;font-size:13px;letter-spacing:.07em;color:#d4e9d8;text-shadow:0 2px 8px #061d27}.hud-bottom{position:absolute;bottom:0;left:0;right:0;z-index:6;display:grid;grid-template-columns:160px 1fr minmax(210px,290px);gap:24px;align-items:end;padding:35px max(30px,env(safe-area-inset-right)) calc(22px + env(safe-area-inset-bottom)) max(30px,env(safe-area-inset-left));background:linear-gradient(0deg,#071a20f2,#071a20a6,transparent);pointer-events:none}.hud-bottom button{pointer-events:auto}.player-state>span{font-size:13px;letter-spacing:.12em;color:#d9dbc0}.player-state small{display:block;font-size:12px;color:#aec7c0;line-height:1.7;margin-top:7px;max-width:170px}.ward-pips{display:flex;gap:8px;margin-top:9px}.ward-pips span{display:block;width:29px;height:5px;background:#7ebea7;box-shadow:0 0 10px #77baa344;border-radius:3px}.ward-pips .empty{background:#3b5758;box-shadow:none}.battle-tools{display:flex;justify-content:center;gap:12px}.tool-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:53px;background:transparent;font-size:12px;color:#d2ddca}.tool-button>span{display:grid;place-items:center;width:44px;height:44px;border:1px solid #becfb258;background:#123233ad;border-radius:50%;font-size:25px;line-height:1;color:#e3d5aa;box-shadow:0 0 20px #153b342b}.dodge>span{color:#b4e8e3;border-color:#70acac88}.cast-controls{display:flex;flex-direction:column;align-items:flex-end;gap:7px}.feedback{font-size:13px;line-height:1.7;color:#cedbcc;text-align:right;margin:0;max-width:290px}.feedback.error{color:#ffc0a8}.feedback.success{color:#d8efb7}.cast-button{min-height:56px;min-width:218px;display:flex;align-items:center;justify-content:space-between;gap:23px;padding:10px 23px;color:#fff1c9;background:linear-gradient(110deg,#47654ecc,#204e46ee);border:1px solid #c3b977a3;border-radius:5px;font-size:18px;font-weight:650;letter-spacing:.07em;box-shadow:inset 0 0 16px #c6cd7320,0 4px 18px #071920}.cast-button>span{font-size:25px;color:#ffda8e}.ink-review{position:absolute;z-index:8;right:4.5%;bottom:24%;width:min(350px,38%);padding:18px 20px;color:#f5e9c7;border-left:2px solid #d9be78;background:linear-gradient(100deg,#0a2634f2,#0e303ade);box-shadow:0 10px 50px #00162155;backdrop-filter:blur(12px)}.ink-review p{font-size:14px;margin:5px 0 10px}.ink-reference{font-family:serif;font-size:34px;letter-spacing:.14em;color:#ffe2a0}.review-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.ink-review button{min-height:44px;font-size:14px}.ink-review .primary{padding:8px 15px}.danger-cue{position:absolute;right:7%;top:40%;z-index:7;max-width:270px;padding:9px 16px;background:#432c36dc;border:1px solid #e1b4a463;border-radius:5px;color:#ffded0;font-size:15px;pointer-events:none}.enemy-projectile{position:absolute;left:77%;top:47%;width:36px;height:36px;border-radius:50%;opacity:0;background:radial-gradient(circle,#e4eafe,#8ba1ed 25%,#697cd98a 55%,transparent 70%);filter:drop-shadow(0 0 22px #a1ade3)}.ward-effect{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at 45% 70%,transparent 20%,#71bdae25 49%,#90d8c679 50%,transparent 51%)}.impact-word{position:absolute;left:76%;top:39%;opacity:0;font-family:serif;font-size:38px;letter-spacing:.1em;color:#fff1b5;text-shadow:0 0 22px #eccf83;transform:translate(-50%,-50%)}.arena[data-phase=warning] .opponent-aura{background:radial-gradient(ellipse,#879fe150,transparent 65%);opacity:1}.arena[data-phase=warning] .enemy-projectile{opacity:1;animation:orbGather 1s ease-in-out infinite}.arena[data-phase=blocked] .enemy-projectile{animation:orbApproach .65s ease-in both}.arena[data-phase=blocked] .ward-effect{animation:wardBlock .85s ease-out}.arena[data-phase=dodge] .world{animation:dodgeCamera .65s ease-out}.arena[data-phase=dodge] .enemy-projectile{animation:orbMiss .6s ease-out}.arena[data-phase=release] #inkCanvas{animation:inkRelease .95s cubic-bezier(.45,0,.7,1) forwards}.arena[data-phase=release] .character-wrap{animation:npcImpact .95s ease-out}.arena[data-phase=release] .impact-word{animation:wordImpact 1.1s ease-out}.arena[data-phase=enter] .world{animation:advanceCamera .85s ease-out}.arena.writing .ward-effect{opacity:.16}.arena.focus .enemy-projectile{display:none}.arena.action-paused .enemy-projectile{animation-play-state:paused}.arena.reviewing .dialogue{opacity:.65}.arena[data-kind=mentor] .danger-cue{display:none}@keyframes npcBreath{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.012)}}@keyframes orbGather{0%,100%{transform:scale(.7)}50%{transform:scale(1.1)}}@keyframes orbApproach{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(-38vw,23vh) scale(8)}}@keyframes orbMiss{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:translate(35vw,22vh) scale(5)}}@keyframes wardBlock{0%,100%{opacity:0}40%{opacity:.65}}@keyframes dodgeCamera{0%,100%{transform:translateX(0)}40%{transform:translateX(-5%) rotate(-1deg)}}@keyframes inkRelease{0%{transform:translate(0,0) scale(1);opacity:1}70%{opacity:1}100%{transform:translate(26%,-14%) scale(.08);opacity:0}}@keyframes npcImpact{0%,35%,100%{transform:translateX(0)}55%{transform:translateX(20px) scale(.97)}}@keyframes wordImpact{0%,40%{opacity:0;transform:translate(-50%,-50%) scale(.6)}65%{opacity:1}100%{opacity:0;transform:translate(-50%,-80%) scale(1.3)}}@keyframes advanceCamera{0%{transform:scale(.97);filter:brightness(.5)}100%{transform:scale(1);filter:brightness(1)}}
dialog{border:1px solid #9cae9955;border-radius:15px;background:#102a32;color:#edf0d9;padding:27px;width:min(570px,calc(100vw - 28px));max-height:90dvh;box-shadow:0 20px 90px #02121980}dialog::backdrop{background:#04171ec7;backdrop-filter:blur(5px)}.wide-dialog{width:min(850px,calc(100vw - 28px))}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.dialog-head .close-dialog{background:transparent;font-size:25px;width:44px}.eyebrow{font-size:12px;color:#c8bc93;letter-spacing:.14em}dialog h2{font-family:serif;font-size:27px;margin:4px 0 11px}dialog p{font-size:15px;line-height:1.8}dialog input,dialog textarea{width:100%;background:#f3f4e9;color:#173a3a;padding:10px 12px;border:1px solid #adc3b1;border-radius:7px}dialog textarea{font-size:15px;line-height:1.8;resize:vertical;margin-top:10px}.input-label{display:block;font-size:14px;font-weight:600;margin-top:10px}.input-note{color:#b6c8bd;font-size:13px!important;line-height:1.8}.quiet{background:transparent;padding:8px 12px;border:1px solid #c4d0b329;border-radius:5px;font-size:14px}.primary{background:#35685c;color:#fff5d7;border:1px solid #b2c18866;padding:10px 19px;border-radius:6px;font-size:15px;font-weight:650}.dialog-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:flex-end;margin-top:17px}.file-button{font-size:14px;border:1px solid #c4d0b344;padding:9px 12px;cursor:pointer}.editor-error{color:#ffbe9e;white-space:pre-line;font-size:14px}summary{cursor:pointer;min-height:44px;padding:10px 0;font-size:14px}.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:15px 0}.summary-item{text-align:center;padding:14px 8px;background:#203f44;border-radius:8px;font-size:13px}.summary-item strong{display:block;font-size:28px;color:#e7d4a3}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px;white-space:nowrap}th,td{padding:10px 12px;border-bottom:1px solid #a6c2b52c;text-align:center}th:first-child,td:first-child{text-align:left}th{background:#1c3e45}.result-spark{font-size:54px;color:var(--gold)}#resultDialog{text-align:center}.map-dialog nav{display:flex;flex-direction:column;gap:9px;margin:17px 0}.mode-button{display:flex;align-items:center;gap:14px;text-align:left;background:#17363d;border:1px solid #9cbfb12e;border-radius:8px;padding:13px 15px;width:100%}.mode-button.active{border-color:#d1be81;background:#2b4944}.mode-number{font-family:serif;color:#dfc38e;font-size:24px}.mode-title{display:block;font-size:16px}.mode-sub{display:block;font-size:12px;color:#b0c6be}.saved-check{margin-left:auto;color:#d3daa2}.map-actions{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.toast{position:fixed;left:50%;top:90px;transform:translateX(-50%);max-width:88vw;z-index:30;background:#1e4245f5;color:#f2eed6;border:1px solid #b4c6a65c;border-radius:8px;padding:12px 20px;font-size:14px;box-shadow:0 5px 20px #02161d66}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1500px){.dialogue{top:135px}.question-text{font-size:26px}.character-wrap{right:8%;height:78%}.encounter-status{right:11%;width:23%}}
@media(max-width:1050px){.hud-top{padding-left:22px;padding-right:22px}.dialogue{top:107px;left:3%;width:52%;padding-left:14px}.question-text{font-size:21px}.character-wrap{right:0;width:44%;height:73%;bottom:14%}.encounter-status{right:5%;width:28%}.hud-bottom{padding-left:22px;padding-right:22px;gap:15px;grid-template-columns:135px 1fr 230px}.battle-tools{gap:7px}.tool-button{min-width:47px}.cast-button{min-width:210px;font-size:17px}.npc-caption{bottom:26%;right:2%;width:34%}.scene-text{font-size:13px}}
@media(max-width:700px){.arena{height:100svh;min-height:810px}.hud-top{padding:calc(13px + env(safe-area-inset-top)) 15px 10px}.game-mark{font-size:16px;gap:8px}.seal{width:35px;height:40px;font-size:23px}.game-mark small{font-size:11px}.hud-button{font-size:13px;padding:8px 11px}.header-actions{gap:6px}.hud-button.square{width:39px}.dialogue{top:102px;left:4%;width:91%;max-width:unset;padding:8px 12px 10px}.speaker{font-size:15px}.speaker-line{gap:8px}.scene-text{font-size:13px;line-height:1.65;margin:6px 0}.question-text{font-size:20px;line-height:1.75}.floating-example{font-size:33px}.encounter-status{top:auto;bottom:48%;right:4%;width:40%;text-align:right}.encounter-status h1{font-size:18px;margin:1px 0 7px}.encounter-type,#roundLabel{font-size:11px}.character-wrap{right:-7%;bottom:19%;width:63%;height:48%}.ground-light{width:220px;right:-2%;bottom:18%}.npc-caption{right:2%;bottom:26%;width:45%;font-size:12px}.air-cue{left:29%;top:55%}.air-cue p{font-size:13px}.hud-bottom{grid-template-columns:1fr 1fr;gap:13px;padding:24px 16px calc(16px + env(safe-area-inset-bottom))}.player-state{align-self:center}.player-state small{display:none}.player-state>span{font-size:12px}.battle-tools{justify-content:flex-end;gap:6px}.tool-button{min-width:37px;font-size:11px}.tool-button>span{width:38px;height:38px;font-size:22px}.cast-controls{grid-column:1 / -1;display:grid;grid-template-columns:1fr minmax(170px,47%);gap:12px;align-items:center}.feedback{font-size:12px;text-align:left}.cast-button{min-width:0;width:100%;min-height:52px;padding:8px 13px;font-size:16px;gap:8px}.ward-pips{gap:7px}.ward-pips span{width:24px}.ink-review{right:4%;bottom:25%;width:65%;padding:14px 16px}.ink-review p{font-size:13px}.ink-reference{font-size:30px}.danger-cue{top:auto;bottom:41%;right:4%;max-width:220px;font-size:13px}.rune-fragments span{width:32px;min-height:32px;font-size:21px}.word-pill{font-size:17px;padding:1px 7px}.hint{font-size:13px;margin-top:7px}.summary-grid{gap:7px}.summary-item{font-size:12px;padding:10px 5px}dialog{padding:22px 18px}dialog h2{font-size:24px}.forest-backdrop{background-position:38% center}.enemy-projectile{left:78%;top:60%}.impact-word{top:58%;left:77%;font-size:30px}}
@media(max-height:620px) and (min-width:701px){.arena{min-height:620px}.character-wrap{height:70%;bottom:12%}.dialogue{top:92px}.scene-text{font-size:12px}.question-text{font-size:19px}.encounter-status{top:97px}.hud-bottom{padding-bottom:16px}.floating-example{font-size:31px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.arena[data-phase=release] .impact-word{opacity:1}.arena[data-phase=warning] .enemy-projectile{opacity:.8}.arena[data-phase=dodge] .world{transform:translateX(-2%)}.arena[data-phase=release] #inkCanvas{opacity:.5}}

.arena[data-phase=resolved] #inkCanvas{opacity:0}.arena[data-kind=enemy][data-cleared=true] .character-wrap{opacity:.25;transition:opacity .7s}.arena[data-cleared=true] .opponent-aura{opacity:0}
@font-face{font-family:HKKai;src:url('hk-kai.ttf') format('truetype');font-display:swap}.floating-example,.ink-reference,.word-pill,.rune-fragments{font-family:HKKai,'Noto Serif TC',serif}
.ink-journey{position:absolute;z-index:8;bottom:152px;left:5%;display:flex;align-items:center;gap:12px;max-width:85%;flex-wrap:wrap;pointer-events:none}.ink-journey button{pointer-events:auto}.glyph-tray{display:flex;gap:6px}.glyph-chip{position:relative;background:#102a31b8;border:1px solid #ccb07770;width:55px;height:60px;border-radius:10px}.glyph-chip.active{border-color:#ffe3a0}.glyph-chip canvas{width:48px;height:48px}.glyph-chip span{position:absolute;left:4px;top:2px;font-size:12px}.ink-journey>span{font-size:14px;color:#ead7ae}.sync-status{position:absolute;z-index:9;bottom:8px;left:25px;font-size:12px;max-width:75%;color:#b7d7d4}.sync-status[data-status=error]{color:#ffcbbd}.teacher-feedback{position:absolute;z-index:10;right:4%;top:140px;max-width:280px;padding:14px;background:#173e44ed;border:1px solid #efd599;border-radius:12px}.answer-ink{width:100%;height:auto}.teacher-link{display:block;color:#ffe2a2;padding:14px 0}#classDialog label{display:block;margin:15px 0 6px}#classDialog input,#classDialog select{width:100%;padding:12px;font-size:16px;margin-bottom:14px}#glyphStatus{background:#11292eaa;padding:6px 10px;border-radius:6px}.ink-review h2{font-size:21px}.ink-review p{font-size:16px}
@media(max-width:700px){.ink-journey{bottom:220px;left:4%;gap:6px}.ink-journey>span{font-size:12px}.glyph-chip{width:43px;height:45px}.glyph-chip canvas{width:38px;height:38px}.teacher-feedback{top:100px;right:3%;font-size:14px}.header-actions .hud-button{padding:7px 8px}#sealGlyph{font-size:14px}}