:root {
  --bg: #090807;
  --surface: #12100e;
  --surface-2: #191512;
  --surface-3: #211a15;
  --line: rgba(255, 255, 255, .08);
  --text: #f6f0e8;
  --muted: #9e958c;
  --copper: #c87522;
  --orange: #f09a3e;
  --cream: #e8d1b8;
  --green: #58d487;
  --red: #e26666;
  --shadow: 0 24px 70px rgba(0, 0, 0, .38);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  color: var(--text);
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    radial-gradient(circle at 70% -10%, rgba(200,117,34,.14), transparent 32%),
    var(--bg);
  background-size: 52px 52px, 52px 52px, auto, auto;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
code { color: var(--cream); font-family: "Cascadia Code", Consolas, monospace; }
.ambient { position: fixed; width: 420px; height: 420px; border-radius: 50%; filter: blur(130px); opacity: .12; pointer-events: none; z-index: -1; }
.ambient-one { background: var(--copper); top: 10%; right: -180px; }
.ambient-two { background: #7c3f16; bottom: -220px; left: -160px; }

.site-header {
  width: min(1380px, calc(100% - 48px));
  height: 86px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 20;
}
.brand { display: flex; align-items: center; gap: 12px; letter-spacing: .18em; }
.brand img { width: 46px; height: 46px; object-fit: contain; filter: drop-shadow(0 0 16px rgba(200,117,34,.3)); }
.brand span { display: grid; line-height: 1; }
.brand strong { font-size: 15px; }
.brand small { color: var(--copper); margin-top: 6px; font-size: 8px; }
.main-nav { display: flex; align-items: center; gap: 8px; }
.main-nav > a:not(.button) { padding: 12px 14px; color: var(--muted); font-size: 13px; transition: .2s; }
.main-nav > a:hover, .main-nav > a.active { color: var(--text); }
.main-nav > a.active { box-shadow: inset 0 -2px var(--copper); }
.nav-toggle { display: none; color: var(--text); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; }
.profile-chip { display: flex; align-items: center; gap: 9px; margin-left: 8px; padding: 5px 10px 5px 5px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; font-size: 12px; }
.profile-chip img { width: 30px; height: 30px; border-radius: 50%; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 24px;
  border: 1px solid var(--copper);
  border-radius: 10px;
  color: #140d07;
  background: linear-gradient(135deg, var(--orange), var(--copper));
  box-shadow: 0 10px 30px rgba(200,117,34,.22);
  font-weight: 800;
  transition: transform .2s, filter .2s;
}
.button:hover { transform: translateY(-2px); filter: brightness(1.08); }
.button.secondary, .button.ghost { background: rgba(255,255,255,.03); color: var(--text); border-color: var(--line); box-shadow: none; }
.button.small { min-height: 38px; padding: 0 16px; font-size: 12px; }
.button.danger { background: linear-gradient(135deg, #ef7777, #a92f2f); border-color: #d85b5b; color: #fff; }
.button-row { display: flex; gap: 10px; margin-top: 18px; }

main { width: min(1380px, calc(100% - 48px)); margin: 0 auto; }
.hero { min-height: 720px; display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: 50px; }
.eyebrow { margin: 0 0 12px; color: var(--copper); font-size: 11px; font-weight: 900; letter-spacing: .22em; text-transform: uppercase; }
.hero h1, .page-heading h1, .dashboard-heading h1 { margin: 0; letter-spacing: -.055em; line-height: .94; }
.hero h1 { max-width: 760px; font-size: clamp(64px, 8.4vw, 126px); }
.hero h1 span { color: transparent; -webkit-text-stroke: 1px var(--copper); text-shadow: 0 0 60px rgba(200,117,34,.22); }
.lead { max-width: 620px; margin: 28px 0; color: #b8afa6; font-size: 19px; line-height: 1.7; }
.hero-actions { display: flex; gap: 12px; }
.connect-code { width: fit-content; margin-top: 28px; display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 14px; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 10px; }
.connect-code span { color: var(--copper); font-weight: 900; font-size: 11px; }
.connect-code code { font-size: 12px; }
.connect-code button { color: var(--muted); border: 0; background: var(--surface-3); padding: 8px 11px; border-radius: 7px; }
.hero-mark { min-height: 520px; display: grid; place-items: center; position: relative; }
.hero-mark > img { width: min(420px, 75%); position: relative; z-index: 2; filter: drop-shadow(0 36px 65px rgba(0,0,0,.7)) drop-shadow(0 0 45px rgba(200,117,34,.2)); }
.logo-orbit { position: absolute; width: 460px; aspect-ratio: 1; border: 1px solid rgba(200,117,34,.18); border-radius: 50%; box-shadow: inset 0 0 80px rgba(200,117,34,.05), 0 0 80px rgba(200,117,34,.04); }
.logo-orbit::before, .logo-orbit::after { content: ""; position: absolute; inset: 14%; border: 1px dashed rgba(255,255,255,.08); border-radius: 50%; }
.logo-orbit::after { inset: 31%; border-style: solid; }
.status-float { position: absolute; right: 2%; bottom: 13%; z-index: 3; display: flex; align-items: center; gap: 12px; min-width: 220px; padding: 15px 18px; background: rgba(18,16,14,.88); border: 1px solid var(--line); backdrop-filter: blur(18px); border-radius: 12px; box-shadow: var(--shadow); }
.status-float i { width: 10px; height: 10px; border-radius: 50%; box-shadow: 0 0 18px currentColor; }
.status-float i.online { background: var(--green); color: var(--green); }
.status-float i.offline { background: var(--red); color: var(--red); }
.status-float div { display: grid; gap: 3px; }
.status-float small { color: var(--muted); }

.section { padding: 90px 0; }
.section-heading, .page-heading { max-width: 720px; margin-bottom: 38px; }
.section-heading h2, .cta-panel h2 { margin: 0; font-size: clamp(36px, 5vw, 68px); letter-spacing: -.04em; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.feature-card, .job-card, .staff-card, .vehicle-card, .character-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: var(--shadow);
}
.feature-card { min-height: 270px; padding: 28px; display: flex; flex-direction: column; justify-content: flex-end; }
.feature-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, var(--copper), transparent); }
.feature-card > span { position: absolute; top: 24px; right: 24px; color: rgba(255,255,255,.15); font-size: 34px; font-weight: 900; }
.feature-card h3 { margin: 0 0 10px; font-size: 22px; }
.feature-card p, .job-card p, .staff-card p { margin: 0; color: var(--muted); line-height: 1.65; }
.cta-panel { margin: 40px 0 100px; padding: 60px; display: flex; align-items: center; justify-content: space-between; gap: 40px; background: radial-gradient(circle at 80%, rgba(200,117,34,.18), transparent 30%), var(--surface); border: 1px solid rgba(200,117,34,.25); border-radius: 20px; }
.cta-panel p:last-child { color: var(--muted); }

.page { padding: 80px 0 120px; min-height: 70vh; }
.page.narrow { max-width: 980px; }
.page-heading h1 { font-size: clamp(52px, 7vw, 94px); }
.page-heading > p:last-child { color: var(--muted); font-size: 17px; }
.status-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 30px; padding: 34px; margin-bottom: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 18px; }
.status-ring { width: 126px; aspect-ratio: 1; display: grid; place-content: center; text-align: center; border-radius: 50%; background: radial-gradient(circle, var(--surface) 57%, transparent 59%), conic-gradient(var(--green) 80%, var(--surface-3) 0); }
.status-ring.offline { background: radial-gradient(circle, var(--surface) 57%, transparent 59%), conic-gradient(var(--red) 100%, var(--surface-3) 0); }
.status-ring strong { font-size: 34px; }
.status-ring span { color: var(--muted); font-size: 12px; }
.status-pill, .state, .count-badge, .danger-zone { width: fit-content; display: inline-flex; align-items: center; gap: 8px; padding: 7px 10px; color: var(--green); background: rgba(88,212,135,.08); border: 1px solid rgba(88,212,135,.2); border-radius: 999px; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.status-pill i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 12px currentColor; }
.state { color: var(--cream); background: rgba(255,255,255,.04); border-color: var(--line); }
.state.good { color: var(--green); border-color: rgba(88,212,135,.2); background: rgba(88,212,135,.08); }
.state.warn { color: #f2b35f; border-color: rgba(242,179,95,.2); background: rgba(242,179,95,.08); }
.state.bad, .danger-zone { color: var(--red); border-color: rgba(226,102,102,.2); background: rgba(226,102,102,.08); }
.panel { background: rgba(18,16,14,.86); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 24px; border-bottom: 1px solid var(--line); }
.panel-heading h2 { margin: 0; font-size: 18px; }
.panel-heading > span, .panel-heading a { color: var(--muted); font-size: 12px; }
.player-list { padding: 8px 20px 20px; }
.player-row, .character-row { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 14px; padding: 14px 4px; border-bottom: 1px solid var(--line); }
.player-row small, .player-row > span:last-child, .character-row small { color: var(--muted); }
.avatar-letter { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--cream); background: linear-gradient(135deg, rgba(200,117,34,.25), rgba(200,117,34,.06)); border: 1px solid rgba(200,117,34,.2); font-weight: 900; }
.empty { padding: 40px; color: var(--muted); text-align: center; }
.rule-list { display: grid; gap: 10px; }
.rule-list article { display: grid; grid-template-columns: 70px 1fr; gap: 24px; padding: 28px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; }
.rule-list article > span { color: var(--copper); font-size: 26px; font-weight: 900; }
.rule-list h3 { margin: 0 0 8px; font-size: 22px; }
.rule-list p { margin: 0; color: var(--muted); line-height: 1.75; white-space: pre-line; }
.rules-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.rule-categories { position: sticky; top: 12px; z-index: 5; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 42px; padding: 12px; background: rgba(13,11,9,.9); border: 1px solid var(--line); border-radius: 14px; backdrop-filter: blur(14px); }
.rule-categories a { padding: 9px 12px; color: var(--muted); background: rgba(255,255,255,.03); border: 1px solid var(--line); border-radius: 8px; font-size: 12px; font-weight: 800; }
.rule-categories a:hover { color: var(--cream); border-color: rgba(200,117,34,.45); }
.rule-category { scroll-margin-top: 95px; margin-bottom: 58px; }
.rule-category-title { display: grid; grid-template-columns: 1fr auto; align-items: end; margin-bottom: 16px; }
.rule-category-title .eyebrow { grid-column: 1 / -1; }
.rule-category-title h2 { margin: 0; font-size: clamp(30px,4vw,46px); }
.rule-category-title span { color: var(--muted); font-size: 12px; }
.handbook-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.handbook-card{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;align-items:start;padding:26px;background:var(--surface);border:1px solid var(--line);border-radius:15px}.handbook-card>span{grid-row:span 2;color:var(--copper);font-size:25px;font-weight:900}.handbook-card h2{margin:0 0 8px}.handbook-card p{margin:0;color:var(--muted);line-height:1.65}.handbook-card .button{grid-column:2;justify-self:start;margin-top:8px}.handbook-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:22px;z-index:90}.handbook-modal:target{display:flex}.handbook-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(6px)}.handbook-modal-dialog{position:relative;z-index:1;width:min(1280px,calc(100vw - 44px));max-height:calc(100vh - 44px);padding:18px;display:grid;grid-template-rows:auto auto 1fr;gap:14px;overflow:hidden}.handbook-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.handbook-modal-head h2{margin:0 0 8px}.handbook-modal-head p:last-child{margin:0;color:var(--muted)}.handbook-modal-actions{display:flex;gap:10px;flex-wrap:wrap}.handbook-frame{width:100%;height:min(78vh,980px);border:1px solid var(--line);border-radius:14px;background:#fff}
@media(max-width:760px){.rules-heading{align-items:flex-start;flex-direction:column}.rule-categories{position:static;flex-wrap:nowrap;overflow-x:auto}.rule-categories a{white-space:nowrap}.rule-list article{grid-template-columns:42px 1fr;gap:12px;padding:20px}.rule-list article>span{font-size:20px}.rule-category-title{grid-template-columns:1fr}.rule-category-title span{margin-top:5px}}
@media(max-width:760px){.handbook-grid{grid-template-columns:1fr}.handbook-modal{padding:10px}.handbook-modal-dialog{width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:14px}.handbook-modal-head{flex-direction:column}.handbook-frame{height:70vh}}
.job-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.job-card { min-height: 220px; display: flex; align-items: center; gap: 24px; padding: 30px; }
.job-icon { flex: 0 0 78px; height: 78px; display: grid; place-items: center; border-radius: 18px; color: var(--cream); background: rgba(200,117,34,.12); border: 1px solid rgba(200,117,34,.22); font-size: 30px; font-weight: 900; }
.job-card h2 { margin: 0 0 10px; }

.dashboard-shell { width: min(1500px, calc(100% - 48px)); display: grid; grid-template-columns: 230px 1fr; gap: 30px; padding: 42px 0 100px; }
.dashboard-nav { position: sticky; top: 24px; height: fit-content; padding: 18px; background: rgba(18,16,14,.78); border: 1px solid var(--line); border-radius: 16px; }
.dashboard-nav a { display: block; padding: 11px 12px; margin: 2px 0; color: var(--muted); border-radius: 8px; font-size: 13px; }
.dashboard-nav a:hover, .dashboard-nav a.active { color: var(--text); background: rgba(200,117,34,.1); }
.dashboard-nav .eyebrow { padding: 8px 12px 3px; }
.nav-space { margin-top: 18px; }
.dashboard-content { min-width: 0; }
.dashboard-heading { min-height: 92px; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.dashboard-heading h1 { font-size: clamp(40px, 5vw, 68px); }
.notice { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-bottom: 20px; padding: 24px; background: rgba(200,117,34,.09); border: 1px solid rgba(200,117,34,.24); border-radius: 14px; }
.notice h2, .notice p { margin: 0; }
.notice p { color: var(--muted); margin-top: 7px; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.metric-grid article { min-height: 150px; padding: 22px; display: grid; align-content: space-between; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; }
.metric-grid span, .metric-grid small { color: var(--muted); font-size: 12px; }
.metric-grid strong { font-size: 42px; letter-spacing: -.05em; }
.dashboard-grid { display: grid; grid-template-columns: 1.4fr .8fr; gap: 18px; }
.character-row { grid-template-columns: auto 1fr auto; padding: 16px 22px; }
.character-row div { display: grid; gap: 4px; }
.quick-actions { padding: 8px 20px 20px; }
.quick-actions a { display: flex; justify-content: space-between; padding: 15px 4px; border-bottom: 1px solid var(--line); color: var(--muted); }
.quick-actions a:hover { color: var(--text); }
.character-grid, .vehicle-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.character-cover { height: 120px; display: grid; place-items: center; background: radial-gradient(circle, rgba(200,117,34,.2), transparent 45%), linear-gradient(135deg, #1e1711, #0d0b09); }
.character-cover span { font-size: 58px; color: var(--copper); font-weight: 900; }
.character-body { padding: 24px; }
.character-body h2 { margin: 0 0 12px; font-size: 28px; }
.tag-row { display: flex; gap: 8px; margin-bottom: 24px; }
.tag-row span { padding: 6px 9px; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 7px; color: var(--muted); font-size: 11px; }
dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin: 0; }
dl div { padding: 13px; background: rgba(255,255,255,.025); border-radius: 9px; }
dt { color: var(--muted); font-size: 11px; }
dd { margin: 6px 0 0; font-weight: 800; }
.vehicle-card { padding: 0; overflow: hidden; }
.vehicle-image { position: relative; aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; background: linear-gradient(135deg, rgba(200,117,34,.18), rgba(255,255,255,.025)); border-bottom: 1px solid var(--line); }
.vehicle-image img { width: 100%; height: 100%; object-fit: cover; }
.vehicle-body { padding: 24px; }
.vehicle-top { display: flex; justify-content: space-between; }
.plate { padding: 7px 12px; color: #17110d; background: #e9e0d3; border: 3px solid #28221d; border-radius: 5px; font-family: monospace; font-weight: 900; }
.vehicle-card h2 { margin: 24px 0 5px; font-size: 28px; }
.vehicle-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 24px; }
.vehicle-stats div { display: grid; gap: 5px; padding: 12px; background: rgba(255,255,255,.025); border-radius: 8px; }
.vehicle-stats span { color: var(--muted); font-size: 10px; text-transform: uppercase; }
.vehicle-stats strong { font-size: 13px; }

.application-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.application-types input { position: absolute; opacity: 0; }
.application-types label > span { min-height: 100px; display: grid; align-content: center; gap: 7px; padding: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; cursor: pointer; }
.application-types small { color: var(--muted); }
.application-types input:checked + span { border-color: var(--copper); background: rgba(200,117,34,.1); box-shadow: inset 0 0 0 1px var(--copper); }
.form-panel, .inline-form, .action-form { display: grid; gap: 16px; padding: 28px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; }
label { display: grid; gap: 8px; color: var(--cream); font-size: 12px; font-weight: 700; }
input, textarea, select { width: 100%; color: var(--text); background: #0d0b0a; border: 1px solid var(--line); border-radius: 9px; outline: none; padding: 13px 14px; }
input:focus, textarea:focus, select:focus { border-color: var(--copper); box-shadow: 0 0 0 3px rgba(200,117,34,.09); }
textarea { min-height: 140px; resize: vertical; }
.application-list { display: grid; gap: 14px; }
.application-list .panel { padding-bottom: 22px; }
.application-list .panel > p, .application-list .panel > small, .application-list .button-row, .answer-grid { margin-left: 24px; margin-right: 24px; }
.answer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding-top: 20px; }
.answer-grid div { padding: 16px; background: rgba(255,255,255,.025); border-radius: 9px; }
.answer-grid p { color: var(--muted); line-height: 1.6; white-space: pre-wrap; }
.flash { padding: 14px 18px; margin-bottom: 14px; border-radius: 10px; }
.flash.success { color: var(--green); background: rgba(88,212,135,.08); border: 1px solid rgba(88,212,135,.2); }
.staff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.staff-card { min-height: 220px; padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; }
.staff-card > span { position: absolute; top: 20px; right: 20px; color: rgba(255,255,255,.15); font-size: 30px; font-weight: 900; }
.staff-card h2 { margin: 0 0 9px; }
.staff-card:hover { border-color: rgba(200,117,34,.45); transform: translateY(-2px); }
.staff-card.accent { background: linear-gradient(145deg, rgba(200,117,34,.15), rgba(255,255,255,.015)); }
.search-bar, .filter-row { display: flex; gap: 10px; margin-bottom: 14px; }
.search-bar input { flex: 1; }
.filter-row select { max-width: 280px; }
.table-panel { overflow: auto; }
table { width: 100%; border-collapse: collapse; min-width: 780px; }
th { padding: 14px 18px; text-align: left; color: var(--muted); background: rgba(255,255,255,.018); border-bottom: 1px solid var(--line); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
td { padding: 15px 18px; border-bottom: 1px solid var(--line); color: #d8d0c7; font-size: 13px; vertical-align: top; }
td strong, td small { display: block; }
td small { color: var(--muted); margin-top: 4px; }
.data-code { display: block; max-width: 360px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--muted); }
.inline-form { grid-template-columns: 1.3fr 1fr 1.3fr auto; align-items: end; margin-bottom: 14px; }
.action-form { grid-template-columns: repeat(4, 1fr) auto; align-items: end; margin-bottom: 14px; }
.text-button { border: 0; background: transparent; }
.danger-text { color: var(--red); }
.muted { color: var(--muted); }
.error-page { min-height: 70vh; display: grid; place-content: center; justify-items: center; text-align: center; }
.error-page > strong { color: var(--copper); font-size: 110px; line-height: 1; }
.error-page h1 { max-width: 700px; }
.site-footer { width: min(1380px, calc(100% - 48px)); min-height: 150px; margin: 0 auto; display: flex; align-items: center; gap: 24px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.site-footer > div { display: flex; align-items: center; gap: 9px; color: var(--text); font-weight: 800; }
.site-footer img { width: 30px; height: 30px; object-fit: contain; }
.site-footer .muted { margin-left: auto; }

@media (max-width: 1050px) {
  .feature-grid, .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .hero { grid-template-columns: 1fr; padding: 80px 0; }
  .hero-mark { min-height: 400px; }
  .dashboard-shell { grid-template-columns: 1fr; }
  .dashboard-nav { position: static; display: flex; overflow-x: auto; gap: 5px; }
  .dashboard-nav a { white-space: nowrap; }
  .dashboard-nav .eyebrow { display: none; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .staff-grid, .application-types { grid-template-columns: repeat(2, 1fr); }
  .inline-form, .action-form { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .site-header, main, .dashboard-shell, .site-footer { width: min(100% - 28px, 1380px); }
  .nav-toggle { display: block; }
  .main-nav { display: none; position: absolute; top: 74px; left: 0; right: 0; padding: 12px; align-items: stretch; flex-direction: column; background: #12100f; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); }
  .main-nav.open { display: flex; }
  .profile-chip { margin: 0; }
  .hero { min-height: auto; padding: 70px 0; }
  .hero h1 { font-size: 58px; }
  .lead { font-size: 16px; }
  .hero-mark { display: none; }
  .feature-grid, .job-grid, .metric-grid, .character-grid, .vehicle-grid, .staff-grid, .application-types, .answer-grid { grid-template-columns: 1fr; }
  .cta-panel, .status-hero, .notice { align-items: stretch; flex-direction: column; display: flex; padding: 28px; }
  .status-ring { width: 100px; }
  .dashboard-shell { padding-top: 20px; gap: 18px; }
  .dashboard-heading { min-height: 0; }
  .dashboard-heading h1 { font-size: 40px; }
  .inline-form, .action-form { grid-template-columns: 1fr; }
  .connect-code { max-width: 100%; overflow: auto; }
  .site-footer { flex-wrap: wrap; padding: 35px 0; }
  .site-footer .muted { width: 100%; margin: 0; }
}

/* Extended portal components */
.news-grid,.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.news-card,.team-card{padding:26px;background:var(--surface);border:1px solid var(--line);border-radius:16px}
.news-card h2,.news-card h3,.team-card h2,.team-card h3{margin:0 0 12px}
.news-card p,.team-card p{color:var(--muted);line-height:1.7;white-space:pre-wrap}
.news-card a{color:var(--copper);font-weight:800}.news-card.wide{padding:36px}.news-list{display:grid;gap:16px}
.team-card img{width:86px;height:86px;margin-bottom:20px;object-fit:cover;border:1px solid rgba(200,117,34,.3);border-radius:20px;background:#0b0908}
.application-type-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.application-type-card{min-height:170px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;padding:26px;background:var(--surface);border:1px solid var(--line);border-radius:15px}
.application-type-card>span{width:60px;height:60px;display:grid;place-items:center;color:var(--copper);background:rgba(200,117,34,.1);border:1px solid rgba(200,117,34,.2);border-radius:14px;font-size:25px;font-weight:900}
.application-type-card h2,.application-type-card p{margin:0 0 7px}.application-type-card p:last-child{color:var(--muted)}.application-type-card>b{color:var(--copper);font-size:24px}
.flash.error{color:var(--red);background:rgba(226,102,102,.08);border:1px solid rgba(226,102,102,.2)}
.auth-page{min-height:760px;display:grid;place-items:center;padding:60px 0}.auth-card{width:min(470px,100%);padding:34px;background:rgba(18,16,14,.94);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
.auth-card form{display:grid;gap:16px}.auth-brand{text-align:center;margin-bottom:24px}.auth-brand img{width:80px;height:80px;object-fit:contain;margin-bottom:12px}.auth-brand h1{margin:0;font-size:42px}.auth-brand p:last-child{color:var(--muted)}
.discord-button{display:flex;align-items:center;justify-content:center;min-height:48px;color:#fff;background:#5865f2;border-radius:9px;font-weight:800}
.divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:var(--muted);font-size:11px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line)}
.auth-links{display:flex;justify-content:space-between;margin-top:18px;color:var(--copper);font-size:12px}.auth-card label small{color:var(--muted);font-weight:400}
.answer-sheet{padding:12px 24px}.answer-sheet>div{padding:20px 0;border-bottom:1px solid var(--line)}.answer-sheet>div:last-child{border-bottom:0}.answer-sheet p{color:#d7cfc6;line-height:1.7;white-space:pre-wrap}
.review-grid{display:grid;grid-template-columns:1fr 330px;gap:16px;align-items:start}.review-sidebar{padding:22px;position:sticky;top:20px}.review-sidebar form{display:grid;gap:10px}
.comments-panel{margin-top:16px;padding-bottom:22px}.comments-panel>form{padding:20px 24px 0}.comment-list{padding:10px 24px}.comment-list article{padding:16px 0;border-bottom:1px solid var(--line)}.comment-list article p{color:#d7cfc6;white-space:pre-wrap}.comment-list small{color:var(--muted)}
.rank-list{padding:10px 22px}.rank-list>div{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.rank-list span{color:var(--copper);font-weight:900}
.form-type-list{display:grid;gap:12px;margin-top:16px}.form-type-list article{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px}.form-type-list h2,.form-type-list p{margin:0 0 7px}.form-type-list p,.form-type-list small{color:var(--muted)}
.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.checkbox{display:flex;align-items:center;gap:10px}.checkbox input{width:auto}
.ticket-list{display:grid;gap:10px;margin-top:16px}.ticket-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:20px}.ticket-row>span:first-child{color:var(--copper);font-weight:900}.ticket-row small{display:block;color:var(--muted);margin-top:4px}
.message-thread{display:grid;gap:12px}.message-thread article{max-width:78%;display:flex;gap:12px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:14px}.message-thread article.mine{margin-left:auto;background:rgba(200,117,34,.08);border-color:rgba(200,117,34,.2)}
.message-thread img{width:38px;height:38px;object-fit:cover;border-radius:10px}.message-thread p{white-space:pre-wrap;line-height:1.6}.message-thread small{color:var(--muted)}.message-form{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;margin-top:18px}.message-form textarea{min-height:90px}
.faq-list{display:grid;gap:10px}.faq-list details{padding:20px 22px;background:var(--surface);border:1px solid var(--line);border-radius:12px}.faq-list summary{cursor:pointer;font-weight:800}.faq-list p{color:var(--muted);line-height:1.7;white-space:pre-line}
.member-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:18px}.member-grid>div{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:10px;background:rgba(255,255,255,.02);border-radius:9px}.member-grid img{width:38px;height:38px;object-fit:cover;grid-row:span 2;border-radius:10px}.member-grid small{color:var(--muted)}
.tag-cloud{display:flex;flex-wrap:wrap;gap:9px}.tag-cloud span{padding:10px 14px;background:var(--surface);border:1px solid var(--line);border-radius:999px;color:var(--cream)}.cms-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:18px}
@media(max-width:1050px){.news-grid,.team-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.application-type-grid,.news-grid,.team-grid,.cms-grid,.form-grid{grid-template-columns:1fr}.review-grid{grid-template-columns:1fr}.review-sidebar{position:static}.message-thread article{max-width:100%}.message-form{grid-template-columns:1fr}}

/* Staff workspace */
.filter-panel{display:flex;grid-template-columns:none;flex-wrap:wrap;align-items:center;padding:14px;margin-bottom:18px}
.filter-panel select{width:auto;min-width:180px}.queue-grid,.case-stack,.content-admin-list{display:grid;gap:12px}
.queue-card{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:22px;transition:.2s}
.queue-card:hover{border-color:rgba(200,117,34,.45);transform:translateY(-2px)}.queue-card h2{margin:4px 0 8px}.queue-card small{color:var(--muted)}
.queue-meta{display:grid;justify-items:end;gap:7px}.metric-text{font-size:19px!important;overflow-wrap:anywhere}
.license-code{display:block;max-width:310px;overflow-wrap:anywhere;color:var(--copper)}.case-card{overflow:hidden}.case-body{padding:22px}.case-body>p{white-space:pre-wrap;line-height:1.7}
.lookup-results{margin-bottom:14px}.lookup-row{padding:16px 22px;border-top:1px solid var(--line)}.lookup-row div{display:grid;gap:5px}.lookup-row code{color:var(--copper);overflow-wrap:anywhere}.lookup-row small{color:var(--muted)}
.ticket-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px;margin-bottom:18px}
.log-tabs{display:flex;gap:8px;margin-bottom:14px}.log-tabs a{padding:11px 16px;border:1px solid var(--line);border-radius:9px;color:var(--muted)}.log-tabs a.active{color:var(--cream);border-color:var(--copper);background:rgba(200,117,34,.1)}
.content-editor{padding:22px}.editor-grid{display:grid;grid-template-columns:2fr 1fr 120px 120px;gap:12px}.row-actions{display:flex;gap:12px;align-items:center}.content-tables{margin-top:18px}
.control-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:18px}.control-card{display:grid;align-content:start;gap:14px;padding:24px}.control-card h2{margin:0}.control-card small{color:var(--muted)}.danger-card{border-color:rgba(226,102,102,.24);background:linear-gradient(145deg,rgba(226,102,102,.07),var(--surface))}
.access-control{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px;padding:26px;border-color:rgba(88,212,135,.28);background:linear-gradient(135deg,rgba(88,212,135,.1),var(--surface))}
.access-control.is-closed{border-color:rgba(200,117,34,.35);background:linear-gradient(135deg,rgba(200,117,34,.12),var(--surface))}.access-control h2{margin:2px 0 8px}.access-control p{margin:0;color:var(--muted)}.access-control small{display:block;margin-top:10px;color:var(--muted)}
.form-note{grid-column:1/-1;color:var(--muted);font-size:12px}.team-pyramid{display:grid;gap:38px}.team-tier{margin:0 auto;width:100%}.team-tier.tier-1{max-width:440px}.team-tier.tier-2{max-width:760px}.team-tier.tier-3{max-width:1020px}.team-tier.tier-4{max-width:1280px}
.tier-line{display:flex;align-items:center;gap:14px;margin-bottom:14px;color:var(--copper);font-size:10px;font-weight:900;letter-spacing:.15em;text-transform:uppercase}.tier-line:before,.tier-line:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.team-tier-grid{display:flex;justify-content:center;flex-wrap:wrap;gap:14px}.team-tier-grid .team-card{flex:1 1 250px;max-width:340px;text-align:center}.team-tier-grid .team-card img{width:104px;height:104px;border-radius:50%}
.site-footer{min-height:240px;display:grid;grid-template-columns:1.5fr .7fr .7fr 1fr;gap:45px;padding:45px 0}.footer-brand{align-items:flex-start!important}.footer-brand img{width:54px;height:54px}.footer-brand div,.footer-links,.footer-meta{display:grid;gap:9px}.footer-brand small,.footer-links a,.footer-meta small{color:var(--muted);font-weight:400}.footer-links strong{color:var(--cream)}.footer-links a:hover{color:var(--copper)}.footer-meta{text-align:right}.footer-meta span{color:var(--copper);font-family:monospace}
@media(max-width:1050px){.editor-grid{grid-template-columns:1fr 1fr}.site-footer{grid-template-columns:1fr 1fr}.footer-meta{text-align:left}}
@media(max-width:760px){.queue-card{align-items:flex-start;flex-direction:column}.queue-meta{justify-items:start}.editor-grid,.control-grid{grid-template-columns:1fr}.access-control{align-items:flex-start;flex-direction:column}.site-footer{grid-template-columns:1fr}.filter-panel{align-items:stretch;flex-direction:column}.filter-panel select{width:100%}}

/* Embedded FiveM staffpanel */
.staff-panel-page{width:min(1780px,calc(100% - 28px));padding:34px 0 70px}
.staff-panel-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:18px}
.staff-panel-heading h1{margin:0;font-size:clamp(38px,5vw,64px)}
.staff-panel-heading p:last-child{color:var(--muted)}
.staff-panel-frame{display:block;width:100%;height:min(900px,82vh);border:1px solid var(--line);border-radius:16px;background:#060708;box-shadow:var(--shadow)}
@media(max-width:760px){.staff-panel-heading{align-items:flex-start;flex-direction:column}.staff-panel-frame{height:82vh;border-radius:10px}}

/* Xpansion StaffPanel workspace */
.xp-staffpanel{width:min(1780px,calc(100% - 28px));display:grid;grid-template-columns:230px 1fr;margin:24px auto 70px;overflow:hidden;border:1px solid #292929;border-radius:15px;background:#060708;box-shadow:0 32px 100px rgba(0,0,0,.45)}
.xp-panel-sidebar{min-height:900px;padding:19px 14px;border-right:1px solid #24272a;background:#090b0c}.xp-panel-brand{display:flex;align-items:center;gap:11px;padding:0 9px 19px;border-bottom:1px solid #24272a}.xp-panel-brand img{width:34px;height:34px;object-fit:contain}.xp-panel-brand strong,.xp-panel-brand small{display:block}.xp-panel-brand small{margin-top:2px;color:#858d96;font-size:9px;letter-spacing:.14em}.xp-panel-label{margin:19px 9px 8px;color:#c87522;font-size:9px;font-weight:900;letter-spacing:.15em}.xp-panel-sidebar nav{display:grid;gap:4px}.xp-panel-sidebar nav a{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid transparent;border-radius:7px;color:#c2c7cc;font-size:12px;font-weight:800}.xp-panel-sidebar nav a:hover,.xp-panel-sidebar nav a.active{color:#fff;border-color:#2b2f33;background:#171a1d}.xp-panel-sidebar nav span{display:grid;place-items:center;width:22px;height:22px;border-radius:5px;color:#e69a4c;background:#21170d;font-size:9px}.xp-panel-side-bottom{margin-top:30px}.xp-panel-side-bottom article{display:grid;gap:3px;margin:8px 0;padding:13px;border:1px solid #292d31;border-radius:8px}.xp-panel-side-bottom article strong{font-size:18px}.xp-panel-side-bottom article small{color:#858d96}
.xp-panel-main{min-width:0;padding:21px;background:#060708}.xp-panel-header{display:flex;align-items:start;justify-content:space-between;gap:20px}.xp-panel-header h1{margin:0;font-size:27px;letter-spacing:-.04em}.xp-panel-header p{margin:4px 0;color:#89919a}.xp-panel-user{display:flex;align-items:center;gap:12px}.xp-panel-user span{padding:7px 10px;border:1px solid #5d2929;border-radius:999px;color:#ff8585;background:#291313;font-size:9px;font-weight:900;letter-spacing:.08em}.xp-panel-connection{display:flex;align-items:center;gap:9px;margin:17px 0;padding:10px 13px;border:1px solid #292d31;border-radius:8px;color:#929aa3;background:#0d0f11;font-size:11px}.xp-panel-connection i{width:8px;height:8px;border-radius:50%;background:#35d07f;box-shadow:0 0 10px #35d07f}
.xp-panel-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:13px}.xp-panel-stats a{min-height:142px;padding:16px;border:1px solid #292d31;border-radius:9px;color:#fff;background:#0d0f11}.xp-panel-stats a:hover{border-color:#664019;transform:translateY(-2px)}.xp-panel-stats b{display:grid;place-items:center;width:34px;height:34px;margin-bottom:15px;border:1px solid #684214;border-radius:7px;color:#efa24e;background:#261a0c}.xp-panel-stats span,.xp-panel-stats small{display:block;color:#89919a}.xp-panel-stats span{font-size:9px;font-weight:900;letter-spacing:.07em}.xp-panel-stats strong{display:block;margin:4px 0;font-size:25px}.xp-panel-stats small{font-size:10px}
.xp-panel-card{border:1px solid #292d31;border-radius:9px;background:#0d0f11;overflow:hidden}.xp-access{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:13px;padding:18px}.xp-access.open{border-color:#1e5c39;background:linear-gradient(120deg,#0d2117,#0d0f11)}.xp-access.closed{border-color:#63431a;background:linear-gradient(120deg,#251a0c,#0d0f11)}.xp-access h2,.xp-access p{margin:0}.xp-access p{margin-top:6px;color:#89919a}.xp-access small{display:block;margin-top:8px;color:#737b84}.xp-panel-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:13px}.xp-tool{display:grid;gap:14px;padding:18px}.xp-tool h2,.xp-tool p{margin:0}.xp-tool p{margin-top:4px;color:#89919a;font-size:11px}.xp-tool label{color:#c4c9ce;font-size:11px}.xp-tool input,.xp-tool select,.xp-announcement input{color:#fff;background:#080a0b;border-color:#31363b}.xp-panel-button{min-height:38px;padding:9px 14px;border:1px solid #804b16;border-radius:7px;color:#100c08;background:linear-gradient(90deg,#f19a39,#d87817);font-weight:900;cursor:pointer}.xp-panel-button:hover{filter:brightness(1.08)}.xp-panel-button.red{color:#fff;border-color:#7c2727;background:#b83939}.xp-panel-button.green{color:#fff;border-color:#1d6641;background:#187246}.xp-panel-card-head{padding:13px 15px;border-bottom:1px solid #25292d}.xp-panel-card-head h2,.xp-panel-card-head p{margin:0}.xp-panel-card-head h2{font-size:14px}.xp-panel-card-head p{margin-top:2px;color:#89919a;font-size:10px}.xp-announcement{display:flex;gap:8px;padding:13px}.xp-announcement input{flex:1}.xp-history{margin-top:13px}.xp-panel-table{overflow:auto}.xp-panel-table table{min-width:760px}.xp-panel-table th{background:#0b0d0f;border-color:#24282c;color:#7d8791}.xp-panel-table td{border-color:#202428;color:#d8dde1}.xp-badge{display:inline-flex;padding:4px 7px;border:1px solid #34393e;border-radius:999px;color:#c8cdd2;background:#15181b;font-size:9px;font-weight:900}.xp-badge.green{color:#71eaaa;border-color:#1e6540;background:#0e2b1c}.xp-badge.red{color:#ff8585;border-color:#692626;background:#2d1212}.xp-badge.yellow{color:#ffc460;border-color:#664615;background:#2b1f0b}.xp-empty{padding:35px!important;color:#89919a!important;text-align:center}
@media(max-width:1050px){.xp-staffpanel{grid-template-columns:1fr}.xp-panel-sidebar{display:none}.xp-panel-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.xp-staffpanel{width:100%;margin:0;border:0;border-radius:0}.xp-panel-main{padding:14px}.xp-panel-header{align-items:flex-start;flex-direction:column}.xp-panel-stats,.xp-panel-tools{grid-template-columns:1fr}.xp-access,.xp-announcement{align-items:stretch;flex-direction:column}}

/* Coin shop */
.shop-hero{display:grid;grid-template-columns:1fr 390px;gap:22px;align-items:center;margin-bottom:18px;padding:34px;border:1px solid rgba(200,117,34,.28);border-radius:16px;background:linear-gradient(135deg,rgba(200,117,34,.14),var(--surface));box-shadow:var(--shadow)}
.shop-hero h2{margin:12px 0 10px;font-size:46px}.coin-form{display:grid;gap:12px;padding:20px;border:1px solid var(--line);border-radius:13px;background:rgba(10,9,8,.62)}
.coin-form small{color:var(--muted)}.coin-form>strong{font-size:20px;color:var(--copper)}.shop-catalog{display:grid;grid-template-columns:230px 1fr;gap:18px;padding:18px}.shop-sidebar{position:sticky;top:18px;display:grid;align-self:start;gap:8px;padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(10,9,8,.45)}.shop-sidebar strong{padding:6px 8px;color:var(--cream)}.shop-sidebar a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid transparent;border-radius:9px;color:var(--muted);font-size:13px;font-weight:900}.shop-sidebar a:hover{color:var(--cream);border-color:rgba(200,117,34,.35);background:rgba(200,117,34,.08)}.shop-sidebar small{display:grid;place-items:center;min-width:26px;height:24px;border-radius:999px;color:var(--copper);background:rgba(200,117,34,.1)}.shop-category-stack{display:grid;gap:18px}.shop-category{scroll-margin-top:18px}.shop-category>h3{margin:2px 0 12px;color:var(--cream)}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.shop-card{display:grid;grid-template-rows:160px 1fr auto;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}
.shop-image{display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,rgba(200,117,34,.2),rgba(10,9,8,.92))}
.shop-image img{width:100%;height:100%;object-fit:cover}.shop-card>div:nth-child(2){padding:18px}.shop-card span{color:var(--copper);font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.shop-card h3{margin:7px 0 9px}.shop-card p{margin:0;color:var(--muted);line-height:1.6}.shop-card strong{padding:15px 18px;border-top:1px solid var(--line);color:var(--cream)}
.order-panel{padding:28px}.order-panel h2{margin-top:0;font-size:42px}
@media(max-width:1050px){.shop-hero{grid-template-columns:1fr}.shop-catalog{grid-template-columns:1fr}.shop-sidebar{position:static;display:flex;overflow:auto}.shop-sidebar strong{display:none}.shop-sidebar a{white-space:nowrap}.shop-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.shop-hero{padding:24px}.shop-catalog{padding:14px}.shop-grid{grid-template-columns:1fr}.shop-card{grid-template-rows:140px 1fr auto}}