/* V41. Shared theme repairs, followed by an opt-in presentation boundary.
   Inventory geometry, rating-band meaning and game/reel motion are not owned here. */
html[data-csg-interface] body .site-shell{
  --csg-accent:var(--yellow,#f6c945);
  --csg-accent-soft:color-mix(in srgb,var(--csg-accent) 64%,white);
  --csg-surface:color-mix(in srgb,var(--csg-accent) 9%,#101318);
  --csg-surface-hover:color-mix(in srgb,var(--csg-accent) 18%,#171b20);
  --csg-stroke:color-mix(in srgb,var(--csg-accent) 27%,#45505a);
  --csg-ease:cubic-bezier(.22,1,.36,1);
  --csg-button-line:var(--csg-stroke);
  --csg-button-top:var(--csg-surface);
  --csg-button-bottom:color-mix(in srgb,var(--csg-accent) 5%,#0c1014);
}
/* Render the equipped scene once. No doubled wallpaper, blue rails or grid veil. */
html[data-csg-interface] body .site-shell[class*="cosmetic-theme-"]{
  background-image:linear-gradient(#05080c30,#05080c66),var(--theme-scene)!important;
  background-size:cover!important;background-position:center!important;
}
html[data-csg-interface] body .site-shell::before,
html[data-csg-interface] body .site-shell::after,
html[data-csg-interface] body .site-shell main::before,
html[data-csg-interface] body .site-shell main::after,
html[data-csg-interface] body .home-stage::before,
html[data-csg-interface] body .home-stage::after,
html[data-csg-interface] body :is(.v336-ambient-rail,.home-orbit,.hero-grid){display:none!important}
html[data-csg-interface] body .site-shell[class*="cosmetic-theme-"] .home-stage{
  background:color-mix(in srgb,var(--v17-1,#0b1016) 48%,transparent)!important;
  border-color:color-mix(in srgb,var(--csg-accent) 22%,#ffffff24)!important;
  box-shadow:0 24px 70px #0005,inset 0 1px #ffffff0d!important;
  backdrop-filter:none!important;
}
html[data-csg-interface] body .site-shell .csg-button:where(:not(.brand-button,.csg-button-danger,.range-option,.home-rating-card)){
  background:linear-gradient(165deg,var(--csg-button-top),var(--csg-button-bottom))!important;
  border-color:var(--csg-stroke)!important;
}
html[data-csg-interface] body .site-shell .csg-button:where(:not(.brand-button,.csg-button-danger,.range-option,.home-rating-card)):hover:not(:disabled){
  background:var(--csg-surface-hover)!important;
  border-color:var(--csg-accent-soft)!important;
  box-shadow:inset 0 1px #ffffff18,0 10px 24px -14px #000!important;
}
html[data-csg-interface] body .site-shell .csg-button:where(:not(.brand-button,.range-option)):is(.active,.selected,[aria-selected="true"],[aria-checked="true"]){
  background:color-mix(in srgb,var(--csg-accent) 24%,#101419)!important;
  border-color:var(--csg-accent)!important;
}
html[data-csg-interface] body .site-shell .csg-button:is(.csg-button-primary,.signin-button,.submit-top,.side-submit,.side-home,.lock-button,[data-v18-auth="login"]),
html[data-csg-interface] body .site-shell .csg-button:is(.csg-button-primary,.signin-button,.submit-top,.side-submit,.side-home,.lock-button,[data-v18-auth="login"]):hover:not(:disabled){
  background:var(--csg-accent-soft)!important;color:#101318!important;
  border-color:var(--csg-accent-soft)!important;text-shadow:none!important;
  box-shadow:inset 0 1px #fff5,0 6px 18px #0003!important;
}
html[data-csg-interface] body .site-shell .csg-button:disabled{opacity:.5!important;cursor:not-allowed!important;transform:none!important}
html[data-csg-interface] body .site-shell .csg-button-danger{color:#fff2f1!important;background:#65252d!important;border-color:#e56c68!important}
html[data-csg-interface] body .site-shell .csg-button:focus-visible{outline:3px solid var(--csg-accent-soft)!important;outline-offset:4px!important}

/* A persistent off-canvas panel permits both the opening and closing transition.
   Visibility waits for the exit; inert is updated immediately by the controller. */
html[data-csg-interface] body .site-shell .side-menu{
  transform:translateX(-105%)!important;visibility:hidden;pointer-events:none;
  background:color-mix(in srgb,var(--csg-accent) 7%,#101318)!important;
  transition:transform .24s var(--csg-ease),visibility 0s linear .24s,background-color .2s ease!important;
  border-radius:0 18px 18px 0!important;
}
html[data-csg-interface] body .site-shell .side-menu.open{
  transform:translateX(0)!important;visibility:visible;pointer-events:auto;
  transition:transform .28s var(--csg-ease),visibility 0s,background-color .2s ease!important;
}

/* Restored, unchanged V33 artwork from the original repository revision. */
html[data-csg-interface] body .site-shell .v33-nav-icon[data-v33-icon]{
  background:var(--csg-icon) center/contain no-repeat!important;
  border:0!important;box-shadow:none!important;color:transparent!important;
  border-radius:0!important;font-size:0!important;filter:none!important;
}
html[data-csg-interface] body .site-shell .v33-nav-icon[data-v33-icon]>*{visibility:hidden!important}
html[data-csg-interface] body .site-shell .v33-nav-icon[data-v33-icon]::before,
html[data-csg-interface] body .site-shell .v33-nav-icon[data-v33-icon]::after{content:none!important}
/* CSGuessr icon pack. Every navigation, gamemode and control mark is the same
   artwork family: dark metal and glass with blue and gold accent lighting.
   leaderboard and profile previously stood in as flat inline SVG badges because
   the old webp sources decoded fully transparent; both are real artwork now. */
[data-v33-icon="home"]{--csg-icon:url('/v33-icons/home.webp?v=4401-pack')}
[data-v33-icon="ranked"]{--csg-icon:url('/v33-icons/ranked.webp?v=4401-pack')}
[data-v33-icon="hardcore"]{--csg-icon:url('/v33-icons/hardcore.webp?v=4401-pack')}
[data-v33-icon="higherlower"]{--csg-icon:url('/v33-icons/higherlower.webp?v=4401-pack')}
[data-v33-icon="survival"]{--csg-icon:url('/v33-icons/survival.webp?v=4401-pack')}
[data-v33-icon="duel"]{--csg-icon:url('/v33-icons/duel.webp?v=4401-pack')}
[data-v33-icon="cases"]{--csg-icon:url('/v33-icons/cases.webp?v=4401-pack')}
[data-v33-icon="inventory"]{--csg-icon:url('/v33-icons/inventory.webp?v=4401-pack')}
[data-v33-icon="upgrader"]{--csg-icon:url('/v33-icons/upgrader.webp?v=4401-pack')}
[data-v33-icon="operation"]{--csg-icon:url('/v33-icons/operation.webp?v=4401-pack')}
[data-v33-icon="cosmetics"]{--csg-icon:url('/v33-icons/cosmetics.webp?v=4401-pack')}
[data-v33-icon="leaderboard"]{--csg-icon:url('/v33-icons/leaderboard.webp?v=4401-pack')}
[data-v33-icon="profile"]{--csg-icon:url('/v33-icons/profile.webp?v=4401-pack')}
[data-v33-icon="clips"]{--csg-icon:url('/v33-icons/clips.webp?v=4401-pack')}

/* Control marks: Submit Clip, Play, Lock Rating, Quick Open and Settings. */
[data-v33-icon="submitclip"]{--csg-icon:url('/v33-icons/submitclip.webp?v=4401-pack')}
[data-v33-icon="play"]{--csg-icon:url('/v33-icons/play.webp?v=4401-pack')}
[data-v33-icon="lockrating"]{--csg-icon:url('/v33-icons/lockrating.webp?v=4401-pack')}
[data-v33-icon="quickopen"]{--csg-icon:url('/v33-icons/quickopen.webp?v=4401-pack')}
[data-v33-icon="settings"]{--csg-icon:url('/v33-icons/settings.webp?v=4401-pack')}
/* Progress Hub had no reference cell; this mark is drawn to match the pack. */
[data-v33-icon="progress"]{--csg-icon:url('/v33-icons/progress.webp?v=4401-pack')}
[data-v33-icon="about"]{--csg-icon:url('/v33-icons/about.webp?v=4401-pack')}
[data-v33-icon="faq"]{--csg-icon:url('/v33-icons/faq.webp?v=4401-pack')}
[data-v33-icon="contact"]{--csg-icon:url('/v33-icons/contact.webp?v=4401-pack')}
[data-v33-icon="draft"]{--csg-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23c9d7df' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='7' width='22' height='21' rx='4'/%3E%3Cpath d='M10 4v6m12-6v6M5 14h22m-16 5h3m4 0h3m-10 4h3m4 0h3'/%3E%3C/svg%3E")}

/* The selector is the feature boundary. Legacy retains its existing menu layout. */
.csg-lobby-intro,.csg-mode-detail{display:none!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-stage{
  display:grid!important;grid-template-columns:minmax(0,1fr) 260px!important;
  gap:24px!important;width:min(1240px,calc(100% - 64px))!important;max-width:1240px!important;
  min-height:0!important;margin:32px auto 48px!important;padding:32px!important;
  border-radius:24px!important;overflow:visible!important;
}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-stage:has(.csg-lobby-intro) :is(.home-stage-copy,.home-mode-heading,.v33-home-mode-heading,.v33-mode-priority-heading,.home-pulse){display:none!important}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-intro{display:block!important;grid-column:1;grid-row:1;order:0;align-self:center;text-align:left!important}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-eyebrow{font:700 11px/1.5 var(--font-inter,Inter,Arial,sans-serif)!important;letter-spacing:.15em!important;color:var(--csg-accent-soft)!important;margin:0 0 18px!important}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-intro h1{font-size:clamp(38px,4.4vw,66px)!important;font-weight:700!important;line-height:.98!important;letter-spacing:-.025em!important;max-width:650px;margin:0 0 20px!important;color:#f3f4ef!important;text-transform:none!important}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-intro h1 em{font-style:normal!important;color:var(--csg-accent-soft)!important;display:block}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-summary{font-size:15px!important;line-height:1.65!important;max-width:520px;color:#dde1e4!important;margin:0!important}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-steps{display:flex;flex-wrap:wrap;gap:12px 22px;list-style:none;margin:24px 0 0;padding:0}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-steps li{font-size:12px;display:flex;align-items:center;gap:8px;color:#ecedef}
html[data-csg-interface="modern"] body .site-shell .csg-lobby-steps li>span{font-size:10px;font-variant-numeric:tabular-nums;color:var(--csg-accent-soft);border-bottom:1px solid var(--csg-stroke);padding:4px 0}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-rating-card{
  grid-column:2;grid-row:1;order:0!important;align-self:stretch;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;
  width:100%!important;max-width:none!important;min-width:0!important;min-height:210px!important;margin:0!important;padding:28px!important;border-radius:18px!important;
  background:color-mix(in srgb,var(--v17-1,#101318) 82%,transparent)!important;
  text-align:left!important;gap:12px!important;
}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-rating-card small{font-size:11px!important;letter-spacing:.1em!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-rating-card strong{font-size:56px!important;line-height:1!important;font-variant-numeric:tabular-nums}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-rating-card>span{font-size:11px!important;line-height:1.5!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode-grid{
  grid-column:1/-1;grid-row:2;order:1!important;display:grid!important;
  grid-template-columns:1.15fr 1fr 1fr!important;grid-template-rows:repeat(2,minmax(180px,auto))!important;
  gap:14px!important;width:100%!important;max-width:none!important;margin:6px 0 0!important;padding:0!important;
}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode{
  display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;grid-template-rows:auto 1fr!important;gap:12px 14px!important;
  align-content:start!important;align-items:center!important;justify-content:start!important;
  min-width:0!important;min-height:0!important;width:100%!important;height:auto!important;padding:22px!important;margin:0!important;
  grid-column:auto!important;grid-row:auto!important;
  border-radius:18px!important;text-align:left!important;overflow:hidden!important;
}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode::before,
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode::after{content:none!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>.v33-nav-icon{grid-column:1;grid-row:1;width:54px!important;height:54px!important;margin:0!important;transition:transform .22s var(--csg-ease)!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode:hover>.v33-nav-icon{transform:translateY(-3px)!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>i:not(.v33-nav-icon){display:none!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>span:not(.csg-mode-detail){display:block!important;grid-column:2;grid-row:1;min-width:0}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>span:not(.csg-mode-detail)>:is(small,em){display:none!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>span>b{font-size:24px!important;line-height:1.05!important;letter-spacing:0!important;color:#f3f4f1!important;white-space:normal!important}
html[data-csg-interface="modern"] body .site-shell .csg-mode-detail{display:flex!important;flex-direction:column;gap:10px;grid-column:1/-1;grid-row:2;align-self:stretch;min-width:0}
html[data-csg-interface="modern"] body .site-shell .csg-mode-kicker{display:none!important}
html[data-csg-interface="modern"] body .site-shell .csg-mode-description{font-size:13px!important;font-weight:400!important;line-height:1.55!important;color:#d2d8dc!important;font-style:normal!important;white-space:normal!important}
html[data-csg-interface="modern"] body .site-shell .csg-mode-action{display:flex!important;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:12px;font-size:12px!important;font-weight:700!important;color:var(--csg-accent-soft)!important}
.csg-mode-arrow{display:inline-block!important;width:18px;height:10px;position:relative;flex:0 0 18px;transition:transform .18s ease}
.csg-mode-arrow::before{content:"";position:absolute;inset:4px 0 auto;height:1.5px;background:currentColor}
.csg-mode-arrow::after{content:"";position:absolute;width:8px;height:8px;right:0;top:1px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.center-mode:hover .csg-mode-arrow{transform:translateX(3px)}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked{
  grid-column:1!important;grid-row:1/3!important;grid-template-columns:1fr!important;grid-template-rows:auto auto 1fr!important;
  gap:18px!important;padding:30px!important;border-color:var(--csg-accent)!important;
  background:linear-gradient(155deg,color-mix(in srgb,var(--csg-accent) 23%,#15191e),color-mix(in srgb,var(--csg-accent) 6%,#0d1116))!important;
  box-shadow:inset 0 1px #ffffff26,0 12px 36px #0004!important;
}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>.v33-nav-icon{width:100px!important;height:100px!important;grid-row:1;grid-column:1;align-self:start}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>span:not(.csg-mode-detail){grid-column:1;grid-row:2}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>span>b{font-size:42px!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>.csg-mode-detail{grid-row:3;gap:14px}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked .csg-mode-kicker{display:block!important;font-size:10px!important;letter-spacing:.12em;text-transform:uppercase;color:var(--csg-accent-soft)!important;order:-1}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked .csg-mode-description{font-size:14px!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked .csg-mode-action{background:var(--csg-accent-soft);color:#101318!important;padding:15px 17px!important;border-radius:10px;min-height:46px;font-size:14px!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.v18-draft{grid-column:1/-1!important;grid-row:auto!important;grid-template-columns:54px minmax(130px,.7fr) minmax(0,2fr)!important;grid-template-rows:auto!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.v18-draft>.csg-mode-detail{grid-column:3!important;grid-row:1!important;flex-direction:row;align-items:center;gap:24px}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.v18-draft .csg-mode-action{margin:0;padding:0;white-space:nowrap;flex-shrink:0}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools{grid-column:1/-1;grid-row:3;order:2!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:12px!important;min-width:0!important;min-height:86px!important;padding:14px!important;border-radius:14px!important;text-align:left!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button>.v33-nav-icon{flex:0 0 38px!important;width:38px!important;height:38px!important;margin:0!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button b{font-size:15px!important;line-height:1.2!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button small{display:block!important;font-size:11px!important;line-height:1.4!important;margin-top:5px!important;color:#bac4cb!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v33-home-account-tools{grid-column:1/-1;grid-row:4;order:3!important;max-width:none!important;width:100%!important;margin:0!important;padding:0!important;justify-content:flex-end!important;gap:10px!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v33-home-account-tools button{height:auto!important;max-height:none!important;min-height:44px!important;font-size:12px!important;padding:10px 16px!important;white-space:normal!important;line-height:1.4!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v337-theme-switcher{grid-column:1/-1;grid-row:5;order:5!important;width:100%!important;max-width:none!important;margin:0!important;padding:16px!important;background:var(--csg-surface)!important;border-color:var(--csg-stroke)!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v337-theme-title span{font-size:10px!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v337-theme-option{min-height:56px!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v34-queue-warning{grid-column:1/-1;grid-row:6;order:6!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .csg-home-rebirth{grid-column:1/-1;grid-row:7;order:7!important;width:100%!important;margin:0!important;background:var(--csg-surface)!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) :is(.home-tools,.v33-home-account-tools)::before{content:none!important}
html[data-csg-interface="modern"] body .site-shell :is(.settings-console,.shop-console,.leaderboard-section,.profile-console){border-radius:20px!important;background-color:color-mix(in srgb,var(--v17-1,#101318) 84%,transparent)!important}
html[data-csg-interface="modern"] body .site-shell .topbar{background:color-mix(in srgb,var(--v17-1,#101318) 90%,transparent)!important;box-shadow:0 1px 0 #ffffff0c!important}
html[data-csg-interface="modern"]{color-scheme:dark;scrollbar-color:#53616b #0d1217;scrollbar-width:thin}
html[data-csg-interface="modern"] body .site-shell .side-menu{padding:20px!important;width:min(360px,92vw)!important;scrollbar-width:thin;scrollbar-color:var(--csg-stroke) transparent}
html[data-csg-interface="modern"] body .site-shell .side-menu nav button{padding:12px!important;min-height:64px!important;gap:4px 13px!important;border-radius:12px!important}
html[data-csg-interface="modern"] body .site-shell .side-menu nav>.csg-button:not(.active){background:transparent!important;border-color:transparent!important;box-shadow:none!important}
html[data-csg-interface="modern"] body .site-shell .side-menu nav>.csg-button:not(.active):hover{background:var(--csg-surface-hover)!important;border-color:var(--csg-stroke)!important;box-shadow:none!important}
html[data-csg-interface="modern"] body .site-shell .side-menu nav>.csg-button.active{background:color-mix(in srgb,var(--csg-accent) 15%,#101318)!important;border-color:transparent!important;border-left-color:var(--csg-accent)!important;box-shadow:inset 2px 0 var(--csg-accent)!important}
html[data-csg-interface="modern"] body .site-shell .side-menu nav>span:has(+span){display:none!important}
html[data-csg-interface="modern"] body .site-shell .side-menu nav button>b{font-size:14px!important}
html[data-csg-interface="modern"] body .site-shell .side-menu nav button>small{font-size:11px!important}

/* Settings stays available in either presentation, with native keyboard radios. */
html[data-csg-interface] body .site-shell .csg-interface-setting{min-width:0;margin:0 0 24px;padding:24px;border:1px solid var(--csg-stroke);border-radius:16px;background:var(--csg-surface)}
.csg-interface-setting legend{font-size:20px;font-weight:700;padding:0 8px;color:#f5f5f0}
.csg-interface-description{font-size:14px!important;line-height:1.6;margin:0 0 18px!important}
.csg-interface-choices{display:grid;grid-template-columns:1fr 1fr;gap:14px}
html[data-csg-interface] body .site-shell .csg-interface-option{display:grid;grid-template-columns:20px 1fr;align-content:start;gap:14px;padding:18px;border:1px solid var(--csg-stroke);border-radius:12px;cursor:pointer;color:#edf1f4!important;transition:background .18s,border-color .18s}
.csg-interface-option:has(input:checked){border-color:var(--csg-accent)!important;background:color-mix(in srgb,var(--csg-accent) 12%,#101318)}
.csg-interface-option:has(input:focus-visible){outline:3px solid var(--csg-accent-soft);outline-offset:3px}
.csg-interface-option input{accent-color:var(--csg-accent);width:18px;height:18px;align-self:center;grid-column:1;grid-row:2}
.csg-interface-choice-copy{grid-column:2;grid-row:2;display:grid;gap:7px}
.csg-interface-choice-copy b{font-size:16px!important}
.csg-interface-choice-copy small{font-size:12px!important;line-height:1.5!important;font-weight:400}
.csg-interface-preview{grid-column:1/-1;display:grid;gap:5px;padding:10px;border-radius:8px;background:#080c11;height:74px;grid-template-columns:1.2fr 1fr 1fr}
.csg-interface-preview i{border:1px solid var(--csg-stroke);background:var(--csg-surface);border-radius:4px}
.csg-interface-preview-modern i:first-child{grid-row:1/3;background:color-mix(in srgb,var(--csg-accent) 30%,#111820)}
.csg-interface-preview-legacy{grid-template-columns:repeat(5,1fr);align-items:center}
.csg-interface-preview-legacy i{height:36px}
.csg-interface-status{font-size:12px!important;line-height:1.5;margin:16px 0 0!important}

@keyframes csgLobbyEnter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) :is(.csg-lobby-intro,.home-rating-card,.center-mode-grid,.home-tools){animation:csgLobbyEnter .38s var(--csg-ease) both!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode-grid{animation-delay:.05s!important}
html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools{animation-delay:.1s!important}
@media(max-width:1050px){
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-stage{width:calc(100% - 32px)!important;grid-template-columns:minmax(0,1fr) 220px!important;padding:24px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode-grid{grid-template-columns:1fr 1fr!important;grid-template-rows:auto!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked{grid-column:1/-1!important;grid-row:auto!important;grid-template-columns:110px 1fr!important;grid-template-rows:auto auto!important;padding:24px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>.v33-nav-icon{grid-column:1;grid-row:1/3}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>span:not(.csg-mode-detail){grid-column:2;grid-row:1}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>.csg-mode-detail{grid-column:2;grid-row:2}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:700px){
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-stage{display:flex!important;flex-direction:column!important;width:calc(100% - 20px)!important;padding:18px!important;gap:20px!important;margin:16px auto 24px!important;border-radius:18px!important}
  html[data-csg-interface="modern"] body .site-shell .csg-lobby-intro h1{font-size:44px!important}
  html[data-csg-interface="modern"] body .site-shell .csg-lobby-summary{font-size:14px!important}
  html[data-csg-interface="modern"] body .site-shell .csg-lobby-steps{gap:8px 14px;margin-top:16px}
  html[data-csg-interface="modern"] body .site-shell .csg-lobby-steps li{font-size:11px}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-rating-card{order:2!important;min-height:0!important;padding:18px!important;gap:8px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-rating-card strong{font-size:40px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode-grid{gap:10px!important;margin:0!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode{grid-template-columns:1fr!important;grid-template-rows:44px auto 1fr!important;padding:16px!important;gap:12px!important;border-radius:14px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>.v33-nav-icon{width:44px!important;height:44px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>span:not(.csg-mode-detail){grid-column:1;grid-row:2}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>span>b{font-size:23px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode>.csg-mode-detail{grid-row:3}
  html[data-csg-interface="modern"] body .site-shell .csg-mode-description{font-size:12px!important}
  html[data-csg-interface="modern"] body .site-shell .csg-mode-action{font-size:11px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked{grid-template-columns:64px 1fr!important;grid-template-rows:auto auto!important;padding:20px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>.v33-nav-icon{width:64px!important;height:64px!important;grid-row:1}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>span>b{font-size:36px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.ranked>.csg-mode-detail{grid-column:1/-1!important;grid-row:2!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.v18-draft{grid-template-columns:44px 1fr!important;grid-template-rows:auto auto!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.v18-draft>span:not(.csg-mode-detail){grid-column:2;grid-row:1}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode.v18-draft>.csg-mode-detail{grid-column:1/-1!important;grid-row:2!important;flex-direction:column;align-items:stretch;gap:12px}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools{order:3!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button{min-height:76px!important;padding:12px!important;gap:9px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button b{font-size:14px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .home-tools>button>.v33-nav-icon{width:30px!important;height:30px!important;flex-basis:30px!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .v33-home-account-tools{order:4!important}
  .csg-interface-choices{grid-template-columns:1fr}
  html[data-csg-interface] body .site-shell .csg-interface-setting{padding:16px}
}
@media(max-width:360px){html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) .center-mode-grid{grid-template-columns:1fr!important}}
/* Both the OS preference and the existing in-game toggle take precedence. */
html[data-csg-interface] body .site-shell.setting-reduced :is(.side-menu,.csg-button,.v33-nav-icon,.csg-mode-arrow,.csg-interface-option){transition:none!important}
html[data-csg-interface="modern"] body .site-shell.setting-reduced.page-home :is(.csg-lobby-intro,.home-rating-card,.center-mode-grid,.home-tools){animation:none!important}
@media(prefers-reduced-motion:reduce){
  html[data-csg-interface] body .site-shell :is(.side-menu,.csg-button,.v33-nav-icon,.csg-mode-arrow,.csg-interface-option){transition:none!important}
  html[data-csg-interface="modern"] body .site-shell.page-home:has(.csg-lobby-intro) :is(.csg-lobby-intro,.home-rating-card,.center-mode-grid,.home-tools){animation:none!important}
}
html[data-csg-interface] body .site-shell.setting-contrast .home-stage{background:#080c12f2!important}
html[data-csg-interface] body .site-shell.setting-contrast .csg-button{border-color:#dce6ed!important}

/* Control marks sit inline inside real text buttons, so they size themselves
   rather than borrowing the 44/54px nav tile sizing. */
html[data-csg-interface] body .site-shell .csg-control-icon[data-v33-icon]{
  display:inline-block!important;
  width:18px!important;height:18px!important;
  flex:none!important;
  vertical-align:-3px!important;
  margin-right:7px!important;
  background:var(--csg-icon) center/contain no-repeat!important;
}
html[data-csg-interface] body .site-shell .lock-button .csg-control-icon[data-v33-icon]{width:20px!important;height:20px!important;vertical-align:-4px!important}
html[data-csg-interface] body .site-shell .settings-icon .csg-control-icon[data-v33-icon]{
  width:22px!important;height:22px!important;margin:0!important;vertical-align:middle!important;
}
html[data-csg-interface] body .site-shell .settings-icon{font-size:0!important}
