:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#17241b;background:#edf3e8;--panel:#fff;--line:#d8e3d3;--soft:#60705f;--accent:#245c3d;--shadow:0 18px 50px rgba(35,62,42,.12)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#fbfff7,#edf3e8 60%,#e3ecdd)}button{font:inherit}.app-shell{width:min(1320px,calc(100% - 28px));margin:auto;padding:24px 0 50px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}.eyebrow{font-size:.7rem;font-weight:900;letter-spacing:.15em;color:#65806b}.topbar h1{margin:2px 0 0;font-size:clamp(1.8rem,3vw,2.55rem)}.top-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.stat{display:grid;justify-items:center;min-width:68px;padding:7px 12px;border:1px solid var(--line);border-radius:13px;background:#ffffffcc}.stat span{font-size:.66rem;text-transform:uppercase;color:var(--soft)}.stat strong{font-size:1.2rem}.button,.icon-button,.mobile-controls button,.answer{border:0;cursor:pointer}.button{padding:10px 14px;border-radius:12px;font-weight:850}.button.secondary{background:var(--accent);color:white}.button.ghost,.icon-button{background:#eef2ec;color:#354438}.game-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,.72fr);gap:16px;align-items:start}.game-card,.learn-card{background:var(--panel);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);overflow:hidden}.game-hud{display:flex;justify-content:space-between;gap:18px;padding:12px 16px;background:#f8fbf6;border-bottom:1px solid var(--line)}.game-hud div{display:grid;gap:2px}.game-hud span{font-size:.8rem;color:var(--soft)}.hud-right{text-align:right}#gameCanvas{display:block;width:100%;height:auto;image-rendering:pixelated;background:#bfe1a3}.learn-card{padding:20px}.learn-card h2{margin:6px 0 8px;line-height:1.13}.learn-card p{color:#566554;line-height:1.5}.area-card,.quest-card,.last-learned{border:1px solid var(--line);border-radius:15px;background:#f8fbf6;padding:14px;margin-top:12px}.area-card{display:flex;align-items:center;gap:12px}.area-icon{font-size:2rem}.area-card div:last-child{display:grid}.area-card span,.meta{font-size:.82rem;color:var(--soft)}.quest-card{display:grid;gap:5px}.quest-progress{font-weight:850;color:#356b47}.last-learned.empty{color:#758274}.last-word{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center}.mini-native{font-size:1.7rem;font-weight:950}.audio-check{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}.audio-check summary{font-weight:850;cursor:pointer;margin-bottom:10px}.audio-toolbar{display:flex;gap:7px;flex-wrap:wrap}.audio-sliders{display:grid;gap:7px;margin:10px 0}.audio-sliders label{display:grid;grid-template-columns:60px 1fr;gap:8px;font-size:.82rem;font-weight:800}.audio-status{font-size:.82rem;color:var(--soft)}.mobile-controls{display:none;padding:12px;text-align:center;background:#f8fbf6;border-top:1px solid var(--line)}.mobile-controls button{width:54px;height:44px;margin:3px;border-radius:11px;background:#e5ede1;font-weight:900;color:#24462f}.interact-control{background:#d6ead8!important}.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:18px;background:rgba(14,25,17,.64);backdrop-filter:blur(6px)}.modal-panel{width:min(600px,100%);max-height:90vh;overflow:auto;background:white;border-radius:23px;padding:24px;box-shadow:0 30px 100px #0005}.encounter-panel,.dialog-panel{text-align:center}.creature-stage{width:192px;height:192px;margin:0 auto 14px;border-radius:24px;overflow:hidden;box-shadow:0 0 0 8px #e7f3e4}.creature-stage canvas{width:192px;height:192px;image-rendering:pixelated}.hangul{font-size:clamp(2.5rem,8vw,4.4rem);margin:4px 0 0}.pronunciation{font-size:1.18rem;font-weight:850;color:#42634b;margin-bottom:12px}.word-actions{margin:8px 0 18px}.challenge{font-weight:850}.answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.answer{min-height:54px;border-radius:13px;padding:10px;background:#edf4ea;font-weight:850;border:2px solid transparent}.answer.correct{background:#dff3e3;border-color:#5a9b68}.answer.wrong{background:#f8e1df;border-color:#bf645a}.feedback{min-height:26px;margin-top:12px;font-weight:850}.feedback.good{color:#2d7a43}.feedback.bad{color:#a3473f}.npc-portrait{font-size:4rem}.dialog-panel h2{margin:4px 0 12px}.dialog-korean{font-size:2.2rem;font-weight:950}.dialog-pronunciation{font-weight:850;color:#42634b}.dialog-english{font-size:1.15rem;margin-top:5px}.dialog-note{font-size:.82rem;color:var(--soft);margin:15px auto}.modal-heading{display:flex;justify-content:space-between;align-items:center}.icon-button{width:40px;height:40px;border-radius:11px}.dex-panel{width:min(900px,100%)}.dex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:11px;margin-top:16px}.dex-entry{border:1px solid var(--line);border-radius:14px;padding:13px;background:#fbfdf9;cursor:pointer}.dex-entry.locked{opacity:.46;filter:grayscale(1);cursor:default}.dex-entry .native{font-size:1.45rem;font-weight:950}.dex-entry .roman{font-size:.82rem;font-weight:850;color:#496151}.dex-entry .meaning{color:#647164}.dex-entry .mastery{margin-top:8px;font-size:.76rem;font-weight:850;color:#6b7869}@media(max-width:900px){.topbar{align-items:flex-start;flex-direction:column}.game-layout{grid-template-columns:1fr}.learn-card{order:-1}.mobile-controls{display:block}}@media(max-width:560px){.app-shell{width:min(100% - 16px,1320px);padding-top:10px}.learn-card{padding:15px}.game-hud{font-size:.9rem}.game-hud span{font-size:.7rem}.answer-grid{grid-template-columns:1fr}.modal-panel{padding:18px}.creature-stage{transform:scale(.88);margin-top:-8px;margin-bottom:0}}
.dialog-actions{margin:14px 0 6px}.dialog-credit{font-size:.7rem!important;color:#7a8579!important;max-width:430px;margin:8px auto 14px!important}.creature-stage{position:relative}

.word-audio-status{margin-top:7px;font-size:.78rem;font-weight:800;color:#60705f}

/* CK-0.3.3 encounter visual clarity */
.creature-stage{display:grid;place-items:center;background:linear-gradient(180deg,#fbfff8,#e8f3e3);border:2px solid #d9ead5;overflow:visible}
.creature-visual{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:6.4rem;line-height:1;opacity:1;filter:none;text-shadow:0 7px 18px rgba(36,92,61,.12);font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif}
.creature-visual.wide-cue{font-size:4.25rem;gap:.1em}
.creature-caption{display:inline-block;margin:-2px auto 12px;padding:4px 9px;border-radius:999px;background:#eef4eb;color:#526653;font-size:.56rem;font-weight:950;letter-spacing:.12em}

/* CK-0.4.0 Word Hunt */
.quest-hint{font-size:.78rem;color:var(--soft);line-height:1.35}.word-hunt-card{background:#f5faf1}.npc-quest-box{margin:16px auto 12px;padding:14px;border:1px solid var(--line);border-radius:15px;background:#f7fbf4;max-width:460px}.npc-quest-text{font-weight:800;line-height:1.45;margin:7px 0 11px}.npc-quest-box[hidden]{display:none}.object-panel{text-align:center}.object-visual{font-size:6rem;line-height:1;margin:2px 0 12px;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif}.world-target-pulse{animation:ckPulse 1.3s ease-in-out infinite}@keyframes ckPulse{50%{transform:scale(1.04)}}

/* CK-0.5.0 keyboard flow */
.key-hint{display:inline-flex;align-items:center;justify-content:center;margin-left:.45rem;padding:.08rem .38rem;border:1px solid currentColor;border-radius:.35rem;font-size:.72em;opacity:.65;vertical-align:middle}
#encounterContinue{margin-top:.75rem;min-width:10rem}

/* CK-0.6.0 mascot + title identity */
.title-screen{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 50% 10%,#dff4ff 0,#edf7e8 42%,#d8ead3 100%);overflow:auto}
.title-screen[hidden]{display:none}
.title-card{width:min(660px,100%);display:grid;justify-items:center;text-align:center;background:rgba(255,255,255,.94);border:1px solid #d2e2cf;border-radius:30px;padding:22px 26px 25px;box-shadow:0 30px 100px rgba(28,58,38,.24);backdrop-filter:blur(12px)}
.title-mascot{width:min(390px,72vw);aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 14px 22px rgba(28,58,38,.16));margin:-4px 0 -14px}
.title-copy h1{margin:3px 0 5px;font-size:clamp(2.25rem,7vw,4rem);line-height:.95}
.title-copy p{margin:8px 0 18px;color:#526653;font-weight:750;font-size:1.05rem}
.title-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;width:100%}
.title-actions .button{min-width:150px}
.title-primary{background:#f2b527;color:#17241b;box-shadow:0 8px 20px rgba(242,181,39,.28)}
.title-progress{margin-top:15px;font-size:.86rem;font-weight:850;color:#355c42}
.title-hint{margin-top:7px;font-size:.72rem;color:#6b7869}
.mascot-guide-card{display:grid;grid-template-columns:70px 1fr;gap:12px;align-items:center;margin-top:12px;padding:10px 12px;border:1px solid #d8e3d3;border-radius:15px;background:linear-gradient(135deg,#f9fff7,#eef8ff)}
.mascot-guide-card img{width:70px;height:70px;border-radius:18px;object-fit:cover;box-shadow:0 5px 14px rgba(36,92,61,.12)}
.mascot-guide-card strong{display:block;margin:2px 0 3px}
.mascot-guide-tip{font-size:.8rem;color:#60705f;line-height:1.35}
@media(max-width:560px){.title-card{padding:16px 14px 20px;border-radius:22px}.title-mascot{width:min(330px,80vw)}.title-actions{display:grid;grid-template-columns:1fr;width:100%}.title-actions .button{width:100%}.title-hint{display:none}}

/* CK-0.6.1 Korean Dex visual/progress pass */
.dex-entry{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;position:relative;overflow:hidden}
.dex-visual{width:92px;height:92px;display:grid;place-items:center;margin:0 auto 6px;border-radius:18px;background:linear-gradient(180deg,#f4fbf0,#e7f3e4);border:1px solid #dce9d7;font-size:3.7rem;line-height:1;overflow:hidden}
.dex-visual.wide-cue{font-size:2.25rem;letter-spacing:.02em}
.dex-visual.locked-visual{font-size:2.2rem;font-weight:950;color:#879386}
.dex-entry .native{margin-top:2px}
.dex-mastery-row{display:flex;gap:4px;justify-content:center;margin-top:7px}
.mastery-pip{width:26px;height:6px;border-radius:999px;background:#dfe8dc;border:1px solid #d4dfd0}
.mastery-pip.filled{background:#3b8152;border-color:#3b8152}
.dex-audio-button{margin-top:8px;border:0;border-radius:10px;padding:7px 10px;background:#e5f0e2;color:#255438;font-weight:850;cursor:pointer}
.dex-audio-button:hover,.dex-audio-button:focus-visible{background:#d7e9d3;outline:2px solid #83ad8b;outline-offset:2px}
.dex-entry.locked{display:flex}
@media(max-width:560px){.dex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dex-visual{width:76px;height:76px;font-size:3rem}.dex-visual.wide-cue{font-size:1.8rem}}

/* CK-0.7.0 progression */
.progression-panel{width:min(760px,100%)}
.progress-summary{margin-top:14px;padding:14px 16px;border:1px solid var(--line);border-radius:15px;background:#f5faf2;display:grid;gap:7px}
.xp-track{height:10px;background:#dce7d7;border-radius:999px;overflow:hidden}.xp-fill{height:100%;background:#4a8658;border-radius:999px}
.quest-log-list{display:grid;gap:10px;margin-top:14px}.quest-log-item{border:1px solid var(--line);border-radius:15px;padding:14px;background:#fbfdf9;display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center}.quest-log-icon{font-size:1.8rem}.quest-log-item strong{display:block}.quest-log-item span{display:block;color:var(--soft);font-size:.84rem;margin-top:2px}.quest-status{font-size:.75rem;font-weight:900;padding:6px 9px;border-radius:999px;background:#edf2ea;color:#526253;white-space:nowrap}.quest-status.complete{background:#dff1df;color:#276139}.quest-status.active{background:#fff2ce;color:#775b0f}
.progression-copy{color:var(--soft);line-height:1.5}.satchel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:11px;margin-top:14px}.satchel-item{border:1px solid var(--line);border-radius:15px;padding:15px;background:#fbfdf9;text-align:center}.satchel-item .reward-visual{font-size:3rem}.satchel-item .reward-ko{font-size:1.45rem;font-weight:950}.satchel-item .reward-name{font-weight:900}.satchel-item .reward-desc{font-size:.78rem;color:var(--soft);margin-top:5px;line-height:1.35}.satchel-empty{grid-column:1/-1;padding:24px;text-align:center;border:1px dashed var(--line);border-radius:15px;color:var(--soft)}
.reward-toast{position:fixed;z-index:50;left:50%;bottom:28px;transform:translateX(-50%);min-width:min(420px,calc(100% - 30px));padding:13px 18px;border-radius:15px;background:#183d29;color:white;box-shadow:0 18px 50px #0004;text-align:center;font-weight:850}.reward-toast strong{color:#ffe08a}.reward-toast.show{animation:rewardPop .25s ease-out}@keyframes rewardPop{from{transform:translate(-50%,12px);opacity:0}to{transform:translate(-50%,0);opacity:1}}
@media(max-width:560px){.quest-log-item{grid-template-columns:auto 1fr}.quest-status{grid-column:2;justify-self:start}.reward-toast{bottom:15px}}
/* CK-0.9.0 guided progression */
.next-step-card{margin-top:12px;padding:14px;border:1px solid #d9e6d4;border-radius:15px;background:linear-gradient(135deg,#fff9df,#f4fbef)}
.next-step-card strong{display:block;margin:3px 0 5px}.next-step-card .button{margin-top:10px;width:100%}
.controls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}.controls-grid>div{padding:13px;border:1px solid var(--line);border-radius:14px;background:#fbfdf9}.controls-grid strong,.controls-grid span{display:block}.controls-grid span{color:var(--soft);font-size:.82rem;margin-top:3px}
.phrase-klaus{width:96px;height:96px;border-radius:22px;object-fit:cover;margin-bottom:8px}.phrase-answers{margin-top:14px}
@media(max-width:560px){.controls-grid{grid-template-columns:1fr}}

#helpModal{z-index:140}
#helpModal .modal-panel{width:min(680px,100%)}


/* CK-1.0.0 expanded learning loop */
.context-panel{width:min(650px,100%)}
.context-progress{display:inline-block;margin:2px auto 12px;padding:5px 10px;border-radius:999px;background:#eef4eb;color:#526653;font-size:.76rem;font-weight:900}
.context-prompt{margin:8px auto 6px;padding:18px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(135deg,#fff9df,#f6fbf2);font-size:clamp(1.35rem,4vw,1.8rem);font-weight:950}
.context-instruction{color:var(--soft);margin:4px 0 14px}.context-reveal{margin:14px auto 4px;padding:14px;border:1px solid #d6e5d2;border-radius:17px;background:#f7fbf4}.context-reveal[hidden]{display:none}.context-visual{font-size:4.2rem;line-height:1;margin-bottom:4px}.context-reveal .dialog-korean{font-size:2.3rem}.context-reveal .button{margin-top:9px}.context-panel #contextClose{margin-top:10px}.lesson-unlocked{outline:2px solid #f2b527;outline-offset:2px}

.context-answer{display:grid;gap:2px;place-items:center}.context-answer strong{font-size:1.4rem}.context-answer-roman{font-size:.76rem;color:#5e6e5e;font-weight:800}.context-answer:disabled .context-answer-roman{color:inherit}.context-reveal .dialog-english{margin-bottom:4px}

#contextModal{z-index:145}
#contextModal .modal-panel{width:min(680px,100%)}
.context-locked{padding:18px;border:1px solid var(--line);border-radius:16px;background:#f8fbf6;text-align:center;margin:10px 0 14px}
.context-locked strong{display:block;font-size:1.05rem;margin-bottom:6px}