@font-face{font-family:Teko;src:url('assets/Teko-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--ink:#e4e8de;--edge:#b9c79a;--normal:#192620e8;--hover:#394735ee}
*{box-sizing:border-box}body{margin:0;background:#000;color:var(--ink);font-family:system-ui,sans-serif}button{cursor:pointer}button:focus-visible{outline:3px solid #e5d7a5;outline-offset:5px}
.opening{height:100svh;min-height:420px;position:relative;overflow:hidden;isolation:isolate}
.backdrop{position:absolute;inset:0;z-index:-1;background:url('assets/backdrop.png') center/cover no-repeat;filter:blur(.65px) brightness(.76);transform:scale(1.003);animation:reveal 1.5s ease-out}
.title-logo{position:absolute;left:43.875%;top:12%;width:52%;height:66%;object-fit:contain;filter:brightness(.94);user-select:none;animation:reveal 1.8s ease-out}
.main-actions{position:absolute;left:50.115%;right:10.365%;top:85.6%;display:flex;gap:clamp(10px,.9375vw,24px)}
.game-button{color:var(--ink);font:700 clamp(20px,1.40625vw,36px)/1 Teko,sans-serif;text-shadow:0 3px 0 #0009;background:var(--normal);border:1px solid var(--edge);border-radius:3px 20px 3px 3px;min-height:clamp(44px,5.926vh,64px);padding:7px 12px;transition:background .15s,box-shadow .15s}
.game-button:hover,.game-button:focus-visible{background:var(--hover);box-shadow:inset 0 0 0 1px var(--edge)}.main-actions .game-button{flex:1;min-width:0;white-space:nowrap}
.secondary-actions{position:absolute;left:4%;bottom:.56%;display:flex;flex-direction:column;align-items:flex-start;gap:6px}.contact{min-width:clamp(125px,9vw,220px)}.version{font-size:clamp(17px,.85vw,22px);min-height:32px}
.atmosphere-controls{position:absolute;right:2%;top:2%;display:flex;gap:8px}.small-control{font:700 18px Teko,sans-serif;color:#d7decf;background:#101713b8;border:1px solid #b9c79a66;border-radius:3px;padding:5px 12px}.small-control:hover{background:var(--hover)}.preview-label{position:absolute;right:2%;bottom:1.4%;font:12px system-ui,sans-serif;letter-spacing:.14em;opacity:.45}
dialog{width:min(760px,92vw);max-height:84svh;background:#192620f7;border:2px solid var(--edge);border-radius:3px 20px 3px 3px;color:var(--ink);padding:clamp(20px,4vw,40px);box-shadow:0 24px 100px #000b}dialog::backdrop{background:#010503ce;backdrop-filter:blur(4px)}.panel-heading{display:flex;align-items:flex-start;gap:20px;justify-content:space-between}h1,h2{font-family:Teko,sans-serif;font-weight:700;margin:0}h1{font-size:42px;line-height:1.1}h2{font-size:30px;margin-top:25px}.close{border:0;background:transparent;color:var(--ink);font:32px/1 system-ui;padding:0 4px}p,li{font-size:16px;line-height:1.7;color:#d5dbd0}.lead{font-size:20px;color:#ececdb}.eyebrow{font-size:12px;letter-spacing:.14em;color:var(--edge)}li{margin:8px 0}
@keyframes reveal{from{opacity:0}to{opacity:1}}
@media(max-width:700px){.title-logo{left:5%;top:12%;width:90%;height:51%}.main-actions{left:10%;right:10%;top:65%;flex-direction:column;gap:12px}.main-actions .game-button{min-height:50px;font-size:28px}.secondary-actions{left:5%;bottom:3%}.contact{font-size:23px;min-height:40px}.version{font-size:18px}.preview-label{display:none}.atmosphere-controls{right:5%;top:3%}}
@media(max-height:500px) and (min-width:701px){.main-actions{top:80%}.secondary-actions{bottom:2%}.game-button{min-height:38px;font-size:22px}.version{min-height:27px;font-size:16px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* Developer's desk: compact paper note, expanded independently of menu layout. */
.sticky-note{position:absolute;left:8%;top:19%;width:190px;max-width:calc(100vw - 48px);z-index:3;transform:rotate(-5deg);transform-origin:top left;background:linear-gradient(155deg,#fff09a,#efce54);color:#342b18;box-shadow:3px 9px 18px #0008,inset 0 1px 0 #fff8;transition:width .2s ease,transform .2s ease;isolation:isolate}
.sticky-note::before{content:"";position:absolute;pointer-events:none;width:76px;height:25px;left:calc(50% - 38px);top:-12px;background:#e5d9b1a6;box-shadow:0 1px 2px #44381922;transform:rotate(3deg)}
.sticky-note::after{content:"";position:absolute;right:0;bottom:0;width:19px;height:19px;background:linear-gradient(135deg,#d2ac35 49%,#f9e17b 51%);box-shadow:-2px -2px 4px #76571518;pointer-events:none}
.note-toggle{display:block;width:100%;border:0;background:transparent;color:inherit;text-align:left;padding:22px 18px 20px}.note-title{display:block;font:700 28px/1.1 Teko,sans-serif}.note-hint{display:block;margin-top:9px;font:11px/1.4 system-ui,sans-serif;color:#66532a}.note-toggle:focus-visible{outline-color:#fff2b0;outline-offset:6px}
.sticky-note.is-open{width:350px;transform:rotate(-1deg);z-index:5}.sticky-note.is-open .note-toggle{padding-bottom:4px}.note-body{padding:0 23px 22px}.note-body p{font:16px/1.55 system-ui,sans-serif;color:#342b18;margin:12px 0 0}.note-body p:last-child{font-weight:600}.note-body[hidden]{display:none}
@media(max-width:700px){.sticky-note{left:6%;top:15%;width:155px}.note-toggle{padding:17px 14px}.note-title{font-size:25px}.note-hint{font-size:10px}.sticky-note.is-open{width:min(350px,86vw)}.note-body p{font-size:15px}}
@media(max-height:500px) and (min-width:701px){.sticky-note{top:12%;left:5%}.note-body p{font-size:14px}.note-body{padding-bottom:16px}}
/* The three notes make a loose triangle across the reserved left side. */
.note-prototype{left:25%;top:34%;transform:rotate(4deg);background:linear-gradient(145deg,#fff2a4,#efd46b)}
.note-graphics{left:7%;top:56%;transform:rotate(-3deg);background:linear-gradient(155deg,#ffe886,#eec54c)}
.sticky-note.is-open{max-height:76svh;display:flex;flex-direction:column}
.sticky-note.is-open .note-toggle{flex:none}
.sticky-note.is-open .note-body{overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#a68b38 transparent;overscroll-behavior:contain}
.note-prototype.is-open{width:410px;max-height:59svh}
.note-graphics.is-open{width:385px;max-height:37svh}
@media(max-width:700px){
  .note-prototype{left:auto;right:6%;top:29%;width:155px;transform-origin:top right}
  .note-graphics{left:6%;top:44%;width:155px}
  .note-prototype.is-open{width:min(410px,88vw);max-height:64svh}
  .note-graphics.is-open{width:min(385px,88vw);max-height:49svh}
}
@media(max-height:500px) and (min-width:701px){
  .note-prototype{left:26%;top:17%}
  .note-graphics{left:5%;top:47%}
  .note-prototype.is-open{max-height:75svh}
  .note-graphics.is-open{max-height:46svh}
}
/* Line-of-sight note sits above the prototype, away from the main actions. */
.note-sight{left:28%;top:6%;transform:rotate(5deg);background:linear-gradient(150deg,#ffed91,#eac957)}
.note-sight.is-open{width:390px;max-height:85svh}
@media(max-width:700px){
  .note-sight{left:auto;right:6%;top:48%;width:155px;transform-origin:top right}
  .note-sight.is-open{width:min(390px,88vw);max-height:45svh}
}
@media(max-height:500px) and (min-width:701px){
  .note-sight{left:27%;top:50%;width:190px}
  .note-sight.is-open{max-height:43svh}
}
/* X/Y/Z layout experiment. Previous stylesheet saved under layout-backups/. */
@media(min-width:701px){
  .note-graphics{left:23%;top:56%}
  .note-sight{left:36%;top:6%}
  .note-sight.is-open{max-height:85svh}
  .note-prototype{left:auto;right:4%;top:20%;transform-origin:top right}
  .note-prototype.is-open{max-height:73svh}
}
/* Creator signature trial: the contact/update controls belong to its corner. */
.creator-corner{position:absolute;left:4%;bottom:2%;width:clamp(220px,17vw,280px);display:flex;flex-direction:column;align-items:flex-start;gap:13px}
.creator-corner .secondary-actions{position:static;display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:100%}
.creator-corner .contact{min-width:0;width:100%}
.creator-corner .version{white-space:normal}
.creator-signature{display:block;width:100%;height:auto;object-fit:contain;user-select:none;filter:drop-shadow(0 3px 5px #0008)}
@media(max-width:700px){
  .opening{min-height:1000px}
  .main-actions{top:62%}
  .creator-corner{left:5%;bottom:2%;width:180px;gap:9px}
}
@media(max-height:500px) and (min-width:701px){
  .creator-corner{width:180px;bottom:2%;gap:6px}
}
.email-link{color:var(--edge);text-underline-offset:4px;overflow-wrap:anywhere}.email-link:hover{color:#fff2b0}.copy-email{font-size:24px;min-height:44px;padding:9px 18px}.copy-status{font-size:14px;min-height:1.7em}
.download-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-size:27px;min-height:48px;padding:10px 20px}.download-link:focus-visible{outline:3px solid #e5d7a5;outline-offset:5px}
/* Click-open iron edge handles and modal drawers. */
.drawer-tab{position:fixed;top:50%;z-index:6;border:1px solid #889382;color:#e4e8de;background:linear-gradient(90deg,#111816,#344037 48%,#151d18);font:700 22px/1 Teko,sans-serif;letter-spacing:.025em;padding:20px 11px;writing-mode:vertical-rl;box-shadow:0 3px 14px #0008;text-shadow:0 2px 2px #000;transform:translateY(-50%)}
.drawer-tab::before,.drawer-tab::after{content:'•';color:#a8afa0;font:14px/1 system-ui;position:absolute;left:50%;transform:translateX(-50%)}.drawer-tab::before{top:5px}.drawer-tab::after{bottom:5px}.drawer-tab-left{left:0;border-radius:0 8px 8px 0}.drawer-tab-right{right:0;border-radius:8px 0 0 8px}.drawer-tab:hover{color:#fff1b0;background:linear-gradient(90deg,#202b23,#465440,#202b23)}
dialog.side-drawer{position:fixed;top:0;bottom:0;width:min(520px,94vw);height:100dvh;max-height:100dvh;max-width:94vw;padding:28px;background:linear-gradient(130deg,#121713,#070b09);border:1px solid #708166;border-radius:0;margin:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#59694e #101510}
dialog.drawer-left{left:0;right:auto;--slide-start:-100%}dialog.drawer-right{right:0;left:auto;--slide-start:100%}.side-drawer[open]{animation:drawer-arrive .24s ease-out}.side-drawer h1{font-size:35px}.drawer-intro{font-size:15px}.prototype-notice{border-left:2px solid #a38a4e;padding-left:12px;font-size:12px;color:#c5baa1;line-height:1.55}.side-drawer .panel-heading{position:relative;gap:16px}.drawer-close{flex:none}.post-composer{margin:25px 0 16px}.post-composer>summary{display:list-item;width:fit-content;min-height:42px;font-size:26px;padding:10px 20px;list-style:none;cursor:pointer}.post-composer>summary::-webkit-details-marker{display:none}.post-composer>summary::before{content:'+ ';color:var(--edge)}.post-composer[open]>summary::before{content:'− '}
#post-form{padding:15px 0;display:grid;gap:9px}#post-form label{font-size:14px;margin-top:9px;color:#e4e8de}#post-form label span{display:block;font-size:11px;color:#a8b0a2;margin-top:4px}#post-form input,#post-form textarea{width:100%;min-width:0;border:1px solid #56634e;border-radius:3px;background:#080d0a;color:#e4e8de;padding:10px;font:15px/1.5 system-ui,sans-serif}#post-form textarea{resize:vertical;max-height:45dvh}#post-form input:focus,#post-form textarea:focus{outline:2px solid #b9c79a;outline-offset:2px}.submit-post{justify-self:start;font-size:25px;min-height:42px;padding:8px 28px}#post-status{font-size:13px;color:var(--edge)}
.post-entry{border-top:1px solid #414d3a;padding:0 0 4px}.post-entry>summary{cursor:pointer;padding:16px 0;list-style:none}.post-entry>summary::-webkit-details-marker{display:none}.post-topic{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:700 24px/1.2 Teko,sans-serif;color:#e4e8de}.post-topic::before{content:'› ';color:var(--edge)}.post-entry[open] .post-topic{white-space:normal;overflow:visible;overflow-wrap:anywhere}.post-entry[open] .post-topic::before{content:'⌄ '}.post-meta{display:block;font-size:11px;color:#9da696;margin:7px 0 0;overflow-wrap:anywhere}.spoiler-toggle{border:1px dashed #526047;color:#bfc8b7;background:repeating-linear-gradient(-15deg,#080b09,#080b09 9px,#171e16 9px,#171e16 12px);width:100%;padding:15px;text-align:left;font:13px/1.5 system-ui;cursor:pointer}.post-message{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.7;margin:12px 0 20px}.post-message[hidden]{display:none}.gallery-empty{margin-top:45px;border:1px dashed #526047;padding:40px 22px;text-align:center}.gallery-empty>span{font-size:55px;color:#829274}.gallery-empty h2{font-size:30px}.gallery-empty p{font-size:14px}
@keyframes drawer-arrive{from{transform:translateX(var(--slide-start));opacity:.5}to{transform:translateX(0);opacity:1}}
@media(max-width:700px){.drawer-tab{font-size:18px;padding:19px 7px}.side-drawer .panel-heading h1{font-size:30px}dialog.side-drawer{padding:23px 20px}}
.post-author{display:block;font:600 13px/1.4 system-ui,sans-serif;color:#d3ba77;margin-bottom:7px;overflow-wrap:anywhere}
.screenshot-gallery{display:grid;gap:19px;margin-top:25px}.gallery-thumb{padding:0;text-align:left;background:#121b14;border:1px solid #526047;color:var(--ink);border-radius:3px;overflow:hidden;cursor:zoom-in}.gallery-thumb:hover{border-color:var(--edge)}.gallery-thumb img{display:block;width:100%;height:auto}.gallery-thumb>span{display:flex;justify-content:space-between;padding:9px 13px;font:700 22px Teko,sans-serif}
#screenshot-viewer{width:96vw;max-width:1800px;max-height:96dvh;padding:16px 20px;background:#080c0a;border:1px solid #708166;border-radius:3px;overflow:auto}#screenshot-viewer::backdrop{background:#000e;backdrop-filter:blur(5px)}.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.viewer-header h1{font-size:28px}.viewer-header>div{display:flex;align-items:center;gap:22px}.viewer-header a{color:var(--edge);font-size:13px;text-underline-offset:4px}#full-shot{display:block;width:100%;height:auto;max-height:calc(96dvh - 140px);object-fit:contain}.viewer-navigation{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}#shot-counter{font-size:13px;color:#c2c9bb}
@media(max-width:700px){#screenshot-viewer{padding:12px}.viewer-header a{font-size:11px}.viewer-header>div{gap:10px}.viewer-header h1{font-size:24px}}
.spam-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.submit-post:disabled{opacity:.5;cursor:wait}#load-posts{margin:15px 0}#load-posts[hidden]{display:none}