.hub-visual{padding:24px 4px 15px}.hub-window{transform:rotate(-3deg);border:3px solid #30293e;box-shadow:7px 9px 0 #30293e,12px 15px 0 #a8b7d8}.hub-window .visual-toolbar{background:#272237;color:#e9e4f4;font-size:8px;padding:15px}.hub-screen{position:relative;isolation:isolate;overflow:hidden;container-type:inline-size;background:#3e7cbc;color:#f8f4ef;font-family:monospace}.hub-capture{display:block;width:100%;height:auto}.hub-vignette{position:absolute;inset:0;background:linear-gradient(#141a3740,transparent 25%,transparent 70%,#121529aa);pointer-events:none}.hub-hud{position:absolute;top:8%;left:5%;right:5%;display:flex;justify-content:space-between;align-items:flex-start}.hud-player{padding:2cqw 2.5cqw;background:#201d36ed;border:1px solid #9a8eba;border-radius:6px;box-shadow:3px 3px #18213480}.hud-label{display:block;font-size:1.6cqw;letter-spacing:.3cqw;color:#c9c1db}.hud-hearts{display:block;color:#ff9cab;font-size:3.4cqw;letter-spacing:.35cqw;margin-top:1cqw;line-height:1}.hud-tools{display:flex;gap:1cqw}.hud-tools button,.hud-tools a{display:grid;place-items:center;width:6cqw;height:6cqw;min-width:26px;min-height:26px;border:1px solid #a398ba;border-radius:5px;background:#201d36e8;color:white;font:2.5cqw monospace}.hub-menu{position:absolute;top:24%;right:5%;width:46%;border:1px solid #b09bda;background:#211d36f5;border-radius:8px;padding:2.5cqw;box-shadow:4px 5px 0 #171c3a80}.hub-menu-top{display:flex;align-items:center;gap:1.2cqw;font-size:1.8cqw;letter-spacing:.2cqw;margin-bottom:2cqw}.hub-menu-dot{width:1cqw;height:1cqw;background:#c6ed70;box-shadow:0 0 8px #c6ed7077}.hub-menu-top small{margin-left:auto;color:#ada2c5;font-size:1.2cqw;letter-spacing:0}.hub-levels{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2cqw}.hub-levels button{position:relative;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8cqw;border:1px solid #6f608f;background:#38304c;color:#d6caee;border-radius:5px;font:2.3cqw monospace;transition:background .15s,color .15s,translate .15s}.hub-levels button i{font-style:normal;font-size:1.5cqw;color:#9b8daf}.hub-levels button:hover{translate:0 -2px;background:#514268}.hub-levels button[aria-pressed=true]{color:#262532;background:#c7eb8b;border-color:#e4ffc0;box-shadow:0 0 14px #c7eb8b22}.hub-levels button[aria-pressed=true] i{color:#5c7933}.hub-selection{margin-top:2cqw;padding-top:1.8cqw;border-top:1px solid #514365;font-size:1.3cqw;letter-spacing:.1cqw;color:#d5e7b6;display:flex;justify-content:space-between}.hub-selection span{font-size:1.8cqw}.hub-portal{position:absolute;left:27.5%;top:44%;width:10%;height:13%;pointer-events:none}.hub-portal span,.hub-portal i{position:absolute;inset:0;border:2px solid #d6c1ff;border-radius:50%;box-shadow:inset 0 0 9px #c7b2ff,0 0 12px #b497f3;animation:hubPortal 3s ease-in-out infinite;animation-play-state:paused}.hub-portal i{inset:-12%;border:1px dotted #e7daff;animation-delay:-1.5s;box-shadow:none}.school-visual .hub-enemy{position:absolute;width:9%;height:auto;pointer-events:none;filter:drop-shadow(2px 3px 0 #23223466);animation-play-state:paused}.hub-slime{left:12%;top:58%;transform-origin:50% 100%;animation:hubHop 2.8s ease-in-out infinite paused}.hub-bat{left:16%;top:31%;animation:hubFly 5s ease-in-out infinite paused}.hub-orb{position:absolute;left:38%;top:49%;width:1.8%;aspect-ratio:1;border-radius:50%;background:#e5ffd4;box-shadow:0 0 8px #baff85;animation:hubShot 4s linear infinite paused;pointer-events:none}.hub-sparks{position:absolute;inset:0;pointer-events:none}.hub-sparks i{position:absolute;left:21%;top:25%;font-style:normal;color:#e6d6ff;font-size:3cqw;animation:hubSpark 4s ease-in-out infinite paused}.hub-sparks i:nth-child(2){left:44%;top:37%;animation-delay:-1s}.hub-sparks i:nth-child(3){left:87%;top:65%;animation-delay:-2.3s}.hub-bottom{position:absolute;bottom:4%;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;gap:2cqw;font-size:1.4cqw;text-shadow:0 1px 2px #111}.hub-bottom>span:first-child{display:flex;align-items:center;gap:.8cqw}.hub-bottom b{font-weight:400;border:1px solid #b3a9c8;background:#272237df;border-radius:3px;padding:.8cqw 1cqw}.hub-motto{color:#d9edb2;letter-spacing:.1cqw}.hub-window .game-metrics{background:#272237}.hub-screen[data-running=true] .hub-enemy,.hub-screen[data-running=true] .hub-orb,.hub-screen[data-running=true] .hub-portal span,.hub-screen[data-running=true] .hub-portal i,.hub-screen[data-running=true] .hub-sparks i{animation-play-state:running}
@keyframes hubHop{0%,45%,100%{transform:translateY(0) scale(1,1)}50%{transform:translateY(0) scale(1.12,.8)}65%{transform:translateY(-18px) scale(.92,1.08)}80%{transform:translateY(0) scale(1.1,.86)}}
@keyframes hubFly{0%,100%{transform:translate(0,0) rotate(-5deg)}50%{transform:translate(18px,-13px) rotate(7deg)}}
@keyframes hubPortal{0%,100%{transform:scale(.95);opacity:.5}50%{transform:scale(1.05);opacity:1}}
@keyframes hubShot{0%,28%{transform:translateX(0);opacity:0}30%{opacity:1}65%{transform:translateX(130px);opacity:0}100%{transform:translateX(130px);opacity:0}}
@keyframes hubSpark{0%,100%{transform:translateY(0);opacity:.2}50%{transform:translateY(-8px);opacity:.8}}
[data-theme=ascii] .hub-window{box-shadow:7px 9px 0 #0c0c0c,12px 15px 0 #444}
@media(max-width:760px){.hub-visual{padding:14px 5px 9px}.hub-window{transform:rotate(-2deg);box-shadow:4px 6px 0 #30293e,8px 10px 0 #a8b7d8}.hub-window .visual-toolbar{font-size:6px;padding:12px 10px}.hub-menu{width:48%;right:4%}.hub-menu-top{font-size:2cqw}.hub-menu-top small{font-size:1.3cqw}.hub-selection{font-size:1.5cqw}.hub-bottom{font-size:1.6cqw}.hub-motto{display:none}.hub-levels button{font-size:2.8cqw}.hub-hud{left:4%;right:4%}.hub-portal span{border-width:1px}}
@media(prefers-reduced-motion:reduce){.hub-screen *{animation:none!important;transition:none!important}}
.knight-game{display:none;position:absolute;inset:0;width:100%;height:100%;outline-offset:-4px;touch-action:pan-y}.game-ready .knight-game{display:block}.hub-menu[hidden],.hub-return[hidden]{display:none!important}.hub-menu{top:20%;width:48%;z-index:3}.hub-hud,.hub-bottom{z-index:4}.hub-play,.game-resume,.game-retry{width:100%;margin-top:2cqw;padding:2cqw 1cqw;background:#c7eb8b;color:#272237;border:1px solid #e3ffbf;border-radius:5px;font:bold 1.9cqw monospace;letter-spacing:.12cqw}.hub-play:disabled{opacity:.5;cursor:wait}#knight-help{font:1.4cqw/1.7 monospace;color:#b9b0cc;text-align:center;margin:1.5cqw 0 0}.game-score{display:none;font:1.6cqw monospace;color:#f1e1a4;margin-top:1cqw}.hub-screen[data-mode=play] .game-score,.hub-screen[data-mode=won] .game-score{display:block}.hub-screen[data-mode=play] .hub-portal,.hub-screen[data-mode=play] .hub-orb,.hub-screen[data-mode=play] .hub-slime,.hub-screen[data-mode=won] .hub-portal,.hub-screen[data-mode=won] .hub-orb,.hub-screen[data-mode=won] .hub-slime{display:none}.hub-screen[data-mode=play] .hub-bat{opacity:.35}.hud-tools .hub-return{width:auto;padding:0 1.5cqw;font-size:1.7cqw}.hub-screen[data-mode=hub] .game-touch{visibility:hidden}.game-touch{display:flex;gap:1.2cqw;pointer-events:auto}.game-touch button{min-width:32px;min-height:32px;padding:1.3cqw 2cqw;border:1px solid #a99dbd;border-radius:5px;background:#252036ee;color:#fff;font:2cqw monospace;touch-action:none;user-select:none;-webkit-user-select:none}.game-touch button.held{background:#c7eb8b;color:#252036}.game-announcement{position:absolute;bottom:13%;left:5%;right:5%;text-align:center;font:1.6cqw/1.4 monospace;color:#fff;text-shadow:0 1px 3px #151428;pointer-events:none}.game-pause-panel,.game-win-panel{display:none;position:absolute;z-index:5;top:30%;left:25%;width:50%;padding:4cqw;background:#211d36f5;border:1px solid #ab99c9;border-radius:8px;text-align:center;box-shadow:4px 5px #171c3a80}.game-pause-panel>span,.game-win-panel>span{font:1.7cqw monospace;letter-spacing:.2cqw;color:#c4b3e4}.game-win-panel strong{display:block;font-size:4cqw;margin-top:2cqw}.game-paused .game-pause-panel{display:block}.hub-screen[data-mode=won] .game-win-panel{display:block}.knight-game:focus-visible{outline:2px solid #c7eb8b}.hub-vignette{pointer-events:none}.hub-screen[data-mode=hub] .game-announcement{display:none}
@media(max-width:760px){.hub-menu{width:51%;right:3%;top:20%}.hub-play{font-size:2.1cqw;padding:2.2cqw 1cqw}#knight-help{font-size:1.6cqw}.game-touch button{font-size:2.6cqw;min-height:36px;min-width:36px}.game-announcement{font-size:2cqw;bottom:18%}.game-resume,.game-retry{font-size:2.4cqw;padding:3cqw 1cqw}.hud-tools .hub-return{font-size:2.1cqw}}

.hub-window .game-metrics{gap:16px;flex-wrap:wrap}.hub-window .game-metrics small{line-height:1.6;text-align:right;max-width:270px}.hub-window .game-metrics small span{opacity:.7;font-size:.9em}@media(max-width:760px){.hub-window .game-metrics{align-items:flex-start;gap:8px}.hub-window .game-metrics small{text-align:left;max-width:100%}}