:root { --cmd-ink:#070509; --cmd-paper:#f6f1f5; --cmd-muted:#97909b; --cmd-line:rgba(255,255,255,.14); --cmd-pink:#ff2b96; --cmd-cyan:#6ce7e6; --cmd-violet:#9b70ff; --cmd-gold:#ffcf4a; }
* { box-sizing:border-box; }
body.commands-page { min-height:100vh; margin:0; overflow-x:hidden; background:var(--cmd-ink); color:var(--cmd-paper); font-family:'Space Grotesk',Arial,sans-serif; }
body.commands-page::before { position:fixed; inset:0; z-index:-2; background:radial-gradient(circle at 78% 12%,rgba(255,43,150,.13),transparent 25%),radial-gradient(circle at 10% 52%,rgba(108,231,230,.08),transparent 24%),linear-gradient(115deg,#070509 0%,#0c0712 55%,#110719 100%); content:''; }
.commands-noise { position:fixed; inset:0; z-index:-1; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size:52px 52px; mask-image:linear-gradient(to bottom,black,transparent 76%); pointer-events:none; }
.commands-header { position:fixed; inset:auto 0 20px; z-index:20; pointer-events:none; }.commands-nav { pointer-events:auto; }
.commands-nav .dock-item.active { color:#fff !important; }.commands-nav .dock-item.active .dock-icon { border-color:var(--cmd-pink); box-shadow:0 0 0 3px rgba(255,43,150,.12),0 0 22px rgba(255,43,150,.55),inset 0 1px 2px rgba(255,255,255,.45); }
.commands-shell { width:min(1260px,calc(100% - 9vw)); margin:0 auto; padding:116px 0 170px; }
.commands-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 330px; align-items:center; min-height:500px; gap:30px; }.commands-hero-copy { position:relative; z-index:1; }.commands-kicker,.command-eyebrow { color:var(--cmd-pink); font:500 11px 'DM Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }.commands-kicker { display:flex; align-items:center; gap:9px; margin:0 0 20px; }.commands-kicker span { width:7px; height:7px; border-radius:50%; background:var(--cmd-pink); box-shadow:0 0 14px var(--cmd-pink); }
.commands-hero h1 { max-width:850px; margin:0; font-size:clamp(64px,10.2vw,146px); line-height:.83; letter-spacing:-.095em; }.commands-hero h1 em { color:var(--cmd-pink); font-style:normal; text-shadow:0 0 28px rgba(255,43,150,.3); }.commands-lede { max-width:535px; margin:30px 0 0; color:var(--cmd-muted); font-size:17px; line-height:1.55; }.commands-meta { display:flex; flex-wrap:wrap; gap:18px; margin-top:34px; color:#c8bec9; font:10px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }.commands-meta span + span { color:#6e6873; }
.commands-signal { position:relative; height:330px; display:grid; place-items:center; }.signal-ring { position:absolute; border:1px solid rgba(255,43,150,.48); border-radius:50%; transform:rotate(-16deg); }.signal-ring-one { width:315px; height:185px; box-shadow:0 0 35px rgba(255,43,150,.14); animation:cmd-spin 18s linear infinite; }.signal-ring-two { width:245px; height:280px; border-color:rgba(108,231,230,.28); animation:cmd-spin 14s linear infinite reverse; }.signal-core { display:grid; position:relative; z-index:1; width:128px; height:128px; place-items:center; border:1px solid rgba(255,255,255,.24); border-radius:50%; background:rgba(9,5,12,.82); box-shadow:0 0 50px rgba(255,43,150,.18); text-align:center; }.signal-core span,.signal-core small { color:var(--cmd-muted); font:9px 'DM Mono',monospace; letter-spacing:.18em; }.signal-core strong { color:var(--cmd-pink); font-size:46px; line-height:.6; }.signal-core small { font-size:8px; }
.command-tools { position:sticky; top:18px; z-index:8; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:11px 0; border-top:1px solid var(--cmd-line); border-bottom:1px solid var(--cmd-line); background:rgba(7,5,9,.82); backdrop-filter:blur(18px); }.command-search { display:flex; align-items:center; gap:12px; flex:1; max-width:445px; color:var(--cmd-muted); }.command-search input { min-width:0; width:100%; border:0; outline:0; background:transparent; color:var(--cmd-paper); font:14px 'DM Mono',monospace; }.command-search input::placeholder { color:#6d6671; }.command-search kbd { padding:3px 7px; border:1px solid var(--cmd-line); color:#8e8791; font:11px 'DM Mono',monospace; }.command-filters { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }.filter-button { padding:8px 10px; border:1px solid transparent; background:transparent; color:#8e8791; cursor:pointer; font:10px 'DM Mono',monospace; text-transform:uppercase; transition:color .2s,border-color .2s,background .2s; }.filter-button:hover,.filter-button.active { border-color:rgba(255,43,150,.55); background:rgba(255,43,150,.08); color:#fff; }
.command-groups { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; margin-top:70px; border-top:1px solid var(--cmd-line); }.command-group { min-width:0; padding:38px 30px 38px 0; border-bottom:1px solid var(--cmd-line); }.command-group:nth-child(even) { padding-left:30px; border-left:1px solid var(--cmd-line); }.command-group-heading { min-height:155px; }.command-eyebrow { margin:0 0 13px; color:#8b7d90; }.command-group h2 { margin:0; font-size:clamp(34px,4vw,58px); line-height:.92; letter-spacing:-.075em; }.command-group > .command-group-heading > p:last-child { max-width:340px; margin:17px 0 0; color:var(--cmd-muted); font-size:13px; line-height:1.45; }.tone-pink .command-eyebrow { color:var(--cmd-pink); }.tone-cyan .command-eyebrow { color:var(--cmd-cyan); }.tone-violet .command-eyebrow { color:var(--cmd-violet); }.tone-gold .command-eyebrow { color:var(--cmd-gold); }.tone-blue .command-eyebrow { color:#5c9fff; }.tone-orange .command-eyebrow { color:#ff986d; }.tone-white .command-eyebrow { color:#fff; }
.command-list { border-top:1px solid var(--cmd-line); }.command-row { display:grid; grid-template-columns:152px 1fr 16px; align-items:center; gap:16px; min-height:48px; border-bottom:1px solid rgba(255,255,255,.08); transition:padding .2s,background .2s; }.command-row:hover { padding:0 10px; background:rgba(255,255,255,.045); }.command-row code { color:#fff; font:500 12px 'DM Mono',monospace; }.command-row span { color:var(--cmd-muted); font-size:12px; }.command-row i { color:#625966; font-size:10px; }.command-row:hover code,.command-row:hover i { color:var(--cmd-pink); }.commands-empty { grid-column:1/-1; padding:70px 0; color:var(--cmd-muted); font:12px 'DM Mono',monospace; text-align:center; }
.commands-cta { display:flex; flex-direction:column; align-items:center; margin:150px 0 80px; padding:90px 30px; border:1px solid rgba(255,43,150,.45); background:radial-gradient(circle at 50% 0,rgba(255,43,150,.14),transparent 52%),rgba(18,8,18,.58); text-align:center; }.commands-cta .commands-kicker { margin-bottom:16px; }.commands-cta h2 { margin:0; font-size:clamp(44px,6vw,84px); line-height:.88; letter-spacing:-.085em; }.commands-cta h2 em { color:var(--cmd-pink); font-style:normal; }.commands-button { display:inline-flex; align-items:center; gap:14px; margin-top:32px; padding:14px 18px; background:var(--cmd-pink); color:#13050d; font:600 12px 'DM Mono',monospace; transition:transform .2s,box-shadow .2s; }.commands-button:hover { transform:translateY(-3px); box-shadow:0 12px 30px rgba(255,43,150,.28); }.commands-footer { display:flex; justify-content:space-between; width:min(1260px,calc(100% - 9vw)); margin:0 auto; padding:0 0 110px; color:#756d78; font:10px 'DM Mono',monospace; letter-spacing:.1em; }
@keyframes cmd-spin { to { transform:rotate(344deg); } }
@media (max-width:900px) { .commands-shell { width:min(100% - 32px,680px); padding-top:80px; }.commands-hero { display:block; min-height:0; padding:55px 0 35px; }.commands-signal { position:absolute; top:70px; right:-70px; opacity:.45; transform:scale(.75); }.command-tools { display:block; }.command-search { max-width:none; padding-bottom:12px; }.command-filters { justify-content:flex-start; overflow:auto; flex-wrap:nowrap; padding-bottom:2px; }.command-groups { grid-template-columns:1fr; margin-top:45px; }.command-group,.command-group:nth-child(even) { padding:32px 0; border-left:0; }.command-group-heading { min-height:0; margin-bottom:28px; }.commands-footer { width:calc(100% - 32px); flex-direction:column; gap:8px; padding-bottom:105px; } }
@media (max-width:520px) { .commands-hero h1 { font-size:58px; }.commands-lede { font-size:15px; }.commands-meta { flex-direction:column; gap:8px; }.commands-signal { right:-115px; }.command-row { grid-template-columns:118px 1fr 12px; gap:9px; }.command-row span { font-size:11px; }.commands-cta { margin-top:85px; padding:65px 18px; }.commands-cta h2 { font-size:47px; } }

/* Homepage-aligned editorial pass: the command index is a brand surface, not an admin panel. */
.commands-page { --cmd-line:rgba(255,255,255,.11); }
.commands-shell { width:min(1360px,calc(100% - 10vw)); padding-top:92px; }
.commands-hero { grid-template-columns:minmax(0,1.05fr) minmax(330px,.95fr); min-height:570px; gap:8vw; }
.commands-hero h1 { max-width:760px; font-size:clamp(70px,9.5vw,142px); line-height:.8; }
.commands-hero h1 em { display:inline-block; padding-left:9vw; }
.commands-lede { max-width:470px; margin-top:38px; color:#a19aa5; font-size:15px; }
.commands-meta { margin-top:28px; }
.commands-meta span:first-child { color:#fff; }
.command-hero-art { position:relative; isolation:isolate; min-height:340px; padding:24px 27px; border:1px solid rgba(255,43,150,.72); background:linear-gradient(145deg,rgba(255,43,150,.13),rgba(16,7,19,.78) 45%,rgba(7,5,9,.95)); box-shadow:0 0 70px rgba(255,43,150,.1); transform:rotate(3deg); }
.command-hero-art::before { position:absolute; inset:14px; z-index:-1; border:1px solid rgba(255,255,255,.12); content:''; transform:rotate(-6deg); }
.command-hero-art::after { position:absolute; right:-33px; bottom:20px; width:180px; height:180px; z-index:-1; border:1px solid rgba(255,43,150,.35); border-radius:50%; content:''; box-shadow:0 0 45px rgba(255,43,150,.16); }
.command-art-top,.command-art-footer { display:flex; justify-content:space-between; color:#9c8e9e; font:10px 'DM Mono',monospace; letter-spacing:.12em; text-transform:uppercase; }
.command-art-title { display:flex; flex-direction:column; margin:80px 0 42px; }.command-art-title span { color:#b39eaf; font:12px 'DM Mono',monospace; letter-spacing:.12em; text-transform:uppercase; }.command-art-title strong { margin-top:7px; color:#fff; font:600 clamp(56px,7vw,100px) 'Space Grotesk',sans-serif; letter-spacing:-.09em; line-height:.8; }.command-art-line { display:grid; grid-template-columns:10px 1fr auto; align-items:center; gap:12px; min-height:45px; border-top:1px solid rgba(255,255,255,.16); color:#fff; font:12px 'DM Mono',monospace; }.command-art-line i { width:7px; height:7px; border-radius:50%; background:var(--cmd-pink); box-shadow:0 0 12px var(--cmd-pink); }.command-art-line b { color:var(--cmd-pink); font-size:16px; font-weight:400; }.command-art-line.muted { color:#8c7d8e; }.command-art-line.muted i { background:#594e5c; box-shadow:none; }.command-art-footer { position:absolute; right:27px; bottom:24px; left:27px; }
.command-tools { position:relative; top:auto; margin-top:30px; padding:14px 0; background:transparent; backdrop-filter:none; }.command-filters { flex-wrap:nowrap; overflow-x:auto; justify-content:flex-end; }.filter-button { border-bottom:1px solid transparent; border-radius:0; }.filter-button:hover,.filter-button.active { border-color:var(--cmd-pink); background:transparent; }
.command-groups { display:block; margin-top:78px; border-top:1px solid var(--cmd-line); }.command-group,.command-group:nth-child(even) { display:grid; grid-template-columns:minmax(210px,.7fr) minmax(0,1.4fr); gap:7vw; padding:58px 0 68px; border-left:0; }.command-group:nth-child(even) { background:linear-gradient(90deg,rgba(255,43,150,.025),transparent 55%); }.command-group-heading { min-height:0; }.command-group h2 { font-size:clamp(50px,6vw,90px); line-height:.82; }.command-group > .command-group-heading > p:last-child { max-width:260px; margin-top:24px; font-size:13px; }.command-list { align-self:start; border-top:0; }.command-row { grid-template-columns:180px 1fr 16px; min-height:58px; }.command-row:hover { padding:0 14px; background:rgba(255,43,150,.06); }.command-row code { color:#fff; font-size:13px; }.command-row span { color:#9e96a1; font-size:13px; }.command-row i { opacity:.5; }.commands-cta { margin:150px 0 80px; border-width:1px 0; border-color:rgba(255,43,150,.55); background:transparent; }
@media (max-width:900px) { .commands-shell { width:min(100% - 32px,680px); padding-top:80px; }.commands-hero { display:block; min-height:0; padding:55px 0 35px; }.commands-hero h1 em { padding-left:0; }.command-hero-art { max-width:500px; margin:70px auto 35px; }.command-tools { display:block; }.command-search { max-width:none; padding-bottom:12px; }.command-filters { justify-content:flex-start; }.command-group,.command-group:nth-child(even) { display:block; padding:45px 0; }.command-group-heading { margin-bottom:30px; }.command-group > .command-group-heading > p:last-child { max-width:360px; }.command-row { grid-template-columns:150px 1fr 12px; } }
@media (max-width:520px) { .commands-hero h1 { font-size:58px; }.command-hero-art { min-height:300px; padding:20px; transform:rotate(1deg); }.command-art-title { margin:62px 0 28px; }.command-art-title strong { font-size:66px; }.command-art-footer { right:20px; bottom:20px; left:20px; }.command-row { grid-template-columns:118px 1fr 12px; gap:9px; }.command-row span { font-size:11px; } }
@media (prefers-reduced-motion:reduce) { .command-hero-art,.command-hero-art::before { transform:none; }.commands-button,.command-row { transition:none; } }

/* Artwork pass: bring the homepage's player imagery, pink edge light, and layered composition into this page. */
.commands-page { background:#050506; }
.commands-page::before { background:linear-gradient(90deg,rgba(5,5,6,.84),rgba(5,5,6,.22) 55%,rgba(5,5,6,.78)),url('/static/playerbg.png') center/cover fixed; opacity:.2; }
.commands-noise { opacity:.08; }
.command-hero-art { overflow:hidden; background:#0b080d; box-shadow:0 28px 90px rgba(0,0,0,.55),0 0 38px rgba(255,43,150,.18); }
.command-art-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.48; mix-blend-mode:screen; filter:saturate(1.15) contrast(1.08); }
.command-art-shade { position:absolute; inset:0; background:linear-gradient(145deg,rgba(255,43,150,.24),rgba(8,5,10,.15) 38%,rgba(8,5,10,.88)); }
.command-art-top,.command-art-title,.command-art-line,.command-art-footer { position:relative; z-index:1; }
.command-art-title strong { text-shadow:0 4px 24px rgba(0,0,0,.65); }
.command-art-panel { position:relative; isolation:isolate; overflow:hidden; min-height:420px; margin:0; border:1px solid rgba(255,43,150,.58); background:#100911; box-shadow:0 25px 75px rgba(0,0,0,.38); }
.command-art-panel-wide { transform:rotate(-2deg); }.command-art-panel-tall { min-height:350px; transform:rotate(2deg) translateY(45px); }
.command-art-panel::before { position:absolute; inset:0; z-index:1; background:linear-gradient(145deg,rgba(12,5,15,.08),rgba(9,5,12,.8)),radial-gradient(circle at 50% 50%,transparent 20%,rgba(6,4,9,.48) 85%); content:''; pointer-events:none; }
.command-art-panel::after { position:absolute; right:-75px; bottom:-80px; width:260px; height:260px; z-index:2; border:1px solid rgba(255,43,150,.3); border-radius:50%; box-shadow:0 0 0 32px rgba(255,43,150,.035),0 0 0 70px rgba(255,43,150,.025); content:''; pointer-events:none; }
.command-art-panel img { width:100%; height:100%; min-height:inherit; object-fit:cover; opacity:.72; filter:saturate(1.08) contrast(1.06); transition:transform .8s cubic-bezier(.2,.8,.2,1),filter .5s,opacity .5s; }
.command-art-panel:hover img { transform:scale(1.07) rotate(1deg); filter:saturate(1.25) contrast(1.1); opacity:.9; }
.command-art-panel figcaption { position:absolute; right:32px; bottom:28px; left:32px; z-index:3; display:flex; flex-direction:column; align-items:flex-start; }.command-art-panel figcaption span,.command-art-panel figcaption small { color:#ff9bd0; font:700 10px 'DM Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }.command-art-panel figcaption strong { margin:12px 0 18px; color:#fff; font-size:clamp(48px,6.4vw,94px); line-height:.8; letter-spacing:-.09em; text-shadow:0 6px 24px rgba(0,0,0,.6); }.command-art-panel figcaption em { color:var(--cmd-pink); font-style:normal; }.command-art-panel figcaption small { color:#e4cad9; font-size:9px; }
.command-art-strip { display:grid; grid-template-columns:1.18fr .82fr; gap:34px; align-items:start; margin:72px 0 150px; padding:0 7vw; }.command-art-panel-tall figcaption strong { font-size:clamp(42px,5vw,76px); }
.shader-background-canvas { opacity:.34 !important; }
@media (max-width:900px) { .command-art-strip { grid-template-columns:1fr; gap:28px; margin:55px 0 90px; padding:0; }.command-art-panel-wide,.command-art-panel-tall { min-height:380px; transform:none; }.command-art-panel-tall { min-height:340px; }.command-art-panel figcaption { right:24px; bottom:24px; left:24px; } }
@media (max-width:520px) { .command-art-strip { margin-bottom:72px; }.command-art-panel-wide,.command-art-panel-tall { min-height:310px; }.command-art-panel figcaption strong { font-size:52px; }.command-art-panel-tall figcaption strong { font-size:48px; } }
@media (prefers-reduced-motion:reduce) { .command-art-panel img { transition:none; }.command-art-panel:hover img { transform:none; } }

/* Keep the dock clear of the footer instead of letting it sit on top of the last content. */
.commands-header { bottom:22px; transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .28s ease; }
.commands-header .nav-shell { overflow:visible; }
.commands-header .dock-item,
.commands-header .dock-item:hover,
.commands-header .dock-item.active { transform:none; }
.commands-header .dock-item:hover { transform:translateY(-6px) scale(1.08); z-index:3; }
.commands-header .dock-item.active { transform:translateY(-4px); }
.commands-header .dock-item:hover + .dock-item,
.commands-header .dock-item:has(+ .dock-item:hover),
.commands-header .dock-item:hover + .dock-item + .dock-item,
.commands-header .dock-item:has(+ .dock-item + .dock-item:hover) { transform:none; }
.commands-header { position:fixed !important; z-index:2147480000 !important; isolation:isolate; }
.commands-header .commands-nav { position:relative; z-index:1; isolation:isolate; }
.commands-header .dock-links { position:relative; z-index:2; }
.commands-header .dock-item:active { transform:translateY(-2px) scale(.98); }
.commands-header.is-footer-near { opacity:0; transform:translateY(calc(100% + 34px)); pointer-events:none; }
.commands-footer { position:relative; z-index:1; width:min(1360px,calc(100% - 10vw)); margin:0 auto; padding:26px 0 175px; border-top:1px solid rgba(255,255,255,.1); }
@media (max-width:900px) { .commands-footer { width:calc(100% - 32px); padding-bottom:150px; } }
@media (prefers-reduced-motion:reduce) { .commands-header { transition:none; } }

/* Keep the active command button centered inside the dock like the homepage reference. */
.commands-header .nav-shell { overflow:visible !important; }
.commands-header .nav-shell { min-height:64px !important; padding-top:9px !important; padding-bottom:9px !important; }
.commands-header .dock-links { align-items:center !important; }
.commands-header .dock-item { width:46px !important; height:46px !important; flex:0 0 46px !important; transform:none !important; }
.commands-header .dock-item.active { transform:none !important; }
.commands-header .dock-item:hover { transform:translateY(-4px) scale(1.04) !important; }
.commands-header .dock-item:active { transform:scale(.97) !important; }
@media (max-width:700px) { .commands-header .nav-shell { min-height:56px !important; padding-top:8px !important; padding-bottom:8px !important; }.commands-header .dock-item { width:40px !important; height:40px !important; flex-basis:40px !important; } }
.commands-header .dock-icon { border:0 !important; box-shadow:none !important; background:transparent !important; }