:root{color-scheme:light;--ink:#151c27;--cream:#ffe8c0;--gold:#e4be7d;--muted:#5d6370;--border:#d7b779}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;isolation:isolate;background:#56a6e3;color:var(--ink);font-family:Georgia,"Times New Roman",serif;-webkit-font-smoothing:antialiased}
button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #152641;outline-offset:7px}
.landscape{position:fixed;inset:0;z-index:-1;background:url("assets/landscape.png") center center/cover no-repeat;pointer-events:none}
.filters{position:absolute;width:0;height:0;pointer-events:none}
.menu{position:absolute;top:29px;right:4.6%;z-index:2;display:flex;align-items:center;gap:42px}
.menu button{border:0;background:transparent;padding:8px 0;color:#101c2b;font-size:23px;line-height:1.3;text-shadow:0 1px 10px #b0d9f84d;transition:color .15s}
.menu button:hover{color:#fff2cf}.menu button:focus-visible{outline-offset:4px}
.title-screen{position:absolute;top:29.2svh;left:0;width:100%;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 20px}
.wordmark{position:relative;width:clamp(360px,31.5vw,620px);max-width:89vw;aspect-ratio:960/286;overflow:hidden;margin:0 0 37px;filter:drop-shadow(0 3px 3px #2a456866)}
.wordmark img{position:absolute;width:150.8333%;max-width:none;height:auto;left:-25.625%;top:-136.71%;filter:url(#ink);image-rendering:pixelated}
.pixel-button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:62px;padding:13px 32px;color:#171b24;font-size:23px;font-weight:400;line-height:1.2;border:3px solid #e3be85;background:#ffe7bf;box-shadow:inset 0 2px #fff7dc,inset 2px 0 #fff3d3,inset -2px 0 #f7d59f,inset 0 -3px #f1cf97;clip-path:polygon(8px 0,calc(100% - 8px) 0,calc(100% - 8px) 3px,calc(100% - 3px) 3px,calc(100% - 3px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 3px) calc(100% - 8px),calc(100% - 3px) calc(100% - 3px),calc(100% - 8px) calc(100% - 3px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 3px),3px calc(100% - 3px),3px calc(100% - 8px),0 calc(100% - 8px),0 8px,3px 8px,3px 3px,8px 3px);transition:transform .15s,background .15s}
.pixel-button:hover{background:#fff0d2;transform:translateY(-2px)}.pixel-button:active{transform:translateY(1px)}.pixel-button:focus-visible{clip-path:none;outline-offset:5px}
.play{width:310px;max-width:85vw}.play span{font-size:27px;line-height:1}
dialog{width:min(540px,calc(100vw - 36px));max-height:calc(100svh - 48px);overflow:auto;padding:48px 36px 36px;background:#fff0d3;color:var(--ink);border:3px solid #d9b579;box-shadow:5px 5px 0 #4b5f7466;font-size:17px;line-height:1.7;text-align:center}
dialog::backdrop{background:#17345266;backdrop-filter:blur(5px)}dialog h2{font-size:32px;line-height:1.2;font-weight:400;margin:14px 0 24px}dialog p{color:#444d56}dialog .close{position:absolute;right:12px;top:8px;color:#4c525b;background:none;border:0;font-size:28px;width:36px;height:36px}.eyebrow{font-family:"Courier New",monospace;font-size:10px;letter-spacing:1.5px;color:#7b6034}.note{font-size:14px;color:#656968!important;margin:23px 0}dialog .pixel-button{margin-top:12px;font-size:18px;gap:15px;min-height:50px;padding:12px 20px}.tiny-timeline{display:flex;align-items:center;gap:9px;margin:28px 0;color:#6d6b61;font-size:14px}.tiny-timeline i{flex:1;height:1px;background:#b7a57e}.tiny-timeline b{display:grid;place-items:center;border:1px dashed #a7854d;width:35px;height:35px;color:#7b6034}
.event{display:flex;flex-direction:column;align-items:center;border:1px solid #d1b482;background:#ffe6b7;padding:20px 12px;margin:24px auto;max-width:310px}.event>span{font-size:28px;color:#7d6337}.event strong{font-size:19px;margin:6px 0}.event small{color:#686453;line-height:1.6;font-size:14px}.choices{display:flex;gap:10px;align-items:stretch;justify-content:center}.choices button{background:#ffe6b7;border:1px dashed #ab8d5d;padding:10px;color:#323b42;font-size:15px}.choices button:hover{border-color:#765a2c;background:#f9d9a4}.choices button:disabled{opacity:.45;cursor:default}.choices button.selected{opacity:1;border:1px solid #806430}.anchor{padding:10px 9px;background:#ffebc6;border:1px solid var(--border);max-width:150px;font-size:14px;display:flex;flex-direction:column;justify-content:center;gap:5px}.anchor span{color:#806430}#result h3{font-weight:400;font-size:27px;margin:30px 0 10px;color:#6b572e}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:600px){.menu{top:20px;right:24px;gap:26px}.menu button{font-size:17px;padding:8px 0}.title-screen{top:30svh}.wordmark{width:400px;margin-bottom:30px}.pixel-button{font-size:19px;min-height:56px;gap:20px;padding:12px 23px}.play{width:280px}.play span{font-size:23px}dialog{padding:44px 22px 28px;font-size:16px}.choices{gap:6px}.choices button{padding:8px;font-size:13px}.anchor{font-size:13px}}
@media(max-height:500px) and (min-width:601px){.title-screen{top:23svh}.wordmark{width:310px;margin-bottom:22px}.pixel-button{font-size:18px;min-height:48px}.menu{top:15px}.menu button{font-size:18px}}
