
@font-face{font-family:MapPixel;src:url(assets/m5x7.ttf) format('truetype');font-weight:400;font-style:normal;font-display:block}
:root{--paper:#e3dfc5;--ink:#1b111a;--edge:#57516c;--edge-light:#807785;--red:#c22c51;--red-dark:#67182d;--blue:#78acbf;--gold:#d5b451}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#0f0b10}body{display:grid;place-items:center;min-height:100svh;color:var(--paper);font-family:MapPixel,monospace;font-weight:400;overflow-x:hidden}button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px dashed var(--paper);outline-offset:4px}button{cursor:pointer}button:disabled{cursor:default}::selection{background:#ad2b4b;color:#f2edd5}
.screen{position:relative;width:min(100vw,177.77778svh);aspect-ratio:16/9;container-type:inline-size;isolation:isolate;overflow:hidden;border-radius:1.25cqw;background:var(--ink);box-shadow:0 0 0 2px #09070b,0 0 8cqw #000b}
.backdrop{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;image-rendering:pixelated}.scanlines,.vignette{position:absolute;inset:0;pointer-events:none;z-index:20;border-radius:inherit}.scanlines{background:repeating-linear-gradient(0deg,#0000 0px,#0000 2px,#0500082b 2px,#0500082b 3px);opacity:.55}.screen.no-crt .scanlines{display:none}.vignette{box-shadow:inset 0 0 2cqw .4cqw #0009,inset 0 0 10cqw #16091238}
.map-area{position:absolute;left:0;top:0;width:72.265625%;height:86.805556%;container-type:inline-size}
.map-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.map-canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}
.map-navigation{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:hidden}
.map-navigation .state-hit{fill:transparent;stroke:transparent;stroke-width:2;vector-effect:non-scaling-stroke;cursor:pointer;outline:none}
.map-navigation .state-hit:hover,.map-navigation .state-hit:focus-visible{fill:#bd2f5015;stroke:var(--red)}
.map-navigation .county-hit{fill:transparent;stroke:#8b8064;stroke-width:.65;vector-effect:non-scaling-stroke;cursor:pointer;outline:none}
.map-navigation .county-hit:hover,.map-navigation .county-hit:focus-visible{fill:#bd2f501c;stroke:var(--red);stroke-width:1.6}
.map-navigation .county-hit[aria-pressed=true]{fill:#bd2f5045;stroke:var(--red);stroke-width:2}
.map-navigation .active-state{fill:none;stroke:#9c2c48;stroke-width:1.6;vector-effect:non-scaling-stroke;pointer-events:none}
.map-area[data-level=state]{overflow:hidden}
.map-area[data-level=state] .map-canvas{visibility:hidden}
.map-area[data-level=state] .printed-terrain{opacity:.23}
.region[hidden],.map-back[hidden],.map-tip[hidden]{display:none}
.map-back{position:absolute;z-index:5;left:40%;top:4%;max-width:56%;min-height:28px;border:.27cqw solid var(--edge);background:#21121e;color:var(--paper);padding:.15cqw 1cqw;font-size:3.24cqw;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 .4cqw #100c14}
.map-back:hover{border-color:var(--red)}
.map-tip{position:absolute;z-index:4;transform:translate(-50%,-100%);max-width:55%;padding:.15cqw 1.2cqw .25cqw;border:.4cqw solid var(--edge);background:#21121e;color:var(--paper);font-size:3.6cqw;line-height:1;white-space:nowrap;pointer-events:none;box-shadow:0 .4cqw #100c14}
.map-tip[data-selected=true]{border-color:var(--red)}
.region{--tone:var(--edge);position:absolute;z-index:3;width:18.38%;height:auto;padding:0;border:0;background:none;transform:translate(-50%,-100%);display:flex;align-items:center;flex-direction:column;justify-content:flex-end;isolation:isolate}
.region>*{flex-shrink:0}
.region[data-region=ruins],.region[data-region=graveyard]{--tone:var(--red)}
.region .landmark{display:block;max-width:none;image-rendering:pixelated;pointer-events:none;filter:drop-shadow(0 .27cqw #241320)}
.region .banner{position:relative;display:grid;place-items:center;width:92%;height:3.24cqw;min-height:0;font-size:3.78cqw;line-height:1;color:var(--paper);background:#21121e;border:.4cqw solid var(--tone);box-shadow:inset 0 0 0 .14cqw #15121b,0 .4cqw #100c14;white-space:nowrap;text-shadow:.14cqw .14cqw #0e0b11;margin-top:.3cqw}
.region .banner:before,.region .banner:after{content:"";position:absolute;top:.27cqw;width:.8cqw;height:2.43cqw;border:solid var(--tone);border-width:0 .27cqw .4cqw;box-shadow:0 .4cqw #130d15}
.region .banner:before{right:calc(100% + .8cqw)}.region .banner:after{left:calc(100% + .8cqw)}
.region .sigils{height:2.84cqw;margin-top:.81cqw;display:flex;gap:1.35cqw;align-items:center;justify-content:center}
.sigils img{height:2.43cqw;width:auto;image-rendering:pixelated;opacity:.85}
.region:before{content:"";position:absolute;bottom:1.3cqw;left:6%;width:88%;height:5.7cqw;background:var(--tone);opacity:0;filter:blur(1.2cqw);z-index:-1}
.region:hover:before,.region[aria-pressed=true]:before{opacity:.12}.region:hover .banner{color:#fff8df;border-color:#c9bba3}
.region[aria-pressed=true] .banner{box-shadow:inset 0 0 0 .14cqw #331527,0 .4cqw #100c14,0 -.27cqw var(--tone)}
.region .hand{position:absolute;bottom:-.2cqw;right:5%;width:3.78cqw;height:auto;image-rendering:pixelated;opacity:0;pointer-events:none}
.region[aria-pressed=true] .hand{opacity:1}.region:focus-visible{outline-offset:2px;outline-width:2px;outline-style:dashed}
.inspector{position:absolute;left:72.95%;right:.58%;top:3.3%;z-index:5;--pixel:.1953125cqw}
.pixel-box{border:var(--pixel) solid #777085;box-shadow:inset var(--pixel) var(--pixel) #302437,inset calc(var(--pixel)*-1) calc(var(--pixel)*-1) #302437,var(--pixel) var(--pixel) #0c0910;outline:var(--pixel) solid #3a2d42;outline-offset:var(--pixel);background:#1c111b}
.description{padding:.38cqw .66cqw .56cqw;height:14.6cqw;overflow:hidden}
.description h1{font-size:3.5cqw;line-height:.7;margin:.05cqw 0 .45cqw;letter-spacing:0;font-weight:400;white-space:nowrap;text-shadow:.15cqw .15cqw #09060c}
.description p{font-size:2.74cqw;line-height:.74;margin:0;letter-spacing:.015cqw;text-shadow:.13cqw .13cqw #100b14;white-space:normal}
.stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.8cqw;margin-top:1.2cqw}
.stat{height:2.9cqw;display:flex;align-items:center;justify-content:space-between;padding:0 .48cqw;font-size:3.15cqw;line-height:1;color:#737088}
.stat img{width:1.76cqw;height:2.34cqw;object-fit:contain;image-rendering:pixelated}
.stat:nth-child(2){color:var(--blue)}.stat:nth-child(3){color:var(--gold)}
.actions{margin-top:1.35cqw;display:flex;flex-direction:column;gap:1.32cqw}
.action{width:100%;text-align:left;color:var(--red);height:2.98cqw;padding:0 .7cqw;display:flex;align-items:center;gap:.9cqw;font-size:3.32cqw;line-height:.8;position:relative;text-shadow:.1cqw .1cqw #170b16}
.action img{width:1.95cqw;height:1.95cqw;object-fit:contain;image-rendering:pixelated}
.action:after{content:"";width:.2cqw;height:.6cqw;background:#a497a4;position:absolute;right:-.35cqw;bottom:-.45cqw;box-shadow:-.6cqw 0 #665267}
.action:hover,.action[aria-pressed=true]{color:#f05b7b;background:#291522;outline-color:#94304e;border-color:#bc5472}.action:active{transform:translateY(.14cqw)}
.window-tools{position:absolute;z-index:6;right:1.1%;top:.6%;display:flex;gap:.86cqw}.tool{border:0;padding:0;display:grid;place-items:center;width:2.55cqw;height:1.23cqw;background:none;opacity:.72}.tool:hover{opacity:1}.tool svg{width:100%;height:100%;fill:var(--paper);shape-rendering:crispEdges}.prototype-note{position:absolute;bottom:2.2%;left:1.6%;font-size:1.38cqw;line-height:.8;color:#a58e9e;letter-spacing:.07cqw;z-index:5;max-width:11cqw;text-align:left;border:0;padding:0;background:none}.prototype-note:hover{color:var(--paper)}.dice{position:absolute;z-index:6;left:62.8%;top:88.2%;width:6.6%;height:11%;border:0;background:none}.dice:hover{background:#e3dfc514;box-shadow:inset 0 0 0 .15cqw #cfbd9866}.dice:active{transform:translateY(.2cqw)}.screen .dice:focus-visible{outline-offset:-2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.mobile-hud{display:none}dialog{font:32px/.8 MapPixel,monospace;background:#21131e;color:var(--paper);border:3px solid #746177;box-shadow:0 0 0 3px #170b15,0 0 0 5px #594453;max-width:min(480px,calc(100vw - 40px));padding:24px;z-index:30}dialog::backdrop{background:#0e0812c9}dialog h2{font-weight:400;font-size:40px;margin:0 0 20px}dialog p{margin:16px 0}dialog button{border:2px solid #a33151;background:#2c1522;padding:8px 16px;margin-top:12px;color:#e6d7c1;font-size:32px;line-height:1}dialog .credit{font-size:24px;color:#b2a4b6}
@media(min-aspect-ratio:16/9){.screen{border-radius:1.5svh}}
@media(max-width:650px) and (orientation:portrait){
 body{display:block;background:#1b111a}
 .screen{width:100%;min-height:100svh;aspect-ratio:auto;border-radius:0;padding-bottom:18px;box-shadow:none;overflow:hidden}
 .backdrop{height:56.25cqw;object-fit:fill;opacity:.8;mask-image:linear-gradient(#000 65%,transparent 88%)}
 .map-area{position:relative;width:100%;height:67.567568cqw;margin-top:32px}
 .map-back{left:3%;top:0;max-width:58%;min-height:44px;font-size:26px;padding:2px 8px;border-width:2px}
 .map-tip{font-size:20px;border-width:2px;padding:2px 6px;max-width:72%}
 .inspector{position:relative;inset:auto;margin:7px 18px 0;--pixel:2px}
 .description{padding:12px 12px 14px;height:auto;min-height:146px}
 .description h1{font-size:36px;line-height:.85;margin:0 0 14px}
 .description p{font-size:30px;line-height:.85}
 .stats{gap:10px;margin-top:15px}.stat{height:40px;font-size:34px;padding:0 10px}.stat img{width:18px;height:25px}
 .actions{margin-top:16px;gap:13px}.action{height:44px;font-size:34px;padding:0 12px;gap:12px}
 .action img{width:20px;height:20px}.action:after{display:none}
 .window-tools{top:2px;right:8px;gap:4px}.tool{width:44px;height:44px}.tool svg{width:24px;height:14px}
 .prototype-note{position:relative;display:block;bottom:auto;left:auto;max-width:none;font-size:20px;line-height:1;letter-spacing:0;margin:10px auto 0;min-height:44px}
 .prototype-note br{display:none}.dice{display:none}
 .mobile-hud{display:flex;justify-content:center;gap:16px;margin:20px 18px 0}
 .mobile-hud button{min-height:44px;padding:5px 18px;font-size:28px;line-height:1;background:#241622;border:2px solid #70617c;color:var(--paper)}
 .region{min-height:44px}.vignette{box-shadow:inset 0 0 30px #0006}.scanlines{opacity:.32}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
