@font-face{font-family:Barlow;src:url('/assets/barlow-condensed-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Barlow;src:url('/assets/barlow-condensed-800.woff2') format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/manrope.woff2') format('woff2');font-weight:400 800;font-display:swap}

:root {
  color-scheme: dark;
  --bg:#0d0f11;
  --side:#111315;
  --panel:#15181b;
  --panel-hover:#1b1e21;
  --line:#282c2f;
  --text:#f3f4ee;
  --muted:#a4a9a9;
  --lime:#e5ff47;
  --mono:ui-monospace,Consolas,monospace;
  --display:Barlow,'Arial Narrow',Impact,sans-serif;
  font-family:Manrope,system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
}

*, *::before, *::after {box-sizing:border-box}
[hidden] {display:none!important}
body {margin:0;min-width:280px}
button, input, select, textarea {font:inherit}
button {cursor:pointer;color:inherit}
a {color:inherit;text-decoration:none}
button:disabled {cursor:wait;opacity:.6}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline:2px solid var(--lime);outline-offset:4px;
}
h1,h2,h3,p {margin:0}
.icon {width:20px;height:20px;flex:none;vertical-align:middle}
.sr-only,.skip:not(:focus) {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip {position:fixed;z-index:5;top:10px;left:10px;padding:12px;background:var(--lime);color:#131500}
.overline {
  color:#a2a7a6;font:700 10px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;
}

.sidebar {
  position:fixed;inset:0 auto 0 0;width:224px;display:flex;flex-direction:column;
  background:var(--side);border-right:1px solid var(--line);z-index:2;
}
.brand {display:flex;gap:11px;align-items:center;margin:30px 22px 0;align-self:flex-start}
.brand-icon {display:grid;place-items:center;width:38px;height:38px;border-radius:9px;color:#141805;background:var(--lime);flex:none}
.brand-icon .icon {width:25px;height:25px}
.brand > span:last-child,.mobile-brand > span:last-child {font:800 25px/.84 var(--display);letter-spacing:.015em;white-space:nowrap}
.brand-suffix {color:var(--lime);margin-left:.09em}
.brand small {display:block;margin-top:7px;color:var(--muted);font:700 8px/1 var(--mono);letter-spacing:.15em}
.side-menu {margin:31px 15px 0}
.side-menu > p {padding-left:11px;margin-bottom:12px}
.sidebar {overflow-y:auto;scrollbar-width:thin}
.side-explore {margin-top:21px;padding-bottom:14px}
.side-explore > p {padding-left:11px;margin-bottom:9px}
.side-explore .nav-links {gap:2px}
.side-explore .nav-links a {min-height:35px}
.side-explore .nav-links a[aria-current]::before {left:-12px}
.nav-links {display:grid;gap:5px}
.nav-links a {
  position:relative;display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;
  border:1px solid transparent;border-radius:8px;color:var(--muted);font-size:13px;font-weight:750;
}
.nav-links a:hover {color:var(--text);background:var(--panel)}
.nav-links a[aria-current] {color:var(--lime);background:#23281a;border-color:#303726}
.nav-links a[aria-current]::before {position:absolute;left:-16px;width:3px;height:24px;content:"";background:var(--lime);border-radius:0 3px 3px 0}
.nav-links .icon {width:17px;height:17px}
.button {display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:42px;padding:0 15px;border:1px solid transparent;border-radius:8px;font-size:13px;font-weight:800;text-align:center}
.button .icon {width:17px;height:17px}
.button-primary {background:var(--lime);color:#181a0e}
.button-primary:hover {background:#f0ff98}
.button-secondary {background:#1a1d20;border-color:#363a3e;color:var(--text)}
.button-secondary:hover,.button-quiet:hover {background:#262a2d}
.button-quiet {background:transparent;color:#c6caca}
.button-danger {background:#3a1b24;border-color:#692e3d;color:#ffc0cc}
.button-danger:hover {background:#562737}
.side-capture {margin-top:14px;width:100%}
.side-bottom {margin-top:auto;padding:0 15px 17px}
.side-pattern {display:block;margin:0 0 17px 3px;width:60px;height:12px;opacity:.42;background:repeating-linear-gradient(125deg,#656b62 0 3px,transparent 3px 8px)}
.side-account {display:flex;gap:10px;align-items:center;width:100%;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:9px;color:var(--text)}
.side-account:hover {background:var(--panel-hover)}
.side-account > span:nth-child(2) {min-width:0;flex:1}
.side-account strong,.side-account small {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-account strong {font-size:11px}
.side-account small {font-size:9px;color:var(--muted);margin-top:3px}
.side-account > .icon {width:13px;color:var(--muted)}
.avatar {
  width:34px;height:34px;display:inline-grid;place-items:center;flex:none;border-radius:8px;
  background:#343e1d;color:#ebff93;font:800 12px/1 var(--mono);letter-spacing:-.04em;
}
.avatar .icon {width:17px;height:17px}
.avatar-1 {background:#3a2d4a;color:#dfbefb}
.avatar-2 {background:#412e24;color:#ffc08c}
.avatar-3 {background:#203b42;color:#9ee4f5}
.avatar-4 {background:#392d39;color:#ffc6ee}

.workspace {margin-left:224px}
.topbar {
  height:67px;display:flex;justify-content:space-between;align-items:center;
  padding:0 clamp(22px,3.3vw,52px);border-bottom:1px solid #222529;
}
.breadcrumb,.top-actions,.live-status {display:flex;align-items:center;gap:11px}
.breadcrumb {font-size:12px;color:var(--muted)}
.breadcrumb strong {color:var(--text)}
.breadcrumb .icon {width:12px;height:12px}
.top-actions {gap:18px}
.live-status {gap:7px;color:#c4c8c0;font:700 9px/1 var(--mono);letter-spacing:.1em;white-space:nowrap}
.live-status i,.hero-eyebrow i {width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 11px #e5ff4766;flex:none}
.top-account {display:flex;gap:7px;align-items:center;padding:7px 10px;border:1px solid var(--line);border-radius:7px;background:var(--panel);font-size:11px;font-weight:800}
.top-account:hover {background:var(--panel-hover)}
.top-account > .icon {width:15px;height:15px}
.top-account:has(.avatar) {padding:0}
.mobile-brand,.mobile-nav {display:none}
.top-explore {display:none}
.page {max-width:1530px;margin:auto;padding:28px clamp(22px,3.3vw,52px) 20px}

.hero {
  position:relative;isolation:isolate;overflow:hidden;min-height:342px;display:flex;align-items:center;
  border:1px solid #343a30;border-radius:16px;background:#161a17;
}
.hero-art {position:absolute;z-index:-3;inset:0 0 0 16%;background:#181b17 url('/assets/hero.jpg') center center/cover no-repeat}
.hero::before {
  position:absolute;z-index:-2;inset:0;content:"";
  background:linear-gradient(90deg,#111612 0%,#111612 9%,#111612ee 26%,#11161277 49%,transparent 70%),
             linear-gradient(0deg,#101312de 0%,transparent 30%);
}
.hero-tracks {position:absolute;z-index:-1;inset:0 auto 0 0;width:15px;opacity:.5;background:repeating-linear-gradient(-45deg,#a0b335 0 1px,transparent 1px 6px);mask-image:linear-gradient(transparent,#000 36%,transparent 94%)}
.hero-copy {padding:32px clamp(25px,3vw,46px);max-width:415px}
.hero-eyebrow {
  color:#e6ecdb;display:flex;align-items:center;gap:8px;font:700 9px/1.3 var(--mono);letter-spacing:.13em;
}
.hero h1 {margin:11px 0 13px;font:800 clamp(64px,6.7vw,105px)/.81 var(--display);letter-spacing:-.02em}
.hero h1 em {font-style:normal;color:var(--lime)}
.hero-copy > p:not(.hero-eyebrow) {max-width:290px;margin-bottom:20px;color:#d1d6cd;font-size:12px;font-weight:650;line-height:1.65}
.hero-copy .button {min-height:43px;padding:0 17px}
.hero-caption {position:absolute;right:20px;bottom:19px;display:flex;gap:8px;align-items:center;text-align:left;background:#111514df;border:1px solid #747b4c80;border-radius:7px;padding:6px 10px 6px 6px}
.frame-corner {display:grid;place-items:center;width:25px;height:25px;border-radius:4px;background:#2e361b;color:var(--lime)}
.frame-corner .icon {width:13px;height:13px}
.hero-caption strong {display:block;font:800 13px/1 var(--display);letter-spacing:.05em}
.hero-caption small {display:block;margin-top:3px;color:#b4b8a5;font:700 7px/1 var(--mono);letter-spacing:.06em}

.stats {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:15px 0 29px}
.stat {display:flex;align-items:center;gap:12px;min-height:71px;padding:11px 14px;background:var(--panel);border:1px solid var(--line);border-radius:10px}
.stat-icon {display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:8px}
.stat-icon .icon {width:18px;height:18px}
.stat-lime {background:#2b321c;color:var(--lime)}
.stat-purple {background:#30243c;color:#d6a9ff}
.stat-orange {background:#3a2b1d;color:#ffbc7f}
.stat-label {display:block;color:#b7bcba;font-size:10px;font-weight:750}
.stat strong {display:block;margin-top:2px;font:800 29px/.95 var(--display);white-space:nowrap}
.stat strong small,.card-points small,.rank-points small,.rarity-list strong small {font:700 8px/1 var(--mono);letter-spacing:.03em;color:#a8b093}

.home-columns {display:grid;grid-template-columns:minmax(0,2.17fr) minmax(250px,1fr);gap:22px;align-items:start}
.section-header {min-height:47px;display:flex;justify-content:space-between;align-items:end;gap:8px;margin-bottom:11px}
.section-header .overline,.page-heading .overline {color:#b8c08b}
.section-header h2 {margin-top:3px;font:800 35px/.95 var(--display);letter-spacing:.005em}
.text-link {display:inline-flex;gap:6px;align-items:center;color:var(--lime);font-size:11px;font-weight:800;white-space:nowrap}
.text-link:hover {text-decoration:underline}
.text-link .icon {width:14px;height:14px}
.section-header .text-link {margin-bottom:2px}
.cards {display:grid;gap:11px;grid-template-columns:repeat(3,minmax(0,1fr))}
.car-card {min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.card-button {display:block;width:100%;height:100%;padding:0;border:0;background:none;text-align:left}
.card-button:focus-visible {outline-offset:-3px}
.car-card:has(.card-button:hover) {border-color:#808d35;background:var(--panel-hover)}
.card-image {position:relative;overflow:hidden;aspect-ratio:1.56;background:#1a1d1f}
.card-image img {width:100%;height:100%;object-fit:cover;display:block}
.card-hidden {display:flex;align-items:center;justify-content:center;gap:6px;color:var(--muted);font-size:11px}
.card-hidden .icon {width:15px;height:15px}
.card-report {display:flex;justify-content:flex-end;border-top:1px solid var(--line)}
.card-report .button {min-height:32px;font-size:10px;padding:0 8px}
.card-report .icon {width:13px;height:13px}
.legal-footer {display:flex;flex-wrap:wrap;gap:9px 15px;max-width:1530px;margin:0 auto;padding:14px clamp(22px,3.3vw,52px);font-size:11px;color:var(--muted)}
.legal-footer a:hover,.policy-content a:hover {text-decoration:underline}
.policy-content,.account-controls {max-width:760px;display:grid;gap:11px;padding:18px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.policy-content h2,.account-controls h2 {font:800 28px/1 var(--display)}
.policy-content h2:not(:first-child) {margin-top:8px}
.policy-content p,.policy-check {color:#c4c9c5;font-size:13px;line-height:1.6}
.policy-content a {color:var(--lime)}
.policy-content > .button,.account-controls > .button {justify-self:start}
.policy-form {display:grid;gap:12px}
.app-dialog .policy-form {margin-top:12px}
.policy-check {display:flex;align-items:start;gap:8px}
.policy-check input {accent-color:var(--lime);margin-top:4px}
.account-controls {margin-top:21px}
.account-controls h3 {font-size:13px}
.account-controls ul {display:grid;gap:5px;list-style:none;padding:0;margin:0}
.account-controls li {display:flex;align-items:center;justify-content:space-between;gap:8px}
.card-image .badge {position:absolute;top:8px;left:8px}
.badge {
  display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 6px;border:1px solid currentColor;
  border-radius:4px;background:#17171bee;font:700 8px/1 var(--mono);letter-spacing:.035em;text-transform:uppercase;white-space:nowrap;
}
.badge i {width:5px;height:5px;background:currentColor;transform:rotate(45deg)}
.rarity-unverified,.rarity-common {color:#d1d4d2}
.rarity-uncommon {color:#a5e7ae}
.rarity-rare {color:#a3caff}
.rarity-epic {color:#dab2ff}
.rarity-legendary {color:#ffce84}
.card-info {display:flex;gap:4px;justify-content:space-between;align-items:end;min-height:61px;padding:9px}
.card-info > div {min-width:0}
.card-info .overline {font-size:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-info h3 {margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 clamp(18px,1.58vw,25px)/1.05 var(--display)}
.card-points {color:var(--lime);font:800 17px/1 var(--display);white-space:nowrap}
.card-points small {font-size:7px}
.rank-panel {border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel)}
.rank-row {display:flex;align-items:center;gap:8px;min-height:49px;padding:7px 10px;border-bottom:1px solid var(--line)}
a.rank-row:hover {background:var(--panel-hover)}
.rank-num {min-width:20px;text-align:center;color:var(--muted);font:800 19px/1 var(--display)}
.place-1 .rank-num {color:#ffce84}
.place-2 .rank-num {color:#e4e9ea}
.place-3 .rank-num {color:#e8a483}
.rank-row .avatar {width:29px;height:29px;font-size:10px;border-radius:6px}
.rank-user {flex:1;min-width:0}
.rank-user strong,.rank-user small {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-user strong {font-size:11px}
.rank-user small {margin-top:2px;color:var(--muted);font-size:9px}
.rank-points {color:var(--lime);font:800 19px/1 var(--display);white-space:nowrap}
.rank-footer {display:flex;justify-content:center;min-height:36px;padding:7px 10px}
.rank-empty {padding:16px;color:var(--muted);font-size:12px}
.page-footer {display:flex;justify-content:space-between;margin-top:29px;padding:12px 0 4px;border-top:1px solid var(--line);color:#a1a5a1;font:700 8px/1 var(--mono);letter-spacing:.12em}

.mission-shortcut {
  display:flex;align-items:center;gap:12px;margin-top:22px;padding:11px 14px;
  border:1px solid #3d4930;border-radius:9px;background:#1c2218;
}
.mission-shortcut:hover {background:#262d1d;border-color:#77894a}
.mission-shortcut-text {min-width:0;flex:1}
.mission-shortcut strong {display:block;font:800 23px/1 var(--display)}
.mission-shortcut small {display:block;margin-top:4px;color:#bbc3ad;font-size:10px}
.mission-glyph {display:grid;place-items:center;width:42px;height:42px;flex:none;background:#2e371e;color:var(--lime);border:1px solid #465330;border-radius:8px}
.mission-glyph .icon {width:21px;height:21px}
.mission-header {
  position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:end;justify-content:space-between;gap:18px;
  margin:0 0 16px;padding:26px clamp(18px,3.4vw,45px);border:1px solid #3c4930;border-radius:14px;
  background:linear-gradient(112deg,#1b2317,#151b17 55%,#222b1b);
}
.mission-header::after {
  content:"";position:absolute;z-index:-1;inset:0 0 0 58%;
  background:repeating-linear-gradient(-43deg,#a4c34e23 0 1px,transparent 1px 14px);
  mask-image:linear-gradient(90deg,transparent,#000);
}
.mission-header .overline {display:flex;align-items:center;gap:7px;color:var(--lime)}
.mission-header .overline .icon {width:15px;height:15px}
.mission-header h1 {margin:5px 0 7px;font:800 clamp(45px,6vw,78px)/.94 var(--display)}
.mission-header p:not(.overline) {color:#c2cab8;font-size:13px;line-height:1.55}
.mission-summary {display:flex;align-items:stretch;gap:8px}
.mission-summary > div {display:grid;align-content:center;gap:5px;min-width:105px;padding:9px 11px;border:1px solid #4d593b;border-radius:7px;background:#171d16}
.mission-summary > div > span:not(.sr-only) {color:#b5bfaa;font:700 9px/1.3 var(--mono);white-space:nowrap}
.mission-summary strong {color:var(--lime);font:800 29px/1 var(--display);font-variant-numeric:tabular-nums;white-space:nowrap}
.mission-summary strong small {color:#c1c8b2;font:700 9px/1 var(--mono)}
.mission-summary [data-mission-countdown] {color:var(--text);font-family:var(--mono);font-size:19px}
.level-panel {display:flex;align-items:center;gap:15px;margin-bottom:12px;padding:12px 14px;background:var(--panel);border:1px solid #3d4930;border-radius:9px}
.level-badge {display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border:1px solid #4d5a2b;border-radius:5px;background:#263018;color:#edff9e;font:700 10px/1 var(--mono);white-space:nowrap}
.level-badge .icon {width:13px;height:13px}
.level-panel .level-badge {padding:8px 9px;font-size:12px}
.level-track {flex:1;min-width:0}
.mission-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.mission-tile {display:flex;flex-direction:column;gap:17px;min-width:0;padding:16px;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.mission-tile:focus-visible {outline:2px solid var(--lime);outline-offset:3px}
.mission-ready {border-color:#72863c}
.mission-tile-top,.mission-progress-label {display:flex;justify-content:space-between;align-items:center;gap:7px}
.mission-reward {padding:6px 7px;border:1px solid #4d5a2b;border-radius:5px;background:#263018;color:#edff9e;font:700 10px/1 var(--mono);white-space:nowrap}
.mission-tile h2 {margin:4px 0 5px;font:800 29px/1 var(--display)}
.mission-description {color:var(--muted);font-size:12px;line-height:1.55}
.mission-tile-bottom {margin-top:auto}
.mission-progress-label {margin-bottom:6px;color:var(--muted);font-size:11px}
.mission-progress-label strong {color:var(--text);font:700 11px/1 var(--mono)}
:is(.mission-tile,.level-panel) progress {appearance:none;display:block;width:100%;height:6px;overflow:hidden;border:0;border-radius:10px;background:#2b3030;color:var(--lime)}
:is(.mission-tile,.level-panel) progress::-webkit-progress-bar {background:#2b3030}
:is(.mission-tile,.level-panel) progress::-webkit-progress-value {background:var(--lime);border-radius:10px}
:is(.mission-tile,.level-panel) progress::-moz-progress-bar {background:var(--lime);border-radius:10px}
.mission-tile-action {display:flex;align-items:center;min-height:38px;margin-top:8px}
.mission-tile-action .button {width:100%;min-height:36px}
.mission-in-progress,.mission-claimed {display:flex;align-items:center;gap:6px;font-size:11px;font-weight:750;color:var(--muted)}
.mission-claimed {color:#ccf1af}
.mission-in-progress .icon,.mission-claimed .icon,.mission-footnote .icon {width:14px;height:14px}
.mission-footnote {display:flex;align-items:start;gap:7px;margin-top:13px;color:var(--muted);font-size:11px;line-height:1.55}
.mission-footnote .icon {margin-top:1px}
.mission-footnote + .explore-link {margin-top:14px}
.heading-actions {display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.explore-section {margin-top:22px}
.explore-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:8px}
.explore-link {display:flex;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:var(--panel)}
.explore-link:hover {background:#20271b;border-color:#55673b}
.explore-link > span:nth-child(2) {flex:1;min-width:0}
.explore-link strong {display:block;font:800 22px/1 var(--display)}
.explore-link small {display:block;margin-top:3px;color:var(--muted);font-size:10px}
.explore-link > .icon {color:var(--lime);width:15px;height:15px}
.explore-link .mission-glyph {width:36px;height:36px}
.explore-dialog nav {display:grid;gap:7px}

.page-heading {display:flex;justify-content:space-between;gap:18px;align-items:end;margin:9px 0 25px}
.page-heading h1 {margin:3px 0 5px;font:800 clamp(49px,6.1vw,86px)/.94 var(--display)}
.page-intro {color:#b4b9b7;font-size:13px;line-height:1.6}
.page-heading > .button {flex:none}
.deck-tools {display:flex;align-items:center;gap:10px;margin-bottom:15px}
.search-field,.select-field {position:relative;display:flex;align-items:center;gap:8px;min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:8px;color:var(--muted)}
.search-field {width:min(350px,50%);padding:0 10px}
.search-field input,.select-field select {min-width:0;min-height:40px;padding:0 3px;color:var(--text);border:0;background:transparent;font-size:12px}
.search-field input {width:100%}
.deck-tools .icon {width:14px;height:14px}
.select-field select {appearance:none;width:100%;padding:0 28px 0 10px}
.select-field option {background:var(--panel)}
.select-field .icon {position:absolute;right:9px;pointer-events:none}
.deck-count {margin-left:auto;color:var(--muted);font-size:11px;white-space:nowrap}
.deck-cards {grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr))}
.deck-cards .card-info {padding:11px}
.empty {display:grid;justify-items:center;align-content:center;gap:8px;min-height:187px;padding:17px;text-align:center;background:var(--panel);border:1px dashed #373c39;border-radius:10px}
.empty-icon {display:grid;place-items:center;width:37px;height:37px;border-radius:7px;background:#2b321c;color:var(--lime)}
.empty h3 {font:800 25px/1 var(--display)}
.empty p,.loading {color:var(--muted);font-size:12px}
.empty .button,.empty .text-link {margin-top:4px}
.loading {padding:21px 0}
.info-banner {display:flex;align-items:center;gap:9px;margin-bottom:12px;padding:10px 12px;border:1px solid #383e2a;border-radius:8px;background:#202518;color:#dce3c3;font-size:12px}
.info-banner .icon {width:16px;height:16px;color:var(--lime)}
.rank-labels,.rank-full .rank-row {display:grid;grid-template-columns:60px 36px minmax(0,1fr) 80px 95px;gap:10px;align-items:center;padding:11px 18px}
.rank-labels {color:var(--muted);font:700 10px/1 var(--mono);border-bottom:1px solid var(--line)}
.rank-labels span:first-child {text-align:center}
.rank-labels span:nth-child(2) {grid-column:span 2}
.rank-labels span:last-child,.rank-full .rank-points {text-align:right}
.rank-full .rank-row:last-child {border-bottom:0}
.rank-cards {font-weight:800;font-size:13px}
.rank-cards small {font-size:10px;color:var(--muted)}
.rank-full .empty {border:0}
.rarity-guide {margin-top:26px}
.rarity-list {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
.rarity-list > div {display:grid;justify-items:start;gap:7px;background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:12px}
.rarity-list strong {color:var(--lime);font:800 23px/1 var(--display)}
.profile-panel {display:flex;align-items:center;gap:15px;border:1px solid var(--line);border-radius:11px;background:var(--panel);padding:19px}
.profile-avatar {width:62px;height:62px;font-size:24px}
.profile-identity {min-width:0}
.profile-identity h2 {overflow-wrap:anywhere;margin:3px 0;font:800 36px/.95 var(--display)}
.profile-identity p {color:var(--muted);font-size:12px}
.profile-badges {display:flex;flex-wrap:wrap;align-items:center;gap:6px 9px}
.public-pill {color:var(--lime);font:700 9px/1 var(--mono);letter-spacing:.06em}
.public-pill .icon {width:13px;height:13px;margin-right:2px}
.profile-actions {display:flex;flex-wrap:wrap;gap:7px;margin-left:auto;justify-content:flex-end}

.app-dialog {
  width:min(100% - 24px,510px);max-height:calc(100dvh - 28px);padding:20px;
  border:1px solid #3c4338;border-radius:14px;background:#15181b;color:var(--text);box-shadow:0 25px 90px #0009;
}
.app-dialog::backdrop {background:#070908b8;backdrop-filter:blur(4px)}
.auth-dialog {overflow-y:auto;overscroll-behavior:contain}
.dialog-header {display:flex;justify-content:space-between;gap:14px;align-items:start;margin-bottom:15px}
.dialog-heading h2 {margin:2px 0 4px;font:800 38px/.95 var(--display)}
.dialog-heading p:not(.overline) {color:var(--muted);font-size:12px;line-height:1.5}
.icon-button {display:grid;place-items:center;flex:none;width:35px;height:35px;padding:0;border:1px solid var(--line);border-radius:8px;background:#202326}
.icon-button:hover {background:#303538}
.icon-button .icon {width:17px;height:17px}
.auth-form,.capture-form,.capture-fields {display:grid;gap:11px}
.form-field {display:grid;min-width:0;gap:5px;font-size:11px;font-weight:800;color:#d6dbd7}
.form-field input,.form-field textarea {width:100%;min-width:0;min-height:40px;padding:9px 10px;border:1px solid #373d40;border-radius:7px;background:#101315;color:var(--text)}
.form-field textarea {resize:vertical}
.form-field input:disabled {color:#a3aaa6}
.auth-form input[aria-invalid="true"] {border-color:#c5677d}
.auth-hint,.capture-status,.capture-privacy {color:var(--muted);font-size:11px;line-height:1.55}
.auth-hint .icon {width:13px;height:13px}
.dialog-error {padding:9px;color:#ffc0cb;background:#341a22;border-radius:6px;font-size:12px}
.dialog-footer,.capture-actions,.capture-delete {display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.dialog-footer {justify-content:flex-end;margin-top:3px}
.capture-actions {margin-bottom:3px}
.capture-media {position:relative;overflow:hidden;border:1px solid var(--line);border-radius:9px;background:#0e1112}
.capture-placeholder {min-height:123px;display:grid;place-content:center;justify-items:center;gap:6px;padding:14px;color:var(--muted);text-align:center;font-size:12px}
.capture-placeholder .icon {color:var(--lime);width:27px;height:27px}
.capture-preview,.capture-video {display:block;width:100%;max-height:min(31dvh,230px);object-fit:contain}
.capture-form-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.capture-delete {padding:8px;background:#2d1b21;border-radius:7px}
.capture-delete strong {flex:1 1 100%;font-size:12px}
.capture-suggestions {display:grid;gap:8px;margin:0;padding:10px;border:1px solid #506035;border-radius:8px;background:#202619}
.capture-suggestions h3 {font:800 24px/.95 var(--display)}
.capture-suggestions p {font-size:11px;color:var(--muted)}
.capture-suggestions > div {display:flex;flex-wrap:wrap;gap:5px}
.capture-suggestions .button {min-height:34px;font-size:11px}
.toast {position:fixed;z-index:3;right:20px;bottom:20px;display:flex;align-items:center;gap:9px;max-width:min(420px,100% - 40px);padding:11px 14px;background:#252e1b;border:1px solid #555e38;border-radius:9px;color:#f3f6ed;font-size:13px;font-weight:750}
.toast .icon {color:var(--lime);width:16px;height:16px}

@media (max-width:1150px) {
  .sidebar {width:194px}
  .workspace {margin-left:194px}
  .home-columns {gap:15px}
  .card-info {align-items:start;flex-direction:column}
  .deck-cards .card-info {flex-direction:row;align-items:end}
}
@media (max-width:960px) {
  .home-columns {grid-template-columns:1fr}
  .home-ranking {max-width:none}
  .card-info {flex-direction:row;align-items:end}
  .profile-panel {flex-wrap:wrap}
  .profile-actions {margin-left:0;justify-content:start;width:100%}
  .mission-grid {grid-template-columns:1fr}
}
@media (max-width:720px) {
  .legal-footer {padding:0 14px calc(80px + env(safe-area-inset-bottom));margin-top:-51px}
  .sidebar,.breadcrumb {display:none}
  .workspace {margin:0}
  .topbar {height:58px;padding:0 15px}
  .mobile-brand {display:flex;gap:8px;align-items:center}
  .mobile-brand .brand-icon {width:31px;height:31px;border-radius:7px}
  .mobile-brand .brand-icon .icon {width:21px;height:21px}
  .mobile-brand > span:last-child {font-size:22px}
  .top-actions {gap:10px}
  .top-actions .live-status {display:none}
  .top-explore {display:flex;align-items:center;gap:4px;padding:7px 8px;border:1px solid var(--line);border-radius:7px;background:var(--panel);font-size:10px;font-weight:800}
  .top-explore .icon {width:15px;height:15px;color:var(--lime)}
  .page {padding:14px 14px calc(81px + env(safe-area-inset-bottom))}
  .mobile-nav {
    position:fixed;inset:auto 0 0;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) 48px repeat(3,minmax(0,1fr));
    align-items:center;min-height:60px;padding:3px 5px calc(3px + env(safe-area-inset-bottom));
    border-top:1px solid #343839;background:#15181bfd;
  }
  .mobile-nav a {display:grid;gap:3px;justify-items:center;align-content:center;min-height:45px;color:#b5bab6;font-size:9px;font-weight:800}
  .mobile-nav a[aria-current] {color:var(--lime)}
  .mobile-nav .icon {width:17px;height:17px}
  .mobile-capture {display:grid;place-items:center;justify-self:center;width:42px;height:42px;padding:0;border:0;border-radius:11px;background:var(--lime);color:#141805}
  .mobile-capture .icon {width:22px;height:22px}
  .mission-header {align-items:start;flex-direction:column;gap:13px;padding:17px}
  .mission-tile {gap:12px;padding:12px}
  .level-panel {gap:9px;padding:9px}
  .mission-shortcut .text-link {font-size:0}
  .mission-shortcut .text-link .icon {width:17px;height:17px}
  .hero {align-items:end;min-height:390px;border-radius:11px}
  .hero-art {inset:0 0 auto;height:57%;background-position:right center}
  .hero::before {background:linear-gradient(0deg,#111612 9%,#111612 27%,#111612ed 38%,#11161236 63%,transparent 87%)}
  .hero-copy {padding:124px 17px 17px;max-width:345px}
  .hero h1 {font-size:clamp(61px,13vw,76px);margin:8px 0 9px}
  .hero-copy > p:not(.hero-eyebrow) {margin-bottom:12px}
  .hero-caption {right:7px;top:7px;bottom:auto}
  .hero-tracks {width:7px}
  .stats {gap:6px;margin:9px 0 19px}
  .stat {align-items:start;gap:6px;min-height:64px;padding:7px 5px}
  .stat-icon {width:23px;height:23px;border-radius:5px}
  .stat-icon .icon {width:12px;height:12px}
  .stat-label {font-size:8px;line-height:1.25}
  .stat strong {font-size:24px;margin-top:4px}
  .stat strong small {font-size:6px}
  .section-header {min-height:40px;margin-bottom:8px}
  .section-header h2 {font-size:31px}
  .home-columns {gap:18px}
  .home-cards {grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .home-cards .card-info {flex-direction:column;align-items:start;min-height:75px;padding:6px;gap:3px}
  .home-cards .card-info > div {width:100%}
  .home-cards .card-info h3 {display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal}
  .home-cards .card-points {margin-top:auto}
  .card-image .badge {top:5px;left:5px}
  .badge {gap:3px;padding:4px;font-size:7px}
  .badge i {width:4px;height:4px}
  .card-info h3 {font-size:19px}
  .card-points {font-size:16px}
  .page-heading {align-items:start;flex-direction:column;gap:10px;margin:6px 0 17px}
  .page-heading .button {min-height:38px}
  .deck-cards {grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .deck-cards .card-info {padding:7px;flex-direction:column;align-items:start}
  .deck-tools {gap:5px}
  .deck-count {font-size:9px}
  .rank-labels,.rank-full .rank-row {grid-template-columns:34px 27px minmax(0,1fr) 43px 56px;gap:6px;padding:9px 5px}
  .rank-row .avatar {width:26px;height:26px}
  .rank-labels {font-size:8px}
  .rank-cards {font-size:11px}
  .rank-cards small {font-size:8px}
  .rarity-list {grid-template-columns:repeat(2,minmax(0,1fr))}
  .rarity-list > div {padding:8px}
  .toast {bottom:calc(68px + env(safe-area-inset-bottom))}
}
@media (max-width:370px) {
  .live-status {display:none}
  .stat {flex-direction:column}
  .deck-count {display:none}
  .mobile-nav a {font-size:8px}
  .top-explore span {display:none}
}