/* Reference-inspired stage: skins / roulette / target, with collections below. */
:root{--bg:#080808;--surface:#131314;--well:#1e1e20;--card:#171719;--hover:#29292c;--border:#303033;--text:#f3f2ee;--muted:#b0afb3;--subtle:#919095;--accent:#dfdbd2;--accent-fill:#dfddd6;--accent-ink:#161617;--accent-soft:#2c2b28;--accent-border:#8e8a80;--secondary:#b7b4ac;--gold:#d2c3a5;--green:#7de0a8;--red:#f27380;--image-floor:#242426;--chance-color:#f27380}
:root[data-theme=light]{--bg:#f0f1f3;--surface:#fafbfc;--well:#e5e7eb;--card:#f0f2f5;--hover:#e0e3e8;--border:#cfd3db;--text:#23262c;--muted:#5e646e;--subtle:#6f7681;--accent:#464c56;--accent-fill:#d8dce3;--accent-ink:#24272d;--accent-soft:#e2e5ea;--accent-border:#939ba7;--secondary:#747a84;--gold:#756347;--green:#267648;--red:#b9374a;--image-floor:#e1e5ea}
body{background:var(--bg)}
.topbar{height:60px;padding-inline:24px;background:var(--surface);gap:26px}
.brand{font-size:21px}.brand svg{color:var(--accent-fill)}
.desktop-nav{margin-left:auto;margin-right:auto;gap:28px}.desktop-nav button{font-size:11px}.desktop-nav button.active{color:var(--accent)}
.header-preferences{margin-left:0}.balance-chip{padding:6px 10px;background:var(--bg);border:1px solid var(--border);border-radius:9px}.balance-chip strong{font-size:13px}
.deposit-button,.primary-button,.upgrade-button{background:var(--accent-fill);color:var(--accent-ink);box-shadow:none}
:root[data-theme=light] .upgrade-button:not(:disabled):not(.is-busy),:root[data-theme=light] .primary-button,:root[data-theme=light] .deposit-button{background:var(--accent-fill);border:0;box-shadow:none;color:var(--accent-ink)}
:root[data-theme=light] .upgrade-button:not(:disabled):not(.is-busy):hover,:root[data-theme=light] .primary-button:hover,:root[data-theme=light] .deposit-button:hover,.upgrade-button:not(:disabled):hover,.primary-button:hover,.deposit-button:hover{background:color-mix(in srgb,var(--accent-fill) 82%,white);box-shadow:0 6px 24px #ffffff0b}
:root[data-theme=light] .upgrade-button:disabled,.upgrade-button:disabled{background:var(--well);color:var(--subtle);box-shadow:none}
main{max-width:1200px;width:100%}.page-heading h1{font-size:28px;letter-spacing:-1px}.eyebrow{color:var(--accent);font-size:9px;letter-spacing:2px}
#upgradeView>.page-heading{margin-bottom:8px}#upgradeView .workbench-tagline{font-size:10px;margin-top:2px;color:var(--muted)}
#arena{--chance-color:#ff7289;background:none;border:0;border-radius:0;overflow:visible;padding:0;gap:0 28px}
#arena .arena-grid{display:none}#arena .stake-panel,#arena .target-panel{padding:0;align-self:start}
#arena .panel-eyebrow{height:28px;padding:0 4px;font-size:10px;margin-bottom:5px}
.panel-link,.target-choose{color:var(--muted);border:1px solid var(--border);background:var(--well);padding:4px 9px;border-radius:7px;font-size:9px;text-decoration:none}
.target-choose{display:none}.panel-link:hover{background:var(--accent-soft);color:var(--accent)}
#arena .item-display{border-radius:16px;border:1px solid var(--border);background:radial-gradient(ellipse at 50% 55%,color-mix(in srgb,var(--accent) 4%,transparent),transparent 65%),var(--surface);min-height:220px;padding:4px 12px 14px;justify-content:center}
.item-art:before{background:none!important;border:0!important}.item-art img{filter:drop-shadow(0 15px 12px #0005)}
#arena .item-art{height:130px}#arena .item-art img{width:280px;height:145px;max-width:100%}
#arena .item-finish{font-size:23px;letter-spacing:-.5px}#arena .item-weapon{font-size:10px}#arena .item-value b{font-size:18px}#arena .item-tail{margin-top:5px}
.target-preview{width:100%;padding:0;position:relative}.target-preview:after{content:'↗';position:absolute;right:10px;top:10px;font-size:13px;color:var(--subtle)}
#arena .empty-selection{min-height:200px}#arena .selected-tray{max-height:40px;overflow:auto;margin:4px 0}#arena .selected-tray:empty{display:none}
#arena .selection-caption{font-size:9px;min-height:13px;margin:4px 0}
#arena .balance-controls{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-top:7px;padding:9px 12px}
#arena .balance-controls label{font-size:9px;margin-bottom:5px}#arena .balance-entry{gap:5px}#arena .amount-field{height:31px;max-width:none;padding-inline:8px}#arena .amount-field input{font-size:14px}
#arena .balance-presets button{min-height:28px;font-size:9px;padding:4px 7px}#arena .balance-slider{margin-top:7px}#arena .balance-slider>span{font-size:8px}
#arena .chance-panel{align-self:center;padding-top:0}#arena .dial{width:256px;height:256px}
#arena .dial-track{stroke:var(--well);stroke-width:18}#arena .dial-arc{stroke:var(--chance-color);stroke-width:18;stroke-linecap:butt}
#arena .dial-outer{stroke:var(--muted);stroke-width:4;stroke-dasharray:1 13;opacity:.3}#arena .dial-inner{stroke:var(--border);stroke-width:1;fill:var(--surface)}
#arena .dial-pointer{fill:var(--accent)}
#arena .dial-copy strong,#arena .dial-copy strong>span{color:var(--chance-color)}#arena .dial-copy strong{font-size:51px;letter-spacing:-2px;transition:color .3s}
#arena .dial.won .dial-copy strong,#arena .dial.won .dial-arc{color:var(--green);stroke:var(--green)}#arena .dial.lost .dial-copy strong{color:var(--red)}
#arena .chance-actions{margin-top:4px}#arena .roll-side{margin-bottom:7px}#arena .roll-side button{font-size:8px;padding:3px 8px}
#arena .upgrade-button{height:43px;border-radius:11px;font-size:13px}#arena .round-status{margin:8px 0 0;font-size:8px}
.target-tuning{margin-top:10px}.control-label{display:none}.target-tuning .multiplier-row{margin:0 0 8px;gap:5px}.target-tuning .multiplier-row button{flex:1;min-height:29px;padding:4px 7px;font-size:10px}
.target-tuning .chance-presets{flex-direction:column;gap:5px;margin:0}.target-tuning .chance-presets>span{display:none}.target-tuning .chance-presets>div{display:flex;width:100%;gap:5px}.chance-presets button{flex:1;border:1px solid color-mix(in srgb,var(--preset-color) 30%,var(--border));color:var(--preset-color);background:color-mix(in srgb,var(--preset-color) 4%,var(--surface))}.chance-presets button.active,.chance-presets button:hover{color:var(--preset-color);background:color-mix(in srgb,var(--preset-color) 16%,var(--surface));border-color:var(--preset-color)}
#arena .arena-controls{display:block;margin:4px 0 0;padding:7px 0;border:0}#arena .stake-breakdown{justify-content:center;gap:20px;font-size:9px}#arena .stake-breakdown>div{flex-direction:row;align-items:center;gap:8px}#arena .stake-breakdown b{font-size:11px}#arena .stake-total b{font-size:15px}
.skin-card{border:1px solid color-mix(in srgb,var(--rarity,#707b89) 35%,var(--border));background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--rarity,#707b89) 14%,transparent),transparent 85%),var(--card);border-radius:9px}
.skin-card:not(:disabled):hover{border-color:var(--rarity);background:color-mix(in srgb,var(--rarity) 12%,var(--card));transform:translateY(-2px)}.skin-card.selected{border-color:var(--accent);background:var(--accent-soft)}
body[data-view=upgrade] .page-footer,body[data-view=upgrade] #recentRounds,body[data-view=upgrade] #lastResult{display:none}
@media(min-width:751px) and (min-height:620px){
 #arena .selected-tray{display:none}
 html:has(body[data-view=upgrade]){overflow:hidden;scrollbar-gutter:auto}body[data-view=upgrade] .page-shell{height:100dvh;display:flex;flex-direction:column}body[data-view=upgrade] .topbar{flex-shrink:0}
 body[data-view=upgrade] main{flex:1;min-height:0;max-width:1160px;padding:10px 28px 16px;overflow:hidden}
 #upgradeView{height:100%;display:grid;grid-template-columns:1fr;grid-template-rows:38px minmax(280px,38vh) 28px minmax(0,1fr);gap:8px;min-height:0}
 #upgradeView>.page-heading{grid-row:1;margin:0}#upgradeView h1{font-size:22px;letter-spacing:-.6px}#upgradeView .heading-tag{padding:3px 5px;font-size:8px}
 #upgradeView .game-settings{gap:4px}#upgradeView .setting-button,#upgradeView .volume-popover summary{min-height:28px;padding:5px 8px;font-size:9px;border-radius:7px}
 #upgradeView>.presets-bar{grid-row:3;margin:0;gap:8px;min-width:0}#upgradeView .preset-caption{font-size:9px}#upgradeView .preset-list{grid-column:auto}#upgradeView .preset-empty{font-size:9px}#upgradeView .preset-save{min-height:25px;padding:4px 8px;font-size:9px}
 #arena{grid-row:2;grid-template-columns:minmax(0,1fr) 256px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 28px;min-height:0;max-width:980px;width:100%;margin:0 auto;align-items:center}
 #arena .item-display{min-height:0;height:calc(38vh - 120px);max-height:260px;min-height:150px}#arena .empty-selection{min-height:0;height:100%}#arena .chance-panel{align-self:center}
 #arena .item-art{height:clamp(76px,12vh,130px)}#arena .item-art img{height:clamp(90px,13vh,145px)}
 #arena .arena-controls{grid-row:2;grid-column:1/-1;margin:0;padding:0}
 #upgradeView>.picker-layout{grid-row:4;min-height:0;height:100%;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch}
 #upgradeView .picker-panel{height:100%;min-height:0;padding:11px 11px 0;border-radius:12px;position:relative}
 #upgradeView .section-title{margin-bottom:6px;min-height:23px;gap:7px;flex-shrink:0}#upgradeView .section-title h2{font-size:15px;letter-spacing:-.3px}#upgradeView .count-badge{font-size:8px;padding:2px 5px}#upgradeView .quiet-button.compact{font-size:8px;padding:4px 7px}#upgradeView .icon-button{width:24px;height:24px}
 #upgradeView .inventory-tools,#upgradeView .catalog-tools{margin-bottom:5px;gap:6px;flex-shrink:0}#upgradeView .search-field,#upgradeView .filter-toggle{height:30px;min-height:30px;padding-inline:8px;font-size:9px;border-radius:8px}#upgradeView .search-field input{font-size:10px}#upgradeView .inventory-tools select{min-height:28px;padding:4px 7px;font-size:9px}#upgradeView .catalog-tabs button{font-size:9px;padding:3px 6px;min-height:23px}
 #upgradeView .category-row{gap:3px;margin-bottom:4px;flex-shrink:0}#upgradeView .category-row button,#upgradeView .category-row select{min-height:23px;font-size:8px;padding:3px 6px}
 #upgradeView .picker-note{margin:0 0 5px;font-size:9px;flex-shrink:0}#upgradeView .recent-targets{display:none}#upgradeView .filter-chips{position:absolute;right:14px;top:86px;margin:0;z-index:2;max-width:135px}#upgradeView .filter-chips button{font-size:8px;min-height:20px;padding:2px 5px}
 #upgradeView .picker-scroll{flex:1;min-height:0;height:auto}#upgradeView .skin-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
 #upgradeView .skin-card{min-height:115px;padding:7px 6px;border-radius:7px}#upgradeView .skin-card:before{left:6px;top:10px}#upgradeView .skin-card img{height:44px;margin:2px 0 3px}#upgradeView .skin-card .wear{font-size:7px;height:10px;line-height:10px}#upgradeView .card-weapon{font-size:7px}#upgradeView .card-finish{font-size:8px}#upgradeView .card-price{font-size:9px;margin-top:3px}#upgradeView .card-price small{font-size:7px}#upgradeView .card-check{width:15px;height:15px;right:4px;bottom:5px}
 #upgradeView .favorite-button{width:18px;height:18px;right:3px;top:3px}#upgradeView .favorite-button svg{width:11px;height:11px}
 #upgradeView .picker-bottom{flex-shrink:0;margin:6px -11px 0;padding:7px 11px;min-height:25px;font-size:8px}#upgradeView .picker-bottom .text-button{font-size:8px}
 #upgradeView .advanced-filters{position:absolute;left:10px;right:10px;top:78px;z-index:30;background:var(--surface);padding:12px;max-height:calc(100% - 90px);overflow:auto;box-shadow:0 16px 35px #0005;grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(min-width:751px) and (max-width:1000px) and (min-height:620px){body[data-view=upgrade] main{padding-inline:18px}#arena{grid-template-columns:minmax(0,1fr) 228px minmax(0,1fr);gap:0 18px}#arena .dial{width:228px;height:228px}#arena .item-finish{font-size:19px}#arena .balance-presets button{padding-inline:4px;font-size:8px}#upgradeView .skin-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.topbar{gap:12px;padding-inline:18px}.desktop-nav{gap:14px}}
@media(min-width:751px) and (min-height:620px) and (max-height:760px){#upgradeView{grid-template-rows:32px 280px 25px minmax(0,1fr);gap:7px}#arena .dial{width:200px;height:200px}#arena .chance-panel{align-self:start;margin-top:17px}#arena .item-display{height:150px}#arena .item-art{height:73px}#arena .item-art img{height:87px}#arena .item-finish{font-size:19px}#arena .item-value b{font-size:14px}#arena .item-condition{font-size:8px}#arena .balance-controls{padding:6px 9px;margin-top:5px}#arena .panel-eyebrow{height:22px;margin-bottom:4px}#arena .target-tuning{margin-top:8px}#arena .dial-copy strong{font-size:43px}#arena .round-status{margin-top:6px}#arena .upgrade-button{height:39px}#arena .roll-side{margin-bottom:5px}#upgradeView .workbench-tagline{display:none}}
@media(max-width:750px){
  .topbar{height:58px;padding-inline:12px;gap:7px}
  .balance-chip{padding:5px 6px;border-radius:10px}
  .top-actions{gap:5px}
  .workbench-tagline{display:none}
  .page-heading h1{font-size:25px}
  .page-heading{margin-bottom:10px}
  #arena{padding:12px 12px 0;gap:0 12px}
  #arena .item-display,#arena .empty-selection{min-height:115px}
  #arena .item-art{height:62px}
  #arena .item-art img{height:76px;width:150px}
  #arena .item-art:before{width:58px;height:58px}
  #arena .item-finish{font-size:14px;line-height:1.15}
  #arena .item-weapon{font-size:8px;margin-bottom:2px}
  #arena .item-tail{margin-top:4px}
  #arena .item-value b{font-size:12px}
  #arena .selection-caption{font-size:8px;margin:2px 0;min-height:11px}
  #arena .balance-controls{margin-top:6px}
  #arena .balance-controls label{font-size:8px;margin-bottom:4px}
  #arena .balance-entry{gap:4px}
  #arena .amount-field{height:29px;padding-inline:7px}
  #arena .amount-field input{font-size:13px}
  #arena .balance-presets button{font-size:8px;padding:3px;min-height:24px}
  #arena .balance-slider{margin-top:7px}
  #arena .balance-slider>span{display:none}
  #arena .target-choose{min-height:25px;font-size:8px;margin-top:3px}
  #arena .target-tuning{margin-top:5px}
  #arena .target-tuning .control-label{display:none}
  #arena .target-tuning .multiplier-row{gap:3px;margin-bottom:5px}
  #arena .target-tuning .multiplier-row button{min-height:24px;font-size:8px;padding:3px 5px}
  #arena .target-tuning .chance-presets{gap:4px}
  #arena .target-tuning .chance-presets>span{font-size:8px}
  #arena .chance-presets button{min-height:24px;padding:3px 6px;font-size:8px}
  #arena .chance-panel{padding:8px 0;grid-template-columns:130px minmax(0,1fr);gap:10px}
  #arena .dial{width:130px;height:130px}
  #arena .chance-actions .roll-side{margin-bottom:7px;padding:2px}
  #arena .chance-actions .roll-side button{font-size:8px;min-height:23px;padding:3px}
  #arena .upgrade-button{height:39px}
  #arena .round-status{margin-top:6px;font-size:8px}
  #arena .arena-controls{display:block;margin-top:0;padding:8px 0;grid-row:3}
  #arena .stake-breakdown{justify-content:center;gap:13px;flex-direction:row;font-size:8px;text-align:center}
  #arena .stake-breakdown>div{gap:2px}
  #arena .stake-breakdown b{font-size:11px}
  #arena .stake-breakdown .stake-total{padding-left:13px}
  #arena .stake-total b{font-size:16px}
}
@media(max-width:750px) and (min-height:700px){
  html:has(body[data-view=upgrade]){overflow:hidden;scrollbar-gutter:auto}
  body[data-view=upgrade] .page-shell{height:100dvh;display:flex;flex-direction:column}
  body[data-view=upgrade] main{flex:1;min-height:0;padding:10px 12px 76px;width:100%;overflow:hidden}
  #upgradeView{height:100%;display:grid;grid-template-columns:1fr;grid-template-rows:32px 29px auto 30px minmax(0,1fr);gap:8px;min-height:0}
  #upgradeView>.page-heading{grid-row:1;margin:0}
  #upgradeView>.presets-bar{grid-row:2;margin:0;gap:5px}
  #upgradeView .preset-caption{display:none}
  #upgradeView .preset-list{grid-column:1/3}
  #upgradeView .preset-empty{font-size:9px}
  #upgradeView .preset-save{grid-column:3;font-size:9px;min-height:28px;padding:5px 8px}
  #arena{grid-row:3}
  #upgradeView>.picker-tabs{grid-row:4;margin:0;padding:2px;min-height:0}
  #upgradeView>.picker-tabs button{min-height:25px;padding:4px;font-size:10px}
  #upgradeView>.picker-layout{grid-row:5;margin:0;min-height:0;height:100%;display:block}
  #upgradeView .picker-panel{height:100%;min-height:0;padding:10px 11px 0;border-radius:17px}
  #upgradeView .section-title{min-height:25px;margin-bottom:6px}
  #upgradeView .section-title h2{font-size:17px}
  #upgradeView .inventory-tools,#upgradeView .catalog-tools{margin-bottom:6px}
  #upgradeView .search-field,#upgradeView .filter-toggle{height:30px;min-height:30px;font-size:9px;padding-inline:8px}
  #upgradeView .search-field input{font-size:10px}
  #upgradeView .picker-scroll{flex:1;min-height:0;height:auto}
  #upgradeView .picker-note,#upgradeView .recent-targets{display:none}
  #upgradeView .skin-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  #upgradeView .skin-card{min-height:127px;padding:9px 7px}
  #upgradeView .skin-card img{height:46px;margin:5px 0}
  #upgradeView .card-finish{font-size:9px}
  #upgradeView .card-price{font-size:10px;margin-top:6px}
  #upgradeView .picker-bottom{flex-shrink:0;min-height:28px;margin:7px -11px 0;padding:7px 11px;font-size:8px}
  #upgradeView .picker-bottom .text-button{font-size:8px}
  #upgradeView .category-row{margin-bottom:5px}
  #upgradeView .category-row button{min-height:24px;font-size:9px;padding:4px 6px}
  #upgradeView .target-picker{position:relative}
  #upgradeView .advanced-filters{position:absolute;top:90px;left:10px;right:10px;z-index:30;max-height:calc(100% - 100px);overflow:auto;background:var(--surface);padding:10px;box-shadow:0 10px 30px #0005}
  .mobile-nav{bottom:10px;min-height:53px}
}
@media(max-width:750px) and (min-height:700px){
  #arena .item-display,#arena .empty-selection{min-height:83px}
  #arena .item-art{height:42px}
  #arena .item-art img{height:55px}
  #arena .item-art:before{width:43px;height:43px}
  #arena .item-condition,#arena .selection-caption,#arena .balance-controls label,#arena .balance-slider,#arena .target-choose,#arena .target-tuning .multiplier-row,#arena .chance-presets>span{display:none}
  #arena .item-weapon{font-size:7px;margin-bottom:1px}
  #arena .item-finish{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #arena .item-tail{margin-top:3px}
  #arena .balance-entry{flex-direction:row;gap:4px}
  #arena .amount-field{flex:1;min-width:0;height:30px;padding-inline:5px}
  #arena .amount-field input{font-size:12px}
  #arena .amount-field small{display:none}
  #arena .balance-presets{width:auto;gap:3px}
  #arena .balance-presets button{font-size:8px;min-height:28px;padding:4px 6px}
  #arena .balance-presets button[data-balance-share="0.25"],#arena .balance-presets button[data-balance-share="0.5"]{display:none}
  #arena .target-tuning{margin-top:7px}
  #arena .chance-presets>div{gap:3px}
  #arena .chance-presets button{min-height:28px;padding:4px 6px}
  #arena .chance-panel{grid-template-columns:120px minmax(0,1fr);padding:7px 0;gap:10px}
  #arena .dial{width:120px;height:120px}
  #arena .stake-breakdown>div{flex-direction:row;align-items:center;gap:5px}
  #arena .stake-breakdown{font-size:7px;gap:10px}
  #arena .stake-total b{font-size:13px}
  #arena .stake-breakdown .stake-total{padding-left:10px}
  #arena .target-preview:after{width:18px;height:18px;right:0;top:0;font-size:10px;border-radius:6px}
}
@media(max-width:750px) and (min-height:700px) and (max-height:780px){
  #arena{padding:9px 10px 0;gap:0 9px}
  #arena .item-display,#arena .empty-selection{min-height:69px}
  #arena .item-art{height:31px}
  #arena .item-art img{height:43px}
  #arena .item-finish{font-size:12px}
  #arena .item-tail{margin-top:2px}
  #arena .chance-panel{grid-template-columns:105px minmax(0,1fr);padding:5px 0}
  #arena .dial{width:105px;height:105px}
  #arena .dial-copy strong{font-size:29px}
  #arena .dial-copy>span{font-size:6px}
  #arena .arena-controls{padding-block:7px}
  #upgradeView .section-title{margin-bottom:4px;min-height:22px}
  #upgradeView .inventory-tools,#upgradeView .catalog-tools{margin-bottom:4px}
  #upgradeView .skin-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  #upgradeView .skin-card{display:grid;grid-template-columns:38px minmax(0,1fr);grid-template-rows:11px 13px 15px;gap:0 5px;min-height:55px;padding:7px 6px}
  #upgradeView .skin-card .wear{display:none}
  #upgradeView .skin-card:before{left:6px;top:5px;width:3px;height:3px}
  #upgradeView .skin-card img{grid-column:1;grid-row:1/4;width:38px;height:39px;margin:0}
  #upgradeView .card-weapon,#upgradeView .card-finish,#upgradeView .card-price{grid-column:2;margin:0;white-space:nowrap}
  #upgradeView .card-weapon{grid-row:1;font-size:7px}
  #upgradeView .card-finish{grid-row:2;font-size:8px}
  #upgradeView .card-price{grid-row:3;font-size:9px;padding-right:0;gap:2px}
  #upgradeView .card-price small{font-size:6px}
  #upgradeView .favorite-button{width:17px;height:17px;top:2px;right:3px}
  #upgradeView .favorite-button svg{width:9px;height:9px}
  #upgradeView .card-check{width:11px;height:11px;bottom:4px;right:3px;font-size:7px}
}

/* Shop and account share the same balance and owned inventory. */
@media(min-width:751px) and (min-height:620px){
 #upgradeView{grid-template-rows:38px max(304px,41vh) 28px minmax(0,1fr)}
 #arena .item-display{height:clamp(150px,calc(38vh - 150px),230px);min-height:150px}
 #arena .balance-controls{padding:6px 9px}#arena .balance-controls label{margin-bottom:3px}#arena .selection-caption{margin:3px 0;font-size:8px;min-height:10px}
 #arena .dial{width:240px;height:240px}#arena .round-status{margin-top:5px}
}
@media(min-width:751px) and (min-height:620px) and (max-height:820px){
 #upgradeView{grid-template-rows:32px 304px 25px minmax(0,1fr);gap:7px}
 #arena .item-display{height:150px}#arena .item-art{height:73px}#arena .item-art img{height:87px}#arena .item-finish{font-size:19px}#arena .item-value b{font-size:14px}
 #arena .dial{width:190px;height:190px}#arena .chance-panel{align-self:center;margin-top:0}#arena .dial-copy strong{font-size:41px}#arena .upgrade-button{height:39px}
}
@media(min-width:751px) and (min-height:620px) and (max-height:680px){#upgradeView{grid-template-rows:28px 255px 24px minmax(0,1fr)}#arena .item-display{height:117px;min-height:117px}#arena .item-art{height:47px}#arena .item-art img{height:65px}#arena .dial{width:155px;height:155px}#arena .dial-copy strong{font-size:35px}#arena .balance-slider{display:none}#upgradeView .picker-note{display:none}}
@media(max-width:750px) and (min-height:700px){#arena .selected-tray{display:none}#arena .item-display{height:100px;min-height:100px}#arena .item-art{height:43px;margin:0}#arena .item-art img{height:55px}#arena .item-meta{margin-top:0}}
@media(max-width:750px) and (min-height:700px) and (max-height:780px){#arena .item-display{height:70px;min-height:70px;padding:1px 5px 3px}#arena .item-art{height:23px}#arena .item-art img{height:33px}#arena .item-finish{font-size:11px}#arena .balance-controls{padding:4px}#arena .panel-eyebrow{height:17px;margin-bottom:3px}#arena .dial{width:95px;height:95px}#arena .chance-panel{grid-template-columns:95px minmax(0,1fr)}#arena .dial-copy strong{font-size:26px}}
.market-notice{display:flex;align-items:center;gap:9px;color:var(--muted);background:var(--surface);border:1px solid var(--border);padding:10px 14px;border-radius:10px;font-size:10px;margin-bottom:18px}.market-notice svg{width:16px;height:16px;color:var(--accent);flex-shrink:0}
.shop-toolbar{display:flex;gap:8px;align-items:center;padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:12px}.shop-toolbar .search-field{min-width:170px}.shop-toolbar select{background:var(--well);color:var(--muted);border:1px solid var(--border);border-radius:9px;padding:10px;font-size:11px;height:43px}.shop-price{display:flex;align-items:center;gap:5px;background:var(--well);border-radius:9px;padding:0 9px;height:43px;font-size:10px;color:var(--muted)}.shop-price input{width:75px;min-width:0;background:none;border:0;color:var(--text);outline:none;font-size:11px}.affordable-filter{display:flex;align-items:center;gap:5px;white-space:nowrap;color:var(--muted);font-size:10px}.affordable-filter input{accent-color:var(--accent)}.shop-caption{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin:10px 0 16px}
.shop-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.shop-grid .skin-card{min-height:192px}.card-action{font-size:10px;font-weight:700;color:var(--accent);margin-top:7px}.shop-grid .card-check{display:none}
.account-overview{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;border:1px solid var(--border);padding:14px;border-radius:22px;background:var(--well);margin-bottom:16px}.account-card{background:linear-gradient(135deg,var(--surface),var(--card));border:1px solid var(--border);border-radius:13px;padding:18px;min-width:0}.account-identity{display:flex;flex-direction:column;gap:20px}.identity-top{display:flex;align-items:center;gap:13px}.account-avatar{width:70px;height:70px;border-radius:16px;display:grid;place-items:center;flex-shrink:0;font-size:32px;font-weight:800;color:var(--accent);background:linear-gradient(145deg,var(--accent-soft),var(--surface));border:1px solid var(--accent-border)}.identity-top h2{font-size:19px;margin-bottom:6px}.account-id{display:inline-block;font-size:9px;color:var(--muted);padding:3px 6px;border:1px solid var(--border);border-radius:5px}.beta-label{display:block;color:var(--subtle);font-size:9px;margin-top:5px}.account-identity p{font-size:10px;color:var(--muted);flex:1;max-width:270px}.account-identity .quiet-button{width:100%}
.account-wallet{display:flex;flex-direction:column;align-items:flex-start}.account-card-label{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted);width:100%}.account-card-label svg{width:18px;height:18px}.account-balance{font-size:32px;letter-spacing:-1px;line-height:1.2;margin-top:23px;max-width:100%;overflow-wrap:anywhere}.account-unit{font-size:10px;color:var(--muted);margin-bottom:10px}.account-wallet .text-button{margin-bottom:18px;font-size:10px}.account-wallet .primary-button{width:100%;margin-top:auto;height:41px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px}
.account-achievements{display:flex;flex-direction:column;gap:10px;min-width:0}.account-best{flex:1;min-height:133px;position:relative;overflow:hidden;padding:14px}.account-best #accountBest{display:flex;align-items:center;gap:8px;margin-top:7px}.account-best img{width:100px;height:69px;object-fit:contain}.account-best strong{display:block;font-size:10px}.account-best small{font-size:11px;color:var(--accent)}.best-empty{display:flex;align-items:center;gap:14px;min-height:54px}.best-empty svg{width:37px;height:37px;opacity:.2}.best-empty p{font-size:10px;color:var(--subtle)}.account-small-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.account-small-stats .account-card{padding:13px}.account-small-stats span{font-size:10px;color:var(--muted)}.account-small-stats strong{display:block;font-size:23px;margin:5px 0;color:var(--accent)}.account-small-stats small{font-size:9px;color:var(--muted)}
.account-collection{border:1px solid var(--border);border-radius:15px;background:var(--surface);overflow:hidden}.account-collection-head{display:flex;align-items:center;gap:10px;padding:12px;background:var(--well)}.account-tabs{display:flex;align-items:center;gap:4px;min-width:0;margin-right:auto}.account-tabs button{display:flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;min-height:34px;padding:7px 13px;border-radius:8px;color:var(--muted);font-size:11px}.account-tabs button[aria-selected=true]{background:var(--accent-fill);color:var(--accent-ink)}.account-tabs button svg{width:14px;height:14px}.account-collection [role=tabpanel]{padding:15px}.account-collection .full-inventory .skin-card{min-height:190px;padding:13px}.account-collection .full-inventory .skin-card img{height:83px}.account-collection .full-inventory .card-price{font-size:13px}.account-collection .full-inventory .card-finish{font-size:11px}.account-collection .empty-state{grid-column:1/-1;padding:38px}.trade-history-row{display:flex;align-items:center;gap:15px;padding:14px 8px;border-bottom:1px solid var(--border)}.trade-type{padding:5px 8px;border-radius:7px;color:var(--muted);background:var(--well);font-size:10px;min-width:77px;text-align:center}.trade-type.sell{color:var(--green);background:var(--success-bg)}.trade-history-row>div{margin-right:auto;min-width:0}.trade-history-row strong{display:block;font-size:11px}.trade-history-row small{font-size:9px;color:var(--muted)}.trade-history-row>b{white-space:nowrap;font-size:12px}
.trade-modal{max-width:430px}.trade-modal #tradeTitle{font-size:24px}.trade-modal .item-display{min-height:210px;margin-top:15px}.trade-modal .item-art{height:135px}.trade-modal .item-art img{height:145px;width:270px}.trade-modal .item-finish{font-size:22px}.trade-total{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--border);border-radius:10px;padding:12px;margin:14px 0;font-size:10px;color:var(--muted)}.trade-total strong{font-size:16px;color:var(--accent)}.trade-modal .primary-button{width:100%;margin-top:16px}.trade-modal .full-width{margin-top:9px}.trade-bundle{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin:20px 0}.trade-bundle img{width:95px;height:65px;object-fit:contain}.trade-bundle strong{width:100%;text-align:center;font-size:12px;margin-top:10px}.profile-name-label{display:flex;flex-direction:column;gap:6px;text-align:left;color:var(--muted);font-size:11px;margin:20px 0 12px}.profile-name-label input{background:var(--well);color:var(--text);border:1px solid var(--border);border-radius:9px;padding:10px}#profileForm .primary-button{width:100%;margin-bottom:16px}
@media(max-width:1000px){.shop-toolbar{flex-wrap:wrap}.shop-toolbar .search-field{flex-basis:40%}.shop-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.account-overview{gap:8px;padding:10px}.account-card{padding:13px}.account-avatar{width:52px;height:52px;font-size:25px}.identity-top{gap:8px}.identity-top h2{font-size:16px}.account-balance{font-size:27px}.account-tabs button{font-size:10px;padding-inline:9px}}
@media(max-width:750px){
 .mobile-nav{grid-template-columns:repeat(4,1fr)}.mobile-nav button{font-size:8px}.topbar{background:var(--surface)}
 #arena .item-display{padding:4px 5px 8px;border-radius:11px}#arena .balance-controls{padding:6px;margin-top:6px;border-radius:8px}#arena .panel-eyebrow{height:20px}.target-tuning .chance-presets>div{gap:3px}#arena .dial-track,#arena .dial-arc{stroke-width:15}#arena .dial-copy strong{font-size:32px}
 body:not([data-view=upgrade]) main{padding:20px 12px 80px}.page-heading{gap:8px}.page-heading h1{font-size:24px}.page-heading p{font-size:10px;margin-top:7px}.page-heading>.quiet-button{font-size:9px;padding:7px 9px}.collection-total strong{font-size:16px}.collection-total span{font-size:9px}
 .shop-toolbar{padding:9px;gap:6px}.shop-toolbar .search-field{flex-basis:100%;height:36px}.shop-toolbar select{height:35px;font-size:10px;padding:6px;flex:1;min-width:0}.shop-price{height:35px;flex:1;min-width:0;padding:0 7px}.shop-price input{width:54px;font-size:10px}.shop-price span{white-space:nowrap;font-size:9px}.affordable-filter{font-size:9px}.shop-toolbar .quiet-button{font-size:9px;padding:6px 9px}.shop-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.shop-grid .skin-card{min-height:165px}.shop-grid .skin-card img{height:66px}.shop-grid .card-price{font-size:10px}.shop-grid .card-finish{font-size:9px}.card-action{font-size:9px}.market-notice{font-size:9px;padding:9px 10px;margin-bottom:12px}.shop-caption{font-size:9px}
 .account-overview{grid-template-columns:1fr 1fr;padding:9px;gap:8px;border-radius:15px}.account-identity{grid-column:1/-1;gap:10px}.account-identity p{max-width:none}.account-identity .quiet-button{font-size:10px;min-height:32px}.identity-top h2{font-size:19px}.account-wallet{padding:13px}.account-balance{font-size:24px;margin-top:19px}.account-wallet .primary-button{font-size:10px;height:auto;min-height:38px;padding:7px}.account-wallet .text-button{font-size:9px;margin-bottom:13px}.account-card-label{font-size:10px}.account-achievements{gap:7px}.account-best{padding:10px;min-height:100px}.account-best #accountBest{flex-direction:column;align-items:flex-start}.account-best img{width:80px;height:48px}.best-empty{gap:8px;min-height:50px}.best-empty svg{width:23px;height:23px}.best-empty p{font-size:8px}.account-small-stats{gap:6px}.account-small-stats .account-card{padding:8px}.account-small-stats strong{font-size:19px}.account-small-stats span,.account-small-stats small{font-size:8px}.account-collection-head{flex-wrap:wrap;padding:8px;gap:8px}.account-tabs{width:100%;gap:2px}.account-tabs button{flex:1;min-width:0;white-space:normal;font-size:8px;padding:5px 6px;min-height:35px;gap:4px}.account-tabs svg{display:none}.account-collection-head>.quiet-button{margin-left:auto;font-size:9px;padding:6px 10px}.account-collection [role=tabpanel]{padding:9px}.account-collection .full-inventory{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.account-collection .full-inventory .skin-card{min-height:158px;padding:8px}.account-collection .full-inventory .skin-card img{height:61px}.account-collection .full-inventory .card-finish{font-size:9px}.account-collection .full-inventory .card-price{font-size:10px}.trade-history-row{gap:8px;padding:10px 0}.trade-type{font-size:8px;min-width:54px;padding:4px}.trade-history-row strong{font-size:9px}.trade-history-row>b{font-size:9px}.trade-total{flex-wrap:wrap}.trade-modal .item-display{min-height:190px}.trade-modal .item-art{height:120px}
}
.advanced-filters .mobile-category-filter,.filter-close{display:none}
@media(min-width:751px) and (min-height:620px){#upgradeView .filter-chips{position:static;max-width:none;max-height:25px;display:flex;flex-wrap:nowrap;overflow-x:auto;flex-shrink:0;margin:0 0 4px}#upgradeView .filter-chips:empty{display:none}#upgradeView .filter-chips button{flex-shrink:0}}
@media(max-width:750px){#upgradeView .category-row,#upgradeView .filter-chips{display:none}#upgradeView .advanced-filters{position:fixed;top:auto;bottom:76px;left:12px;right:12px;max-height:min(430px,55dvh);z-index:50;padding:14px;box-shadow:0 -12px 50px #0007}.advanced-filters .mobile-category-filter{display:flex}.filter-close{display:inline-flex;grid-column:1/-1;justify-self:end;min-height:30px}}


/* Onyx and platinum, with color reserved for skins and the chance meter. */
body{background:var(--bg)}
.topbar{background:color-mix(in srgb,var(--surface) 80%,var(--bg));border-bottom-color:var(--border)}
.brand svg{color:var(--accent);filter:none}
.upgrade-button,.primary-button,.deposit-button,:root[data-theme=light] .upgrade-button:not(:disabled):not(.is-busy),:root[data-theme=light] .primary-button,:root[data-theme=light] .deposit-button{background:linear-gradient(165deg,#f0eeea,#c7c5c0);color:#171717;border:1px solid #e5e1d6;box-shadow:inset 0 1px 0 #fff8,0 4px 14px #0003}
.upgrade-button:not(:disabled):hover,.primary-button:hover,.deposit-button:hover,:root[data-theme=light] .upgrade-button:not(:disabled):not(.is-busy):hover,:root[data-theme=light] .primary-button:hover,:root[data-theme=light] .deposit-button:hover{background:linear-gradient(165deg,#fffef9,#dad7cf);box-shadow:inset 0 1px 0 #fff,0 5px 22px #ffffff0b}
:root[data-theme=light] .upgrade-button:not(:disabled):not(.is-busy),:root[data-theme=light] .primary-button,:root[data-theme=light] .deposit-button{background:linear-gradient(165deg,#fafbfd,#d3d7df);border:1px solid #bfc5cf;box-shadow:inset 0 1px 0 #fff,0 3px 8px #262b3210}
.upgrade-button:disabled,:root[data-theme=light] .upgrade-button:disabled{background:var(--well);color:var(--subtle);border:1px solid var(--border);box-shadow:none}
.upgrade-button.is-busy{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-border);box-shadow:none}
.coin-icon,.item-value i{color:var(--gold)}
.card-price,#arena .item-value b,.account-balance{color:var(--text)}
#arena .stake-panel .item-display,#arena .target-panel .item-display{background:radial-gradient(ellipse at 50% 0%,#ffffff04,transparent 70%),linear-gradient(155deg,var(--surface),var(--bg));border-color:var(--border);box-shadow:inset 0 1px 0 #ffffff03,0 8px 24px #0002}
.skin-card{background:radial-gradient(ellipse at 50% 32%,color-mix(in srgb,var(--rarity,#8a8a8c) 18%,transparent),transparent 85%),linear-gradient(145deg,var(--card),var(--surface));border-color:color-mix(in srgb,var(--rarity,#8a8a8c) 38%,var(--border))}
.skin-card:after{content:'';position:absolute;bottom:0;left:12%;right:12%;height:1px;background:var(--rarity);opacity:.65}
.skin-card:not(:disabled):hover{background:radial-gradient(ellipse at 50% 32%,color-mix(in srgb,var(--rarity,#8a8a8c) 25%,transparent),transparent 90%),var(--surface);border-color:var(--rarity)}
.skin-card.selected{background:radial-gradient(ellipse at 50% 32%,color-mix(in srgb,var(--rarity,#8a8a8c) 20%,transparent),transparent 85%),var(--accent-soft);border-color:var(--accent-border)}
.skin-card.selected:after{background:var(--accent)}
.account-overview{background:linear-gradient(135deg,var(--well),var(--surface));box-shadow:inset 0 1px 0 #ffffff04}
.account-card{background:linear-gradient(155deg,var(--surface),var(--card))}
#arena .dial-svg{filter:drop-shadow(0 10px 18px #0005)}
#arena .dial-track{stroke:var(--well);stroke-width:9}
#arena .dial-arc{stroke-width:9;stroke-linecap:round;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--chance-color) 20%,transparent))}
#arena .dial-outer{stroke:var(--subtle);stroke-width:4;stroke-dasharray:.7 6.15;opacity:.4}
#arena .dial-major-ticks{fill:none;stroke:var(--muted);stroke-width:8;stroke-dasharray:1 67.6;opacity:.48}
#arena .dial-bezel{fill:none;stroke:url(#dialBezel);stroke-width:1}
#arena .dial-inner{fill:url(#dialFace);stroke:var(--border);stroke-width:1}
#arena .dial-copy:before{content:'';position:absolute;inset:23%;background:radial-gradient(circle,#ffffff02,transparent 70%);z-index:-1}
#arena .dial-copy strong{font-weight:750;letter-spacing:-2px;text-shadow:none}
#arena .dial-pointer{transform-box:view-box;transform-origin:140px 140px;filter:drop-shadow(0 2px 3px #0008)}
#arena .pointer-shadow{fill:var(--bg);stroke:var(--bg);stroke-width:2}
#arena .pointer-needle{fill:#f3f0e6;stroke:#b9b5aa;stroke-width:.6}
#arena .pointer-jewel{fill:#8b8880}
:root[data-theme=light] #arena .pointer-needle{fill:#3e424a;stroke:#16181d}
:root[data-theme=light] #arena .pointer-jewel{fill:#eaedf1}
@media(max-width:750px){#arena .dial-track,#arena .dial-arc{stroke-width:10}#arena .dial-copy strong{font-size:32px}#arena .dial-major-ticks{stroke-width:7}}
@media(max-width:750px) and (min-height:700px) and (max-height:780px){#arena .dial-copy strong{font-size:26px}}

#arena .item-art:before{width:80%;height:85%;background:radial-gradient(ellipse,color-mix(in srgb,var(--rarity,#888) 20%,transparent),transparent 70%)!important;filter:blur(12px);border:0!important}