/* Shared website frame. The approved monitor's internal styling is untouched. */
:root{--site-sky:#2b1b29;--site-ground:#21131f;--site-text:#eee5cc;--site-muted:#c2a9bc;--site-accent:#e1adca;--site-rule:#75536e66;--site-header-height:72px}
.site-header,.site-header *,.site-footer,.site-footer *{box-sizing:border-box}
.site-header{position:sticky;top:0;z-index:25;width:100%;min-height:var(--site-header-height);background:var(--site-ground);border-bottom:1px solid var(--site-rule);font-family:MapPixel,monospace}
.site-header-inner{width:min(1240px,calc(100% - 64px));margin:0 auto;min-height:calc(var(--site-header-height) - 1px);display:flex;align-items:center;justify-content:space-between;gap:32px}
.site-brand{position:relative;display:flex;align-items:baseline;gap:9px;padding:10px 12px 10px 0;font-size:32px;line-height:1;letter-spacing:1px;color:var(--site-text);text-decoration:none;white-space:nowrap}
.brand-tombstone{display:block;flex:none;align-self:center;width:20px;height:30px;object-fit:contain;image-rendering:pixelated}
.site-brand>span{color:var(--site-muted)}
.rip-brand>span{font-size:24px}
.site-nav{display:flex;align-items:center;gap:30px}.site-nav a{position:relative;display:flex;align-items:center;min-height:44px;color:var(--site-muted);text-decoration:none;font-size:28px;line-height:1;padding:7px 0;white-space:nowrap}
.site-nav a:after{content:"";position:absolute;bottom:2px;left:0;right:0;height:2px;background:var(--site-accent);transform:scaleX(0);transform-origin:left;transition:transform 150ms ease-out}
.site-nav a:hover,.site-nav a[aria-current]{color:var(--site-text)}.site-nav a:hover:after,.site-nav a[aria-current]:after{transform:scaleX(1)}
.site-skip{position:fixed;left:16px;top:8px;z-index:60;padding:8px 16px;transform:translateY(-160%);background:#e3d6a8;color:#302518;font:26px/1 MapPixel,monospace;text-decoration:none}.site-skip:focus{transform:none}
.site-header a:focus-visible,.site-home a:focus-visible,.site-home button:focus-visible,.site-home summary:focus-visible,.site-footer a:focus-visible{outline:2px dashed var(--site-accent);outline-offset:6px}
.site-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;width:min(1240px,calc(100% - 64px));margin:0 auto;padding:36px 0 40px;border-top:1px solid var(--site-rule);font:23px/1.2 MapPixel,monospace;color:var(--site-muted)}
.footer-brand{font-size:30px;line-height:1;color:var(--site-text);text-decoration:none;letter-spacing:1px}.site-footer p{margin:8px 0 0}.site-footer>p{max-width:410px;text-align:right}
/* 8bitcn ButtonDecorations: stepped corners, inset shading and pixel press.
   Adapted to semantic links and local CSS; see assets/component-licenses.txt. */
.pixel-button{position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:12px 24px;min-height:50px;border:0;background:#dfd0a1;color:#392b24;font:32px/1 MapPixel,monospace;text-decoration:none;box-shadow:inset 0 4px #efe3bd,inset 0 -4px #b49b6d;transition:transform 140ms ease-out}
.pixel-button-edges{position:absolute;inset:0;pointer-events:none}.pixel-button-edges:before{content:"";position:absolute;inset:-4px 4px;border-block:4px solid #9e7892}.pixel-button-edges:after{content:"";position:absolute;inset:4px -4px;border-inline:4px solid #9e7892}
.pixel-button:hover{background:#f0dfb0}.pixel-button:active,.hero-map-link:active .pixel-button{transform:translateY(4px)}
.monitor-page{display:flex;flex-direction:column;align-items:center;min-height:100svh;background:var(--site-ground)}
.monitor-page>.screen{flex:none;margin-block:auto;width:min(100vw,calc((100svh - var(--site-header-height)) * 1024 / 506))}
.monitor-page .screen:fullscreen{width:100%;height:100%;margin:0;border-radius:0}
.monitor-page .live-brand{display:none}
@media(min-width:651px) and (max-width:750px){.monitor-page .site-nav{gap:16px}}
@media(max-width:650px){
 :root{--site-header-height:108px}
 .site-header-inner{width:calc(100% - 32px);display:flex;flex-direction:column;justify-content:center;gap:0;padding:7px 0}
 .site-brand{font-size:28px;padding-block:3px;line-height:1}
 .rip-brand>span{font-size:20px}
 .site-nav{width:100%;display:grid;grid-template-columns:.8fr 1fr 1.6fr .7fr;gap:8px}
 .site-nav a{justify-content:center;font-size:24px;min-height:44px;white-space:normal;text-align:center}
 .site-nav a:after{left:12%;right:12%}
 .site-footer{width:calc(100% - 40px);align-items:flex-start;flex-direction:column;gap:18px;padding-block:28px}.site-footer>p{text-align:left;font-size:22px}
}
@media(max-width:650px) and (orientation:portrait){.monitor-page{display:block}.monitor-page>.screen{width:100%;margin:0}}
@media(prefers-reduced-motion:reduce){.site-nav a:after,.pixel-button{transition:none}}