.dogger-cabinet{max-width:850px;margin:0 auto;padding:clamp(.65rem,2vw,1.5rem);border:1px solid rgba(176,218,190,.35);border-radius:1.4rem;background:var(--scene-surface,rgba(12,29,30,.64));box-shadow:0 20px 70px rgba(0,0,0,.18)}
.dogger-topline,.dogger-bottom,.dogger-dogs,.dogger-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem}.dogger-topline,.dogger-bottom{justify-content:space-between}.dogger-cabinet-mark{font:700 .72rem/1.2 monospace;letter-spacing:.18em;color:#cfdeb0}.dogger-dogs button,.dogger-controls button,.dogger-dpad button{min-height:44px;border:1px solid rgba(184,218,188,.45);border-radius:.7rem;padding:.55rem .9rem;background:rgba(45,75,59,.35);color:inherit;font:inherit;cursor:pointer}.dogger-dogs button{display:flex;align-items:center;gap:.6rem}.dogger-dogs img{width:48px;height:48px;object-fit:cover;border-radius:50%;border:1px solid rgba(255,255,255,.5)}.dogger-dogs button[aria-pressed=true]{border-color:#d9ef9c;background:rgba(125,157,68,.25)}.dogger-hud{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;margin:1rem 0}.dogger-hud span{padding:.6rem .3rem;border-top:1px solid rgba(190,220,190,.25);font-size:.75rem;text-align:center;color:#d4e1d9}.dogger-hud b{display:block;margin-top:.2rem;color:#f1f5da;font-size:clamp(1.1rem,3vw,1.65rem);font-variant-numeric:tabular-nums;line-height:1.2}.dogger-stage{position:relative;border:1px solid rgba(186,213,174,.4);border-radius:.8rem;overflow:hidden;background:transparent}#dogger-canvas{display:block;width:100%;height:auto;aspect-ratio:1;touch-action:none;outline-offset:-4px}.dogger-bottom{margin-top:1rem}.dogger-controls button:first-child{border-color:#d9ef9c;background:rgba(139,164,73,.28)}.dogger-controls button:disabled{color:#a6b2a7;cursor:default}.dogger-dpad{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,44px);gap:4px}.dogger-dpad button{padding:0;font-size:1.2rem;touch-action:manipulation}.dogger-dpad [data-dogger-move=up]{grid-column:2}.dogger-dpad [data-dogger-move=left]{grid-column:1;grid-row:2}.dogger-dpad [data-dogger-move=down]{grid-column:2;grid-row:2}.dogger-dpad [data-dogger-move=right]{grid-column:3;grid-row:2}.dogger-cabinet button:focus-visible,#dogger-canvas:focus-visible{outline:3px solid #e0f4ab;outline-offset:3px}#dogger-canvas:focus-visible{outline-offset:-4px}[data-dogger-status]{min-height:1.5em;margin:.9rem 0 0;font-size:.95rem;color:#e6efd2}.dogger-instructions{max-width:850px;margin:1.6rem auto;line-height:1.7}.dogger-section .content-section>p{max-width:850px;margin-inline:auto}@media(max-width:600px){.dogger-cabinet-mark{display:none}.dogger-dogs{width:100%}.dogger-dogs button{flex:1;justify-content:center;padding:.35rem}.dogger-hud{gap:.15rem}.dogger-hud span{font-size:.65rem}.dogger-controls{flex:1;gap:.35rem}.dogger-controls button{padding:.5rem .65rem;font-size:.85rem}.dogger-bottom{align-items:center}.dogger-dpad{margin-left:auto}.dogger-instructions{font-size:.95rem}}

@media(min-width:760px){.dogger-stage{max-width:min(100%,65vh);margin-inline:auto}}