body{margin:0;background:#080f16;padding:8px}button{touch-action:manipulation}

#void-signal{--ink:#d7eee7;--dim:#88a5a3;--mint:#aafa99;--orange:#ffa566;background:#080f16;color:var(--ink);font:14px 'Courier New',monospace;max-width:1000px;margin:auto;border-radius:12px;overflow:hidden;position:relative;color-scheme:dark}#void-signal *{box-sizing:border-box}#void-signal button,#void-signal select,#void-signal input{font:inherit}#void-signal button{background:#172934;color:var(--ink);border:1px solid #36525b;border-radius:5px;padding:11px 12px;min-height:44px;touch-action:manipulation;cursor:pointer}#void-signal button:hover{background:#29424a}#void-signal button:disabled{opacity:.38;cursor:default}#void-signal button.primary{background:var(--mint);color:#0a221e;border-color:var(--mint);font-weight:bold}#void-signal button.active{border-color:var(--mint);box-shadow:inset 0 0 0 1px var(--mint)}#void-signal header{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid #273e45}#void-signal .brand{font-weight:bold;letter-spacing:3px;color:var(--mint)}#void-signal small{color:var(--dim);font-size:11px}#void-signal .viewport{position:relative;background:#111c23}#void-signal canvas.view{width:100%;display:block;aspect-ratio:2/1;image-rendering:pixelated}#void-signal .scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent,transparent 3px,#0002 4px)}#void-signal .hud{position:absolute;top:12px;left:14px;right:14px;display:flex;justify-content:space-between;gap:8px;text-shadow:0 2px 3px #000;font-size:12px}#void-signal .aim{position:absolute;left:50%;top:49%;color:#befbb777;font-size:24px;pointer-events:none}#void-signal .place{position:absolute;bottom:12px;left:14px;right:14px;display:flex;justify-content:space-between;gap:8px;color:#e5f1df;text-shadow:0 2px 3px #000}#void-signal .mini{width:90px;height:90px;position:absolute;right:12px;top:42px;background:#071317de;border:1px solid #45615a;image-rendering:pixelated}#void-signal .main{padding:12px 14px}#void-signal .crew{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}#void-signal .crew button{text-align:left;padding:9px;min-width:0;position:relative}#void-signal .crew strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#void-signal .bar{height:4px;background:#071319;margin:6px 0}#void-signal .bar i{display:block;height:100%;background:var(--mint)}#void-signal .crew .used{opacity:.55}#void-signal .row{display:flex;gap:7px;align-items:center;flex-wrap:wrap}#void-signal .between{justify-content:space-between}#void-signal .log{min-height:45px;padding:10px 0;color:#d1d5bf;font-size:12px;line-height:1.5}#void-signal .controls{display:grid;grid-template-columns:1fr 1fr;gap:12px}#void-signal .dpad{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}#void-signal .actions{display:grid;grid-template-columns:1fr 1fr;gap:5px}#void-signal .nav{display:flex;gap:5px;margin-top:10px}#void-signal .nav button{flex:1;padding:9px 4px;font-size:12px}#void-signal .panel{padding:20px;background:radial-gradient(ellipse at top right,#263e39,#0d1922 70%)}#void-signal h1{font-size:clamp(32px,8vw,65px);line-height:1;letter-spacing:5px;color:#d7ffb7;margin:12px 0}#void-signal h2{font-size:22px;margin:0 0 14px}#void-signal h3{font-size:16px;color:var(--mint);margin:16px 0 8px}#void-signal p{line-height:1.6;max-width:650px;color:#b2c6c4}#void-signal .kicker{font-size:11px;letter-spacing:3px;color:var(--orange)}#void-signal .splash{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:20px;padding:20px 0}#void-signal .splash canvas{width:100%;image-rendering:pixelated;border-radius:50%}#void-signal .boxes{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}#void-signal .box{padding:12px;border:1px solid #344952;background:#0b1720;border-radius:6px}#void-signal label{display:block;color:#9cb3b3;margin-bottom:8px;font-size:12px}#void-signal input,#void-signal select{width:100%;padding:10px;background:#122630;border:1px solid #436069;color:#e4ede5;border-radius:4px;min-height:44px;font-size:16px}#void-signal .map{width:min(100%,460px);display:block;margin:12px auto;image-rendering:pixelated}#void-signal .item{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #273c43;padding:10px 0}#void-signal .item span{flex:1}#void-signal .tag{color:var(--orange)}#void-signal .enemyrow{display:flex;gap:6px;margin-bottom:8px}#void-signal .enemyrow button{flex:1;font-size:12px}#void-signal .notice{color:var(--orange);padding:8px 0;font-size:12px}#void-signal footer{padding:12px 16px;border-top:1px solid #253a42;color:#7d9998;font-size:11px}#void-signal [hidden]{display:none!important}@media(max-width:520px){#void-signal header{padding:10px}#void-signal .brand{font-size:12px;letter-spacing:2px}#void-signal .main{padding:9px}#void-signal canvas.view{aspect-ratio:1.45}#void-signal .crew{gap:4px}#void-signal .crew button{padding:7px 5px;font-size:11px}#void-signal .crew small{font-size:10px}#void-signal .controls{gap:7px}#void-signal .controls button{padding:9px 3px;font-size:12px}#void-signal .panel{padding:16px}#void-signal .splash{grid-template-columns:1fr;padding:12px 0;gap:5px}#void-signal .splash canvas{width:150px;position:absolute;right:-25px;top:65px;opacity:.32;pointer-events:none}#void-signal .splash>div{position:relative;z-index:1}#void-signal .mini{width:66px;height:66px}#void-signal .place{font-size:11px}#void-signal .boxes{gap:7px}}

/* Safe-area padding keeps controls away from camera cutouts and the home indicator. */
html{background:#080f16;color-scheme:dark;-webkit-text-size-adjust:100%}
body{padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overscroll-behavior-y:none}
#void-signal .identity{display:flex;align-items:center;gap:9px;min-width:0}
#void-signal .identity img{border-radius:8px;flex:none}
#void-signal .header-actions{display:flex;gap:5px;flex-shrink:0}
#void-signal .header-actions button{font-size:12px;padding:9px}
#void-signal .header-actions [hidden]{display:none}
#void-signal .identity small{display:block}
#void-signal #offline-status{display:block;margin-top:5px;color:#aafa99}
#void-signal button:focus-visible{outline:2px solid #ffa566;outline-offset:2px}
#void-signal button{ -webkit-tap-highlight-color:transparent }
#void-signal .dpad,#void-signal .actions,#void-signal .crew{user-select:none;-webkit-user-select:none}
#install-dialog{background:#10212b;color:#d7eee7;border:1px solid #36525b;border-radius:12px;max-width:min(420px,calc(100% - 32px));padding:22px;font:15px/1.6 'Courier New',monospace}
#install-dialog::backdrop{background:#000b}
#install-dialog h2{font-size:22px;color:#aafa99}
#install-dialog button{min-height:44px;padding:10px 18px;background:#aafa99;border:0;border-radius:5px;color:#0a221e;font:inherit}
#install-dialog a{color:#aafa99}
@media(max-width:440px){#void-signal .identity small{display:none}#void-signal .identity img{width:28px;height:28px}#void-signal header{gap:4px}#void-signal .brand{font-size:11px;letter-spacing:1px}#void-signal .header-actions button{padding:8px;font-size:11px}}
@media(max-width:350px){#void-signal .identity img{display:none}#void-signal .crew small{font-size:10px}#void-signal .panel{padding:12px}}
@media (orientation:landscape) and (max-height:520px){#void-signal canvas.view{max-height:220px;aspect-ratio:2.5}#void-signal .main{padding-top:8px}}
