:root{--ink:#5a4636;--ink-soft:#8a7360;--cream:#fff8e8;--cream-2:#f6ead0;--sky-1:#8fc6ee;--sky-2:#c4e3f8;--mint:#9fdfc4;--lavender:#bfaef0;--peach:#ffc9a6;--pink:#f7a6b8;--gold:#ffd877;--leaf:#5f9e5f;--drop:#5a463647;--px:0 -3px 0 0 var(--ink), 0 3px 0 0 var(--ink), -3px 0 0 0 var(--ink), 3px 0 0 0 var(--ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--cream);color:var(--ink);-webkit-font-smoothing:antialiased;font-family:Nunito,system-ui,sans-serif;font-weight:500}button,input{font:inherit}.page{flex-direction:column;min-height:100%;padding-bottom:40px;display:flex;position:relative;overflow:hidden}.frescoes{background:linear-gradient(180deg, var(--sky-1) 0%, var(--sky-2) 45%, var(--cream) 90%);pointer-events:none;position:fixed;inset:0}.fresco{width:var(--w);opacity:.7;image-rendering:pixelated;transform:rotate(var(--tilt));position:absolute}.fresco-1{--w:clamp(110px, 13.5vw, 210px);--tilt:-5deg;top:10vh;left:3%}.fresco-2{--w:clamp(100px, 12vw, 185px);--tilt:4deg;top:4vh;left:27%}.fresco-3{--w:clamp(100px, 12.5vw, 195px);--tilt:-3deg;top:6vh;right:16%}.fresco-4{--w:clamp(100px, 12vw, 185px);--tilt:3deg;bottom:3vh;left:10%}.fresco-5{--w:clamp(95px, 11.5vw, 175px);--tilt:-4deg;bottom:1vh;left:43%}.fresco-6{--w:clamp(95px, 11vw, 170px);--tilt:6deg;bottom:5vh;right:3%}@media (width<=900px){.fresco{opacity:.4}}.brand{z-index:1;background:var(--cream);box-shadow:0 3px 0 0 var(--ink), 0 9px 0 0 var(--drop);align-items:center;gap:10px;padding:14px 24px;font-size:24px;font-weight:700;display:flex;position:relative}.logo{width:34px;height:34px}.modes button,.primary,.send,.mic,.skill-card,.back{color:var(--ink);cursor:pointer;box-shadow:var(--px), 0 7px 0 0 var(--drop);border:0;font-weight:800;transition:transform 80ms,box-shadow 80ms,filter .15s}.modes button:hover:not(:disabled),.primary:hover,.send:hover:not(:disabled),.mic:hover:not(:disabled),.skill-card:hover,.back:hover{filter:brightness(1.04);box-shadow:var(--px), 0 9px 0 0 var(--drop);transform:translateY(-2px)}.modes button:active,.primary:active,.send:active:not(:disabled),.mic:active:not(:disabled),.skill-card:active,.back:active{box-shadow:var(--px), 0 3px 0 0 var(--drop);transform:translateY(4px)}button:focus-visible,input:focus-visible{outline:3px dashed var(--lavender);outline-offset:5px}.hero{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:22px;width:100%;max-width:720px;margin:0 auto;padding:48px 16px 10vh;display:flex;position:relative}.tagline{letter-spacing:-.01em;text-wrap:balance;text-shadow:0 3px #fffc;max-width:640px;margin:0;font-size:clamp(26px,4vw,40px);font-weight:800;line-height:1.15}h1{color:var(--ink);letter-spacing:-.01em;margin:0;font-size:clamp(34px,6vw,56px);font-weight:800;line-height:1.1}.prompt{background:var(--cream);width:100%;box-shadow:var(--px), 0 9px 0 0 var(--drop);align-items:center;gap:12px;margin-top:12px;padding:10px 10px 10px 20px;display:flex}.prompt input{min-width:0;color:var(--ink);background:0 0;border:0;outline:0;flex:1;font-size:19px;font-weight:700}.prompt input::placeholder{color:var(--ink-soft);opacity:.6}.mic{background:var(--peach);flex:none;place-items:center;width:50px;height:50px;display:grid}.mic:disabled{opacity:.45;cursor:not-allowed}.mic.listening{background:var(--pink);animation:.6s steps(2,end) infinite bob}@keyframes bob{50%{transform:translateY(-3px)}}.hint{color:var(--ink-soft);margin:0;font-size:14px}.game,.skills,.skill-view{flex-direction:column;gap:22px;width:100%;margin:32px auto 0;padding:0 16px;display:flex;position:relative}.game{align-items:center;max-width:992px}.skills{max-width:672px}.skill-view{max-width:1072px}.game-top{align-items:center;width:100%;display:flex}.back{background:var(--cream);padding:8px 14px;font-size:14px}.modes{gap:16px;display:flex}.modes button,.primary{background:var(--cream);align-items:center;gap:8px;padding:11px 20px;font-size:16px;display:inline-flex}.modes button.active,.primary{background:var(--lavender)}.modes button:nth-child(2){background:var(--mint)}.arena{background:var(--cream-2);width:min(100%,154vh - 385px);box-shadow:var(--px), 0 10px 0 0 var(--drop);touch-action:none;padding:10px;position:relative}.arena canvas{width:100%;box-shadow:0 0 0 3px var(--ink);image-rendering:pixelated;display:block}h2{margin:0;font-size:30px;font-weight:800}h3{color:var(--ink-soft);letter-spacing:.04em;text-transform:uppercase;margin:22px 0 10px;font-size:15px;font-weight:700}.skills-head{background:var(--cream);box-shadow:var(--px), 0 7px 0 0 var(--drop);align-self:flex-start;padding:10px 18px}.skill-list{flex-direction:column;gap:18px;margin:0;padding:0;list-style:none;display:flex}.skill-card{background:var(--cream);text-align:left;align-items:center;gap:16px;width:100%;padding:14px 18px;display:flex}.skill-card-body{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.skill-card strong{font-size:18px}.skill-file{color:#6f8fc9;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700}.skill-goal{color:var(--ink-soft);font-size:14px}.chevron{font-size:18px}.level-badge{background:var(--gold);width:44px;height:44px;box-shadow:var(--px);flex:none;place-items:center;font-size:18px;font-weight:700;display:grid}.skill-list li:nth-child(5n+2) .level-badge{background:var(--mint)}.skill-list li:nth-child(5n+3) .level-badge{background:var(--peach)}.skill-list li:nth-child(5n+4) .level-badge{background:var(--lavender)}.skill-list li:nth-child(5n+5) .level-badge{background:var(--pink)}.level-badge.large{width:56px;height:56px;font-size:22px}.skill-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start;gap:28px;display:grid}@media (width<=820px){.skill-layout{grid-template-columns:1fr}}.skill-doc,.chat{background:var(--cream);box-shadow:var(--px), 0 10px 0 0 var(--drop)}.skill-doc{padding:24px}.skill-doc header{align-items:center;gap:16px;display:flex}.skill-desc{margin:16px 0;line-height:1.5}.goal{box-shadow:inset 4px 0 0 var(--mint);background:#e3f5ec;flex-direction:column;gap:2px;padding:10px 16px;display:flex}.goal span{color:var(--ink-soft);font-size:13px}.steps{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.steps li{gap:14px;padding-bottom:14px;line-height:1.45;display:flex;position:relative}.steps li:not(:last-child):before{content:"";border-left:3px dotted var(--ink-soft);position:absolute;top:30px;bottom:2px;left:13px}.step-num{background:var(--lavender);width:28px;height:28px;box-shadow:0 0 0 3px var(--ink);flex:none;place-items:center;font-weight:700;display:grid}.checks{color:var(--leaf);flex-direction:column;gap:6px;margin:0;padding:0;font-weight:700;list-style:none;display:flex}.action-chips{flex-wrap:wrap;gap:10px;display:flex}.action-chips code{background:var(--cream-2);box-shadow:0 0 0 2px var(--ink);padding:3px 10px;font-size:13px}.chat{flex-direction:column;height:min(620px,80vh);display:flex;position:sticky;top:24px}.chat-head{background:var(--mint);border-bottom:3px solid var(--ink);flex-direction:column;gap:2px;padding:14px 20px;display:flex}.chat-head strong{font-size:18px;font-weight:800}.chat-head span{font-size:13px}.chat-log{flex-direction:column;flex:1;gap:14px;padding:18px;display:flex;overflow-y:auto}.bubble{white-space:pre-wrap;max-width:85%;box-shadow:var(--px);padding:10px 14px;line-height:1.45}.bubble.user{background:var(--lavender);align-self:flex-end}.bubble.model{background:#fff;align-self:flex-start}.typing{gap:5px;display:flex}.typing span{background:var(--ink-soft);width:6px;height:6px;animation:.9s steps(2,end) infinite blink}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes blink{50%{opacity:.2}}.chat-error{color:#a23b52;background:#ffe1e6;padding:10px 14px;font-size:14px;box-shadow:0 0 0 2px #d9677e}.chat-input{border-top:3px solid var(--ink);background:var(--cream-2);gap:12px;padding:14px;display:flex}.chat-input input{min-width:0;box-shadow:0 0 0 3px var(--ink);color:var(--ink);background:#fff;border:0;outline:0;flex:1;padding:10px 14px}.send{background:var(--peach);width:44px;height:44px;font-size:18px}.send:disabled{opacity:.45;cursor:not-allowed}@media (prefers-reduced-motion:reduce){.mic.listening,.typing span{animation:none}}.face{width:148px;height:148px;box-shadow:var(--px), 0 9px 0 0 var(--drop);background:linear-gradient(#d9c8ff,#a98bf0);padding:6px}.face svg{width:100%;height:100%;display:block}.hal{width:150px;height:150px;box-shadow:0 10px 0 0 var(--drop);border-radius:50%}.hal svg{width:100%;height:100%;display:block}.hal-iris{transition:transform .25s ease-out}