:root{
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bottom:env(safe-area-inset-bottom,0px);
  --ink:#fff;
  --gold:#ffc94a;
  --board-tile-radius:6px;
  --board-border-size:8px;
  --board-border-overlap-x:0px;
  --board-border-overlap-y:0px;
  --board-border-underlap:2px;
  --board-corner-size:8px;
  --board-corner-offset-x:2px;
  --board-corner-offset-y:2px;
  --board-border-color:#f6e4c5;
  --hud-pause-size:58px;
  --hud-pause-gap:8px;
  --hud-pause-bottom-padding:6px;
  --hud-pause-reserve:calc(var(--hud-pause-size) + var(--hud-pause-gap));
  font-family:"Lilita One",system-ui,sans-serif;
  color:var(--ink);
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#0b1020 url("../assets/backgrounds/vault-room.webp") center/cover no-repeat fixed}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:#0b1020 url("../assets/backgrounds/vault-room.webp") center/cover no-repeat}
button,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}img{display:block}
#vault-bg,#vault-bg-overlay,#application-canvas,#fallback-canvas,#ambient-dim{position:fixed;inset:0;width:100%;height:100%}
#vault-bg{--bg-x:0px;--bg-y:0px;--bg-scale:1.14;z-index:0;background:#0b1020 url("../assets/backgrounds/vault-room.webp") center/cover no-repeat;filter:blur(12px) saturate(.98) brightness(.74);transform:translate3d(var(--bg-x),var(--bg-y),0) scale(var(--bg-scale));transform-origin:center;will-change:transform}
#vault-bg-overlay{--overlay-x:0px;--overlay-y:0px;z-index:1;pointer-events:none;background:radial-gradient(circle at calc(50% + var(--overlay-x)) calc(42% + var(--overlay-y)),rgba(255,214,133,.12),transparent 32%),linear-gradient(180deg,rgba(9,12,22,.12),rgba(9,12,22,.26))}
#application-canvas,#fallback-canvas{z-index:2;pointer-events:none}#fallback-canvas{display:none}
#ambient-dim{z-index:3;pointer-events:none;background:rgba(15,12,29,.22);transition:opacity .25s ease}
#app{position:fixed;inset:0;z-index:4;background:transparent}
.screen{position:absolute;inset:0;display:grid;opacity:0;visibility:hidden;pointer-events:none;transform:scale(1.018);transition:opacity .32s ease,transform .36s cubic-bezier(.2,.8,.2,1),visibility 0s linear .36s}
.screen.active{opacity:1;visibility:visible;pointer-events:auto;transform:scale(1);transition-delay:0s}
.modal-backdrop{position:fixed;inset:0;z-index:30;background:rgba(7,19,35,.58);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);opacity:0;visibility:hidden;transition:.22s ease}
.modal-backdrop.active{opacity:1;visibility:visible}
.modal{position:fixed;inset:0;z-index:31;display:grid;place-items:center;padding:18px;opacity:0;visibility:hidden;pointer-events:none;transition:.22s ease}
.modal.active{opacity:1;visibility:visible;pointer-events:auto}
.modal .hub-modal{transform:translateY(18px) scale(.95);transition:transform .3s cubic-bezier(.18,1.25,.3,1)}
.modal.active .hub-modal{transform:none}
.compat-values{display:none!important}
#rotate-note{display:none}