#alleyDialog{box-sizing:border-box;width:min(1000px,100vw);max-width:100vw;max-height:100dvh;margin:auto;padding:0;border:3px solid #a6608c;background:#101522;color:#fff0cb;font:14px 'DM Mono',monospace;overflow:auto;overscroll-behavior:contain}
#alleyDialog::backdrop{background:#070917eb}#alleyDialog *{box-sizing:border-box}#alleyDialog header{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;background:#201c32}#alleyDialog h2{font:700 15px monospace;margin:0;flex:1}#alleyDialog button,#alleyDialog select{min-height:44px;border:1px solid #ae8e92;background:#30263d;color:#fff0cb;font:inherit;padding:8px 12px;cursor:pointer;touch-action:manipulation}#alleyDialog button:focus-visible,#alleyDialog select:focus-visible{outline:3px solid #73ede5;outline-offset:2px}
#alleyStage{position:relative;background:#11182e}#alleyCanvas{display:block;width:100%;height:auto;image-rendering:pixelated;touch-action:none}#alleyMenu{position:absolute;inset:0;overflow:auto;text-align:center;background:#0d1026d9;padding:16px;display:flex;flex-direction:column;align-items:center;justify-content:safe center;gap:8px}#alleyMenu[hidden],#alleyTouch[hidden],#alleyControls[hidden]{display:none}#alleyMenu p{margin:3px 0;line-height:1.4;font-size:13px}#alleyMenu h3{font-size:32px;margin:8px 0;color:#ffd775;text-shadow:3px 3px #b7467d}#alleyMenu .alley-logo{font-size:clamp(32px,6vw,66px);line-height:.92;letter-spacing:-2px;transform:skew(-5deg);animation:alleyTitle 2s ease-in-out infinite alternate}#alleyMenu .alley-logo em{color:#ff87b3}#alleyMenu .alley-kicker{letter-spacing:3px;color:#9be7ed}#alleyStart{margin:15px 0;background:#803b70!important;border-color:#ffc36b!important}
.alley-roster{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:min(580px,100%)}#alleyDialog .alley-roster button{padding:3px;display:flex;flex-direction:column;align-items:center;background:#24293b}#alleyDialog .alley-roster button[aria-pressed=true]{border:3px solid #ffdc77;background:#44354c}#alleyDialog .alley-roster canvas{width:100%;max-width:110px;image-rendering:pixelated}#alleyDialog .alley-roster small{font-size:11px;color:#d1c4cf}
#alleyFooter{display:flex;justify-content:space-between;padding:6px 12px;font-size:12px}#alleyStatus{margin:0;padding:0 12px;color:#ffc784;line-height:1.5}#alleyTouch{display:flex;justify-content:space-between;gap:12px;padding:8px 10px;background:#171c2b;user-select:none;touch-action:none}#alleyTouch .alley-directions{display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(2,44px);gap:3px}#alleyTouch button{padding:3px;min-width:44px;touch-action:none}#alleyTouch button[aria-pressed=true]{background:#876079}#alleyTouch [data-alley-action=jump]{grid-column:2}#alleyTouch [data-alley-action=left]{grid-row:2;grid-column:1}#alleyTouch [data-alley-action=crouch]{grid-row:2;grid-column:2}#alleyTouch [data-alley-action=right]{grid-row:2;grid-column:3}.alley-attacks{display:grid;grid-template-columns:repeat(3,minmax(50px,90px));gap:4px;font-size:11px}.alley-attacks [data-alley-action=special]{grid-column:2/4}
#alleyControls{position:absolute;inset:0;z-index:5;background:#151829f5;overflow:auto;padding:18px;color:#f6e5bc}#alleyControls h3{margin-top:0}#alleyControls dl{display:grid;grid-template-columns:100px 1fr;gap:8px}#alleyControls dt{color:#8de9e6}#alleyControls dd{margin:0}#alleyControls p{line-height:1.5}#alleyControlsClose{position:sticky;bottom:0}
@keyframes alleyTitle{to{filter:brightness(1.2);transform:skew(-5deg) translateY(-3px)}}@media(prefers-reduced-motion:reduce){#alleyMenu .alley-logo{animation:none}}@media(max-width:600px){#alleyDialog header{gap:4px;padding:5px}#alleyDialog header button{font-size:10px;padding:5px}#alleyDialog h2{font-size:12px}#alleyMenu{padding:10px;gap:4px}#alleyMenu h3{font-size:21px}#alleyMenu p{font-size:11px}.alley-roster{gap:4px}#alleyDialog .alley-roster canvas{max-width:70px}#alleyDialog .alley-roster strong{font-size:12px}#alleyDialog .alley-roster small{font-size:9px}#alleyTouch{gap:5px;padding:5px}#alleyTouch .alley-directions{grid-template-columns:repeat(3,44px)}.alley-attacks{grid-template-columns:repeat(3,minmax(44px,1fr));font-size:9px}#alleyDialog{border-width:1px}#alleyControls{padding:10px;font-size:12px}}
