:root{--sat:env(safe-area-inset-top,0px);--sar:env(safe-area-inset-right,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--gold:#e8c46a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{color:#f4ead2;touch-action:none;-webkit-user-select:none;user-select:none;background:#0b0710;height:100%;margin:0;font-family:system-ui,sans-serif;overflow:hidden}#stage{width:100%;height:100%;display:block;position:fixed;inset:0}#portal-frame{border:2px solid var(--gold);pointer-events:none;border-radius:6px;transition:box-shadow .2s,border-color .2s;position:fixed;box-shadow:0 0 10px #0009}#portal-label{letter-spacing:.08em;text-transform:uppercase;text-shadow:0 1px 2px #000;font-size:10px;position:absolute;top:3px;left:6px}#portal-frame.threat,#portal-frame.rise,#portal-frame.check{animation:1s infinite pulse}#portal-frame.threat{border-color:#ff9a3a}#portal-frame.rise{border-color:#7ad0ff}#portal-frame.check{border-color:#ff3a3a}@keyframes pulse{50%{box-shadow:0 0 18px 4px}}#turn{top:calc(var(--sat) + 8px);background:#0a0610b3;border-radius:14px;padding:4px 14px;font-size:13px;position:fixed;left:50%;transform:translate(-50%)}#hint{bottom:calc(var(--sab) + 10px);text-align:center;background:#0a0610c7;border-radius:12px;max-width:50vw;padding:5px 12px;font-size:12px;position:fixed;left:50%;transform:translate(-50%)}#hint:empty{display:none}#toolbar{left:calc(var(--sal) + 8px);flex-flow:column wrap;align-content:flex-start;gap:5px;max-height:90vh;display:flex;position:fixed;top:50%;transform:translateY(-50%)}#toolbar button{border:1px solid var(--gold);width:36px;height:36px;color:var(--gold);background:#0a0610b8;border-radius:18px;padding:0;font-size:17px}#toolbar button:active{background:#3c280ae6}#movelist{top:calc(var(--sat) + 40px);right:calc(var(--sar) + 8px);touch-action:pan-y;background:#0a0610d9;border-radius:8px;width:150px;max-height:45vh;padding:6px 8px;font:12px ui-monospace,monospace;position:fixed;overflow-y:auto}#movelist div{white-space:nowrap;padding:1px 0}#movelist .n{color:#8a7a60;width:24px;display:inline-block}#promo{border:1px solid var(--gold);background:#0a0610eb;border-radius:10px;gap:10px;padding:12px;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}#promo[hidden],#movelist[hidden],#banner[hidden]{display:none}#promo button{width:52px;height:52px;color:var(--gold);border:1px solid var(--gold);background:#2a1d3a;border-radius:8px;font-size:26px}#banner{border:2px solid var(--gold);text-align:center;background:#0a0610e6;border-radius:12px;padding:14px 28px;font-family:Cinzel,Georgia,serif;font-size:22px;position:fixed;top:38%;left:50%;transform:translate(-50%,-50%)}@media (orientation:portrait){#toolbar{top:auto;left:50%;bottom:calc(var(--sab) + 8px);flex-direction:row;justify-content:center;gap:5px;width:94vw;max-width:430px;max-height:none;transform:translate(-50%)}#toolbar button{width:36px;height:36px;font-size:16px}#hint{bottom:calc(var(--sab) + 132px);max-width:90vw}#movelist{top:calc(var(--sat) + 44px)}#turn{text-align:center;max-width:92vw;font-size:12px}}.board-label{color:var(--gold);letter-spacing:.1em;text-transform:uppercase;pointer-events:none;background:#0a0610b8;border-radius:10px;padding:2px 9px;font-size:10px;position:fixed}.board-label[hidden]{display:none}.menu{z-index:50;padding:calc(var(--sat) + 12px) calc(var(--sar) + 16px) calc(var(--sab) + 12px) calc(var(--sal) + 16px);-webkit-backdrop-filter:blur(5px);background:radial-gradient(at 50% 115%,#96280ac7 0%,#18080ee6 48%,#060309f5 100%);justify-content:center;align-items:center;transition:opacity .7s,transform .9s cubic-bezier(.2,.7,.2,1),-webkit-backdrop-filter .7s,backdrop-filter .7s;display:flex;position:fixed;inset:0}.menu.leaving{opacity:0;pointer-events:none;-webkit-backdrop-filter:blur();backdrop-filter:blur();transform:scale(1.12)}.menu[hidden]{display:none}.menu-panel{text-align:center;width:100%;max-width:760px;animation:.55s cubic-bezier(.2,.7,.2,1) both rise}.menu-panel[hidden]{display:none}@keyframes rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}.menu h1{letter-spacing:.08em;text-transform:uppercase;color:#f4ead2;text-shadow:0 0 22px #ff78288c,0 2px #000;margin:0;font:700 clamp(30px,7vw,56px)/1.05 Cinzel,Georgia,Times New Roman,serif}.menu h1 span{color:var(--gold)}.menu h2{letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin:0 0 14px;font:600 clamp(18px,4vw,26px) Cinzel,Georgia,serif}.menu .tag{color:#c9b890;letter-spacing:.06em;margin:8px 0 22px;font-size:clamp(12px,2.4vw,15px);font-style:italic}.menu button.big{letter-spacing:.08em;color:#1b1208;cursor:pointer;background:linear-gradient(#f0cf7a,#c8932f);border:2px solid #ffe7a6;border-radius:12px;width:min(380px,90%);margin:10px auto;padding:14px 18px;font:600 clamp(15px,3vw,19px) Cinzel,Georgia,serif;transition:transform .12s,box-shadow .12s;display:block;box-shadow:0 0 18px #ff962859,inset 0 1px #ffffff80}.menu button.big.alt{color:var(--gold);border-color:var(--gold);box-shadow:none;background:#0e0810b8}.menu button.big small{letter-spacing:.04em;opacity:.75;margin-top:2px;font:400 11px system-ui,sans-serif;display:block}.menu button.big:active{transform:scale(.97)}.menu button.big:hover{box-shadow:0 0 26px #ffa03299}.levels{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.level{text-align:left;cursor:pointer;color:#f4ead2;background:linear-gradient(#28141cd1,#0e0810e0);border:1.5px solid #e8c46a73;border-radius:12px;padding:12px 12px 14px;font-family:inherit;transition:transform .12s,border-color .12s,box-shadow .12s}.level:hover,.level.last{border-color:var(--gold);box-shadow:0 0 18px #ff962866}.level:active{transform:scale(.97)}.level b{letter-spacing:.06em;color:var(--gold);font:600 15px Cinzel,Georgia,serif;display:block}.level .pips{letter-spacing:3px;color:#ff7a30;margin:4px 0 6px;font-size:12px}.level .pips i{opacity:.25;font-style:normal}.level p{color:#d9ccb0;margin:0;font-size:11.5px;line-height:1.35}.menu button.link{color:#c9b890;cursor:pointer;letter-spacing:.06em;background:0 0;border:0;margin-top:16px;font-size:14px}body.menu-open #toolbar,body.menu-open #turn,body.menu-open #hint,body.menu-open #portal-frame,body.menu-open .board-label,body.menu-open #banner{visibility:hidden}@media (max-width:700px),(orientation:portrait){.levels{grid-template-columns:repeat(2,1fr)}}@media (max-height:420px){.menu .tag{margin:4px 0 10px}.level{padding:8px 10px}.level p{font-size:10.5px}.menu .tag+.big{margin-top:4px}.menu button.big{margin:7px auto;padding:10px 14px}}@media (max-height:330px){.level p{display:none}}#tut-ring{z-index:30;pointer-events:none;border:3px solid #ffd24a;border-radius:14px;animation:1.1s ease-in-out infinite ringPulse;position:fixed;box-shadow:0 0 14px 3px #ffd24acc,inset 0 0 12px #ffd24a59}#tut-ring[hidden]{display:none}@keyframes ringPulse{50%{transform:scale(1.06);box-shadow:0 0 22px 7px #ffd24af2,inset 0 0 14px #ffd24a80}}#coach{z-index:40;right:calc(var(--sar) + 10px);top:calc(var(--sat) + 38px);border:1.5px solid var(--gold);touch-action:manipulation;background:#0c0712ed;border-radius:12px;width:min(300px,36vw);padding:10px 12px 12px;position:fixed;box-shadow:0 6px 24px #0000008c}#coach[hidden]{display:none}#coach .coach-top{letter-spacing:.1em;color:#a99a78;justify-content:space-between;align-items:center;font-size:10px;display:flex}#coach .link{color:#a99a78;cursor:pointer;background:0 0;border:0;padding:2px 0;font-size:10px}#coach b#coach-title{color:var(--gold);letter-spacing:.04em;margin:4px 0;font:600 15px Cinzel,Georgia,serif;display:block}#coach p{color:#eadfc6;margin:0;font-size:12.5px;line-height:1.42}#coach p b{color:#ffd98a}#coach p b.warn{color:#ff8a6a}#coach-actions{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}#coach-actions button{cursor:pointer;color:var(--gold);border:1px solid var(--gold);background:#281832e6;border-radius:9px;padding:7px 14px;font-size:13px}#coach-actions button.primary{color:#1b1208;background:linear-gradient(#f0cf7a,#c8932f);border-color:#ffe7a6;font-weight:600}body.tutorial #banner{display:none!important}body.menu-open #coach,body.menu-open #tut-ring{display:none}@media (orientation:portrait){#coach{width:auto;left:8px;right:8px;top:calc(var(--sat) + 36px)}}@media (max-height:420px) and (orientation:landscape){#coach{width:min(270px,38vw)}#coach p{font-size:12px}}#coach.nudge{animation:.45s coachNudge}@keyframes coachNudge{20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}#sound-menu{z-index:35;left:calc(var(--sal) + 62px);border:1.5px solid var(--gold);background:#0c0712f2;border-radius:12px;width:270px;padding:10px 14px 14px;position:fixed;top:50%;transform:translateY(-50%);box-shadow:0 6px 24px #0000008c}#sound-menu[hidden]{display:none}#sound-menu .sm-head{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}#sound-menu .sm-head b{letter-spacing:.1em;text-transform:uppercase;color:var(--gold);font:600 14px Cinzel,Georgia,serif}#sound-menu .link{color:#a99a78;cursor:pointer;background:0 0;border:0;padding:2px 4px;font-size:15px}.sm-row{grid-template-columns:auto 62px 1fr;align-items:center;gap:10px;padding:9px 0;display:grid}.sm-row .sm-name{color:#eadfc6;font-size:13px}.sm-row.off .sm-name,.sm-row.off input[type=range]{opacity:.4}.sw{width:42px;height:24px;display:inline-block;position:relative}.sw input{opacity:0;width:0;height:0;position:absolute}.sw span{cursor:pointer;background:#3a2c46;border:1px solid #6a5a50;border-radius:12px;transition:background .15s;position:absolute;inset:0}.sw span:after{content:"";background:#cbbfa6;border-radius:50%;width:16px;height:16px;transition:transform .15s,background .15s;position:absolute;top:3px;left:3px}.sw input:checked+span{background:#b8842a;border-color:#ffe7a6}.sw input:checked+span:after{background:#fff3d0;transform:translate(18px)}.sw input:focus-visible+span{outline-offset:2px;outline:2px solid #ffd24a}.sm-row input[type=range]{appearance:none;touch-action:pan-x;cursor:pointer;background:0 0;width:100%;height:26px}.sm-row input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, #d9a93a var(--fill,50%), #3a2c46 var(--fill,50%));border-radius:3px;height:6px}.sm-row input[type=range]::-moz-range-track{background:#3a2c46;border-radius:3px;height:6px}.sm-row input[type=range]::-moz-range-progress{background:#d9a93a;border-radius:3px;height:6px}.sm-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#fff3d0;border:2px solid #d9a93a;border-radius:50%;width:20px;height:20px;margin-top:-7px}.sm-row input[type=range]::-moz-range-thumb{background:#fff3d0;border:2px solid #d9a93a;border-radius:50%;width:16px;height:16px}body.menu-open #sound-menu{display:none}@media (orientation:portrait){#sound-menu{top:auto;left:50%;bottom:calc(var(--sab) + 108px);width:min(92vw,330px);transform:translate(-50%)}}@media (max-height:420px) and (orientation:landscape){.sm-row{padding:5px 0}#sound-menu{padding:8px 12px 10px}}
