@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&family=DM+Sans:wght@400;600;700&display=swap');
.overlay:not(.hidden){animation:overlayReveal .22s ease-out}.unlock-card,.practice-picker-card{animation:panelReveal .2s ease-out}@keyframes overlayReveal{from{opacity:0}to{opacity:1}}@keyframes panelReveal{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}button:focus-visible{outline:2px solid #fff36b!important;outline-offset:3px}.save-notice.visible{filter:drop-shadow(0 4px 8px #000)}
.topbar{background:linear-gradient(180deg,#181022,#09070e)!important;border-bottom-color:#6b526d!important;box-shadow:0 5px 24px #000a}.brand-mark{background:linear-gradient(135deg,#fff0a0,#f6c95f 55%,#b77b2e)!important;filter:drop-shadow(0 3px 5px #000)}canvas{image-rendering:pixelated}.icon-btn{background:#1b1225!important;border-color:#76617e!important;transition:transform .15s,background .15s,border-color .15s}.icon-btn:hover,.icon-btn:focus-visible{transform:translateY(-2px);background:#352043!important;border-color:#f6c95f!important;outline:none}.primary-btn{border-width:2px!important;box-shadow:inset 0 0 0 2px #a66c2b,0 5px 0 #4a281c;transition:transform .15s,filter .15s,box-shadow .15s}.primary-btn:hover,.primary-btn:focus-visible{transform:translateY(-3px);filter:brightness(1.12);box-shadow:inset 0 0 0 2px #a66c2b,0 8px 0 #4a281c;outline:none}.primary-btn:active{transform:translateY(2px);box-shadow:inset 0 0 0 2px #a66c2b,0 2px 0 #4a281c}.hero-card,.wizard-card,.objective{box-shadow:0 8px 28px #0008}
:root{--gold:#f6c95f;--cream:#f4ead2;--panel:rgba(20,13,30,.84)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0d0914;color:var(--cream);font-family:'DM Sans',sans-serif}.game-shell{height:100%;display:flex;flex-direction:column}.topbar{height:72px;display:flex;align-items:center;padding:0 28px;background:#120d1d;border-bottom:1px solid #4c394f;z-index:5}.brand{display:flex;align-items:center;gap:12px;width:33%}.brand-mark{display:grid;place-items:center;width:37px;height:45px;color:#1c1021;background:var(--gold);clip-path:polygon(50% 0,100% 18%,88% 80%,50% 100%,12% 80%,0 18%);font:800 24px Cinzel}.brand small,.chapter span,.hero-card small,.wizard-card small{display:block;letter-spacing:.18em;font-size:9px;color:#b9a9c8}.brand strong{font:700 18px Cinzel;letter-spacing:.17em}.chapter{text-align:center;width:34%}.chapter span{color:var(--gold)}.chapter strong{font:600 14px Cinzel;letter-spacing:.08em}.icon-btn{margin-left:auto;width:38px;height:38px;border:1px solid #55465e;border-radius:50%;color:var(--cream);background:transparent;font-size:20px}.playfield{position:relative;flex:1;min-height:0;overflow:hidden}canvas{display:block;width:100%;height:100%;cursor:crosshair}.vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 120px 35px #05030ab8}.boss-hud{position:absolute;top:20px;left:50%;transform:translateX(-50%);width:min(500px,48vw);text-align:center;opacity:0;transition:.4s}.boss-hud.visible{opacity:1}.boss-name{display:flex;justify-content:space-between}.boss-name span{font:700 15px Cinzel;letter-spacing:.1em}.boss-name small{font-size:8px;letter-spacing:.14em}.boss-track{margin-top:7px;height:8px;background:#1b1224;border:1px solid #7e6a6a;padding:2px}.boss-track div{height:100%;background:linear-gradient(90deg,#d64551,#f1815b);transition:width .2s}.hero-card,.wizard-card{position:absolute;bottom:22px;background:var(--panel);border:1px solid #775e70;backdrop-filter:blur(6px)}.hero-card{left:24px;display:flex;gap:12px;padding:10px 14px;min-width:240px}.portrait{width:48px;height:48px;display:grid;place-items:center;border:1px solid #907ca2;background:#2a1d39;font-size:30px}.knight{color:#d8e8ef}.wizard{color:#c890ff}.hero-meta{flex:1}.heart-row{color:#e75d68;letter-spacing:3px;margin:3px 0;font-size:15px}.dash-label{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:.16em}.dash-track{width:90px;height:4px;background:#3a2b45}.dash-track div{height:100%;background:#74d7ed}.wizard-card{right:24px;display:flex;align-items:center;gap:10px;width:295px;padding:9px 14px}.wizard-card p{margin:3px 0 0;font:italic 12px Georgia}.objective{position:absolute;top:22px;left:24px;background:#0d0914ad;border-left:2px solid var(--gold);padding:8px 13px}.objective span{display:block;color:var(--gold);font-size:8px;letter-spacing:.2em}.objective strong{font:600 12px Cinzel}.controls-hint{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:flex;gap:16px;font-size:9px;color:#b8a9c3}kbd{border:1px solid #7a6b84;background:#261c30;border-radius:3px;padding:2px 5px;font-size:8px}.overlay{position:absolute;z-index:10;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:radial-gradient(circle at 50% 42%,#442853b8,#08050ef2 65%);transition:opacity .45s}.overlay.hidden{opacity:0;pointer-events:none}.crest{position:relative;width:82px;height:90px;display:grid;place-items:center;font:42px Cinzel;color:var(--gold);border:1px solid #7b633f;background:#25152d}.crest i{position:absolute;font-size:10px;bottom:13px}.eyebrow{color:var(--gold);letter-spacing:.3em;font-size:10px;font-weight:700;margin:20px 0 8px}.start-screen h1{font:800 clamp(56px,8vw,110px)/.85 Cinzel;margin:5px 0;text-shadow:0 8px 0 #221028}.start-screen h1 span{display:block;color:var(--gold);font-size:.72em;letter-spacing:.25em;margin-left:.25em}.lede{color:#d4c7d7;line-height:1.7;font:italic 16px Georgia}.primary-btn{margin-top:20px;border:1px solid #ffd978;background:linear-gradient(135deg,#f3c75c,#cb8c38);color:#241425;padding:14px 22px;font:700 11px Cinzel;letter-spacing:.13em;cursor:pointer}.primary-btn:hover{transform:translateY(-2px);filter:brightness(1.1)}.primary-btn b{margin-left:18px}.tiny{font-size:9px;color:#8c7d97}.story-card{max-width:650px;background:#160d1ee6;border:1px solid #79613d;padding:42px 55px}.story-card h2,.end-screen h2{font:700 42px/1.1 Cinzel;margin:6px 0}.story-card>p:not(.eyebrow){line-height:1.7;color:#cfc2d3}.dialogue{margin-top:25px;text-align:left;border-left:2px solid #9d67cc;padding:10px 15px;background:#2a1934}.dialogue span{display:block;color:#c58cf0;font-size:9px;letter-spacing:.2em}.dialogue q{font:italic 15px Georgia}.ending-art{display:flex;align-items:end;gap:18px;font-size:64px}.ending-art b{font-size:35px;color:#bc8bff}.ending-art em{color:#e06580}.end-screen h2 i{color:var(--gold);font-style:normal}.end-screen>p:not(.eyebrow){max-width:570px;color:#cfc2d3;line-height:1.7}.score-line{margin-top:15px;padding:10px 30px;border-block:1px solid #6e5c42}.score-line strong{font:700 24px Cinzel;color:var(--gold);margin-left:25px}.toast{position:absolute;z-index:8;top:24%;left:50%;transform:translate(-50%,-50%);font:700 24px Cinzel;text-align:center;text-shadow:0 4px 8px #000;animation:toast 2.5s both}.toast small{display:block;color:var(--gold);font:700 9px 'DM Sans';letter-spacing:.3em}.toast.hidden{display:none}@keyframes toast{0%{opacity:0;transform:translate(-50%,-30%)}15%,75%{opacity:1}100%{opacity:0;transform:translate(-50%,-70%)}}@media(max-width:720px){.topbar{height:56px;padding:0 12px}.brand{width:auto}.brand-mark{width:29px;height:36px}.brand strong{font-size:13px}.brand small,.chapter span{display:none}.chapter{margin-left:auto;width:auto}.chapter strong{font-size:10px}.wizard-card{display:none}.hero-card{bottom:12px;left:12px;min-width:190px;padding:7px}.controls-hint{bottom:14px;left:auto;right:10px;transform:none;flex-direction:column;gap:4px}.objective{top:10px;left:10px}.boss-hud{top:12px;width:58vw}.boss-name small{display:none}.story-card{margin:15px;padding:28px 22px}.start-screen h1{font-size:52px}.portrait{width:38px;height:38px}}
