:root{--ink:#0b1c21;--deep:#102a2e;--paper:#e9ddbd;--gold:#d5a74b;--gold-light:#f4d681;--red:#a84435;--bone:#f0e5c9;--green:#629073}*{box-sizing:border-box}body{margin:0;background:#071619;color:var(--paper);font-family:"DM Mono",monospace;min-height:100vh;overflow-x:hidden}.game-shell{min-height:100vh;background:radial-gradient(ellipse at 50% 46%,#23494a 0,#102a2e 34%,#091c20 72%)}.topbar{height:92px;padding:0 clamp(22px,5vw,86px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d5a74b44;background:#0b2025d9;position:relative;z-index:3}.brand{color:var(--gold-light);text-decoration:none;font-family:Cinzel,serif;font-weight:800;letter-spacing:.15em;font-size:18px;display:flex;align-items:center;gap:12px}.brand-mark{font-size:33px;color:var(--gold);line-height:0}.chapter{text-align:center;font-family:Cinzel,serif;letter-spacing:.16em;font-size:13px;color:var(--bone)}.chapter small{display:block;font-family:"DM Mono";font-size:9px;letter-spacing:.14em;color:#a28f68;margin-top:7px}.sound-toggle{border:1px solid #9b835244;background:transparent;color:#bda877;padding:9px 11px;font:10px "DM Mono";letter-spacing:.08em;cursor:pointer}.story-bar{height:72px;background:#d7c79f;color:#183438;display:flex;align-items:center;gap:20px;padding:0 clamp(22px,8vw,144px);position:relative;z-index:3}.story-bar p{font-family:"DM Serif Display",serif;font-style:italic;font-size:19px;margin:0;letter-spacing:.015em}.chapter-rune{color:#a13d31;font:30px Cinzel}.night-counter{margin-left:auto;display:flex;align-items:baseline;gap:5px;color:#294a47}.night-counter span{font-size:9px;letter-spacing:.14em}.night-counter strong{font:700 25px Cinzel;color:#183438}.night-counter i{font-style:normal;font-size:11px;color:#6a705e}.stage{height:min(48vh,440px);min-height:315px;position:relative;overflow:hidden;background:linear-gradient(#11383d 0%,#1f5251 60%,#315e56 100%)}.moon{position:absolute;width:220px;height:220px;border-radius:50%;background:#d9d6ad;filter:blur(.2px);opacity:.84;left:11%;top:-105px;box-shadow:0 0 70px #d9d6ad66}.stars,.stars:before,.stars:after{position:absolute;inset:0;content:"";background-image:radial-gradient(#e8deb5 1px,transparent 1.5px);background-size:62px 52px;opacity:.45}.stars:before{transform:translate(25px,19px);background-size:88px 70px}.mountains{position:absolute;bottom:90px;width:100%;height:130px;background:#173d42;clip-path:polygon(0 70%,10% 33%,17% 71%,29% 12%,40% 75%,53% 28%,64% 78%,75% 20%,87% 62%,100% 32%,100% 100%,0 100%)}.mountains.front{bottom:60px;height:110px;background:#153b3d;opacity:.9;transform:scaleX(-1)}.mist{position:absolute;height:45px;width:55%;border-radius:50%;background:#a6b7a166;filter:blur(22px);bottom:74px;left:-15%;animation:drift 13s linear infinite}.mist-two{bottom:125px;left:58%;animation-duration:18s;opacity:.4}.ground{position:absolute;bottom:0;height:92px;width:100%;background:#162f2e;clip-path:polygon(0 30%,12% 13%,27% 30%,38% 15%,50% 31%,66% 10%,82% 28%,100% 12%,100% 100%,0 100%)}.hall{position:absolute;width:280px;height:230px;left:50%;bottom:63px;transform:translateX(-50%);filter:drop-shadow(0 10px 12px #07141699)}.hall-body{position:absolute;bottom:0;width:100%;height:142px;background:#243d35;border:5px solid #112925;border-bottom:0;clip-path:polygon(2% 0,98% 0,100% 100%,0 100%)}.roof{position:absolute;z-index:1;width:330px;height:125px;left:-25px;top:0;background:#162b2a;clip-path:polygon(50% 0,100% 100%,0 100%)}.roof:after{content:"";position:absolute;inset:16px 25px 20px;background:repeating-linear-gradient(145deg,#27443c 0 6px,#1d3733 6px 13px);clip-path:polygon(50% 0,100% 100%,0 100%)}.roof-line{position:absolute;height:4px;width:240px;background:#d19b3d;left:45px;bottom:16px;z-index:2;opacity:.8}.roof-rune{position:absolute;z-index:3;left:146px;top:36px;color:#d6a74e;font:31px Cinzel}.window{position:absolute;width:18px;height:34px;background:#e7b858;bottom:56px;box-shadow:0 0 17px #f4c967}.w1{left:36px}.w2{left:126px}.w3{right:36px}.door{position:absolute;width:55px;height:83px;bottom:0;left:112px;background:#102522;border:3px solid #315044;border-bottom:0;border-radius:28px 28px 0 0}.door-glow{position:absolute;width:105px;height:110px;bottom:0;left:88px;background:radial-gradient(ellipse at bottom,#e9ae47aa,transparent 63%);filter:blur(8px)}.fighter{position:absolute;bottom:52px;width:100px;height:183px;z-index:2;filter:drop-shadow(0 6px 4px #07131399);transition:transform .35s ease}.beowulf{left:calc(50% - 245px)}.grendel{right:calc(50% - 250px);transform:scaleX(-1) scale(1.1);transform-origin:bottom}.figure-shadow{position:absolute;width:108px;height:17px;border-radius:50%;background:#081b1c99;bottom:-5px;left:-5px}.head{position:absolute;background:#d2a075;width:28px;height:34px;border-radius:48% 47% 43% 43%;left:38px;top:13px;border-top:7px solid #b88756}.torso{position:absolute;width:43px;height:62px;background:#7b4730;left:31px;top:47px;clip-path:polygon(25% 0,75% 0,100% 100%,0 100%);border-bottom:7px solid #c39b5b}.cape{position:absolute;background:#9a4138;width:55px;height:91px;left:27px;top:49px;clip-path:polygon(12% 0,94% 0,100% 96%,51% 100%,0 70%)}.leg{position:absolute;background:#263e37;width:18px;height:62px;bottom:0}.leg.left{left:33px;transform:skew(-5deg)}.leg.right{left:57px;transform:skew(5deg)}.arm{position:absolute;background:#c88e62;width:16px;height:67px;top:53px;transform-origin:top;border-radius:9px}.arm-left{left:25px;transform:rotate(32deg)}.arm-right{left:67px;transform:rotate(-28deg)}.fist{position:absolute;width:25px;height:20px;background:#c88e62;right:6px;top:109px;border-radius:8px;transform:rotate(-18deg)}.g-head{position:absolute;width:42px;height:52px;background:#486b54;left:32px;top:3px;border-radius:55% 45% 47% 42%;border-top:6px solid #2d4c3b}.g-head i,.g-head b{position:absolute;width:5px;height:5px;background:#f3c75d;border-radius:50%;top:21px;box-shadow:0 0 8px #f3c75d}.g-head i{left:10px}.g-head b{right:9px}.g-torso{position:absolute;background:#42664e;width:57px;height:79px;left:24px;top:49px;clip-path:polygon(22% 0,78% 0,100% 100%,0 100%)}.g-leg{position:absolute;width:23px;height:60px;bottom:0;background:#355640}.g-leg.left{left:26px}.g-leg.right{left:59px}.g-arm{position:absolute;width:19px;height:83px;top:56px;background:#42664e;border-radius:9px;transform-origin:top}.g-arm.arm-left{left:17px;transform:rotate(37deg)}.g-arm.arm-right{left:72px;transform:rotate(-34deg)}.g-claw{position:absolute;width:25px;height:18px;background:#77936f;top:128px;border-radius:0 12px 12px 0}.g-claw.left{left:3px;transform:rotate(37deg)}.g-claw.right{right:2px;transform:rotate(-37deg)}.character-name{position:absolute;bottom:-26px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:.2em;color:#ddcfaa;white-space:nowrap}.impact{position:absolute;z-index:4;left:50%;top:48%;font:100px Cinzel;color:#f4cf6d;opacity:0;transform:translate(-50%,-50%) scale(.2);text-shadow:0 0 30px #f2bb42}.combat-panel{background:#0e2427;min-height:126px;padding:23px clamp(22px,9vw,150px);display:flex;align-items:center;justify-content:center;gap:44px;border-top:1px solid #b48b3b55;border-bottom:1px solid #b48b3b55}.combatant{display:flex;align-items:center;gap:14px;width:min(37vw,410px)}.grendel-card{justify-content:flex-end}.portrait{width:53px;height:53px;flex:0 0 53px;border:1px solid #ba934a;color:#ddc87d;display:grid;place-items:center;font:30px Cinzel}.hero-portrait{background:#673d30}.monster-portrait{background:#365541}.vitals{flex:1}.name-row{font:700 12px Cinzel;color:var(--bone);letter-spacing:.1em;display:flex;justify-content:space-between;margin-bottom:8px}.name-row b{font:10px "DM Mono";color:#b7aa89;letter-spacing:0}.healthbar{height:7px;background:#263c3c;padding:1px}.healthbar i{display:block;background:linear-gradient(90deg,#cba443,#f1d271);width:100%;height:100%;transition:width .45s ease}.monster-bar i{margin-left:auto;background:linear-gradient(90deg,#a75043,#d87158)}.vitals small{font-size:8px;letter-spacing:.13em;color:#839582;display:block;margin-top:8px}.align-right{text-align:right}.versus{font:24px Cinzel;color:#a68040}.controls{padding:27px max(22px,8vw);display:flex;gap:13px;background:#102b2d}.action{position:relative;flex:1;min-height:72px;color:var(--paper);border:1px solid #49615a;background:#163538;display:flex;align-items:center;gap:12px;padding:12px 18px;text-align:left;cursor:pointer;transition:transform .15s,background .15s,border .15s}.action:hover,.action:focus{background:#214649;border-color:#d2a951;transform:translateY(-2px);outline:none}.action kbd{font:18px Cinzel;color:#d8b35c;border-right:1px solid #698077;padding-right:12px}.action b{display:block;font:700 13px Cinzel;letter-spacing:.09em}.action small{display:block;color:#a7b4a1;font:10px "DM Mono";margin-top:6px}.daring{border-color:#9c5344}.hint{text-align:center;background:#102b2d;color:#78908a;padding-bottom:19px;font-size:9px;letter-spacing:.14em}.hint span{color:#bd9349;padding:0 7px}.modal{position:fixed;inset:0;background:#061619e8;z-index:10;display:grid;place-items:center;padding:20px;backdrop-filter:blur(4px)}.modal.hidden{display:none}.modal-card{text-align:center;max-width:510px;border:1px solid #c49745;background:#132f31;padding:48px 48px 43px;box-shadow:0 20px 100px #000}.modal-rune{font:55px Cinzel;color:#dbb85f}.eyebrow{font-size:10px;letter-spacing:.18em;color:#b79d67;margin:8px 0}.modal h1{font:700 37px Cinzel;margin:15px 0;color:#f0dfb4}.modal p:not(.eyebrow){font:italic 20px "DM Serif Display";color:#c7c5a8;line-height:1.4}.modal button{margin-top:18px;color:#172f31;background:#d5aa52;border:0;padding:15px 25px;font:700 11px Cinzel;letter-spacing:.12em;cursor:pointer}@keyframes drift{to{transform:translateX(120%)}}.hit-hero{animation:hitHero .42s}.hit-monster{animation:hitMonster .42s}.attacking{animation:lunge .37s}.impact-show{animation:impact .38s}@keyframes lunge{50%{transform:translateX(65px) scale(1.04)}}@keyframes hitHero{40%{filter:brightness(2.5) drop-shadow(0 0 15px #cf5844);transform:translateX(-18px)}}@keyframes hitMonster{40%{filter:brightness(2.8) drop-shadow(0 0 18px #e8b64e);transform:scaleX(-1.1) scale(1.15) translateX(-18px)}}@keyframes impact{25%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.7)}}@media(max-width:700px){.topbar{height:68px}.chapter{display:none}.brand{font-size:15px}.story-bar{height:auto;min-height:74px;padding:11px 18px;gap:10px}.story-bar p{font-size:16px}.night-counter{display:none}.stage{height:38vh;min-height:300px}.hall{transform:translateX(-50%) scale(.8);transform-origin:bottom}.beowulf{left:6%;transform:scale(.8);transform-origin:bottom left}.grendel{right:5%;transform:scaleX(-1) scale(.82);transform-origin:bottom right}.combat-panel{padding:15px 18px;gap:11px}.combatant{width:calc(50% - 17px);gap:8px}.portrait{width:38px;height:38px;flex-basis:38px;font-size:22px}.name-row{font-size:10px}.name-row b{font-size:8px}.vitals small{font-size:7px}.versus{font-size:17px}.controls{padding:12px;gap:7px}.action{min-height:80px;padding:8px;gap:7px}.action kbd{display:none}.action b{font-size:10px}.action small{font-size:8px;line-height:1.25}.modal-card{padding:36px 25px}.modal h1{font-size:29px}}
.stage-caption{position:absolute;z-index:5;bottom:15px;left:50%;transform:translateX(-50%);width:min(90%,580px);text-align:center;color:#dbd0ad;text-shadow:0 2px 4px #071313;font:italic 17px "DM Serif Display";pointer-events:none}