:root {
    color-scheme: dark;
    --bg: #080b09;
    --panel: #111512;
    --panel-2: #171c18;
    --border: #28312a;
    --text: #f2f4f2;
    --muted: #8c988e;
    --green: #47e6a1;
    --green-soft: rgba(71, 230, 161, .12);
    --gold: #ffc857;
    --gold-soft: rgba(255, 200, 87, .12);
    --red: #ff6577;
    --blue: #68a7ff;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
    margin: 0;
    min-width: 320px;
    background:
        radial-gradient(circle at 10% -10%, rgba(71, 230, 161, .06), transparent 32rem),
        radial-gradient(circle at 90% 0%, rgba(71, 230, 161, .08), transparent 28rem),
        var(--bg);
    color: var(--text);
    font: 15px/1.5 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a { color: var(--green); }
.page-shell { width: min(1480px, calc(100% - 32px)); margin: 0 auto; padding-bottom: 16px; }
.topbar { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.is-embedded .topbar { display: none; }
.is-embedded .page-shell { padding-top: 16px; }
.brand, .account, .topbar-actions { display: flex; align-items: center; gap: 11px; }
.brand { font-weight: 720; letter-spacing: -.02em; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid #3c4a3f; border-radius: 11px; background: #171d18; color: var(--green); font-size: 12px; letter-spacing: .08em; }
.account { color: #d0dad2; font-size: 13px; }
.topbar-actions { gap: 14px; }
.language-switch { display: flex; padding: 3px; border: 1px solid var(--border); border-radius: 9px; background: #0d100e; }
.language-switch a { min-width: 34px; padding: 4px 7px; border-radius: 6px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-align: center; text-decoration: none; }
.language-switch a:hover { color: var(--text); }
.language-switch a.active { background: #212a23; color: var(--green); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.access-pill, .route-badge { border: 1px solid #323f35; border-radius: 999px; padding: 4px 9px; color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.panel { background: linear-gradient(145deg, rgba(21, 27, 22, .96), rgba(14, 18, 15, .96)); border: 1px solid var(--border); border-radius: 18px; box-shadow: 0 18px 48px rgba(0, 0, 0, .2); }
.hero { min-height: 250px; padding: clamp(26px, 4vw, 52px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 580px); align-items: end; gap: 48px; overflow: hidden; position: relative; }
.hero::after { content: "KORTZ"; position: absolute; right: 3%; top: -44px; color: rgba(255, 255, 255, .018); font-size: clamp(110px, 16vw, 240px); font-weight: 900; letter-spacing: -.08em; pointer-events: none; }
.eyebrow { margin: 0 0 8px; color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: .16em; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 12px; font-size: clamp(34px, 5vw, 64px); line-height: .98; letter-spacing: -.055em; }
h2 { margin-bottom: 0; font-size: clamp(22px, 2vw, 30px); letter-spacing: -.035em; }
h3 { margin-bottom: 0; font-size: 17px; letter-spacing: -.02em; }
.hero-copy { max-width: 630px; margin-bottom: 0; color: var(--muted); font-size: 16px; }
.hero-tunables-update { margin: 12px 0 0; color: var(--muted); font-size: 12px; }
.hero-tunables-update strong { color: var(--green); }
.lookup-form { display: grid; grid-template-columns: minmax(0, 1fr) 142px; gap: 12px; position: relative; z-index: 1; }
.lookup-form label, .form-field { min-width: 0; display: grid; align-content: start; gap: 7px; }
.lookup-form label > span, .form-field > span { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.lookup-form .nickname-label { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.nickname-control { position: relative; display: block; }
.nickname-control input { padding-right: 34px; }
.nickname-clear { position: absolute; z-index: 2; top: 50%; right: 8px; width: 21px; height: 21px; transform: translateY(-50%); border-radius: 4px; background: transparent; color: var(--muted); font-size: 17px; }
.nickname-clear, .nickname-clear:hover, .nickname-clear:focus-visible { transform: translateY(-50%); transition: none; background: transparent; color: var(--muted); outline: 0; }
.saved-nicknames { position: absolute; z-index: 10; top: calc(100% + 5px); right: 0; left: 0; overflow: hidden; border: 1px solid #2d332e; border-radius: 5px; background: #0b0d0b; box-shadow: 0 10px 24px rgba(0,0,0,.35); }
.saved-nickname { display: flex; border-bottom: 1px solid var(--border); }
.saved-nickname:last-child { border-bottom: 0; }
.saved-nickname-value { flex: 1; min-width: 0; padding: 9px 11px; overflow: hidden; background: transparent; color: var(--text); text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.saved-nickname-remove { width: 34px; background: transparent; color: var(--muted); font-size: 16px; }
.saved-nickname-remove, .saved-nickname-remove:hover, .saved-nickname-remove:focus-visible { transform: none; transition: none; background: transparent; color: var(--muted); outline: 0; }
.platform-note { padding: 1px 5px; border: 1px solid rgba(71, 230, 161, .25); border-radius: 4px; background: var(--green-soft); color: var(--green); font-size: 8px; font-weight: 800; letter-spacing: .03em; line-height: 1.4; white-space: nowrap; }
.captcha-field { grid-column: 1 / -1; min-height: 65px; display: flex; align-items: center; }
.captcha-field .cf-turnstile, .captcha-field iframe { width: 100% !important; max-width: 100% !important; }
input, select, button { min-height: 48px; border-radius: 11px; font: inherit; }
input, select { width: 100%; border: 1px solid #323c34; outline: 0; background: #0b0e0c; color: var(--text); padding: 0 14px; }
input:focus, select:focus { border-color: #536b59; box-shadow: 0 0 0 3px rgba(111, 227, 152, .07); }
button { grid-column: 1 / -1; border: 0; cursor: pointer; background: var(--text); color: #0a0d0b; font-weight: 800; transition: transform .15s ease, background .15s ease; user-select: none; -webkit-user-select: none; }
button:hover { transform: translateY(-1px); background: var(--green); }
.custom-combobox { min-width: 0; position: relative; }
.combobox-trigger { grid-column: auto; width: 100%; min-height: 48px; padding: 0 13px; border: 1px solid #323c34; border-radius: 11px; display: flex; align-items: center; justify-content: space-between; gap: 9px; background: #0b0e0c; color: var(--text); font-size: 13px; font-weight: 720; text-align: left; }
.combobox-trigger:hover { transform: none; border-color: #445447; background: #111612; }
.combobox-trigger:focus-visible, .custom-combobox.is-open .combobox-trigger { outline: 0; border-color: #536b59; box-shadow: 0 0 0 3px rgba(111, 227, 152, .07); }
.combobox-trigger > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.combobox-arrow { width: 8px; height: 8px; flex: 0 0 auto; border-right: 1.5px solid #99a99c; border-bottom: 1.5px solid #99a99c; transform: translateY(-2px) rotate(45deg); transition: transform .16s ease; }
.custom-combobox.is-open .combobox-arrow { transform: translateY(2px) rotate(225deg); }
.combobox-menu { width: 100%; padding: 6px; position: absolute; z-index: 30; top: calc(100% + 7px); left: 0; border: 1px solid #3c4a3f; border-radius: 12px; background: rgba(17, 21, 18, .98); box-shadow: 0 18px 45px rgba(0, 0, 0, .55); backdrop-filter: blur(18px); }
.combobox-menu[hidden] { display: none; }
.combobox-option { grid-column: auto; width: 100%; min-height: 39px; padding: 0 10px; border-radius: 8px; display: flex; align-items: center; justify-content: space-between; background: transparent; color: #ccd5ce; font-size: 12px; font-weight: 680; text-align: left; }
.combobox-option::after { content: ""; width: 7px; height: 7px; border-radius: 50%; background: transparent; box-shadow: 0 0 0 3px transparent; }
.combobox-option:hover, .combobox-option:focus-visible { outline: 0; transform: none; background: #1f2620; color: var(--text); }
.combobox-option.is-selected { background: var(--green-soft); color: var(--green); }
.combobox-option.is-selected::after { background: var(--green); box-shadow: 0 0 0 3px rgba(71, 230, 161, .12); }
.combobox-option:disabled, .combobox-option.is-disabled, .combobox-option:disabled:hover { cursor: not-allowed; opacity: .48; background: transparent; color: var(--gold); }
.alert { margin-top: 18px; padding: 16px 18px; border-radius: 13px; display: flex; gap: 8px 16px; flex-wrap: wrap; }
.alert-error { border: 1px solid rgba(255, 101, 119, .35); background: rgba(255, 101, 119, .09); color: #ffc2ca; }
.identity-strip { margin-top: 18px; padding: 18px 22px; display: grid; grid-template-columns: 1.15fr 1fr .65fr; gap: 0; }
.identity-strip div { display: grid; gap: 3px; min-width: 0; padding: 0 18px; border-right: 1px solid var(--border); }
.identity-strip div:first-child { padding-left: 0; }
.identity-strip div:last-child { padding-right: 0; border: 0; }
.identity-strip span, .stat-card span { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.identity-strip strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stat-grid { margin-top: 16px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.stat-card { min-height: 120px; padding: 20px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--border); border-radius: 15px; background: var(--panel); }
.stat-card strong { margin: 7px 0 2px; font-size: clamp(19px, 2vw, 27px); letter-spacing: -.04em; }
.stat-card small { color: var(--muted); }
.stat-card.primary { background: linear-gradient(145deg, rgba(51, 64, 54, .68), var(--panel)); }
.stat-card.door-password { border-color: rgba(71, 230, 161, .34); background: linear-gradient(145deg, rgba(28, 81, 64, .5), var(--panel)); }
.stat-card.door-password strong { color: var(--green); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .08em; white-space: nowrap; }
.stat-card.laser-layout { border-color: rgba(111, 227, 152, .22); background: linear-gradient(145deg, rgba(60, 75, 63, .5), var(--panel)); }
.stat-card.laser-layout strong { color: var(--green); }
.stat-card.laser-layout.is-hard { border-color: rgba(255, 200, 87, .38); background: linear-gradient(145deg, rgba(92, 65, 19, .42), var(--panel)); }
.stat-card.laser-layout.is-hard strong { color: var(--gold); }
.stat-card.mode-status.is-hard { border-color: rgba(255, 200, 87, .38); background: linear-gradient(145deg, rgba(92, 65, 19, .42), var(--panel)); }
.stat-card.mode-status.is-hard strong { color: var(--gold); }
.stat-card.weekly-status.is-available { border-color: rgba(71, 230, 161, .38); background: linear-gradient(145deg, rgba(20, 86, 62, .42), var(--panel)); }
.stat-card.weekly-status.is-available strong { color: var(--green); }
.security-predictions { margin-top: 16px; padding: clamp(22px, 3vw, 32px); overflow: hidden; }
.security-heading { margin-bottom: 10px; }
.security-badges { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.vault-patterns { display: grid; grid-template-columns: repeat(auto-fit, minmax(225px, 1fr)); gap: 12px; }
.vault-pattern { min-width: 0; padding: 15px; border: 1px solid #313c33; border-radius: 13px; background: linear-gradient(145deg, rgba(25, 31, 26, .95), rgba(11, 14, 12, .95)); }
.vault-pattern header { margin-bottom: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.vault-pattern header span { color: var(--green); font-size: 10px; font-weight: 850; letter-spacing: .12em; }
.vault-pattern header code { color: var(--text); font-size: 12px; white-space: nowrap; }
.vault-pattern-grid { padding: 12px; display: grid; grid-auto-flow: row; gap: 9px; border: 1px solid rgba(111, 227, 152, .12); border-radius: 11px; background: #0a0d0b; }
.vault-pattern--normal .vault-pattern-grid { grid-template-columns: repeat(5, minmax(18px, 1fr)); grid-template-rows: repeat(4, minmax(18px, 1fr)); }
.vault-pattern--hard .vault-pattern-grid { grid-template-columns: repeat(6, minmax(18px, 1fr)); grid-template-rows: repeat(5, minmax(18px, 1fr)); }
.vault-button { width: min(100%, 28px); aspect-ratio: 1; place-self: center; border: 1px solid #3d4b40; border-radius: 50%; background: #181d19; box-shadow: inset 0 0 0 3px #0d100e; }
.vault-button.is-active { border-color: #9fdcff; background: #70c8ff; box-shadow: 0 0 0 3px rgba(104, 199, 255, .12), 0 0 16px rgba(104, 199, 255, .68), inset 0 0 0 3px #d9f3ff; }
.vault-column-labels { margin-top: 7px; padding: 0 12px; display: grid; gap: 9px; color: #677369; font: 9px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-align: center; }
.vault-pattern--normal .vault-column-labels { grid-template-columns: repeat(5, minmax(18px, 1fr)); }
.vault-pattern--hard .vault-column-labels { grid-template-columns: repeat(6, minmax(18px, 1fr)); }
.result-tabs { margin-top: 16px; padding: 6px; display: inline-flex; gap: 5px; border: 1px solid var(--border); border-radius: 13px; background: #0f120f; }
.result-tab { min-height: 42px; padding: 0 17px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); font-size: 12px; font-weight: 800; cursor: pointer; }
.result-tab:hover { background: #191f1a; color: var(--text); transform: none; }
.result-tab.is-active { background: #222a23; color: var(--green); box-shadow: inset 0 0 0 1px rgba(71, 230, 161, .16); }
.result-tab span { margin-left: 7px; padding: 2px 6px; border-radius: 999px; background: rgba(255, 255, 255, .07); color: inherit; font-size: 10px; }
.result-tab-panel[hidden] { display: none !important; }
.primary-showcase { margin-top: 16px; min-height: 330px; display: grid; grid-template-columns: 394px minmax(0, 1fr); overflow: hidden; }
.primary-art { width: 394px; min-width: 394px; max-width: 394px; height: 510px; min-height: 510px; position: relative; align-self: start; background: #0c0f0d; overflow: hidden; }
.primary-art img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: contain; object-position: center; }
.primary-info { min-width: 0; padding: clamp(24px, 4vw, 42px); display: flex; flex-direction: column; justify-content: center; }
.primary-info h2 { font-size: clamp(29px, 4vw, 48px); }
.primary-claim-badge { width: max-content; padding: 3px 7px; border: 1px solid rgba(71, 230, 161, .34); border-radius: 999px; background: rgba(71, 230, 161, .12); color: var(--green); font-size: 8px; font-weight: 850; letter-spacing: .09em; }
.current-payout { margin: 2px 0 18px; padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px 18px; border: 1px solid rgba(71, 230, 161, .24); border-radius: 12px; background: rgba(71, 230, 161, .055); }
.current-payout span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.current-payout strong { grid-row: span 2; color: var(--green); font-size: clamp(22px, 3vw, 32px); }
.current-payout small { color: #b0bdb3; }
.primary-code { margin: 10px 0 22px; display: flex; align-items: center; gap: 10px; }
.primary-prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.primary-prices > div { min-width: 0; padding: 14px 15px; border: 1px solid rgba(71, 230, 161, .2); border-radius: 11px; background: var(--green-soft); display: grid; gap: 2px; }
.primary-prices > div.compromised { border-color: rgba(255, 101, 119, .18); background: rgba(255, 101, 119, .07); }
.primary-prices span { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.primary-prices strong { color: var(--green); font-size: 21px; }
.primary-prices .compromised strong { color: #ff9aa6; }
.primary-prices small { color: #b0bcb2; }
.current-primary-prices strong { font-size: clamp(26px, 3vw, 36px); letter-spacing: -.04em; }
.other-prices-button { grid-column: auto; width: max-content; min-height: 40px; margin-top: 11px; padding: 0 14px; border: 1px solid #3c4a3f; border-radius: 10px; display: flex; align-items: center; gap: 26px; background: #1b211c; color: #e1e7e2; font-size: 11px; letter-spacing: .04em; }
.other-prices-button:hover { border-color: rgba(71, 230, 161, .38); background: #212a23; color: var(--green); transform: translateY(-1px); }
.primary-note { margin: 16px 0 0; color: var(--muted); font-size: 12px; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 22px; }
.route-badge { color: var(--green); border-color: rgba(71, 230, 161, .25); background: var(--green-soft); white-space: nowrap; }
.route-badge.gold { color: var(--gold); border-color: rgba(255, 200, 87, .25); background: var(--gold-soft); }
.team-pick-thumb { display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; border: 1px solid #323c34; background: linear-gradient(145deg, #212923, #101511); color: #b5c0b7; font: 800 10px ui-monospace, monospace; }
.team-pick-thumb img { width: 100%; height: 100%; object-fit: contain; }
.empty { color: var(--muted); }
.team-section { margin-top: 16px; padding: clamp(22px, 3vw, 32px); }
.team-heading { align-items: end; }
.team-heading > p { max-width: 660px; margin: 0; color: var(--muted); font-size: 13px; }
.team-routes { display: grid; gap: 12px; }
.team-route { overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: #0d110e; }
.team-route[open] { border-color: rgba(71, 230, 161, .24); }
.team-route.buyer-team-route[open] { border-color: rgba(255, 200, 87, .27); }
.team-route.balanced-team-route[open] { border-color: rgba(104, 167, 255, .32); }
.team-route summary { min-height: 72px; padding: 15px 18px; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; background: rgba(255, 255, 255, .018); }
.team-route summary::-webkit-details-marker { display: none; }
.team-route summary > span:first-child { display: grid; }
.team-route summary small { color: var(--green); font-size: 9px; font-weight: 850; letter-spacing: .13em; }
.buyer-team-route summary small { color: var(--gold); }
.balanced-team-route summary small { color: var(--blue); }
.team-route summary > span:last-child { color: var(--green); font-size: 20px; font-weight: 800; letter-spacing: -.03em; white-space: nowrap; }
.buyer-team-route summary > span:last-child { color: var(--gold); }
.balanced-team-route summary > span:last-child { color: var(--blue); }
.team-route-body { padding: 18px; border-top: 1px solid var(--border); }
.team-route-controls { margin-bottom: 18px; padding: 14px; border: 1px solid rgba(111, 227, 152, .18); border-radius: 12px; display: flex; align-items: end; justify-content: space-between; gap: 18px; background: rgba(111, 227, 152, .045); }
.team-route-selector { width: min(240px, 100%); flex: 0 0 auto; }
.team-route-controls p { max-width: 520px; margin: 0 0 5px; color: var(--muted); font-size: 12px; text-align: right; }
.team-route-plan[hidden] { display: none; }
.team-total { margin-bottom: 14px; display: flex; align-items: baseline; justify-content: flex-end; gap: 12px; color: var(--muted); }
.team-total strong { color: var(--green); font-size: 22px; }
.buyer-team-route .team-total strong { color: var(--gold); }
.balanced-team-route .team-total strong { color: var(--blue); }
.team-total small { font-size: 11px; }
.team-bags { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.team-bags-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.team-bags-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.team-bag { min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: #101511; }
.team-bag header { min-height: 71px; padding: 12px; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 9px; border-bottom: 1px solid var(--border); }
.team-bag header > span { display: grid; min-width: 0; }
.team-bag header small { color: var(--muted); font-size: 9px; }
.player-order { width: 30px; height: 30px; place-items: center; border-radius: 50%; background: var(--green-soft); color: var(--green); font-weight: 850; }
.buyer-team-route .player-order { background: var(--gold-soft); color: var(--gold); }
.balanced-team-route .player-order { background: rgba(104, 167, 255, .12); color: var(--blue); }
.team-bag-value { justify-items: end; text-align: right; }
.team-bag-value strong { color: var(--green); font-size: 13px; }
.buyer-team-route .team-bag-value strong { color: var(--gold); }
.balanced-team-route .team-bag-value strong { color: var(--blue); }
.team-picks { margin: 0; padding: 8px; list-style: none; display: grid; gap: 6px; }
.team-picks li { min-width: 0; padding: 6px; display: grid; grid-template-columns: 54px minmax(0, 1fr); align-items: center; gap: 9px; border-radius: 8px; background: rgba(255, 255, 255, .018); }
.team-pick-thumb { width: 52px; height: 52px; border-radius: 8px; }
.team-picks li > span:last-child { min-width: 0; display: grid; }
.team-picks strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.team-picks small { color: var(--muted); font-size: 9px; }
.buyer-target-mark { color: var(--gold); font-size: .85em; font-weight: 900; }
.team-route-warning { color: var(--gold) !important; }
.team-empty { margin: 0; padding: 18px 12px; color: var(--muted); font-size: 11px; text-align: center; }
.loot-section { margin-top: 16px; padding: clamp(22px, 3vw, 32px); }
.legend { display: flex; flex-wrap: wrap; gap: 12px; color: var(--muted); font-size: 11px; }
.legend span { display: flex; align-items: center; gap: 6px; }
.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.dot.buyer { background: var(--gold); }.dot.owned { background: var(--red); }.dot.last { background: var(--blue); }.dot.team { background: #b596ff; }
.loot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.loot-card { min-width: 0; border: 1px solid var(--border); border-radius: 14px; background: #0f120f; overflow: hidden; display: grid; grid-template-columns: 154px minmax(0, 1fr); }
.loot-card.is-buyer { border-color: rgba(255, 200, 87, .4); }
.loot-card.is-unavailable { opacity: .5; filter: grayscale(.35); }
.loot-visual { min-height: 150px; position: relative; display: grid; place-items: center; background: linear-gradient(145deg, #1d241e, #101511); overflow: hidden; }
.loot-visual img { width: 100%; height: 100%; object-fit: contain; position: absolute; inset: 0; }
.loot-monogram { font-size: 42px; font-weight: 850; color: #4e5f51; }
.loot-index, .guide-label { position: absolute; z-index: 1; border: 1px solid rgba(255, 255, 255, .13); background: rgba(8, 9, 8, .92); }
.loot-index { left: 8px; top: 8px; padding: 3px 6px; border-radius: 6px; font: 700 10px ui-monospace, monospace; }
.guide-label { left: 8px; bottom: 8px; right: 8px; padding: 3px 5px; border-radius: 5px; color: #d1dad3; font-size: 8px; text-align: center; text-transform: uppercase; letter-spacing: .06em; }
.loot-body { min-width: 0; padding: 14px; display: flex; flex-direction: column; justify-content: center; }
.loot-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.loot-title p { margin: 2px 0 0; color: #b4beb6; font-size: 11px; }
.loot-title > strong { color: var(--green); white-space: nowrap; }
.loot-meta { margin-top: 12px; display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #afbfb2; font-size: .92em; }
.model-line { margin-top: 5px; color: #5e6b61; font-size: 9px; }
.badges { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 12px; }
.badge { padding: 3px 6px; border-radius: 5px; background: #1e2620; color: #96a399; font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.badge-buyer { background: var(--gold-soft); color: var(--gold); }
.badge-owned { background: rgba(255, 101, 119, .12); color: var(--red); }
.badge-last { background: rgba(104, 167, 255, .11); color: var(--blue); }
.badge-team { background: rgba(181, 150, 255, .12); color: #c9adff; }
.badge-player-warning { background: rgba(255, 101, 119, .16); color: #ff8d9b; border: 1px solid rgba(255, 101, 119, .3); }
.badge-cutter { background: rgba(82, 217, 232, .12); color: #7fd8e4; }
.dot.cutter { background: #52d9e8; }
.source-note { margin: 22px 0 0; color: var(--muted); font-size: 12px; }
.raw-stats { margin-top: 16px; padding: 20px 24px; }
.raw-stats summary { cursor: pointer; font-weight: 700; }
.raw-stats dl { margin: 18px 0 0; display: grid; gap: 7px; }
.raw-stats dl div { display: flex; justify-content: space-between; gap: 20px; padding: 8px 0; border-top: 1px solid var(--border); }
.raw-stats dt { color: var(--muted); }.raw-stats dd { margin: 0; font-family: ui-monospace, monospace; }.raw-stats dd small { color: var(--muted); }
.painting-collection { margin-top: 16px; padding: clamp(22px, 3vw, 34px); }
.collection-heading { margin-bottom: 24px; display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; }
.collection-heading h2 { margin-bottom: 8px; font-size: clamp(28px, 4vw, 44px); }
.collection-heading p:not(.eyebrow) { max-width: 720px; margin-bottom: 0; color: var(--muted); }
.collection-progress { min-width: 150px; display: grid; grid-template-columns: auto auto; justify-content: end; align-items: baseline; text-align: right; }
.collection-progress strong { color: var(--green); font-size: 42px; }
.collection-progress span { color: var(--muted); font-size: 20px; }
.collection-progress small { grid-column: 1 / -1; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.painting-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.painting-card { min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: #0e110e; cursor: pointer; transition: opacity .2s ease, filter .2s ease, border-color .2s ease, transform .2s ease; }
.painting-card.is-owned { border-color: rgba(71, 230, 161, .25); }
.painting-card.is-missing { opacity: .34; filter: grayscale(1); }
.painting-card:hover { transform: translateY(-2px); }
.painting-card.is-missing:hover { opacity: .48; }
.painting-card:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.painting-image { height: 230px; position: relative; overflow: hidden; background: #0a0d0b; }
.painting-image img { width: 100%; height: 100%; object-fit: contain; }
.painting-number, .painting-state { position: absolute; z-index: 1; padding: 4px 7px; border: 1px solid rgba(255, 255, 255, .13); border-radius: 6px; background: rgba(8, 9, 8, .94); font-size: 9px; font-weight: 850; letter-spacing: .07em; }
.painting-number { left: 9px; top: 9px; font-family: ui-monospace, monospace; }
.painting-state { right: 9px; top: 9px; color: var(--muted); }
.painting-card.is-owned .painting-state { color: var(--green); border-color: rgba(71, 230, 161, .25); }
.painting-info { padding: 14px 15px 16px; }
.painting-info h3 { min-height: 2.4em; margin-bottom: 7px; font-size: 14px; line-height: 1.2; }
.painting-info > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.painting-info code { color: var(--muted); font-size: 9px; }
.painting-price-link { color: var(--green); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.primary-history-card.is-stolen { border-color: rgba(104, 167, 255, .3); }
.primary-history-card.is-stolen .painting-state { color: var(--blue); border-color: rgba(104, 167, 255, .3); }
.primary-history-card.is-kept { border-color: rgba(71, 230, 161, .3); }
.primary-history-card.is-kept .painting-state { color: var(--green); border-color: rgba(71, 230, 161, .3); }
.primary-history-card.is-not-stolen { opacity: .3; filter: grayscale(1); }
.primary-history-card.is-not-stolen:hover { opacity: .45; }
.primary-history-progress strong { color: var(--blue); }
.painting-fallback { width: 100%; height: 100%; display: grid; place-items: center; color: #455248; font-size: 54px; font-weight: 900; }
.weekly-primary-pool { margin-top: 16px; padding: clamp(22px, 3vw, 34px); }
.weekly-pool-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.weekly-pool-card.is-unowned { opacity: .72; }
.weekly-pool-card.is-unowned:hover { opacity: .9; }
.weekly-pool-status strong, .weekly-pool-progress strong { color: var(--green); }
.weekly-pool-status.is-stale strong, .weekly-primary-pool .source-note.is-stale { color: var(--gold); }

.route-map-panel { --route-map-fit-width: clamp(420px, 52vw, 820px); margin-top: 16px; padding: clamp(22px, 3vw, 34px); }
.route-map-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; }
.route-map-heading h2 { font-size: clamp(28px, 4vw, 44px); }
.map-vault-patterns { width: 100%; min-width: 0; display: grid; grid-column: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.map-vault-patterns--hard { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.map-vault-pattern { min-width: 0; padding: 8px; display: grid; grid-template-columns: max-content minmax(0, var(--map-vault-grid-width, 140px)); align-items: center; justify-content: center; gap: 6px; border: 1px solid #313c33; border-radius: 9px; background: #0a0d0b; }
.map-vault-round { color: var(--muted); font: 800 10px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-align: center; }
.map-vault-grid { width: min(100%, 140px); min-width: 0; display: grid; grid-auto-flow: row; gap: 4px; line-height: 0; }
.map-vault-pattern--normal .map-vault-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.map-vault-pattern--hard .map-vault-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }

@media (max-width: 700px) {
    .map-vault-patterns--hard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
    .map-vault-patterns--normal { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 1180px) {
    .map-vault-patterns { width: clamp(100px, min(10vw, 20vh), 144px); z-index: 2; grid-row: 1; justify-self: start; grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .map-vault-pattern { padding: 4px; }
    .map-vault-grid { gap: 2px; }
}
.map-vault-dot { width: 100%; aspect-ratio: 1; display: block; box-sizing: border-box; border: 1px solid #3d4b40; border-radius: 50%; background: #181d19; box-shadow: inset 0 0 0 1px #0d100e; }
.map-vault-dot.is-active { border-color: #9fdcff; background: #70c8ff; box-shadow: 0 0 6px rgba(104, 199, 255, .65), inset 0 0 0 1px #d9f3ff; }
.map-vault-col { margin-top: 2px; color: #677369; font: 9px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; text-align: center; }
.route-map-summary { max-width: 840px; display: grid; grid-template-columns: minmax(480px, 1fr) minmax(210px, auto); gap: 8px; }
.route-map-totals { display: grid; grid-template-columns: repeat(4, minmax(96px, 1fr)); gap: 8px; }
.route-map-totals[hidden] { display: none !important; }
.route-map-totals > span { min-width: 112px; padding: 10px 13px; display: grid; gap: 1px; border: 1px solid var(--border); border-radius: 11px; background: #0e110e; }
.route-map-totals small { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.route-map-totals strong { color: var(--green); font-size: 18px; }
.route-map-totals em { color: var(--muted); font-size: 8px; font-style: normal; font-weight: 750; }
.route-password-summary { min-width: 210px; padding: 10px 13px; display: grid; align-content: center; gap: 1px; border: 1px solid rgba(255, 200, 87, .3); border-radius: 11px; background: rgba(255, 200, 87, .07); }
.route-password-summary small { color: #ffc857; font-size: 9px; font-weight: 850; letter-spacing: .1em; }
.route-password-summary strong { color: #fff1bc; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 20px; letter-spacing: .08em; }
.route-password-summary span { color: var(--muted); font-size: 8px; white-space: nowrap; }
.map-plan-picker { margin: clamp(12px, 2vh, 20px) 0 10px; display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 7px; }
.map-plan-option { grid-column: auto; min-width: 0; min-height: 62px; padding: 9px 10px; display: grid; align-content: center; gap: 3px; border: 1px solid #2f3b32; border-radius: 9px; background: #121713; color: var(--text); text-align: left; }
.map-plan-option strong { overflow: hidden; font-size: 11px; line-height: 1.2; text-overflow: ellipsis; }
.map-plan-option span { color: var(--muted); font-size: 8px; font-weight: 600; line-height: 1.25; }
.map-plan-option:hover, .map-plan-option:focus-visible { outline: 0; transform: none; border-color: #5d6f61; background: #1c231d; }
.map-plan-option.is-active { border-color: rgba(71, 230, 161, .5); background: linear-gradient(145deg, rgba(71, 230, 161, .15), rgba(71, 230, 161, .04)); box-shadow: inset 0 0 0 1px rgba(71, 230, 161, .08); }
.map-plan-option.is-active strong { color: var(--green); }
.map-display-toolbar { margin-bottom: 10px; padding: 9px 12px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; border: 1px solid var(--border); border-radius: 12px; background: #0e110e; }
.map-player-picker { min-width: 0; display: grid; gap: 7px; }
.map-player-picker > span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.map-player-picker > div { display: flex; flex-wrap: wrap; gap: 6px; }
.map-player-warning { max-width: 620px; margin: 0; font-size: 10px; }
.map-player-toggle { grid-column: auto; width: auto; min-height: 35px; padding: 0 9px; display: flex; align-items: center; gap: 6px; border: 1px solid #313c33; border-radius: 8px; background: #151b16; color: var(--muted); font-size: 10px; }
.map-player-toggle[hidden] { display: none !important; }
.map-player-toggle i, .route-bag-card header i { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--route-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--route-color) 16%, transparent); }
.map-player-toggle small { color: var(--route-color); font-size: 8px; }
.map-player-toggle:hover, .map-player-toggle:focus-visible { outline: 0; transform: none; border-color: var(--route-color); background: #1b221c; }
.map-player-toggle.is-active { border-color: color-mix(in srgb, var(--route-color) 50%, #2f3b32); background: color-mix(in srgb, var(--route-color) 10%, #111612); color: var(--text); }
.map-player-toggle:not(.is-active) { opacity: .48; }
.map-floor-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px 13px; color: var(--muted); font-size: 9px; }
.map-floor-legend span { display: flex; align-items: center; gap: 5px; }
.floor-symbol { width: 8px; height: 8px; display: inline-block; border: 1px solid #e3e8e4; background: #6e7d71; }
.floor-symbol--main { border-radius: 50%; }
.floor-symbol--upper { border-radius: 1px; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.floor-symbol--lower { border-radius: 1px; clip-path: polygon(50% 100%, 0 20%, 100% 20%); }
.route-map-layout { width: 100%; max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; justify-content: center; }
.route-map-canvas { width: 100%; min-width: 0; position: relative; grid-column: 1; grid-row: 1; justify-self: center; overflow: hidden; border: 1px solid #303b32; border-radius: 15px; background: #080908; box-shadow: inset 0 0 45px rgba(0, 0, 0, .4); transform: translateX(calc(-1 * var(--route-map-shift-x, 0px))); transition: aspect-ratio .18s ease, transform .18s ease; }
.route-map-canvas--overview { max-width: var(--route-map-fit-width); aspect-ratio: auto; }
.route-map-background { width: 100%; height: 100%; position: relative; overflow: hidden; display: block; object-fit: contain; }
.route-map-background[hidden] { display: none !important; }
.route-map-background--overview { height: auto; min-height: 0; padding: 9px; background: #0c0f0d; }
.route-overview-grid { min-height: 0; display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(140px, .85fr); grid-template-rows: max-content max-content; align-items: start; align-content: start; gap: 9px; }
.route-overview-grid.is-gallery-only { grid-template-columns: minmax(0, 600px); justify-content: center; }
.route-overview-grid.is-side-only { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.route-overview-grid.is-side-only.is-single-panel { grid-template-columns: minmax(0, 620px); justify-content: center; }
.route-overview-panel { min-width: 0; position: relative; overflow: hidden; border: 1px solid #303c32; border-radius: 9px; background: #1a211c; }
.route-overview-panel[hidden] { display: none !important; }
.route-overview-panel--gallery { grid-column: 1; grid-row: 1 / span 2; aspect-ratio: 399.15 / 541.5; }
.route-overview-panel--loading { grid-column: 2; grid-row: 1; aspect-ratio: 1612.4 / 971; }
.route-overview-panel--vault { grid-column: 2; grid-row: 2; aspect-ratio: 300 / 210; background: #373737; }
.route-overview-grid.is-gallery-only .route-overview-panel--gallery { grid-column: 1; grid-row: 1; }
.route-overview-grid.is-side-only .route-overview-panel--loading, .route-overview-grid.is-side-only .route-overview-panel--vault { grid-column: auto; grid-row: 1; }
.route-overview-panel--loading > img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: fill; }
.route-overview-gallery-background, .route-overview-vault-background { width: 100%; height: 100%; position: absolute; inset: 0; overflow: hidden; display: block; pointer-events: none; }
.route-overview-gallery-background img { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: fill; }
.route-overview-gallery-background img[hidden] { display: none !important; }
.route-overview-gallery-background img[data-map-floor-image=lower] { z-index: 1; opacity: 1; mix-blend-mode: normal; clip-path: inset(0 50% 0 0); filter: brightness(.8); }
.route-overview-gallery-background img[data-map-floor-image=main] { z-index: 2; opacity: 1; mix-blend-mode: lighten; }
.route-overview-gallery-background img[data-map-floor-image=upper] { z-index: 3; opacity: .55; mix-blend-mode: screen; }
.route-overview-gallery-background.is-single-floor img { opacity: 1; mix-blend-mode: normal; }
.route-overview-vault-background img { width: calc(537.467% + 3px); max-width: none; height: calc(462.381% + 3px); position: absolute; left: calc(-93.333% - 1px); top: calc(-361.905% - 1px); object-fit: fill; }
.route-overview-label { padding: 5px 7px; position: absolute; z-index: 6; top: 6px; left: 6px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 6px; background: rgba(8, 10, 8, .82); color: #dee4df; font-size: 7px; font-weight: 850; letter-spacing: .1em; pointer-events: none; }
.route-overview-panel .route-line { stroke-width: 6; }
.route-map-lines { width: 100%; height: 100%; position: absolute; z-index: 4; inset: 0; overflow: visible; pointer-events: none; }
.route-line { fill: none; stroke: var(--route-color, var(--green)); stroke-width: 5; stroke-dasharray: 13 10; stroke-linecap: round; stroke-linejoin: round; opacity: .78; filter: drop-shadow(0 0 6px rgba(0, 0, 0, .8)); }
.route-line--upper { stroke-dasharray: 3 12; opacity: .92; }
.route-player-1 { --route-color: #47e6a1; }
.route-player-2 { --route-color: #68a7ff; }
.route-player-3 { --route-color: #ffc857; }
.route-player-4 { --route-color: #c49bff; }
.route-marker { grid-column: auto; width: 16px; min-width: 16px; height: 16px; min-height: 16px; padding: 0; position: absolute; z-index: 5; transform: translate(-50%, -50%); border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: transparent; cursor: pointer; }
.route-marker::before { width: 10px; height: 10px; position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%); content: ''; border: 0; border-radius: 50%; background: var(--route-color, var(--green)); box-shadow: 0 1px 5px rgba(0, 0, 0, .95); transition: transform .12s ease, box-shadow .12s ease; }
.route-marker.is-buyer::after { content: '[B]'; position: absolute; left: 18px; top: -7px; padding: 2px 4px; border: 1px solid rgba(255, 200, 87, .45); border-radius: 4px; background: rgba(12, 14, 12, .94); color: var(--gold); font: 900 8px/1 ui-monospace, monospace; }
.route-marker[data-source-floor=upper]::before { border-radius: 1px; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.route-marker > span { display: none; }
.route-marker[data-loot-id=loot-0] { left: 54.310%; top: 81.337%; }
.route-marker[data-loot-id=loot-1] { left: 67.483%; top: 89.049%; }
.route-marker[data-loot-id=loot-2] { left: 77.044%; top: 64.133%; }
.route-marker[data-loot-id=loot-3] { left: 76.951%; top: 53.882%; }
.route-marker[data-loot-id=loot-4] { left: 31.071%; top: 91.224%; }
.route-marker[data-loot-id=loot-5] { left: 47.040%; top: 81.476%; }
.route-marker[data-loot-id=loot-6] { left: 54.376%; top: 88.916%; }
.route-marker[data-loot-id=loot-7] { left: 81.972%; top: 88.903%; }
.route-marker[data-loot-id=loot-8] { left: 77.139%; top: 75.343%; }
.route-marker[data-loot-id=loot-9] { left: 77.219%; top: 43.180%; }
.route-marker[data-loot-id=loot-10] { left: 13.120%; top: 58.766%; }
.route-marker[data-loot-id=loot-11] { left: 55.170%; top: 74.578%; }
.route-marker[data-loot-id=loot-12] { left: 74.426%; top: 89.564%; }
.route-marker[data-loot-id=loot-13] { left: 55.150%; top: 43.186%; }
.route-marker[data-loot-id=loot-14] { left: 55.160%; top: 46.486%; }
.route-marker[data-loot-id=loot-15] { left: 37.437%; top: 40.052%; }
.route-marker[data-loot-id=loot-16] { left: 27.466%; top: 91.060%; }
.route-marker[data-loot-id=loot-17] { left: 23.816%; top: 91.110%; }
.route-marker[data-loot-id=loot-18] { left: 26.148%; top: 69.908%; }
.route-marker[data-loot-id=loot-19] { left: 26.146%; top: 78.412%; }
.route-marker[data-loot-id=loot-20] { left: 76.177%; top: 80.493%; }
.route-marker[data-loot-id=loot-21] { left: 91.620%; top: 85.280%; }
.route-marker[data-loot-id=loot-22] { left: 61.824%; top: 70.994%; }
.route-marker[data-loot-id=loot-23] { left: 66.085%; top: 81.302%; }
.route-marker[data-loot-id=loot-24] { left: 71.367%; top: 77.717%; }
.route-marker[data-loot-id=loot-25] { left: 61.694%; top: 48.427%; }
.route-marker[data-loot-id=loot-26] { left: 70.988%; top: 41.522%; }
.route-marker[data-loot-id=loot-27] { left: 65.707%; top: 37.937%; }
.route-marker[data-loot-id=loot-28] { left: 30.527%; top: 73.995%; }
.route-marker[data-loot-id=loot-29] { left: 30.527%; top: 53.010%; }
.route-marker[data-loot-id=loot-30] { left: 56.070%; top: 55.652%; }
.route-marker[data-loot-id=loot-31] { left: 56.070%; top: 76.014%; }
.route-marker[data-loot-id=loot-32] { left: 44.130%; top: 43.790%; }
.route-marker:hover, .route-marker:focus-visible, .route-marker[aria-expanded=true] { z-index: 5; transform: translate(-50%, -50%); outline: 0; background: transparent; }
.route-marker:hover::before, .route-marker:focus-visible::before, .route-marker[aria-expanded=true]::before { transform: translate(-50%, -50%) scale(1.35); box-shadow: 0 2px 7px rgba(0, 0, 0, .95); }
.route-marker[hidden], .route-line[hidden], .route-map-lines[hidden], .route-bag-card[hidden], [data-map-route][hidden] { display: none !important; }
.route-map-lines.is-route-player-hidden, .route-marker.is-route-player-hidden, .route-bag-card.is-route-player-hidden { display: none !important; visibility: hidden !important; opacity: 0 !important; }
.route-marker-popup { width: min(276px, calc(100% - 20px)); min-height: 82px; padding: 8px 38px 8px 8px; position: absolute; z-index: 12; left: 50%; top: 10px; bottom: auto; transform: translateX(-50%); display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid color-mix(in srgb, var(--route-color, #748177) 50%, #425045); border-radius: 11px; background: rgba(11, 14, 12, .96); box-shadow: 0 12px 32px rgba(0, 0, 0, .72); backdrop-filter: blur(8px); }
.route-marker-popup[hidden] { display: none !important; }
/* Loot without a preview image (e.g. the Loading Bay crate) would otherwise leave
   the text crammed into the 72px image column with the rest of the card empty. */
.route-marker-popup.is-imageless { min-height: 56px; grid-template-columns: minmax(0, 1fr); }
.route-marker-popup img { width: 72px; height: 64px; border-radius: 7px; background: #060807; object-fit: contain; }
.route-marker-popup > span { min-width: 0; display: grid; gap: 3px; }
.route-marker-popup small { color: var(--route-color, var(--muted)); font-size: 9px; font-weight: 800; }
.route-marker-popup strong { overflow: hidden; color: var(--text); font-size: 12px; line-height: 1.25; text-overflow: ellipsis; }
.route-marker-popup-close { grid-column: auto; width: 26px; min-width: 26px; height: 26px; min-height: 26px; padding: 0; position: absolute; top: 6px; right: 6px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .045); color: #a0aca2; font-size: 17px; font-weight: 500; line-height: 1; }
.route-marker-popup-close:hover, .route-marker-popup-close:focus-visible { transform: none; outline: 0; background: rgba(255, 255, 255, .11); color: #fff; }
.route-color-gold { --route-color: #ffc857; }
.route-color-blue { --route-color: #68a7ff; }
.route-color-green { --route-color: #47e6a1; }
.route-color-cyan { --route-color: #52d9e8; }
.route-color-mixed { --route-color: #71d4ff; }
.route-color-violet { --route-color: #b596ff; }
.route-color-red { --route-color: #ff6577; }
.route-bag-list { width: 320px; min-width: 0; display: grid; grid-column: 1; grid-row: 1; justify-self: end; align-content: start; gap: 8px; }
.route-bag-card { min-width: 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--route-color) 35%, #2f3b32); border-left: 3px solid var(--route-color); border-radius: 11px; background: #0f120f; }
.route-bag-card > header { min-height: 45px; padding: 7px 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--route-color) 7%, #111612); }
.route-bag-card > header > span { min-width: 0; display: flex; align-items: center; gap: 6px; }
.route-bag-card > header > span:last-child { justify-content: flex-end; }
.route-bag-card > header strong { font-size: 11px; white-space: nowrap; }
.route-bag-card > header > span:last-child strong { color: var(--route-color); font-size: 13px; }
.route-bag-card > header small { color: var(--muted); font-size: 8px; }
.route-bag-card > header > span:first-child small { color: var(--route-color); }
.route-bag-items { padding: 6px; display: grid; gap: 4px; }
.route-bag-item { grid-column: auto; width: 100%; min-height: 31px; padding: 4px 6px; display: grid; grid-template-columns: minmax(0, 1fr) 24px auto; align-items: center; gap: 6px; border: 1px solid transparent; border-radius: 7px; background: #121713; color: #d1d9d3; text-align: left; }
.route-bag-item[hidden] { display: none !important; }
.route-bag-item > span { overflow: hidden; font-size: 9px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.route-bag-item > small { min-width: 22px; padding: 2px 3px; border-radius: 4px; background: #232c25; color: var(--muted); font-size: 7px; text-align: center; }
.route-bag-item > strong { color: var(--route-color); font-size: 9px; white-space: nowrap; }
.route-bag-item:hover, .route-bag-item:focus-visible { outline: 0; transform: none; border-color: color-mix(in srgb, var(--route-color) 35%, #2f3b32); background: color-mix(in srgb, var(--route-color) 7%, #151b16); }
.route-bag-empty { min-height: 40px; display: grid; place-items: center; color: var(--muted); font-size: 9px; }
.zoomable-image { cursor: zoom-in; }
.zoomable-image:focus-visible { outline: 2px solid var(--green); outline-offset: -3px; }
body.lightbox-open { overflow: hidden; }
.image-lightbox { position: fixed; inset: 0; z-index: 1000; display: none; padding: clamp(10px, 2vw, 26px); background: rgba(4, 5, 4, .94); backdrop-filter: blur(12px); }
.image-lightbox.is-open { display: grid; place-items: center; }
.lightbox-shell { width: min(920px, 100%); height: min(720px, 100%); min-height: 0; overflow: hidden; display: flex; flex-direction: column; border: 1px solid #3c4a3f; border-radius: 14px; background: #0a0c0a; box-shadow: 0 28px 90px rgba(0, 0, 0, .65); transition: width .18s ease, height .18s ease; }
.lightbox-toolbar { min-height: 48px; padding: 7px 9px 7px 16px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--border); }
.lightbox-toolbar > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 750; }
.lightbox-toolbar > div { display: flex; gap: 8px; }
.lightbox-button { min-height: 30px; min-width: 30px; padding: 0; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .055); color: #b0bbb2; cursor: pointer; font-size: 17px; font-weight: 500; }
.lightbox-button:hover, .lightbox-button:focus-visible { outline: 0; background: rgba(255, 255, 255, .12); color: #fff; transform: none; }
.lightbox-close { width: 30px; min-width: 30px; height: 30px; min-height: 30px; line-height: 1; }
.lightbox-frame { min-height: 0; flex: 1 1 auto; overflow: auto; display: grid; place-items: center; padding: clamp(10px, 1.5vw, 20px); }
.lightbox-frame img { display: block; width: min(100%, 1200px); max-height: 100%; object-fit: contain; cursor: zoom-in; }
.image-lightbox.is-secondary-target .lightbox-shell { width: min(430px, 100%); height: min(455px, 100%); }
.image-lightbox.is-secondary-target:not(.is-zoomed) .lightbox-frame { overflow: hidden; }
.image-lightbox.is-secondary-target:not(.is-zoomed) .lightbox-frame img { width: min(330px, 100%); max-height: min(330px, calc(100vh - 120px)); }
.image-lightbox.is-zoomed .lightbox-shell { width: min(1500px, 100%); height: min(940px, 100%); }
.image-lightbox.is-secondary-target.is-zoomed .lightbox-shell { width: min(820px, 100%); height: min(760px, 100%); }
.image-lightbox.is-zoomed .lightbox-frame { display: block; text-align: center; }
.image-lightbox.is-zoomed .lightbox-frame img { width: 1600px; max-width: none; max-height: none; margin: 0 auto; cursor: zoom-out; image-rendering: auto; }
.image-lightbox.is-secondary-target.is-zoomed .lightbox-frame img { width: 640px; }
body.price-modal-open { overflow: hidden; }
.price-modal { position: fixed; inset: 0; z-index: 1100; display: none; place-items: center; padding: clamp(12px, 3vw, 30px); background: rgba(4, 5, 4, .88); backdrop-filter: blur(12px); }
.price-modal.is-open { display: grid; }
.price-modal-shell { width: min(790px, 100%); max-height: 100%; position: relative; overflow: auto; border: 1px solid #3c4a3f; border-radius: 18px; background: linear-gradient(145deg, #161c17, #0c0f0d); box-shadow: 0 30px 100px rgba(0, 0, 0, .7); }
.price-modal-close { grid-column: auto; width: 30px; min-width: 30px; height: 30px; min-height: 30px; padding: 0; position: absolute; z-index: 2; top: 13px; right: 13px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .065); color: #b0bbb2; font-size: 17px; font-weight: 500; line-height: 1; }
.price-modal-close:hover, .price-modal-close:focus-visible { outline: 0; background: rgba(255, 255, 255, .13); color: #fff; transform: none; }
.price-modal-header { min-height: 170px; padding: 25px 72px 25px 25px; display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: center; gap: 25px; border-bottom: 1px solid var(--border); }
.price-modal-header img { width: 170px; height: 120px; border-radius: 10px; background: #090c0a; object-fit: contain; }
.price-modal-header h2 { margin-bottom: 5px; font-size: clamp(24px, 4vw, 36px); }
.price-table-wrap { overflow-x: auto; padding: 22px 25px 0; }
.price-table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; }
.price-table th, .price-table td { padding: 14px 16px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); text-align: right; }
.price-table tr > *:last-child { border-right: 0; }
.price-table tbody tr:last-child > * { border-bottom: 0; }
.price-table thead th { background: #181e19; color: var(--muted); font-size: 10px; letter-spacing: .1em; }
.price-table thead th:first-child, .price-table tbody th { text-align: left; }
.price-table tbody th { min-width: 210px; color: #e2e8e3; font-size: 12px; letter-spacing: .07em; }
.price-table tbody th small { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; font-weight: 600; letter-spacing: 0; }
.price-table td { min-width: 150px; color: var(--green); font-size: 19px; font-weight: 820; white-space: nowrap; }
.price-table td:last-child { color: #ff9aa6; }
.price-table tr.weekly { background: rgba(255, 200, 87, .045); }
.price-table tr.weekly th small { color: var(--gold); }
.price-modal-note { margin: 0; padding: 17px 25px 24px; color: var(--muted); font-size: 11px; }

@media (max-width: 1100px) {
    .hero { grid-template-columns: 1fr; align-items: start; }
    .identity-strip { grid-template-columns: repeat(3, 1fr); gap: 16px 0; }
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
    .primary-showcase { grid-template-columns: 394px minmax(0, 1fr); }
    .team-bags { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .loot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .painting-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .route-map-heading { flex-direction: column; }
    .route-map-summary { width: 100%; max-width: none; }
}

@media (min-width: 701px) and (max-height: 760px) {
    .route-map-panel { padding: 18px; }
    .route-map-heading { gap: 14px; }
    .route-map-heading h2 { font-size: 25px; }
    .route-map-totals > span, .route-password-summary { min-width: 0; padding: 6px 9px; }
    .route-map-totals strong { font-size: 15px; }
    .route-password-summary strong { font-size: 17px; }
    .map-plan-picker { margin-top: 9px; gap: 7px; }
    .map-plan-option { min-height: 48px; padding: 6px 8px; }
    .map-display-toolbar { padding: 6px 9px; }
    .map-player-picker { gap: 4px; }
    .map-player-toggle { min-height: 31px; }
}

@media (min-width: 1500px) {
    .route-bag-list { width: 560px; grid-template-columns: repeat(2, minmax(260px, 1fr)); }
}

@media (max-width: 850px) {
    .primary-showcase { grid-template-columns: 1fr; }
    .primary-art { width: min(100%, 394px); min-width: 0; max-width: 394px; height: auto; min-height: 0; aspect-ratio: 396 / 512; justify-self: start; }
}

@media (max-width: 700px) {
    .page-shell { width: min(100% - 20px, 1480px); }
    .topbar { min-height: 62px; }
    .topbar-actions { gap: 8px; }
    .account .access-pill { display: none; }
    .hero { padding: 24px 20px; gap: 28px; }
    .lookup-form { grid-template-columns: 1fr; }
    .identity-strip { grid-template-columns: 1fr; }
    .identity-strip div { padding: 10px 0; border-right: 0; border-bottom: 1px solid var(--border); }
    .identity-strip div:last-child { border-bottom: 0; }
    .stat-grid, .loot-grid { grid-template-columns: 1fr; }
    .result-tabs { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
    .result-tab { min-width: 0; padding: 0 9px; }
    .primary-prices { grid-template-columns: 1fr; }
    .other-prices-button { width: 100%; justify-content: space-between; }
    .section-heading { flex-direction: column; }
    .security-badges { justify-content: flex-start; }
    .vault-patterns { grid-template-columns: 1fr; }
    .team-route summary { align-items: flex-start; flex-direction: column; gap: 5px; }
    .team-route summary > span:last-child { font-size: 17px; }
    .team-route-controls { align-items: stretch; flex-direction: column; }
    .team-route-selector { width: 100%; }
    .team-route-controls p { text-align: left; }
    .team-total { align-items: flex-end; flex-direction: column; gap: 1px; }
    .team-bags { grid-template-columns: 1fr; }
    .legend { margin-top: -8px; }
    .loot-card { grid-template-columns: 132px minmax(0, 1fr); }
    .loot-visual { min-height: 154px; }
    .raw-stats dl div { display: grid; gap: 4px; }
    .collection-heading { align-items: flex-start; flex-direction: column; }
    .collection-progress { justify-content: start; text-align: left; }
    .painting-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .painting-image { height: 185px; }
    .route-map-panel { padding: 16px 12px; }
    .route-map-heading { align-items: flex-start; flex-direction: column; }
    .route-map-summary { width: 100%; max-width: none; grid-template-columns: 1fr; }
    .route-map-totals { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .route-map-totals > span { min-width: 0; padding: 9px; }
    .route-password-summary { min-width: 0; }
    .route-password-summary span { white-space: normal; }
    .map-plan-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .map-display-toolbar { align-items: flex-start; flex-direction: column; }
    .map-floor-legend { justify-content: flex-start; }
    .route-map-layout { max-width: 100%; grid-template-columns: 1fr; gap: 14px; }
    .route-map-canvas { border-radius: 11px; }
    .route-overview-grid, .route-overview-grid.is-gallery-only, .route-overview-grid.is-side-only, .route-overview-grid.is-side-only.is-single-panel { min-height: 0; grid-template-columns: 1fr; }
    .route-overview-panel--gallery { width: min(100%, 430px); grid-column: 1; grid-row: auto; justify-self: center; }
    .route-overview-panel--loading, .route-overview-panel--vault, .route-overview-grid.is-side-only .route-overview-panel--loading, .route-overview-grid.is-side-only .route-overview-panel--vault { width: 100%; grid-column: 1; grid-row: auto; }
    .route-marker { width: 18px; min-width: 18px; height: 18px; min-height: 18px; }
    .route-marker-popup { max-width: calc(100% - 16px); }
    .route-bag-list { width: 100%; grid-column: 1; grid-row: auto; justify-self: stretch; grid-template-columns: 1fr; }
    .lightbox-shell { border-radius: 11px; }
    .lightbox-toolbar { min-height: 44px; padding: 6px 7px 6px 12px; }
    .price-modal-shell { border-radius: 12px; }
    .price-modal-header { min-height: 0; padding: 22px 58px 18px 18px; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; }
    .price-modal-header img { width: 88px; height: 76px; }
    .price-table-wrap { padding: 14px 14px 0; }
    .price-table th, .price-table td { padding: 11px 12px; }
    .price-table tbody th { min-width: 175px; }
    .price-table td { min-width: 130px; font-size: 16px; }
    .price-modal-note { padding: 14px 14px 18px; }
}

/* Unified saved nickname control */
.nickname-control { position: relative; display: block; }
.nickname-control input { box-sizing: border-box; height: 41px; min-height: 41px; padding-right: 38px; }
.nickname-control > .nickname-clear { position: absolute; z-index: 2; top: 50%; right: 4px; width: 28px; min-width: 28px; height: 28px; min-height: 28px; margin: 0; padding: 0; display: grid; place-items: center; transform: translateY(-50%); border: 0; border-radius: 4px; background: transparent; color: var(--muted); font: 400 18px/1 Arial, sans-serif; line-height: 1; transition: none; animation: none; }
.nickname-control > .nickname-clear:hover, .nickname-control > .nickname-clear:focus-visible { transform: translateY(-50%); border: 0; background: transparent; color: var(--muted); outline: 0; transition: none; animation: none; }
.saved-nicknames { position: absolute; z-index: 30; top: calc(100% + 5px); right: 0; left: 0; overflow: hidden; border: 1px solid #2d332e; border-radius: 5px; background: #0b0d0b; box-shadow: 0 10px 24px rgba(0,0,0,.35); }
.saved-nickname { display: flex; height: 36px; border-bottom: 1px solid var(--border); }
.saved-nickname:last-child { border-bottom: 0; }
.saved-nickname-value { flex: 1; min-width: 0; height: 35px; min-height: 35px; padding: 0 11px; overflow: hidden; border: 0; border-radius: 0; background: transparent; color: var(--text); font: inherit; text-align: left; text-overflow: ellipsis; white-space: nowrap; transform: none; transition: none; }
.saved-nickname-value:hover, .saved-nickname-value:focus-visible { background: transparent; color: var(--text); outline: 0; transform: none; transition: none; }
.saved-nickname-remove { flex: 0 0 34px; width: 34px; height: 35px; min-height: 35px; margin: 0; padding: 0; display: grid; place-items: center; border: 0; border-radius: 0; background: transparent; color: var(--muted); font: 400 16px/1 Arial, sans-serif; transform: none; transition: none; }
.saved-nickname-remove:hover, .saved-nickname-remove:focus-visible { background: transparent; color: var(--muted); outline: 0; transform: none; transition: none; }