html.mode-gate-active,html.mode-gate-active body{overflow:hidden!important}
.mode-gate{position:fixed;inset:0;z-index:2147483000;display:grid;grid-template-rows:auto 1fr;min-height:100dvh;overflow:auto;color:#f6f1e5;background:#07131d;font-family:Inter,system-ui,sans-serif;isolation:isolate}
.mode-gate[hidden]{display:none!important}
.mode-gate::before{content:"";position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 75% 34%,rgba(207,157,38,.14),transparent 33%),radial-gradient(circle at 18% 75%,rgba(242,74,40,.08),transparent 28%),linear-gradient(135deg,#0d1c28 0%,#07131d 52%,#091117 100%)}
.mode-gate::after{content:"";position:fixed;inset:0;z-index:-1;opacity:.2;background-image:linear-gradient(115deg,transparent 0 48%,rgba(255,255,255,.035) 48.2% 48.5%,transparent 48.7%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:440px 100%,100% 72px}
.mode-gate-atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.mode-gate-atmosphere i{position:absolute;width:1px;height:78vh;top:-18vh;background:linear-gradient(transparent,rgba(226,178,56,.16),transparent);transform:rotate(24deg)}
.mode-gate-atmosphere i:nth-child(1){left:64%}.mode-gate-atmosphere i:nth-child(2){left:73%}.mode-gate-atmosphere i:nth-child(3){left:82%}
.mode-gate-brand{height:86px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;padding:max(18px,env(safe-area-inset-top)) max(34px,env(safe-area-inset-right)) 16px max(34px,env(safe-area-inset-left));border-bottom:1px solid rgba(255,255,255,.09)}
.mode-gate-wordmark{font-weight:900;font-size:27px;letter-spacing:-1.3px}.mode-gate-wordmark em{font-style:normal;color:#f24a28}.mode-gate-brand-actions{display:flex;align-items:center;gap:14px}.mode-gate-brand p{margin:0;color:#8d9ba5;font:800 9px/1.2 monospace;letter-spacing:2.4px}.mode-settings-button{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:10px;background:rgba(20,35,44,.82);color:#dbe2e4;cursor:pointer}.mode-settings-button:hover,.mode-settings-button:focus-visible{border-color:#d6a21f;color:#f4d879}.mode-settings-button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.mode-gate-main{width:min(1180px,calc(100% - 52px));margin:auto;padding:46px 0 max(42px,env(safe-area-inset-bottom));box-sizing:border-box}
.mode-gate-heading{text-align:center;margin-bottom:32px}.mode-gate-heading>span{color:#d6a21f;font:800 10px/1 monospace;letter-spacing:3px}.mode-gate-heading h1{margin:10px 0 8px;font-size:clamp(29px,3.2vw,48px);line-height:1.05;letter-spacing:-1.8px}.mode-gate-heading p{margin:0;color:#98a5ad;font-size:14px}
.mode-gate-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.mode-card{position:relative;min-height:400px;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;padding:32px;border:1px solid rgba(255,255,255,.12);border-radius:14px;color:#f4f6f7;text-align:left;background:linear-gradient(145deg,rgba(26,42,54,.94),rgba(12,25,35,.98));cursor:pointer;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}
.mode-card:hover,.mode-card:focus-visible{transform:translateY(-4px);border-color:rgba(242,74,40,.7);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.mode-card::after{content:"";position:absolute;inset:auto -12% -42% 32%;height:78%;border:1px solid rgba(255,255,255,.07);border-radius:50%;transform:rotate(-12deg)}
.mode-card-index{color:#71818c;font:700 10px/1 monospace;letter-spacing:2px}
.mode-card-art{position:absolute;top:38px;right:38px;width:116px;height:116px;color:#f24a28}.mode-card-art svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:3}
.mode-card-copy{display:flex;flex-direction:column;margin-top:auto;max-width:390px}.mode-card-copy small{color:#f24a28;font:800 10px/1 monospace;letter-spacing:2.2px}.mode-card-copy strong{position:relative;width:max-content;max-width:100%;margin-top:10px;padding-bottom:10px;font-size:33px;line-height:1;letter-spacing:-1px;white-space:nowrap}.mode-card-copy strong em{font-style:normal}.mode-title-life{font-style:italic;letter-spacing:-1.15px!important}.mode-title-life span{font-style:normal}.mode-title-life em{color:#f24a28;text-shadow:0 0 22px rgba(242,74,40,.14)}.mode-title-life::after,.mode-title-arena::after{content:"";position:absolute;left:0;bottom:0;height:2px;border-radius:999px}.mode-title-life::after{width:58%;background:linear-gradient(90deg,#f24a28,rgba(242,74,40,.18))}.mode-title-arena{letter-spacing:.45px!important}.mode-title-arena em{color:#d6a21f;background:linear-gradient(105deg,#806000 2%,#FFE697 28%,#CF9D26 54%,#F4D879 76%,#D39B31 98%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 0 24px rgba(214,162,31,.16)}.mode-title-arena::after{width:74%;height:1px;background:linear-gradient(90deg,rgba(214,162,31,.22),#d6a21f 32%,rgba(255,230,151,.72) 68%,transparent)}.mode-title-arena::before{content:"";position:absolute;z-index:2;top:-3px;bottom:8px;left:-16%;width:18%;transform:skewX(-18deg);background:linear-gradient(90deg,transparent,rgba(246,241,229,.34),transparent);animation:modeArenaTitleSweep 1.15s .35s ease-out 1 both;pointer-events:none}.mode-title-crown{position:absolute;top:-10px;right:-27px;width:22px;height:18px;display:grid;place-items:center;border:1px solid rgba(214,162,31,.42);border-radius:6px;background:rgba(10,17,24,.88);box-shadow:0 4px 14px rgba(0,0,0,.25),inset 0 1px rgba(255,230,151,.12);color:#E3B83F;transform:rotate(4deg)}.mode-title-crown svg{width:14px;height:11px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}.mode-card-copy>span{margin-top:14px;max-width:340px;color:#aab4ba;font-size:13px;line-height:1.55}
.mode-card-meta{width:100%;display:flex;justify-content:space-between;gap:16px;margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.11);font:800 9px/1 monospace;letter-spacing:1.3px}.mode-card-meta b{color:#84939c}.mode-card-meta i{font-style:normal;color:#f6f1e5}
.mode-card-arena{border-color:rgba(214,162,31,.46);background:radial-gradient(circle at 80% 22%,rgba(214,162,31,.18),transparent 28%),linear-gradient(145deg,#111d24,#070d12 78%);box-shadow:inset 0 1px rgba(255,230,151,.12),0 18px 55px rgba(0,0,0,.2)}
.mode-card-arena:hover,.mode-card-arena:focus-visible{border-color:#d6a21f;box-shadow:0 28px 75px rgba(0,0,0,.42),0 0 34px rgba(214,162,31,.11)}
.mode-card-arena .mode-card-copy small,.mode-card-arena .mode-card-meta i{color:#e3b83f}.mode-card-crown{color:#d6a21f;filter:drop-shadow(0 0 18px rgba(214,162,31,.25))}.mode-card-crown i{position:absolute;inset:20%;border-radius:50%;box-shadow:0 0 55px 18px rgba(214,162,31,.16)}
.mode-card-live{position:absolute;top:29px;right:32px;display:flex;align-items:center;gap:7px;color:#d9c88f;font:800 8px/1 monospace;letter-spacing:1.4px}.mode-card-live i{width:6px;height:6px;border-radius:50%;background:#53c07a;box-shadow:0 0 10px #53c07a;animation:modeLive 1.8s infinite}
.mode-card-arena .mode-card-art{top:64px}
.mode-gate-note{display:flex;align-items:center;justify-content:center;gap:8px;margin:24px 0 0;color:#74838c;font:600 10px/1.4 monospace;letter-spacing:.5px}.mode-gate-note b{font:inherit}.mode-gate-note span{width:5px;height:5px;border-radius:50%;background:#4e9b65}
.top{position:relative}.life-mode-back{position:absolute;left:0;top:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:72px;height:44px;padding:0 12px;border:1px solid var(--border-default);border-radius:var(--radius-sm);background:var(--surface-elevated);color:var(--color-ink);font:800 9px/1 var(--mono);letter-spacing:.7px;cursor:pointer;box-shadow:var(--shadow-sm)}
.life-mode-back[hidden]{display:none!important}.life-mode-back:hover,.life-mode-back:focus-visible{border-color:var(--color-primary);color:var(--color-primary)}
@keyframes modeLive{50%{opacity:.35}}
@keyframes modeArenaTitleSweep{0%{left:-18%;opacity:0}18%{opacity:.75}100%{left:108%;opacity:0}}
@media(max-width:720px){
  .mode-gate{grid-template-rows:auto 1fr}.mode-gate-brand{height:66px;padding:max(12px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) 10px max(18px,env(safe-area-inset-left))}.mode-gate-wordmark{font-size:22px}.mode-gate-brand p{display:none}.mode-settings-button{width:38px;height:38px}
  .mode-gate-main{width:min(100% - 28px,520px);padding:24px 0 max(24px,env(safe-area-inset-bottom))}.mode-gate-heading{margin-bottom:20px;text-align:left}.mode-gate-heading h1{font-size:28px;margin-top:8px}.mode-gate-heading p{font-size:12px;line-height:1.45}
  .mode-gate-grid{grid-template-columns:1fr;gap:12px}.mode-card{min-height:196px;padding:20px;border-radius:11px}.mode-card-index{font-size:8px}.mode-card-art{top:20px;right:20px;width:72px;height:72px}.mode-card-arena .mode-card-art{top:43px}.mode-card-live{top:18px;right:19px}.mode-card-copy{max-width:calc(100% - 68px)}.mode-card-copy small{font-size:8px}.mode-card-copy strong{font-size:25px;margin-top:7px;padding-bottom:8px}.mode-title-crown{top:-8px;right:-24px;width:19px;height:16px}.mode-title-crown svg{width:12px;height:10px}.mode-card-copy>span{font-size:11px;line-height:1.4;margin-top:8px}.mode-card-meta{margin-top:16px;padding-top:13px;font-size:7.5px}.mode-gate-note{font-size:8px;margin-top:17px;text-align:center}
  .life-mode-back{width:44px;min-width:44px;padding:0;font-size:18px;letter-spacing:0}.life-mode-back span{display:none}
}
@media(max-height:720px) and (min-width:721px){.mode-gate-main{padding:24px 0}.mode-gate-heading{margin-bottom:18px}.mode-card{min-height:310px}}
@media(prefers-reduced-motion:reduce){.mode-card,.mode-card-live i,.mode-title-arena::before{transition:none;animation:none}.mode-title-arena::before{display:none}}