:root{color-scheme:dark;--bg:#07101d;--bg-deep:#040a12;--surface:#0b1626;--surface-raised:#101d30;--surface-soft:#15233a;--line:#23324a;--line-soft:#17243a;--text:#f2eee8;--text-soft:#c6c3c8;--text-muted:#858a98;--text-ghost:rgba(224,228,239,.055);--moon:#dad3ff;--lavender:#9485e8;--lavender-strong:#806de3;--lavender-soft:rgba(148,133,232,.16);--cool-glow:rgba(116,137,255,.18);--success:#86c7ae;--danger:#d77b87;--warning:#d0ae76;--scrim:rgba(1,5,12,.72);--sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--serif:ui-serif,"Noto Serif KR","Nanum Myeongjo","AppleMyungjo","Batang",serif;--writing:"Segoe Print","Bradley Hand","Nanum Pen Script",cursive,system-ui;font-family:var(--sans);background:var(--bg);color:var(--text)}
:root[data-theme=dawn]{color-scheme:light;--bg:#f2eee7;--bg-deep:#e8e1d8;--surface:#f8f4ee;--surface-raised:#fffdf9;--surface-soft:#ece5de;--line:#d5cdc5;--line-soft:#e4ddd6;--text:#211d24;--text-soft:#524b56;--text-muted:#85808a;--text-ghost:rgba(35,29,38,.055);--moon:#78669d;--lavender:#8e79be;--lavender-strong:#765da9;--lavender-soft:rgba(142,121,190,.13);--cool-glow:rgba(123,103,172,.12);--success:#568c77;--danger:#aa5f6b;--warning:#997943;--scrim:rgba(34,28,38,.38)}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg);scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh;background:radial-gradient(70vw 60vh at 100% 0,var(--cool-glow),transparent 62%),var(--bg);color:var(--text)}button,textarea,input{font:inherit;color:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}.skip{position:fixed;z-index:100;top:-5rem;left:1rem;padding:.7rem 1rem;background:var(--moon);color:var(--bg-deep);border-radius:6px}.keyboard .skip:focus{top:1rem}.loading{padding:30vh 20px;text-align:center;color:var(--text-muted)}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-main{width:min(100%,900px);min-height:100dvh;margin:auto;padding:0 20px calc(88px + env(safe-area-inset-bottom))}.lesson-main{width:min(100%,720px);min-height:100dvh;margin:auto;padding:0 20px 28px}.top-rail{height:calc(52px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.wordmark{font-size:20px;font-weight:500;letter-spacing:.04em;text-decoration:none}.top-title{font-size:11px;font-weight:650;letter-spacing:.09em;text-align:center}.rail-right{justify-self:end}.icon-button{display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;border-radius:10px;color:var(--text-soft);font-size:18px}.back-button{justify-self:start}.screen-head{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end;padding:18px 0 12px}.screen-head h1{font:400 28px/1.1 var(--serif);margin:0}.issue-date,.micro{font-size:10px;line-height:1.2;font-weight:650;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.progress-copy{text-align:right}.progress-copy strong{display:block;font:400 24px/1 var(--serif)}.progress-copy small{display:block;margin-top:5px;font-size:10px;color:var(--text-muted)}.progress-track{height:2px;background:var(--line);margin:0 0 14px}.progress-track i{display:block;height:100%;background:var(--lavender);transition:width .2s}.continue{width:100%;height:44px;margin:0 0 8px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text-soft);font-size:11px;font-weight:700;letter-spacing:.08em}.story-list{list-style:none;margin:0;padding:0}.mix-row,.index-row{position:relative;border-bottom:1px solid var(--line-soft)}.mix-row>a,.index-row>a{min-height:86px;display:grid;grid-template-columns:34px minmax(0,1fr) 44px;align-items:center;text-decoration:none}.mix-row.current{background:linear-gradient(90deg,var(--lavender-soft),transparent 70%);box-shadow:inset 2px 0 var(--lavender)}.row-no{align-self:start;padding-top:23px;font-size:11px;color:var(--text-muted)}.row-copy{min-width:0}.row-title{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;font:500 17px/1.35 var(--serif);word-break:keep-all}.row-meta{display:flex;justify-content:space-between;gap:8px;min-width:0;margin-top:6px;color:var(--text-muted);font-size:10px;text-transform:uppercase}.row-meta>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-meta>span:last-child{flex:none;white-space:nowrap}.status-dot{display:inline-block;width:6px;height:6px;border:1px solid var(--lavender);border-radius:50%;vertical-align:1px;margin-left:3px}.status-dot.done{background:var(--moon)}.row-arrow{display:grid;place-items:center;width:44px;height:44px;color:var(--text-muted)}.bottom-nav{position:fixed;z-index:20;bottom:0;left:0;width:100%;height:calc(64px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-soft);background:rgba(7,16,29,.94);backdrop-filter:blur(12px)}:root[data-theme=dawn] .bottom-nav{background:rgba(242,238,231,.94)}.bottom-nav a{display:grid;place-content:center;gap:4px;text-align:center;text-decoration:none;color:var(--text-muted);font-size:10px;font-weight:650}.bottom-nav a[aria-current=page]{color:var(--moon)}.nav-mark{font-size:18px;line-height:1}.index-section{padding:24px 0 4px}.index-section header{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:9px}.index-section h2{font:400 18px/1.2 var(--serif);margin:0}.index-row>a{min-height:66px;grid-template-columns:34px minmax(0,1fr) auto}.index-row .row-no{padding-top:18px;font-size:10px}.index-row .row-title{font-size:15px}.index-states{font-size:10px;color:var(--text-muted)}
.lesson-header{padding:22px 4px 0}.lesson-header h1{max-width:18ch;margin:0 0 8px;font:500 24px/1.28 var(--serif);word-break:keep-all}.lesson-meta{color:var(--text-muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.reveal-wrap{position:relative;margin:28px 4px 128px}.reveal-text{margin:0;font:400 clamp(22px,1.6vw,30px)/1.8 var(--serif);word-break:keep-all;touch-action:pan-y;user-select:text;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(1.8em - 1px),color-mix(in srgb,var(--text) 10%,transparent) calc(1.8em - 1px),color-mix(in srgb,var(--text) 10%,transparent) 1.8em)}.grapheme{opacity:.045;transition:opacity .16s;color:var(--text)}.grapheme.revealed{opacity:1}.grapheme.preview{opacity:.45}.grapheme.active-line:not(.revealed):not(.preview){opacity:.055}.reveal-text.reveal-off .grapheme{opacity:1}.reveal-text.reveal-off{touch-action:auto;background:none}.reveal-instruction,.completion-dock{position:fixed;z-index:10;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,720px);min-height:104px;padding:16px 24px max(18px,env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 25%)}.gesture-copy{display:flex;align-items:center;gap:12px;color:var(--text-muted);font-size:10px;font-weight:650;letter-spacing:.1em}.gesture-copy:after{content:"→";flex:1;border-bottom:1px solid var(--line);padding-bottom:2px;text-align:right}.completion-line{display:flex;justify-content:space-between;margin-bottom:10px;color:var(--moon);font-size:10px;font-weight:700;letter-spacing:.12em}.button{min-height:44px;border:1px solid var(--line);border-radius:10px;padding:0 16px;background:transparent;font-size:12px;font-weight:700;letter-spacing:.06em}.button.primary{background:linear-gradient(135deg,var(--lavender-strong),var(--lavender));border-color:transparent;color:#fff;box-shadow:0 10px 30px rgba(128,109,227,.14)}.button.quiet{color:var(--text-soft)}.button:disabled{opacity:.4;cursor:not-allowed}.completion-dock .button{width:100%;height:48px}.text-action{display:block;width:100%;min-height:40px;border:0;background:transparent;color:var(--text-muted);font-size:11px}.level-screen{padding-bottom:24px}.level-scale{position:relative;display:grid;grid-template-columns:repeat(7,1fr);margin:32px 4px 0}.level-scale:after{content:"";position:absolute;z-index:-1;left:7%;right:7%;top:22px;border-top:1px solid var(--line)}.level-choice{height:44px;border:0;background:transparent;border-radius:50%;font-size:12px}.level-choice[aria-pressed=true]{width:32px;height:32px;margin:6px auto;background:var(--lavender-strong);box-shadow:0 0 22px var(--cool-glow)}.depth-copy{text-align:center;margin:16px 0 28px}.level-preview{display:grid;gap:10px}.preview-card{min-height:86px;padding:14px;border:1px solid var(--line-soft);border-radius:12px;background:var(--surface);color:var(--text-muted)}.preview-card.selected{border-color:var(--lavender);background:var(--surface-raised);color:var(--text);box-shadow:0 12px 36px var(--cool-glow)}.preview-card b{display:block;font-size:10px;letter-spacing:.1em}.preview-card p{margin:8px 0 0;font:400 14px/1.5 var(--serif)}.apply-level{width:100%;height:48px;margin-top:20px}
.translate-intro{min-height:calc(100dvh - 60px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-bottom:12vh}.memory-symbol{width:52px;height:26px;margin-bottom:18px;border:1px solid var(--line);border-radius:999px;background:radial-gradient(circle,var(--lavender-soft),transparent 70%)}.translate-intro h1{margin:9px 0 14px;font:400 28px/1.1 var(--serif)}.translate-intro p{max-width:250px;margin:0;color:var(--text-muted);font-size:14px;line-height:1.55}.translate-intro .button{width:min(100%,350px);height:48px;margin-top:70px}.writing-layout{min-height:calc(100dvh - 52px);display:flex;flex-direction:column}.writing-instruction{margin:30px 0 20px}.writing-instruction h1{margin:0;font:400 15px/1.4 var(--serif)}.writing-instruction p{margin:5px 0 0;color:var(--text-muted);font-size:12px}.writing-surface{position:relative;flex:1;min-height:410px;border:1px solid var(--line-soft);border-radius:16px;background:linear-gradient(145deg,var(--surface),transparent),repeating-linear-gradient(0deg,transparent 0,transparent 36px,var(--line-soft) 37px)}.writing-surface textarea,.source-hint{position:absolute;inset:0;width:100%;height:100%;padding:18px;border:0;resize:none;background:transparent;font:400 22px/1.7 var(--writing);caret-color:var(--moon);outline:0}.writing-surface textarea::placeholder{color:var(--text-muted)}.source-hint{visibility:hidden;overflow:auto;font:400 24px/1.55 var(--serif);color:var(--text-soft)}.writing-surface.hinting textarea{visibility:hidden}.writing-surface.hinting .source-hint{visibility:visible}.writing-controls{padding:14px 0 max(10px,env(safe-area-inset-bottom))}.memory-ridge{display:grid;place-content:center;width:110px;height:34px;margin:0 auto 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface-soft);color:var(--text-muted);font-size:9px;font-weight:700;letter-spacing:.12em}.memory-ridge:before{content:"≋";font-size:13px;line-height:8px;color:var(--moon)}.memory-ridge.held{color:var(--moon);border-color:var(--lavender);box-shadow:0 0 22px var(--cool-glow)}.write-actions{display:grid;grid-template-columns:112px 1fr;gap:12px}.write-actions .button{height:46px}.score-head{text-align:center;padding:26px 0 20px}.score-head h1{margin:5px 0 3px;font:400 28px/1.1 var(--serif)}.score-ring{width:92px;height:92px;margin:20px auto 0;display:grid;place-items:center;border:2px solid var(--lavender);border-radius:50%;box-shadow:0 0 28px var(--cool-glow);font:400 34px/1 var(--serif)}.comparison{border-top:1px solid var(--line-soft);padding:20px 4px}.comparison h2{margin:0 0 10px;font-size:10px;letter-spacing:.12em;color:var(--text-muted)}.comparison p{margin:0;font:400 18px/1.65 var(--serif)}.diff{background:var(--lavender-soft);text-decoration:underline;text-decoration-color:var(--lavender);text-underline-offset:4px}.result-actions{display:grid;gap:8px;margin:22px 0}.result-actions .button{height:48px}.report-screen h1,.saved-screen h1,.settings-screen h1{margin:18px 0 8px;font:400 28px/1.1 var(--serif)}.lead{color:var(--text-muted);font-size:14px;line-height:1.5}.choice-list{border:0;border-top:1px solid var(--line);margin-top:26px;padding:0}.choice-row{min-height:52px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line-soft);font-size:14px}.choice-row input{accent-color:var(--lavender)}.report-note{width:100%;min-height:110px;margin-top:18px;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);resize:vertical}.report-status{min-height:20px;color:var(--text-muted);font-size:12px}.dialog-actions,.report-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.report-actions .button{height:48px}.tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-top:24px}.tab{min-height:44px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--text-muted);font-size:11px;font-weight:700}.tab[aria-selected=true]{border-color:var(--lavender);color:var(--moon)}.weekly{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0;padding:18px 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}.weekly div{text-align:center}.weekly strong{display:block;font:400 24px/1 var(--serif)}.weekly span{font-size:9px;color:var(--text-muted)}.history-row{display:grid;grid-template-columns:1fr auto;gap:8px;padding:13px 0;border-bottom:1px solid var(--line-soft);text-decoration:none}.history-row b{font:500 15px/1.3 var(--serif)}.history-row small{color:var(--text-muted)}.settings-group{margin-top:26px}.settings-group h2{font-size:10px;color:var(--text-muted);letter-spacing:.13em}.setting-row{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line-soft);font-size:14px}.setting-row select{min-width:92px;border:0;background:transparent;text-align:right;color:var(--text-soft)}.toggle{width:48px;height:28px;border:1px solid var(--line);border-radius:999px;background:var(--surface-soft);padding:3px}.toggle:after{content:"";display:block;width:20px;height:20px;border-radius:50%;background:var(--text-muted);transition:transform .16s}.toggle[aria-pressed=true]:after{transform:translateX(19px);background:var(--moon)}.source-sheet{border:1px solid var(--line);border-radius:16px 16px 0 0;background:var(--surface-raised);color:var(--text);width:min(100%,620px);max-height:65vh;margin:auto auto 0;padding:0;box-shadow:0 -24px 60px var(--scrim)}.source-sheet::backdrop,dialog::backdrop{background:var(--scrim)}.sheet-inner{padding:20px}.sheet-inner h2{font:400 22px/1.3 var(--serif)}.sheet-inner dl{display:grid;grid-template-columns:100px 1fr;font-size:12px}.sheet-inner dt,.sheet-inner dd{margin:0;padding:8px 0;border-bottom:1px solid var(--line-soft)}dialog:not(.source-sheet){border:1px solid var(--line);border-radius:16px;background:var(--surface-raised);color:var(--text);padding:22px;width:min(340px,calc(100% - 40px))}dialog h2{font:400 22px/1.2 var(--serif)}.splash{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;padding:calc(28px + env(safe-area-inset-top)) 24px calc(28px + env(safe-area-inset-bottom));background:radial-gradient(circle at 72% 28%,var(--cool-glow),transparent 34%),var(--bg)}.splash-top{font-size:22px;font-weight:500}.splash-center{margin:auto;text-align:center}.crescent{width:42px;height:42px;margin:0 auto 30px;border-radius:50%;box-shadow:-11px 4px 0 0 var(--moon);transform:rotate(-15deg)}.splash h1{margin:0;font:400 42px/1.05 var(--serif);letter-spacing:.04em}.splash p{margin:12px 0 0;color:var(--text-muted);font-size:12px}.splash .button{height:48px}.screen-enter{animation:enter .18s ease-out}@keyframes enter{from{opacity:0;transform:translateY(5px)}}
button:focus-visible,a:focus-visible,textarea:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--moon);outline-offset:3px}.icon-button:hover,.mix-row:hover,.index-row:hover{background:var(--lavender-soft)}
@media(min-width:700px){.app-main{padding-left:40px;padding-right:40px}.lesson-main{padding-left:28px;padding-right:28px}.screen-head{padding-top:34px}.mix-row>a{min-height:94px}.lesson-header{padding-top:48px}.reveal-wrap{margin-top:40px}.writing-layout{min-height:calc(100dvh - 70px)}body:before{content:"DARQ";position:fixed;z-index:-1;right:4vw;bottom:-4vh;font:400 min(18vw,240px)/1 var(--serif);color:var(--text-ghost);letter-spacing:.08em}}
@media(forced-colors:active){.grapheme{opacity:0}.grapheme.revealed,.grapheme.preview,.reveal-off .grapheme{opacity:1}.button,.memory-ridge,.toggle{border:1px solid ButtonText}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}}