:root{--bg:#0b0e14;--panel:#141a23;--line:#242c38;--text:#e6edf3;--dim:#7d8590;--done:#3fb950;--rest:#58637a;--accent:#58a6ff;--error:#f85149;--gold:#e3b341;--peril:#d2a8ff;--mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--sans:system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:radial-gradient(1200px 600px at 50% -10%, #16203044, transparent 70%), var(--bg);color:var(--text);font-family:var(--sans);margin:0;line-height:1.7}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1{margin:0 0 .25rem;font-size:1.4rem}h2{color:var(--dim);text-transform:uppercase;letter-spacing:.06em;margin:0 0 .5rem;font-size:.85rem;font-weight:600}.shell{max-inline-size:78rem;margin:0 auto;padding:1.5rem}.shell-nav{border-block-end:1px solid var(--line);justify-content:space-between;align-items:center;gap:1rem;margin-block-end:1.5rem;padding-block-end:.75rem;font-weight:600;display:flex}.shell-tools{align-items:center;gap:.4rem;display:flex}.nav-chip{font:600 .72rem/1.8 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:999px;padding:0 .7rem}.nav-chip:hover{color:var(--text);border-color:var(--accent);text-decoration:none}.nav-chip.is-sound[aria-pressed=false]{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 45%, var(--line))}.summary{color:var(--dim);margin:0}.hero{border-block-end:1px solid var(--line);justify-items:start;gap:.6rem;padding:2.5rem 0 2rem;display:grid}.hero-kicker{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:0;font-size:.72rem}.brand{color:var(--text);align-items:center;gap:.5rem;display:inline-flex}.brand:hover{color:var(--accent);text-decoration:none}.logo{flex:none;display:block}.hero-title{font-family:var(--mono);letter-spacing:-.02em;align-items:center;gap:.7rem;margin:0;font-size:clamp(2.2rem,7vw,3.6rem);line-height:1.05;display:flex}.hero-title span{background:linear-gradient(120deg, var(--text) 30%, var(--accent));color:#0000;-webkit-background-clip:text;background-clip:text}.hero-lede{max-inline-size:42rem;color:var(--dim);margin:0}.demo{border:1px solid var(--line);background:var(--panel);border-radius:.5rem;gap:.4rem;inline-size:100%;max-inline-size:42rem;margin-block-start:.75rem;padding:1rem;display:grid}.demo p{margin:0}.demo-body{color:var(--dim);font-size:.85rem}.demo-target{word-break:break-word;font-size:1.05rem}.demo-keys{font-family:var(--mono);word-break:break-all;border-block-start:1px solid var(--line);padding-block-start:.5rem;font-size:.75rem}.hero-stats{font-family:var(--mono);color:var(--dim);margin:.25rem 0 0;font-size:.75rem}.hero-start{border:1px solid color-mix(in srgb, var(--accent) 50%, var(--line));font-family:var(--mono);border-radius:999px;margin-block-start:.5rem;padding:.45rem 1.1rem;font-size:.8rem}.hero-start:hover{background:color-mix(in srgb, var(--accent) 14%, transparent);text-decoration:none}.list-head{color:var(--text);text-transform:none;letter-spacing:0;margin:2rem 0 0;scroll-margin-block-start:1rem;font-size:1.1rem}.list ul{grid-template-columns:minmax(0,1fr);gap:.75rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.list li a{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:.5rem;grid-template-columns:minmax(0,1fr);gap:.35rem;padding:1rem;transition:border-color .12s ease-out,transform .12s ease-out;display:grid}.list li a:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-2px)}.list .summary{font-size:.9rem}.tags{flex-wrap:wrap;align-items:center;gap:.4rem;margin:0;display:flex}.badge{font-family:var(--mono);border:1px solid var(--line);color:var(--dim);border-radius:.25rem;padding:0 .4rem;font-size:.72rem;line-height:1.6}.badge.is-easy{color:var(--done);border-color:color-mix(in srgb, var(--done) 40%, var(--line))}.badge.is-normal{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 40%, var(--line))}.badge.is-hard{color:var(--error);border-color:color-mix(in srgb, var(--error) 40%, var(--line))}.badge.is-expert{color:var(--peril);border-color:color-mix(in srgb, var(--peril) 45%, var(--line))}.badge.is-expertplus{color:var(--bg);background:linear-gradient(120deg, var(--peril), var(--error));border-color:#0000;font-weight:600}.meta{color:var(--dim);font-size:.78rem}.filters{grid-template-columns:minmax(0,1fr);gap:.5rem;margin-block-start:1.5rem;display:grid}.filter-row{flex-wrap:wrap;align-items:center;gap:.35rem;display:flex}.filter-label{inline-size:5.5rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;flex:none;font-size:.75rem}.chip{border:1px solid var(--line);color:var(--dim);border-radius:999px;padding:0 .6rem;font-size:.8rem;line-height:1.8}.chip:hover{border-color:var(--accent);text-decoration:none}.chip[data-on=true]{color:var(--bg);background:var(--accent);border-color:var(--accent)}.count{color:var(--dim);font-family:var(--mono);margin:1rem 0 0;font-size:.78rem}.hud{grid-template-columns:repeat(auto-fit,minmax(6.5rem,1fr));gap:.5rem;margin-block-start:1rem;display:grid}.hud-tile{border:1px solid var(--line);background:var(--panel);border-radius:.4rem;gap:.1rem;padding:.5rem .75rem;transition:border-color .16s ease-out,box-shadow .16s ease-out;display:grid}.hud-tile[data-hot=true]{border-color:color-mix(in srgb, var(--gold) 55%, var(--line));box-shadow:0 0 18px -6px var(--gold)}.hud-label{letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-size:.62rem}.hud-value{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:1.35rem;line-height:1.2;animation:.2s ease-out bump;display:inline-block}.hud-tile[data-hot=true] .hud-value{color:var(--gold)}@keyframes bump{0%{transform:translateY(-4px)scale(1.14)}to{transform:none}}.player-head{margin-block-end:1.25rem}.player-title{flex-wrap:wrap;align-items:baseline;gap:.5rem .75rem;display:flex}.player-title h1{margin:0}.progress{border:1px solid var(--line);background:var(--panel);border-radius:.25rem;block-size:1.25rem;margin-block-start:.5rem;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, color-mix(in srgb, var(--done) 40%, transparent), var(--done));block-size:100%;box-shadow:0 0 20px -4px var(--done);transition:inline-size .22s cubic-bezier(.2,1.3,.4,1)}.progress-label{font-family:var(--mono);color:var(--text);text-shadow:0 1px 2px #000a;place-items:center;font-size:.7rem;display:grid;position:absolute;inset:0}.player-body{grid-template-columns:minmax(0,20rem) minmax(0,1fr);align-items:start;gap:1.5rem;display:grid}.context{border:1px solid var(--line);background:var(--panel);border-radius:.5rem;grid-area:1/1;max-block-size:calc(100vh - 12rem);padding:1rem;position:sticky;inset-block-start:1rem;overflow:auto}.stage-column{grid-area:1/2;align-content:start;gap:.75rem;display:grid}@media (width<=60rem){.player-body{grid-template-columns:minmax(0,1fr)}.stage-column{grid-area:1/1}.context{grid-area:2/1;max-block-size:40vh;position:static}}.context pre{white-space:pre-wrap;overflow-wrap:anywhere;max-inline-size:100%;font-family:var(--mono);color:var(--dim);margin:0;font-size:.75rem}.stage{gap:.75rem;animation:.24s ease-out both stage-in;display:grid;position:relative}@keyframes stage-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.log{border:1px solid var(--line);background:color-mix(in srgb, var(--panel) 60%, transparent);border-radius:.5rem;padding:.5rem .75rem}.log summary{cursor:pointer;color:var(--dim);font-family:var(--mono);letter-spacing:.04em;font-size:.75rem}.log summary:hover{color:var(--accent)}.log-body{grid-template-columns:minmax(0,1fr);gap:.75rem;max-block-size:45vh;margin-block:.75rem .25rem;display:grid;overflow:auto}.prompt.is-past{opacity:.65}.sr-only{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;margin:-1px;position:absolute;overflow:hidden}.speaker{border:1px solid var(--line);background:var(--bg);border-radius:50%;flex:none;place-items:center;block-size:1.7rem;inline-size:1.7rem;font-size:.9rem;line-height:1;display:inline-grid}.speaker[data-who=human]{border-color:color-mix(in srgb, var(--accent) 50%, var(--line))}.speaker[data-who=assistant]{border-color:color-mix(in srgb, var(--done) 45%, var(--line))}.said-row{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.6rem;display:grid}.prompt{border-inline-start:2px solid var(--accent);background:var(--panel);border-radius:0 .25rem .25rem 0;align-items:flex-start;gap:.6rem;margin:0;padding:.75rem 1rem;display:flex}.said{color:var(--dim);margin:0}.said.is-code,.typing-target.is-code{font-family:var(--mono);font-size:.85rem}.said.is-code{white-space:pre-wrap;overflow-wrap:anywhere;max-inline-size:100%}.typing{border:1px solid var(--line);background:var(--panel);border-radius:.5rem;padding:1rem;transition:border-color .12s ease-out;position:relative;overflow:hidden}.typing-rail{background:var(--accent);transform-origin:0;block-size:2px;transition:transform 90ms linear;position:absolute;inset-block-start:0;inset-inline:0}.typing[data-mood=error]{border-color:var(--error);background:color-mix(in srgb, var(--error) 8%, var(--panel));animation:.18s ease-in-out shake}.typing[data-mood=cleared]{border-color:var(--done);animation:.52s ease-out cleared}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}@keyframes cleared{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--done) 55%, transparent)}to{box-shadow:0 0 0 22px #0000}}.typing-head{align-items:center;gap:.6rem;margin-block-end:.75rem;display:flex}.thinking{font-family:var(--mono);flex:1;align-items:center;gap:.5rem;margin:0;font-size:.75rem;display:flex}.thinking-spinner{color:var(--accent);inline-size:1ch}.thinking[data-active=false] .thinking-spinner{color:var(--done)}.thinking-verb{background:linear-gradient(90deg, var(--rest) 0%, var(--text) 45%, var(--rest) 88%);color:#0000;background-size:240% 100%;-webkit-background-clip:text;background-clip:text;animation:2.4s linear infinite shimmer}.thinking-verb[data-still=true]{color:var(--dim);animation:none}@keyframes shimmer{0%{background-position:140% 0}to{background-position:-60% 0}}.thinking-left{color:var(--dim);font-variant-numeric:tabular-nums;margin-inline-start:auto}.typing-display{color:var(--dim);margin:0 0 .5rem;font-size:.9rem}.typing-target{white-space:break-spaces;overflow-wrap:break-word;margin:0;font-size:1.05rem}.typing-target .newline:before{content:"↵";opacity:.4}.typing-target .space[data-eol]{position:relative}.typing-target .space[data-eol]:after{content:"";border:1px solid var(--accent);opacity:.75;border-block-start:none;block-size:.28em;inline-size:.34em;position:absolute;inset-block-end:.06em;inset-inline-start:.22em}.typing-target .is-done .newline:before,.typing-target .is-done .space[data-eol]:after{opacity:.25}.typing-keys{border-block-start:1px solid var(--line);font-family:var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;margin:.75rem 0 0;padding-block-start:.75rem;font-size:.8rem}.is-done{color:var(--done)}.is-rest{color:var(--rest)}.caret{position:relative}.caret:after{content:"";background:var(--accent);inline-size:2px;box-shadow:0 0 8px var(--accent);animation:1s step-end infinite blink;position:absolute;inset-block:0;inset-inline-start:-1px}@keyframes blink{50%{opacity:0}}.burst{pointer-events:none;position:absolute;inset-block-start:50%;inset-inline-start:50%}.burst span{background:var(--done);block-size:7px;inline-size:7px;box-shadow:0 0 10px var(--done);animation:fly .62s ease-out var(--delay) both;border-radius:50%;margin:-3.5px;position:absolute}@keyframes fly{0%{opacity:1;transform:translate(0)scale(1)}to{transform:translate(var(--dx), var(--dy)) scale(.2);opacity:0}}.result{border:1px solid var(--done);background:var(--panel);border-radius:.5rem;padding:1.25rem}.result-rank{align-items:center;gap:1rem;margin-block-end:1rem;display:flex}.result-grade{font-family:var(--mono);font-size:4rem;font-weight:700;line-height:1;animation:.42s cubic-bezier(.2,1.6,.4,1) both stamp}.result-word{color:var(--dim);font-size:.95rem}.result-rank[data-rank=S] .result-grade{color:var(--gold);text-shadow:0 0 28px var(--gold)}.result-rank[data-rank=A] .result-grade{color:var(--done);text-shadow:0 0 24px var(--done)}.result-rank[data-rank=B] .result-grade{color:var(--accent)}.result-rank[data-rank=C] .result-grade,.result-rank[data-rank=D] .result-grade{color:var(--dim)}@keyframes stamp{0%{opacity:0;transform:scale(2.6)}to{opacity:1;transform:scale(1)}}.result dl{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:1rem;margin:0 0 1rem;display:grid}.result dt{color:var(--dim);text-transform:uppercase;letter-spacing:.06em;font-size:.75rem}.result dd{font-family:var(--mono);font-variant-numeric:tabular-nums;margin:0;font-size:1.5rem}.result-actions{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;display:flex}.result-again{font:inherit;color:var(--text);border:1px solid var(--line);cursor:pointer;background:0 0;border-radius:.25rem;padding:.4rem 1rem}.result-again:hover{border-color:var(--accent)}.share{flex-wrap:wrap;align-items:center;gap:.35rem;display:flex}.share-label{color:var(--dim);letter-spacing:.1em;text-transform:uppercase;margin-inline-end:.15rem;font-size:.7rem}.share .chip{font-family:var(--mono);cursor:pointer;color:var(--dim);background:0 0}.share .chip.is-icon{place-items:center;block-size:1.75rem;inline-size:2rem;padding:0;display:inline-grid}.share button.chip[data-state=copied]{color:var(--done);border-color:color-mix(in srgb, var(--done) 50%, var(--line))}.share button.chip[data-state=failed]{color:var(--error);border-color:color-mix(in srgb, var(--error) 50%, var(--line))}@media (width<=40rem){.shell{padding:1rem}h1{font-size:1.15rem}.hud{grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem}.hud-tile{padding:.35rem .45rem}.hud-tile[data-spare=true]{display:none}.hud-value{font-size:1.05rem}.typing{padding:.75rem}.typing-display{font-size:.82rem}.typing-target{font-size:.95rem}.prompt{padding:.5rem .75rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important}}