@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&family=EB+Garamond:ital,wght@0,400;0,500;1,400&display=swap');
:root{--gold:#d0ac64;--gold2:#765626;--paper:#e5d1a4;--ink:#08090b;--glass:rgba(8,9,12,.72);--line:rgba(208,172,100,.32);--house:#879b8b}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#050608;color:#eee;font-family:'EB Garamond',serif}body{overflow-x:hidden}.hidden{display:none!important}
.vignette{position:fixed;inset:0;box-shadow:inset 0 0 180px 55px #000;pointer-events:none;z-index:8}
#fx{position:fixed;inset:0;pointer-events:none;z-index:7;overflow:hidden}.dust{position:absolute;width:3px;height:3px;background:#f2d79d;border-radius:50%;box-shadow:0 0 8px #e8c675;animation:drift linear infinite;opacity:.35}@keyframes drift{from{transform:translate(0,105vh) rotate(0)}to{transform:translate(80px,-10vh) rotate(180deg)}}
button{font-family:Cinzel,serif;cursor:pointer}#auth{min-height:100vh;display:grid;place-items:center;position:relative;background:radial-gradient(circle at 50% 25%,#28303a,#0c1016 50%,#030405)}
.castle-silhouette{position:absolute;left:0;right:0;bottom:0;height:48vh;background:#050608;clip-path:polygon(0 100%,0 75%,8% 75%,8% 55%,11% 46%,14% 55%,14% 80%,24% 80%,24% 49%,28% 34%,32% 49%,32% 72%,41% 72%,41% 38%,45% 22%,49% 38%,49% 66%,57% 66%,57% 42%,61% 29%,65% 42%,65% 76%,75% 76%,75% 52%,79% 39%,83% 52%,83% 70%,91% 70%,91% 58%,94% 49%,97% 58%,97% 100%)}
.login-card{z-index:2;width:min(470px,92vw);padding:36px;text-align:center;background:linear-gradient(145deg,rgba(20,19,18,.92),rgba(6,7,9,.95));border:1px solid var(--line);box-shadow:0 30px 100px #000}.seal{margin:auto;width:70px;height:82px;border:2px solid var(--gold);display:grid;place-items:center;font:700 34px Cinzel;color:var(--gold);clip-path:polygon(50% 0,95% 15%,86% 73%,50% 100%,14% 73%,5% 15%);background:#17130d}.overline,.eyebrow{font:10px Cinzel;letter-spacing:4px;color:#9c8b6e;margin:15px 0}.login-card h1{font:600 clamp(34px,6vw,55px) Cinzel;line-height:1.05;letter-spacing:4px;color:#e7d2a2;margin:8px 0}.login-card p{color:#bcb4a6;font-size:18px}.tabs{display:flex;margin:25px 0 12px}.tabs button{flex:1;padding:10px;background:none;color:#837967;border:0;border-bottom:1px solid #4c402c}.tabs .active{color:#f0d69a;border-color:var(--gold)}
input{width:100%;padding:13px;margin:5px 0;background:#08090b;border:1px solid #3d3528;color:white;font:17px 'EB Garamond';outline:none}input:focus{border-color:var(--gold)}.primary{padding:12px 18px;background:linear-gradient(#8a6930,#4b3413);border:1px solid #d1aa60;color:#fff0ca;margin-top:12px}#authForm .primary{width:100%}#authError{color:#d97d78;margin-top:10px}
#loading{min-height:95vh;display:grid;place-items:center;text-align:center}.rune{font-size:60px;color:var(--gold);animation:spin 4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.game{min-height:calc(100vh - 30px);position:relative}.scene{height:calc(100vh - 30px);min-height:680px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 25%,#414044 0,#202126 34%,#0b0c0f 76%)}.scene[data-location="Slytherin Common Room"]{background:radial-gradient(circle at 50% 42%,#294038,#101d1b 35%,#060a0a 78%)}.scene[data-location="Great Hall"]{background:radial-gradient(circle at 50% 22%,#493b28,#1b1714 42%,#080809 80%)}.scene[data-location="Library"]{background:radial-gradient(circle at 50% 40%,#3d3022,#17120e 42%,#070708 80%)}
.sky{position:absolute;inset:0 0 48% 0;background:linear-gradient(#111621,#303744 70%,transparent);opacity:.75}.moon{position:absolute;width:90px;height:90px;border-radius:50%;background:#d9d6c6;box-shadow:0 0 70px #d7d0aa;right:13%;top:10%;opacity:.55}.architecture{position:absolute;inset:22% 0 0}.arch{position:absolute;bottom:0;width:24%;height:78%;border:18px solid #171719;border-bottom:0;border-radius:50% 50% 0 0;box-shadow:inset 0 0 45px #000,0 0 25px #000}.a1{left:-3%}.a2{left:25%}.a3{left:53%}.a4{right:-5%}.floor{position:absolute;left:0;right:0;bottom:0;height:22%;background:repeating-linear-gradient(100deg,#111214 0 60px,#171719 61px 63px);transform:perspective(500px) rotateX(25deg);transform-origin:bottom}
.candle{position:absolute;width:4px;height:35px;background:#dfc58e;box-shadow:0 0 18px #f2c15b}.candle:before{content:"";position:absolute;width:7px;height:11px;left:-2px;top:-10px;background:#ffd36d;border-radius:60% 40%;box-shadow:0 0 20px #ffb22f;animation:flicker .8s infinite alternate}@keyframes flicker{to{transform:translateX(2px) scale(.85);opacity:.75}}
.hotspot{position:absolute;z-index:4;border:1px solid transparent;background:transparent;color:transparent;border-radius:50%;transition:.25s}.hotspot:hover,.revelio .hotspot{border-color:#e6c16b;color:#f1d99f;background:rgba(212,174,92,.08);box-shadow:0 0 30px rgba(229,190,105,.28)}.hotspot span{position:absolute;left:50%;bottom:-30px;transform:translateX(-50%);white-space:nowrap;background:#08090bd9;border:1px solid #80683d;padding:6px 9px;font:10px Cinzel;letter-spacing:1px}
.h-door{width:150px;height:250px;left:44%;top:36%;border-radius:75px 75px 4px 4px}.h-portrait{width:110px;height:150px;left:18%;top:32%;border-radius:4px}.h-secret{width:90px;height:90px;right:17%;top:47%}
.hud-top{position:absolute;z-index:6;left:20px;right:20px;top:18px;display:flex;align-items:center;gap:13px;pointer-events:none}.brand{font:600 16px Cinzel;letter-spacing:3px;color:#e7cf98;text-shadow:0 2px 8px #000;margin-right:auto}.chip{background:rgba(5,6,8,.72);border:1px solid var(--line);padding:8px 11px;font:11px Cinzel;color:#cfc1a4;backdrop-filter:blur(8px)}
.hud-bottom{position:absolute;z-index:6;bottom:23px;left:50%;transform:translateX(-50%);display:flex;gap:8px;background:rgba(5,6,8,.78);border:1px solid var(--line);padding:8px;backdrop-filter:blur(10px)}.hud-bottom button{width:68px;height:57px;border:0;background:transparent;color:#bcb09a;font-size:11px}.hud-bottom button b{display:block;font-size:20px;color:#dfc078;margin-bottom:3px}.hud-bottom button:hover{background:#211a10;color:#fff}.wand-btn{border:1px solid #c9a45e!important;border-radius:50%;width:62px!important;height:62px!important;margin-top:-12px;background:radial-gradient(circle,#59401c,#17120c)!important;box-shadow:0 0 25px #7a5723}
.location-card{position:absolute;z-index:5;left:35px;bottom:110px;width:min(470px,70vw);pointer-events:none}.location-card h1{font:500 clamp(28px,4vw,47px) Cinzel;color:#ecd49c;margin:4px 0;text-shadow:0 4px 20px #000}.location-card p{font-size:18px;color:#c9c1b3;text-shadow:0 2px 8px #000}.location-card .eyebrow{margin:0}
.students{position:absolute;z-index:5;right:28px;top:82px;width:220px;background:var(--glass);border:1px solid var(--line);padding:13px;backdrop-filter:blur(8px)}.students h3{font:11px Cinzel;letter-spacing:2px;color:#d7b96f}.student{padding:8px;border-top:1px solid #302a21;cursor:pointer}.student:hover{background:#241d13}.student small{display:block;color:#8f8472}.founder{color:#d8b45e}
.spell-wheel{position:fixed;z-index:20;left:50%;bottom:95px;transform:translateX(-50%);display:flex;gap:8px;background:#08090be8;border:1px solid #8c713e;padding:12px;box-shadow:0 0 50px #000}.spell-wheel button{padding:12px;background:#17140f;border:1px solid #4b3d29;color:#d9c28d}.spell-wheel button:hover{border-color:#d3ad62;box-shadow:0 0 18px #725221}
#toast{position:fixed;z-index:30;top:80px;left:50%;transform:translateX(-50%) translateY(-30px);opacity:0;background:#090a0ce8;border:1px solid #9c7d43;color:#ecd39a;padding:12px 20px;font:12px Cinzel;letter-spacing:1px;transition:.3s;pointer-events:none}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.modal{position:fixed;z-index:25;inset:0;background:#000c;display:grid;place-items:center;padding:20px}.modal-card{width:min(700px,95vw);max-height:82vh;overflow:auto;background:linear-gradient(145deg,#191713,#090a0c);border:1px solid #8b7040;padding:28px;box-shadow:0 30px 100px #000}.modal-card h2{font:500 28px Cinzel;color:#e0bf78}.close{float:right;background:none;border:1px solid #4c4030;color:#b9a98c;padding:7px}.menu-list button{display:block;width:100%;text-align:left;padding:13px;background:#0e0f11;border:0;border-bottom:1px solid #30291f;color:#d6ccbb}.menu-list button:hover{background:#211a11}.item{display:flex;justify-content:space-between;padding:9px;border-bottom:1px solid #30291f}.story-wrap{min-height:95vh;display:grid;place-items:center;padding:25px;background:radial-gradient(circle,#28251f,#070809)}.story-card{width:min(780px,96vw);text-align:center;border:1px solid var(--line);background:#0a0b0de8;padding:40px;box-shadow:0 30px 100px #000}.story-card h2{font:500 32px Cinzel;color:#e2c27b}.story-card p{font-size:19px;line-height:1.55;color:#cbc2b2}.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:9px}.choice{padding:13px;background:#111216;border:1px solid #4a3d29;color:#d9c9a7}.choice:hover{border-color:#d0a75d;background:#241c10}
footer{min-height:30px;background:#050608;color:#625b4f;text-align:center;padding:9px;font:8px Cinzel;letter-spacing:1px}
@media(max-width:850px){.students{display:none}.hud-top{left:10px;right:10px}.brand{font-size:11px}.chip:nth-of-type(n+3){display:none}.location-card{left:18px;bottom:105px}.hud-bottom button{width:52px}.scene{min-height:650px}.h-door{left:38%}}
