/* CSGuessr theme expansion v1. Every UI theme owns a full authored scene. */

html body .site-shell.cosmetic-theme-default{--theme-scene:url('/theme-scenes-v1/queue-black.svg');--theme-veil:#05080bcc;--theme-panel:#0a1015e8;--theme-line:#52616a}
html body .site-shell.cosmetic-theme-ice{--theme-scene:url('/theme-scenes-v1/ice-lobby.svg');--theme-veil:#06131dcc;--theme-panel:#091722e8;--theme-line:#74c3d8}
html body .site-shell.cosmetic-theme-toxic{--theme-scene:url('/theme-scenes-v1/toxic-execute.svg');--theme-veil:#06110bcc;--theme-panel:#08160ee8;--theme-line:#7fc46a}
html body .site-shell.cosmetic-theme-royal{--theme-scene:url('/theme-scenes-v1/royal-clutch.svg');--theme-veil:#0e0917ce;--theme-panel:#130d1de8;--theme-line:#c9a24d}
html body .site-shell.cosmetic-theme-ocean{--theme-scene:url('/theme-scenes-v1/ocean-drive.svg');--theme-veil:#06121dcc;--theme-panel:#081724e8;--theme-line:#e0916a}
html body .site-shell.cosmetic-theme-sunset{--theme-scene:url('/theme-scenes-v1/sunset-rush.svg');--theme-veil:#160b09ce;--theme-panel:#1b100de8;--theme-line:#e0925a}
html body .site-shell.cosmetic-theme-obsidian{--theme-scene:url('/theme-scenes-v1/obsidian.svg');--theme-veil:#030306d4;--theme-panel:#08080eea;--theme-line:#9a92c8}
html body .site-shell.cosmetic-theme-major-gold{--theme-scene:url('/v33-theme-scenes/major-gold.svg');--theme-veil:#0d0a05d0;--theme-panel:#121008e8;--theme-line:#d4af52}
html body .site-shell.cosmetic-theme-ancient{--theme-scene:url('/v33-theme-scenes/ancient.svg');--theme-veil:#06100bd0;--theme-panel:#09150fe8;--theme-line:#7fa86a}
html body .site-shell.cosmetic-theme-void{--theme-scene:url('/v33-theme-scenes/void.svg');--theme-veil:#03030bd2;--theme-panel:#090a18e8;--theme-line:#8fb4e0}
html body .site-shell.cosmetic-theme-lan-night{--theme-scene:url('/v33-theme-scenes/lan-night.svg');--theme-veil:#03090dd0;--theme-panel:#07131ae8;--theme-line:#5aa8d8}
html body .site-shell.cosmetic-theme-mirage-dust{--theme-scene:url('/v33-theme-scenes/mirage-dust.svg');--theme-veil:#130e08cc;--theme-panel:#18120ce8;--theme-line:#c9a06a}
html body .site-shell.cosmetic-theme-neon-grid{--theme-scene:url('/v33-theme-scenes/neon-grid.svg');--theme-veil:#040619cc;--theme-panel:#090c20e8;--theme-line:#ff6fb5}
html body .site-shell.cosmetic-theme-black-ice{--theme-scene:url('/v33-theme-scenes/black-ice.svg');--theme-veil:#030a0fd0;--theme-panel:#07131be8;--theme-line:#7fb4cc}
html body .site-shell.cosmetic-theme-dragonfire{--theme-scene:url('/v33-theme-scenes/dragonfire.svg');--theme-veil:#100604d0;--theme-panel:#180a06e8;--theme-line:#e88243}
html body .site-shell.cosmetic-theme-northern-lights{--theme-scene:url('/theme-scenes-v1/northern-lights.svg');--theme-veil:#031015ce;--theme-panel:#07161be8;--theme-line:#56d9a0}
html body .site-shell.cosmetic-theme-carbon{--theme-scene:url('/theme-scenes-v1/carbon.svg');--theme-veil:#07090bd2;--theme-panel:#0b0e10eb;--theme-line:#62583b}
html body .site-shell.cosmetic-theme-chrome{--theme-scene:url('/v33-theme-scenes/chrome.svg');--theme-veil:#061017c4;--theme-panel:#09151ce6;--theme-line:#587985}
html body .site-shell.cosmetic-theme-afterplant{--theme-scene:url('/theme-afterplant-bg.webp');--theme-veil:#061016b8;--theme-panel:#071116e2;--theme-line:#4b6265}
html body .site-shell.cosmetic-theme-crimson{--theme-scene:url('/theme-scenes-v1/inferno.svg');--theme-veil:#120605d0;--theme-panel:#190908e8;--theme-line:#d9603f}
html body .site-shell.cosmetic-theme-midnight{--theme-scene:url('/theme-scenes-v1/midnight.svg');--theme-veil:#070a18ce;--theme-panel:#0b1020e8;--theme-line:#8fa8e0}
html body .site-shell.cosmetic-theme-mint{--theme-scene:url('/theme-scenes-v1/mint.svg');--theme-veil:#06130ed0;--theme-panel:#091812e8;--theme-line:#74d0a4}
html body .site-shell.cosmetic-theme-sakura{--theme-scene:url('/theme-scenes-v1/sakura.svg');--theme-veil:#150a13cc;--theme-panel:#190e18e8;--theme-line:#e59ac0}
html body .site-shell.cosmetic-theme-aurora{--theme-scene:url('/theme-scenes-v1/aurora.svg');--theme-veil:#061316c8;--theme-panel:#08171ae8;--theme-line:#6fd0cf}

/* Preview cards live outside the equipped shell, so each card gets the raw scene
   directly. No fake homepage chrome or generated screenshot is layered on top. */
.cosmetic-mini.cosmetic-theme-default{--theme-scene:url('/theme-scenes-v1/queue-black.svg')}
.cosmetic-mini.cosmetic-theme-ice{--theme-scene:url('/theme-scenes-v1/ice-lobby.svg')}
.cosmetic-mini.cosmetic-theme-toxic{--theme-scene:url('/theme-scenes-v1/toxic-execute.svg')}
.cosmetic-mini.cosmetic-theme-royal{--theme-scene:url('/theme-scenes-v1/royal-clutch.svg')}
.cosmetic-mini.cosmetic-theme-ocean{--theme-scene:url('/theme-scenes-v1/ocean-drive.svg')}
.cosmetic-mini.cosmetic-theme-sunset{--theme-scene:url('/theme-scenes-v1/sunset-rush.svg')}
.cosmetic-mini.cosmetic-theme-obsidian{--theme-scene:url('/theme-scenes-v1/obsidian.svg')}
.cosmetic-mini.cosmetic-theme-major-gold{--theme-scene:url('/v33-theme-scenes/major-gold.svg')}
.cosmetic-mini.cosmetic-theme-ancient{--theme-scene:url('/v33-theme-scenes/ancient.svg')}
.cosmetic-mini.cosmetic-theme-void{--theme-scene:url('/v33-theme-scenes/void.svg')}
.cosmetic-mini.cosmetic-theme-lan-night{--theme-scene:url('/v33-theme-scenes/lan-night.svg')}
.cosmetic-mini.cosmetic-theme-mirage-dust{--theme-scene:url('/v33-theme-scenes/mirage-dust.svg')}
.cosmetic-mini.cosmetic-theme-neon-grid{--theme-scene:url('/v33-theme-scenes/neon-grid.svg')}
.cosmetic-mini.cosmetic-theme-black-ice{--theme-scene:url('/v33-theme-scenes/black-ice.svg')}
.cosmetic-mini.cosmetic-theme-dragonfire{--theme-scene:url('/v33-theme-scenes/dragonfire.svg')}
.cosmetic-mini.cosmetic-theme-northern-lights{--theme-scene:url('/theme-scenes-v1/northern-lights.svg')}
.cosmetic-mini.cosmetic-theme-carbon{--theme-scene:url('/theme-scenes-v1/carbon.svg')}
.cosmetic-mini.cosmetic-theme-chrome{--theme-scene:url('/v33-theme-scenes/chrome.svg')}
.cosmetic-mini.cosmetic-theme-afterplant{--theme-scene:url('/theme-afterplant-bg.webp')}
.cosmetic-mini.cosmetic-theme-crimson{--theme-scene:url('/theme-scenes-v1/inferno.svg')}
.cosmetic-mini.cosmetic-theme-midnight{--theme-scene:url('/theme-scenes-v1/midnight.svg')}
.cosmetic-mini.cosmetic-theme-mint{--theme-scene:url('/theme-scenes-v1/mint.svg')}
.cosmetic-mini.cosmetic-theme-sakura{--theme-scene:url('/theme-scenes-v1/sakura.svg')}
.cosmetic-mini.cosmetic-theme-aurora{--theme-scene:url('/theme-scenes-v1/aurora.svg')}

html body .site-shell[class*="cosmetic-theme-"]{
  --theme-text:#eaf1f4;--theme-muted:#94a5af;--theme-control:#101a21e8;--theme-control-text:#eaf1f4;
  background-color:var(--v17-1,#071017)!important;
  background-image:linear-gradient(135deg,var(--theme-veil,#071017c8),color-mix(in srgb,var(--theme-veil,#071017c8) 72%,transparent)),var(--theme-scene)!important;
  background-size:cover!important;background-position:center!important;background-attachment:fixed!important;
}
html body .site-shell[class*="cosmetic-theme-"] main{position:relative;background:transparent!important;isolation:isolate}
html body .site-shell[class*="cosmetic-theme-"] main:before{content:"";position:fixed;z-index:-1;pointer-events:none;inset:62px 0 0;background:var(--theme-scene) center/cover no-repeat!important;opacity:.42;mix-blend-mode:screen}
html body .site-shell[class*="cosmetic-theme-"] .home-stage{background-image:linear-gradient(145deg,var(--theme-panel),color-mix(in srgb,var(--theme-panel) 86%,transparent)),var(--theme-scene)!important;background-size:cover!important;background-position:center!important;background-blend-mode:normal,screen!important;border-color:var(--theme-line)!important;box-shadow:0 24px 80px #0008,inset 0 1px #ffffff16!important}
html body .site-shell[class*="cosmetic-theme-"] :where(.topbar,.side-menu){border-color:var(--theme-line)!important}

/* Every interactive control receives the equipped theme's accent, including controls
   that keep a semantic background for danger, rarity or rating-band meaning. */
html body .site-shell[class*="cosmetic-theme-"] button{
  accent-color:var(--yellow)!important;
  color:var(--theme-text)!important;
  border-color:color-mix(in srgb,var(--yellow) 34%,var(--theme-line))!important;
  background-image:linear-gradient(color-mix(in srgb,var(--yellow) 7%,transparent),color-mix(in srgb,var(--yellow) 2%,transparent))!important;
  box-shadow:inset 0 -2px color-mix(in srgb,var(--yellow) 13%,transparent);
}
html body .site-shell[class*="cosmetic-theme-"] button:is(:hover,:focus-visible):not(:disabled){border-color:color-mix(in srgb,var(--yellow) 72%,#fff)!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--yellow) 24%,transparent),inset 0 -2px color-mix(in srgb,var(--yellow) 24%,transparent)}
html body .site-shell[class*="cosmetic-theme-"] :where(main,aside,header,footer) :where(p,small,label){color:#dce7eb!important}
html body .site-shell[class*="cosmetic-theme-"] :where(.center-mode,.home-tools>button,.side-menu nav button,.mode-switch button,.setting-card,.setting-toggle) :where(b,span,small,strong,em){color:inherit!important}
html body .site-shell[class*="cosmetic-theme-"] button:is(.active,.selected,[aria-selected="true"],[aria-checked="true"]):not(.lock-button,.submit-top,.side-submit){background-color:color-mix(in srgb,var(--theme-control) 88%,#000)!important}
html body .site-shell[class*="cosmetic-theme-"] :where(.primary-button,.v15-primary,.side-home,.case-open-button,.upgrade-core>button:not(.upgrade-clear),.case-preview-tools button.active){background:linear-gradient(135deg,var(--yellow),var(--yellow-soft))!important;color:#071017!important;border-color:color-mix(in srgb,var(--yellow) 76%,#fff)!important}
html body .site-shell[class*="cosmetic-theme-"] :where(.submit-top,.side-submit){background:#f6c945!important;background-image:none!important;color:#071017!important;border-color:#f6c945!important;box-shadow:0 0 0 1px #ffe18c55,0 8px 24px #f6c94524!important}
html body .site-shell[class*="cosmetic-theme-"] .lock-button{background:#f6c945!important;background-image:none!important;color:#071017!important;border-color:#f6c945!important;box-shadow:none!important}
html body .site-shell[class*="cosmetic-theme-"] .center-mode>strong{color:var(--yellow)!important;border-color:color-mix(in srgb,var(--yellow) 42%,var(--theme-line))!important;background:color-mix(in srgb,var(--yellow) 10%,var(--theme-control))!important}

/* Theme previews use the same scene users receive after equipping. */
.cosmetic-mini[class*="cosmetic-theme-"],
[class*="cosmetic-theme-"] .ui-theme-preview,
[class*="cosmetic-theme-"] .cosmetic-live-preview{background-image:var(--theme-scene)!important;background-size:cover!important;background-position:center!important}
.cosmetic-mini[class*="cosmetic-theme-"] .ui-theme-preview>*{visibility:hidden!important}
.cosmetic-mini[class*="cosmetic-theme-"] .cosmetic-art-icon{display:none!important}

/* V32.4 inventory remains the source of truth. The later desktop scale must not
   stretch its cards horizontally or change their original proportions. */
@supports selector(html:has(.site-shell.page-inventory)){
  html[data-csg-ui-scale]:has(.site-shell.page-inventory) .site-shell>main,
  html[data-csg-ui-scale]:has(.site-shell.page-inventory) .site-shell>footer{
    transform:none!important;
  }
}

.header-actions{position:relative}
.v421-submit-tip{position:absolute;z-index:80;top:calc(100% + 13px);right:0;width:max-content;max-width:240px;display:flex;align-items:center;gap:10px;padding:9px 9px 9px 12px;border:1px solid #f6c945;background:#101820f5;color:#f5fafc;box-shadow:0 12px 32px #0009;font-size:10px;line-height:1.35}
.v421-submit-tip:before{content:"";position:absolute;right:24px;top:-6px;width:10px;height:10px;background:#101820;border-top:1px solid #f6c945;border-left:1px solid #f6c945;transform:rotate(45deg)}
.v421-submit-tip span{cursor:pointer}.v421-submit-tip b{display:block;color:#f6c945;font-size:8px;letter-spacing:.12em}.v421-submit-tip button{width:26px;height:26px;min-width:26px;padding:0!important;background:#1b2730!important;color:#fff!important;border:1px solid #52616a!important;box-shadow:none!important}

@media(max-width:700px){html body .site-shell[class*="cosmetic-theme-"] main:before{inset:54px 0 0;background-position:center top!important}.v421-submit-tip{display:none!important}}
