/* SmileDice v8.0 — Casino / Sport switch, premium visual layer.
   Additive UI. Does not alter Supabase, wallets, Dice rules, payouts or rewards. */
.site-header .sd-mode-switch{display:flex;align-items:center;gap:9px;flex:0 0 auto;min-width:0;isolation:isolate}
.site-header .sd-mode-button{position:relative;isolation:isolate;display:inline-flex;justify-content:center;align-items:center;gap:7px;height:43px;min-height:43px;min-width:116px;padding:0 14px;border-radius:22px;color:#fff;font-size:13px;font-weight:850;line-height:1;border:1px solid rgba(140,111,255,.7);background:linear-gradient(155deg,#25205b,#111238 68%,#0b112d);text-shadow:0 1px 2px #000b;box-shadow:inset 0 1px 0 #fff3,0 5px 14px #0007,0 0 12px #7e49ff44;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,border-color .18s ease}
.site-header .sd-mode-button img{width:27px;height:27px;object-fit:contain;flex:0 0 27px;filter:drop-shadow(0 0 5px #fffb)}
.site-header .sd-mode-button::before{content:"";position:absolute;pointer-events:none;inset:1px;border-radius:inherit;background:linear-gradient(180deg,#fff2,transparent 38%);z-index:-1}
.site-header .sd-mode-button:hover{filter:brightness(1.16);transform:translateY(-1px)}
.site-header .sd-mode-button:focus-visible{outline:3px solid #f6e7ff;outline-offset:3px}
.site-header .sd-mode-button:active{transform:translateY(0)}
.site-header .sd-mode-casino{border-color:#f6c344a8;background:linear-gradient(160deg,#3a2b11,#1e1911 60%,#151527);box-shadow:inset 0 1px 0 #fff5,0 0 0 1px #b7791c44,0 0 14px #ffb62855,0 6px 15px #0008}
.site-header .sd-mode-casino.is-active{color:#fff9d7;border-color:#ffe77e;background:linear-gradient(170deg,#6a4407,#513009 38%,#261b1a);box-shadow:inset 0 1px 0 #fff7,0 0 0 1px #ffb72e,0 0 10px #ffdb64,0 0 25px #ffb900aa,0 0 42px #e48d174f;}
.site-header .sd-mode-sport{border-color:#a286ff;background:linear-gradient(145deg,#302268,#1c1746 57%,#101334);box-shadow:inset 0 1px 0 #d9a4ff55,0 0 0 1px #754aff77,0 0 13px #9565ff8c,0 5px 16px #0007}
.site-header .sd-mode-sport.is-active{border-color:#e2bcff;background:linear-gradient(160deg,#7046c2,#3e248b 60%,#1b1646);box-shadow:inset 0 1px 0 #fff8,0 0 0 1px #bc92ff,0 0 12px #bb89ff,0 0 27px #8d4fffbd,0 0 40px #6e32ed66}
.site-header .sd-mode-button[aria-pressed="true"]{z-index:2}
/* v8.0.2 — actual one-row header, not a grid with a second row.
   Keep Casino, Sport, navigation, counters and account tools on the SAME baseline
   on wide desktops. At smaller desktop widths use the existing hamburger for
   navigation rather than creating an extra row or overflowing the header. */
@media (min-width:901px) {
  .site-header,
  .site-header:has(.public-player-stats:not([hidden])){
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    grid-template-columns:none!important;
    grid-template-rows:none!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-height:70px!important;
    height:70px!important;
    max-height:70px!important;
    padding:0 clamp(10px,.77vw,16px)!important;
    gap:clamp(5px,.48vw,10px)!important;
  }
  .site-header .brand,
  .site-header:has(.public-player-stats:not([hidden])) .brand{
    flex:0 0 auto!important;
    margin:0!important;
    white-space:nowrap!important;
    font-size:clamp(17px,1.12vw,23px)!important;
  }
  .site-header .brand-icon.brand-logo{width:clamp(29px,2vw,40px)!important;height:clamp(29px,2vw,40px)!important;}
  .site-header .sd-mode-switch{flex:0 0 auto!important;justify-content:flex-start!important;gap:8px!important;margin:0!important;}
  .site-header .sd-mode-button{height:42px;min-height:42px;min-width:108px;padding:0 11px;}
  .site-header .desktop-nav,
  .site-header:has(.public-player-stats:not([hidden])) .desktop-nav{
    display:flex!important;
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    margin:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }
  .site-header .desktop-nav .nav-link{padding:7px clamp(2px,.31vw,7px)!important;gap:3px!important;flex:0 1 auto!important;font-size:clamp(9px,.59vw,12px)!important;}
  .site-header .desktop-nav .ui-nav-ico{width:clamp(16px,1.1vw,21px)!important;height:clamp(16px,1.1vw,21px)!important;}
  .site-header>.sd-header-stats:not([hidden]){
    display:flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:nowrap!important;
    gap:6px!important;
    min-width:0!important;
    width:auto!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    position:static!important;
  }
  .site-header>.sd-header-stats .public-stat{min-width:0!important;min-height:40px!important;padding:5px 7px!important;gap:6px!important;}
  .site-header>.sd-header-stats .public-stat-icon{width:24px!important;height:24px!important;}
  .site-header>.sd-header-stats .public-stat-copy strong{font-size:12px!important;}
  .site-header>.sd-header-stats .public-stat-copy small{font-size:9px!important;}
  .site-header .header-toolcluster,
  .site-header:has(.public-player-stats:not([hidden])) .header-toolcluster{
    display:flex!important;
    flex:0 0 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    align-self:center!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:5px!important;
  }
  .site-header .header-toolcluster .community-header-actions,
  .site-header .header-toolcluster .header-actions{gap:5px!important;flex-wrap:nowrap!important;}
  .site-header .header-toolcluster .community-header-btn{min-width:0!important;padding:0 7px!important;}
  .site-header .header-toolcluster #account-button,
  .site-header .header-toolcluster #signup-button{padding:0 8px!important;}
  .site-header .header-toolcluster .mobile-menu-button{display:none!important;}
  .guest-community-row{display:none!important;}
}
/* On laptops use the available menu in the SAME row.  All actions stay
   accessible via the hamburger; no dummy or duplicate buttons are created. */
@media (min-width:901px) and (max-width:1350px){
  .site-header .desktop-nav,
  .site-header:has(.public-player-stats:not([hidden])) .desktop-nav{display:none!important;}
  .site-header .header-toolcluster{margin-left:auto!important;}
  .site-header .header-toolcluster .mobile-menu-button{
    display:grid!important;place-items:center!important;
    width:40px;height:40px;min-width:40px;
    color:#eaf6ff;border:1px solid #477abb82;border-radius:12px;
    background:#162549;
  }
}
@media (min-width:1351px) and (max-width:1690px){
  .site-header .desktop-nav .nav-link{font-size:0!important;padding:7px 5px!important;}
  .site-header .desktop-nav .nav-link span{
    position:absolute!important;width:1px!important;height:1px!important;
    padding:0!important;margin:-1px!important;overflow:hidden!important;
    clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
  }
  .site-header .desktop-nav .ui-nav-ico{width:21px!important;height:21px!important;}
  .site-header .desktop-nav .nav-link{min-width:32px!important;min-height:37px!important;}
  .site-header .header-toolcluster .community-header-btn{padding:0 6px!important;}
}
/* Mobile: brand stays on row one, choice on row two, with no hidden or clipped buttons. */
@media (max-width:900px){
  .site-header{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:62px 56px!important;column-gap:6px!important;row-gap:0!important;min-height:118px!important;padding:0 12px!important;align-items:center!important}
  .site-header .brand{grid-column:1!important;grid-row:1!important;justify-self:start!important}
  .site-header .header-toolcluster{grid-column:2!important;grid-row:1!important;justify-self:end!important;margin:0!important}
  .site-header .sd-mode-switch{grid-column:1/-1!important;grid-row:2!important;width:100%;justify-content:center;gap:12px;padding:0 0 8px;border-top:1px solid #7795e41c}
  .site-header .sd-mode-button{height:40px;min-height:40px;flex:1 1 0;max-width:210px;min-width:0;font-size:13px}
  .site-header>.sd-header-stats{display:none!important}
  .site-header .desktop-nav{display:none!important}
}
@media(max-width:375px){.site-header .sd-mode-button{font-size:12px}.site-header .sd-mode-button img{width:24px;height:24px;flex-basis:24px}}
/* Actual Sport placeholder route; never present fictional match or payment data. */
.sd-sport-landing{position:relative;overflow:hidden;min-height:480px;display:flex;align-items:center;justify-content:center;padding:48px 24px;border:1px solid #7655d9;border-radius:20px;background:radial-gradient(ellipse at 68% 30%,#38216aa8,transparent 47%),radial-gradient(ellipse at 20% 80%,#123b72a0,transparent 55%),linear-gradient(135deg,#101b42,#080c20 75%);box-shadow:inset 0 1px 0 #fff3,0 0 30px #4720ca2e}
.sd-sport-orb{position:absolute;width:380px;height:380px;border-radius:50%;pointer-events:none;filter:blur(55px);opacity:.36}.sd-sport-orb-one{top:-220px;left:-120px;background:#3f9cff}.sd-sport-orb-two{bottom:-250px;right:-100px;background:#9a51ff}
.sd-sport-inner{position:relative;text-align:center;max-width:760px;z-index:1}
.sd-sport-emblem{display:grid;place-items:center;width:92px;height:92px;border:1px solid #ca9cff;border-radius:27px;background:linear-gradient(155deg,#392268,#1a1746);box-shadow:inset 0 1px 0 #fff5,0 0 23px #9b50ff9a,0 10px 30px #0007;margin:0 auto 27px}
.sd-sport-emblem img{width:70px;height:70px;filter:drop-shadow(0 0 11px #b883ff)}
.sd-sport-eyebrow{font-size:12px;font-weight:850;letter-spacing:.2em;color:#d4c2ff}
.sd-sport-landing h1{font-size:clamp(38px,5vw,65px);line-height:1.1;letter-spacing:-.045em;margin:15px 0;color:#f9faff}.sd-sport-landing h1 span{color:#f3d27c;background:linear-gradient(100deg,#ffe89e,#ba8aff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.sd-sport-landing p{font-size:16px;line-height:1.6;max-width:590px;margin:0 auto;color:#b9c9e4}
.sd-sport-upcoming{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:23px auto 20px}.sd-sport-upcoming span{font-size:12px;border:1px solid #7869cf65;border-radius:20px;padding:10px 14px;background:#26345b88;color:#e3e9ff}
.sd-sport-notice{font-size:12px;color:#b7c7dc;line-height:1.55;border:1px solid #f3cd4c50;background:#32251542;border-radius:12px;padding:12px 18px;margin:12px auto 25px;max-width:640px}.sd-sport-notice strong{color:#ffd56e}
.sd-sport-back{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:25px;padding:0 24px;font-weight:800;font-size:13px;color:#ffeaa5;background:linear-gradient(135deg,#553508,#302511);border:1px solid #ffe078;box-shadow:0 0 20px #e5a6298a;cursor:pointer}.sd-sport-back img{width:24px;height:24px}.sd-sport-back:hover{filter:brightness(1.15)}.sd-sport-back:focus-visible{outline:3px solid #fdf3ad;outline-offset:3px}
@media(max-width:700px){.sd-sport-landing{min-height:490px;padding:28px 16px}.sd-sport-emblem{width:75px;height:75px}.sd-sport-emblem img{width:58px;height:58px}.sd-sport-landing p{font-size:13px}.sd-sport-upcoming span{font-size:11px;padding:8px 11px}}
@media(prefers-reduced-motion:reduce){.site-header .sd-mode-button{transition:none!important}}


/* v8.0.4 — visual-only enhancement for existing header Log In / Sign Up.
   No changes to button IDs, event handlers, sizing, header layout or Supabase. */
.site-header .header-toolcluster #account-button {
  color: #f5fcff !important;
  border: 1.5px solid #25caff !important;
  background: linear-gradient(145deg, #10376c 0%, #081f50 48%, #060e2e 100%) !important;
  text-shadow: 0 0 7px rgba(116, 225, 255, .48) !important;
  box-shadow:
    inset 0 1px 0 rgba(232, 251, 255, .33),
    inset 0 -1px 0 rgba(6, 14, 43, .7),
    0 0 0 1px rgba(36, 153, 255, .23),
    0 0 11px rgba(4, 173, 255, .54),
    0 0 24px rgba(0, 132, 255, .32),
    0 5px 14px rgba(1, 8, 29, .5) !important;
}
.site-header .header-toolcluster #account-button:hover {
  border-color: #8aeaff !important;
  background: linear-gradient(145deg, #14518c, #092557 63%, #07143a) !important;
  box-shadow:
    inset 0 1px 0 rgba(236, 253, 255, .43),
    0 0 0 1px rgba(102, 221, 255, .28),
    0 0 18px rgba(16, 200, 255, .75),
    0 0 30px rgba(0, 132, 255, .42) !important;
}
.site-header .header-toolcluster #signup-button {
  color: #062726 !important;
  border: 1.5px solid #8fffe5 !important;
  background: linear-gradient(145deg, #4affdc 0%, #12eec9 46%, #00cda8 100%) !important;
  text-shadow: 0 1px 0 rgba(236, 255, 251, .23) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .62),
    inset 0 -1px 0 rgba(0, 99, 82, .30),
    0 0 0 1px rgba(56, 255, 211, .23),
    0 0 12px rgba(27, 254, 208, .54),
    0 0 26px rgba(4, 237, 189, .32),
    0 6px 15px rgba(0, 20, 24, .45) !important;
}
.site-header .header-toolcluster #signup-button:hover {
  border-color: #d0fff5 !important;
  background: linear-gradient(145deg, #85ffe9 0%, #33ffd8 46%, #13e6bc 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .78),
    0 0 0 1px rgba(95, 255, 221, .38),
    0 0 18px rgba(45, 255, 215, .76),
    0 0 34px rgba(2, 232, 173, .43) !important;
}
.site-header .header-toolcluster #account-button:focus-visible,
.site-header .header-toolcluster #signup-button:focus-visible {
  outline: 2px solid #f7ffff !important;
  outline-offset: 3px !important;
}
@media (prefers-reduced-motion: reduce) {
  .site-header .header-toolcluster #account-button,
  .site-header .header-toolcluster #signup-button {
    transition: none !important;
  }
}
