/* ================================================================
   TipsHunt — style.css REDESIGN v2.0
   Aesthetic: Dark luxury / premium gaming dashboard
   Font: Plus Jakarta Sans (body) + Sora (display/headings)
   ================================================================ */

   @import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

   :root {
     --brand-orange:   #f97316;
     --brand-amber:    #f59e0b;
     --brand-blue:     #3b82f6;
     --brand-cyan:     #06b6d4;
     --bg-base:        #080b10;
     --bg-surface:     #0d1117;
     --bg-card:        #111722;
     --bg-card-hover:  #161d2a;
     --bg-elevated:    #1a2233;
     --text-primary:   #f0f4ff;
     --text-secondary: #8b9bbf;
     --text-muted:     #4a5578;
     --border-subtle:  rgba(255,255,255,0.06);
     --border-soft:    rgba(255,255,255,0.10);
     --shadow-card:    0 1px 3px rgba(0,0,0,.5), 0 8px 32px rgba(0,0,0,.3);
     --shadow-modal:   0 24px 80px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.06);
     --header-h: 62px;
     --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-xl: 20px;
     --ease: cubic-bezier(0.16, 1, 0.3, 1);
     --bg-sub: var(--bg-surface);
     --stroke: var(--border-soft);
     --soft-stroke: var(--border-subtle);
     --text-dim: var(--text-secondary);
     --ok: #22c55e; --no: #ef4444;
   }
   
   *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
   html {
     -webkit-font-smoothing: antialiased;
     width: 100%;
     max-width: 100%;
     overflow-x: hidden;
   }
   
   body {
     font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
     background-color: var(--bg-base);
     color: var(--text-primary);
     min-height: 100vh;
     caret-color: var(--brand-orange);
     line-height: 1.5;
     width: 100%;
     max-width: 100%;
     overflow-x: hidden;
   }
   
   body.logged-out {
     background:
       radial-gradient(ellipse 80% 50% at 50% -20%, rgba(249,115,22,0.10), transparent),
       radial-gradient(ellipse 60% 40% at 80% 80%, rgba(59,130,246,0.07), transparent),
       var(--bg-base);
   }
   
   a { color: inherit; text-decoration: none; }
   button { font-family: inherit; cursor: pointer; }
   p { color: var(--text-secondary); }
   .hidden { display: none !important; }
   
   /* ===== LOADER ===== */
   .loader-overlay {
     position: fixed; inset: 0; z-index: 2000;
     display: flex; align-items: center; justify-content: center;
     background: var(--bg-base);
     transition: opacity .3s var(--ease);
   }
   .loader-overlay.hidden { opacity: 0; pointer-events: none; display: none !important; }
   .loader-card {
     display: flex; flex-direction: column; align-items: center; gap: 16px;
     padding: 30px 40px; border-radius: var(--r-xl);
     background: var(--bg-card); border: 1px solid var(--border-soft);
     box-shadow: var(--shadow-modal); position: relative; overflow: hidden;
   }
   .loader-card::before {
     content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
     width: 55%; height: 1px;
     background: linear-gradient(90deg, transparent, var(--brand-orange), transparent);
   }
   .spinner {
     width: 42px; height: 42px; border-radius: 50%;
     border: 2px solid rgba(249,115,22,0.15); border-top-color: var(--brand-orange);
     animation: th-spin .7s linear infinite;
   }
   .loader-text { font-size: 12px; font-weight: 600; color: var(--text-muted); letter-spacing: .5px; text-transform: uppercase; }
   @keyframes th-spin { to { transform: rotate(360deg); } }
   
   /* ===== HEADER ===== */
   .main-header {
     position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
     height: var(--header-h);
     background: rgba(8,11,16,0.90);
     backdrop-filter: blur(20px) saturate(180%);
     -webkit-backdrop-filter: blur(20px) saturate(180%);
     border-bottom: 1px solid var(--border-subtle);
     padding: 0 20px;
     display: flex; justify-content: space-between; align-items: center;
   }
   .header-right { display: flex; align-items: center; gap: 10px; }
   .logo { height: 46px; width: auto; object-fit: contain; }
   .auth-buttons { display: flex; align-items: center; gap: 8px; }
   .auth-buttons button {
     padding: 7px 18px; border: none; border-radius: var(--r-md);
     font-size: 14px; font-weight: 600; transition: all .2s var(--ease);
   }
   #loginBtn {
     background: var(--bg-elevated); color: var(--text-secondary);
     border: 1px solid var(--border-soft);
   }
   #loginBtn:hover { background: var(--bg-card-hover); color: var(--text-primary); }
   #registerBtn {
     background: var(--brand-orange); color: #fff;
     box-shadow: 0 0 16px rgba(249,115,22,0.28);
   }
   #registerBtn:hover {
     background: #ea6c0a;
     box-shadow: 0 0 24px rgba(249,115,22,0.42);
     transform: translateY(-1px);
   }
   @media (max-width: 600px) {
     .main-header { padding: 0 12px; }
     .logo { height: 36px; width: auto; }
     .auth-buttons button { font-size: 12px; padding: 6px 11px; }
   }
   
   /* Messages */
   #messaggiWrapper { position: relative; display: none; cursor: pointer; }
   .messaggi-icon { height: 22px; filter: invert(1); opacity: 0.65; transition: opacity .2s; }
   #messaggiWrapper:hover .messaggi-icon { opacity: 1; }
   .messaggi-badge {
     position: absolute; top: -4px; right: -4px;
     background: var(--brand-orange); color: #fff;
     font-size: 10px; border-radius: 50%; padding: 2px 5px; font-weight: 700; display: none;
   }
   .messaggi-dropdown {
     position: absolute; top: calc(100% + 10px); right: 0; width: 290px;
     background: var(--bg-card); border: 1px solid var(--border-soft);
     border-radius: var(--r-lg); box-shadow: var(--shadow-modal); z-index: 1000;
     display: none; overflow: hidden;
   }
   @media (max-width: 480px) { .messaggi-dropdown { width: 90vw; left: 50%; right: auto; transform: translateX(-67%); } }
   .messaggio-item { padding: 11px 13px; border-bottom: 1px solid var(--border-subtle); font-size: 13px; }
   .messaggio-item:last-child { border-bottom: none; }
   .messaggio-titolo { font-weight: 600; color: var(--text-primary); margin-bottom: 3px; }
   .messaggio-data { font-size: 11px; color: var(--text-muted); text-align: right; margin-top: 3px; }
   .messaggio-testo { font-size: 13px; color: var(--text-secondary); line-height: 1.4; }
   .messaggio-placeholder { padding: 14px; text-align: center; color: var(--text-muted); font-style: italic; font-size: 13px; }
   
   /* ===== CATEGORY TABS ===== */
   .tab-scroll-wrapper {
     overflow-x: auto; -webkit-overflow-scrolling: touch; scroll-behavior: smooth;
     background: var(--bg-surface); border-bottom: 1px solid var(--border-subtle);
     scrollbar-width: none;
   }
   .tab-scroll-wrapper::-webkit-scrollbar { display: none; }
   .tab-container { display: flex; flex-wrap: nowrap; gap: 4px; padding: 10px 16px; min-width: max-content; }
   .tab {
     display: flex; align-items: center; gap: 7px;
     padding: 8px 16px; background: none; border: 1px solid transparent;
     border-radius: var(--r-md); font-size: 14px; font-weight: 500; color: var(--text-muted);
     cursor: pointer; transition: all .2s var(--ease); white-space: nowrap;
   }
   .tab:hover { color: var(--text-primary); background: var(--bg-elevated); border-color: var(--border-subtle); }
   .tab.active {
     color: var(--brand-orange); background: rgba(249,115,22,0.08);
     border-color: rgba(249,115,22,0.18); font-weight: 600;
   }
   .tab-icon { width: 22px; height: 22px; object-fit: contain; }
   @media (max-width: 480px) { .tab { font-size: 13px; padding: 7px 12px; } .tab-icon { width: 18px; height: 18px; } }
   
   /* ===== MAIN ===== */
   .main-content { padding: 20px; padding-top: calc(var(--header-h) + 16px); text-align: center; }
   h1 { font-family: 'Sora', sans-serif; font-size: 1.6rem; color: var(--brand-orange); margin-bottom: 20px; }
   
   /* ===== TAVOLI GRID ===== */
   #tavoliGrid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
     row-gap: 12px; column-gap: 16px; padding: 14px 16px; justify-content: start;
   }
  .tavolo-card {
    width: 100%; max-width: 360px; margin: 0 auto;
    border-radius: var(--r-lg); overflow: hidden;
    background: var(--bg-card); border: 1px solid var(--border-subtle);
    box-shadow: var(--shadow-card);
    transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s;
  }
  .card-background {
    background-size: cover;
    background-position: center;
    height: 190px;
    display: grid;
    grid-template-rows: auto 1fr auto;
    position: relative;
  }
  .card-background::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.72) 0%, rgba(0,0,0,.42) 42%, rgba(0,0,0,.80) 100%);
    pointer-events: none;
  }
  .card-top-bar {
     position: relative; z-index: 1;
     display: flex; justify-content: space-between; align-items: center;
     padding: 10px 12px;
     background: linear-gradient(to bottom, rgba(0,0,0,.86), rgba(0,0,0,.28));
     color: white;
   }
  .tavolo-card .card-top-bar img.open-calc-btn {
    width: 20px; height: 20px; margin-right: 8px; cursor: pointer;
    opacity: .75; transition: all .15s; filter: invert(1);
  }
  .tavolo-card .card-top-bar img.open-calc-btn:hover { transform: scale(1.1); opacity: 1; }
  .open-paperbet-btn {
    min-width: 28px; height: 28px; padding: 0 8px; margin-right: 8px;
    border-radius: 999px; border: 1px solid rgba(255,255,255,.24);
    background: rgba(7,12,20,.58); color: #fff; font-size: 11px; font-weight: 800;
    cursor: pointer; transition: all .18s var(--ease);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  }
  .open-paperbet-btn:hover {
    transform: scale(1.06);
    border-color: rgba(249,115,22,.45);
    background: rgba(249,115,22,.16);
  }
  .card-title { font-weight: 700; font-size: 15px; flex: 1; text-align: left; text-shadow: 0 1px 4px rgba(0,0,0,.7); }
   .open-stats-btn {
     width: 18px; height: 18px; cursor: pointer; filter: invert(1); opacity: .75;
     transition: all .2s;
   }
   .open-stats-btn:hover { opacity: 1; transform: scale(1.15); filter: invert(1) drop-shadow(0 0 4px rgba(249,115,22,.8)); }
   .card-bottom-bar {
     position: relative; z-index: 1;
     background: linear-gradient(to top, rgba(2,6,12,.78), rgba(2,6,12,.18));
     padding: 4px 8px 6px; display: flex; justify-content: center; align-items: flex-end; min-height: 34px;
    }
   .card-bottom-bar .numeri {
     display: flex;
     flex-wrap: wrap;
     gap: 4px;
     justify-content: center;
     align-items: center;
     width: auto;
     margin: 0 auto;
   }
   .numero {
     display: inline-flex; align-items: center; justify-content: center;
     width: 26px; height: 26px; font-weight: 700; font-size: 12px; color: white;
     border-radius: 5px; box-shadow: 0 1px 4px rgba(0,0,0,.5);
   }
   .numero[data-val="0"] { background: #16a34a; }
   .numero[data-val="1"],.numero[data-val="3"],.numero[data-val="5"],.numero[data-val="7"],
   .numero[data-val="9"],.numero[data-val="12"],.numero[data-val="14"],.numero[data-val="16"],
   .numero[data-val="18"],.numero[data-val="19"],.numero[data-val="21"],.numero[data-val="23"],
   .numero[data-val="25"],.numero[data-val="27"],.numero[data-val="30"],.numero[data-val="32"],
   .numero[data-val="34"],.numero[data-val="36"] { background: #dc2626; }
   .numero[data-val="2"],.numero[data-val="4"],.numero[data-val="6"],.numero[data-val="8"],
   .numero[data-val="10"],.numero[data-val="11"],.numero[data-val="13"],.numero[data-val="15"],
   .numero[data-val="17"],.numero[data-val="20"],.numero[data-val="22"],.numero[data-val="24"],
   .numero[data-val="26"],.numero[data-val="28"],.numero[data-val="29"],.numero[data-val="31"],
   .numero[data-val="33"],.numero[data-val="35"] { background: #1e2535; }
  .card-footer {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 8px;
     background:
       linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
       var(--bg-surface);
     padding: 10px 12px;
    border-top: 1px solid var(--border-subtle);
  }
  .provider-logo {
    order: 2;
    margin-left: auto;
    height: 18px;
    opacity: 0.6;
    align-self: center;
  }
  .paperbet-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    min-width: 120px;
    border-radius: 12px;
    border: 1px solid rgba(249,115,22,.18);
    background: linear-gradient(180deg, rgba(249,115,22,.12), rgba(249,115,22,.05));
    color: #fff;
    margin-right: auto;
    white-space: nowrap;
  }
  .paperbet-badge.hidden { display: none; }
  .paperbet-badge__kicker {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    color: #fdba74;
  }
  .paperbet-badge strong { font-size: 13px; line-height: 1; }
  .paperbet-badge small { font-size: 10px; color: rgba(255,255,255,.72); }
  .paperbet-widget {
    position: fixed;
    right: 12px;
    bottom: 0;
    width: min(340px, calc(100vw - 32px));
    z-index: 1200;
    overflow: visible;
    pointer-events: none;
  }
  .paperbet-widget.hidden { display: none; }
  .paperbet-widget__tab {
    position: absolute;
    right: 0;
    bottom: 100%;
    transform: translateY(1px);
    min-width: 172px;
    min-height: 42px;
    padding: 10px 14px;
    border: 1px solid rgba(249,115,22,.28);
    border-bottom: 0;
    border-radius: 14px 14px 0 0;
    background: #8a3b08;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
    cursor: pointer;
    z-index: 1;
    pointer-events: auto;
  }
  .paperbet-widget__panel {
    position: absolute;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    max-height: min(62vh, 460px);
    border-radius: 18px 18px 0 0;
    border: 1px solid rgba(249,115,22,.16);
    background: rgba(7,12,20,.94);
    box-shadow: 0 18px 50px rgba(0,0,0,.38);
    backdrop-filter: blur(14px);
    overflow: hidden;
    transform: translateY(calc(100% - 1px));
    transition: transform .25s var(--ease);
    pointer-events: auto;
  }
  .paperbet-widget.is-open .paperbet-widget__panel {
    transform: translateY(0);
  }
  .paperbet-widget.is-open .paperbet-widget__tab {
    opacity: 0;
    pointer-events: none;
  }
  .paperbet-widget__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: linear-gradient(180deg, rgba(249,115,22,.10), rgba(255,255,255,.02));
  }
  .paperbet-widget__head strong {
    display: block;
    font-size: 14px;
  }
  .paperbet-widget__head small {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    color: var(--text-muted);
  }
  .paperbet-widget__close {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.04);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    flex: 0 0 auto;
  }
  .paperbet-widget__body {
    overflow-y: auto;
    padding: 10px;
    display: grid;
    gap: 8px;
  }
  .paperbet-widget__item {
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.07);
    background: rgba(255,255,255,.03);
    cursor: pointer;
    transition: border-color .18s var(--ease), background .18s var(--ease);
  }
  .paperbet-widget__item:hover {
    border-color: rgba(249,115,22,.18);
    background: rgba(249,115,22,.05);
  }
  .paperbet-widget__item.is-archived {
    border-color: rgba(148,163,184,.18);
    background: rgba(148,163,184,.05);
  }
  .paperbet-widget__item.is-archived .paperbet-widget__item-top span {
    color: #cbd5e1;
  }
  .paperbet-widget__item-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 4px;
  }
  .paperbet-widget__item-top strong {
    font-size: 13px;
  }
  .paperbet-widget__item-top span {
    font-size: 13px;
    font-weight: 800;
    color: #fdba74;
  }
  .paperbet-widget__item-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 11px;
    color: var(--text-secondary);
  }
  .paperbet-widget__item-meta span {
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .paperbet-widget__item-meta small {
    flex: 0 0 auto;
    color: var(--text-muted);
  }
  .paperbet-widget__empty {
    padding: 14px 12px;
    font-size: 12px;
    color: var(--text-muted);
  }
  .paperbet-widget__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    border-top: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.025);
    font-size: 12px;
    font-weight: 700;
  }
  .paperbet-widget__foot strong {
    font-size: 16px;
    color: #fff;
  }
  .tavolo-card .card-footer .cluster-box { margin-top: 2px; }
  @media (max-width: 600px) {
    .tavolo-card { max-width: 100%; }
    #tavoliGrid {
      grid-template-columns: minmax(0, 1fr);
      padding: 10px 12px;
      column-gap: 12px;
      row-gap: 12px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
    }
  }
   
   .roulette-toolbar {
     display: flex;
     align-items: flex-start;
     gap: 8px;
     flex-wrap: nowrap;
     position: relative;
     z-index: 25;
     overflow: visible;
   }

   /* ===== SEARCH BAR ===== */
   .tavoli-search {
     display: inline-flex; align-items: center; gap: 8px;
     padding: 6px 12px; margin: 10px 0 0 14px;
     border-radius: var(--r-lg); background: var(--bg-elevated);
     border: 1px solid var(--border-soft); box-shadow: 0 2px 12px rgba(0,0,0,.2);
     transition: border-color .2s, box-shadow .2s;
   }
   .tavoli-search:focus-within {
     border-color: rgba(249,115,22,0.3);
     box-shadow: 0 0 0 3px rgba(249,115,22,0.07);
   }
   .tavoli-search input {
     flex: 0 1 280px; min-width: 150px; height: 32px; padding: 0 8px;
     border: none; background: transparent; color: var(--text-primary);
     outline: none; font-size: 14px; font-family: inherit;
   }
   .tavoli-search input::placeholder { color: var(--text-muted); }
   .tavoli-search .icon { font-size: 14px; opacity: .55; }
   .tavoli-search .clear-btn {
     padding: 3px 8px; border-radius: var(--r-sm);
     border: 1px solid var(--border-subtle); background: var(--bg-card);
     color: var(--text-muted); font-size: 12px; transition: all .15s;
   }
  .tavoli-search .clear-btn:hover { background: var(--bg-elevated); color: var(--text-primary); }
  @media (max-width: 767.98px) {
    .roulette-toolbar {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      column-gap: 6px;
      row-gap: 0;
      padding: 10px 12px 0;
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }
    .roulette-toolbar.roulette-toolbar--pro-view {
      grid-template-columns: minmax(0, 1fr) 118px;
    }
    .roulette-toolbar > * {
      min-width: 0;
    }
    .tavoli-search {
      display: flex;
      flex: none;
      width: auto;
      max-width: none;
      min-width: 0;
      margin: 0;
      box-sizing: border-box;
      padding: 6px 8px;
      width: 100%;
    }
    .tavoli-search input {
      flex: 1 1 auto;
      min-width: 0;
      font-size: 13px;
      padding: 0 4px;
    }
    .tavoli-search .icon {
      font-size: 12px;
    }
    .tavoli-search .clear-btn {
      padding: 2px 6px;
      font-size: 11px;
    }
  }
  
  /* ===== FILTRO AVANZATO ===== */
   .filtro-avanzato {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     position: relative;
     z-index: 40;
     vertical-align: top;
     padding: 0;
     margin: 10px 0 0 8px;
   }
   .btn-filtro-toggle {
     display: inline-flex; align-items: center; justify-content: center;
     width: 44px; height: 44px; padding: 0; margin: 0;
     background: var(--bg-elevated); border: 1px solid var(--border-soft);
     border-radius: var(--r-lg); color: var(--text-secondary); font-size: 20px; font-weight: 700;
     transition: all .2s;
   }
   .btn-filtro-toggle:hover { background: var(--bg-card-hover); color: var(--text-primary); }
   .filtro-dropdown {
     position: absolute; top: calc(100% + 8px); right: 0; z-index: 80; min-width: 320px;
     background: var(--bg-card); border: 1px solid var(--border-soft);
     border-radius: var(--r-lg); padding: 14px; margin-top: 0; box-shadow: var(--shadow-card);
   }
   .filtro-title { font-size: 12px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 10px; }
   .filtro-mode { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
   .filtro-view { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
   .filtro-mode label {
     display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;
     color: var(--text-secondary); cursor: pointer; padding: 6px 10px;
     border-radius: var(--r-sm); border: 1px solid var(--border-subtle);
     background: var(--bg-elevated); transition: all .15s;
   }
   .filtro-view label {
     display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;
     color: var(--text-secondary); cursor: pointer; padding: 6px 10px;
     border-radius: var(--r-sm); border: 1px solid var(--border-subtle);
     background: var(--bg-elevated); transition: all .15s;
   }
   .filtro-mode label:hover { color: var(--text-primary); border-color: var(--border-soft); }
   .filtro-view label:hover { color: var(--text-primary); border-color: var(--border-soft); }
   .filtro-mode label:has(input:disabled) { opacity: .55; cursor: not-allowed; }
   .filtro-view label:has(input:disabled) { opacity: .55; cursor: not-allowed; }
   .filtro-view-switch {
     display: inline-flex;
     align-items: center;
     gap: 6px;
   }
   .filtro-view-btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 44px;
     height: 44px;
     padding: 0;
     border-radius: var(--r-lg);
     border: 1px solid var(--border-soft);
     background: var(--bg-elevated);
     color: var(--text-secondary);
     transition: all .18s;
   }
   .filtro-view-btn:hover {
     background: var(--bg-card-hover);
     color: var(--text-primary);
   }
   .filtro-view-btn.is-active {
     border-color: rgba(56,189,248,.24);
     background: rgba(56,189,248,.14);
     color: #e0f2fe;
     box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
   }
   .filtro-view-btn:disabled {
     opacity: .55;
     cursor: not-allowed;
   }
   .filtro-view-btn svg {
     width: 18px;
     height: 18px;
     stroke: currentColor;
     fill: none;
     stroke-width: 1.8;
     stroke-linecap: round;
     stroke-linejoin: round;
   }
   .filtro-note { margin: -4px 0 12px; font-size: 12px; line-height: 1.45; color: var(--text-secondary); }
   .filtro-checkboxes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
   .filtro-checkboxes label {
     display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500;
     color: var(--text-secondary); cursor: pointer; padding: 5px 10px;
     border-radius: var(--r-sm); border: 1px solid var(--border-subtle);
     background: var(--bg-elevated); transition: all .15s;
   }
   .filtro-checkboxes label:hover { color: var(--text-primary); border-color: var(--border-soft); }
   .filtro-checkboxes label:has(input:disabled) {
     opacity: .55;
     cursor: not-allowed;
   }
   .filtro-actions { display: flex; gap: 8px; }
   .btn-applica { padding: 7px 16px; background: var(--brand-orange); color: #fff; border: none; border-radius: var(--r-md); font-size: 13px; font-weight: 700; transition: all .2s; }
   .btn-applica:hover { background: #ea6c0a; transform: translateY(-1px); }
   .btn-reset { padding: 7px 16px; background: var(--bg-elevated); color: var(--text-secondary); border: 1px solid var(--border-soft); border-radius: var(--r-md); font-size: 13px; font-weight: 600; }
   .btn-reset:hover { background: var(--bg-card-hover); color: var(--text-primary); }
   .btn-applica:disabled,
   .btn-reset:disabled {
     opacity: .55;
     cursor: not-allowed;
     transform: none;
   }
  @media (max-width: 767.98px) {
    .filtro-avanzato {
      display: inline-flex;
      flex: 0 0 auto;
      flex-wrap: nowrap;
      align-items: center;
      margin: 0;
      gap: 4px;
      min-width: 0;
      justify-self: end;
     }
     .roulette-toolbar.roulette-toolbar--pro-view .filtro-avanzato {
       width: 118px;
       justify-content: flex-end;
     }
     .filtro-view-switch {
       display: inline-flex;
       gap: 4px;
       flex-wrap: nowrap;
       min-width: 0;
      }
     .filtro-view-btn {
       width: 34px;
       height: 34px;
       border-radius: 12px;
     }
     .filtro-view-btn svg {
       width: 15px;
       height: 15px;
     }
     .btn-filtro-toggle {
       width: 34px;
       height: 34px;
       font-size: 16px;
       border-radius: 12px;
     }
     .filtro-dropdown {
       width: min(320px, calc(100vw - 24px));
       min-width: 0;
       max-width: calc(100vw - 24px);
       right: 0;
       left: auto;
      }
      body {
        overflow-x: hidden;
      }
      html {
        -webkit-text-size-adjust: 100%;
      }
    }

  @supports (-webkit-touch-callout: none) {
    @media (max-width: 767.98px) {
     .roulette-toolbar {
       max-width: 100vw;
        overflow: visible;
      }
      .roulette-toolbar.roulette-toolbar--pro-view {
        grid-template-columns: minmax(0, calc(100vw - 142px)) 118px;
      }
      .tavoli-search {
        max-width: 100%;
        overflow: hidden;
      }
      .tavoli-search input {
        font-size: 16px;
      }
    }
  }
   .filtro-lock { margin-left: auto; font-size: 11px; color: var(--text-muted); }
   .giocate-badges {
     order: 1;
     flex: 1 1 220px;
     display: flex;
     flex-wrap: wrap;
     gap: 6px;
     align-items: center;
     min-width: 0;
   }
   .match-pill {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     min-height: 28px;
     padding: 5px 9px;
     border-radius: 999px;
     border: 1px solid rgba(249,115,22,.22);
     background: rgba(249,115,22,.10);
     color: #fed7aa;
     font-size: 11px;
     line-height: 1;
     white-space: nowrap;
   }
   .match-pill strong {
     color: #fff7ed;
     font-size: 10px;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .04em;
   }
   .match-pill em {
     font-style: normal;
     color: #fff;
     font-weight: 800;
   }
   .match-pill.is-overall {
     border-color: rgba(56,189,248,.18);
     background: rgba(56,189,248,.12);
     color: #bae6fd;
   }
   .match-pill.is-sector5 {
     border-color: rgba(34,197,94,.22);
     background: rgba(34,197,94,.12);
     color: #bbf7d0;
   }
   .pro-discover-pill {
     order: 0;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     min-height: 30px;
     padding: 6px 10px;
     border-radius: 999px;
     border: 1px solid rgba(249,115,22,.22);
     background: linear-gradient(180deg, rgba(249,115,22,.14), rgba(249,115,22,.08));
     color: #fff7ed;
     font-size: 11px;
     font-weight: 800;
     letter-spacing: .02em;
     cursor: pointer;
     transition: transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
   }
   .pro-discover-pill:hover {
     transform: translateY(-1px);
     border-color: rgba(249,115,22,.34);
     background: linear-gradient(180deg, rgba(249,115,22,.2), rgba(249,115,22,.1));
   }
   .cluster-box {
     order: 3;
     flex: 1 1 100%;
     display: none;
     padding: 6px 9px;
     border-radius: 12px;
     border: 1px solid rgba(249,115,22,.18);
     background:
       linear-gradient(135deg, rgba(249,115,22,.14), rgba(249,115,22,.04)),
       rgba(255,255,255,.03);
     color: #fff7ed;
     line-height: 1.2;
     box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
   }
   .cluster-box strong {
     font-size: 10px;
     font-weight: 800;
     letter-spacing: .04em;
     text-transform: uppercase;
     color: #fdba74;
   }
   .cluster-box small {
     color: var(--text-muted);
     font-size: 10px;
     font-weight: 700;
   }
   .cluster-box span {
     display: block;
     margin-top: 3px;
     font-size: 11px;
     font-weight: 700;
     color: #fff;
     letter-spacing: .01em;
   }
   .roulette-arrivals {
     order: 3;
     flex: 1 1 100%;
     display: none;
     min-width: 0;
     gap: 8px;
     padding: 8px 10px 10px;
     border-radius: 14px;
     border: 1px solid rgba(56,189,248,.14);
     background:
       linear-gradient(180deg, rgba(56,189,248,.08), rgba(8,14,22,.18)),
       rgba(255,255,255,.02);
   }
   .roulette-arrivals__head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 10px;
   }
   .roulette-arrivals__head strong {
     font-size: 10px;
     font-weight: 800;
     letter-spacing: .05em;
     text-transform: uppercase;
     color: #bae6fd;
   }
   .roulette-arrivals__head span {
     min-width: 22px;
     height: 22px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     border-radius: 999px;
     font-size: 11px;
     font-weight: 800;
     color: #e0f2fe;
     background: rgba(56,189,248,.14);
     border: 1px solid rgba(56,189,248,.18);
   }
   .roulette-arrivals__list {
     display: grid;
     gap: 7px;
   }
   .roulette-arrival {
     display: grid;
     min-width: 0;
     gap: 5px;
     padding: 8px 9px;
     border-radius: 12px;
     border: 1px solid rgba(255,255,255,.08);
     background: rgba(255,255,255,.03);
   }
   .roulette-arrival.is-close {
     border-color: rgba(245,158,11,.22);
     background: rgba(245,158,11,.08);
   }
   .roulette-arrival.is-ready {
     border-color: rgba(34,197,94,.24);
     background: rgba(34,197,94,.10);
   }
   .roulette-arrival__top,
   .roulette-arrival__meta {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 10px;
   }
   .roulette-arrival__top strong {
     min-width: 0;
     font-size: 12px;
     font-weight: 800;
     color: #fff;
   }
   .roulette-arrival__top span {
     flex: 0 0 auto;
     font-size: 12px;
     font-weight: 800;
     color: #f8fafc;
   }
   .roulette-arrival__meta small {
     min-width: 0;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
     font-size: 11px;
     color: rgba(226,232,240,.78);
   }
   .roulette-arrival__meta em {
     flex: 0 0 auto;
     font-style: normal;
     font-size: 11px;
     font-weight: 800;
     color: #93c5fd;
   }
   .roulette-arrival.is-ready .roulette-arrival__meta em {
     color: #86efac;
   }
   .roulette-arrival__targets {
      display: flex;
      flex-wrap: wrap;
      min-width: 0;
      gap: 6px;
    }
   .roulette-arrival__target {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      min-width: 0;
      max-width: 100%;
      min-height: 24px;
      padding: 4px 7px;
      border-radius: 999px;
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(255,255,255,.04);
      font-size: 11px;
      font-weight: 700;
      color: #f8fafc;
      overflow: hidden;
    }
   .roulette-arrival__target {
     text-overflow: ellipsis;
     white-space: nowrap;
   }
   .roulette-arrival__target em {
      font-style: normal;
      color: #93c5fd;
      font-weight: 800;
      flex: 0 0 auto;
    }
   .roulette-arrival.is-ready .roulette-arrival__target em {
     color: #86efac;
   }
  .roulette-card--incoming-view .provider-logo {
     order: 2;
     align-self: flex-start;
   }
   .roulette-card--incoming-view .card-background {
     height: auto;
     min-height: 240px;
     grid-template-rows: auto auto auto;
   }
   .roulette-card--incoming-view .card-bottom-bar {
     min-height: 0;
   }
   .roulette-card--incoming-view .card-footer {
     align-content: flex-start;
   }
   .roulette-card--incoming-view .roulette-arrivals__list {
     max-height: 180px;
     overflow-y: auto;
     padding-right: 2px;
   }
   @media (max-width: 767.98px) {
     .card-footer {
       gap: 7px;
       padding: 9px 10px;
     }
     .provider-logo {
       order: 2;
       margin-left: auto;
       align-self: center;
     }
     .giocate-badges {
       order: 1;
       flex: 1 1 0;
       min-width: 0;
     }
     .match-pill {
       min-height: 26px;
       padding: 4px 8px;
       font-size: 10px;
     }
     .pro-discover-pill {
       min-height: 28px;
       padding: 5px 8px;
       font-size: 10px;
     }
     .cluster-box {
       order: 3;
       flex-basis: 100%;
       padding: 6px 8px;
       border-radius: 10px;
     }
     .cluster-box span {
       font-size: 10px;
     }
     .roulette-arrivals {
       padding: 7px 8px 8px;
       border-radius: 12px;
     }
     .roulette-arrivals__list {
       gap: 6px;
     }
     .roulette-arrival {
       padding: 7px 8px;
       border-radius: 10px;
     }
     .roulette-arrival__top strong,
     .roulette-arrival__top span {
       font-size: 11px;
     }
     .roulette-arrival__meta small,
     .roulette-arrival__meta em {
       font-size: 10px;
     }
     .roulette-arrival__targets {
       gap: 5px;
       display: grid;
       grid-template-columns: minmax(0, 1fr);
     }
     .roulette-arrival__target {
       display: flex;
       width: 100%;
       min-height: 22px;
       padding: 3px 6px;
       font-size: 10px;
     }
     .roulette-card--incoming-view .card-background {
       min-height: 228px;
     }
     .roulette-card--incoming-view .roulette-arrivals__list {
       max-height: 150px;
     }
   }
   
   /* ===== SIDEBAR ===== */
  .sidebar {
    position: fixed; top: 0; right: 0; bottom: 0; width: 265px; height: 100vh; min-height: 100dvh;
    background: var(--bg-card); border-left: 1px solid var(--border-soft);
    color: var(--text-primary); z-index: 1001;
    transform: translateX(100%); transition: transform .3s var(--ease);
    box-shadow: -8px 0 40px rgba(0,0,0,.5);
    display: flex; flex-direction: column; overflow: hidden;
  }
   .sidebar:not(.hidden) { transform: translateX(0); }
   .sidebar-header {
     display: flex; justify-content: space-between; align-items: center;
     padding: 18px 18px 14px; border-bottom: 1px solid var(--border-subtle);
     font-size: 15px; font-weight: 700;
   }
   .sidebar-header .close-sidebar {
     cursor: pointer; font-size: 18px; color: var(--text-muted);
     width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
     border-radius: 6px; transition: all .2s;
   }
   .sidebar-header .close-sidebar:hover { background: var(--bg-elevated); color: var(--text-primary); }
   .sidebar-credits {
     display: flex; align-items: center; gap: 8px;
     margin: 12px 14px 6px; padding: 10px 13px; border-radius: var(--r-md);
     background: linear-gradient(135deg, rgba(249,115,22,0.07), rgba(245,158,11,0.05));
     border: 1px solid rgba(249,115,22,0.13); font-size: 13px; cursor: pointer;
     transition: border-color .2s;
   }
   .sidebar-credits:hover { border-color: rgba(249,115,22,0.26); }
   .sidebar-credits .credits-label { font-weight: 700; color: var(--brand-amber); }
   .sidebar-menu { list-style: none; padding: 6px 10px; flex-grow: 1; }
   .sidebar-menu li { margin: 2px 0; }
   .btn-menu {
     display: flex; align-items: center; gap: 10px; width: 100%;
     font-size: 14px; font-weight: 500; padding: 10px 12px;
     color: var(--text-secondary); border-radius: var(--r-md); border: none; background: none;
     transition: all .2s var(--ease); height: auto;
   }
   .btn-menu .tab-icon { width: 19px; height: 19px; opacity: 0.55; filter: invert(1) brightness(.7); transition: opacity .2s; }
   .btn-menu:hover { background: var(--bg-elevated); color: var(--text-primary); }
   .btn-menu:hover .tab-icon { opacity: 0.9; }
   #logoutLink:hover { background: rgba(239,68,68,0.08); color: #f87171; }
   .sidebar-overlay {
     position: fixed; inset: 0; background: rgba(0,0,0,.5);
     backdrop-filter: blur(2px); z-index: 999; display: block;
   }
   .sidebar-overlay.hidden { display: none; }
   .sidebar-expiry { padding: 10px 18px 14px; border-top: 1px solid var(--border-subtle); text-align: center; }
   .expiry-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--text-muted); display: block; margin-bottom: 7px; }
   .expiry-bar { width: 100%; height: 5px; background: var(--bg-elevated); border-radius: 999px; overflow: hidden; }
   .expiry-fill { height: 100%; width: 0%; background: linear-gradient(90deg, var(--brand-blue), var(--brand-cyan)); border-radius: 999px; transition: width .6s var(--ease); }
   .expiry-text { font-size: 11px; margin-top: 5px; display: block; color: var(--text-muted); }
   #adminLink.sidebar-link { background: linear-gradient(135deg,#1dbf85,#0e9267); border: 1px solid rgba(29,191,133,.25); color: #fff; font-weight: 700; border-radius: var(--r-md); padding: 10px 12px; cursor: pointer; }
   #adminLink.sidebar-link:hover { filter: brightness(1.06); }
   .language-flags { display: flex; justify-content: center; gap: 10px; padding: 10px 18px; border-top: 1px solid var(--border-subtle); }
   .flag-item { cursor: pointer; display: inline-flex; align-items: center; gap: 4px; padding: 4px 6px; border-radius: var(--r-sm); opacity: .5; transition: opacity .2s, background .2s; }
   .flag-item:hover { opacity: .9; background: var(--bg-elevated); }
   .flag-item.active-lang, .flag-item.selected { opacity: 1; background: var(--bg-elevated); }
   .flag-svg { width: 18px; height: 12px; }
   .lang-code { font-size: 11px; font-weight: 700; display: none; }
   @media (min-width: 768px) { .lang-code { display: inline; } }
   .user-btn { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: var(--bg-elevated); border: 1px solid var(--border-soft); border-radius: var(--r-md); color: var(--text-secondary); font-weight: 600; font-size: 13px; transition: all .2s; }
   .user-btn:hover { color: var(--text-primary); background: var(--bg-card-hover); }
   .user-icon { width: 20px; height: 20px; filter: invert(1); opacity: .6; }
   
   /* ===== MODALS ===== */
   .modal {
     position: fixed; inset: 0; background: rgba(0,0,0,.8);
     backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; z-index: 999;
   }
   .modal.hidden { display: none; }
   .modal-login {
     background: var(--bg-card); padding: 28px 24px; border-radius: var(--r-xl);
     width: 92%; max-width: 400px; box-shadow: var(--shadow-modal); border: 1px solid var(--border-soft);
     position: relative; overflow: hidden;
   }
   .modal-login::before {
     content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
     width: 50%; height: 1px;
     background: linear-gradient(90deg, transparent, var(--brand-orange), transparent);
   }
   .close-btn {
     position: absolute; top: 14px; right: 16px; font-size: 20px; cursor: pointer;
     color: var(--text-muted); width: 28px; height: 28px;
     display: flex; align-items: center; justify-content: center;
     border-radius: 6px; transition: all .2s;
   }
   .close-btn:hover { background: var(--bg-elevated); color: var(--text-primary); }
   .auth-form { display: flex; flex-direction: column; gap: 12px; }
   .auth-form input {
     padding: 11px 14px; border-radius: var(--r-md); border: 1px solid var(--border-soft);
     background: var(--bg-elevated); color: var(--text-primary); font-size: 14px; font-family: inherit;
     outline: none; transition: border-color .2s, box-shadow .2s;
   }
   .auth-form input:focus { border-color: rgba(249,115,22,.4); box-shadow: 0 0 0 3px rgba(249,115,22,.07); }
   .auth-form input::placeholder { color: var(--text-muted); }
   .auth-form button[type="submit"] {
     padding: 12px; background: var(--brand-orange); color: #fff; border: none;
     border-radius: var(--r-md); font-weight: 700; font-size: 15px;
     transition: all .2s var(--ease); box-shadow: 0 0 20px rgba(249,115,22,.22);
   }
   .auth-form button[type="submit"]:hover { background: #ea6c0a; transform: translateY(-1px); box-shadow: 0 0 28px rgba(249,115,22,.38); }
   .auth-title-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
   .auth-title-bar h2 { font-family: 'Sora', sans-serif; font-size: 1.25rem; font-weight: 800; }
   .header-flags { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
   
   .modal-content {
     background: var(--bg-card); border-radius: var(--r-xl);
     border: 1px solid var(--border-soft); box-shadow: var(--shadow-modal);
     padding: 20px 18px; position: relative; width: 90%; max-width: 600px;
   }
   .modal-content .close {
     position: absolute; top: 14px; right: 16px; font-size: 22px; cursor: pointer;
     color: var(--text-muted); width: 28px; height: 28px;
     display: flex; align-items: center; justify-content: center;
     border-radius: 6px; transition: all .2s; z-index: 10;
   }
  .modal-content .close:hover { background: var(--bg-elevated); color: var(--text-primary); }
  .paperbet-modal {
    width: min(760px, 96vw);
    max-width: none;
    padding: 22px 22px 18px;
  }
  .paperbet-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
  }
  .paperbet-head h2 {
    margin: 0;
    font-family: 'Sora', sans-serif;
    font-size: 1.25rem;
    font-weight: 800;
  }
  .paperbet-meta {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--text-secondary);
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .paperbet-board {
    padding: 8px;
    border-radius: 0;
    border: 1px solid var(--border-soft);
    background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  }
  .paperbet-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2px;
    justify-items: center;
  }
  .paperbet-grid {
    display: grid;
    gap: 2px;
    width: fit-content;
  }
  .paperbet-row {
    display: grid;
    grid-template-columns: repeat(3, 34px);
    gap: 2px;
  }
  .paperbet-cell {
    position: relative;
    min-height: 28px;
    width: 34px;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,.12);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(8,12,20,.7);
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
    transition: transform .16s var(--ease), box-shadow .16s var(--ease), border-color .16s var(--ease);
  }
  .paperbet-cell.rosso,
  .paperbet-cell.red { background: #b91c1c; }
  .paperbet-cell.nero,
  .paperbet-cell.black { background: #111827; }
  .paperbet-cell.verde,
  .paperbet-cell.green { background: #15803d; }
  .paperbet-cell:hover {
    transform: translateY(-1px);
    border-color: rgba(255,255,255,.32);
  }
  .paperbet-cell.is-selected {
    box-shadow: 0 0 0 2px rgba(255,255,255,.18), 0 10px 24px rgba(0,0,0,.22);
  }
  .paperbet-cell__chip {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 14px;
    height: 14px;
    padding: 0 4px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f8fafc;
    color: #111827;
    font-size: 8px;
    font-weight: 800;
  }
  .paperbet-zero {
    min-height: 30px;
    width: 106px;
  }
  .paperbet-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
    flex-wrap: wrap;
  }
  @media (max-width: 767.98px) {
    .open-paperbet-btn {
      min-width: 26px;
      height: 26px;
      margin-right: 6px;
      font-size: 10px;
    }
    .paperbet-widget {
      bottom: 12px;
      width: min(320px, calc(100vw - 20px));
      right: 0;
    }
    .paperbet-widget__panel {
      max-height: 52vh;
      border-radius: 16px 16px 0 0;
    }
    .paperbet-widget__head,
    .paperbet-widget__foot {
      padding: 10px 12px;
    }
    .paperbet-widget__body {
      padding: 8px;
    }
    .paperbet-widget__tab {
      min-width: 156px;
      font-size: 11px;
      min-height: 40px;
      padding: 9px 12px;
    }
    .paperbet-modal {
      width: min(100%, 100vw);
      padding: 18px 12px 14px;
    }
    .paperbet-board {
      padding: 8px;
    }
    .paperbet-layout {
      grid-template-columns: 1fr;
      gap: 2px;
    }
    .paperbet-row {
      grid-template-columns: repeat(3, 30px);
      gap: 2px;
    }
    .paperbet-cell {
      min-height: 26px;
      width: 30px;
      border-radius: 0;
      font-size: 10px;
    }
    .paperbet-zero {
      width: 94px;
    }
    .paperbet-toolbar .btn-reset {
      width: 100%;
    }
  }
   .modal-content h2 { font-family: 'Sora', sans-serif; font-size: 1.1rem; font-weight: 800; margin-bottom: 14px; }
   
   /* Stats modal */
   .modal-header { margin-bottom: 12px; }
   .modal-title { font-family: 'Sora', sans-serif; font-size: 1.05rem; font-weight: 800; }
   .lbl-piano { font-size: 12px; color: var(--text-muted); margin-top: 3px; }
   .modal-tabs {
     display: flex; gap: 2px; border-bottom: 1px solid var(--border-subtle);
     margin-bottom: 14px; overflow-x: auto; scrollbar-width: none;
   }
   .modal-tabs::-webkit-scrollbar { display: none; }
   .tab-button {
     padding: 8px 14px; font-size: 13px; font-weight: 600; color: var(--text-muted);
     background: none; border: none; border-bottom: 2px solid transparent;
     cursor: pointer; transition: all .2s; white-space: nowrap; font-family: inherit;
   }
   .tab-button:hover { color: var(--text-primary); }
   .tab-button.active { color: var(--brand-orange); border-bottom-color: var(--brand-orange); }
   .modal-body { font-size: 13px; color: var(--text-secondary); }
   .tab-content { display: none; }
   .tab-content.active { display: block; }
   
   /* Notifiche tabs */
   .tab-scroll-wrapper-noti { overflow-x: auto; scrollbar-width: none; flex: 0 0 auto; border-bottom: 1px solid var(--border-subtle); }
   .tab-scroll-wrapper-noti::-webkit-scrollbar { display: none; }
   .tab-container-not { display: flex; gap: 4px; padding: 10px 14px; min-width: max-content; }
   .tab-container-not .tab { padding: 6px 14px; font-size: 13px; }
   .tab-icon-crazy, .tab-icon-baccarat, .tab-icon-dream { width: 22px; height: 22px; object-fit: contain; }
   .sottotab-container { display: flex; gap: 4px; padding: 8px 0 4px; border-bottom: 1px solid var(--border-subtle); margin-bottom: 10px; }
   .sottotab { padding: 6px 14px; font-size: 13px; font-weight: 600; color: var(--text-muted); background: none; border: none; border-radius: var(--r-sm); cursor: pointer; transition: all .2s; font-family: inherit; }
   .sottotab:hover { color: var(--text-primary); background: var(--bg-elevated); }
   .sottotab.active { color: var(--brand-orange); background: rgba(249,115,22,.08); }
   .notifiche-tab { display: none; }
   .notifiche-tab.attiva { display: block; }
   .sottotab-content { display: none; }
   .sottotab-content.attiva { display: block; }
   
   /* Tavoli modal */
   .modal-content.tavoli-modal { max-height: 85vh; display: flex; flex-direction: column; }
   .tavoli-modal .tab-scroll-wrapper-noti { flex: 0 0 auto; }
   #contenutoTavoli.tavoli-scroll { flex: 1 1 auto; overflow-y: auto; padding-right: 4px; }
   #contenutoTavoli .tavoli-tab { display: none; }
   #contenutoTavoli .tavoli-tab.attiva { display: block; }
   #contenutoTavoli::-webkit-scrollbar { width: 5px; }
   #contenutoTavoli::-webkit-scrollbar-thumb { background: var(--bg-elevated); border-radius: 4px; }
   
   /* ===== LICENZE ===== */
   .modal-content.licenze-modal {
      position: relative;
      display: flex;
      flex-direction: column;
      width: min(1580px, 99vw);
      max-width: none;
      max-height: 92vh;
      padding: 24px 24px 20px;
      border-radius: 28px;
     background:
       radial-gradient(ellipse 45% 30% at 100% 0%, rgba(59,130,246,.15), transparent),
       radial-gradient(ellipse 35% 24% at 0% 0%, rgba(249,115,22,.12), transparent),
       linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
       var(--bg-card);
     border: 1px solid rgba(255,255,255,.10);
     box-shadow: var(--shadow-modal);
     overflow: hidden;
   }
   .licenze-modal h2 {
      margin: 0 44px 18px 6px;
      font-size: clamp(1.55rem, 2.3vw, 2.35rem);
      line-height: 1;
      letter-spacing: -.03em;
   }
   .licenze-scroll {
     flex: 1 1 auto;
     overflow-y: auto;
     padding-right: 8px;
     -webkit-overflow-scrolling: touch;
   }
   .licenze-scroll::-webkit-scrollbar { width: 6px; }
   .licenze-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,.14); border-radius: 999px; }
   #licenze-comparator { animation: fadeIn .18s ease; }
   @keyframes fadeIn { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }

   .plans-hero {
      display: flex;
      justify-content: flex-start;
      gap: 18px;
      align-items: flex-end;
      margin-bottom: 20px;
      padding: 18px 22px;
      border-radius: 22px;
     border: 1px solid rgba(255,255,255,.08);
     background:
       linear-gradient(135deg, rgba(59,130,246,.10), rgba(249,115,22,.08)),
       rgba(255,255,255,.02);
   }
   .plans-eyebrow {
     display: inline-block;
     margin-bottom: 8px;
     font-size: 11px;
     font-weight: 800;
     letter-spacing: .14em;
     text-transform: uppercase;
     color: rgba(240,244,255,.56);
   }
   .plans-hero p {
      max-width: 980px;
      font-size: 14px;
      line-height: 1.7;
      color: rgba(240,244,255,.68);
   }

   .plan-table-wrap {
      width: 100%;
      overflow-x: auto;
      border-radius: 24px;
      border: 1px solid rgba(255,255,255,.08);
      background: rgba(9,13,20,.72);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
   }
   .plan-table-wrap::-webkit-scrollbar { height: 7px; }
   .plan-table-wrap::-webkit-scrollbar-thumb { background: rgba(255,255,255,.12); border-radius: 999px; }
   .plan-table {
      width: 100%;
      min-width: 1240px;
      border-collapse: separate;
      border-spacing: 0;
      table-layout: fixed;
      background: transparent;
   }
   .plan-table thead th {
     position: sticky;
     top: 0;
     z-index: 1;
     background: rgba(20,27,41,.96);
      text-align: left;
      font-weight: 800;
      font-size: 13px;
      padding: 20px 18px 18px;
      letter-spacing: .02em;
      border-bottom: 1px solid rgba(255,255,255,.08);
   }
   .plan-table thead th:first-child { width: 40%; }
   .plan-table thead th:not(:first-child) { width: 20%; text-align: center; }
   .plan-table thead th.current-plan {
     background:
       linear-gradient(180deg, rgba(249,115,22,.09), rgba(249,115,22,.03)),
       rgba(20,27,41,.98);
   }
   .plan-table td {
      padding: 17px 18px;
      border-bottom: 1px solid rgba(255,255,255,.06);
      vertical-align: middle;
   }
   .plan-table tr:last-child td { border-bottom: 0; }
   .plan-table tbody tr:hover td { background: rgba(255,255,255,.018); }
   .plan-table tbody td:first-child {
      color: rgba(240,244,255,.74);
      font-weight: 700;
      font-size: 14px;
   }
   .plan-table tbody td:not(:first-child) {
     text-align: center;
   }
   .plan-badge {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     gap: 6px;
     padding: 7px 12px;
     border-radius: 999px;
      border: 1px solid rgba(255,255,255,.08);
      font-size: 12px;
      font-weight: 800;
     letter-spacing: .08em;
     text-transform: uppercase;
     background: rgba(255,255,255,.04);
     min-width: 92px;
   }
   .plan-free { color: #7dd3fc; border-color: rgba(125,211,252,.22); }
   .plan-base { color: #c4b5fd; border-color: rgba(167,139,250,.22); }
   .plan-pro  { color: var(--brand-amber); border-color: rgba(245,158,11,.22); }
   .price-pill {
      display: block;
      margin-top: 10px;
      font-size: 14px;
      font-weight: 700;
      color: var(--text-primary);
   }
   .yes, .no {
     display: inline-flex;
     align-items: center;
     justify-content: center;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      font-weight: 900;
      font-size: 14px;
     border: 1px solid var(--border-subtle);
     margin: 0 auto;
   }
   .yes { color: var(--ok); border-color: rgba(34,197,94,.18); background: rgba(34,197,94,.06); }
   .no  { color: var(--no); border-color: rgba(239,68,68,.18); background: rgba(239,68,68,.06); }
   .value { font-weight: 800; color: var(--text-primary); font-size: 14px; }
   .feat-note { color: var(--text-muted); font-size: 11px; margin-left: 3px; }

  .licenze-footer {
     display: flex;
     flex-direction: column;
     align-items: center;
      gap: 14px;
      margin-top: 20px;
      padding: 20px;
      border-radius: 24px;
     background:
       linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
       rgba(10,16,25,.72);
     border: 1px solid rgba(255,255,255,.08);
   }
   .plan-select {
     display: block;
      width: min(420px, 100%);
     margin: 0 auto 2px;
      height: 52px;
     padding: 0 44px 0 16px;
      font-size: 15px;
     font-weight: 700;
     color: var(--text-primary);
     background: var(--bg-elevated);
     border: 1px solid rgba(255,255,255,.10);
     border-radius: 14px;
     appearance: none;
     -webkit-appearance: none;
     cursor: pointer;
     background-image: url("data:image/svg+xml;utf8,<svg fill='%238b9bbf' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M7 10l5 5 5-5z'/></svg>");
     background-repeat: no-repeat;
     background-position: right 12px center;
     background-size: 16px;
     outline: none;
     transition: border-color .2s, box-shadow .2s;
     font-family: inherit;
   }
   .plan-select:focus {
     border-color: rgba(249,115,22,.38);
     box-shadow: 0 0 0 4px rgba(249,115,22,.10);
   }
   .plan-select option { background: var(--bg-card); color: var(--text-primary); }
   .btn-acquista {
     display: block;
      width: min(420px, 100%);
      padding: 15px 20px;
      font-size: 15px;
     font-weight: 800;
     letter-spacing: .04em;
     background: linear-gradient(135deg, var(--brand-orange), var(--brand-amber));
     color: #fff;
     border: none;
     border-radius: 14px;
     cursor: pointer;
     box-shadow: 0 8px 30px rgba(249,115,22,.26);
     text-align: center;
     box-sizing: border-box;
     margin: 0 auto;
     transition: all .2s var(--ease);
   }
   .btn-acquista:hover { filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 10px 32px rgba(249,115,22,.34); }
   .btn-acquista:active { transform: translateY(0); }
   .licenze-note {
     font-size: 12px;
     color: var(--text-muted);
     text-align: center;
     line-height: 1.55;
   }
   @media (max-width: 767.98px) {
      .modal-content.licenze-modal {
         width: 100%;
         border-radius: 22px;
         padding: 16px 12px 12px;
      }
      .plans-hero {
         flex-direction: column;
         align-items: flex-start;
         padding: 14px;
      }
      .plan-table {
         min-width: 760px;
      }
   }
   @media (max-width: 420px) {
     .plan-table thead th, .plan-table td { padding: 10px 8px; font-size: 11px; }
   }
   .plan-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--border-soft); background: var(--bg-elevated); color: var(--text-primary); font-size: 12px; font-weight: 700; cursor: pointer; transition: all .15s; }
   .plan-pill:hover { background: var(--bg-card-hover); }
   .plan-pill .dot { width: 7px; height: 7px; border-radius: 50%; }
   .plan-pill.free .dot { background: #7dd3fc; }
   .plan-pill.base .dot { background: #a78bfa; }
   .plan-pill.pro  .dot { background: var(--brand-amber); box-shadow: 0 0 6px rgba(245,158,11,.45); }
   .plan-current-label { display: inline-block; margin-left: 5px; font-size: .75em; color: var(--brand-blue); font-weight: 700; }
   
   /* Giorni picker */
   .giorni-picker { width: 100%; max-width: 380px; margin: 14px auto; text-align: center; color: var(--text-primary); }
   .giorni-picker label { display: block; font-weight: 600; margin-bottom: 10px; font-size: 14px; }
   .giorni-picker input[type="range"] { width: 100%; height: 5px; background: var(--bg-elevated); border-radius: 999px; outline: none; appearance: none; cursor: pointer; margin: 10px 0; }
   .giorni-picker input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--brand-orange); border: 2px solid #fff; transition: transform .2s; cursor: pointer; }
   .giorni-picker input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.12); }
   .price-summary { background: var(--bg-elevated); border-radius: var(--r-md); padding: 11px 14px; margin-top: 10px; font-size: 13px; border: 1px solid var(--border-subtle); }
   .price-summary div { display: flex; justify-content: space-between; align-items: center; padding: 2px 0; color: var(--text-secondary); }
   .price-summary strong { color: #4ade80; font-weight: 700; }
   
   /* Coupon */
   .coupon-box { margin-top: 12px; padding: 13px; border-radius: var(--r-md); background: var(--bg-elevated); border: 1px solid var(--border-soft); }
   .coupon-label { font-size: 13px; font-weight: 700; color: var(--text-primary); }
   .coupon-input-wrap { display: flex; gap: 8px; margin-top: 8px; }
   #couponInput { flex: 1; padding: 10px 12px; border-radius: var(--r-md); border: 1px solid var(--border-soft); background: var(--bg-card); color: var(--text-primary); font-size: 14px; font-family: inherit; outline: none; transition: border-color .2s; }
   #couponInput:focus { border-color: rgba(249,115,22,.4); }
   #couponInput::placeholder { color: var(--text-muted); }
   .btn-coupon { padding: 10px 14px; font-weight: 700; font-size: 13px; border-radius: var(--r-md); border: none; cursor: pointer; color: #fff; background: linear-gradient(135deg, var(--brand-orange), var(--brand-amber)); transition: all .2s; font-family: inherit; }
   .btn-coupon:hover { filter: brightness(1.08); transform: translateY(-1px); }
   .coupon-applied { color: #4ade80; font-weight: 700; font-size: 14px; margin-bottom: 4px; }
   .coupon-warning { margin-top: 8px; padding: 8px 10px; background: rgba(255,200,0,.05); border: 1px solid rgba(255,200,0,.18); color: #fbbf24; border-radius: var(--r-sm); font-size: 12px; font-weight: 600; }
   .coupon-timer { font-size: 12px; color: var(--text-muted); margin-top: 4px; }
   .price-old-wrapper { display: flex; justify-content: center; align-items: center; gap: 8px; margin-bottom: 8px; padding: 6px 10px; border-radius: var(--r-sm); background: rgba(239,68,68,.05); border: 1px solid rgba(239,68,68,.13); }
   .price-old { font-size: 14px; font-weight: 700; color: #ef4444; text-decoration: line-through; }
   .price-old-pill { font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px; background: rgba(239,68,68,.12); border: 1px solid rgba(239,68,68,.22); color: #fca5a5; }
   .price-discounted { display: flex; justify-content: center; gap: 6px; margin-top: 6px; padding: 6px 10px; border-radius: var(--r-sm); background: rgba(34,197,94,.05); border: 1px solid rgba(34,197,94,.13); }
   .price-discounted-label { font-weight: 700; color: #a7f3d0; font-size: 13px; }
   .price-discounted-value { font-size: 16px; font-weight: 800; color: #4ade80; }
   .payment-logo { margin-top: 8px; text-align: center; }
   .payment-logo img { width: 120px; max-width: 100%; opacity: .7; transition: opacity .2s; }
   .payment-logo img:hover { opacity: 1; }
   .payment-text { margin-top: 4px; font-size: 12px; color: var(--text-muted); }
   
   /* ===== LICENZE REDESIGN ===== */
   .modal-content.licenze-modal {
     width: min(1320px, 94vw);
     max-width: none;
     max-height: 88vh;
     padding: 26px 28px 22px;
     border-radius: 26px;
     background:
       radial-gradient(circle at top right, rgba(59,130,246,.12), transparent 28%),
       radial-gradient(circle at top left, rgba(249,115,22,.10), transparent 24%),
       linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)),
       var(--bg-card);
   }
   .licenze-modal h2 {
     margin: 0 44px 18px 2px;
     font-size: clamp(1.45rem, 2vw, 2rem);
     line-height: 1;
     letter-spacing: -.03em;
   }
   .licenze-scroll {
     padding-right: 2px;
   }
   .plans-shell {
     display: grid;
     gap: 18px;
   }
   .plan-overview-card--intro h3 {
     font-family: 'Sora', sans-serif;
     font-size: clamp(1.2rem, 1.6vw, 1.65rem);
     margin-bottom: 8px;
   }
   .plan-overview-card--intro p {
     max-width: 780px;
     font-size: 14px;
     line-height: 1.65;
     color: rgba(240,244,255,.68);
   }
   .plans-inline-summary {
     display: grid;
     gap: 8px;
     margin-top: 14px;
   }
   .plans-inline-summary span {
     font-size: 13px;
     line-height: 1.55;
     color: rgba(240,244,255,.74);
   }
   .plans-inline-summary strong {
     color: var(--text-primary);
   }
   .plans-overview-grid {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
     gap: 14px;
   }
   .plan-overview-card {
      padding: 18px;
      border-radius: 20px;
      border: 1px solid rgba(255,255,255,.08);
      background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
      min-height: 190px;
    }
   .plan-overview-card--intro {
     display: flex;
     flex-direction: column;
     justify-content: flex-start;
     gap: 0;
   }
   .plan-overview-card.is-current {
     border-color: rgba(249,115,22,.28);
     box-shadow: 0 0 0 1px rgba(249,115,22,.08) inset;
   }
   .plan-overview-head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 8px;
     margin-bottom: 18px;
   }
   .plan-current-chip {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     padding: 5px 9px;
     border-radius: 999px;
     font-size: 10px;
     font-weight: 800;
     letter-spacing: .08em;
     text-transform: uppercase;
     color: #fdba74;
     background: rgba(249,115,22,.10);
     border: 1px solid rgba(249,115,22,.24);
   }
   .plan-overview-price {
     font-family: 'Sora', sans-serif;
     font-size: clamp(1.3rem, 1.9vw, 1.8rem);
     line-height: 1;
     color: var(--text-primary);
     margin-bottom: 10px;
   }
   .plan-overview-copy {
     font-size: 13px;
     line-height: 1.6;
     color: rgba(240,244,255,.66);
     margin-bottom: 14px;
   }
   .plan-overview-points {
     display: flex;
     flex-wrap: wrap;
     gap: 8px;
   }
   .plan-overview-points span {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     padding: 7px 10px;
     border-radius: 999px;
     font-size: 11px;
     font-weight: 700;
     color: rgba(240,244,255,.76);
     background: rgba(255,255,255,.04);
     border: 1px solid rgba(255,255,255,.07);
   }
  .licenze-footer {
    display: grid;
    grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
    grid-template-areas:
      "pricing coupon"
      "pricing cta"
      "coupon cta"
      "note note";
     align-items: start;
    gap: 12px 14px;
    margin-top: 16px;
    padding: 14px 14px 16px;
    border-radius: 18px;
  }
  .licenze-footer .giorni-picker {
     grid-area: pricing;
     width: 100%;
     max-width: none;
     margin: 0;
     text-align: left;
    padding: 14px;
    border-radius: 16px;
     border: 1px solid rgba(255,255,255,.08);
     background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
   }
  .licenze-footer .plan-select-spotlight {
    margin-bottom: 12px;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(249,115,22,.18);
    background: linear-gradient(180deg, rgba(249,115,22,.12), rgba(249,115,22,.04));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  }
  .licenze-footer .plan-select-kicker {
    display: block;
    margin-bottom: 8px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fdba74;
  }
  .licenze-footer .plan-select {
    width: 100%;
    max-width: none;
    min-height: 46px;
    border-width: 1px;
    border-color: rgba(249,115,22,.24);
    background: rgba(8,12,20,.72);
    box-shadow: 0 0 0 1px rgba(255,255,255,.02);
  }
  .licenze-footer .giorni-picker label {
     display: flex;
     justify-content: space-between;
     align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 13px;
  }
  .licenze-footer #giorniVal {
     display: inline-flex;
     align-items: center;
     justify-content: center;
    min-width: 38px;
    padding: 5px 9px;
     border-radius: 999px;
     background: rgba(249,115,22,.12);
     border: 1px solid rgba(249,115,22,.22);
     color: #fdba74;
     font-weight: 800;
   }
  .licenze-footer .price-summary {
    margin-top: 10px;
    padding: 11px 12px;
    border-radius: 14px;
     background: rgba(8,12,20,.55);
     border: 1px solid rgba(255,255,255,.07);
   }
  .licenze-footer .price-summary div {
    padding: 4px 0;
    font-size: 12px;
  }
  .licenze-footer .price-summary strong {
    font-size: 14px;
  }
  .licenze-footer .coupon-box {
     grid-area: coupon;
     width: 100%;
     margin-top: 0;
    padding: 14px;
    border-radius: 16px;
     border: 1px solid rgba(255,255,255,.08);
     background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
   }
  .licenze-footer .coupon-label {
    display: block;
    margin-bottom: 8px;
    line-height: 1.5;
    font-size: 12px;
  }
  .licenze-footer .coupon-input-wrap {
    gap: 8px;
    margin-top: 0;
  }
  .licenze-footer #couponInput {
    min-height: 42px;
    border-radius: 12px;
  }
  .licenze-footer .btn-coupon {
    min-height: 42px;
    padding: 9px 14px;
    border-radius: 12px;
    white-space: nowrap;
  }
  .licenze-footer .btn-acquista {
     grid-area: cta;
     width: 100%;
     max-width: none;
    min-height: 48px;
    align-self: end;
    padding: 12px 18px;
    font-size: 14px;
  }
  .licenze-footer .licenze-note {
    grid-area: note;
    text-align: center;
    padding-top: 2px;
    font-size: 11px;
  }
   .plan-select,
   .btn-acquista {
     width: min(380px, 100%);
   }
   @media (max-width: 980px) {
     .modal-content.licenze-modal {
       width: min(1180px, 96vw);
       padding: 20px 18px 16px;
     }
     .plans-overview-grid {
       grid-template-columns: 1fr;
     }
   .licenze-footer {
      grid-template-columns: 1fr;
      grid-template-areas:
        "pricing"
        "coupon"
        "cta"
         "note";
     }
   }
   @media (max-width: 767.98px) {
     .modal-content.licenze-modal {
       width: 100%;
       max-height: 92vh;
       padding: 16px 12px 12px;
       border-radius: 20px;
     }
     .plans-intro,
     .licenze-footer {
       padding: 14px;
     }
     .plans-overview-grid {
       display: grid;
       grid-auto-flow: column;
       grid-auto-columns: minmax(248px, 84%);
       grid-template-columns: none;
       gap: 10px;
       overflow-x: auto;
       overscroll-behavior-x: contain;
       scroll-snap-type: x mandatory;
       -webkit-overflow-scrolling: touch;
       padding-bottom: 4px;
       scrollbar-width: none;
     }
     .plans-overview-grid::-webkit-scrollbar {
       display: none;
     }
     .plan-overview-card {
       min-height: 160px;
       padding: 14px;
       border-radius: 16px;
       scroll-snap-align: start;
       scroll-snap-stop: always;
     }
     .plan-overview-head {
       margin-bottom: 12px;
     }
     .plan-overview-price {
       margin-bottom: 8px;
       font-size: 1.35rem;
     }
     .plan-overview-copy {
       margin-bottom: 10px;
       font-size: 12px;
       line-height: 1.5;
     }
     .plan-overview-points {
       gap: 6px;
     }
     .plan-overview-points span {
       padding: 6px 8px;
       font-size: 10px;
     }
     .licenze-footer {
       gap: 8px;
       margin-top: 10px;
       padding: 8px;
       border-radius: 14px;
     }
     .licenze-footer .giorni-picker,
     .licenze-footer .coupon-box {
       padding: 8px;
       border-radius: 12px;
     }
     .licenze-footer .plan-select-spotlight {
       margin-bottom: 8px;
       padding: 8px;
       border-radius: 12px;
     }
     .licenze-footer .plan-select-kicker {
       margin-bottom: 4px;
       font-size: 10px;
     }
     .licenze-footer .plan-select,
     .licenze-footer #couponInput,
     .licenze-footer .btn-coupon {
       min-height: 34px;
       font-size: 12px;
     }
     .licenze-footer .btn-coupon {
       padding: 7px 10px;
     }
     .licenze-footer .giorni-picker label,
     .licenze-footer .coupon-label,
     .licenze-footer .price-summary div {
       font-size: 11px;
     }
     .licenze-footer .giorni-picker label {
       gap: 8px;
       margin-bottom: 8px;
     }
     .licenze-footer #giorniVal {
       min-width: 34px;
       padding: 4px 8px;
       font-size: 11px;
     }
     .licenze-footer input[type="range"] {
       margin: 6px 0 0;
     }
     .licenze-footer .price-summary {
       margin-top: 6px;
       padding: 8px 9px;
     }
     .licenze-footer .price-summary div {
       padding: 3px 0;
     }
     .licenze-footer .price-summary strong {
       font-size: 13px;
     }
     .licenze-footer .btn-acquista {
       min-height: 38px;
       padding: 8px 12px;
       font-size: 13px;
     }
     .licenze-footer .licenze-note {
       font-size: 10px;
     }
   }

   /* ===== POPUP FREE ===== */
   .popup-free-overlay { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.65); backdrop-filter: blur(4px); }
   .popup-free-overlay.hidden { display: none !important; }
   .popup-free-box { background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: var(--r-xl); padding: 26px 24px 22px; width: 92%; max-width: 420px; box-shadow: var(--shadow-modal); position: relative; animation: popupFreeFade .25s var(--ease); overflow: hidden; }
   .popup-free-box::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 50%; height: 1px; background: linear-gradient(90deg, transparent, var(--brand-orange), transparent); }
   @keyframes popupFreeFade { from{opacity:0;transform:scale(0.95)} to{opacity:1;transform:scale(1)} }
   .popup-free-close { position: absolute; top: 12px; right: 14px; background: none; border: none; color: var(--text-muted); font-size: 1.4rem; cursor: pointer; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 6px; transition: all .2s; }
   .popup-free-close:hover { background: var(--bg-elevated); color: var(--text-primary); }
   .popup-free-header { text-align: center; margin-bottom: 14px; }
   .popup-free-logo { display: block; height: auto; max-height: 34px; width: auto; max-width: 130px; margin: 0 auto 10px; object-fit: contain; }
   .popup-free-header h2 { font-family: 'Sora', sans-serif; font-size: 1.15rem; font-weight: 800; }
   .popup-free-body { font-size: 13px; line-height: 1.6; color: var(--text-secondary); }
   .popup-free-highlight { background: rgba(249,115,22,.05); border: 1px solid rgba(249,115,22,.13); border-radius: var(--r-md); padding: 12px 14px; margin-top: 12px; }
   .popup-free-highlight span { font-weight: 700; color: var(--brand-amber); }
   .popup-free-highlight ul { list-style: none; padding-left: 0; margin: 8px 0 0; }
   .popup-free-highlight li { padding: 2px 0; font-size: 13px; }
   .popup-free-highlight li::before { content: "✓ "; color: #4ade80; font-weight: 700; }
   .popup-free-footer { margin-top: 18px; text-align: center; display: flex; flex-direction: column; gap: 10px; }
   .popup-free-cta { font-size: 14px; font-weight: 700; background: linear-gradient(135deg, var(--brand-orange), var(--brand-amber)); border: none; color: #fff; padding: 12px; border-radius: var(--r-md); cursor: pointer; box-shadow: 0 4px 20px rgba(249,115,22,.28); transition: all .2s var(--ease); }
   .popup-free-cta:hover { filter: brightness(1.08); transform: translateY(-1px); }
   .popup-free-later { background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 13px; transition: color .2s; }
   .popup-free-later:hover { color: var(--text-primary); }
   
   /* ===== AI MODAL ===== */
   #aiModal { display: none; position: fixed; z-index: 9999; inset: 0; background: rgba(0,0,0,.75); backdrop-filter: blur(6px); }
   #aiModal:not(.hidden) { display: flex; align-items: center; justify-content: center; }
   .ai-modal { background: var(--bg-card); color: var(--text-primary); width: 92%; max-width: 540px; border-radius: var(--r-xl); padding: 22px; box-shadow: var(--shadow-modal); border: 1px solid var(--border-soft); max-height: 80vh; overflow-y: auto; position: relative; }
   .ai-modal h2 { font-family: 'Sora', sans-serif; font-size: 1.1rem; font-weight: 800; text-align: center; margin-bottom: 14px; }
   .ai-modal .close { position: absolute; top: 14px; right: 16px; font-size: 20px; cursor: pointer; color: var(--text-muted); width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 6px; transition: all .2s; }
   .ai-modal .close:hover { background: var(--bg-elevated); color: var(--text-primary); }
   .ai-tabs { display: flex; gap: 4px; margin-bottom: 14px; border-bottom: 1px solid var(--border-subtle); }
   .ai-tabs .tab-btn { flex: 1; padding: 9px; background: none; border: none; border-radius: 8px 8px 0 0; cursor: pointer; font-weight: 700; font-size: 13px; color: var(--text-muted); transition: all .15s; font-family: inherit; }
   .ai-tabs .tab-btn.active { color: var(--brand-blue); border-bottom: 2px solid var(--brand-blue); }
   .ai-tabs .tab-btn:hover { color: var(--text-primary); }
   .ai-tab-content { display: none; }
   .ai-tab-content.active, .ai-tab-content:not(.hidden) { display: block; }
   #aiResponseBox { margin-top: 14px; padding: 13px; border-radius: var(--r-md); font-size: 13px; line-height: 1.5; white-space: pre-line; color: var(--text-primary); background: var(--bg-elevated); border: 1px solid var(--border-subtle); }
   .ai-response { margin-top: 14px; padding: 13px; border-radius: var(--r-md); background: rgba(255,255,255,.04); border: 1px solid var(--border-subtle); animation: fadeIn .25s var(--ease); white-space: pre-line; font-size: 13px; line-height: 1.5; }
   .ai-response:empty { display: none; }
   .ai-action { display: flex; justify-content: center; align-items: center; gap: 12px; margin: 8px 0 6px; }
   .ai-action #btnRichiediAnalisi { all: unset; display: inline-flex; align-items: center; justify-content: center; gap: 8px; position: relative; isolation: isolate; padding: 11px 20px; border-radius: var(--r-md); background: var(--bg-elevated); color: var(--text-primary); font: 600 13px/1 'Plus Jakarta Sans', sans-serif; cursor: pointer; box-shadow: var(--shadow-card); transition: background .2s, transform .15s, box-shadow .2s; border: 1px solid var(--border-soft); }
   .ai-action #btnRichiediAnalisi::before { content: ""; position: absolute; inset: -2px; z-index: -1; border-radius: calc(var(--r-md) + 2px); background: linear-gradient(90deg, #6366f1, #ec4899, #f59e0b); filter: blur(14px); opacity: .45; transition: opacity .25s, filter .25s; }
   .ai-action #btnRichiediAnalisi:hover { background: var(--bg-card-hover); transform: translateY(-2px); }
   .ai-action #btnRichiediAnalisi:hover::before { opacity: .85; filter: blur(20px); }
   .ai-action #btnRichiediAnalisi:disabled { opacity: .5; cursor: not-allowed; }
   .ai-arrow { display: inline-block; vertical-align: middle; stroke: #fff; stroke-width: 2; }
   .ai-arrow path:first-child { opacity: 0; transition: opacity .2s; }
   .ai-action #btnRichiediAnalisi:hover .ai-arrow path:first-child { opacity: 1; }
   .ai-spinner { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 12px; }
   .ai-spinner.hidden { display: none; }
   .ai-spinner .spinner-text { color: var(--text-secondary); font-size: 13px; }
   .ai-spinner .ring { width: 26px; height: 26px; border-radius: 50%; border: 2px solid rgba(255,255,255,.1); border-top-color: var(--brand-blue); animation: ai-spin .9s linear infinite; }
   @keyframes ai-spin { to { transform: rotate(360deg); } }
   #aiStoricoList { list-style: none; padding: 0; }
   #aiStoricoList li { border-bottom: 1px solid var(--border-subtle); }
   #aiStoricoList li:last-child { border-bottom: none; }
   .ai-accordion-header { padding: 10px; font-size: 13px; font-weight: 600; border-radius: var(--r-sm); cursor: pointer; display: flex; justify-content: space-between; align-items: center; background: rgba(255,255,255,.04); transition: background .2s; color: var(--text-primary); }
   .ai-accordion-header:hover { background: var(--bg-elevated); }
   .ai-accordion-icon { font-size: 11px; transition: transform .2s; }
   .ai-accordion-header.active .ai-accordion-icon { transform: rotate(90deg); }
   .ai-accordion-content { max-height: 0; overflow: hidden; transition: max-height .3s ease; padding: 0 10px; }
   .ai-accordion-content.open { padding: 10px; max-height: 200px; overflow-y: auto; font-size: 13px; line-height: 1.5; white-space: pre-line; color: var(--text-secondary); }
   .open-ai-btn { width: 22px; height: 22px; margin-right: 8px; cursor: pointer; filter: invert(1); opacity: .7; transition: all .2s; }
   .open-ai-btn:hover { opacity: 1; transform: scale(1.1); }
   
   /* ===== CREDITI ===== */
   .crediti-body { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 12px; }
   .crediti-desc { color: var(--text-secondary); font-size: 13px; text-align: center; line-height: 1.5; }
   .modal-divider { width: 100%; height: 1px; margin: 12px 0 14px; border: none; background: var(--border-subtle); }
   .crediti-value { font-size: 1.05rem; font-weight: 700; color: var(--text-primary); }
   #creditiRange { width: 80%; max-width: 290px; -webkit-appearance: none; height: 5px; background: var(--bg-elevated); border-radius: 999px; cursor: pointer; outline: none; }
   #creditiRange::-webkit-slider-thumb { -webkit-appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--brand-blue); border: 2px solid #fff; transition: transform .15s; cursor: pointer; }
   #creditiRange::-webkit-slider-thumb:hover { transform: scale(1.1); }
   .crediti-table { margin-top: 10px; width: 100%; max-width: 290px; border: 1px solid var(--border-soft); border-radius: var(--r-md); overflow: hidden; font-size: 12px; }
   .crediti-table table { width: 100%; border-collapse: collapse; }
   .crediti-table th, .crediti-table td { padding: 8px 10px; text-align: center; }
   .crediti-table th { background: var(--bg-elevated); font-weight: 700; color: var(--text-primary); font-size: 11px; }
   .crediti-table td { color: var(--text-secondary); }
   .crediti-table tr:nth-child(even) td { background: rgba(255,255,255,.025); }
   .crediti-modal { max-width: 440px; }
   #noCreditsToast { position: fixed; bottom: 20px; right: 20px; background: #b91c1c; color: #fff; padding: 11px 14px; border-radius: var(--r-md); font-size: 13px; display: flex; align-items: center; gap: 10px; box-shadow: var(--shadow-card); z-index: 10000; opacity: 0; transform: translateY(20px); transition: opacity .3s, transform .3s; }
   #noCreditsToast.show { opacity: 1; transform: translateY(0); }
   #noCreditsToast .toast-btn { background: #fff; color: #b91c1c; border: none; padding: 5px 9px; border-radius: 4px; font-weight: 700; cursor: pointer; font-size: 12px; }
   #noCreditsToast .toast-close { cursor: pointer; margin-left: auto; font-size: 16px; }
   
   /* ===== GAME TYPES ===== */
   .simboli { display: flex; flex-wrap: wrap; gap: 5px; padding: 4px; justify-content: center; align-items: center; }
   .simbolo-svg { width: 26px; height: 26px; object-fit: contain; }
   .card-bottom-bar.baccarat-scroll { overflow-x: auto; justify-content: flex-start; scrollbar-width: thin; scrollbar-color: #333 transparent; }
   .card-bottom-bar.baccarat-scroll::-webkit-scrollbar { height: 4px; }
   .card-bottom-bar.baccarat-scroll::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
   .baccarat-board { display: inline-grid; }
   .switch { position: relative; display: inline-block; width: 40px; height: 22px; }
   .switch input { opacity: 0; width: 0; height: 0; }
   .switch .slider { position: absolute; inset: 0; cursor: pointer; background: var(--bg-elevated); border: 1px solid var(--border-soft); transition: .2s; border-radius: 999px; }
   .switch .slider:before { content: ""; position: absolute; height: 16px; width: 16px; left: 2px; top: 2px; background: var(--text-muted); transition: .2s; border-radius: 50%; }
   .switch input:checked + .slider { background: #16a34a; border-color: #16a34a; }
   .switch input:checked + .slider:before { background: #fff; transform: translateX(18px); }
   .simboli-dream { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
   .simboli-dream .dc-chip { display: inline-flex; align-items: center; justify-content: center; padding: 2px 8px; min-width: 26px; height: 19px; border-radius: 999px; font: 600 10px/1 'Plus Jakarta Sans', sans-serif; transition: transform .15s; }
   .simboli-dream .dc-chip:hover { transform: scale(1.08); }
   .simboli-dream .dc-1  { color: #ffc94b; border: 1px solid #ffc94b; background: rgba(255,201,75,.15); }
   .simboli-dream .dc-2  { color: #6298ff; border: 1px solid #6298ff; background: rgba(98,152,255,.15); }
   .simboli-dream .dc-5  { color: #cc85ff; border: 1px solid #cc85ff; background: rgba(204,133,255,.15); }
   .simboli-dream .dc-10 { color: #59e777; border: 1px solid #59e777; background: rgba(89,231,119,.15); }
   .simboli-dream .dc-20 { color: #ee7340; border: 1px solid #ee7340; background: rgba(238,115,64,.15); }
   .simboli-dream .dc-40 { color: #e53935; border: 1px solid #e53935; background: rgba(229,57,53,.15); }
   .simboli-dream .dc-x2, .simboli-dream .dc-x7 { color: #ffd700; border: 1px solid #ffd700; background: rgba(180,140,0,.18); }
   .simboli-colorgame { display: flex; gap: 7px; align-items: flex-end; justify-content: center; padding: 4px 6px; min-height: 50px; }
   .cg-col { display: flex; flex-direction: column; gap: 3px; }
   .cg-cube { width: 13px; height: 13px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,0,.3) inset; }
   .cg-red{background:#e53935} .cg-pink{background:#ff6ec7} .cg-yellow{background:#f6c945}
   .cg-blue{background:#6298ff} .cg-lue{background:#6298ff} .cg-white{background:#eaeaea} .cg-green{background:#2ecc71}
   .tab-icon-aviator { height: 20px; width: auto; object-fit: contain; }
   .aviator-pills { display: flex; gap: 5px; flex-wrap: wrap; align-items: center; min-height: 28px; }
   .aviator-pill { display: inline-block; padding: 5px 9px; border-radius: var(--r-sm); font-weight: 600; font-size: 11px; line-height: 1; white-space: nowrap; background: rgba(255,255,255,.06); color: var(--text-secondary); border: 1px solid transparent; }
   .aviator-pill.band0 { background: rgba(255,255,255,.06); color: #d6d6d6; border-color: rgba(255,255,255,.1); }
   .aviator-pill.band1 { background: #1f3d2e; color: #8ff0a4; border-color: #2c6e49; }
   .aviator-pill.band2 { background: #203a43; color: #7fd3ff; border-color: #2a7aa5; }
   .aviator-pill.band3 { background: #3a2a43; color: #d6a6ff; border-color: #7f4aa1; }
   .aviator-pill.band4 { background: #43321f; color: #ffcf7f; border-color: #a56f2a; }
   .aviator-pill.band5 { background: #4a1f1f; color: #ff8f8f; border-color: #a52a2a; }
   .aviator-footer-stats .avi-med { padding: 2px 6px; border-radius: var(--r-sm); background: rgba(255,255,255,.07); line-height: 1.8; }
   
   /* ===== BOOKMAKERS ===== */
   .th-modal { display: none; position: fixed; inset: 0; z-index: 9998; background: rgba(0,0,0,.8); backdrop-filter: blur(6px); align-items: flex-end; }
   .th-modal[open], .th-modal:not([hidden]) { display: flex; align-items: flex-end; }
   .th-dialog { position: relative; background: var(--bg-card); border-top: 1px solid var(--border-soft); border-radius: var(--r-xl) var(--r-xl) 0 0; padding: 16px 16px 28px; width: 100%; max-height: 85vh; overflow-y: auto; box-shadow: 0 -8px 40px rgba(0,0,0,.5); animation: slideUp .3s var(--ease); }
   @keyframes slideUp { from{transform:translateY(20px);opacity:0} to{transform:translateY(0);opacity:1} }
   .th-close { position: absolute; top: 14px; right: 16px; background: var(--bg-elevated); border: 1px solid var(--border-soft); border-radius: 6px; color: var(--text-muted); font-size: 18px; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .2s; }
   .th-close:hover { background: var(--bg-card-hover); color: var(--text-primary); }
   .th-tabs { display: flex; gap: 2px; margin-bottom: 14px; border-bottom: 1px solid var(--border-subtle); overflow-x: auto; scrollbar-width: none; }
   .th-tabs::-webkit-scrollbar { display: none; }
   .th-tab { display: flex; align-items: center; gap: 6px; padding: 8px 14px; background: none; border: none; font-size: 13px; font-weight: 600; color: var(--text-muted); cursor: pointer; white-space: nowrap; border-bottom: 2px solid transparent; transition: all .2s; font-family: inherit; }
   .th-tab[aria-selected="true"] { color: var(--brand-orange); border-bottom-color: var(--brand-orange); }
   .th-tab:hover { color: var(--text-primary); }
   .th-flag { display: inline-block; width: 20px; height: 14px; border-radius: 2px; }
   .th-flag.it { background: linear-gradient(90deg, #009246 33%, #fff 33% 66%, #ce2b37 66%); }
   .th-flag.es { background: linear-gradient(180deg, #AA151B 25%, #F1BF00 25% 75%, #AA151B 75%); }
   .th-flag.de { background: linear-gradient(180deg, #000 33%, #D00 33% 66%, #FFCE00 66%); }
   .th-flag.gb { background: linear-gradient(135deg, #012169 45%, #C8102E 45%); }
   .th-title { font-family: 'Sora', sans-serif; font-size: 1.2rem; font-weight: 800; margin-bottom: 4px; }
   .th-disclaimer { font-size: 11px; color: var(--text-muted); margin-bottom: 14px; }
   .th-list { display: flex; flex-direction: column; gap: 10px; }
   .th-card { background: var(--bg-elevated); border: 1px solid var(--border-subtle); border-radius: var(--r-lg); overflow: hidden; transition: border-color .2s, transform .2s; }
   .th-card:hover { border-color: var(--border-soft); transform: translateY(-1px); }
   .th-card-top { display: flex; gap: 12px; padding: 13px; align-items: flex-start; flex-wrap: wrap; }
   .th-logo { width: 75px; flex-shrink: 0; }
   .th-logo img { width: 75px; height: 46px; object-fit: contain; border-radius: var(--r-sm); }
   .th-info { flex: 1; min-width: 110px; }
   .th-info h3 { font-weight: 800; font-size: 14px; margin-bottom: 5px; }
   .th-chips { display: flex; flex-wrap: wrap; gap: 3px; }
   .th-chip { padding: 2px 7px; background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: 999px; font-size: 10px; font-weight: 600; color: var(--text-muted); }
   .th-badge { display: inline-block; margin-left: 5px; padding: 2px 6px; font-size: 10px; font-weight: 800; background: rgba(249,115,22,.12); color: var(--brand-orange); border-radius: 999px; vertical-align: middle; }
   .th-bonus { font-size: 12px; color: var(--text-secondary); margin-top: 7px; flex-basis: 100%; }
   .th-bonus strong { color: var(--text-primary); font-weight: 700; }
   .th-bonus small { color: var(--text-muted); font-size: 11px; display: block; margin-top: 2px; }
   .th-rating-cta { display: flex; flex-direction: column; align-items: flex-end; gap: 7px; flex-shrink: 0; }
   .th-score { text-align: center; }
   .th-stars { position: relative; display: inline-block; }
   .th-stars-track, .th-stars-fill { display: flex; gap: 1px; }
   .th-stars-fill { position: absolute; top: 0; left: 0; overflow: hidden; width: calc(var(--rating, 0) / 5 * 100%); }
   .th-stars-track svg { color: var(--bg-elevated); }
   .th-stars-fill svg { color: var(--brand-amber); }
   .th-num { font-size: 11px; font-weight: 700; color: var(--text-primary); margin-top: 2px; }
   .th-votes { font-size: 10px; color: var(--text-muted); }
   .th-cta a.th-btn { display: inline-block; padding: 8px 16px; background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; font-weight: 800; font-size: 12px; border-radius: var(--r-md); transition: all .2s; letter-spacing: .4px; }
   .th-cta a.th-btn:hover { filter: brightness(1.1); transform: translateY(-1px); }
   .th-card details { border-top: 1px solid var(--border-subtle); }
   .th-card details summary { padding: 9px 13px; font-size: 12px; font-weight: 600; color: var(--text-muted); cursor: pointer; transition: color .2s; }
   .th-card details summary:hover { color: var(--text-primary); }
   .th-more { padding: 10px 13px; }
   .th-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
   .th-kblock h4 { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; color: var(--text-muted); margin-bottom: 5px; }
   .th-kblock ul { list-style: none; }
   .th-kblock li { font-size: 12px; color: var(--text-secondary); padding: 2px 0; }
   .th-kblock li::before { content: "• "; color: var(--brand-orange); }
   .th-term { font-size: 11px; color: var(--text-muted); }
   .th-compare { display: none; }
   .th-compare:not([hidden]):not([style*="none"]) { display: block; }
   @media (max-width: 600px) { .th-card-top { gap: 8px; } .th-logo { width: 60px; } .th-logo img { width: 60px; height: 38px; } }
   
   /* ===== TOAST ===== */
   .th-toast { position: fixed; left: 50%; top: 20px; transform: translateX(-50%); background: var(--bg-card); color: var(--text-primary); padding: 10px 16px; border-radius: var(--r-md); border: 1px solid var(--border-soft); box-shadow: var(--shadow-modal); font-size: 13px; font-weight: 600; z-index: 9999; opacity: 0; transition: opacity .15s; pointer-events: none; }
   .th-toast.show { opacity: 1; }
   #toastContainer { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); z-index: 9999; }
   
   /* ===== PLAN VEIL ===== */
   .th-card--locked .th-card__media img { filter: blur(2px) grayscale(1) brightness(.7); transform: scale(1.02); }
   .th-card--locked .th-card__numbers, .th-obfuscated { filter: blur(4px); opacity: .5; user-select: none; }
   .th-card__veil { position: absolute; inset: 0; display: grid; place-items: center; background: linear-gradient(to bottom, rgba(8,12,20,.1), rgba(8,12,20,.65)); pointer-events: none; text-align: center; padding: 10px; gap: 8px; }
   .th-pill { display: inline-block; padding: 5px 12px; border-radius: 999px; background: var(--brand-amber); color: #111; font-weight: 800; font-size: 11px; letter-spacing: .05em; }
   .th-note { color: #fff; font-weight: 600; margin: 0; font-size: 12px; }
   .th-cta-card { pointer-events: all; border: none; border-radius: var(--r-md); padding: 9px 14px; font-weight: 700; font-size: 12px; cursor: pointer; background: var(--brand-blue); color: white; }
   .th-cta-card:hover { filter: brightness(1.06); }
   
   /* ===== MISC ===== */
   .solo-loggati { display: none; }
   .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px; padding: 10px; }
   .card { background: var(--bg-card); border-radius: var(--r-md); padding: 10px; border: 1px solid var(--border-subtle); }
   #sponsor-bottom { padding: 4px 16px; min-height: 0; }
   
   ::-webkit-scrollbar { width: 5px; height: 5px; }
   ::-webkit-scrollbar-track { background: transparent; }
   ::-webkit-scrollbar-thumb { background: var(--bg-elevated); border-radius: 4px; }
   ::-webkit-scrollbar-thumb:hover { background: var(--border-soft); }