
/* Float refinement: interactive draggable boards and consistent admin/visual identity. */
body.float-ui .app-shell:not(.admin-mode) .float-sidebar-tools #site-audio-expand{
  display:none!important;
}
body.float-ui .float-volume-settings{
  display:none;align-items:center;justify-content:center;
  width:35px;height:40px;border:0;border-radius:11px;background:transparent;
  color:var(--muted)
}
body.float-ui .float-volume-settings svg{width:20px;height:20px}
body.float-ui .float-sidebar-tools .site-audio{gap:0!important}body.float-ui .app-shell:not(.admin-mode) .float-player-kind{
  color:var(--muted);font-size:14px;text-align:center
}
/* A lighter, more editorial site-wide rankings layout, no bulky card stack. */
body.float-ui .app-shell:not(.admin-mode) .rankings-hub{
  max-width:1150px;padding-top:15px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-hub>.page-header{
  padding:29px 0 24px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-hub>.page-header h1{
  font-size:clamp(43px,5.3vw,70px);font-weight:840;letter-spacing:-.068em;margin-bottom:10px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-switch{
  margin:8px 0 26px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-heading{
  display:flex;align-items:end;justify-content:space-between;
  gap:25px;margin:0 0 18px;padding-top:13px;
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-heading h2{
  margin:0 0 5px;font-weight:770;font-size:clamp(23px,2.9vw,32px);letter-spacing:-.05em
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-heading p{
  color:var(--muted);font-size:12px;margin:0
}
/* An editorial score list rather than a bordered table. Its four-column
   geometry lives in theme.css; the fourth column reaches the right edge. */
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-board{
  background:transparent;border:0;box-shadow:none;
  border-radius:0;padding:4px 0 3px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-board-columns{
  display:flex;justify-content:space-between;
  color:var(--muted);font-size:10px;letter-spacing:.12em;
  font-weight:800;padding:9px 8px 10px;
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-row{
  min-height:54px;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--line) 68%,transparent)!important;
  box-shadow:none!important;
  border-radius:11px;
  background:transparent;
  gap:12px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-row:last-child{
  border-bottom:0!important
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-row:hover{
  background:color-mix(in srgb,var(--text) 2%,transparent)
}
body.float-ui .app-shell:not(.admin-mode) .rankings-combined-row .rankings-combined-points{
  font-weight:var(--tg-rank-score-weight);
  font-variant-numeric:tabular-nums;
  justify-self:end;text-align:right
}
body.float-ui .app-shell:not(.admin-mode) .rankings-board-summary,
body.float-ui .app-shell:not(.admin-mode) .rankings-scoring-note{
  color:var(--muted);font-size:12px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-single-games{
  margin-top:40px;border-top:1px solid var(--line);padding-top:23px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-game-links{
  gap:10px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-game-link{
  background:transparent;border:1px solid var(--line);border-radius:16px;
  box-shadow:none;transition:background .18s,transform .18s
}
body.float-ui .app-shell:not(.admin-mode) .rankings-game-link:hover{
  background:var(--surface-soft);transform:translateY(-2px)
}
/* Admin is a separate application mode; don't blend in the Float shell. */
body:not(.float-ui) .app-shell.admin-mode .sidebar{
  position:sticky;top:0;min-height:100vh
}
body:not(.float-ui) .app-shell.admin-mode .workspace>.topbar{
  display:none!important
}
body:not(.float-ui) .app-shell.admin-mode #main-content{
  max-width:1300px
}
body .admin-tier-preview{
  top:16px;right:16px;left:auto;bottom:auto;
  z-index:90;min-height:43px;gap:9px;border-radius:14px;
  padding:7px 11px;user-select:none
}
body .admin-tier-preview .float-admin-grip{
  font-size:19px;line-height:1;min-width:20px;
  border:0;background:transparent;color:var(--muted);
  cursor:grab;touch-action:none;padding:4px;
}
body .admin-tier-preview .float-admin-grip:active{cursor:grabbing}
body .admin-tier-preview .float-admin-identity{
  display:flex;align-items:center;flex-shrink:0
}
body .admin-tier-preview .float-admin-build{
  display:flex!important;align-items:center;gap:3px;
  font-size:10px;font-weight:850;white-space:nowrap;
  padding:5px 7px;border-radius:8px;max-width:none;
  position:static;box-shadow:none;min-height:26px;
}
body .admin-tier-preview .float-admin-build .environment-build-text{
  font-weight:650;font-size:9px;letter-spacing:0
}
body .admin-tier-preview[hidden]{display:none!important}
@media(max-width:1050px){
  body.float-ui .app-shell:not(.admin-mode) .rankings-combined-heading{align-items:flex-start;flex-direction:column}
}
@media(max-width:700px){
  body.float-ui .float-volume-settings{display:inline-flex}
  body.float-ui .app-shell:not(.admin-mode) .rankings-board-columns{padding-left:6px;padding-right:6px}
  body .admin-tier-preview{top:8px;right:8px;max-width:calc(100vw - 16px)}
  body .admin-tier-preview .float-admin-build .environment-build-text{display:none}
}
@media(prefers-reduced-motion:reduce){body .admin-tier-preview{transition:none}
}

/* Self-identification is typographic rather than a coloured row. */
body.float-ui .tg-rank-self-label{display:none!important}
body .admin-tier-preview .float-admin-grip:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px
}


/* Float unified shell v5. Navigation is IDENTICAL in Main and Admin. */
body.float-ui .app-shell .sidebar{
  position:sticky;top:0;height:100dvh;min-height:100dvh;
  display:flex;flex-direction:column;overflow:visible
}
body.float-ui .app-shell .sidebar-top{
  display:flex!important;flex-direction:column;justify-content:flex-start;
  align-items:center;position:relative;flex:0 0 124px;
  min-height:124px;height:124px;padding:16px 12px 8px;
  border-bottom:0;gap:0
}
body.float-ui .app-shell .sidebar-brand-block{
  width:100%;max-width:100%;min-height:43px;flex:0 0 43px;
  display:flex;align-items:center;justify-content:center;
}
body.float-ui .app-shell .side-brand{
  display:inline-flex!important;align-items:center;justify-content:center;
  max-width:100%;min-width:0;height:43px;
  white-space:nowrap;overflow:hidden;gap:9px
}
body.float-ui .app-shell.sidebar-collapsed .sidebar .sidebar-brand-block{
  display:flex;align-items:center;justify-content:center
}
body.float-ui .app-shell.sidebar-collapsed .sidebar .side-brand{
  display:inline-flex!important;width:43px;height:43px;overflow:visible
}
body.float-ui .app-shell .sidebar-top .brand-monogram{
  display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;
}
body.float-ui .app-shell .sidebar-top .collapse-button{
  display:inline-flex!important;position:absolute;left:50%;right:auto;
  top:76px;transform:translateX(-50%);width:32px;height:32px;
  border-radius:11px;align-items:center;justify-content:center
}
/* On a collapsed desktop rail the expand button occupies exactly the
   monogram's position and is revealed when that logo area is hovered. */
@media(min-width:701px){
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top{
   height:82px!important;min-height:82px!important;flex-basis:82px!important;
   padding:17px 12px 8px!important;position:relative
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .sidebar-brand-block{
   position:relative;width:43px!important;min-height:43px;
   height:43px;flex:0 0 43px;align-self:center
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .collapse-button{
   top:17px!important;left:50%!important;right:auto!important;
   width:43px!important;height:43px!important;
   transform:translateX(-50%)!important;opacity:0;
   pointer-events:none;border-radius:13px!important;
   background:var(--surface-soft);color:var(--text);
   transition:opacity .16s ease,background .16s ease
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top:hover .collapse-button,
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .collapse-button:focus-visible{
   opacity:1;pointer-events:auto
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top:hover .side-brand,
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top:has(.collapse-button:focus-visible) .side-brand{
   opacity:0;pointer-events:none
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .side-brand{
   transition:opacity .16s ease
 }
}
body.float-ui .app-shell .sidebar-content{
  flex:1 1 auto;min-height:0;
  overflow-x:hidden;overflow-y:auto;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;touch-action:pan-y;
  scrollbar-width:thin
}
body.float-ui .app-shell .sidebar-bottom{
  margin-top:auto;flex-shrink:0;overflow:visible
}
body.float-ui .app-shell .sidebar .float-sidebar-tools{
  display:flex!important;visibility:visible
}
body.float-ui .app-shell .sidebar .float-sidebar-tools :is(.profile-menu,.site-audio-panel)[hidden]{
  display:none!important
}
/* The volume adjustment is a horizontal rail directly to the speaker's
   right. Remove the obsolete top-mounted notch and vertical range rules. */
body.float-ui .app-shell .sidebar .site-audio-panel{
  position:absolute!important;z-index:70;
  left:calc(100% + 9px)!important;right:auto!important;
  top:50%!important;bottom:auto!important;
  transform:translateY(-50%);animation:site-volume-show .16s ease-out both;
  display:flex;flex-direction:row;
  align-items:center;justify-content:center;gap:12px;
  min-width:211px;max-width:235px;height:51px;padding:8px 14px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:14px;box-shadow:0 14px 42px rgba(0,0,0,.13);
}
body.float-ui .app-shell .sidebar .site-audio-panel::before{display:none!important;content:none}
body.float-ui .app-shell .sidebar .site-audio-panel input[type="range"]{
  writing-mode:horizontal-tb!important;direction:ltr!important;
  width:136px;min-width:115px;height:24px!important;
  margin:0;accent-color:var(--accent);touch-action:pan-x
}
body.float-ui .app-shell .sidebar .site-audio-panel output{
  min-width:32px;font-size:11px;text-align:right;font-variant-numeric:tabular-nums;
}
body.float-ui .app-shell .sidebar #site-audio-expand{display:none!important}
body.float-ui .app-shell .sidebar .float-volume-settings{
  display:none;flex-shrink:0;border-radius:9px;
}
@media(max-width:700px){
 body.float-ui .app-shell .sidebar{
   position:fixed;top:0;left:0;bottom:0;z-index:51;width:260px;
   height:100dvh;min-height:100dvh;transform:translateX(-110%)
 }
 body.float-ui .app-shell.mobile-open .sidebar{transform:translateX(0)}
 body.float-ui .app-shell .sidebar-top,
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top{
   height:102px;min-height:102px;flex-basis:102px;padding-top:8px
 }
 body.float-ui .app-shell .sidebar-top .collapse-button{top:59px}
 body.float-ui .app-shell .sidebar .float-sidebar-tools{flex-direction:row}
 body.float-ui .app-shell .sidebar .float-volume-settings{display:inline-flex}
 body.float-ui .app-shell .sidebar .site-audio-panel{
   left:12px!important;top:auto!important;bottom:66px!important;
   transform:none;min-width:210px;width:calc(100% - 24px)
 }
}
/* Admin content uses Float's light/dark tokens and panels. Black admin
   bar remains, but the entire rail and bottom utility set is shared. */
body.float-ui .app-shell.admin-mode{
  min-height:100dvh
}
body.float-ui .app-shell.admin-mode .workspace{
  background:var(--canvas)
}
body.float-ui .app-shell.admin-mode main#main-content{
  max-width:none;min-width:0;margin:0;
  padding:0 clamp(22px,3.8vw,64px) 58px
}
body.float-ui .app-shell.admin-mode #main-content>.page[data-page="admin"]{
  max-width:1280px;margin:0 auto;min-width:0
}
body.float-ui .app-shell.admin-mode .admin-header{
  padding:37px 0 28px
}
body.float-ui .app-shell.admin-mode .admin-header h1{
  font-size:clamp(43px,5vw,64px);
  line-height:1.08;letter-spacing:-.065em;font-weight:830
}
body.float-ui .app-shell.admin-mode .admin-subtitle{
  font-size:13px;color:var(--muted);max-width:700px
}
body.float-ui .app-shell.admin-mode .admin-kpis{
  gap:17px;margin-bottom:27px
}
body.float-ui .app-shell.admin-mode .admin-kpis>button{
  border:0;border-top:2px solid var(--line);border-radius:0;
  background:transparent;padding:18px 6px 17px;box-shadow:none;
  text-align:left;transition:background .18s,transform .18s
}
body.float-ui .app-shell.admin-mode .admin-kpis>button:hover{
  background:var(--surface-soft);transform:translateY(-2px)
}
body.float-ui .app-shell.admin-mode .admin-kpis strong{
  font-size:clamp(38px,4vw,57px);line-height:1.16;
  font-weight:820;letter-spacing:-.065em
}
body.float-ui .app-shell.admin-mode .admin-panel-card{
  border:1px solid var(--line);border-radius:18px;
  background:var(--surface);box-shadow:none;padding:23px
}
body.float-ui .app-shell.admin-mode .admin-dashboard-link{
  transition:transform .22s,box-shadow .22s
}
body.float-ui .app-shell.admin-mode .admin-dashboard-link:hover{
  transform:translateY(-3px);box-shadow:0 12px 30px rgba(18,35,40,.08)
}
body.float-ui .app-shell.admin-mode .admin-bar{
  background:#16191b;color:#f5f5f5;box-shadow:none;
  border-bottom:1px solid #32393d;position:sticky;top:0;z-index:15
}
body.float-ui .app-shell.admin-mode .admin-table-wrap{
  border:1px solid var(--line);border-radius:18px;overflow-x:auto;
  box-shadow:none;background:var(--surface)
}
body.float-ui .app-shell.admin-mode .admin-table th{
  background:var(--surface-soft)
}
body.float-ui .app-shell.admin-mode .admin-tabs{
  border-bottom:1px solid var(--line)
}
body.float-ui .app-shell.admin-mode .admin-tabs button[aria-selected="true"]{
  border-radius:10px 10px 0 0;color:var(--text)
}
body.float-ui .app-shell.admin-mode .admin-reset-tools{
  border:1px solid var(--line);border-radius:17px;box-shadow:none;
  background:var(--surface)
}
@media(max-width:700px){
 body.float-ui .app-shell.admin-mode main#main-content{padding:0 15px 110px}
 body.float-ui .app-shell.admin-mode .admin-header{padding:19px 0 23px}
 body.float-ui .app-shell.admin-mode .admin-header h1{font-size:38px}
 body.float-ui .app-shell.admin-mode .admin-kpis{
   grid-template-columns:repeat(2,minmax(0,1fr));gap:10px
 }
 body.float-ui .app-shell.admin-mode .admin-kpis>button{padding:12px 4px}
 body.float-ui .app-shell.admin-mode .admin-kpis strong{font-size:35px}
}
/* The user can always reach the private Admin route from the floating
   Free/Plus toolbar. It follows the same stored drag position as that bar. */
body.float-ui .admin-tier-preview .float-admin-link{
  color:var(--text);font-size:11px;font-weight:830;text-decoration:none;
  padding:7px 9px;border-radius:9px;white-space:nowrap
}
body.float-ui .admin-tier-preview .float-admin-link:hover{
  background:var(--surface-soft)
}
body.float-ui .admin-tier-preview .float-admin-test-result{
  appearance:none;display:inline-flex;align-items:center;gap:4px;
  border:0;background:transparent;cursor:pointer;font:inherit;
  max-width:142px
}
body.float-ui .admin-tier-preview .float-admin-test-result:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px
}


/* Float v6 - one alignment contract for every sidebar row, regardless of
   catalogue order, app route, theme and collapsed state. */
body.float-ui{
  --sidebar-expanded:244px;
}
@media(min-width:701px){
  body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar{
    width:var(--sidebar-expanded)!important
  }
  body.float-ui .app-shell.sidebar-collapsed .sidebar{
    width:var(--sidebar-collapsed)!important
  }
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-content{
  padding:6px 11px 0!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-content .side-nav,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-game-list .side-nav{
  display:flex;flex-direction:column;align-items:stretch;gap:4px
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-content .side-nav a,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-game-list .side-nav a{
  display:grid!important;grid-template-columns:24px minmax(0,1fr);
  justify-content:start!important;justify-items:start!important;
  align-items:center;column-gap:15px;min-height:44px;
  width:100%;margin:0!important;padding:0 13px!important;
  text-align:left;white-space:nowrap
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .side-nav a>svg{
  display:grid;place-items:center;grid-column:1;grid-row:1;
  width:24px!important;height:24px!important;
  min-width:24px!important;min-height:24px!important;
  max-width:24px!important;margin:0!important;justify-self:center!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .side-nav a>.sidebar-label{
  display:block!important;grid-column:2;grid-row:1;
  min-width:0;max-width:100%;font-size:12px;font-weight:710;
  overflow:hidden;text-overflow:ellipsis;justify-self:start
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-game-list .side-nav{
  border-top:1px solid var(--line);padding-top:15px;margin-top:16px;
}
body.float-ui .app-shell .sidebar .float-sidebar-tools{
  width:100%;gap:4px!important;
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools{
  align-items:stretch!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>#site-audio,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.float-theme-row,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control{
  position:relative;display:grid!important;
  grid-template-columns:24px minmax(0,1fr);
  align-items:center;column-gap:15px;
  width:100%;height:44px;min-height:44px;
  padding:0 13px;margin:0!important;border-radius:12px
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>:is(#site-audio,.float-theme-row,.profile-control):hover{
  background:var(--surface-soft)
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools :is(#site-audio-mute,#theme-toggle){
  grid-column:1;grid-row:1;justify-self:center;
  width:24px!important;height:30px!important;min-width:24px!important;
  min-height:30px!important;margin:0;padding:0
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .float-tool-label{
  grid-column:2;grid-row:1;display:block!important;
  color:var(--muted);white-space:nowrap;line-height:1.3;
  font-size:12px;font-weight:690;cursor:pointer
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .profile-control>.account-link{
  display:grid!important;grid-template-columns:24px minmax(0,1fr);
  column-gap:15px;justify-content:start;align-items:center;
  height:44px!important;min-height:44px!important;width:100%!important;
  background:transparent!important;padding:0!important;
  overflow:hidden;text-align:left
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .profile-control>.account-link>svg:first-child{
  grid-column:1;width:22px;height:22px;justify-self:center
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .profile-control #account-button-label{
  display:block!important;grid-column:2;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--muted);font-size:12px;font-weight:750
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .profile-control #profile-toggle{
  border-radius:11px!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .profile-control #profile-toggle .account-chevron{
  display:none!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .profile-control #profile-toggle:hover{
  background:transparent!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .sidebar-bottom{
  padding:8px 11px 17px!important
}
body.float-ui .app-shell.sidebar-collapsed .sidebar .float-theme-row{
  display:flex;align-items:center;justify-content:center;width:100%;height:42px
}
body.float-ui .app-shell.sidebar-collapsed .sidebar .float-tool-label{
  display:none!important
}
/* Mobile opens the FULL drawer regardless of the desktop rail preference;
   top toggle closes the drawer, and never writes the desktop setting. */
@media(max-width:700px){
  body.float-ui .app-shell .sidebar,
  body.float-ui .app-shell.sidebar-collapsed .sidebar{
    width:260px!important;min-width:260px!important;
    transform:translateX(-110%)
  }
  body.float-ui .app-shell.mobile-open .sidebar,
  body.float-ui .app-shell.sidebar-collapsed.mobile-open .sidebar{
    transform:translateX(0)!important
  }
  body.float-ui .app-shell .sidebar .sidebar-label,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .sidebar-label{
    display:block!important
  }
  body.float-ui .app-shell .sidebar-content{
    padding:6px 11px 16px!important;flex:1 1 auto;min-height:0;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;
    touch-action:pan-y;scrollbar-width:thin
  }
  /* Mobile drawer ignores the saved desktop collapsed rail state. Its hover,
     focus and active surfaces all use the exact same nav-track width. */
  body.float-ui .app-shell .sidebar .sidebar-content .side-nav,
  body.float-ui .app-shell .sidebar .sidebar-game-list .side-nav{
    width:100%!important;min-width:0;box-sizing:border-box;
    align-items:stretch!important
  }
  body.float-ui .app-shell .sidebar .side-nav a{
    display:grid!important;grid-template-columns:24px minmax(0,1fr)!important;
    width:100%!important;max-width:100%!important;min-width:0;
    box-sizing:border-box;flex:0 0 auto;justify-self:stretch!important;
    min-height:42px;gap:15px;align-items:center;
    justify-items:start!important;justify-content:start!important;
    padding:0 13px!important
  }
  body.float-ui .app-shell .sidebar .side-nav a >svg{
    grid-column:1;grid-row:1;margin:0!important;justify-self:center!important
  }
  body.float-ui .app-shell .sidebar .side-nav a .sidebar-label{
    grid-column:2;grid-row:1;font-size:12px;white-space:nowrap
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools{
    display:flex!important;flex-direction:column!important;
    align-items:stretch!important;gap:3px!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>:is(#site-audio,.float-theme-row,.profile-control){
    position:relative;display:grid!important;grid-template-columns:24px minmax(0,1fr);
    column-gap:15px;align-items:center;
    height:42px;min-height:42px;width:100%;padding:0 13px;
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools :is(#site-audio-mute,#theme-toggle){
    grid-column:1;grid-row:1;width:24px;height:30px;min-width:24px;min-height:30px;
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .float-tool-label{
    display:block!important;grid-column:2;grid-row:1;
    font-size:12px;color:var(--muted);font-weight:700
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .profile-control>.account-link{
    display:grid!important;width:100%!important;min-width:0;
    height:42px!important;grid-template-columns:24px minmax(0,1fr);
    align-items:center;gap:15px;padding:0!important;background:transparent!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .profile-control>.account-link>svg:first-child{
    grid-column:1;width:22px;height:22px;justify-self:center
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .profile-control #account-button-label{
    display:block!important;grid-column:2;overflow:hidden;
    text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--muted)
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .float-volume-settings{
    display:none!important
  }
  body.float-ui .app-shell .sidebar .sidebar-bottom{padding:8px 11px 12px!important}
  body.float-ui .app-shell .sidebar .mobile-extras{
    display:block!important;width:100%;padding:4px 11px 0
  }
  body.float-ui .app-shell .sidebar .mobile-extras>a{display:none}
  body.float-ui .app-shell .sidebar .float-mobile-legal{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 8px;padding:11px 0 2px;border-top:1px solid var(--line)
  }
  body.float-ui .app-shell .sidebar .float-mobile-legal a{
    display:block;font-size:11px;font-weight:680;color:var(--muted);
    padding:8px 10px;text-decoration:none;border-radius:9px
  }
  body.float-ui .app-shell .sidebar .float-mobile-legal a:hover{
    color:var(--text);background:var(--surface-soft)
  }
  /* The only mobile close control sits in the sidebar header. */
}

/* The expanded rail uses a compact inline collapse button on the logo row.
   The compact rail keeps its separate chevron below the monogram. */
@media(min-width:701px){
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top{
   display:flex!important;flex-direction:row!important;
   align-items:center!important;justify-content:space-between!important;
   height:78px!important;min-height:78px!important;flex-basis:78px!important;
   padding:13px 11px 10px 16px!important;gap:5px!important
 }
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top .sidebar-brand-block{
   display:flex!important;justify-content:flex-start!important;
   flex:1 1 auto!important;width:auto!important;max-width:calc(100% - 37px)!important;
   min-width:0!important;height:43px!important;overflow:visible
 }
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top .side-brand{
   display:flex!important;gap:9px!important;overflow:visible!important;
   justify-content:flex-start!important;width:auto!important;min-width:0
 }
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top .collapse-button{
   position:static!important;transform:none!important;
   flex:0 0 30px!important;min-width:30px!important;
   width:30px!important;height:34px!important;margin:0!important;
   color:var(--muted);border-radius:10px
 }
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top .collapse-button:hover{
   background:var(--selected);color:var(--text)
 }
}
@media(max-width:700px){
 body.float-ui .app-shell .sidebar .side-brand,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .side-brand{
   display:flex!important;width:auto!important;max-width:100%!important;
   min-width:0;overflow:visible!important;justify-content:center
 }
 body.float-ui .app-shell .sidebar .sidebar-brand-block,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .sidebar-brand-block{
   width:100%!important;max-width:none!important;justify-content:center!important
 }
 body.float-ui .app-shell .sidebar .side-brand .sidebar-label{
   display:inline!important
 }
}

body.float-ui .app-shell .sidebar .float-tool-label[type="button"]{
  border:0;outline-offset:2px;background:transparent;
  padding:0;text-align:left;cursor:pointer;font-family:inherit
}
body.float-ui .app-shell .sidebar .float-tool-label[type="button"]:hover{
  color:var(--text)
}


/* Float 07 shared-component corrections. Each rule is tied to its DOM contract,
   rather than one-off per-page coordinate offsets. */
body.float-ui .app-shell .sidebar-game-list .side-nav{
  display:flex;flex-direction:column;gap:4px;
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control>.account-link,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
  display:grid!important;
  grid-template-columns:24px minmax(0,1fr)!important;
  gap:15px!important;align-items:center!important;
  justify-content:start!important;
  min-width:0!important;max-width:none!important;
  width:100%!important;height:44px!important;
  padding:0!important;margin:0!important;
  overflow:visible!important;
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control{
  padding:0 13px!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control #account-button-label{
  display:block!important;width:100%!important;min-width:0!important;
  max-width:100%!important;grid-column:2!important;
  overflow:hidden!important;text-overflow:ellipsis;
  font-size:12px;white-space:nowrap;color:var(--muted)
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control #profile-toggle>svg:first-child{
  grid-column:1!important;justify-self:center!important;
}
body.float-ui .app-shell .sidebar .float-sidebar-tools #site-audio{
  min-width:0
}
body.float-ui .app-shell .sidebar .float-inline-volume{
  display:none
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools #site-audio{
  grid-template-columns:24px minmax(0,1fr);
  gap:15px!important;padding:0 13px;
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools .float-inline-volume{
  display:block!important;grid-column:2;grid-row:1;
  position:static;width:100%;min-width:0;max-width:100%;
  height:25px;cursor:pointer;accent-color:var(--accent);
  writing-mode:horizontal-tb!important;direction:ltr!important;
  margin:0!important;padding:0!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar #site-audio-panel,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar #site-audio-expand{
  display:none!important
}
body.float-ui .app-shell .sidebar #site-audio-mute{
  grid-column:1;grid-row:1;justify-self:center;
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.float-theme-row,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>#site-audio,
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control{
  background:transparent!important;border-radius:12px!important;
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>:is(#site-audio,.float-theme-row,.profile-control):hover{
  background:var(--surface-soft)!important
}
body.float-ui .app-shell.admin-mode .admin-bar .admin-tabs button[aria-selected="true"]{
  color:#fff!important;background:#2b2f31!important;
  box-shadow:inset 0 -2px #edf0f1!important
}
body.float-ui .app-shell.admin-mode .admin-bar .admin-tabs button[aria-selected="false"]{
  color:#b2b9bd!important;background:transparent!important
}
body.float-ui .app-shell.admin-mode .admin-bar .admin-tabs button:hover{
  color:#fff!important;background:#292d2f!important
}
body.float-ui .app-shell.admin-mode .page[data-page="admin"] .admin-tabs button[aria-selected="true"]{
  background:var(--surface-soft)!important;color:var(--text)!important;
}
@media(max-width:700px){
 body.float-ui .app-shell .sidebar .float-sidebar-tools #site-audio{
   grid-template-columns:24px minmax(0,1fr)!important
 }
 body.float-ui .app-shell .sidebar .float-sidebar-tools #site-audio .float-inline-volume{
   display:block!important;grid-column:2!important;width:100%!important;
   min-width:0!important;max-width:100%!important;
   writing-mode:horizontal-tb!important
 }
 body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control,
 body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
   display:grid!important;grid-template-columns:24px minmax(0,1fr)!important;
   gap:15px!important;align-items:center!important;
   width:100%!important;min-width:0!important;max-width:none!important;
   padding:0!important;overflow:visible!important
 }
 body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control #account-button-label{
   display:block!important;width:100%!important;min-width:0!important
 }
 body.float-ui .app-shell .sidebar #site-audio-panel{display:none!important}
}

/* The entire account row is one flex line. Nested width rules from the old
   42px icon-only button must never constrain the expanded account label. */
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control{
  display:block!important;box-sizing:border-box;
  width:100%!important;max-width:100%!important;min-width:0!important;
  padding:0 13px!important;margin:0!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
  display:flex!important;flex-direction:row!important;align-items:center!important;
  justify-content:flex-start!important;
  box-sizing:border-box;gap:15px!important;
  width:100%!important;min-width:0!important;max-width:none!important;
  height:44px!important;padding:0!important;margin:0!important;
  overflow:visible!important;border-radius:10px!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>svg:first-child{
  flex:0 0 24px!important;width:24px!important;height:22px!important;
  min-width:24px!important;margin:0!important
}
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-button-label{
  display:block!important;position:static!important;
  flex:1 1 auto!important;min-width:0!important;
  width:auto!important;max-width:none!important;
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important
}
@media(max-width:700px){
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control{
    display:block!important;width:100%!important;padding:0 13px!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
    display:flex!important;flex-direction:row!important;gap:15px!important;
    width:100%!important;min-width:0!important;max-width:none!important;
    justify-content:flex-start!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-button-label{
    display:block!important;flex:1 1 auto!important;min-width:0!important;
    width:auto!important;overflow:hidden!important
  }
}

/* Rankings follows the regular Float page top spacing, without legacy offsets. */
body.float-ui .app-shell:not(.admin-mode) .rankings-hub{
  padding-top:0;max-width:1150px
}
body.float-ui .app-shell:not(.admin-mode) .rankings-hub>.page-header{
  padding:24px 0 20px
}

/* Site-wide footer is deliberately quieter than gameplay and navigation. */
body.float-ui .app-shell:not(.admin-mode) .footer{
  color:#a5adb2;font-size:10px;letter-spacing:.01em
}
body.float-ui .app-shell:not(.admin-mode) .footer a{color:inherit}:root[data-theme="dark"] body.float-ui .app-shell:not(.admin-mode) .footer{
  color:#818b92
}
body .admin-tier-preview .admin-preview-close{
  display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;
  margin-left:3px;padding:5px;border:0;border-radius:9px;
  background:transparent;color:var(--muted);cursor:pointer
}
body .admin-tier-preview .admin-preview-close svg{width:15px;height:15px;stroke-width:2}
body .admin-tier-preview .admin-preview-close:hover{
  background:var(--surface-soft);color:var(--text)
}

/* Float mobile: a proper independent drawer, never the desktop collapsed rail.
   Desktop collapse preference stays saved without changing the phone layout. */
@media(max-width:700px){
  body.float-ui .app-shell .sidebar-top,
  body.float-ui .app-shell.sidebar-collapsed .sidebar-top{
    display:flex!important;position:relative;flex-direction:row!important;
    align-items:center!important;justify-content:flex-start!important;
    padding:12px 48px 8px 13px!important;
    height:72px!important;min-height:72px!important;flex-basis:72px!important
  }
  body.float-ui .app-shell .sidebar-top .sidebar-brand-block,
  body.float-ui .app-shell.sidebar-collapsed .sidebar-top .sidebar-brand-block{
    flex:1 1 auto!important;width:auto!important;min-width:0!important;
    max-width:100%!important;justify-content:flex-start!important
  }
  body.float-ui .app-shell .sidebar .sidebar-mobile-close{
    display:inline-flex!important;align-items:center;justify-content:center;
    position:absolute;right:10px;top:15px;left:auto;
    width:35px;height:35px;min-width:35px;padding:7px;
    border-radius:10px;color:var(--muted);z-index:5
  }
  body.float-ui .app-shell .sidebar .sidebar-mobile-close:hover{
    background:var(--surface-soft);color:var(--text)
  }
  body.float-ui .app-shell .sidebar .sidebar-mobile-close svg{width:18px;height:18px}
  body.float-ui .app-shell .sidebar-top .collapse-button{display:none!important}

  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    flex:0 0 auto!important;width:100%!important;min-width:0!important;
    max-width:100%!important;height:44px!important;padding:0 13px!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>.account-link,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control>.account-link{
    display:grid!important;grid-template-columns:24px minmax(0,1fr)!important;
    gap:15px!important;justify-content:start!important;align-items:center!important;
    width:100%!important;min-width:0!important;max-width:100%!important;
    height:44px!important;padding:0!important;overflow:visible!important;
    text-align:left!important;background:transparent!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .profile-control #account-button-label,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools .profile-control #account-button-label{
    display:block!important;grid-column:2!important;grid-row:1!important;
    visibility:visible!important;opacity:1!important;width:100%!important;
    min-width:0!important;max-width:100%!important;
    overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis;
    color:var(--text);font-size:12px;font-weight:700
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools .profile-control>.account-link>svg:first-child{
    grid-column:1;grid-row:1;justify-self:center
  }

  /* Phone games must size against available content width rather than the
     pre-mobile min-content size of the desktop grid or leaderboard. */
  body.float-ui .app-shell{width:100%;max-width:100%;min-width:0}
  body.float-ui .app-shell .workspace{
    flex:1 1 auto;width:100%;min-width:0;max-width:100%
  }body.float-ui .app-shell:not(.admin-mode) main#main-content{
    box-sizing:border-box;min-width:0;max-width:100%
  }
}

/* A full-width phone footer must not inherit the narrow desktop icon rail. */
@media(max-width:700px){
  body.float-ui .app-shell .sidebar .sidebar-bottom,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .sidebar-bottom{
    box-sizing:border-box;width:100%!important;max-width:100%!important;
    min-width:0!important;align-self:stretch!important;flex:0 0 auto!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools{
    box-sizing:border-box;width:100%!important;min-width:0!important;
    max-width:100%!important;align-self:stretch!important;
    display:flex!important;flex-direction:column!important;align-items:stretch!important
  }
}

/* The real profile button carries an ID. Keep one flex row for both desktop
   sidebar preference states instead of letting older icon-only grid rules win. */
@media(max-width:700px){
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control{
    display:block!important;box-sizing:border-box;
    width:100%!important;min-width:0!important;max-width:100%!important;
    padding:0 13px!important;margin:0!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
    display:flex!important;flex-direction:row!important;
    align-items:center!important;justify-content:flex-start!important;
    box-sizing:border-box;width:100%!important;min-width:0!important;
    max-width:100%!important;height:44px!important;
    grid-column:1 / -1!important;grid-row:1!important;
    gap:15px!important;padding:0!important;margin:0!important;
    background:transparent!important;overflow:hidden!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>svg:first-child{
    flex:0 0 24px!important;width:24px!important;height:22px!important
  }
  body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-button-label,
  body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-button-label{
    display:block!important;position:static!important;
    visibility:visible!important;opacity:1!important;
    flex:1 1 auto!important;width:auto!important;min-width:0!important;
    max-width:none!important;overflow:hidden!important;
    text-overflow:ellipsis!important;white-space:nowrap!important;
    color:var(--text)!important;font-size:12px!important;font-weight:700!important
  }
}

/* Compact mobile chrome and edge-to-edge title artwork. */
@media(max-width:700px){
 body.float-ui .app-shell:not(.admin-mode) .workspace>.topbar>.mobile-brand-block{display:none!important}
 body.float-ui .app-shell .sidebar .sidebar-note{
   display:block!important;margin:0;padding:13px 10px 2px;
   font-size:10px;font-weight:500;color:var(--muted);opacity:.75
 }body.float-ui .app-shell .workspace>.footer{display:none!important}
}

/* One reset management group: the destructive option is distinctly secondary. */
.admin-reset-actions{display:flex;flex-direction:column;align-items:stretch;gap:9px}
.admin-reset-everything{border:1px solid color-mix(in srgb,#c25a51 50%,var(--line));
 background:var(--surface);color:#bc5248;font:inherit;font-weight:760;
 font-size:12px;border-radius:10px;padding:10px 14px;cursor:pointer;white-space:nowrap}
.admin-reset-everything:hover{background:color-mix(in srgb,#c25a51 9%,var(--surface))}
.admin-reset-everything:focus-visible{outline:2px solid #bc5248;outline-offset:3px}

/* One compact sizing/typography contract for floating administrator tools. */
body.float-ui .admin-tier-preview{align-items:center;gap:7px}
body.float-ui .admin-tier-preview :is(.float-admin-link,.float-admin-test-result,
 .float-admin-test-puzzle,.admin-preview-label-switch){
 box-sizing:border-box;min-height:30px;display:inline-flex;align-items:center;
 justify-content:center;font:inherit;font-size:11px;font-weight:740;
 line-height:18px;letter-spacing:0;white-space:nowrap;
}
body.float-ui .admin-tier-preview :is(.float-admin-link,.float-admin-test-result,
 .float-admin-test-puzzle){
 padding:6px 9px;border:0;border-radius:9px;background:transparent;
 color:var(--text);text-decoration:none;cursor:pointer;
}
body.float-ui .admin-tier-preview :is(.float-admin-link,.float-admin-test-result,
 .float-admin-test-puzzle):hover{background:var(--surface-soft)}
body.float-ui .admin-tier-preview .float-admin-test-puzzle[hidden]{display:none!important}
body.float-ui .admin-tier-preview .admin-preview-label-switch{gap:7px;padding:2px 5px}
body.float-ui .admin-tier-preview :is(.admin-preview-free,.admin-preview-plus){
 font-size:11px;font-weight:740;
}
body.float-ui .admin-tier-preview .float-admin-identity{margin-right:2px}
body.float-ui .admin-tier-preview .admin-preview-close{margin-left:0}
@media(max-width:700px){
 body.float-ui .admin-tier-preview{gap:3px;padding-inline:7px}
 body.float-ui .admin-tier-preview :is(.float-admin-link,.float-admin-test-result,
 .float-admin-test-puzzle){padding-inline:6px;font-size:10px}
}


/* Float account is THE single sidebar profile button. Badge sits directly
   after the real username, not on a separately rendered second identity. */
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-button-label{
  flex:0 1 auto!important;width:auto!important;max-width:calc(100% - 56px)!important;
}
body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-plus-mark:not([hidden]){
  display:inline-grid!important;place-items:center!important;
  flex:0 0 17px!important;position:static;
  width:17px;height:17px;margin:0 0 0 -8px;
  border-radius:5px;
}
@media(min-width:701px){
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
  position:relative;
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-plus-mark:not([hidden]){
  position:absolute;right:-3px;top:-2px;
  width:14px;height:14px;flex-basis:14px!important;
  font-size:11px;margin:0;
 }
}
@media(max-width:700px){
 body.float-ui .app-shell .sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-button-label{
  flex:0 1 auto!important;width:auto!important;max-width:calc(100% - 56px)!important;
 }
}

/* Touch tablets cannot reliably hover the logo to expose the rail toggle. */
@media(min-width:701px) and (hover:none), (min-width:701px) and (any-pointer:coarse){
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .collapse-button{
  opacity:1!important;pointer-events:auto!important;z-index:8
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .side-brand{
  opacity:0!important;pointer-events:none!important
 }
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top .collapse-button{
  display:inline-flex!important;opacity:1!important;pointer-events:auto!important;
  z-index:8;min-width:38px;min-height:38px
 }
}
/* Keep the floating developer controls compact but operable on phones. */
@media(max-width:700px){
 body.float-ui .admin-tier-preview{
  display:flex;flex-wrap:wrap;justify-content:flex-end;align-content:center;
  gap:5px 7px;max-width:calc(100vw - 16px);padding:6px 8px;
 }
 body.float-ui .admin-tier-preview .admin-preview-close{
  position:relative;display:grid!important;flex:0 0 34px;
  width:34px;height:34px;min-width:34px;z-index:5;
  border:1px solid var(--line);background:var(--surface-soft)
 }
 body.float-ui .admin-tier-preview[hidden]{display:none!important}
}
/* The logical game shell stays the same height when iPad visualViewport
   shrinks on pinch-zoom: the scoreboard and footer must not float upward. */
@media(min-width:701px) and (any-pointer:coarse){
 body.float-ui .app-shell:not(.admin-mode) .workspace:has(.tg-game-page:not([hidden])){
  height:var(--tg-tablet-layout-height,100dvh)!important;
  min-height:0
 }
}

/* Sidebar utility controls share the same icon centre line; the clock's
   24px icon column matches volume, theme and profile exactly. */
body.float-ui .app-shell .sidebar .tg-daily-reset-clock{
 position:relative;box-sizing:border-box;width:100%;min-width:0;
 height:44px;min-height:44px;flex:0 0 44px;
 margin:0 0 6px;padding:0;overflow:visible;color:var(--text)
}
body.float-ui .app-shell .sidebar .tg-daily-reset-trigger{
 display:grid;grid-template-columns:24px minmax(0,1fr);
 align-items:center;column-gap:15px;justify-content:start;
 box-sizing:border-box;width:100%;height:44px;min-height:44px;
 margin:0;padding:0 13px;border:0;border-radius:12px;
 background:transparent;color:inherit;font:inherit;text-align:left;
 cursor:default
}
body.float-ui .app-shell .sidebar .tg-daily-reset-icon{
 display:grid;place-items:center;grid-column:1;grid-row:1;
 width:24px;height:30px;min-width:24px;justify-self:center;
 color:var(--muted)
}
body.float-ui .app-shell .sidebar .tg-daily-reset-icon svg{
 display:block;width:19px;height:19px;flex:none;
 fill:none;stroke:currentColor;stroke-width:1.6;
 stroke-linecap:round;stroke-linejoin:round
}
body.float-ui .app-shell .sidebar .tg-daily-reset-copy{
 display:flex;flex-direction:column;gap:2px;grid-column:2;
 grid-row:1;min-width:0
}
body.float-ui .app-shell .tg-daily-clock-label{
 color:var(--muted);font-size:9px;font-weight:760;
 letter-spacing:.075em;white-space:nowrap
}
body.float-ui .app-shell .tg-daily-clock-value{
 color:var(--text);font-size:14px;font-weight:770;
 letter-spacing:.02em;line-height:1.15;font-variant-numeric:tabular-nums;
 white-space:nowrap
}
/* Match perceived weights, not a single uniform stroke value: the icon
   paths use different shapes and require subtly different stroke widths. */
body.float-ui .app-shell .sidebar .site-audio-mute svg{stroke-width:1.2}
body.float-ui .app-shell .sidebar #theme-toggle svg{stroke-width:1.8}
body.float-ui .app-shell .sidebar #profile-toggle>svg:first-child{
 stroke-width:1;fill:none;stroke:currentColor;
 stroke-linecap:round;stroke-linejoin:round
}
body.float-ui .app-shell .sidebar .tg-daily-reset-popover{
 position:absolute;z-index:60;top:50%;left:calc(100% + 12px);
 display:flex;flex-direction:column;gap:5px;
 width:max-content;min-width:172px;max-width:220px;
 padding:13px 16px;background:var(--surface);
 border:1px solid var(--line);border-radius:14px;
 box-shadow:0 13px 35px rgba(0,0,0,.16);
 color:var(--muted);font-size:10px;font-weight:750;
 letter-spacing:.07em;white-space:nowrap;
 visibility:hidden;opacity:0;pointer-events:none;
 transform:translate(-7px,-50%);
 transition:opacity .16s ease,transform .16s ease,visibility .16s ease
}
body.float-ui .app-shell .sidebar .tg-daily-reset-popover::before{
 content:"";position:absolute;left:-17px;top:-8px;bottom:-8px;width:17px
}
body.float-ui .app-shell .sidebar .tg-daily-clock-popover-value{
 color:var(--text);font-size:22px;font-weight:770;
 line-height:1.15;letter-spacing:.025em;font-variant-numeric:tabular-nums
}
@media(min-width:701px){
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-trigger{
  display:flex;align-items:center;justify-content:center;
  padding:0;gap:0;cursor:pointer
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-copy{display:none}
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-icon{
  width:24px;height:30px;min-width:24px;color:var(--muted)
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-icon svg{
  width:19px;height:19px
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-trigger:is(:hover,:focus-visible),
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-clock.is-open .tg-daily-reset-trigger{
  background:var(--surface-soft);color:var(--text)
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-clock.is-open .tg-daily-reset-popover{
  visibility:visible;opacity:1;pointer-events:auto;
  transform:translate(0,-50%)
 }
}
body.float-ui .app-shell .sidebar .tg-daily-reset-trigger:focus-visible{
 outline:2px solid var(--accent);outline-offset:2px
}
@media(max-width:700px){
 body.float-ui .app-shell .sidebar .tg-daily-reset-clock{
  width:100%;margin-bottom:7px
 }
}
@media(prefers-reduced-motion:reduce){
 body.float-ui .app-shell .sidebar .tg-daily-reset-popover{transition:none}
}

/* iPads and larger touch tablets must not pan the page horizontally.
   Internal scrollable strips (archives, rewards) keep their own overflow. */
@media(min-width:701px) and (max-width:1366px) and (any-pointer:coarse){
 html,body,body.float-ui .app-shell,body.float-ui .workspace,
 body.float-ui main#main-content{max-width:100%;overflow-x:clip}
 body.float-ui .app-shell:not(.admin-mode) #main-content>.page:not([hidden]){
  max-width:100%;min-width:0
 }
}

/* One navigation-hover geometry for the desktop rail's bottom controls.
   Match the real #home / rankings / stats / plus 44px icon targets instead of
   drawing separate 32/40/42px background patches on nested buttons. */
@media(min-width:701px){
 body.float-ui .app-shell.sidebar-collapsed .sidebar{
  --tg-rail-target:44px;--tg-rail-radius:13px;
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .side-nav a,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .tg-daily-reset-trigger,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>#site-audio,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.float-theme-row,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control{
  box-sizing:border-box!important;width:var(--tg-rail-target)!important;
  min-width:var(--tg-rail-target)!important;max-width:var(--tg-rail-target)!important;
  height:var(--tg-rail-target)!important;min-height:var(--tg-rail-target)!important;
  border-radius:var(--tg-rail-radius)!important;margin-inline:auto!important;
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>#site-audio:hover,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>#site-audio:focus-within,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.float-theme-row:hover,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.float-theme-row:focus-within,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control:hover,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools>.profile-control:focus-within{
  background:var(--surface-soft)!important;color:var(--text)!important;
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools #site-audio-mute:hover,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools #theme-toggle:hover,
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-sidebar-tools #profile-toggle:hover{
  background:transparent!important;
 }
}
/* Expanded and mobile utility rows also match the site's 13px nav corners. */
body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar .float-sidebar-tools>:is(#site-audio,.float-theme-row,.profile-control),
body.float-ui .app-shell .sidebar .tg-daily-reset-trigger{border-radius:13px!important}


/* Sidebar popovers: the New Dailies In flyout is the visual/motion source.
   Reuse its 14px radius, floating card tones, -7px slide and .16s reveal.
   Keep real volume controls interactive; theme's hint remains decorative. */
body.float-ui .app-shell .sidebar .tg-sidebar-theme-popover{
 position:absolute;z-index:70;top:50%;left:calc(100% + 12px);
 display:flex;flex-direction:column;gap:5px;
 width:max-content;min-width:172px;max-width:220px;
 padding:13px 16px;box-sizing:border-box;
 background:var(--surface);color:var(--muted);
 border:1px solid var(--line);border-radius:14px;
 box-shadow:0 13px 35px rgba(0,0,0,.16);
 font-size:10px;font-weight:750;letter-spacing:.07em;white-space:nowrap;
 visibility:hidden;opacity:0;pointer-events:none;
 transform:translate(-7px,-50%);
 transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
}
body.float-ui .app-shell .sidebar .tg-sidebar-theme-popover-eyebrow{
 color:var(--muted);font-size:10px;font-weight:750;letter-spacing:.07em;
}
body.float-ui .app-shell .sidebar .tg-sidebar-theme-popover-value{
 color:var(--text);font-size:19px;font-weight:770;line-height:1.15;
 letter-spacing:.01em;
}
@media(min-width:701px){
 body.float-ui .app-shell.sidebar-collapsed .sidebar .float-theme-row{
  position:relative;
 }
 /* Mouse focus can outlive hover in Firefox. Keep only pointer hover and
   genuine keyboard focus-visible as activation routes. */
body.float-ui .app-shell.sidebar-collapsed .sidebar .float-theme-row:is(:hover,:has(#theme-toggle:focus-visible)):not(.is-click-dismissed)>.tg-sidebar-theme-popover{
  visibility:visible;opacity:1;transform:translate(0,-50%);
 }
 /* Popup audio slider: same quiet entrance and surface as daily reset.
    Sound.js keeps its existing hover, focus, close delay and keyboard logic. */
 body.float-ui .app-shell.sidebar-collapsed .sidebar .site-audio-panel:not([hidden]){
  border:1px solid var(--line);border-radius:14px;
  background:var(--surface);box-shadow:0 13px 35px rgba(0,0,0,.16);
  animation:tg-sidebar-audio-popover-in .16s ease both!important;
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .site-audio-panel.is-closing{
  animation:none!important;opacity:0!important;
  transform:translate(-7px,-50%)!important;
  transition:opacity .16s ease,transform .16s ease!important;
  pointer-events:none;
 }
}
@keyframes tg-sidebar-audio-popover-in{
 from{opacity:0;transform:translate(-7px,-50%)}
 to{opacity:1;transform:translate(0,-50%)}
}
/* The profile flyout still opens on click. Give each opening the same
   subtle 7px slide/fade without modifying Clerk's event and focus handling. */
body.float-ui .app-shell .sidebar .profile-menu:not([hidden]){
 animation:tg-sidebar-profile-popover-in .16s ease both;
}
@keyframes tg-sidebar-profile-popover-in{
 from{opacity:0;transform:translateX(-7px)}
 to{opacity:1;transform:translateX(0)}
}
@media(prefers-reduced-motion:reduce){
 body.float-ui .app-shell .sidebar .tg-sidebar-theme-popover{transition:none}
 body.float-ui .app-shell .sidebar .site-audio-panel:not([hidden]),
 body.float-ui .app-shell .sidebar .profile-menu:not([hidden]){
  animation:none!important
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar .site-audio-panel.is-closing{
  transition:none!important
 }
}

/* The theme's only visual hint is the new Appearance flyout. */
#theme-toggle[data-tooltip]::before,
#theme-toggle[data-tooltip]::after{
 content:none!important;display:none!important;
}

/* Volume popover: reuse the invisible pointer bridge from New Dailies In.
   The panel sits 9px away from its speaker icon. Without a bridge, the
   speaker's pointerleave fires in that gap and dismisses the slider before
   users can interact with it. This is a hit area only, not an arrow. */
@media(min-width:701px) and (hover:hover) and (pointer:fine){
 body.float-ui .app-shell.sidebar-collapsed .sidebar #site-audio-panel:not([hidden]):not(.is-closing)::before{
  content:""!important;display:block!important;
  position:absolute!important;left:-18px!important;right:auto!important;
  top:-8px!important;bottom:-8px!important;
  width:18px!important;height:auto!important;
  background:transparent!important;border:0!important;border-radius:0!important;
  box-shadow:none!important;transform:none!important;pointer-events:auto!important;
 }
}

/* LIVE is GREEN throughout the admin chrome, including the floating
   developer rail and sidebar/mobile environment tags. DEV remains amber. */
body .admin-tier-preview .float-admin-build.production{
  background:#e4f6ea;color:#246744;border:1px solid #89cdaa;
}
body .admin-tier-preview .float-admin-build.production :is(.environment-tag,.environment-build-text){
  color:#246744;
}
body.float-ui .app-shell :is(.environment-indicator,.mobile-env-indicator).production{
  background:#e4f6ea;color:#246744;border-color:#89cdaa;
}
body.float-ui .app-shell :is(.environment-indicator,.mobile-env-indicator).production :is(.environment-tag,.environment-build-text){
  color:#246744;
}

/* Admin dashboards contain operational data that must remain copyable.
   Keep navigation controls clickable, but never suppress text selection. */
body.float-ui .app-shell.admin-mode #main-content .page[data-page="admin"],
body.float-ui .app-shell.admin-mode #main-content .page[data-page="admin"] :is(
 p,span,small,strong,h1,h2,h3,h4,li,td,th,dt,dd,pre,code,blockquote,label){
 user-select:text!important;-webkit-user-select:text!important;
}

/* 2026-10-28 · Games-first navigation. iPad has no hover-only controls. */
body.float-ui .app-shell .sidebar-top .tg-collapse-label{display:none}
@media(min-width:701px) and (hover:none), (min-width:701px) and (any-pointer:coarse){
 body.float-ui .app-shell .sidebar-top .collapse-button,
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-top .collapse-button{
  display:inline-flex!important;flex-direction:column!important;gap:0!important;
  min-width:36px!important;width:36px!important;height:44px!important;
  align-items:center!important;justify-content:center!important;
  opacity:1!important;pointer-events:auto!important;z-index:9!important;
  color:var(--text)!important;background:var(--surface-soft)!important;
  border:1px solid var(--line)!important;box-shadow:0 2px 8px #00000012;
 }
 body.float-ui .app-shell .sidebar-top .collapse-button svg{
  width:21px!important;height:21px!important;stroke-width:2.9!important;
 }
 body.float-ui .app-shell .sidebar-top .tg-collapse-label{
  display:block;font-size:9px;line-height:11px;font-weight:800;
  letter-spacing:.01em;white-space:nowrap
 }
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top .collapse-button{
  width:43px!important;min-width:43px!important;height:43px!important;
 }
}


/* Mobile drawer v2: a single layout contract, intentionally replacing the
   competing bottom-row overrides. Keep desktop/tablet navigation untouched. */
.tg-mobile-quick-nav,.tg-sidebar-scroll-cue{display:none}
@media(max-width:700px){
 body.float-ui .app-shell #sidebar,
 body.float-ui .app-shell.sidebar-collapsed #sidebar{
  position:fixed!important;left:0!important;top:0!important;bottom:0!important;
  z-index:51!important;box-sizing:border-box;
  width:100vw!important;max-width:100vw!important;min-width:0!important;
  height:100dvh!important;min-height:0!important;
  padding-bottom:env(safe-area-inset-bottom)!important;
  display:flex!important;flex-direction:column!important;
  background:var(--sidebar);transform:translate3d(-101%,0,0)!important;
  transition:transform .32s cubic-bezier(.22,1,.36,1)!important;
  will-change:transform
 }
 body.float-ui .app-shell.mobile-open #sidebar,
 body.float-ui .app-shell.sidebar-collapsed.mobile-open #sidebar{
  transform:translate3d(0,0,0)!important
 }
 body.float-ui .sidebar-scrim:not([hidden]){
  position:fixed;inset:0;z-index:50;background:rgba(17,20,22,.48);
  display:block;opacity:0;pointer-events:none;
  transition:opacity .32s ease
 }
 body.float-ui .sidebar-scrim.is-visible:not([hidden]){
  opacity:1;pointer-events:auto
 }
 body.float-ui .app-shell .sidebar-top,
 body.float-ui .app-shell.sidebar-collapsed .sidebar-top{
  height:59px!important;min-height:59px!important;flex-basis:59px!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;
  justify-content:space-between!important;
  padding:8px 58px 7px 15px!important
 }
 body.float-ui .app-shell .sidebar-top .brand-monogram{
  width:34px!important;height:34px!important;flex-basis:34px!important;
  font-size:22px!important;border-radius:10px!important
 }
 body.float-ui .app-shell #sidebar .sidebar-mobile-close{
  display:inline-flex!important;position:absolute!important;right:10px!important;
  top:8px!important;width:43px!important;height:43px!important;
  min-width:43px!important;color:var(--text);background:var(--surface-soft);
  border-radius:12px;z-index:5
 }
 body.float-ui .app-shell #sidebar .sidebar-mobile-close svg{
  width:19px!important;height:19px!important
 }
 body.float-ui .app-shell .sidebar-top .collapse-button{display:none!important}
 body.float-ui .app-shell #sidebar .sidebar-content,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .sidebar-content,
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-content{
  box-sizing:border-box;display:block!important;
  flex:1 1 auto!important;min-height:0!important;
  padding:0 12px 6px!important;overflow-x:hidden!important;overflow-y:auto!important;
  scrollbar-width:thin;overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;touch-action:pan-y
 }
 body.float-ui .app-shell #sidebar .sidebar-content>.nav-section-label,
 body.float-ui .app-shell #sidebar .sidebar-content>.side-nav,
 body.float-ui .app-shell #sidebar .tg-mobile-games-heading{display:none!important}
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;position:sticky;top:0;z-index:4;
  padding:4px 2px 12px;margin:0;
  background:var(--sidebar)
 }
 /* Quick links and game tiles use the same icon stroke, label weight,
    radius and 45px touch-target rhythm across phone widths. */
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  box-sizing:border-box;min-width:0;min-height:45px;padding:5px 6px;
  color:var(--text);background:var(--surface-soft);border:0;
  border-radius:11px;font-size:12px;font-weight:710;white-space:nowrap;
  transition:background .18s ease,color .18s ease
 }
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a>svg{
  display:block;box-sizing:border-box;flex:0 0 19px;
  width:19px;height:19px;min-width:19px;
  fill:none;stroke:currentColor;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round
 }
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a>span{
  display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;
  font-size:inherit;font-weight:inherit
 }
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a:hover,
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a:focus-visible{
  background:var(--surface-soft);color:var(--text)
 }
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a[aria-current="page"]{
  background:var(--selected);color:var(--text);
  box-shadow:inset 0 0 0 1px var(--accent)
 }
 body.float-ui .app-shell #sidebar .sidebar-game-list{
  box-sizing:border-box;width:100%!important;min-width:0!important
 }
 body.float-ui .app-shell #sidebar .sidebar-game-list .side-nav,
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-game-list .side-nav,
 body.float-ui .app-shell.sidebar-collapsed .sidebar-game-list .side-nav{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:5px 7px!important;align-items:stretch!important;
  width:100%!important;min-width:0!important;margin:0!important;
  padding:0!important;border:0!important
 }
 body.float-ui .app-shell #sidebar .sidebar-game-list .side-nav a,
 body.float-ui .app-shell:not(.sidebar-collapsed) .sidebar-game-list .side-nav a,
 body.float-ui .app-shell.sidebar-collapsed .sidebar-game-list .side-nav a{
  box-sizing:border-box;display:grid!important;
  grid-template-columns:24px minmax(0,1fr)!important;
  align-items:center!important;justify-items:start!important;
  min-height:45px!important;height:45px!important;
  width:100%!important;min-width:0!important;max-width:100%!important;
  gap:9px!important;margin:0!important;padding:0 9px!important;
  border-radius:11px!important
 }
 body.float-ui .app-shell #sidebar .sidebar-game-list .side-nav a>svg{
  display:block!important;grid-column:1!important;grid-row:1!important;
  justify-self:center!important;box-sizing:border-box;
  width:24px!important;height:24px!important;
  min-width:24px!important;min-height:24px!important;max-width:24px!important;
  margin:0!important
 }
 body.float-ui .app-shell #sidebar .sidebar-game-list .side-nav a .sidebar-label{
  display:block!important;grid-column:2!important;grid-row:1!important;
  min-width:0!important;max-width:100%!important;
  overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;
  font-size:12px!important;font-weight:710!important
 }
 body.float-ui .app-shell #sidebar .tg-sidebar-scroll-cue:not([hidden]){
  display:flex!important;align-items:center;justify-content:center;gap:7px;
  flex:0 0 29px;min-height:29px;padding:2px 12px;
  border:0;border-top:1px solid var(--line);
  background:var(--surface-soft);color:var(--text);font-size:11px;font-weight:750
 }
 body.float-ui .app-shell #sidebar .tg-sidebar-scroll-cue svg{
  width:16px;height:16px;stroke-width:2.4
 }

 /* Three equal, independent actions. The real theme, profile and live daily
    clock nodes are reused: no cloned controls or competing event handlers. */
 body.float-ui .app-shell #sidebar .sidebar-bottom,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .sidebar-bottom,
 body.float-ui .app-shell:not(.sidebar-collapsed) #sidebar .sidebar-bottom{
  box-sizing:border-box;display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;gap:3px 7px!important;
  flex:0 0 auto!important;width:100%!important;max-width:100%!important;
  min-width:0!important;min-height:0!important;
  padding:7px 12px 5px!important;margin:0!important;
  border-top:1px solid var(--line);overflow:visible!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .float-sidebar-tools{
  display:contents!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools>#site-audio,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .float-sidebar-tools>#site-audio{
  display:none!important
 }
 body.float-ui .app-shell #sidebar .tg-daily-reset-clock{
  grid-column:1!important;grid-row:1!important;
  display:block!important;position:relative;
  min-height:56px!important;height:56px!important;width:100%!important;
  min-width:0!important;max-width:100%!important;
  margin:0!important;padding:0!important;border:0;border-radius:11px;
  background:var(--surface-soft)
 }
 body.float-ui .app-shell #sidebar .tg-daily-reset-trigger{
  display:flex!important;flex-direction:column!important;align-items:center!important;
  justify-content:center!important;gap:1px!important;
  width:100%!important;height:56px!important;min-height:56px!important;
  padding:3px 1px!important;border:0!important;background:transparent!important;
  color:var(--text)!important;cursor:pointer!important;text-align:center!important
 }
 body.float-ui .app-shell #sidebar .tg-daily-reset-icon{display:none!important}
 body.float-ui .app-shell #sidebar .tg-daily-reset-copy{
  display:flex!important;flex-direction:column!important;gap:2px!important;
  align-items:center!important;justify-content:center!important
 }
 body.float-ui .app-shell #sidebar .tg-daily-clock-label{
  font-size:9px!important;letter-spacing:0!important;font-weight:700!important;
  color:var(--muted);white-space:nowrap
 }
 body.float-ui .app-shell #sidebar .tg-daily-clock-value{
  font-size:13px!important;line-height:1.2!important;letter-spacing:0!important;
  font-variant-numeric:tabular-nums
 }
 body.float-ui .app-shell #sidebar .tg-daily-reset-popover{
  top:auto!important;left:0!important;right:auto!important;
  bottom:calc(100% + 10px)!important;
  transform:translateY(6px)!important;z-index:100!important;
 }
 body.float-ui .app-shell #sidebar .tg-daily-reset-popover::before{
  display:none!important
 }
 body.float-ui .app-shell #sidebar .tg-daily-reset-clock.is-open .tg-daily-reset-popover{
  visibility:visible!important;opacity:1!important;pointer-events:auto!important;
  transform:translateY(0)!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools>.float-theme-row,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .float-sidebar-tools>.float-theme-row{
  box-sizing:border-box;grid-column:2!important;grid-row:1!important;
  display:flex!important;position:relative!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;gap:2px!important;
  min-height:56px!important;height:56px!important;
  width:100%!important;min-width:0!important;max-width:100%!important;
  margin:0!important;padding:4px 1px!important;
  border:0!important;border-radius:11px!important;
  background:var(--surface-soft)!important;cursor:pointer
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools #theme-toggle{
  display:flex!important;align-items:center!important;justify-content:center!important;
  position:static!important;grid-column:auto!important;grid-row:auto!important;
  flex:0 0 23px!important;width:25px!important;height:23px!important;
  min-width:25px!important;min-height:23px!important;
  margin:0!important;padding:0!important;color:var(--text)
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools #theme-toggle svg{
  width:20px!important;height:20px!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools .float-theme-row .float-tool-label{
  display:block!important;position:static!important;grid-column:auto!important;
  grid-row:auto!important;min-width:0!important;max-width:100%!important;
  font-size:10px!important;line-height:14px!important;white-space:nowrap!important;
  text-align:center!important;color:var(--text)!important;font-weight:700!important
 }
 body.float-ui .app-shell #sidebar .tg-sidebar-theme-popover{
  display:none!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools>.profile-control,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .float-sidebar-tools>.profile-control{
  box-sizing:border-box;grid-column:3!important;grid-row:1!important;
  display:block!important;position:relative!important;
  min-height:56px!important;height:56px!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  padding:0!important;margin:0!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools>.profile-control>#profile-toggle,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .float-sidebar-tools>.profile-control>#profile-toggle{
  box-sizing:border-box;display:flex!important;position:relative!important;
  flex-direction:column!important;justify-content:center!important;
  align-items:center!important;gap:2px!important;
  min-height:56px!important;height:56px!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  margin:0!important;padding:4px 5px!important;border:0!important;
  border-radius:11px!important;background:var(--surface-soft)!important;
  color:var(--text)!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools .profile-control #profile-toggle>svg:first-child{
  display:block!important;flex:0 0 21px!important;
  width:21px!important;height:21px!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools .profile-control #account-button-label,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .float-sidebar-tools .profile-control #account-button-label{
  display:block!important;position:static!important;
  flex:0 1 auto!important;width:100%!important;min-width:0!important;
  max-width:100%!important;font-size:10px!important;line-height:14px!important;
  text-align:center!important;font-weight:720!important;
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  color:var(--text)!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools>.profile-control>#profile-toggle>#account-plus-mark:not([hidden]){
  position:absolute!important;top:4px!important;right:7px!important;
  margin:0!important;width:13px!important;height:13px!important;
  font-size:11px!important
 }
 body.float-ui .app-shell #sidebar .float-sidebar-tools .profile-menu:not([hidden]){
  position:absolute!important;right:0!important;left:auto!important;
  top:auto!important;bottom:calc(100% + 10px)!important;
  width:min(270px,calc(100vw - 24px))!important;
  max-height:min(65dvh,460px)!important;overflow-y:auto!important;
  z-index:130!important
 }

 /* The disclosure is a single borderless row; its contents animate as
    a 0fr→1fr grid, so closing is as smooth as opening. */
 body.float-ui .app-shell #sidebar .mobile-extras,
 body.float-ui .app-shell.sidebar-collapsed #sidebar .mobile-extras{
  display:block!important;grid-column:1/-1!important;grid-row:2!important;
  width:100%!important;min-width:0!important;
  padding:0!important;margin:0!important
 }
 body.float-ui .app-shell #sidebar .mobile-extras>a{display:none!important}
 body.float-ui .app-shell #sidebar .float-mobile-legal{
  display:block!important;min-width:0!important;width:100%!important;
  padding:0!important;margin:0!important;background:transparent!important;
  border:0!important;box-shadow:none!important;border-radius:0!important
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal-toggle{
  appearance:none;display:flex;align-items:center;justify-content:center;gap:7px;
  width:100%;min-height:37px;margin:0;padding:5px;
  border:0;background:transparent;color:var(--muted);
  font:inherit;font-size:11px;font-weight:750;cursor:pointer
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal-toggle::after{
  content:"";display:inline-block;width:7px;height:7px;
  border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;
  transform:translateY(-2px) rotate(45deg);transition:transform .28s ease
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal.is-open .float-mobile-legal-toggle::after{
  transform:translateY(2px) rotate(225deg)
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal-panel{
  display:grid!important;grid-template-rows:0fr;opacity:0;
  transform:translateY(-7px);visibility:hidden;pointer-events:none;
  transition:grid-template-rows .3s cubic-bezier(.22,1,.36,1),
   transform .3s cubic-bezier(.22,1,.36,1),opacity .2s ease,
   visibility 0s linear .3s
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal.is-open .float-mobile-legal-panel{
  grid-template-rows:1fr;opacity:1;transform:translateY(0);
  visibility:visible;pointer-events:auto;
  transition:grid-template-rows .3s cubic-bezier(.22,1,.36,1),
   transform .3s cubic-bezier(.22,1,.36,1),opacity .2s ease,
   visibility 0s
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal-inner{
  min-height:0;overflow:hidden
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal-links{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:3px 8px!important;border:0!important;border-top:1px solid var(--line)!important;
  padding:6px 7px 0!important;margin:0!important
 }
 body.float-ui .app-shell #sidebar .float-mobile-legal-links a{
  display:flex!important;align-items:center;justify-content:center;
  min-height:35px!important;padding:4px!important;
  font-size:11px!important;font-weight:680!important;border:0!important
 }
 body.float-ui .app-shell #sidebar .float-mobile-copyright{
  display:block!important;text-align:center;padding:6px 5px 2px;
  color:var(--muted);font-size:9px
 }
 body.float-ui .app-shell #sidebar .sidebar-note{display:none!important}
}
@media(max-width:700px) and (prefers-reduced-motion:reduce){
 body.float-ui .app-shell #sidebar,
 body.float-ui .app-shell.sidebar-collapsed #sidebar{transition:none!important}
 body.float-ui .sidebar-scrim:not([hidden]){transition:none!important}
 body.float-ui .app-shell #sidebar .float-mobile-legal-panel,
 body.float-ui .app-shell #sidebar .float-mobile-legal-toggle::after{
  transition:none!important
 }
}
@media(max-width:340px){
 body.float-ui .app-shell #sidebar .sidebar-game-list .side-nav a .sidebar-label{
  font-size:11px!important
 }
 body.float-ui .app-shell #sidebar .tg-mobile-quick-nav a{font-size:11px}
}
