/* © 2026 Ori Roniger. Hollowport: original artwork, writing and code. All rights reserved. https://hollowport.mystery.co.il/ */
@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
:root{--bg:#0b101b;--panel:#14202b;--line:#3a4e59;--text:#e1e5d6;--muted:#9badb3;--acid:#a7d6c0;--amber:#e5b976;--pixel:'VT323','Courier New',monospace}body{background:radial-gradient(ellipse at 50% 0,#192c3d55,transparent 65%),var(--bg)}header{height:80px;border-bottom:2px solid #526a72}.brand-icon{color:#b4d8cb}.brand{font-family:var(--pixel);font-size:29px;letter-spacing:2px}.brand small{letter-spacing:2px}.statusbar{height:37px}.intro{padding:20px 0 25px;display:flex;align-items:center;gap:12px 35px;flex-wrap:wrap}.intro>.eyebrow{width:100%;color:#aac7ce}h1{font-size:40px;line-height:1.05;margin:5px 0;letter-spacing:.2px}h1 br{display:none}h1 em{color:#a4d7ce}.intro p{position:static;font-size:10px;margin:0 0 0 auto;line-height:1.8}.tabs{gap:25px;border-bottom-color:#536b73}.tabs button{font-family:var(--pixel);font-size:17px;letter-spacing:.6px;padding:13px 0}.tabs button small{font:8px var(--mono);color:#81979a}.tabs button span{margin-left:5px}.tabs b{font:8px var(--mono);background:#2a4545}.tabs button.active{border-bottom-color:#b6dbcf}.primary{border:2px solid #5a747c;box-shadow:2px 2px 0 #030a0f,inset 1px 1px #9cafb255;background:#101a23}.profile{border-color:#526c73;background:#17232d;box-shadow:inset 1px 1px #95aaa21c}.objective{border-color:#697864;background:#1d302b}.objective h3{color:#d8e4d8}.inventory{background:#1b2630;border-color:#536773}.terminal{background:#121f29;border-color:#4b626c}.balance{border-color:#425860}.location-panel{border-color:#506971}.location-heading .eyebrow{color:#a5cbd0}.conversation{background:#162835;border:2px solid #65818a;box-shadow:inset 2px 2px #a8b8b725,2px 2px #050a10;padding:23px}.npc-heading{gap:19px;align-items:center}.npc-portrait{position:relative;width:98px;height:98px;flex:0 0 98px;display:block;padding:3px;border:2px solid #8da0a2;background:#0a131e;box-shadow:inset 2px 2px #050c14,2px 2px #080e14;overflow:hidden}.npc-portrait canvas,.npc-portrait img{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges}.npc-heading h3{font-family:var(--pixel);font-size:37px;margin:4px 0 5px;line-height:1}.npc-heading .eyebrow{color:#9fbac5}.npc-mood{color:#9fc5c4;font-size:7px;line-height:1.8}.conversation blockquote{font-family:var(--pixel);font-size:23px;line-height:1.3;font-weight:400;margin:24px 0;padding:16px 18px;border:1px solid #496c7c;background:#0f1e2b;color:#e4e5cf;box-shadow:inset 2px 2px #050d15}.conversation-choices{gap:8px}.conversation-choices button{font-family:var(--pixel);font-size:19px!important;line-height:1.15;padding:12px 13px;color:#d4e1d5!important;border:1px solid #64818b;background:#243c49;box-shadow:inset 1px 1px #91a6ad55,inset -1px -1px #071423;text-align:left;min-height:47px}.conversation-choices button:hover{background:#345a62;border-color:#b3d8ca}.conversation-choices button:active{box-shadow:inset 2px 2px #06121d}.city-contracts article{border-color:#4c626c;background:#192b33}.city-contracts h3{font-family:var(--pixel);font-size:29px}.city-contracts p{color:#abbec1}.contract-label{color:#97b0b8}.city-contracts button{border-color:#526d75;background:#243c43}.packet-work{border-color:#405d66}.city-scene{background:#292a24;border-color:#766f55}.city-feedback{border-color:#415c66;color:#b3ccc9}.city-journal{background:#2a302a}.adventure-scene{background:#0a1420}.scene-titlebar{height:35px;padding:0 16px;display:flex;align-items:center;gap:20px;background:linear-gradient(#526b79,#344d5b);border-bottom:2px solid #091320;box-shadow:inset 0 1px #95a8af;color:#eceddb;font:20px var(--pixel);letter-spacing:1px}.scene-titlebar small{font:7px var(--mono);letter-spacing:.7px;color:#c2d2d0;margin-left:auto}.scene-signal{color:#b4dab0;font-size:10px}.scene-display{position:relative;aspect-ratio:2/1;overflow:hidden;background:#0c1423;border:4px solid #263e4e;box-shadow:inset 0 0 0 1px #a8bcbe66}.scene-art{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges}.scene-display:after{content:'';pointer-events:none;position:absolute;inset:0;background:repeating-linear-gradient(0deg,#080c1a0c 0px,#080c1a0c 1px,transparent 1px,transparent 4px)}.scene-loading{position:absolute;inset:0;display:grid;place-items:center;color:#aec8cc;font:19px var(--pixel);text-align:center;background:#121f2b}.art-ready .scene-loading,.art-fallback .scene-loading{display:none}.scene-hotspot{position:absolute;transform:translate(-50%,-50%);width:13%;height:24%;padding:0;border:1px solid transparent;background:transparent;z-index:2;min-width:40px}.scene-hotspot>span{position:absolute;bottom:-13px;left:50%;transform:translateX(-50%);padding:3px 9px;background:#0c1824e8;border:1px solid #9dbbb5;font:17px var(--pixel);color:#e4e3cc;letter-spacing:1px;white-space:nowrap}.scene-hotspot i{position:absolute;top:-14px;left:50%;transform:translateX(-50%);font:23px var(--pixel);color:#ecdfb0;text-shadow:2px 2px #101525}.scene-hotspot:hover,.scene-hotspot:focus-visible{background:#d8e3c015;border:1px dashed #d4dcb9;box-shadow:none}.scene-narration{padding:16px 19px;display:flex;gap:17px;align-items:baseline;border-top:2px solid #697f88;border-bottom:1px solid #516a76;background:#142533;box-shadow:inset 0 1px #91a9ac33}.scene-narration>span{font:17px var(--pixel);color:#b7d6c5}.scene-narration p{font-family:var(--pixel);font-size:20px;line-height:1.25;color:#d7dfd1;margin:0}.scene-verbs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:10px;background:#263e4e;border-bottom:2px solid #6e8790}.scene-verbs button{font:19px var(--pixel);padding:12px 9px;letter-spacing:.5px;line-height:1.1;text-align:center;border:1px solid #728c94;background:#344e5b;box-shadow:inset 1px 1px #a2b6b56b,inset -1px -1px #0b1d29;color:#e5e7d7;min-height:44px}.scene-verbs button span{font:8px var(--mono);margin-right:7px;color:#a2bcc1}.scene-verbs button:hover{background:#426970;border-color:#b7d5cb}.has-location-art .intro{padding:11px 0 14px;gap:5px}.has-location-art .intro h1{font-size:27px;margin:3px 0}.has-location-art .intro p{display:none}.has-location-art .intro>.eyebrow{font-size:8px}.has-location-art .game-grid{align-items:start}.has-location-art .location-description{max-width:none}.has-location-art .location-panel>h2{font-family:var(--pixel);font-size:36px}.has-location-art .location-panel{background:#111d29}.map{background-color:#162531}.map-label{color:#a0b9ba}.pin-label{background:#101c29ed;color:#c4d1cd}.selected .pin-icon{background:#bad3bd;color:#122031}.map-pin:hover{background:transparent}.map .city-block{filter:hue-rotate(35deg)}
@media(max-width:1050px){.tabs{gap:21px}.tabs button{font-size:15px}.intro p{margin-left:0}.npc-portrait{width:82px;height:82px;flex-basis:82px}.conversation blockquote{font-size:22px}.scene-verbs button{font-size:17px}.scene-verbs button span{display:none}.scene-titlebar{font-size:18px}.scene-titlebar small{font-size:6px}}
@media(max-width:760px){header{height:74px}.brand{font-size:25px;gap:10px}.brand-icon{font-size:36px}.intro{padding:17px 0;gap:8px}.intro h1{font-size:35px;line-height:1.05}.intro p{font-size:9px;line-height:1.7}.intro>.eyebrow{font-size:7px}.tabs{gap:15px;justify-content:space-between}.tabs button{font-size:15px;padding:13px 0;letter-spacing:0}.tabs button span{margin-left:0}.tabs button small{display:none}.tabs b{margin-left:4px;font-size:7px}.npc-heading{gap:13px}.npc-portrait{width:78px;height:78px;flex-basis:78px}.npc-heading h3{font-size:33px}.npc-heading .eyebrow{font-size:6px;line-height:1.7}.npc-mood{font-size:6px;line-height:1.7}.conversation{padding:15px}.conversation blockquote{font-size:21px;line-height:1.3;padding:13px}.conversation-choices button{font-size:19px!important;min-height:46px;padding:12px}.scene-titlebar{height:31px;padding:0 10px;gap:8px;font-size:17px}.scene-titlebar small{font-size:5px;letter-spacing:0}.scene-display{border-width:3px}.scene-hotspot>span{font-size:13px;padding:1px 6px;bottom:-7px}.scene-hotspot i{font-size:18px;top:-10px}.scene-narration{padding:13px 12px;gap:12px}.scene-narration>span{font-size:15px}.scene-narration p{font-size:18px;line-height:1.25}.scene-verbs{gap:5px;padding:7px}.scene-verbs button{font-size:15px;padding:10px 4px;letter-spacing:0;line-height:1.1}.has-location-art .intro{padding:11px 0}.has-location-art .intro h1{font-size:24px}.has-location-art .intro>.eyebrow{font-size:7px}}
@media(prefers-reduced-motion:reduce){.scene-display *{animation:none!important;transition:none!important}}
.city-atlas{background:#111d29}.atlas-display{aspect-ratio:320/216}.atlas-north{position:absolute;right:12px;top:12px;z-index:1;padding:5px;background:#0c1824dc;color:#d7dfd1;font:18px var(--pixel)}.atlas-pin{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;display:flex;align-items:center;gap:5px;white-space:nowrap;text-align:left;min-height:44px}.atlas-pin>b{display:grid;place-items:center;width:30px;height:30px;border:2px solid #b0c9c6;background:#142b3deb;color:#e6e6ce;font:20px var(--pixel);box-shadow:2px 2px #07101c}.atlas-pin>span{background:#0d1b29ed;padding:5px 7px;color:#e2e5d4;font:18px var(--pixel);border:1px solid #6e8a91}.atlas-pin small{display:block;font:7px var(--mono);color:#b7dfc5;margin-top:4px}.atlas-pin.selected>b{background:#b9d3bd;color:#112433;box-shadow:0 0 0 4px #a7d6c029,2px 2px #07101c}.atlas-pin:hover,.atlas-pin:focus-visible{background:transparent}.atlas-pin:hover>b,.atlas-pin:focus-visible>b{background:#e5b976;color:#14202b}.atlas-status{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:2px solid #697f88;border-bottom:1px solid #526a73;color:#a5bcc2;font:8px var(--mono);line-height:1.8}.atlas-status b{display:block;color:#e1e5d6;font:22px var(--pixel)}.atlas-status button{font:17px var(--pixel);padding:10px;color:#d8e3ce}.atlas-destinations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px}.atlas-destinations button{display:flex;align-items:center;text-align:left;gap:10px;padding:12px 10px;background:#233a47;border-color:#59737b;min-height:65px}.atlas-destinations button>span{color:#afcac5;font:23px var(--pixel)}.atlas-destinations button>div{min-width:0}.atlas-destinations b{display:block;color:#e2e5d5;font:20px var(--pixel);font-weight:400}.atlas-destinations small{display:block;color:#a3bbc2;font:6px var(--mono);letter-spacing:.5px;margin-top:6px;line-height:1.6}.atlas-destinations i{font:18px var(--pixel);margin-left:auto;color:#a4cbbd}.atlas-destinations [aria-current=location]{border-color:#b4d8c3;background:#2a494a}.atlas-note{color:#a4b8bc;font:18px var(--pixel);line-height:1.3;margin:0;padding:4px 16px 16px}
@media(max-width:1050px){.atlas-pin>span{font-size:15px}.atlas-destinations{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.atlas-pin>span{display:none}.atlas-pin>b{width:29px;height:29px;font-size:19px}.atlas-pin{min-width:44px;justify-content:center}.atlas-north{font-size:15px;right:6px;top:6px;padding:3px}.atlas-status{padding:11px;gap:8px}.atlas-status button{font-size:15px;max-width:145px}.atlas-status b{font-size:20px}.atlas-destinations{gap:7px;padding:10px}.atlas-destinations button{padding:10px 7px;gap:7px}.atlas-destinations b{font-size:19px}.atlas-destinations small{font-size:6px;letter-spacing:0}.atlas-destinations button>span{font-size:19px}.atlas-note{font-size:17px;padding:4px 12px 14px}}
.atlas-pin{width:44px;justify-content:center}.atlas-pin>span{position:absolute;left:40px}.atlas-pin[data-value=market]>span,.atlas-pin[data-value=exchange]>span{left:auto;right:40px}

.statusbar{gap:12px;flex-wrap:wrap}.sound-toggle{font:18px var(--pixel);padding:6px 10px;min-height:38px;color:#b9d3cd;border-color:#536c77;background:#1c303c;white-space:nowrap}.sound-toggle[aria-pressed=true]{color:#efdfac;border-color:#af9e71}.sound-toggle:focus-visible{outline:2px solid #efdfac;outline-offset:3px}.sound-toggle:disabled{opacity:.65}
@media(max-width:760px){.statusbar{gap:8px;padding-block:9px}.sound-toggle{font-size:16px;padding:5px 8px;min-height:36px}.statusbar>span:last-child{margin-left:auto}}