@font-face{font-family:Witchjak;src:url("assets/fonts/DejaVuSerif-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
:root{--ice:#d8eff2;--cyan:#7ad2e7;--gold:#e9c76d;--ink:#02090d}
*{box-sizing:border-box}
html,body{width:100%;min-height:100%;margin:0;background:#031019;color:var(--ice);font-family:Witchjak,Georgia,serif}
body{overflow:hidden}
button,a{color:inherit;font:inherit}
button:focus-visible,a:focus-visible{outline:3px solid #a9ecff;outline-offset:3px}
.game-screen{position:relative;width:100vw;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:#061923}
.scene{position:absolute;z-index:-4;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;user-select:none}
.game-screen:after{content:"";position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,rgba(0,4,7,.96) 0%,rgba(0,6,10,.82) 26%,rgba(1,9,14,.24) 47%,rgba(1,7,10,.04) 72%);pointer-events:none}
.moon-light,.fire-light{position:absolute;z-index:-1;pointer-events:none;mix-blend-mode:screen}
.moon-light{left:53%;top:-12%;width:35vw;height:54vh;background:radial-gradient(circle,rgba(199,246,255,.25),rgba(83,184,217,.09) 38%,transparent 72%);filter:blur(10px);animation:moonPulse 8s ease-in-out infinite}
.fire-light{z-index:3;right:-2%;bottom:-22%;width:52vw;height:76vh;background:radial-gradient(ellipse,rgba(255,174,53,.26),rgba(213,79,21,.08) 40%,transparent 70%);filter:blur(16px);animation:firePulse 2.7s ease-in-out infinite}
.witchjak{position:absolute;z-index:2;right:27vw;bottom:0;width:min(48vw,720px);height:min(87vh,860px);object-fit:contain;object-position:center bottom;filter:brightness(.82) saturate(.86) sepia(.08) drop-shadow(0 0 13px rgba(255,164,55,.24)) drop-shadow(14px 17px 7px rgba(0,3,5,.62));user-select:none}
.menu{position:relative;z-index:5;width:clamp(320px,31vw,510px);height:100%;padding:4.5vh clamp(20px,2.4vw,44px) 3vh;display:flex;flex-direction:column;align-items:stretch}
.logo{width:100%;height:auto;filter:drop-shadow(0 0 14px rgba(109,212,236,.42)) drop-shadow(4px 6px 0 rgba(0,0,0,.82));margin-bottom:1.2vh}
.identity{display:flex;align-items:center;justify-content:space-between;margin:0 3% 1.4vh;color:#a9cdd3;font:700 clamp(.68rem,.82vw,.88rem)/1 "Courier New",monospace;letter-spacing:.16em;text-shadow:2px 2px #02080c}
.identity strong{color:var(--gold);font-size:1.13em}
.menu-links{display:grid;gap:clamp(3px,.55vh,8px)}
.menu-row{position:relative;width:100%;min-height:clamp(50px,7.4vh,72px);padding:0 10%;display:flex;align-items:center;justify-content:space-between;border:0;background:transparent url("assets/ui/menu-row.png") center/100% 100% no-repeat;color:#d7e9eb;text-decoration:none;cursor:pointer;font-size:clamp(.82rem,1.24vw,1.2rem);letter-spacing:.08em;text-shadow:2px 3px #02070a;transition:transform .14s,filter .14s,color .14s}
.menu-row:hover,.menu-row:focus-visible,.menu-row.selected{color:#ffe7a5;transform:translateX(10px);filter:brightness(1.22) drop-shadow(0 0 8px rgba(92,211,237,.3))}
.menu-row:active{transform:translateX(7px) scale(.985)}
.menu-row b{color:var(--cyan);font:700 1.4em/1 Georgia,serif}
.menu-row.disabled{opacity:.38;cursor:default;pointer-events:none;filter:grayscale(.4)}
.ca-row{min-height:clamp(58px,8.6vh,84px);margin-bottom:clamp(4px,.9vh,10px);flex-direction:column;align-items:flex-start;justify-content:center;gap:5px}
.ca-row code{display:block;max-width:100%;overflow:hidden;color:#9bd4df;font:700 clamp(.66rem,.82vw,.82rem)/1 "Courier New",monospace;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap}
.sound-row{margin-top:clamp(4px,.9vh,10px)}
.sound-row b{color:#96abb0;font:700 .78em/1 "Courier New",monospace;letter-spacing:.12em}
.sound-row.selected b{color:#ffd77d}
.menu>small{margin:7px 7% 0;overflow:hidden;color:#779ca4;font:700 clamp(.5rem,.62vw,.66rem)/1 "Courier New",monospace;letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap}
.fireflies{position:absolute;z-index:3;inset:0;pointer-events:none}
.fireflies i{position:absolute;left:var(--x);top:var(--y);width:4px;height:4px;border-radius:50%;background:#e4ff88;box-shadow:0 0 6px 2px #cffa6e,0 0 16px 4px rgba(134,239,104,.5);animation:fly 5.2s ease-in-out var(--d) infinite}
.toast{position:absolute;z-index:20;left:50%;bottom:20px;padding:10px 16px;background:rgba(7,28,38,.95);border:2px solid #5eacc0;color:var(--gold);font:700 .74rem/1 "Courier New",monospace;letter-spacing:.08em;transform:translate(-50%,20px);opacity:0;transition:.18s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes fly{0%,100%{opacity:.2;transform:translate(0,0) scale(.7)}38%{opacity:1;transform:translate(8px,-10px) scale(1.18)}71%{opacity:.45;transform:translate(-6px,4px) scale(.84)}}
@keyframes firePulse{0%,100%{opacity:.72;transform:scale(.98)}45%{opacity:1;transform:scale(1.035)}}
@keyframes moonPulse{0%,100%{opacity:.72}50%{opacity:1}}
@media(max-height:700px) and (min-width:761px){.menu{padding-top:2.5vh}.logo{width:82%;align-self:center}.menu-row{min-height:47px}.ca-row{min-height:56px}.witchjak{height:89vh}}
@media(max-width:760px){body{overflow-x:hidden;overflow-y:auto}.game-screen{min-height:720px}.scene{object-position:68% center}.game-screen:after{background:linear-gradient(180deg,rgba(0,5,8,.91) 0%,rgba(0,6,10,.72) 53%,rgba(1,7,10,.12) 78%)}.menu{width:100%;height:auto;padding:20px 18px 0}.logo{width:min(94vw,500px);align-self:center}.identity{margin-inline:5%}.menu-links{grid-template-columns:1fr 1fr}.menu-row{min-height:54px;font-size:.74rem}.ca-row{min-height:62px}.sound-row{width:50%;min-width:180px}.witchjak{left:0;right:auto;bottom:0;width:70vw;height:46vh}.moon-light{left:38%;width:62vw}.fire-light{right:-16%;width:95vw;height:58vh}.fireflies i{display:none}}
@media(max-width:420px){.game-screen{min-height:680px}.menu{padding-inline:12px}.menu-row{min-height:49px;padding-inline:9%;letter-spacing:.04em}.logo{margin-bottom:3px}.witchjak{height:44vh}.menu>small{font-size:.48rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}