*{box-sizing:border-box}body{margin:0;background:#101927;color:#f3f5fb;font:16px system-ui,sans-serif}main{width:min(100%,520px);margin:auto;padding:16px}header{border-top:5px solid hsl(351 70% 65%);padding-top:12px}h1{font-size:2rem;margin:6px 0 18px;overflow-wrap:anywhere}small{letter-spacing:.12em;color:#a5b8d7}#status{background:#243348;padding:12px;border-radius:12px;line-height:1.65}#message{min-height:48px;color:#ffc96b;font-weight:600}#scene{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:16px 0}button{min-width:44px;min-height:52px;border:1px solid #8195b2;border-radius:12px;font:inherit;font-weight:650;background:#263b57;color:white;padding:9px 5px;touch-action:manipulation;overflow-wrap:anywhere;cursor:pointer}button:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:3px}button:disabled{opacity:.62;cursor:default}.selected{outline:3px solid #fff;background:#594c82}.tone0{background:#9b4255}.tone1{background:#286783}.tone2{background:#4e6b34}.tone3{background:#715193}.empty{background:#182536}#actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}details{margin-top:16px;background:#1c2a3e;border-radius:12px;padding:4px 12px}summary{min-height:48px;display:flex;align-items:center;cursor:pointer;font-weight:700}details p{line-height:1.6}a{display:block;min-height:48px;color:#9fe1ff;padding:12px 0;overflow-wrap:anywhere}.won{color:#8ef1bf!important}.lost{color:#ff9d9d!important}@media(max-width:350px){main{padding:10px}#scene{gap:5px}button{font-size:14px}}
.readout{background:#ece5cc;color:#152d31;border:2px solid #f6cd72;border-radius:12px;padding:14px;font-weight:800;line-height:1.6}header small{font-size:11px;letter-spacing:.08em}#status{font-size:14px}#scene button{white-space:pre-line}#message{padding:10px 0;line-height:1.5}button{transition:background .15s,transform .15s}button:not(:disabled):active{transform:scale(.96)}
body{background:radial-gradient(ellipse at top,#3f2948,#121a2a 70%)}#scene button{opacity:1;height:70px;font-size:12px}#scene .tone0,#scene .tone2{border-bottom:5px solid #eab786}#scene .tone1,#scene .tone3{border-bottom:5px solid #9bd6eb}#readout{background:#493746;color:#ffe3ba}#actions [data-action="riposte"],#actions [data-action="guard"]{border:2px solid #f7cf82;background:#72513c}