:root{
  --paper:#d9cfad;
  --paper-ink:#29251e;
  --chassis:#34383a;
  --chassis-dark:#17191a;
  --edge:#6b6d69;
  --phosphor:#69ffd7;
  --amber:#ffc15a;
  --red:#ff4f44;
  --lens:#65ffe0;
  --lens-dim:rgba(101,255,224,.18);
}

html[data-fn-lens="vril"]{--lens:#78baff;--lens-dim:rgba(120,186,255,.18)}
html[data-fn-lens="double_agent"]{--lens:#ff64c7;--lens-dim:rgba(255,100,199,.18)}
html[data-fn-lens="observer"]{--lens:#e0b866;--lens-dim:rgba(224,184,102,.18)}

*{box-sizing:border-box}
html{background:#050606}
body{
  margin:0;
  min-height:100vh;
  color:#e5e0cf;
  background:
    linear-gradient(rgba(3,6,7,.9),rgba(3,6,7,.96)),
    repeating-linear-gradient(90deg,#17211e 0,#17211e 1px,#0a0c0c 1px,#0a0c0c 8px);
  font-family:"Share Tech Mono",monospace;
  padding:22px;
}

a{color:var(--lens)}
button,input,select,textarea{font:inherit}
.skip-link{position:fixed;left:12px;top:-80px;background:#fff;color:#000;padding:10px;z-index:100}
.skip-link:focus{top:12px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.desk-shell{width:min(1320px,100%);margin:0 auto;filter:drop-shadow(0 28px 35px #000)}
.fn-chassis{
  border:2px solid #0b0c0c;
  background:
    radial-gradient(circle at 12px 12px,#101111 0 2px,#777 3px 4px,transparent 5px),
    radial-gradient(circle at calc(100% - 12px) 12px,#101111 0 2px,#777 3px 4px,transparent 5px),
    radial-gradient(circle at 12px calc(100% - 12px),#101111 0 2px,#777 3px 4px,transparent 5px),
    radial-gradient(circle at calc(100% - 12px) calc(100% - 12px),#101111 0 2px,#777 3px 4px,transparent 5px),
    linear-gradient(165deg,#45494a,#242728 52%,#17191a);
  box-shadow:inset 0 1px #777,inset 0 -2px #0a0b0b,0 8px 18px rgba(0,0,0,.6);
}

.station-header{
  display:grid;
  grid-template-columns:180px 1fr auto 148px;
  align-items:center;
  gap:18px;
  padding:18px 22px;
  border-radius:4px 4px 0 0;
}
.station-mark{display:grid;grid-template-columns:1fr auto;text-decoration:none;color:#f0ead7;line-height:.82;border:3px double #b8ad91;padding:10px;background:#171918}
.station-mark span{font-family:VT323,monospace;font-size:52px;letter-spacing:.08em}
.station-mark b{font:38px VT323,monospace;color:var(--amber)}
.station-mark small{grid-column:1/-1;letter-spacing:.42em;font-size:10px;margin-top:8px}
.eyebrow{color:#aeb7ae;font-size:11px;letter-spacing:.16em}
.station-id h1{font:clamp(38px,6vw,70px)/.8 VT323,monospace;margin:8px 0;color:#f4edda;letter-spacing:.08em;text-shadow:3px 3px #080909}
.station-id p{margin:0;color:var(--lens);font-size:12px;letter-spacing:.15em}
.lamp-bank{display:flex;gap:16px;border:1px solid #101111;background:#222526;padding:10px 12px;box-shadow:inset 0 2px 8px #000}
.lamp-bank>div{display:grid;justify-items:center;gap:6px;color:#aaa;font-size:9px}
.panel-lamp{width:16px;height:16px;border-radius:50%;display:block;background:#241c1c;border:2px solid #0c0c0c;box-shadow:inset 0 2px 3px #000}
.panel-lamp.is-lit.red{background:var(--red);box-shadow:0 0 13px var(--red),inset 0 -3px #8b1711}
.panel-lamp.is-lit.amber{background:var(--amber);box-shadow:0 0 13px var(--amber),inset 0 -3px #8d5d10}
.panel-lamp.is-lit.green{background:#75e98a;box-shadow:0 0 13px #75e98a,inset 0 -3px #23722f}
.clock{background:#090b0b;border:2px inset #555;padding:8px 10px;text-align:center;color:var(--red);text-shadow:0 0 9px var(--red)}
.clock span{font:28px VT323,monospace;letter-spacing:.08em}.clock small{display:block;color:#8b7f72;text-shadow:none;font-size:9px}

.patch-bay{display:flex;gap:2px;padding:5px 8px;background:#111;border:2px solid #030303;border-top:0;overflow:auto}
.patch-bay a{white-space:nowrap;color:#c8c3b3;text-decoration:none;border:1px solid #4a4d4c;background:#242626;padding:7px 12px;font-size:11px;letter-spacing:.08em}
.patch-bay a:hover,.patch-bay a:focus{color:#080909;background:var(--lens)}
.patch-bay b{color:var(--amber);margin-right:7px}

.upper-deck,.lower-deck{display:grid;grid-template-columns:1.65fr .85fr;gap:12px;margin-top:12px}
.lower-deck{grid-template-columns:1.05fr .95fr}
.wire-service,.assignment-board,.weather-console,.teletype{padding:18px;min-width:0}
.machine-label{display:flex;justify-content:space-between;align-items:center;color:#aaa;font-size:10px;letter-spacing:.14em;margin:0 10px 10px}
.machine-label b{color:#111;background:#bab39f;border:1px solid #777;padding:3px 8px;box-shadow:inset 0 0 0 1px #ddd}

.paper-feed{display:grid;grid-template-columns:23px 1fr 23px;background:#171717;border:2px inset #696969;max-height:420px;overflow:auto}
.tractor{background-color:#c7bea1;background-image:radial-gradient(circle,#28251d 0 3px,transparent 3.5px);background-size:100% 22px;background-position:center 4px;min-height:330px}
.wire-paper{background:var(--paper);color:var(--paper-ink);padding:24px 26px;min-height:330px;background-image:repeating-linear-gradient(0deg,transparent 0,transparent 27px,rgba(39,35,28,.07) 28px)}
.wire-paper header{display:flex;justify-content:space-between;gap:10px;font-size:10px;border-bottom:1px dashed #6d6554;padding-bottom:8px}
.wire-paper h2{font:30px VT323,monospace;letter-spacing:.12em;margin:15px 0 8px}
.bulletin-feed article{border-top:1px dashed #706856;padding:13px 0}.bulletin-feed article:first-child{border-top:0}
.bulletin-feed h3{font:23px VT323,monospace;margin:4px 0;letter-spacing:.04em}.bulletin-feed p{line-height:1.45;margin:4px 0;font-size:13px}
.wire-meta{font-size:10px;color:#625947;text-transform:uppercase}

.assignment-board{background:
  linear-gradient(rgba(18,48,39,.96),rgba(8,27,22,.98)),
  repeating-linear-gradient(45deg,transparent 0 4px,rgba(255,255,255,.02) 5px 6px)}
.board-title{display:flex;justify-content:space-between;border:1px solid #92876c;background:#ded4b9;color:#28241c;padding:6px 8px;font-size:10px;transform:rotate(-.5deg);margin:0 5px 18px}.board-title b{color:#8a241d}
.assignment-row{display:grid;grid-template-columns:1.3fr .8fr .6fr;gap:8px;border-bottom:1px solid rgba(219,235,218,.2);padding:8px;color:#8fada1;font-size:10px}
.assignment-row.chalk{font-family:VT323,monospace;font-size:21px;color:#d9e3d9;transform:rotate(-.25deg)}
.assignment-row em{font-style:normal;color:#ffd68d}.assignment-row b{color:var(--lens)}
.assignment-board blockquote{font:24px/1.1 VT323,monospace;color:#e3e6dc;margin:26px 14px 14px;transform:rotate(-1deg)}
.faction-stamp{display:inline-block;border:3px double var(--lens);color:var(--lens);padding:6px 9px;font-weight:bold;transform:rotate(-2deg);margin:10px;opacity:.8}

.console-title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #777;padding:0 10px 10px}.console-title span{font-size:9px;color:#a9aaa4}.console-title h2{font:31px VT323,monospace;margin:2px 0 0;letter-spacing:.1em}
.meter-strip{display:flex;gap:5px}.meter-strip i{width:5px;height:20px;background:#413d24;border:1px solid #111}.meter-strip i:nth-child(-n+4){background:var(--lens);box-shadow:0 0 6px var(--lens)}
.weather-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin-top:13px}
.radar-crt{min-height:255px;position:relative;overflow:hidden;border:13px solid #141515;border-radius:44% / 18%;background:
  repeating-radial-gradient(circle at center,transparent 0 35px,rgba(101,255,224,.15) 36px 37px),
  linear-gradient(90deg,transparent 49.8%,rgba(101,255,224,.16) 50%,transparent 50.2%),
  linear-gradient(0deg,transparent 49.8%,rgba(101,255,224,.16) 50%,transparent 50.2%),
  radial-gradient(circle,#0b352b,#03110e 72%);box-shadow:inset 0 0 35px #000,0 0 0 2px #555}
.radar-crt::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.22) 4px);pointer-events:none}
.radar-sweep{position:absolute;width:50%;height:50%;left:50%;top:0;transform-origin:0 100%;background:linear-gradient(45deg,rgba(105,255,215,.28),transparent 65%);animation:sweep 5s linear infinite}
@keyframes sweep{to{transform:rotate(360deg)}}
.radar-blip{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--lens);box-shadow:0 0 12px 4px var(--lens);animation:blink 2.3s steps(2) infinite}.b1{left:30%;top:34%}.b2{left:62%;top:57%;animation-delay:.7s}.b3{left:48%;top:74%;animation-delay:1.3s}@keyframes blink{50%{opacity:.15}}
.scope-readout{position:absolute;left:18px;bottom:12px;color:var(--phosphor);font:18px VT323,monospace;z-index:1;text-shadow:0 0 6px var(--phosphor)}
.pressure-bank{display:grid;gap:8px}.pressure-meter{border:2px inset #5d5e5b;background:#171919;padding:9px;text-align:center}.pressure-meter span{display:block;font-size:10px;color:#bbb}.pressure-meter b{font:42px VT323,monospace;display:block;color:var(--lens);text-shadow:0 0 8px var(--lens)}.pressure-meter small{font-size:8px;color:#777}
.console-copy{margin:12px 8px 0;color:#b6b6aa;font-size:12px}

.teletype-controls{display:flex;justify-content:space-between;gap:18px;align-items:start;background:#202222;border:2px inset #5b5d5c;padding:12px}.teletype h2{font:34px VT323,monospace;margin:3px 0}.teletype-controls p{color:#aaa;font-size:11px;margin:4px 0}.status-window{background:#07100c;color:var(--phosphor);border:2px inset #5d635f;padding:7px 9px;white-space:nowrap;font:17px VT323,monospace;text-shadow:0 0 8px var(--phosphor)}
.credentials-slip,.tip-form,.sent-copy{background:#d7cfb8;color:#26231d;margin:12px 6px;padding:15px;box-shadow:0 4px 9px #000;position:relative}
.credentials-slip{font-weight:bold;border-left:8px solid #a33}.tip-form::before,.sent-copy::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:repeating-linear-gradient(90deg,#38342b 0 3px,transparent 3px 10px)}
.tip-form label{display:grid;gap:5px;font-size:10px;font-weight:bold;letter-spacing:.08em;margin:8px 0}.tip-form input,.tip-form select,.tip-form textarea{width:100%;border:0;border-bottom:1px solid #605a4d;background:rgba(255,255,255,.2);color:#1f1c17;padding:8px;border-radius:0}.tip-form textarea{min-height:105px;resize:vertical;background-image:repeating-linear-gradient(0deg,transparent 0 25px,rgba(48,43,34,.12) 26px)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.form-actions button{border:2px solid #28251f;background:#8b2823;color:#fff;padding:9px 16px;font-weight:bold;box-shadow:2px 2px #3d3830;cursor:pointer}.form-actions button:disabled{opacity:.45;cursor:wait}.form-status{min-height:1.2em;color:#74221e;font-size:11px}.sent-copy h3{font:24px VT323,monospace;margin:2px 0 8px}.sent-slip{border-top:1px dashed #696152;padding:8px 0}.sent-slip header{display:flex;justify-content:space-between;gap:8px;font-size:9px}.sent-slip b{display:block;margin:5px 0}.sent-slip p{font-size:11px;margin:3px 0}.sent-slip .state{color:#7b211d;font-weight:bold}

.receipt{position:fixed;z-index:50;right:24px;bottom:20px;width:min(310px,calc(100% - 48px));background:#e4dcc5;color:#26231e;padding:24px 18px 30px;text-align:center;box-shadow:0 10px 40px #000;transform:rotate(-1deg);font-family:"Share Tech Mono",monospace}.receipt::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:14px;background:linear-gradient(135deg,#e4dcc5 7px,transparent 0) 0 0/14px 14px repeat-x}.receipt>b,.receipt>span{display:block}.receipt>b{font:36px VT323,monospace}.receipt p{font-size:12px}.receipt small{font-size:9px}.receipt-close{position:absolute;right:7px;top:5px;border:0;background:transparent;font-size:20px;cursor:pointer}
.desk-footer{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;background:#101111;border:2px solid #000;border-top:0;padding:9px 14px;color:#777;font-size:9px;letter-spacing:.12em}.desk-footer a{text-decoration:none}

html[data-fn-lens="vril"] .assignment-board{background:linear-gradient(rgba(18,34,54,.97),rgba(8,16,30,.99))}
html[data-fn-lens="double_agent"] .wire-paper{background-color:#d3c8b4;background-image:repeating-linear-gradient(0deg,transparent 0 27px,rgba(112,25,83,.1) 28px)}
html[data-fn-lens="double_agent"] .station-id h1{text-shadow:3px 3px #080909,-2px 0 rgba(255,100,199,.35)}

@media (prefers-reduced-motion:reduce){.radar-sweep,.radar-blip{animation:none}}
@media (max-width:980px){.station-header{grid-template-columns:150px 1fr auto}.clock{grid-column:1/-1}.upper-deck,.lower-deck{grid-template-columns:1fr}.paper-feed{max-height:none}}
@media (max-width:640px){body{padding:7px}.station-header{grid-template-columns:1fr}.station-mark{width:155px}.lamp-bank{justify-content:center}.upper-deck,.lower-deck{gap:7px;margin-top:7px}.wire-service,.assignment-board,.weather-console,.teletype{padding:12px}.wire-paper{padding:18px 13px}.weather-grid,.form-row{grid-template-columns:1fr}.teletype-controls{display:block}.status-window{margin-top:10px}.desk-footer{display:grid}}
