:root{--jade:#75ffd7;--acid:#c5ff62;--gold:#f4c86a;--danger:#ff5276;--ink:#05050b;--panel:rgba(7,10,19,.82);--line:rgba(117,255,215,.25)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#030307;color:#f3fff9;font-family:Inter,"Segoe UI",Arial,sans-serif;touch-action:none}button,a{font:inherit}.game-shell{height:100dvh;min-height:560px;padding:10px;display:grid;grid-template-rows:58px 1fr;gap:8px;background:radial-gradient(circle at 50% 20%,#17221c 0,#070711 44%,#020205 100%)}
.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 12px;border:1px solid var(--line);background:rgba(4,6,12,.9);box-shadow:0 0 30px rgba(117,255,215,.07)}.topbar>a{justify-self:start;color:var(--jade);text-decoration:none;border:1px solid var(--line);border-radius:99px;padding:9px 12px;font-size:.68rem;font-weight:900;letter-spacing:.14em}.topbar>div{text-align:center}.topbar small{display:block;color:#7c9c93;font-size:.54rem;letter-spacing:.28em}.topbar strong{display:block;margin-top:4px;font-size:.95rem;letter-spacing:.26em}.online{justify-self:end;color:#9aafa9;font-size:.58rem;letter-spacing:.14em}.online i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;background:var(--acid);box-shadow:0 0 12px var(--acid);animation:pulse 1.6s infinite}
.game-stage{position:relative;min-height:0;overflow:hidden;border:1px solid rgba(117,255,215,.2);border-radius:18px;background:#05050b;box-shadow:inset 0 0 75px #000,0 20px 70px rgba(0,0,0,.5)}#renderCanvas{display:block;width:100%;height:100%;touch-action:none;outline:0;image-rendering:auto}.atmosphere{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 90px 12px rgba(0,0,0,.58);background:radial-gradient(circle at 10% 70%,rgba(46,154,71,.1),transparent 30%),radial-gradient(circle at 88% 34%,rgba(91,194,72,.08),transparent 28%),repeating-linear-gradient(0deg,transparent 0 6px,rgba(117,255,215,.011) 7px);mix-blend-mode:screen}
.temple-event{position:absolute;z-index:16;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;pointer-events:none;opacity:0;background:radial-gradient(circle,rgba(72,255,93,.16),rgba(1,8,5,.08) 32%,transparent 66%);transition:opacity .16s}.temple-event i{width:130px;height:62px;border-radius:50%;background:radial-gradient(ellipse,#f6ffd5 0 7%,#b5ff4f 8% 18%,#122814 20% 52%,transparent 54%);filter:drop-shadow(0 0 22px #aaff5c);transform:scale(.2)}.temple-event strong{padding:9px 16px;border:1px solid rgba(170,255,92,.6);background:rgba(3,12,7,.84);color:var(--acid);font-size:.62rem;letter-spacing:.22em;transform:translateY(20px)}.temple-event.show{opacity:1}.temple-event.show i{animation:guardianEye .82s cubic-bezier(.16,.9,.25,1) both}.temple-event.show strong{animation:guardianWords 1.7s both}.game-stage.quake{animation:templeQuake .42s linear}
.stats{position:absolute;z-index:5;top:18px;min-width:148px;padding:11px 13px;border:1px solid var(--line);background:linear-gradient(130deg,rgba(4,12,14,.9),rgba(9,14,24,.72));backdrop-filter:blur(7px);pointer-events:none}.stats.left{left:18px;border-radius:4px 16px 16px 4px}.stats.right{right:18px;text-align:right;border-radius:16px 4px 4px 16px}.stats small,.stats span{display:block;color:#76968d;font-size:.52rem;letter-spacing:.15em}.stats b{display:block;margin:4px 0;color:var(--acid);font-size:1rem;letter-spacing:.14em;text-shadow:0 0 14px rgba(197,255,98,.35)}
.selection{position:absolute;z-index:5;left:50%;top:20px;transform:translateX(-50%);max-width:44%;padding:8px 14px;border-bottom:1px solid var(--jade);background:rgba(4,8,12,.72);color:#d7fff3;text-align:center;font-size:.57rem;letter-spacing:.13em;pointer-events:none}.selection.good{color:var(--acid);border-color:rgba(197,255,98,.6)}.selection.error{color:#ff826f;border-color:rgba(255,82,67,.6)}.controls{position:absolute;z-index:7;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:7px;padding:7px;border:1px solid var(--line);border-radius:99px;background:rgba(4,7,13,.82);backdrop-filter:blur(8px)}.controls button{border:0;border-radius:99px;padding:9px 12px;color:#b8cec7;background:rgba(117,255,215,.07);font-size:.57rem;font-weight:900;letter-spacing:.09em;cursor:pointer}.controls button:hover{color:#07100d;background:linear-gradient(90deg,var(--jade),var(--acid))}.controls button[aria-pressed="false"]{opacity:.45}.controls button:disabled{opacity:.3;cursor:not-allowed;filter:grayscale(.7)}
.start-screen,.victory{position:absolute;z-index:20;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;background:radial-gradient(circle at 50% 42%,rgba(25,51,40,.91),rgba(3,3,9,.98) 62%);transition:opacity .5s,visibility .5s}.start-screen.hidden,.victory.hidden{opacity:0;visibility:hidden;pointer-events:none}.start-screen>p:first-child,.victory>p:first-child{margin:0 0 10px;color:var(--gold);font-size:.62rem;font-weight:900;letter-spacing:.3em}.start-screen h1{margin:0;font-size:clamp(2.7rem,7vw,6.5rem);line-height:.82}.start-screen h1 span{font-size:.36em;color:var(--acid);letter-spacing:.2em}.temple-mark{position:relative;width:150px;height:84px;margin:22px 0 6px}.temple-mark i{position:absolute;left:50%;bottom:0;transform:translateX(-50%);border-style:solid;border-color:transparent transparent rgba(244,200,106,.24);border-width:0 66px 22px}.temple-mark i:nth-child(2){bottom:18px;border-width:0 48px 18px}.temple-mark i:nth-child(3){bottom:33px;border-width:0 30px 16px}.temple-mark b{position:absolute;z-index:2;left:50%;top:5px;transform:translateX(-50%);color:var(--acid);font-size:2.3rem;text-shadow:0 0 18px var(--acid)}.intro{max-width:650px;margin:10px auto 18px;color:#a7bdb6;line-height:1.6;font-size:.9rem}.rules{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:860px}.rules span{padding:8px 10px;border:1px solid rgba(117,255,215,.17);color:#96aca5;font-size:.6rem;letter-spacing:.05em}.rules b{color:var(--acid);margin-right:5px}.start-screen>button,.victory>button{margin-top:20px;padding:14px 24px;border:0;border-radius:4px;color:#06100c;background:linear-gradient(100deg,var(--jade),var(--acid),var(--gold));font-weight:1000;letter-spacing:.13em;cursor:pointer;box-shadow:0 0 30px rgba(117,255,215,.22)}.start-screen>small{margin-top:12px;color:#71877f;font-size:.55rem;letter-spacing:.08em}.victory h2{margin:0;font-size:clamp(2.6rem,7vw,6rem)}.victory-glyph{font-size:5rem;color:var(--acid);text-shadow:0 0 35px var(--acid);animation:float 2s infinite}.victory p:not(:first-child){color:#a8c0b8}
@keyframes pulse{50%{opacity:.25}}@keyframes float{50%{transform:translateY(-10px) rotate(8deg)}}@keyframes guardianEye{35%{transform:scale(1.12)}70%{transform:scale(.92)}100%{transform:scale(1)}}@keyframes guardianWords{0%,28%,100%{opacity:0}38%,76%{opacity:1;transform:translateY(0)}}@keyframes templeQuake{0%,100%{transform:none}20%{transform:translate(5px,-3px)}40%{transform:translate(-7px,2px)}60%{transform:translate(4px,4px)}80%{transform:translate(-3px,-2px)}}
@media(max-width:720px){.game-shell{padding:0;gap:0;grid-template-rows:52px 1fr}.topbar{border-width:0 0 1px}.topbar>a{font-size:.52rem;padding:7px 8px}.topbar small,.online{display:none}.topbar strong{font-size:.7rem}.game-stage{border:0;border-radius:0}.stats{top:10px;min-width:108px;padding:8px}.stats.left{left:9px}.stats.right{right:9px}.stats small,.stats span{font-size:.43rem}.stats b{font-size:.76rem}.selection{top:auto;bottom:66px;max-width:82%;font-size:.45rem}.controls{bottom:12px;gap:3px;padding:5px}.controls button{font-size:0;padding:9px 10px}.controls button:first-child:before{content:'✦';font-size:.8rem}.controls button:nth-child(2):before{content:'⌁';font-size:.8rem}.controls button:nth-child(3):before{content:'↶';font-size:.8rem}.controls button:nth-child(4):before{content:'◖))';font-size:.7rem}.start-screen{padding:20px}.intro{font-size:.76rem}.rules span{font-size:.5rem}.temple-mark{margin:13px 0 0;transform:scale(.82)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.temple-size{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:9px;width:min(440px,100%);margin-top:14px}.temple-size button{padding:11px;border:1px solid rgba(117,255,215,.22);border-radius:7px;color:#a9bcb6;background:rgba(2,8,8,.62);cursor:pointer}.temple-size button strong,.temple-size button span{display:block}.temple-size button strong{font-size:.78rem;letter-spacing:.15em}.temple-size button span{margin-top:4px;font-size:.48rem;letter-spacing:.12em}.temple-size button.selected{border-color:var(--acid);color:#07100d;background:linear-gradient(100deg,var(--jade),var(--acid));box-shadow:0 0 22px rgba(197,255,98,.2)}