:root {
  color-scheme: dark;
  --ink: #08090b;
  --rail: #050607;
  --side: #101216;
  --canvas: #14161a;
  --surface: #191c21;
  --line: #2a2e35;
  --line-soft: #22252b;
  --text: #f5f7fa;
  --muted: #949ba7;
  --faint: #686f7b;
  --green: #63f58a;
  --green-dim: #1f7b3b;
  --blurple: #5865f2;
  --red: #ff5d64;
  --amber: #f1b84b;
  --shadow: 0 24px 70px rgba(0, 0, 0, .32);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--ink); scroll-behavior: smooth; }
body { margin: 0; background: var(--canvas); color: var(--text); font-family: "Segoe UI Variable Text", "SF Pro Text", "Segoe UI", sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
[hidden] { display: none !important; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 270px minmax(0, 1fr); }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 35; width: 270px; display: flex; flex-direction: column; background: var(--side); border-right: 1px solid var(--line-soft); }
.sidebar-brand { height: 73px; padding: 0 18px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--line-soft); color: white; text-decoration: none; }
.brand-sigil { width: 37px; height: 37px; display: grid; place-items: center; border: 1px solid #50565f; background: #f3f5f7; color: #0a0b0d; font: 850 14px "Segoe UI Variable Display", sans-serif; letter-spacing: -.06em; clip-path: polygon(0 0, 82% 0, 100% 18%, 100% 100%, 18% 100%, 0 82%); }
.sidebar-brand > span:last-child { display: flex; flex-direction: column; }
.sidebar-brand strong { font: 720 18px/1 "Segoe UI Variable Display", sans-serif; letter-spacing: -.03em; }
.sidebar-brand small { margin-top: 5px; color: var(--green); font-size: 7px; font-weight: 800; letter-spacing: .18em; }
.guild-switcher { height: 72px; margin: 12px; padding: 0 13px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid var(--line); background: #15181c; text-align: left; cursor: pointer; clip-path: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%); }
.guild-switcher > span { min-width: 0; }
.guild-switcher strong, .guild-switcher small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.guild-switcher strong { margin-top: 5px; font-size: 13px; letter-spacing: -.01em; }
.guild-switcher small { color: var(--faint); font-size: 8px; font-weight: 750; letter-spacing: .12em; }
.guild-switcher svg { width: 17px; color: var(--muted); }
.guild-switcher:hover { border-color: #3c424b; background: #191c21; }
.nav { padding: 5px 12px 16px; overflow-y: auto; scrollbar-width: none; }
.nav::-webkit-scrollbar { display: none; }
.nav-group + .nav-group { margin-top: 23px; }
.nav-label { margin: 0 10px 7px; color: #6f7681; font-size: 10px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.nav-link { position: relative; min-height: 40px; margin: 1px 0; padding: 0 10px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid transparent; color: #979ea9; font-size: 12px; font-weight: 580; text-decoration: none; transition: border .15s, color .15s, padding .15s; }
.nav-link svg { width: 18px; height: 18px; color: #7c838e; }
.nav-link:hover { padding-left: 14px; color: #e7e9ed; }
.nav-link.active { border-bottom-color: #3a3f46; color: white; }
.nav-link.active::before { content: ""; position: absolute; right: 0; width: 24px; height: 1px; background: var(--green); box-shadow: 0 0 9px rgba(99,245,138,.35); }
.nav-link.active svg { color: var(--green); }
.nav-link span { flex: 1; }
.nav-badge { min-width: 21px; height: 17px; padding: 0 5px; display: grid; place-items: center; border-radius: 4px; background: rgba(99, 245, 138, .12); color: var(--green); font-size: 9px; }
.nav-status { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(99, 245, 138, .5); }
.sidebar-bottom { margin-top: auto; border-top: 1px solid var(--line-soft); }
.plan-meter { padding: 13px 13px 7px; display: flex; align-items: center; justify-content: space-between; }
.plan-meter span b, .plan-meter span small { display: block; }
.plan-meter b { font-size: 11px; }
.plan-meter small { margin-top: 3px; color: var(--faint); font-size: 9px; }
.plan-meter > strong { color: var(--muted); font-size: 10px; }
.meter { height: 2px; margin: 0 13px 13px; background: #272a30; }
.meter i { width: 63%; height: 100%; display: block; background: var(--green); }
.user-dock { min-height: 57px; padding: 9px 10px; display: flex; align-items: center; gap: 9px; background: #0c0e11; }
.profile-button { width: 34px; height: 34px; flex: 0 0 auto; border: 0; border-radius: 50%; background: var(--blurple); color: white; font-size: 10px; font-weight: 800; cursor: pointer; }
.user-dock > span { min-width: 0; flex: 1; }
.user-dock strong, .user-dock small { display: block; }
.user-dock strong { font-size: 11px; }
.user-dock small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.user-dock small i { width: 5px; height: 5px; display: inline-block; margin-right: 4px; border-radius: 50%; background: var(--green); }
.dock-more { border: 0; background: transparent; color: var(--faint); cursor: pointer; letter-spacing: .12em; }

.main { grid-column: 2; min-width: 0; min-height: 100vh; background: var(--canvas); }
.topbar { position: sticky; top: 0; z-index: 30; height: 65px; padding: 0 28px; display: flex; align-items: center; gap: 18px; border-bottom: 1px solid var(--line-soft); background: rgba(20, 22, 26, .9); backdrop-filter: blur(18px); }
.mobile-menu { display: none; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: transparent; }
.mobile-menu svg { width: 18px; }
.breadcrumb { display: flex; align-items: center; gap: 9px; color: var(--faint); font-size: 12px; }
.breadcrumb strong { color: #d8dbe1; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 9px; }
.command-search { width: 226px; height: 34px; padding: 0 8px 0 11px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 7px; background: #101216; color: var(--muted); cursor: pointer; }
.command-search svg { width: 15px; }
.command-search span { flex: 1; text-align: left; font-size: 11px; }
kbd { padding: 3px 5px; border: 1px solid #353941; border-radius: 4px; background: #1b1e23; color: #7c838e; font: 9px inherit; }
.status-pill { height: 34px; padding: 0 11px; display: flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 7px; color: #b7bdc6; font-size: 10px; font-weight: 650; }
.status-pill i, .live-label i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 9px rgba(99,245,138,.7); }
.icon-button { position: relative; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer; }
.icon-button svg { width: 16px; }
.icon-button i { position: absolute; top: 7px; right: 7px; width: 4px; height: 4px; border-radius: 50%; background: var(--red); }

.view { display: none; max-width: 1440px; margin: 0 auto; padding: 58px clamp(28px, 4vw, 68px) 90px; }
.view.active { display: block; animation: view-in .28s ease both; }
@keyframes view-in { from { opacity: 0; transform: translateY(6px); } }
.page-lead { margin-bottom: 48px; display: flex; align-items: end; justify-content: space-between; gap: 48px; }
.page-lead h1 { margin: 12px 0 0; font: 680 clamp(43px, 5.1vw, 76px)/.96 "Segoe UI Variable Display", "SF Pro Display", "Segoe UI", sans-serif; letter-spacing: -.055em; }
.page-lead h1 span { color: #707680; }
.page-lead .lead-copy { max-width: 400px; margin: 0 0 5px; color: var(--muted); font-size: 15px; line-height: 1.65; }
.compact-lead { align-items: center; }
.compact-lead h1 { font-size: clamp(42px, 4.5vw, 68px); }
.lead-actions { display: flex; align-items: center; gap: 18px; }
.section-code { margin: 0; color: var(--green); font: 750 10px/1.2 "Segoe UI", sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.section-heading { min-height: 74px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.section-heading h2 { margin: 7px 0 0; font: 650 20px/1.2 "Segoe UI Variable Display", sans-serif; letter-spacing: -.025em; }
.section-heading p:not(.section-code) { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.primary-button, .secondary-button, .quiet-button, .line-button { border: 0; cursor: pointer; }
.primary-button { min-height: 40px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; border-radius: 7px; background: var(--text); color: #090a0c; font-size: 12px; font-weight: 750; text-decoration: none; transition: background .15s, transform .15s; }
.primary-button:hover { background: var(--green); transform: translateY(-1px); }
.secondary-button { min-height: 40px; padding: 0 16px; border: 1px solid var(--line); border-radius: 7px; background: transparent; color: var(--text); }
.quiet-button { padding: 7px 0; background: transparent; color: #aab0ba; font-size: 11px; font-weight: 650; }
.quiet-button:hover { color: var(--green); }
.line-button { padding: 0; background: transparent; color: var(--text); font-size: 11px; font-weight: 700; }
.line-button span { margin-left: 9px; color: var(--green); }
.owner-lock { padding: 5px 7px; border: 1px solid #3a3e45; border-radius: 4px; color: #858c97; font-size: 8px; font-weight: 750; letter-spacing: .1em; }

.pulse-board { border: 1px solid var(--line); background: #111318; box-shadow: var(--shadow); }
.pulse-primary { position: relative; min-height: 222px; padding: 42px; display: grid; grid-template-columns: 155px 1fr 230px; align-items: center; gap: 36px; overflow: hidden; }
.pulse-primary::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, var(--green), transparent 52%); }
.pulse-score { position: relative; display: flex; align-items: baseline; }
.pulse-score small { position: absolute; top: -7px; left: 4px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .16em; }
.pulse-score strong { font: 680 82px/.9 "Segoe UI Variable Display", sans-serif; letter-spacing: -.07em; }
.pulse-score span { color: var(--faint); font-size: 14px; }
.pulse-copy { padding-left: 35px; border-left: 1px solid var(--line); }
.live-label { display: inline-flex; align-items: center; gap: 8px; color: #bbc0c9; font-size: 9px; font-weight: 750; letter-spacing: .14em; }
.pulse-copy h2 { margin: 14px 0 7px; font: 650 29px/1.15 "Segoe UI Variable Display", sans-serif; letter-spacing: -.035em; }
.pulse-copy p { max-width: 440px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.signal-visual { height: 70px; display: flex; align-items: center; justify-content: end; gap: 8px; opacity: .85; }
.signal-visual i { width: 2px; height: 18%; display: block; background: var(--green); box-shadow: 0 0 12px rgba(99,245,138,.3); }
.signal-visual i:nth-child(2) { height: 29%; }.signal-visual i:nth-child(3) { height: 48%; }.signal-visual i:nth-child(4) { height: 92%; }.signal-visual i:nth-child(5) { height: 34%; }.signal-visual i:nth-child(6) { height: 56%; }.signal-visual i:nth-child(7) { height: 24%; }.signal-visual i:nth-child(8) { height: 42%; }.signal-visual i:nth-child(9) { height: 68%; }.signal-visual i:nth-child(10) { height: 39%; }.signal-visual i:nth-child(11) { height: 20%; }.signal-visual i:nth-child(12) { height: 12%; }
.metric-strip { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.metric-strip > div { min-height: 104px; padding: 23px 28px; border-right: 1px solid var(--line); }
.metric-strip > div:last-child { border-right: 0; }
.metric-strip small, .metric-strip strong, .metric-strip > div > span { display: block; }
.metric-strip small { color: var(--faint); font-size: 8px; font-weight: 750; letter-spacing: .13em; }
.metric-strip strong { margin-top: 9px; font: 650 25px/1 "Segoe UI Variable Display", sans-serif; letter-spacing: -.035em; }
.metric-strip strong em { margin-left: 2px; color: var(--faint); font-size: 10px; font-style: normal; }
.metric-strip > div > span { margin-top: 7px; color: var(--muted); font-size: 9px; }
.attention-line { min-height: 82px; padding: 0 25px; display: flex; align-items: center; gap: 20px; border-bottom: 1px solid var(--line); }
.attention-number { color: var(--amber); font: 650 24px "Segoe UI Variable Display", sans-serif; }
.attention-line > div { flex: 1; }
.attention-line strong, .attention-line small { display: block; }
.attention-line strong { font-size: 12px; }
.attention-line small { margin-top: 5px; color: var(--muted); font-size: 10px; }

.operations-layout { margin-top: 48px; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(310px, .65fr); gap: 56px; }
.incident-list { border-top: 1px solid var(--line); }
.incident { min-height: 84px; display: grid; grid-template-columns: 8px 1fr auto; align-items: center; gap: 17px; border-bottom: 1px solid var(--line-soft); }
.severity { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.severity.high { background: var(--red); }.severity.medium { background: var(--amber); }
.incident strong { font-size: 12px; }.incident p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }
.incident-meta { text-align: right; }.incident-meta span, .incident-meta small { display: block; }.incident-meta span { color: #c7cbd2; font-size: 10px; }.incident-meta small { margin-top: 5px; color: var(--faint); font-size: 9px; }
.control-stack { border-top: 1px solid var(--line); }
.control-action { width: 100%; min-height: 68px; padding: 0; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 12px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; text-align: left; cursor: pointer; }
.control-action:hover { background: linear-gradient(90deg, transparent, rgba(255,255,255,.025)); }
.control-index { color: var(--faint); font: 650 10px monospace; }
.control-action strong, .control-action small { display: block; }.control-action strong { font-size: 11px; }.control-action small { margin-top: 4px; color: var(--muted); font-size: 9px; }.control-action > i { color: var(--faint); font-style: normal; }
.danger-control strong, .danger-control > i { color: #ff747a; }

.systems-section { margin-top: 68px; }
.system-total { color: var(--muted); font: 10px monospace; }
.system-list { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); }
.system-list button { min-height: 150px; padding: 22px; display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto 1fr auto; gap: 10px; border: 0; border-right: 1px solid var(--line); background: #111318; text-align: left; cursor: pointer; transition: background .18s; }
.system-list button:last-child { border-right: 0; }.system-list button:hover { background: #181b20; }
.system-number { color: var(--faint); font: 10px monospace; }.system-list button > span:nth-child(2) { grid-column: 1 / -1; align-self: center; }.system-list strong, .system-list small { display: block; }.system-list strong { font: 650 17px "Segoe UI Variable Display", sans-serif; }.system-list small { margin-top: 6px; color: var(--muted); font-size: 9px; line-height: 1.45; }.system-list i { align-self: end; font-size: 8px; font-style: normal; font-weight: 800; letter-spacing: .12em; }.system-live { color: var(--green); }.system-setup { color: var(--amber); }.system-list button > b { align-self: end; justify-self: end; color: var(--faint); }

.season-banner { position: relative; min-height: 285px; margin-top: 68px; padding: 40px; display: grid; grid-template-columns: 145px 1fr 230px; align-items: center; gap: 42px; overflow: hidden; border: 1px solid #314034; background: #0c100e; }
.season-banner::before { content: ""; position: absolute; width: 520px; height: 520px; right: -260px; top: -210px; border: 1px solid rgba(99,245,138,.14); transform: rotate(37deg); box-shadow: 0 0 100px rgba(99,245,138,.08) inset; }
.season-id { height: 170px; padding-right: 35px; display: flex; align-items: center; justify-content: center; flex-direction: column; border-right: 1px solid #2b3930; }
.season-id small { color: var(--green); font-size: 8px; font-weight: 800; letter-spacing: .16em; }.season-id strong { font: 650 74px/.95 "Segoe UI Variable Display", sans-serif; letter-spacing: -.08em; }.season-id span { margin-top: 11px; color: var(--muted); font-size: 8px; letter-spacing: .12em; }
.season-main { position: relative; z-index: 1; }.season-main h2 { margin: 9px 0 9px; font: 650 31px "Segoe UI Variable Display", sans-serif; letter-spacing: -.04em; }.season-main > p:not(.section-code) { max-width: 560px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.season-progress { margin-top: 26px; }.season-progress > span, .hero-progress > span { height: 3px; display: block; background: #253028; }.season-progress > span i, .hero-progress > span i { width: 62.4%; height: 100%; display: block; background: var(--green); box-shadow: 0 0 14px rgba(99,245,138,.45); }.season-progress small { margin-top: 9px; display: block; color: var(--muted); font-size: 8px; letter-spacing: .08em; }.season-progress small b { color: white; }
.season-reward { position: relative; z-index: 1; padding-left: 30px; border-left: 1px solid #2b3930; }.season-reward > small, .season-reward > strong, .season-reward > span { display: block; }.season-reward > small { color: var(--faint); font-size: 8px; letter-spacing: .13em; }.season-reward > strong { margin-top: 9px; font-size: 17px; }.season-reward > span { margin-top: 5px; color: var(--muted); font-size: 10px; }.season-reward button { margin-top: 28px; padding: 0; border: 0; background: transparent; color: white; font-size: 11px; font-weight: 700; cursor: pointer; }.season-reward button b { margin-left: 12px; color: var(--green); }

.campaign-stage { min-height: 310px; padding: 45px; display: grid; grid-template-columns: 145px 1fr 130px; align-items: center; gap: 45px; border: 1px solid #314034; background: #0c100e; }
.campaign-level { text-align: center; }.campaign-level small, .campaign-level strong, .campaign-level span { display: block; }.campaign-level small { color: var(--faint); font-size: 8px; letter-spacing: .14em; }.campaign-level strong { font: 650 84px/.9 "Segoe UI Variable Display", sans-serif; letter-spacing: -.08em; }.campaign-level span { margin-top: 12px; color: var(--green); font-size: 10px; }
.campaign-objective { padding: 0 45px; border-left: 1px solid #2b3930; border-right: 1px solid #2b3930; }.campaign-objective h2 { max-width: 600px; margin: 10px 0; font: 650 clamp(28px, 3vw, 42px)/1.05 "Segoe UI Variable Display", sans-serif; letter-spacing: -.045em; }.campaign-objective > p:not(.section-code) { max-width: 590px; color: var(--muted); font-size: 11px; line-height: 1.65; }.hero-progress { margin-top: 26px; }.hero-progress > div { margin-top: 10px; display: flex; justify-content: space-between; color: var(--muted); font-size: 9px; }.hero-progress strong { color: white; }
.campaign-countdown { display: flex; align-items: center; gap: 11px; }.campaign-countdown span { font: 650 54px "Segoe UI Variable Display", sans-serif; letter-spacing: -.06em; }.campaign-countdown small { color: var(--faint); font-size: 8px; line-height: 1.5; letter-spacing: .12em; }
.liveops-layout { margin-top: 52px; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(290px, .55fr); gap: 56px; }
.quest-row { min-height: 105px; display: grid; grid-template-columns: 35px 1fr 110px; align-items: center; gap: 18px; border-top: 1px solid var(--line); }.quest-index { color: var(--faint); font: 10px monospace; }.quest-row strong { font-size: 12px; }.quest-row p { margin: 5px 0 10px; color: var(--muted); font-size: 10px; }.quest-row small { color: var(--faint); font-size: 8px; }.mini-progress { width: 100%; height: 2px; margin-bottom: 6px; background: var(--line); }.mini-progress i { height: 100%; display: block; background: var(--green); }.quest-reward { text-align: right; }.quest-reward b, .quest-reward small { display: block; }.quest-reward b { font-size: 10px; }.quest-reward small { margin-top: 5px; }
.reward-track { border-top: 1px solid var(--line); }.reward-step { min-height: 72px; display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 15px; border-bottom: 1px solid var(--line-soft); opacity: .55; }.reward-step > span { font: 10px monospace; }.reward-step strong, .reward-step small { display: block; }.reward-step strong { font-size: 11px; }.reward-step small { margin-top: 4px; color: var(--muted); font-size: 9px; }.reward-step > i { color: var(--green); font-size: 8px; font-style: normal; font-weight: 800; }.reward-step.unlocked, .reward-step.current { opacity: 1; }.reward-step.current { margin: 0 -12px; padding: 0 12px; background: rgba(99,245,138,.05); border-color: rgba(99,245,138,.25); }.reward-step.current > span, .reward-step.current strong { color: var(--green); }
.liveops-bottom-grid { margin-top: 68px; display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; }.leaderboard-panel { border-top: 1px solid var(--line); }.leader-row { min-height: 67px; display: grid; grid-template-columns: 28px 34px 1fr auto; align-items: center; gap: 13px; border-bottom: 1px solid var(--line-soft); }.leader-row > b { color: var(--faint); font: 10px monospace; }.leader-avatar { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 9px; background: #282c34; color: #cdd1d8; font-size: 8px; font-weight: 800; }.leader-row strong, .leader-row small { display: block; }.leader-row strong { font-size: 11px; }.leader-row small { margin-top: 4px; color: var(--muted); font-size: 9px; }.leader-row > i { color: #cdd1d8; font-size: 9px; font-style: normal; }.leader-row.first > b, .leader-row.first > i { color: var(--green); }
.fairplay-panel { padding: 36px; border: 1px solid var(--line); background: #111318; }.fairplay-panel h2 { margin: 13px 0 12px; font: 650 29px/1.06 "Segoe UI Variable Display", sans-serif; letter-spacing: -.04em; }.fairplay-panel > p:not(.section-code) { color: var(--muted); font-size: 10px; line-height: 1.65; }.fairplay-panel dl, .policy-summary dl { margin: 26px 0; border-top: 1px solid var(--line); }.fairplay-panel dl div, .policy-summary dl div { min-height: 49px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line-soft); }.fairplay-panel dt, .policy-summary dt { color: var(--muted); font-size: 9px; }.fairplay-panel dd, .policy-summary dd { margin: 0; color: var(--green); font-size: 10px; font-weight: 750; }

.intelligence-layout, .automod-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr); gap: 58px; }
.simulator-panel form { margin-top: 17px; }.simulator-panel label, #command-form > label { display: block; margin: 0 0 8px; color: #bfc4cc; font-size: 10px; font-weight: 700; }.simulator-panel textarea, #command-form textarea, .trigger-input { width: 100%; border: 1px solid var(--line); border-radius: 7px; background: #0d0f12; color: var(--text); outline: none; }.simulator-panel textarea, #command-form textarea { padding: 16px; resize: vertical; font-family: "Cascadia Code", "SFMono-Regular", monospace; font-size: 11px; line-height: 1.7; }.simulator-panel textarea:focus, #command-form textarea:focus, .trigger-input:focus-within { border-color: #59616c; box-shadow: 0 0 0 3px rgba(99,245,138,.05); }.simulator-actions { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; }.simulator-actions small { color: var(--faint); font-size: 9px; }.simulation-result { margin-top: 18px; padding: 20px; border: 1px solid #394238; background: #101512; }.result-head { display: flex; justify-content: space-between; gap: 15px; }.result-decision { color: var(--green); font-size: 10px; font-weight: 800; text-transform: uppercase; }.risk-score { color: var(--muted); font-size: 9px; }.result-explanation { color: #c5cad1; font-size: 11px; }.factor { margin-top: 10px; display: grid; grid-template-columns: 130px 1fr 28px; align-items: center; gap: 12px; color: var(--muted); font-size: 9px; }.factor-bar { height: 2px; background: #2a312c; }.factor-bar i { height: 100%; display: block; background: var(--green); }.factor b { color: white; text-align: right; }
.principles-panel, .policy-summary { padding: 36px; border: 1px solid var(--line); background: #111318; }.principles-panel h2, .policy-summary h2 { margin: 13px 0; font: 650 28px/1.08 "Segoe UI Variable Display", sans-serif; letter-spacing: -.04em; }.principles-panel ol { margin: 28px 0 0; padding: 0; list-style: none; }.principles-panel li { min-height: 84px; padding: 18px 0; display: grid; grid-template-columns: 32px 1fr; gap: 12px; border-top: 1px solid var(--line); }.principles-panel li > b { color: var(--green); font: 9px monospace; }.principles-panel strong, .principles-panel small { display: block; }.principles-panel strong { font-size: 11px; }.principles-panel small { margin-top: 6px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.rule-title { min-height: 100px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }.rule-title h2 { margin: 8px 0 5px; font: 650 22px "Segoe UI Variable Display", sans-serif; }.rule-title p:not(.section-code) { margin: 0; color: var(--muted); font-size: 10px; }.rule-row { min-height: 79px; display: grid; grid-template-columns: 32px 1fr auto; align-items: center; gap: 15px; border-bottom: 1px solid var(--line-soft); }.rule-row > span:first-child { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #33373f; border-radius: 7px; color: #c2c6cd; font: 10px monospace; }.rule-row strong, .rule-row small { display: block; }.rule-row strong { font-size: 11px; }.rule-row small { margin-top: 5px; color: var(--muted); font-size: 9px; }.policy-summary > p:not(.section-code) { color: var(--muted); font-size: 10px; line-height: 1.65; }
.switch { position: relative; width: 34px; height: 19px; display: inline-block; }.switch input { width: 0; height: 0; opacity: 0; }.switch > span { position: absolute; inset: 0; border-radius: 20px; background: #383c44; cursor: pointer; transition: .2s; }.switch > span::after { content: ""; position: absolute; width: 13px; height: 13px; left: 3px; top: 3px; border-radius: 50%; background: #a5aab3; transition: .2s; }.switch input:checked + span { background: var(--green-dim); }.switch input:checked + span::after { transform: translateX(15px); background: var(--green); }.large-switch { width: 42px; height: 23px; }.large-switch > span::after { width: 17px; height: 17px; }.large-switch input:checked + span::after { transform: translateX(19px); }

.commands-panel { border-top: 1px solid var(--line); }.command-toolbar { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }.search-box { width: min(370px, 60%); height: 38px; padding: 0 12px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 7px; background: #101216; }.search-box svg { width: 15px; color: var(--muted); }.search-box input { width: 100%; border: 0; outline: 0; background: transparent; color: white; font-size: 11px; }.command-toolbar > span { color: var(--muted); font-size: 10px; }.command-table-head, .command-row { display: grid; grid-template-columns: minmax(130px,.7fr) minmax(260px,2fr) 100px 146px; align-items: center; gap: 20px; }.command-table-head { min-height: 34px; color: var(--faint); font-size: 8px; font-weight: 750; letter-spacing: .12em; }.command-row { min-height: 77px; border-top: 1px solid var(--line-soft); }.command-trigger { display: flex; align-items: center; gap: 1px; font: 650 12px "Cascadia Code", monospace; }.command-trigger span { color: var(--green); }.command-response { overflow: hidden; color: var(--muted); font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }.command-uses { color: #afb4bd; font-size: 9px; }
.command-controls { display: flex; align-items: center; justify-content: end; gap: 9px; }.command-controls button { height: 28px; padding: 0 8px; border: 1px solid var(--line); border-radius: 5px; background: transparent; color: var(--muted); font-size: 9px; cursor: pointer; }.command-controls button:hover { border-color: #4b515b; color: white; }.command-controls button:last-child:hover { border-color: rgba(255,93,100,.55); color: var(--red); }
.automod-settings { margin-top: 25px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.automod-settings label { position: relative; color: var(--muted); font-size: 9px; font-weight: 700; }.automod-settings input, .automod-settings select, .automod-settings textarea { width: 100%; min-height: 39px; margin-top: 7px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 6px; outline: 0; background: #0d0f12; color: white; font-size: 10px; }.automod-settings textarea { resize: vertical; line-height: 1.5; }.automod-settings label > span { position: absolute; right: 11px; bottom: 11px; color: var(--faint); }.automod-settings .wide-setting { grid-column: 1 / -1; }
.guild-dialog { padding: 28px; }.guild-options { display: grid; gap: 8px; }.guild-options button { min-height: 58px; padding: 10px 12px; display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 6px; background: #0d0f12; color: white; text-align: left; cursor: pointer; }.guild-options button:hover, .guild-options button.active { border-color: var(--green-dim); background: #101612; }.guild-options button > span { width: 31px; height: 31px; display: grid; place-items: center; background: #24282e; font-size: 8px; font-weight: 800; }.guild-options button strong { font-size: 11px; }.guild-options button small { color: var(--muted); font-size: 8px; }
.account-copy { color: var(--muted); font-size: 11px; line-height: 1.6; }

.auth-gate { max-width: 680px; margin: 11vh auto; padding: 60px; border: 1px solid var(--line); background: #111318; box-shadow: var(--shadow); }.auth-mark { width: 48px; height: 48px; margin-bottom: 35px; display: grid; place-items: center; background: var(--green); color: #080a09; font-size: 29px; font-weight: 900; }.auth-gate h2 { margin: 13px 0; font: 650 40px/1.05 "Segoe UI Variable Display", sans-serif; letter-spacing: -.045em; }.auth-gate > p:not(.section-code) { max-width: 500px; margin: 0 0 28px; color: var(--muted); line-height: 1.7; }
dialog { width: min(520px, calc(100vw - 28px)); padding: 0; border: 1px solid #343840; border-radius: 12px; background: #121418; color: white; box-shadow: 0 35px 100px #000b; } dialog::backdrop { background: rgba(3,4,5,.78); backdrop-filter: blur(5px); } #command-form { padding: 28px; }.dialog-heading { margin-bottom: 24px; display: flex; align-items: start; justify-content: space-between; }.dialog-heading h2 { margin: 8px 0 0; font: 650 27px "Segoe UI Variable Display", sans-serif; letter-spacing: -.035em; }.close-button { width: 31px; height: 31px; border: 1px solid var(--line); border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; }.trigger-input { height: 42px; margin-bottom: 19px; padding: 0 13px; display: flex; align-items: center; gap: 2px; }.trigger-input span { color: var(--green); font: 650 12px monospace; }.trigger-input input { flex: 1; border: 0; outline: 0; background: transparent; color: white; font-family: monospace; }.field-help { color: var(--muted); font-size: 9px; }.field-help code { margin-left: 5px; color: var(--green); }.form-error { min-height: 16px; color: #ff7b80; font-size: 10px; }.dialog-actions { margin-top: 18px; display: flex; justify-content: end; gap: 8px; }
.toast { position: fixed; z-index: 100; right: 24px; bottom: 24px; max-width: 380px; padding: 13px 16px; border: 1px solid #363b43; border-left: 2px solid var(--green); border-radius: 7px; background: #14171b; color: #e3e6eb; box-shadow: var(--shadow); font-size: 11px; opacity: 0; transform: translateY(14px); pointer-events: none; transition: .22s; }.toast.show { opacity: 1; transform: none; }

@media (max-width: 1120px) {
  .app-shell { grid-template-columns: 238px minmax(0,1fr); }.sidebar { width: 238px; }
  .pulse-primary { grid-template-columns: 130px 1fr; }.signal-visual { display: none; }.system-list { grid-template-columns: repeat(2,1fr); }.system-list button:nth-child(2) { border-right: 0; }.system-list button:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .season-banner { grid-template-columns: 120px 1fr; }.season-reward { grid-column: 2; padding: 22px 0 0; border: 0; border-top: 1px solid #2b3930; }.campaign-stage { grid-template-columns: 110px 1fr; }.campaign-countdown { display: none; }
  .operations-layout, .liveops-layout, .liveops-bottom-grid, .intelligence-layout, .automod-layout { grid-template-columns: 1fr; gap: 45px; }
}

@media (max-width: 820px) {
  .app-shell { display: block; }.sidebar { left: 0; width: 270px; transform: translateX(-110%); box-shadow: 20px 0 60px #0008; transition: transform .22s ease; }.sidebar.open { transform: none; }.main { min-width: 0; }.mobile-menu { display: grid; }.breadcrumb strong, .breadcrumb > span:first-of-type { display: none; }.command-search { width: 38px; padding: 0; justify-content: center; }.command-search span, .command-search kbd { display: none; }.topbar { padding: 0 17px; }.view { padding: 40px 22px 70px; }.page-lead { margin-bottom: 36px; align-items: start; flex-direction: column; gap: 18px; }.page-lead .lead-copy { max-width: 520px; }.pulse-primary { padding: 30px; }.metric-strip { grid-template-columns: repeat(2,1fr); }.metric-strip > div:nth-child(2) { border-right: 0; }.metric-strip > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.attention-line { padding: 15px 0; flex-wrap: wrap; }.attention-line > div { min-width: 220px; }.attention-line .line-button { margin-left: 44px; }.season-banner { padding: 30px; }.campaign-stage { padding: 30px; }.campaign-objective { padding: 0 0 0 30px; border-right: 0; }.command-table-head { display: none; }.command-row { grid-template-columns: 1fr auto; gap: 8px; padding: 15px 0; }.command-response { grid-column: 1 / -1; grid-row: 2; }.command-uses { display: none; }.command-controls { grid-column: 1 / -1; grid-row: 3; justify-content: start; margin-top: 5px; }
}

@media (max-width: 560px) {
  .status-pill { display: none; }.page-lead h1 { font-size: 43px; }.pulse-primary { grid-template-columns: 1fr; gap: 25px; }.pulse-score { justify-content: start; }.pulse-copy { padding: 23px 0 0; border: 0; border-top: 1px solid var(--line); }.metric-strip { grid-template-columns: 1fr 1fr; }.metric-strip > div { min-height: 95px; padding: 20px; }.metric-strip strong { font-size: 21px; }.systems-section, .season-banner { margin-top: 48px; }.system-list { grid-template-columns: 1fr; }.system-list button { min-height: 125px; border-right: 0; border-bottom: 1px solid var(--line); }.system-list button:last-child { border-bottom: 0; }.season-banner { grid-template-columns: 1fr; }.season-id { height: auto; padding: 0 0 25px; border: 0; border-bottom: 1px solid #2b3930; }.season-id strong { font-size: 58px; }.season-reward { grid-column: 1; }.campaign-stage { grid-template-columns: 1fr; text-align: left; }.campaign-level { display: flex; align-items: baseline; gap: 10px; text-align: left; }.campaign-level strong { font-size: 60px; }.campaign-objective { padding: 27px 0 0; border: 0; border-top: 1px solid #2b3930; }.quest-row { grid-template-columns: 28px 1fr; padding: 15px 0; }.quest-reward { grid-column: 2; text-align: left; }.leader-row { grid-template-columns: 24px 31px 1fr; }.leader-row > i { grid-column: 3; }.principles-panel, .policy-summary, .fairplay-panel { padding: 26px; }.simulator-actions { align-items: stretch; flex-direction: column; }.simulator-actions .primary-button { width: 100%; }.factor { grid-template-columns: 95px 1fr 25px; }.search-box { width: 100%; }.command-toolbar > span { display: none; }.auth-gate { margin: 30px 18px; padding: 36px 26px; }
}

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }
