/* One shared edge for the header, game and footer. */
body{--page-width:calc(100% - 64px);min-height:100vh;min-height:100svh;display:flex;flex-direction:column}
.topbar,.shell,.footer{width:var(--page-width);max-width:none;margin-inline:auto}
.topbar{padding:20px 0;flex-shrink:0}
.shell{flex:1;margin-block:0;display:flex;flex-direction:column;padding-block:8px 16px}
.game{flex:1;min-height:210px}
canvas{height:clamp(180px,calc(100svh - 540px),480px)}
.systemline{margin-bottom:4px}
.gamefoot{margin:6px 0 12px}
.errorcontent{margin-top:20px}
h1{margin-bottom:4px}
.intro{margin-bottom:12px}
.errorcode{margin:12px 0}
.log{margin-top:16px;padding-top:10px;min-height:0}
.footer{flex-shrink:0;margin-top:0;padding:14px 0 20px;align-items:center;gap:20px}
.footer-links{display:flex;align-items:center;justify-content:flex-end;gap:24px;margin-left:auto}
.footer a{color:inherit;text-decoration:none}.footer a:hover{color:var(--blue)}
@media(max-width:600px){body{--page-width:calc(100% - 32px)}.topbar{padding:18px 0}.shell{margin-top:0;padding-top:4px}.game{min-height:250px}canvas{height:220px}.errorcontent{margin-top:20px}.footer{padding-bottom:max(18px,env(safe-area-inset-bottom));font-size:16px}.footer-links{gap:20px}}
@media(max-height:600px) and (orientation:landscape){canvas{height:180px}.game{min-height:210px}}
/* Compact status and navigation, in reading order. */
.topbar .topright{display:flex;align-items:center;gap:24px;max-width:none}
.topbar .textbutton{color:var(--ink);text-decoration:none;white-space:nowrap;font-size:18px}
.topbar .textbutton:hover{color:var(--blue)}
.topbar .signal{display:inline-flex;color:#a8adb5;gap:12px;white-space:nowrap}
.topbar .signal::before{content:none}
.signal-pixel{width:7px;height:7px;display:inline-block;flex:none;background:#2678ff;border-radius:0;animation:signal-beep 1.6s steps(1,end) infinite}
#sound-status{color:var(--blue)}
@keyframes signal-beep{0%,30%,100%{opacity:1}31%,69%{opacity:.15}}
@media(max-width:700px){.topbar{flex-wrap:wrap}.topbar .topright{gap:12px 20px;justify-content:flex-start;flex-wrap:wrap}.topbar .textbutton,.topbar .signal{font-size:16px}}
@media(prefers-reduced-motion:reduce){.signal-pixel{animation:none}}

#pause-toggle{color:var(--ink);border:1px solid var(--line);border-radius:3px;padding:3px 12px;min-height:32px;margin-left:auto;font:18px VT323,monospace}#pause-toggle:hover:not(:disabled){color:var(--blue);border-color:var(--blue)}#pause-toggle:disabled{opacity:.4;cursor:default}.gamefoot{align-items:center;gap:16px}

.systemline{align-items:center;gap:16px}.systemline #world{min-width:0}.systemline .scoreline{flex-shrink:0;white-space:nowrap;gap:20px}
.card-identity{display:grid;gap:6px;margin-bottom:16px}.card-identity label{font:20px VT323,monospace}.card-identity label span{color:var(--muted)}.card-identity input{width:100%;min-width:0;padding:10px;border:1px solid var(--line);border-radius:3px;background:var(--bg);color:var(--ink);font:16px VT323,monospace}.card-identity input:focus{outline:2px solid var(--blue);outline-offset:2px}.card-identity p{margin:0;font:16px VT323,monospace}#identity-error:empty{display:none}#identity-error{color:var(--ink)}#card-dialog{max-height:90svh;overflow:auto}#card-dialog img{display:block;max-height:42svh;object-fit:contain} @media(max-width:600px){.systemline .scoreline{gap:10px;font-size:11px;letter-spacing:1px}.systemline #world{font-size:14px}}

.errorcontent .actions #details-toggle{margin-left:0}.errorcontent .actions #reload{margin-left:auto;background:#fff;color:#3c4859}.terminal .contract-address{min-width:0;overflow-wrap:anywhere}