@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:400;src:url(./sarabun-thai-400-normal-C2DaJlKK.woff2)format("woff2"),url(./sarabun-thai-400-normal-CH-UbWgg.woff)format("woff");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:400;src:url(./sarabun-vietnamese-400-normal-igdrzAGY.woff2)format("woff2"),url(./sarabun-vietnamese-400-normal-DPfkSCMy.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:400;src:url(./sarabun-latin-ext-400-normal-BbP7GpLL.woff2)format("woff2"),url(./sarabun-latin-ext-400-normal-BsmTn0SS.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:400;src:url(./sarabun-latin-400-normal-URPBxl-K.woff2)format("woff2"),url(./sarabun-latin-400-normal-DmguIS-7.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:600;src:url(./sarabun-thai-600-normal-3dIAQ-_s.woff2)format("woff2"),url(./sarabun-thai-600-normal-DWKeTe6a.woff)format("woff");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:600;src:url(./sarabun-vietnamese-600-normal-DkxrOlLB.woff2)format("woff2"),url(./sarabun-vietnamese-600-normal-BMbOgAW-.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:600;src:url(./sarabun-latin-ext-600-normal-BRxjKUQ6.woff2)format("woff2"),url(./sarabun-latin-ext-600-normal-0tXu9x_i.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:600;src:url(./sarabun-latin-600-normal-DMD3TROr.woff2)format("woff2"),url(./sarabun-latin-600-normal-9FonlkKx.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:700;src:url(./sarabun-thai-700-normal-CbuDipM3.woff2)format("woff2"),url(./sarabun-thai-700-normal-CP2-p8e-.woff)format("woff");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:700;src:url(./sarabun-vietnamese-700-normal-DrMy3BMX.woff2)format("woff2"),url(./sarabun-vietnamese-700-normal-lN6N8XBT.woff)format("woff");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:700;src:url(./sarabun-latin-ext-700-normal-CnQtP196.woff2)format("woff2"),url(./sarabun-latin-ext-700-normal-ykw7DJpk.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Sarabun;font-style:normal;font-display:swap;font-weight:700;src:url(./sarabun-latin-700-normal-DQKyWxHq.woff2)format("woff2"),url(./sarabun-latin-700-normal-DUuqj4Ju.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Kanit;font-style:normal;font-display:swap;font-weight:500;src:url(./kanit-thai-500-normal-BB8gri04.woff2)format("woff2"),url(./kanit-thai-500-normal-Iy_w0a80.woff)format("woff")}@font-face{font-family:Kanit;font-style:normal;font-display:swap;font-weight:600;src:url(./kanit-thai-600-normal-Bj6oiaDc.woff2)format("woff2"),url(./kanit-thai-600-normal-wbTlPO7I.woff)format("woff")}@font-face{font-family:Kanit;font-style:normal;font-display:swap;font-weight:500;src:url(./kanit-latin-500-normal-CX_4XcKi.woff2)format("woff2"),url(./kanit-latin-500-normal-qBha86O4.woff)format("woff")}@font-face{font-family:Kanit;font-style:normal;font-display:swap;font-weight:600;src:url(./kanit-latin-600-normal-0lS78yAd.woff2)format("woff2"),url(./kanit-latin-600-normal-DlacpeTg.woff)format("woff")}:root,[data-theme=dark]{--bg:#10131c;--bg2:#151a26;--card:#181d2a;--card2:#1f2535;--ink:#eef1f7;--muted:#8b93a7;--line:#2a3145;--accent:#ff6b4a;--accent-ink:#1a0f0b;--accent2:#3ddc97;--amber:#ffc53d;--sky:#4cc9f0;--ok:#3ddc97;--bad:#ff5470;--key:#232a3d;--key-top:#2a3248;--key-skirt:#12161f;--key-ink:#e7ebf5;--plate:#0b0e15;--pending:#5b6378;--glow:0 0 0 1px #ffffff08, 0 20px 50px -28px #000;--radius:18px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--bg:#f6f3ee;--bg2:#efe9e0;--card:#fffdf9;--card2:#f3eee6;--ink:#1b1f2a;--muted:#6b7183;--line:#e3dccf;--accent:#e8553a;--accent-ink:#fff;--accent2:#1fb57a;--amber:#e0a100;--sky:#1a9bc7;--ok:#1fb57a;--bad:#d93a56;--key:#fffdf9;--key-top:#fff;--key-skirt:#d9d1c3;--key-ink:#1b1f2a;--plate:#e8e1d5;--pending:#a3a8b6;--glow:0 0 0 1px #00000008, 0 18px 40px -26px #6b5a4066;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root{--display:"Kanit", "Sarabun", system-ui, sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:Sarabun,Noto Sans Thai,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(1200px 600px at 80% -10%, color-mix(in srgb, var(--accent) 9%, transparent), transparent 60%), radial-gradient(900px 500px at -10% 110%, color-mix(in srgb, var(--accent2) 7%, transparent), transparent 60%), var(--bg);background-attachment:fixed;min-height:100vh;margin:0}h1,h2,h3,.display{font-family:var(--display);letter-spacing:.01em;font-weight:600}.mk{font-family:Sarabun,Noto Sans Thai,sans-serif}button,select,input{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--line);background:var(--card2);border-radius:12px;padding:.5rem 1rem;transition:transform .12s,background .15s,border-color .15s}button:hover{border-color:color-mix(in srgb, var(--accent) 60%, var(--line))}button:active{transform:translateY(1px)scale(.98)}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);color:var(--accent-ink);box-shadow:0 8px 22px -12px var(--accent);border:none;font-weight:700}button.primary:hover{filter:brightness(1.07)}button.big{border-radius:14px;padding:.85rem 2rem;font-size:1.1rem}button.danger{color:var(--bad);background:0 0;margin-top:2rem}button.link{color:var(--muted);background:0 0;border:none;padding:.2rem 0;font-weight:600}button.link:hover{color:var(--accent)}button.icon{background:0 0;min-width:2.5rem;padding:.42rem .6rem}select{border:1px solid var(--line);background:var(--card2);border-radius:12px;padding:.42rem .5rem}.muted{color:var(--muted)}.small{font-size:.85rem}.app{flex-direction:column;min-height:100vh;display:flex}main{flex:1;width:100%;max-width:1180px;margin:0 auto;padding:1.4rem 1.1rem 2rem;animation:.35s both rise}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.top{z-index:5;background:color-mix(in srgb, var(--bg) 82%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:1rem;padding:.6rem 1.2rem;display:flex;position:sticky;top:0}.brand{align-items:center;gap:.6rem;display:flex}.brand-name{font-family:var(--display);font-size:1.2rem;font-weight:600;line-height:1.05}.brand-tag{color:var(--muted);font-size:.78rem}.tabs{background:var(--card);border:1px solid var(--line);border-radius:14px;gap:.2rem;margin-left:.6rem;padding:.25rem;display:flex}.tabs button{color:var(--muted);background:0 0;border:none;border-radius:10px;align-items:center;gap:.4rem;padding:.42rem .85rem;font-weight:600;display:inline-flex}.tabs button.on{background:var(--card2);color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}.tab-i{opacity:.8;font-size:.95em}.settings{flex-wrap:wrap;align-items:center;gap:.35rem;margin-left:auto;display:flex}.seg{flex-wrap:wrap;gap:.3rem;display:inline-flex}.seg button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}.seg.small button{padding:.32rem .7rem}.welcome{place-items:center;display:grid}.welcome-card{background:var(--card);border:1px solid var(--line);text-align:center;width:100%;max-width:560px;box-shadow:var(--glow);border-radius:28px;padding:0 2rem 2rem;overflow:hidden}.welcome-art{background:linear-gradient(180deg, var(--bg2), var(--card));width:calc(100% + 4rem);height:auto;margin:0 -2rem;display:block}.welcome-title{margin:.2rem 0;font-size:2.6rem}.welcome-card form{gap:.5rem;margin-top:1.2rem;display:flex}.welcome-card input{border:1px solid var(--line);background:var(--bg2);border-radius:12px;flex:1;padding:.65rem .9rem}.user-list{flex-wrap:wrap;justify-content:center;gap:.4rem;margin-top:1.2rem;display:flex}.path{flex-direction:column;gap:1.6rem;display:flex}.path-hero{background:var(--card);border:1px solid var(--line);box-shadow:var(--glow);border-radius:28px;grid-template-columns:1.1fr 1fr;align-items:center;min-height:240px;display:grid;position:relative;overflow:hidden}.path-hero-art{object-fit:cover;order:2;width:100%;height:100%;display:block}.path-hero-text{flex-direction:column;align-items:flex-start;gap:.5rem;padding:1.6rem 1.8rem;display:flex}.path-hero-text h1{margin:0;font-size:1.9rem;line-height:1.3}.path-hero-text p{margin:0 0 .4rem}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--accent);font-size:.8rem;font-weight:700}.path-meter{background:var(--line);border-radius:99px;width:100%;height:6px;margin-top:.6rem;overflow:hidden}.path-meter div{background:linear-gradient(90deg, var(--accent), var(--amber), var(--accent2));height:100%}.unit-title{align-items:center;gap:.6rem;margin:0 0 .7rem;font-size:1.15rem;display:flex}.unit-num{background:var(--card2);border:1px solid var(--line);width:1.9rem;height:1.9rem;color:var(--accent);border-radius:10px;place-items:center;font-size:.95rem;display:grid}.steps{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-auto-rows:5.6rem;gap:.7rem;margin:0;padding:0;list-style:none;display:grid}.steps>li{min-width:0;height:100%}.step{text-align:left;background:var(--card);border:1px solid var(--line);border-radius:16px;grid-template-columns:2.6rem minmax(0,1fr) auto;align-items:center;gap:.8rem;width:100%;height:100%;padding:.8rem 1rem;display:grid;position:relative;overflow:hidden}.step:before{content:"";background:var(--zone);opacity:.85;width:4px;position:absolute;top:0;bottom:0;left:0}.step:hover{border-color:color-mix(in srgb, var(--zone) 55%, var(--line));transform:translateY(-2px)}.step.next{border-color:color-mix(in srgb, var(--accent) 70%, var(--line));box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent)}.step-num{font-family:var(--display);text-align:center;width:2.6rem;color:var(--zone);font-size:1.5rem}.step.done .step-num{color:var(--muted)}.step-body{flex-direction:column;gap:.35rem;min-width:0;display:flex}.step-title{white-space:nowrap;text-overflow:ellipsis;font-weight:600;line-height:1.6;overflow:hidden}.step-keys{flex-wrap:nowrap;align-items:center;gap:.25rem;height:1.75rem;display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 85%,#0000);mask-image:linear-gradient(90deg,#000 85%,#0000)}.step-keys kbd{flex:none}.step-sub{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;height:1.75rem;font-size:.85rem;line-height:1.75rem;overflow:hidden}.step-medals{gap:3px;display:flex}.step-medals i{background:var(--line);border-radius:3px;width:9px;height:9px;transform:rotate(45deg)}.step-medals i.on{background:var(--amber);box-shadow:0 0 8px var(--amber)}kbd{background:var(--key);color:var(--key-ink);border:1px solid var(--line);border-bottom:3px solid var(--key-skirt);text-align:center;border-radius:7px;min-width:1.7rem;padding:0 .45rem;font-family:inherit;font-size:1rem;line-height:1.6}.session{flex-direction:column;gap:.9rem;display:flex;position:relative}.lesson-head{grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;display:grid}.lh-title{font-family:var(--display);font-size:1.25rem;font-weight:600}.lh-step{color:var(--accent);margin-right:.3rem}.lh-tip{color:var(--muted);font-size:.92rem}.rounds{flex-direction:column;align-items:flex-end;gap:.3rem;display:flex}.rounds-l{color:var(--muted);font-size:.8rem}.rounds-bar{gap:4px;display:flex}.rounds-bar i{background:var(--line);border-radius:99px;width:22px;height:6px}.rounds-bar i.done{background:var(--accent2)}.rounds-bar i.now{background:var(--accent)}.hud{flex-wrap:wrap;justify-content:center;gap:.5rem;padding-top:10px;display:flex;position:relative}.hud-progress{background:var(--line);border-radius:99px;height:3px;position:absolute;top:0;left:0;right:0;overflow:hidden}.hud-progress div{background:var(--accent);height:100%;transition:width .15s}.chip{background:var(--card);border:1px solid var(--line);border-radius:999px;align-items:baseline;gap:.35rem;padding:.3rem .8rem;display:inline-flex}.chip-i{color:var(--accent);font-size:.85rem}.chip-v{font-family:var(--display);font-variant-numeric:tabular-nums;font-size:1.15rem}.chip-l{color:var(--muted);font-size:.78rem}.chip.bad .chip-i{color:var(--bad)}.stage{text-align:center;word-break:normal;overflow-wrap:anywhere;cursor:text;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:color-mix(in srgb, var(--muted) 45%, transparent) transparent;background:radial-gradient(120% 140% at 50% 0%, var(--card2), var(--card) 70%);border:1px solid var(--line);max-height:8.2em;box-shadow:var(--glow);border-radius:24px;padding:1.4rem 1.6rem;font-size:2.35rem;line-height:1.85;position:relative;overflow-y:auto}.stage.free{text-align:left;max-height:8em;font-size:1.75rem}.stage.focused{border-color:color-mix(in srgb, var(--accent) 40%, var(--line))}.stage span{border-radius:5px;transition:color 80ms}.mk{vertical-align:baseline;-webkit-text-fill-color:transparent;background-image:linear-gradient(currentColor 0 37.4%,#0000 37.4% 78.3%,currentColor 78.3% 100%);-webkit-background-clip:text;background-clip:text;height:1.6em;line-height:1.6;display:inline-block;overflow:visible}.c-pending{color:var(--pending)}.c-correct{color:var(--ink)}.c-error{color:var(--bad);background:color-mix(in srgb, var(--bad) 16%, transparent)}.c-error.sp{background:color-mix(in srgb, var(--bad) 30%, transparent)}.c-current,.c-partial{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent);box-shadow:inset 0 -4px 0 var(--accent);animation:1s ease-in-out infinite caret}@keyframes caret{50%{box-shadow:inset 0 -4px 0 color-mix(in srgb, var(--accent) 25%, transparent)}}.focus-overlay{background:color-mix(in srgb, var(--bg) 70%, transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-radius:24px;place-items:center;display:grid;position:absolute;inset:0}.focus-overlay span{color:var(--accent-ink);background:var(--accent);border-radius:999px;padding:.5rem 1.1rem;font-size:1.05rem;font-weight:700}.hidden-input{opacity:0;resize:none;pointer-events:none;border:0;width:1px;height:1px;padding:0;position:absolute;top:40%;left:50%}.hint{text-align:center;color:var(--muted);min-height:1.5em;font-size:1.05rem}.hint-key{background:var(--card2);min-width:1.6em;color:var(--ink);border-radius:6px;padding:0 .3em;font-weight:700;display:inline-block}.warn{background:color-mix(in srgb, var(--amber) 18%, var(--card));color:var(--ink);border:1px solid var(--amber);text-align:center;border-radius:12px;padding:.5rem .8rem}.deck{flex-direction:column;align-items:center;gap:0;width:100%;max-width:800px;margin:0 auto;display:flex}.deck .kbd-wrap{z-index:1;width:100%;position:relative}.kbd{-webkit-user-select:none;user-select:none;filter:drop-shadow(0 10px 16px #0000004d);width:100%;display:block}.kbd-plate{fill:var(--plate);stroke:var(--line);stroke-width:1px}.kbd .k-skirt{fill:var(--key-skirt)}.kbd .k-cap{fill:var(--key);stroke:color-mix(in srgb, var(--key-top) 60%, transparent);stroke-width:1px;transition:transform .12s,fill .12s}.kbd .k-led{fill:var(--zone);opacity:.75}.kbd .special .k-cap{fill:var(--card2)}.kbd .special .k-led{opacity:.25}.kbd .kmain{fill:var(--key-ink);font-size:19px;font-weight:600}.kbd .kmark{font-size:22px}.kbd .kshift{fill:var(--muted);font-size:11px}.kbd .klabel{fill:var(--muted);font-size:11px;font-family:var(--display)}.kbd .k-bump{fill:var(--muted)}.kbd .key>*{transition:transform .12s}.kbd .key.target>*{transform:translateY(-3px)}.kbd .key.target .k-cap{fill:var(--zone);stroke:#fff;stroke-width:1.5px}.kbd .key.target .kmain,.kbd .key.target .kshift,.kbd .key.target .klabel{fill:#10131c}.kbd .key.target .k-led{fill:#10131c;opacity:.5}.kbd .key.target .k-skirt{fill:color-mix(in srgb, var(--zone) 55%, #000)}.kbd .key.target{animation:1.2s ease-in-out infinite keyglow}@keyframes keyglow{50%{filter:drop-shadow(0 0 7px var(--zone))}}.kbd .key.ok>*{transform:translateY(2px)}.kbd .key.ok .k-cap{fill:color-mix(in srgb, var(--ok) 70%, var(--key))}.kbd .key.bad .k-cap{fill:color-mix(in srgb, var(--bad) 75%, var(--key))}.coach{width:min(350px,46%);margin:.5rem auto 0}.coach-stage{width:100%;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#000 72%,#0000);mask-image:linear-gradient(#000 72%,#0000)}.coach-frame{position:absolute}.coach-base,.coach-finger{-webkit-user-select:none;user-select:none;pointer-events:none;display:block;position:absolute}.coach-base{filter:drop-shadow(0 10px 12px #0000004d);width:100%;height:100%;inset:0}.coach-finger{opacity:0;height:auto;transition:opacity .15s}.coach-finger.on{opacity:1;filter:drop-shadow(0 0 6px var(--zone)) drop-shadow(0 0 14px var(--zone)) saturate(1.5);animation:1.1s ease-in-out infinite fingerpulse}@keyframes fingerpulse{50%{filter:drop-shadow(0 0 2px var(--zone)) saturate(1.3)}}.results{background:var(--card);border:1px solid var(--line);box-shadow:var(--glow);border-radius:26px;margin-bottom:1.2rem;padding:1.6rem;animation:.35s both rise}.results-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.results-head h2{margin:0;font-size:1.7rem}.medals{gap:.3rem;display:flex}.medals img{filter:grayscale()brightness(.45);opacity:.6;width:56px;height:56px}.medals img.won{filter:none;opacity:1;animation:.5s cubic-bezier(.3,1.6,.5,1) both pop}@keyframes pop{0%{transform:scale(.3)rotate(-30deg)}to{transform:none}}.results-body{flex-wrap:wrap;align-items:center;gap:2rem;margin:1.2rem 0;display:flex}.headline{flex-direction:column;display:flex}.headline b{font-family:var(--display);color:var(--accent);font-size:3.4rem;line-height:1}.headline span{color:var(--muted)}.ring{flex-direction:column;align-items:center;gap:.2rem;display:flex}.ring svg{width:92px;height:92px}.ring-bg{fill:none;stroke:var(--line);stroke-width:8px}.ring-fg{fill:none;stroke:var(--accent2);stroke-width:8px;stroke-linecap:round;transition:stroke-dasharray .6s}.ring text{font-family:var(--display);fill:var(--ink);font-size:17px}.ring span{color:var(--muted);font-size:.85rem}.results-stats{flex-wrap:wrap;gap:1.6rem;margin:0;display:flex}.results-stats div{flex-direction:column-reverse;display:flex}.results-stats dt{color:var(--muted);font-size:.85rem}.results-stats dd{font-family:var(--display);margin:0;font-size:1.6rem}.row-btns{flex-wrap:wrap;gap:.6rem;display:flex}.badge{background:var(--amber);color:#2a1d00;vertical-align:middle;border-radius:999px;padding:.1rem .7rem;font-family:Sarabun,sans-serif;font-size:.9rem}.setup-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--glow);border-radius:22px;flex-direction:column;gap:1rem;margin-bottom:1rem;padding:1.4rem 1.6rem;display:flex}.setup-title{margin:0;font-size:1.4rem}.setup-row{grid-template-columns:120px 1fr;align-items:center;gap:.6rem;display:grid}.setup-row label{color:var(--muted);font-weight:600}.preview{background:var(--bg2);color:var(--muted);border-left:3px solid var(--accent);border-radius:14px;margin:0;padding:.9rem 1rem;font-size:1.15rem}.setup-card .big{align-self:flex-start}.report h2{margin-top:0}.report-name{align-items:center;gap:.7rem;display:flex}.avatar{background:var(--accent);width:2.4rem;height:2.4rem;color:var(--accent-ink);border-radius:12px;place-items:center;display:grid}.report-cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-bottom:1.2rem;display:grid}.rcard{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);flex-direction:column;gap:.5rem;padding:1rem 1.2rem;display:flex}.rc-lang{font-family:var(--display);color:var(--accent);font-weight:600}.rc-row{justify-content:space-between;display:flex}.progress{background:var(--line);border-radius:99px;height:6px;overflow:hidden}.progress div{background:linear-gradient(90deg, var(--accent), var(--amber));height:100%}.chart{background:var(--card);border-radius:var(--radius);border:1px solid var(--line);width:100%}.table-wrap{overflow-x:auto}table{border-collapse:collapse;background:var(--card);border-radius:var(--radius);width:100%;overflow:hidden}th,td{border-bottom:1px solid var(--line);text-align:left;white-space:nowrap;padding:.55rem .7rem}th{background:var(--card2);color:var(--muted);font-size:.85rem}.foot{text-align:center;color:var(--muted);padding:1rem;font-size:.8rem}.foot a{color:var(--accent)}.center{text-align:center}.game-grid{grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1rem;display:grid}.game-card{background:var(--card);border:1px solid var(--line);box-shadow:var(--glow);border-radius:22px;flex-direction:column;transition:transform .15s;display:flex;overflow:hidden}.game-card:hover{transform:translateY(-3px)}.game-card h3{margin:.8rem 1rem .2rem}.game-card p{color:var(--muted);flex:1;margin:0 1rem;font-size:.95rem}.game-art{aspect-ratio:16/9;object-fit:cover;background:var(--bg2);width:100%;display:block}.gc-foot{justify-content:space-between;align-items:center;gap:.5rem;padding:.9rem 1rem;display:flex}.game-shell{flex-direction:column;gap:.6rem;display:flex;position:relative}.game-bar{grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;display:grid}.game-title{font-family:var(--display);text-align:center;font-size:1.15rem;font-weight:600}.game-stage{box-shadow:var(--glow);border:1px solid var(--line);background:#0b0e15;border-radius:22px;position:relative;overflow:hidden}.game-canvas{aspect-ratio:16/10;touch-action:manipulation;width:100%;display:block}.game-overlay{color:#fff;text-align:center;background:#0b0e15b8;place-content:center;gap:1rem;display:grid;position:absolute;inset:0}.game-overlay h2{margin:0;font-size:2.2rem}.game-overlay.soft{pointer-events:none;background:#0b0e1559;font-size:1.2rem;font-weight:600}@media (width<=900px){.coach{width:min(380px,72%);margin-top:.2rem}.kbd{transform:none}.path-hero{grid-template-columns:1fr}.path-hero-art{order:0;max-height:200px}}@media (width<=720px){.top{gap:.5rem;padding:.55rem}.tabs{order:3;justify-content:center;width:100%;margin-left:0}.tabs button{white-space:nowrap;padding:.4rem .5rem;font-size:.9rem}.settings{margin-left:0}.stage{padding:.9rem;font-size:1.6rem}.stage.free{font-size:1.25rem}.lesson-head{grid-template-columns:1fr}.rounds{align-items:flex-start}.setup-row,.steps{grid-template-columns:1fr}.headline b{font-size:2.6rem}.game-bar{gap:.4rem}.game-title{font-size:.95rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.art-rally,.art-fireflies{position:relative;overflow:hidden}.art-rally{background:linear-gradient(#151a33 0%,#3a2a4a 62%,#1c1f2e 62%)}.art-fireflies{background:radial-gradient(circle at 30% 30%,#ffe06633 0 3px,#0000 4px),radial-gradient(circle at 70% 22%,#ffe06644 0 3px,#0000 4px),radial-gradient(circle at 55% 45%,#c6ff8a55 0 4px,#0000 6px),radial-gradient(circle at 50% 80%,#ffe06633,#0000 45%),linear-gradient(#0b1024,#14243a 70%,#10202a)}.art-rally img,.art-fireflies img{height:auto;position:absolute}.top{gap:.7rem}.settings select{text-overflow:ellipsis;max-width:11rem}@media (width<=1360px) and (width>=901px){.brand-tag{display:none}.tabs button{padding:.42rem .6rem}.settings select[aria-label]{max-width:8.5rem}}@media (width<=720px){.brand-tag{display:none}.top{gap:.45rem;padding:.5rem .7rem}.settings{gap:.25rem}.settings select{max-width:7.2rem;padding:.3rem .4rem;font-size:.8rem}.settings .icon,.settings .seg button{padding:.3rem .45rem;font-size:.8rem}}.stage .sp{white-space:pre;padding:0 .08em}:root{--lv0:#8b93a7;--lv1:#3ddc97;--lv2:#4cc9f0;--lv3:#ffc53d;--lv4:#ff7a5c;--lv5:#b9a8ff}.rank-badge{--c:var(--lv0);width:2.6rem;height:2.9rem;font-family:var(--display);color:#10131c;background:linear-gradient(160deg, color-mix(in srgb, var(--c) 55%, #fff), var(--c) 55%, color-mix(in srgb, var(--c) 70%, #000));clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);filter:drop-shadow(0 4px 8px color-mix(in srgb, var(--c) 40%, transparent));flex:none;place-items:center;font-size:1.2rem;font-weight:600;display:inline-grid}.rank-badge.lv-1{--c:var(--lv1)}.rank-badge.lv-2{--c:var(--lv2)}.rank-badge.lv-3{--c:var(--lv3)}.rank-badge.lv-4{--c:var(--lv4)}.rank-badge.lv-5{--c:var(--lv5);background:linear-gradient(160deg,#fff4c2,#ffc53d 40%,#b9a8ff 75%,#6e5bd6)}.lh-rule .rank-badge,.level-head .rank-badge.small{vertical-align:middle;width:1.5rem;height:1.7rem;font-size:.8rem}.hero-rank{flex-wrap:wrap;align-items:center;gap:.7rem;margin-bottom:.6rem;display:flex}.hero-rank small{color:var(--muted);font-size:.75rem;display:block}.hero-rank b{font-family:var(--display);font-size:1.35rem}.level{margin-top:1.6rem}.level-head{border-bottom:1px solid var(--line);align-items:center;gap:.9rem;margin-bottom:.9rem;padding:.6rem .2rem .8rem;display:flex}.level-head h2{margin:0;font-size:1.3rem}.level-rank{vertical-align:middle;background:color-mix(in srgb, var(--c,var(--lv0)) 20%, transparent);color:var(--ink);border:1px solid var(--line);border-radius:999px;margin-left:.4rem;padding:.1rem .55rem;font-size:.85rem;font-weight:600}.lv-0 .level-rank{--c:var(--lv0)}.lv-1 .level-rank{--c:var(--lv1)}.lv-2 .level-rank{--c:var(--lv2)}.lv-3 .level-rank{--c:var(--lv3)}.lv-4 .level-rank{--c:var(--lv4)}.lv-5 .level-rank{--c:var(--lv5)}.lh-rule{color:var(--muted);align-items:center;gap:.4rem;margin-top:.3rem;font-size:.85rem;display:flex}.warn-badge{background:color-mix(in srgb, var(--amber) 22%, transparent);color:var(--ink);border:1px solid var(--amber);font-size:.8rem}@media (width<=720px){.steps{grid-auto-rows:5.2rem}.level-head h2{font-size:1.1rem}}.unit+.unit{margin-top:1.3rem}.level .unit-title{margin-top:.4rem}.update-toast{z-index:100;background:var(--card2);color:var(--ink);border:1px solid var(--line);border-radius:14px;align-items:center;gap:.8rem;max-width:calc(100vw - 2rem);padding:.55rem .7rem .55rem 1rem;font-size:.92rem;display:flex;position:fixed;bottom:1.2rem;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #00000059}.update-toast button{padding:.35rem .8rem;font-size:.85rem}.foot-ver{opacity:.75;font-variant-numeric:tabular-nums}