/* ==============================================================
   VANTA CITY · BLOOD NOIR · v1.0
   Add LAST to existing CSS. Activate with <body data-theme="blood-noir">.
   Pure visual skin; no API, game-state, event or data modifications.
   ============================================================= */
:root {
  --bn-bg: #060607;
  --bn-bg-soft: #0b090b;
  --bn-surface: #121013;
  --bn-surface-raised: #1b1519;
  --bn-crimson: #a3182b;
  --bn-crimson-bright: #df4053;
  --bn-crimson-deep: #530b18;
  --bn-red-haze: rgba(163, 24, 43, .16);
  --bn-edge: #372329;
  --bn-edge-bright: #78404a;
  --bn-fg: #f4eeee;
  --bn-muted: #afa3a7;
  --bn-muted-low: #897c82;
  --bn-green: #62c99c;
  --bn-warn: #dfb477;
  --bn-shadow: 0 16px 48px rgba(0,0,0,.49);
  --bn-focus: 0 0 0 3px rgba(223,64,83,.27);
  --bn-radius: 14px;
}
html:has(body[data-theme="blood-noir"]) { color-scheme: dark; background: var(--bn-bg); }
body[data-theme="blood-noir"] {
  --bg: var(--bn-bg);
  --panel: var(--bn-surface);
  --line: var(--bn-edge);
  --muted: var(--bn-muted);
  --purple: var(--bn-crimson-bright);
  color: var(--bn-fg);
  background:
    radial-gradient(ellipse 66% 38% at 95% 0%, rgba(125,15,35,.17), transparent 75%),
    radial-gradient(ellipse 55% 30% at -5% 100%, rgba(102,10,27,.10), transparent 80%),
    var(--bn-bg);
}
body[data-theme="blood-noir"] ::selection { color:#fff; background: #89253a; }
body[data-theme="blood-noir"] :is(button,a,input,select,textarea):focus-visible {
  outline: 1px solid var(--bn-crimson-bright); outline-offset: 3px; box-shadow:var(--bn-focus);
}
body[data-theme="blood-noir"] :is(input,select,textarea) {
  background: #0f0d0f; color:var(--bn-fg); border-color:#47303a;
}
body[data-theme="blood-noir"] :is(input,select,textarea)::placeholder {color: #8c7d84;}
body[data-theme="blood-noir"] :is(button,a) { -webkit-tap-highlight-color: transparent; }
body[data-theme="blood-noir"] :is(button,a):disabled { opacity:.45; box-shadow:none; cursor:not-allowed; }
body[data-theme="blood-noir"] :is(.eyebrow,.nav-caption,.hero-eyebrow) { color:#da7b8b; letter-spacing:.14em; }
body[data-theme="blood-noir"] :is(.muted,.p6-muted,.p6-help,.p5-note,.p3-help) { color:var(--bn-muted); }
body[data-theme="blood-noir"] :is(.app-shell,.main-pane) { background:transparent; }
/* Site navigation & global dashboard */
body[data-theme="blood-noir"] .desktop-sidebar { background: #0c0a0d; border-right-color:#342127; }
body[data-theme="blood-noir"] .side-brand .brand-symbol,
body[data-theme="blood-noir"] .brand-symbol { background:linear-gradient(150deg,#8f1727,#420b17); border-color:#bd4050; color:#fff; box-shadow:0 6px 27px #a3172c36; }
body[data-theme="blood-noir"] :is(.brand-copy strong span,.brand-symbol span) { color:#ef7f8d; }
body[data-theme="blood-noir"] .brand-copy small { color:#a88d96; }
body[data-theme="blood-noir"] .nav-button {color:#ada0a4;}
body[data-theme="blood-noir"] .nav-button:hover:not(.disabled) { background:#211419; color:#fff0f1; }
body[data-theme="blood-noir"] .nav-button.selected { background:linear-gradient(100deg,#39131d,#231216 80%);color:#fff3f3;box-shadow:inset 3px 0 #d33c50; }
body[data-theme="blood-noir"] .nav-button.selected>svg { color:#ee7987; }
body[data-theme="blood-noir"] .nav-active-dot { background:#db5365; }
body[data-theme="blood-noir"] .sidebar-level {background:linear-gradient(135deg,#2a171c,#151013);border-color:#4c2a34;}
body[data-theme="blood-noir"] .level-diamond {background:#531925;color:#fff;}
body[data-theme="blood-noir"] .topbar { background:#0c090bfd; border-bottom-color:#2d2025; backdrop-filter: blur(14px); }
body[data-theme="blood-noir"] :is(.top-icon,.breadcrumb,.topbar-time,.live-session) {color:#b9aaad;}
body[data-theme="blood-noir"] .profile-button {background:#2b151e;border-color:#74333f;color:#f0a3ad;}
body[data-theme="blood-noir"] .online-dot {background:var(--bn-green);box-shadow:0 0 9px #62c99c55;}
body[data-theme="blood-noir"] .sidebar-foot {border-top-color:#342127;}
body[data-theme="blood-noir"] .page-header h1 span { color:#e25e71; }
body[data-theme="blood-noir"] .page-header p {color:#b4a7aa;}
body[data-theme="blood-noir"] .hero { border:1px solid #692c38; background: radial-gradient(ellipse at 83% 43%,#6b1529 0%,#2a0e18 39%,#110c10 73%,#09080a 100%); box-shadow:inset 0 1px #b25a6040,0 28px 70px #0008; }
body[data-theme="blood-noir"] .hero:before { background:radial-gradient(circle,rgba(225,43,70,.24),transparent 69%); }
body[data-theme="blood-noir"] .hero-overlay { background:linear-gradient(90deg,#100b0fee 0%,#100b0fd9 27%,#1b0c15a8 62%,#17070a33 100%),linear-gradient(0deg,#080608 0,transparent 26%); }
body[data-theme="blood-noir"] .hero h1 { color:#fff8f7; text-shadow: 0 5px 28px #000a; }
body[data-theme="blood-noir"] .hero h1 em { color:#f17987; }
body[data-theme="blood-noir"] .hero p {color:#c1b3b7;}
body[data-theme="blood-noir"] .hero-live { background:#e35766; box-shadow:0 0 16px #ed3d58b0; }
body[data-theme="blood-noir"] .hero-bottom { color:#caacb3; border-color:#532a34; }
body[data-theme="blood-noir"] .city-skyline { filter: hue-rotate(90deg) saturate(.55) brightness(.68); opacity:.6; }
/* Cards, rows, stats, panels */
body[data-theme="blood-noir"] :is(.overview-card,.sidebar-panel,.milestone-list,.feature-contract,.p3-career-summary,.job-card,.bank-grid,.transfer-panel,.activity-box,.car-card,.profile-panel,.p4-card,.p5-panel,.p5-district,.p6-card,.p6-banner,.p6-topline,.player-id-strip,.jobs-stats,.coming-banner) {
  background:linear-gradient(155deg,rgba(30,20,25,.96),rgba(16,13,16,.98) 74%);
  border-color:var(--bn-edge);
  box-shadow:0 12px 32px #0004,inset 0 1px rgba(255,255,255,.025);
}
body[data-theme="blood-noir"] :is(.overview-card,.sidebar-panel,.job-card,.p6-card,.p5-panel,.p4-card,.car-card):hover {border-color:#63333e;}
body[data-theme="blood-noir"] .overview-value {color:#faf1f1;}
body[data-theme="blood-noir"] .overview-top span {color:#b8a7ad;}
body[data-theme="blood-noir"] .mini-icon { color:#df8190; background:#3e1924; }
body[data-theme="blood-noir"] .mini-icon.teal {color:#73cfac;background:#153529;}
body[data-theme="blood-noir"] .mini-icon.orange {color:#eab67b;background:#392515;}
body[data-theme="blood-noir"] .mini-icon.pink {color:#e78d95;background:#3c1722;}
body[data-theme="blood-noir"] .player-id-strip { background:#100e10; }
body[data-theme="blood-noir"] .feature-contract { background:linear-gradient(115deg,#2a151b,#151014 68%,#2b151c); }
body[data-theme="blood-noir"] .contract-emblem {background:#491821;border-color:#713442;color:#f4a0ad;}
body[data-theme="blood-noir"] .tiny-pill {color:#e7a0aa;background:#431c27;border-color:#78424c;}
body[data-theme="blood-noir"] :is(.milestone,.activity-item,.p6-line,.listrow) {border-color:#34262b;}
body[data-theme="blood-noir"] .milestone-icon {background:#27171d;color:#e87e91;}
body[data-theme="blood-noir"] .reward-number {color:#f2e8e8;}
body[data-theme="blood-noir"] .positive-txt {color:var(--bn-green);}
body[data-theme="blood-noir"] .negative-txt {color:#f17687;}
body[data-theme="blood-noir"] .activity-symbol.positive {background:#132b23;color:var(--bn-green);}
body[data-theme="blood-noir"] .activity-symbol.negative {background:#3b1721;color:#f17687;}
body[data-theme="blood-noir"] .progress-bar {background:#31252a;}
body[data-theme="blood-noir"] .progress-bar>div {background:linear-gradient(90deg,#7e1426,#e55f71);}
body[data-theme="blood-noir"] .p6-score {color:#f29ba6;}
body[data-theme="blood-noir"] .p6-alert {background:#201419;border-color:#54313a;}
body[data-theme="blood-noir"] .p5-map-wrap {border-color:#5b343e;background:#120e12;box-shadow:var(--bn-shadow);}
body[data-theme="blood-noir"] :is(.p5-map-pin.current,.p5-pin-dot.current) { color:#fff;background:#b72940; }
/* Actions, inputs, tabs, links */
body[data-theme="blood-noir"] :is(.primary-button,.job-button,.p5-primary,.p6-btn,.p4-banner-button,.subtle-button,.p3-focus-button,.owned-button) {
  background:linear-gradient(135deg,#771425,#a51d32 60%,#bd2c42);
  border-color:#b54254;color:#fff5f5; box-shadow:0 8px 25px #8e17272b;
}
body[data-theme="blood-noir"] :is(.primary-button,.job-button,.p5-primary,.p6-btn,.p4-banner-button,.subtle-button,.p3-focus-button):hover:not(:disabled) {filter:brightness(1.14);}
body[data-theme="blood-noir"] :is(.outline-button,.p3-outline,.p5-refresh,.square-action,.toggle-switch,.amount-buttons button) {
  background:#1f1419;border-color:#673743;color:#f1bbc3;
}
body[data-theme="blood-noir"] :is(.text-action,.identity-link,.p7-jump) {color:#f0a0ab;}
body[data-theme="blood-noir"] .p7-jump {background:#30141f;border:1px solid #82404d;}
body[data-theme="blood-noir"] .p7-jump:hover {background:#481d29;}
body[data-theme="blood-noir"] .p5-local-nav button,
body[data-theme="blood-noir"] .p5-jump-row button {background:#21151c;border-color:#57323d;color:#f0c5ca;}
body[data-theme="blood-noir"] .p6-tabs button {background:#171115;border-color:#403039;color:#bdadb1;}
body[data-theme="blood-noir"] .p6-tabs button.active {background:#4d1523;border-color:#9c3043;color:#fff0f2;}
body[data-theme="blood-noir"] .p5-danger {background:#38131c;border-color:#7d2a3a;color:#ffb1bc;}
/* Cards in Vice Bank, Garage, & profile */
body[data-theme="blood-noir"] .bank-card {background:linear-gradient(135deg,#370d1b 0%,#1a1017 35%,#0b0b0d 75%,#3f111e 120%); border:1px solid #9b4351;box-shadow:var(--bn-shadow),inset 0 1px #ffc9d017;}
body[data-theme="blood-noir"] .bank-rings {opacity:.36;filter:hue-rotate(98deg) saturate(.7);}
body[data-theme="blood-noir"] .bank-chip {filter:saturate(.75);}
body[data-theme="blood-noir"] .profile-banner {background:linear-gradient(125deg,#531a28,#110f12 66%);}
body[data-theme="blood-noir"] .big-avatar {background:linear-gradient(135deg,#6e1b2d,#260e18);border-color:#b44c5d;}
body[data-theme="blood-noir"] .p3-bank-tier {color:#f39ba9;}
body[data-theme="blood-noir"] .p4-card-art {filter:hue-rotate(75deg) saturate(.75);}
/* Responsive dashboard navigation; do not alter sizing / safe-area logic */
body[data-theme="blood-noir"] .mobile-tabs {background:#0f0b0df7;border-top-color:#49303a;backdrop-filter:blur(14px);}
body[data-theme="blood-noir"] .mobile-tabs button {color:#b5a3a8;}
body[data-theme="blood-noir"] .mobile-tabs button.active {color:#fa8193;}
body[data-theme="blood-noir"] .modal-card,
body[data-theme="blood-noir"] .connection-panel {background:#171115;border:1px solid #5a303b;box-shadow:var(--bn-shadow);}
body[data-theme="blood-noir"] .toast {background:#221319;border-color:#743442;color:#f6eeee;}
/* Shop & inventory: leave rarity classes authoritative. */
body[data-theme="blood-noir"][data-mode] .top,
body[data-theme="blood-noir"] .top {border-bottom-color:#3c2730;background:#0b090c;}
body[data-theme="blood-noir"][data-mode] .hero {background:linear-gradient(115deg,#38111d,#110d11 82%);border-color:#5e2e39;}
body[data-theme="blood-noir"] :is(.toolbar,.panel,.notice,.stats,.empty,.dialog,.listrow) {background-color:#171115;border-color:#4b2a34;color:#efe5e8;}
body[data-theme="blood-noir"] :is(.topnav a.current,.tabs button.active) {background:#451925;border-color:#963449;color:#ffe1e6;}
body[data-theme="blood-noir"] :is(.topnav a,.tabs button) {color:#d6bdc3;}
body[data-theme="blood-noir"] :is(.wallet,.stat,.metric) {color:#f2dfe2;}
body[data-theme="blood-noir"] :is(.primary,.btn:not(.alt):not(.danger)) {background:linear-gradient(135deg,#8f1a2d,#b62940);border-color:#b94055;color:#fff;}
body[data-theme="blood-noir"] :is(.outline,.btn.alt) {background:#211419;border-color:#77404d;color:#fac3cb;}
body[data-theme="blood-noir"] .rarity-inner {background:#131013;}
body[data-theme="blood-noir"] .card-actions {border-top-color:#3d2c31;}
/* Arcade: preserve contrast and status colors, change only shared frame. */
body[data-theme="blood-noir"]:has(.machine) header {background:#0d090d;border-bottom-color:#422732;}
body[data-theme="blood-noir"]:has(.machine) header a span {color:#ef8797;}
body[data-theme="blood-noir"] :is(.intro,.machine,.history-heading,.table,.felt) {border-color:#4c2b37;}
body[data-theme="blood-noir"] .intro {background:linear-gradient(120deg,#34101e,#130e12);}
body[data-theme="blood-noir"] .machine {background:linear-gradient(145deg,#211217,#100d0f);}
body[data-theme="blood-noir"] .felt {background:radial-gradient(circle at 40% 5%,#4b1b2a,#1c1018 74%);}
body[data-theme="blood-noir"] :is(.coin-stage,.keno,.slot) {filter:saturate(.9);}
body[data-theme="blood-noir"] .notice-win {color:#88dab0;}
body[data-theme="blood-noir"] .notice-loss {color:#ff94a3;}
/* Market and admin remain stylistically coordinated; keep danger/success statuses distinct. */
body[data-theme="blood-noir"] :is(.shell,.container,.main) {color:var(--bn-fg);}
body[data-theme="blood-noir"] :is(.rail,.top,.rail-foot) {border-color:#432731;}
body[data-theme="blood-noir"]:has(.rail) :is(.panel,.card,.feature,.stat,.kpi) {background:#181115;border-color:#4b3039;}
body[data-theme="blood-noir"] :is(.nav.active,.tab.active) {background:#4c1927;color:#ffe9eb;border-color:#9b3b4f;}
body[data-theme="blood-noir"] .warn {color:#edbd7c;}
body[data-theme="blood-noir"] .good {color:#8bdeb5;}
body[data-theme="blood-noir"] .error {color:#ff9aaa;}
body[data-theme="blood-noir"] .notice.bad {border-color:#954658;}
/* Shop item rarity classes are intentionally NOT overridden. */

/* Deep cohesion for historically separate shop and casino pages. */
body[data-theme="blood-noir"][data-mode] .brand span {color:#f18b9d;}
body[data-theme="blood-noir"][data-mode] .hero h1 span {color:#f08b9b;}
body[data-theme="blood-noir"][data-mode] .wallet {background:#21131a;border-color:#69404b;color:#f4e6e9;}
body[data-theme="blood-noir"][data-mode] :is(.topnav a,.mini,.stats>div) {background:#23141c;border-color:#5c303d;color:#edbdc6;}
body[data-theme="blood-noir"][data-mode] .rarity-inner {background:linear-gradient(155deg,#1a1117,#100d10 76%);}
body[data-theme="blood-noir"][data-mode] .art {background:radial-gradient(ellipse at center,color-mix(in srgb,var(--glow) 20%,#211317),#120e10 76%);}
body[data-theme="blood-noir"][data-mode] .notice {background:#25141c;border-color:#704153;}
body[data-theme="blood-noir"][data-mode] .dialog {background:#1a1016;border-color:#794354;}
body[data-theme="blood-noir"][data-mode] .dialog label {color:#e6abb8;}
body[data-theme="blood-noir"]:has(.machine) span {color:inherit;}
body[data-theme="blood-noir"]:has(.machine) .wallet {background:linear-gradient(130deg,#30141f,#130e12);border-color:#603441;color:#f7e8ea;}
body[data-theme="blood-noir"]:has(.machine) .wallet span {color:#79d5a7;}
body[data-theme="blood-noir"]:has(.machine) :is(button,input) {background:#25141c;border-color:#683949;color:#f6e8ea;}
body[data-theme="blood-noir"]:has(.machine) button:hover:not(:disabled) {background:#3e1a28;border-color:#a8475a;}
body[data-theme="blood-noir"]:has(.machine) button.active,
body[data-theme="blood-noir"]:has(.machine) nav button.active {background:linear-gradient(120deg,#7d1d32,#351420);border-color:#c4475c;box-shadow:inset 0 1px #f1a7b322;}
body[data-theme="blood-noir"]:has(.machine) :is(aside,.table) {background:radial-gradient(ellipse at 50% 40%,#311320,#100b10 76%);border-color:#4e2d39;}
body[data-theme="blood-noir"]:has(.machine) :is(#result,#history li) {background:#21131b;border-color:#744152;color:#f0bdc7;}
body[data-theme="blood-noir"]:has(.machine) .table-label span:last-child {color:#aa7d8b;}
body[data-theme="blood-noir"]:has(.machine) .keno button {background:linear-gradient(145deg,#381a26,#20111a);box-shadow:0 4px 0 #100a0e;}
body[data-theme="blood-noir"]:has(.machine) .keno button.active {background:linear-gradient(145deg,#a7354d,#661e33);border-color:#e27689;}
body[data-theme="blood-noir"]:has(.machine) .felt {background:radial-gradient(ellipse,#51202e66,transparent 73%);}
body[data-theme="blood-noir"]:has(.machine) .felt strong {background:#421d2b;border-color:#815063;}
body[data-theme="blood-noir"]:has(.machine) .back-card {color:#f0a8b4;border-color:#a57985;background:repeating-linear-gradient(45deg,#381a28 0 4px,#653144 4px 5px);}
body[data-theme="blood-noir"]:has(.machine) .slot {fill:#6b2a40;stroke:#c15e75;}
body[data-theme="blood-noir"]:has(.machine) .table-stamp {color:#a94b6070;}

/* Motion: deliberate, subtle, and safe. */
@keyframes bn-breathe {0%,100%{box-shadow:0 0 0 1px #b5364622,0 16px 40px #0006}50%{box-shadow:0 0 0 1px #d33b502f,0 17px 45px #b41d2e12}}
body[data-theme="blood-noir"] .hero {animation:bn-breathe 7s ease-in-out infinite;}
@media (prefers-reduced-motion: reduce) {
  body[data-theme="blood-noir"] *,body[data-theme="blood-noir"] *::before,body[data-theme="blood-noir"] *::after {animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}
@media (max-width:730px) {
  body[data-theme="blood-noir"] .hero-copy {padding-left:22px;padding-right:19px;}
  body[data-theme="blood-noir"] .hero {box-shadow:0 16px 42px #0006;}
  body[data-theme="blood-noir"] .overview-grid>* {min-width:0;}
}
