/* fourdigits operator console — the design system from the adminUI mock-ups.
 *
 * Ported from the uploaded screens, which are the source of truth for how this
 * console looks. Two things changed on the way in, and only these two:
 *
 *   - The font is self-hosted rather than fetched from Google. The console's
 *     Content-Security-Policy names no external origin at all, so a webfont
 *     from another host does not load and every screen silently falls back to
 *     the system sans — which is the one difference nobody notices in review
 *     and everybody notices in use.
 *   - The `.fd-` prefix is kept exactly as designed. It sits beside the
 *     player app's `.ld-` system rather than merging with it: the two are
 *     different products for different people, and a shared class that has to
 *     satisfy both ends up satisfying neither.
 *
 * Everything else below is as drawn.
 */

@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;src:url('/brand/fonts/plus-jakarta-sans-400.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:500;font-display:swap;src:url('/brand/fonts/plus-jakarta-sans-500.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;src:url('/brand/fonts/plus-jakarta-sans-600.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:700;font-display:swap;src:url('/brand/fonts/plus-jakarta-sans-700.woff2') format('woff2')}
@font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:800;font-display:swap;src:url('/brand/fonts/plus-jakarta-sans-800.woff2') format('woff2')}

:root{
    --fd-bg:#F8FAFC; --fd-surface:#FFFFFF; --fd-hover:#F1F5F9;
    --fd-ink:#0F172A; --fd-ink-2:#334155; --fd-muted:#64748B; --fd-faint:#94A3B8;
    --fd-line:#E2E8F0; --fd-line-2:#EEF2F7;
    --fd-indigo:#4F46E5; --fd-indigo-700:#4338CA; --fd-indigo-50:#EEF2FF; --fd-indigo-100:#E0E7FF; --fd-indigo-200:#C7D2FE;
    --fd-midnight:#1E1B4B; --fd-lavender:#A5B4FC; --fd-menu-text:#C7D2FE; --fd-menu-active:#6366F1;
    --fd-emerald:#059669; --fd-emerald-bg:#ECFDF5; --fd-emerald-ink:#047857; --fd-emerald-line:#A7F3D0;
    --fd-amber:#F59E0B; --fd-amber-bg:#FFFBEB; --fd-amber-ink:#B45309; --fd-amber-line:#FDE68A;
    --fd-rose:#E11D48; --fd-rose-bg:#FFF1F2; --fd-rose-ink:#BE123C; --fd-rose-line:#FECDD3;
    --fd-sky:#0284C7; --fd-sky-bg:#F0F9FF; --fd-sky-ink:#0369A1; --fd-sky-line:#BAE6FD;
    --fd-t1:#C0261A; --fd-t2:#A16207; --fd-t3:#7E22CE;
    --fd-sb-w:256px; --fd-sb-w-collapsed:72px; --fd-tb-h:60px;
  }
  *,*::before,*::after{box-sizing:border-box}
  html,body{margin:0}
  body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:14px;line-height:1.5;color:var(--fd-ink);background:var(--fd-bg);-webkit-font-smoothing:antialiased}
  html.fd-is-locked{overflow:hidden}
  button,input,select,textarea{font:inherit;color:inherit}
  a{color:inherit}
  :focus-visible{outline:2px solid var(--fd-indigo);outline-offset:2px}
  [hidden]{display:none !important}
  .fd-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .fd-ico{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .fd-ico-sm{width:16px;height:16px}
  .fd-num{font-variant-numeric:tabular-nums}

  /* App layout */
  .fd-app{min-height:100vh}
  .fd-sb{position:fixed;inset:0 auto 0 0;z-index:40;width:var(--fd-sb-w);display:flex;flex-direction:column;background:var(--fd-midnight);color:var(--fd-menu-text);transition:width .2s ease}
  .fd-sb-head{height:var(--fd-tb-h);display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 14px 0 18px;border-bottom:1px solid rgba(255,255,255,.1)}
  .fd-brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
  .fd-brand-full{display:block;height:28px;width:auto}
  .fd-brand-mark{display:none;width:32px;height:32px}
  .fd-brand-tag{padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
  .fd-sb .fd-sb-close{display:none}
  .fd-nav{flex:1;overflow-y:auto;padding:10px 10px 16px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}
  .fd-nav-label{padding:14px 10px 6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fd-lavender)}
  .fd-nav-link{display:flex;align-items:center;gap:12px;height:38px;padding:0 10px;border-radius:9px;color:var(--fd-menu-text);font-size:13.5px;font-weight:600;text-decoration:none;white-space:nowrap}
  .fd-nav-link:hover{background:rgba(255,255,255,.08);color:#fff}
  .fd-nav-link.fd-is-active{background:var(--fd-menu-active);color:#fff}
  .fd-nav-link.fd-is-soon{color:rgba(199,210,254,.7)}
  .fd-nav-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
  .fd-nav-badge{min-width:22px;height:20px;padding:0 7px;border-radius:999px;display:grid;place-items:center;background:rgba(253,230,138,.18);color:#FDE68A;font-size:11.5px;font-weight:700}
  .fd-nav-soon{font-size:10.5px;font-weight:600;color:var(--fd-lavender);opacity:.8}
  .fd-sb-foot{padding:12px 18px;border-top:1px solid rgba(255,255,255,.1);font-size:12px;color:var(--fd-lavender);display:flex;align-items:center;gap:8px}
  .fd-env{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;border-radius:999px;background:rgba(110,231,183,.14);color:#6EE7B7;font-weight:700}
  .fd-env::before{content:"";width:6px;height:6px;border-radius:50%;background:#6EE7B7}
  .fd-sb :focus-visible{outline-color:#fff}
  .fd-main{margin-left:var(--fd-sb-w);min-width:0;transition:margin-left .2s ease}
  .fd-tb{position:sticky;top:0;z-index:30;height:var(--fd-tb-h);display:flex;align-items:center;gap:12px;padding:0 24px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--fd-line)}
  .fd-tb-title{min-width:0;display:flex;align-items:center;gap:8px;font-size:14px;white-space:nowrap}
  .fd-tb-crumb{color:var(--fd-muted)}
  .fd-tb-page{font-weight:700;overflow:hidden;text-overflow:ellipsis}
  .fd-tb-right{margin-left:auto;display:flex;align-items:center;gap:10px}
  .fd-search{position:relative;width:260px}
  .fd-search .fd-ico{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--fd-faint);pointer-events:none}
  .fd-search input{width:100%;height:38px;padding:0 12px 0 34px;border:1px solid var(--fd-line);border-radius:10px;background:var(--fd-bg);font-size:13.5px}
  .fd-search input:focus{outline:none;border-color:var(--fd-indigo);box-shadow:0 0 0 3px var(--fd-indigo-100);background:#fff}
  .fd-draw-chip{display:flex;align-items:center;gap:10px;height:40px;padding:0 12px;border:1px solid var(--fd-line);border-radius:10px;background:#fff;text-decoration:none;white-space:nowrap}
  .fd-draw-chip-dot{width:8px;height:8px;border-radius:50%;background:var(--fd-emerald);box-shadow:0 0 0 3px var(--fd-emerald-bg)}
  .fd-draw-chip-label{font-size:11px;color:var(--fd-muted);line-height:1.2}
  .fd-draw-chip-time{font-size:13.5px;font-weight:700;line-height:1.2}
  .fd-icon-btn{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:10px;background:transparent;color:var(--fd-ink-2);cursor:pointer;position:relative}
  .fd-icon-btn:hover{background:var(--fd-hover)}
  .fd-bell-count{position:absolute;top:5px;right:5px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--fd-rose);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}
  .fd-me{display:flex;align-items:center;gap:10px;height:42px;padding:0 8px 0 4px;border:0;border-radius:10px;background:transparent;cursor:pointer;text-align:left}
  .fd-me:hover{background:var(--fd-hover)}
  .fd-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--fd-indigo-100);color:var(--fd-indigo-700);font-size:12.5px;font-weight:800;flex-shrink:0}
  .fd-me-name{font-size:13px;font-weight:700;line-height:1.2}
  .fd-me-role{font-size:11.5px;color:var(--fd-muted);line-height:1.2}
  .fd-dd-anchor{position:relative}
  .fd-dd{position:absolute;top:calc(100% + 8px);right:0;z-index:50;min-width:240px;padding:6px;border:1px solid var(--fd-line);border-radius:14px;background:#fff;box-shadow:0 16px 40px -12px rgba(15,23,42,.25)}
  .fd-dd-head{padding:10px 10px 8px;border-bottom:1px solid var(--fd-line-2);margin-bottom:6px}
  .fd-dd-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;border-radius:8px;background:none;color:var(--fd-ink-2);font-size:13.5px;font-weight:500;text-align:left;text-decoration:none;cursor:pointer}
  .fd-dd-item:hover{background:var(--fd-hover);color:var(--fd-ink)}
  .fd-dd-item.fd-is-danger{color:var(--fd-rose-ink)}
  .fd-content{padding:24px 24px 48px;max-width:1440px;margin-inline:auto}
  /* Every section on a screen stands 16px clear of the one before it. The
     mock-ups spaced each page with wrappers of their own, and a screen built
     without them ran its panels together edge to edge. Sibling margins
     collapse, so a larger gap a screen already sets is kept, not added to. */
  .fd-content > * + *{margin-top:16px}
  /* The top bar lines up with the centred column beneath it: its menu button
     over the page title's left edge, its account menu over the content's right.
     Padding percentages resolve against .fd-main, the same width the content is
     centred in. Below 960px the narrow rule further down takes over. */
  .fd-tb{padding-inline:max(24px, calc((100% - 1440px) / 2 + 24px))}
  .fd-loading{display:flex;justify-content:center;padding:48px 20px}
  .fd-scrim{position:fixed;inset:0;z-index:35;background:rgba(15,23,42,.45)}

  /* Collapsed rail */
  @media (min-width:961px){
    .fd-app.fd-is-collapsed .fd-sb{width:var(--fd-sb-w-collapsed)}
    .fd-app.fd-is-collapsed .fd-main{margin-left:var(--fd-sb-w-collapsed)}
    .fd-app.fd-is-collapsed .fd-brand-full,.fd-app.fd-is-collapsed .fd-brand-tag,.fd-app.fd-is-collapsed .fd-nav-text,.fd-app.fd-is-collapsed .fd-nav-badge,.fd-app.fd-is-collapsed .fd-nav-soon,.fd-app.fd-is-collapsed .fd-sb-foot span:not(.fd-env){display:none}
    .fd-app.fd-is-collapsed .fd-brand-mark{display:block}
    .fd-app.fd-is-collapsed .fd-sb-head{justify-content:center;padding:0}
    .fd-app.fd-is-collapsed .fd-nav-label{height:1px;padding:0;margin:12px 10px;overflow:hidden;color:transparent;background:rgba(255,255,255,.1)}
    .fd-app.fd-is-collapsed .fd-nav-link{justify-content:center;padding:0}
    .fd-app.fd-is-collapsed .fd-sb-foot{justify-content:center;padding:12px 0}
    .fd-app.fd-is-collapsed .fd-env{font-size:0;padding:4px}
    .fd-app.fd-is-collapsed .fd-env::before{margin:0}
  }

  /* Page head */
  .fd-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}
  .fd-page-title{margin:0;font-size:24px;font-weight:800;letter-spacing:-.02em}
  .fd-page-title:focus{outline:none}
  .fd-page-sub{margin:4px 0 0;color:var(--fd-muted);font-size:14px}
  .fd-page-actions{display:flex;gap:10px;flex-wrap:wrap}

  /* Buttons */
  .fd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border:1px solid transparent;border-radius:10px;font-size:14px;font-weight:600;white-space:nowrap;text-decoration:none;cursor:pointer;transition:background-color .15s,border-color .15s}
  .fd-btn:disabled{opacity:.5;cursor:not-allowed}
  .fd-btn-primary{background:var(--fd-indigo);color:#fff}
  .fd-btn-primary:hover:not(:disabled){background:var(--fd-indigo-700)}
  .fd-btn-secondary{background:#fff;border-color:var(--fd-line);color:var(--fd-ink-2)}
  .fd-btn-secondary:hover:not(:disabled){background:var(--fd-hover);color:var(--fd-ink)}
  .fd-btn-danger{background:var(--fd-rose);color:#fff}
  .fd-btn-danger:hover:not(:disabled){background:var(--fd-rose-ink)}
  .fd-btn-danger-ghost{background:#fff;border-color:var(--fd-rose-line);color:var(--fd-rose-ink)}
  .fd-btn-danger-ghost:hover:not(:disabled){background:var(--fd-rose-bg)}
  .fd-btn-success{background:var(--fd-emerald);color:#fff}
  .fd-btn-success:hover:not(:disabled){background:var(--fd-emerald-ink)}
  .fd-btn-sm{height:32px;padding:0 12px;font-size:13px;border-radius:8px}
  .fd-btn-lg{height:46px;padding:0 20px;font-size:15px}
  .fd-btn-block{width:100%}
  .fd-link{border:0;background:none;padding:0;color:var(--fd-indigo);font-weight:600;text-decoration:none;cursor:pointer}
  .fd-link:hover{text-decoration:underline}

  /* Panels */
  .fd-panel{background:#fff;border:1px solid var(--fd-line);border-radius:14px}
  .fd-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid var(--fd-line-2)}
  .fd-panel-title{margin:0;font-size:15px;font-weight:700}
  .fd-panel-sub{margin:2px 0 0;font-size:12.5px;color:var(--fd-muted)}
  .fd-panel-body{padding:18px}
  .fd-grid{display:grid;gap:16px}
  .fd-stack{display:flex;flex-direction:column;gap:16px;min-width:0}

  /* Stat tiles */
  .fd-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
  .fd-stat{padding:14px 16px;background:#fff;border:1px solid var(--fd-line);border-radius:14px;min-width:0}
  .fd-stat-label{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--fd-muted)}
  .fd-stat-value{margin-top:6px;font-size:24px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fd-stat-value small{font-size:13px;font-weight:700;color:var(--fd-muted);margin-left:3px}
  .fd-stat-foot{margin-top:2px;font-size:12.5px;color:var(--fd-muted)}
  .fd-trend-up{color:var(--fd-emerald-ink);font-weight:700}
  .fd-trend-down{color:var(--fd-rose-ink);font-weight:700}

  /* Status pills */
  .fd-pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;border:1px solid transparent}
  .fd-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
  .fd-pill-neutral{background:var(--fd-hover);color:var(--fd-ink-2);border-color:var(--fd-line)}
  .fd-pill-info{background:var(--fd-sky-bg);color:var(--fd-sky-ink);border-color:var(--fd-sky-line)}
  .fd-pill-success{background:var(--fd-emerald-bg);color:var(--fd-emerald-ink);border-color:var(--fd-emerald-line)}
  .fd-pill-warning{background:var(--fd-amber-bg);color:var(--fd-amber-ink);border-color:var(--fd-amber-line)}
  .fd-pill-danger{background:var(--fd-rose-bg);color:var(--fd-rose-ink);border-color:var(--fd-rose-line)}
  .fd-pill-indigo{background:var(--fd-indigo-50);color:var(--fd-indigo-700);border-color:var(--fd-indigo-100)}

  /* Tables */
  .fd-table-wrap{overflow-x:auto}
  .fd-table{width:100%;border-collapse:collapse;font-size:13.5px}
  .fd-table th{position:sticky;top:0;padding:10px 14px;background:var(--fd-bg);border-bottom:1px solid var(--fd-line);font-size:12px;font-weight:600;color:var(--fd-muted);text-align:left;white-space:nowrap}
  .fd-table td{padding:11px 14px;border-bottom:1px solid var(--fd-line-2);vertical-align:middle;white-space:nowrap}
  .fd-table tr:last-child td{border-bottom:0}
  .fd-table tbody tr:hover td{background:#FAFBFF}
  .fd-table .fd-r{text-align:right;font-variant-numeric:tabular-nums}
  .fd-table-sub{display:block;font-size:12px;color:var(--fd-muted)}
  .fd-table tr.fd-is-selected td{background:var(--fd-indigo-50)}

  /* Forms */
  .fd-field{margin-top:14px}
  .fd-field:first-child{margin-top:0}
  .fd-label{display:block;margin-bottom:6px;font-size:13px;font-weight:600;color:var(--fd-ink-2)}
  .fd-input{width:100%;height:40px;padding:0 12px;border:1px solid var(--fd-line);border-radius:10px;background:#fff;font-size:14px}
  .fd-input:focus{outline:none;border-color:var(--fd-indigo);box-shadow:0 0 0 3px var(--fd-indigo-100)}
  select.fd-input{padding-right:32px}
  textarea.fd-input{height:auto;min-height:90px;padding:10px 12px;resize:vertical}
  .fd-hint{margin-top:5px;font-size:12.5px;color:var(--fd-muted)}
  .fd-error{display:none;margin-top:5px;font-size:12.5px;font-weight:500;color:var(--fd-rose-ink)}
  .fd-field.fd-is-invalid .fd-input{border-color:var(--fd-rose)}
  .fd-field.fd-is-invalid .fd-error{display:block}
  .fd-form-error{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--fd-rose-bg);border:1px solid var(--fd-rose-line);color:var(--fd-rose-ink);font-size:13px;font-weight:500}
  .fd-check{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--fd-ink-2);cursor:pointer}
  .fd-check input{width:16px;height:16px;margin:2px 0 0;accent-color:var(--fd-indigo)}
  .fd-seg{display:inline-flex;padding:3px;border-radius:10px;background:var(--fd-hover);border:1px solid var(--fd-line);gap:2px;flex-wrap:wrap}
  .fd-seg-btn{height:32px;padding:0 12px;border:0;border-radius:8px;background:none;color:var(--fd-muted);font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
  .fd-seg-btn[aria-pressed="true"]{background:#fff;color:var(--fd-ink);box-shadow:0 1px 2px rgba(15,23,42,.1)}
  .fd-seg-count{margin-left:6px;padding:1px 6px;border-radius:999px;background:rgba(15,23,42,.06);font-size:11px}
  .fd-filter-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid var(--fd-line-2)}

  /* Notes */
  .fd-note{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;border-radius:10px;font-size:13.5px;border:1px solid var(--fd-line);background:var(--fd-bg);color:var(--fd-ink-2)}
  .fd-note .fd-ico{margin-top:1px}
  .fd-note-info{background:var(--fd-sky-bg);border-color:var(--fd-sky-line);color:#075985}
  .fd-note-warn{background:var(--fd-amber-bg);border-color:var(--fd-amber-line);color:#92400E}
  .fd-note-danger{background:var(--fd-rose-bg);border-color:var(--fd-rose-line);color:#9F1239}
  .fd-note-success{background:var(--fd-emerald-bg);border-color:var(--fd-emerald-line);color:#065F46}

  /* Digit tiles and prize tiers */
  .fd-digits{display:inline-flex;gap:3px;font-variant-numeric:tabular-nums}
  .fd-digit{width:24px;height:30px;display:grid;place-items:center;border-radius:6px;background:#fff;border:1px solid var(--fd-indigo-100);box-shadow:inset 0 -2px 0 var(--fd-indigo-50);font-weight:800;font-size:15px;color:var(--fd-ink)}
  .fd-tier-1 .fd-digit{background:var(--fd-t1);border-color:var(--fd-t1);color:#fff;box-shadow:inset 0 -2px 0 rgba(0,0,0,.25)}
  .fd-tier-2 .fd-digit{background:var(--fd-t2);border-color:var(--fd-t2);color:#fff;box-shadow:inset 0 -2px 0 rgba(0,0,0,.25)}
  .fd-tier-3 .fd-digit{background:var(--fd-t3);border-color:var(--fd-t3);color:#fff;box-shadow:inset 0 -2px 0 rgba(0,0,0,.25)}

  /* Dialog */
  .fd-modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:24px}
  .fd-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.5)}
  .fd-modal-card{position:relative;width:100%;max-width:540px;max-height:calc(100vh - 48px);display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:0 30px 60px -20px rgba(15,23,42,.4)}
  .fd-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 12px 14px 20px;border-bottom:1px solid var(--fd-line-2)}
  .fd-modal-title{margin:0;font-size:16px;font-weight:700}
  .fd-modal-title:focus{outline:none}
  .fd-modal-body{padding:18px 20px;overflow-y:auto}
  .fd-modal-body > * + *{margin-top:14px}
  .fd-modal-foot{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--fd-line-2)}
  .fd-modal-foot:empty{display:none}
  .fd-dl{margin:0;border:1px solid var(--fd-line-2);border-radius:10px}
  .fd-dl > div{display:flex;justify-content:space-between;gap:16px;padding:9px 12px;border-bottom:1px solid var(--fd-line-2);font-size:13.5px}
  .fd-dl > div:last-child{border-bottom:0}
  .fd-dl dt{color:var(--fd-muted)}
  .fd-dl dd{margin:0;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
  .fd-otp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;max-width:320px}
  .fd-otp input{width:100%;height:48px;text-align:center;font-size:20px;font-weight:700;border:1px solid var(--fd-line);border-radius:10px;background:#fff}
  .fd-otp input:focus{outline:none;border-color:var(--fd-indigo);box-shadow:0 0 0 3px var(--fd-indigo-100)}
  .fd-otp.fd-is-invalid input{border-color:var(--fd-rose)}

  /* Toast */
  .fd-toast{position:fixed;left:50%;bottom:24px;z-index:100;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:10px 16px;border-radius:12px;background:var(--fd-ink);color:#fff;font-size:13.5px;font-weight:500;box-shadow:0 16px 32px -12px rgba(15,23,42,.5);transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
  .fd-toast.fd-is-open{opacity:1;transform:translate(-50%,0)}

  /* Loader */
  .fd-loader{--fd-loader-size:40px;position:relative;display:inline-block;flex-shrink:0;width:var(--fd-loader-size);height:var(--fd-loader-size)}
  .fd-loader i{position:absolute;width:44%;height:44%;border-radius:50%;animation:fd-pulse 1.2s ease-in-out infinite}
  .fd-loader i:nth-child(1){top:0;left:0;background:#C0261A}
  .fd-loader i:nth-child(2){top:0;right:0;background:#F2B200;animation-delay:.15s}
  .fd-loader i:nth-child(3){bottom:0;right:0;background:#4F46E5;animation-delay:.3s}
  .fd-loader i:nth-child(4){bottom:0;left:0;background:#7E22CE;animation-delay:.45s}
  @keyframes fd-pulse{0%,60%,100%{transform:scale(.6);opacity:.5}30%{transform:scale(1);opacity:1}}

  /* Responsive */
  @media (max-width:1180px){ .fd-search{display:none} .fd-me-text{display:none} }
  @media (max-width:960px){
    .fd-sb{transform:translateX(-100%);transition:transform .22s ease;width:280px}
    .fd-app.fd-is-drawer-open .fd-sb{transform:none;box-shadow:24px 0 48px -24px rgba(15,23,42,.5)}
    .fd-sb .fd-sb-close{display:grid;color:var(--fd-menu-text)}
    .fd-sb .fd-sb-close:hover{background:rgba(255,255,255,.08)}
    .fd-main{margin-left:0}
    .fd-search{display:none}
    .fd-tb{padding:0 14px}
  }
  @media (max-width:640px){
    .fd-content{padding:16px 14px 40px}
    .fd-draw-chip{display:none}
    .fd-page-title{font-size:21px}
    .fd-modal{padding:0;align-items:flex-end}
    .fd-modal-card{max-width:none;max-height:92vh;border-radius:16px 16px 0 0}
    .fd-modal-foot .fd-btn{flex:1}
    .fd-tb-crumb,.fd-tb-crumb-sep{display:none}
    .fd-stat-value{font-size:21px}
  }
  @media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important} .fd-loader i{animation:none} }

  /* ================= Shared building blocks ================= */
  .fd-person{display:inline-flex;align-items:center;gap:10px;min-width:0}
  .fd-person .fd-avatar{width:30px;height:30px;font-size:11px}
  .fd-search-sm{position:relative}
  .fd-search-sm .fd-ico{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--fd-faint);pointer-events:none}
  .fd-search-sm .fd-input{width:220px;padding-left:32px;height:36px;font-size:13.5px}
  .fd-select-sm{height:36px;width:auto;font-size:13.5px}
  .fd-dt-count{margin-left:auto;font-size:12.5px;color:var(--fd-muted);white-space:nowrap}
  .fd-more{padding:12px 18px;text-align:center;border-top:1px solid var(--fd-line-2)}
  .fd-empty-cell{text-align:center;padding:32px 14px !important;color:var(--fd-muted);white-space:normal !important}
  .fd-row-click{cursor:pointer}
  .fd-row-click:focus-visible{outline:2px solid var(--fd-indigo);outline-offset:-2px}
  .fd-drawer{position:fixed;inset:0;z-index:80}
  .fd-drawer-bg{position:absolute;inset:0;background:rgba(15,23,42,.45)}
  .fd-drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(560px,100%);display:flex;flex-direction:column;background:#fff;box-shadow:-24px 0 48px -24px rgba(15,23,42,.4)}
  .fd-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 20px;border-bottom:1px solid var(--fd-line-2)}
  .fd-drawer-head h2{margin:0;font-size:17px;font-weight:800}
  .fd-drawer-head h2:focus{outline:none}
  .fd-drawer-body{flex:1;overflow-y:auto;padding:18px 20px}
  .fd-drawer-body > * + *{margin-top:14px}
  .fd-drawer-foot{display:flex;gap:10px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--fd-line-2)}
  .fd-drawer-foot:empty{display:none}
  .fd-sec-title{margin:18px 0 8px !important;font-size:13px;font-weight:700;color:var(--fd-ink-2)}
  .fd-tabs{display:flex;gap:22px;border-bottom:1px solid var(--fd-line);margin-bottom:18px;overflow-x:auto;scrollbar-width:none}
  .fd-tabs::-webkit-scrollbar{display:none}
  .fd-tab{position:relative;height:44px;padding:0;border:0;background:none;color:var(--fd-muted);font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer}
  .fd-tab[aria-selected="true"]{color:var(--fd-indigo)}
  .fd-tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:var(--fd-indigo)}
  .fd-tab .fd-seg-count{margin-left:6px}
  .fd-two{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;align-items:start}
  .fd-srow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:10px 24px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--fd-line-2)}
  .fd-srow:last-child{border-bottom:0}
  .fd-srow-label{display:block;font-weight:600;font-size:14px}
  .fd-srow-hint{font-size:12.5px;color:var(--fd-muted);margin-top:2px}
  .fd-srow-control{display:flex;justify-content:flex-end;gap:8px;min-width:0}
  .fd-affix-input{position:relative;display:inline-flex;width:100%;max-width:220px}
  .fd-affix-input .fd-input{padding-right:64px;text-align:right;font-variant-numeric:tabular-nums}
  .fd-affix-input span{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:12.5px;font-weight:600;color:var(--fd-muted);pointer-events:none}
  .fd-switch-wrap{display:inline-flex;cursor:pointer}
  .fd-switch{appearance:none;-webkit-appearance:none;position:relative;width:44px;height:26px;margin:0;border-radius:999px;background:#CBD5E1;cursor:pointer;transition:background-color .15s}
  .fd-switch::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.25);transition:transform .15s}
  .fd-switch:checked{background:var(--fd-indigo)}
  .fd-switch:checked::after{transform:translateX(18px)}
  .fd-switch:focus-visible{outline:2px solid var(--fd-indigo);outline-offset:2px}
  .fd-savebar{position:fixed;left:50%;bottom:20px;z-index:60;transform:translateX(-50%);display:flex;align-items:center;gap:16px;flex-wrap:wrap;width:min(760px,calc(100vw - 32px));padding:12px 14px 12px 18px;border-radius:14px;background:var(--fd-ink);color:#E2E8F0;font-size:13.5px;box-shadow:0 20px 40px -16px rgba(15,23,42,.6)}
  .fd-savebar strong{color:#fff}
  .fd-savebar-actions{margin-left:auto;display:flex;gap:8px}
  .fd-savebar .fd-btn-secondary{background:transparent;color:#E2E8F0;border-color:rgba(255,255,255,.25)}
  .fd-savebar .fd-btn-secondary:hover{background:rgba(255,255,255,.08);color:#fff}
  body.fd-has-savebar .fd-content{padding-bottom:120px}
  .fd-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
  .fd-kv > div{padding:10px 12px;border-radius:10px;background:var(--fd-bg);border:1px solid var(--fd-line-2);min-width:0}
  .fd-kv dt{font-size:12px;color:var(--fd-muted);font-weight:600}
  .fd-kv dd{margin:2px 0 0;font-weight:700;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
  .fd-mono{font-variant-numeric:tabular-nums;letter-spacing:.01em;overflow-wrap:anywhere;word-break:break-all}
  .fd-flag{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border-radius:8px;background:var(--fd-amber-bg);border:1px solid var(--fd-amber-line);font-size:13px;color:#92400E}
  .fd-flag + .fd-flag{margin-top:6px}
  .fd-checklist{list-style:none;margin:0;padding:0}
  .fd-checklist li{display:flex;gap:8px;align-items:flex-start;padding:6px 0;font-size:13.5px;border-bottom:1px solid var(--fd-line-2)}
  .fd-checklist li:last-child{border-bottom:0}
  .fd-checklist .fd-ok{color:var(--fd-emerald)} .fd-checklist .fd-warnc{color:var(--fd-amber-ink)} .fd-checklist .fd-badc{color:var(--fd-rose)}
  .fd-bars-chart{display:flex;align-items:flex-end;gap:6px;height:170px;padding-top:8px}
  .fd-bars-chart > div{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}
  .fd-bars-chart span.fd-b{width:70%;max-width:22px;border-radius:4px 4px 1px 1px;background:var(--fd-indigo-200)}
  .fd-bars-chart span.fd-b.fd-is-last{background:var(--fd-indigo)}
  .fd-bars-chart small{font-size:10.5px;color:var(--fd-muted);white-space:nowrap}
  .fd-matrix th,.fd-matrix td{text-align:center}
  .fd-matrix th:first-child,.fd-matrix td:first-child{text-align:left}
  .fd-matrix .fd-yes{color:var(--fd-emerald)} .fd-matrix .fd-no{color:var(--fd-line)}
  @media (max-width:1180px){ .fd-two{grid-template-columns:minmax(0,1fr)} }
  @media (max-width:760px){ .fd-srow{grid-template-columns:minmax(0,1fr)} .fd-srow-control{justify-content:flex-start} .fd-affix-input{max-width:none} }
  @media (max-width:640px){ .fd-search-sm{flex:1 1 100%} .fd-search-sm .fd-input{width:100%} .fd-select-sm{flex:1 1 40%} .fd-dt-count{margin-left:0} .fd-savebar{bottom:12px} .fd-savebar-actions{margin-left:0;width:100%} .fd-savebar-actions .fd-btn{flex:1} }

  .fd-dd-alerts{width:320px}
  .fd-alert{align-items:flex-start}
  .fd-alert small{display:block;font-size:12px;color:var(--fd-muted);font-weight:500}
  .fd-alert strong{display:block;font-weight:700;color:var(--fd-ink)}
  .fd-alert-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:6px}
  @media (max-width:640px){ .fd-dd-alerts{width:min(320px,calc(100vw - 28px));right:-90px} }

/* Screen-specific rules, kept in the order the screens were designed. */

/* ---- account ---- */
.ac-sec{margin-bottom:16px;scroll-margin-top:calc(var(--fd-tb-h) + 16px)}
.ac-sessions{list-style:none;margin:0;padding:0}
.ac-sessions li{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid var(--fd-line-2)}
.ac-sessions li:last-child{border-bottom:0}

/* ---- dashboard ---- */
.fd-db-top{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;margin-bottom:16px}
.fd-live{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.fd-live-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 20px;padding:16px 18px;border-bottom:1px solid var(--fd-line-2)}
.fd-live-row:last-child{border-bottom:0}
.fd-live-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:16px;font-weight:800}
.fd-live-meta{margin-top:4px;font-size:13px;color:var(--fd-muted)}
.fd-live-meta strong{color:var(--fd-ink);font-variant-numeric:tabular-nums}
.fd-live-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.fd-steps{grid-column:1 / -1;list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.fd-steps li{position:relative;padding-top:14px;font-size:12px;font-weight:600;color:var(--fd-faint);text-align:left}
.fd-steps li::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;border-radius:999px;background:var(--fd-line)}
.fd-steps li.fd-is-done{color:var(--fd-ink-2)}
.fd-steps li.fd-is-done::before{background:var(--fd-emerald)}
.fd-steps li.fd-is-now{color:var(--fd-amber-ink)}
.fd-steps li.fd-is-now::before{background:var(--fd-amber)}
.fd-steps small{display:block;font-weight:500;color:var(--fd-muted);font-variant-numeric:tabular-nums}
.fd-todo{list-style:none;margin:0;padding:0}
.fd-todo li{border-bottom:1px solid var(--fd-line-2)}
.fd-todo li:last-child{border-bottom:0}
.fd-todo a{display:flex;align-items:center;gap:12px;padding:12px 18px;text-decoration:none;color:inherit}
.fd-todo a:hover{background:#FAFBFF}
.fd-todo-ico{width:34px;height:34px;flex-shrink:0;border-radius:10px;display:grid;place-items:center}
.fd-todo-main{flex:1;min-width:0}
.fd-todo-title{font-weight:700;font-size:13.5px}
.fd-todo-sub{font-size:12.5px;color:var(--fd-muted)}
.fd-todo-count{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}
.fd-tone-warn{background:var(--fd-amber-bg);color:var(--fd-amber-ink)}
.fd-tone-danger{background:var(--fd-rose-bg);color:var(--fd-rose-ink)}
.fd-tone-info{background:var(--fd-sky-bg);color:var(--fd-sky-ink)}
.fd-tone-indigo{background:var(--fd-indigo-50);color:var(--fd-indigo-700)}
.fd-db-mid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px;margin-top:16px}
.fd-chart{display:flex;align-items:flex-end;gap:8px;height:190px;padding:10px 4px 0}
.fd-chart-col{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px}
.fd-chart-bars{width:100%;flex:1;display:flex;align-items:flex-end;justify-content:center;gap:2px}
.fd-chart-bar{width:42%;max-width:16px;border-radius:4px 4px 1px 1px;min-height:3px}
.fd-chart-bar.fd-sales{background:var(--fd-indigo)}
.fd-chart-bar.fd-prizes{background:var(--fd-amber)}
.fd-chart-x{font-size:10.5px;color:var(--fd-muted);white-space:nowrap}
.fd-legend{display:flex;gap:14px;font-size:12.5px;color:var(--fd-muted)}
.fd-legend span{display:inline-flex;align-items:center;gap:6px}
.fd-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.fd-activity{list-style:none;margin:0;padding:0}
.fd-activity li{display:flex;gap:10px;padding:11px 18px;border-bottom:1px solid var(--fd-line-2);font-size:13px}
.fd-activity li:last-child{border-bottom:0}
.fd-activity .fd-avatar{width:28px;height:28px;font-size:11px}
.fd-activity time{display:block;font-size:12px;color:var(--fd-muted)}
@media (max-width:1180px){ .fd-db-top,.fd-db-mid{grid-template-columns:minmax(0,1fr)} }
@media (max-width:640px){ .fd-live-row{grid-template-columns:minmax(0,1fr)}
.fd-live-actions{justify-content:flex-start}
.fd-steps{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:12px}
.fd-chart-x{font-size:9px} }

/* ---- draws ---- */
.fd-drawer{position:fixed;inset:0;z-index:80}
.fd-drawer-bg{position:absolute;inset:0;background:rgba(15,23,42,.45)}
.fd-drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(520px,100%);display:flex;flex-direction:column;background:#fff;box-shadow:-24px 0 48px -24px rgba(15,23,42,.4)}
.fd-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 20px;border-bottom:1px solid var(--fd-line-2)}
.fd-drawer-head h2{margin:0;font-size:17px;font-weight:800}
.fd-drawer-head h2:focus{outline:none}
.fd-drawer-body{flex:1;overflow-y:auto;padding:18px 20px}
.fd-drawer-foot{display:flex;gap:10px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--fd-line-2)}
.fd-drawer-foot:empty{display:none}
.fd-tl{list-style:none;margin:0 0 18px;padding:0}
.fd-tl li{position:relative;padding:0 0 14px 26px;font-size:13.5px}
.fd-tl li::before{content:"";position:absolute;left:4px;top:5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--fd-line)}
.fd-tl li::after{content:"";position:absolute;left:9px;top:17px;bottom:0;width:2px;background:var(--fd-line-2)}
.fd-tl li:last-child::after{display:none}
.fd-tl li.fd-is-done::before{background:var(--fd-emerald);border-color:var(--fd-emerald)}
.fd-tl li.fd-is-now::before{background:var(--fd-amber);border-color:var(--fd-amber);box-shadow:0 0 0 4px var(--fd-amber-bg)}
.fd-tl li.fd-is-bad::before{background:var(--fd-rose);border-color:var(--fd-rose)}
.fd-tl small{display:block;color:var(--fd-muted);font-size:12px}
.fd-sec-title{margin:18px 0 8px;font-size:13px;font-weight:700;color:var(--fd-ink-2)}
.fd-top3{display:flex;gap:14px;flex-wrap:wrap}
.fd-top3 span.fd-cap{display:block;margin-top:4px;font-size:11.5px;color:var(--fd-muted)}
.fd-chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.fd-chip{padding:4px 0;border-radius:6px;background:var(--fd-bg);border:1px solid var(--fd-line-2);text-align:center;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.fd-tbl-actions{text-align:right}
@media (max-width:640px){ .fd-chips{grid-template-columns:repeat(4,minmax(0,1fr))} }

/* ---- exposure ---- */
.fd-ex-head-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fd-ex-rule{margin:16px 0}
.fd-bar{height:6px;border-radius:999px;background:var(--fd-line-2);overflow:hidden;margin-top:5px;width:120px}
.fd-bar span{display:block;height:100%;border-radius:999px;background:var(--fd-indigo)}
.fd-bar span.fd-is-near{background:var(--fd-amber)}
.fd-bar span.fd-is-full{background:var(--fd-rose)}
.fd-heat-wrap{padding:18px;display:grid;grid-template-columns:minmax(0,640px) minmax(220px,1fr);gap:20px;align-items:start}
.fd-heat-box{position:relative}
.fd-heat{display:block;width:100%;height:auto;aspect-ratio:1;image-rendering:pixelated;border-radius:8px;border:1px solid var(--fd-line);cursor:crosshair}
.fd-heat-axis{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--fd-muted);font-variant-numeric:tabular-nums}
.fd-heat-tip{position:absolute;z-index:5;pointer-events:none;padding:8px 10px;border-radius:10px;background:var(--fd-ink);color:#fff;font-size:12.5px;white-space:nowrap;box-shadow:0 10px 24px -10px rgba(15,23,42,.6)}
.fd-legend-scale{height:10px;border-radius:999px;background:linear-gradient(90deg,#EEF2FF,#A5B4FC,#6366F1,#F59E0B,#E11D48)}
.fd-legend-labels{display:flex;justify-content:space-between;margin-top:4px;font-size:11.5px;color:var(--fd-muted)}
.fd-ex-side h3{margin:0 0 8px;font-size:14px}
.fd-ex-side p{margin:0 0 12px;font-size:13px;color:var(--fd-muted)}
.fd-more{padding:12px 18px;text-align:center;border-top:1px solid var(--fd-line-2)}
.fd-search-sm{position:relative}
.fd-search-sm .fd-ico{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--fd-faint);pointer-events:none}
.fd-search-sm .fd-input{width:170px;padding-left:32px;height:36px;font-size:13.5px}
.fd-select-sm{height:36px;width:auto;font-size:13.5px}
@media (max-width:1180px){ .fd-heat-wrap{grid-template-columns:minmax(0,1fr)} }
@media (max-width:640px){ .fd-search-sm .fd-input{width:100%}
.fd-search-sm{flex:1 1 100%}
.fd-select-sm{flex:1} }

/* ---- game-settings ---- */
.gs-tiers td{vertical-align:middle}
.gs-tiers .fd-input{height:36px;font-size:13.5px}
.gs-tiers .gs-count{width:84px;text-align:right}
.gs-tiers .gs-rate{width:110px;text-align:right}
.gs-rtp{padding:14px 18px;border-top:1px solid var(--fd-line-2)}
.gs-sec{margin-bottom:16px}

/* ---- login ---- */
/* The mock-up was a page of its own, so it centred its card on `body`. Here the
   sign-in screen shares a page with the console, and that rule on `body` put the
   whole console in a centred, padded box — the top bar floating, the content
   narrower than the window, and on a phone the column pushed off the left edge.
   The centring belongs to the sign-in screen alone. */
#fd-auth{max-width:none;min-height:100vh;box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:radial-gradient(circle at 20% 0%,#EEF2FF 0,transparent 45%),var(--fd-bg)}
.fd-auth{width:100%;max-width:420px}
.fd-auth-brand{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:22px}
.fd-auth-brand svg{height:34px;width:auto}
.fd-auth-tag{padding:3px 9px;border-radius:999px;background:var(--fd-midnight);color:#fff;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.fd-auth-card{background:#fff;border:1px solid var(--fd-line);border-radius:18px;padding:28px;box-shadow:0 20px 50px -30px rgba(15,23,42,.35)}
.fd-auth-card h1{margin:0 0 4px;font-size:22px;font-weight:800;letter-spacing:-.01em}
.fd-auth-card h1:focus{outline:none}
.fd-auth-sub{margin:0 0 20px;color:var(--fd-muted);font-size:14px}
.fd-auth-foot{margin-top:18px;display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--fd-muted)}
.fd-auth-foot .fd-ico{margin-top:1px}
.fd-pw{position:relative}
.fd-pw .fd-input{padding-right:44px}
.fd-pw .fd-icon-btn{position:absolute;right:2px;top:1px;width:38px;height:38px}
.fd-auth .fd-otp{max-width:none;margin-top:4px}
.fd-auth-done{text-align:center}
.fd-auth-done .fd-loader{margin:6px auto 16px;display:block}
@media (max-width:480px){ .fd-auth-card{padding:22px 18px} }

/* ---- notifications ---- */
.nt-ed{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
.nt-chips{display:flex;flex-wrap:wrap;gap:6px}
.nt-chip{height:26px;padding:0 8px;border:1px solid var(--fd-line);border-radius:6px;background:#fff;font-size:12px;font-weight:600;color:var(--fd-ink-2);cursor:pointer;font-variant-numeric:tabular-nums}
.nt-chip:hover{border-color:var(--fd-indigo-200);background:var(--fd-indigo-50)}
.nt-prev-app{display:flex;gap:10px;padding:12px;border:1px solid var(--fd-line);border-radius:12px;background:#fff}
.nt-prev-app .fd-avatar{background:var(--fd-midnight);color:#fff}
.nt-prev-mail{border:1px solid var(--fd-line);border-radius:12px;overflow:hidden}
.nt-prev-mail-head{padding:10px 12px;background:var(--fd-bg);border-bottom:1px solid var(--fd-line-2);font-size:12.5px}
.nt-prev-mail-body{padding:12px;font-size:13.5px;white-space:pre-wrap;max-height:260px;overflow:auto}
.nt-ph{background:var(--fd-amber-bg);border-radius:4px;padding:0 3px;color:var(--fd-amber-ink);font-weight:600}

/* ---- player ---- */
.pd-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:18px}
.pd-head .fd-avatar{width:56px;height:56px;font-size:19px}
.pd-name{margin:0;font-size:22px;font-weight:800;letter-spacing:-.01em}
.pd-name:focus{outline:none}
.pd-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:4px;font-size:13px;color:var(--fd-muted)}
.pd-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.pd-kv{padding:0 18px 18px}
.pd-list{list-style:none;margin:0;padding:0}
.pd-list li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 18px;border-bottom:1px solid var(--fd-line-2);font-size:13.5px}
.pd-list li:last-child{border-bottom:0}
.pd-note{padding:12px 18px;border-bottom:1px solid var(--fd-line-2)}
.pd-note p{margin:4px 0 0;font-size:13.5px}
@media (max-width:640px){ .pd-actions{margin-left:0;width:100%}
.pd-actions .fd-btn{flex:1} }

/* ---- referral-settings ---- */
.rf-sec{margin-bottom:16px}

/* ---- reserve ---- */
.rs-cover{padding:18px}
.rs-meter{margin:10px 0 4px;height:14px;border-radius:999px;background:var(--fd-line-2);overflow:hidden;display:flex}
.rs-meter span{height:100%}
.rs-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--fd-muted);margin-top:8px}
.rs-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* ---- results ---- */
.fd-role-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;padding:10px 14px;border:1px dashed var(--fd-indigo-200);border-radius:12px;background:var(--fd-indigo-50);font-size:13px;color:var(--fd-indigo-700)}
.fd-role-bar strong{font-weight:700}
.fd-res-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.fd-res-side{position:sticky;top:calc(var(--fd-tb-h) + 16px)}
.fd-res-sec{padding:18px;border-bottom:1px solid var(--fd-line-2)}
.fd-res-sec:last-child{border-bottom:0}
.fd-res-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}
.fd-res-sec-head h3{margin:0;font-size:14px;font-weight:700}
.fd-res-sec-head span{font-size:12.5px;color:var(--fd-muted)}
.fd-res-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fd-res-top label{display:block;padding:12px;border-radius:12px;border:1px solid var(--fd-line)}
.fd-res-top .fd-res-tier{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:13px;font-weight:700}
.fd-res-rank{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:12px;font-weight:800}
.fd-res-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.fd-res-cell{position:relative}
.fd-res-idx{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:10.5px;font-weight:700;color:var(--fd-faint);pointer-events:none}
.fd-res-input{width:100%;height:42px;padding:0 8px 0 24px;border:1px solid var(--fd-line);border-radius:9px;background:#fff;font-size:17px;font-weight:700;letter-spacing:.12em;text-align:center;font-variant-numeric:tabular-nums}
.fd-res-top .fd-res-input{height:56px;padding:0 10px;font-size:28px;letter-spacing:.2em}
.fd-res-input:focus{outline:none;border-color:var(--fd-indigo);box-shadow:0 0 0 3px var(--fd-indigo-100)}
.fd-res-input.fd-is-ok{border-color:var(--fd-emerald-line);background:#FBFFFD}
.fd-res-input.fd-is-dup,.fd-res-input.fd-is-diff{border-color:var(--fd-rose);background:var(--fd-rose-bg);color:var(--fd-rose-ink)}
.fd-res-input:disabled{background:var(--fd-bg);color:var(--fd-ink-2)}
.fd-progress{height:8px;border-radius:999px;background:var(--fd-line-2);overflow:hidden}
.fd-progress span{display:block;height:100%;border-radius:999px;background:var(--fd-indigo);transition:width .2s}
.fd-progress.fd-is-full span{background:var(--fd-emerald)}
.fd-res-list{list-style:none;margin:10px 0 0;padding:0;font-size:13px}
.fd-res-list li{display:flex;gap:8px;padding:4px 0;color:var(--fd-ink-2)}
.fd-res-list li .fd-ico{margin-top:2px}
.fd-res-list .fd-ok{color:var(--fd-emerald-ink)}
.fd-res-list .fd-bad{color:var(--fd-rose-ink)}
.fd-res-list .fd-wait{color:var(--fd-faint)}
.fd-res-actions{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.fd-sample{margin-top:14px;padding-top:12px;border-top:1px dashed var(--fd-line);font-size:12.5px;color:var(--fd-muted)}
.fd-sample .fd-link{font-size:12.5px}
.fd-diff-table td,.fd-diff-table th{padding:8px 10px}
.fd-overlay{position:fixed;inset:0;z-index:95;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:rgba(248,250,252,.94)}
.fd-overlay p{margin:0;font-weight:700;color:var(--fd-ink-2)}
.fd-done{padding:28px;text-align:center}
.fd-done-ico{width:56px;height:56px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:var(--fd-emerald-bg);color:var(--fd-emerald)}
.fd-done h2{margin:0 0 6px;font-size:21px;font-weight:800}
.fd-done p{margin:0;color:var(--fd-muted)}
.fd-done .fd-stats{margin:20px 0;text-align:left}
@media (max-width:1180px){ .fd-res-layout{grid-template-columns:minmax(0,1fr)}
.fd-res-side{position:static} }
@media (max-width:640px){ .fd-res-top{grid-template-columns:minmax(0,1fr)}
.fd-res-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.fd-res-sec{padding:14px} }

/* ---- support inbox ---- */
/* The inbox is the whole screen: no page padding, no page heading, nothing
   between it and the edges. The top bar already names it, and three panels
   that each scroll on their own have nowhere to put a margin. */
body[data-fd-screen="support"] .fd-content{padding:0;max-width:none}
body[data-fd-screen="support"] .sib-shell{
  height:calc(100vh - var(--fd-tb-h));gap:0;border-radius:0}
body[data-fd-screen="support"] .sib-panel{border-radius:0;box-shadow:none;border-top:0;border-bottom:0}
body[data-fd-screen="support"] .sib-rail{border-left:0}
body[data-fd-screen="support"] .sib-client{border-right:0}
@media (max-width:1040px){
  body[data-fd-screen="support"] .sib-shell{height:auto}
  body[data-fd-screen="support"] .sib-panel{border-left:0;border-right:0}
}

/* Three columns: the requests, the conversation, the player. The shell is a
   fixed height so each column scrolls on its own rather than the page growing
   to the length of the longest one — an inbox is read by scanning, not by
   scrolling past the list to reach the reply box. */
.sib-shell{display:grid;grid-template-columns:326px minmax(0,1fr) 316px;gap:16px;
  height:min(76vh,880px);min-height:520px}
.sib-panel{background:var(--fd-surface);border:1px solid var(--fd-line);border-radius:14px;
  box-shadow:0 1px 2px rgba(15,23,42,.05),0 8px 24px -16px rgba(15,23,42,.35);
  display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden}
.sib-scroll{overflow-y:auto;overflow-x:hidden;min-height:0;flex:1 1 auto}
.sib-scroll::-webkit-scrollbar{width:10px}
.sib-scroll::-webkit-scrollbar-thumb{background:#DBE3EE;border:3px solid var(--fd-surface);border-radius:99px}
.sib-scroll::-webkit-scrollbar-thumb:hover{background:#C3CEDD}

/* left rail */
.sib-rail-head{flex:none;padding:12px 12px 0}
.sib-filters{display:flex;gap:6px;flex-wrap:wrap}
.sib-tab{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;
  border:1px solid var(--fd-line);background:var(--fd-surface);font-size:12px;font-weight:600;
  color:var(--fd-ink-2);cursor:pointer}
.sib-tab:hover{border-color:var(--fd-indigo-200);color:var(--fd-indigo-700)}
.sib-tab[disabled]{opacity:.55;cursor:not-allowed}
.sib-tab[disabled]:hover{border-color:var(--fd-line);color:var(--fd-ink-2)}
.sib-tab-count{font-size:10.5px;font-weight:700;color:var(--fd-muted);background:var(--fd-hover);
  border-radius:999px;padding:1px 6px;min-width:19px;text-align:center}
.sib-tab.is-active{background:var(--fd-indigo);border-color:var(--fd-indigo);color:#fff}
.sib-tab.is-active .sib-tab-count{background:rgba(255,255,255,.22);color:#fff}
.sib-search{position:relative;margin:10px 0 8px}
.sib-search .fd-input{width:100%;padding:8px 12px 8px 33px;font-size:12.5px;background:#FBFCFE}
.sib-search .fd-ico{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--fd-faint)}
.sib-rail-count{flex:none;display:flex;justify-content:space-between;align-items:center;
  padding:0 14px 8px;font-size:11px;color:var(--fd-faint);font-weight:600}
.sib-list{list-style:none;margin:0;padding:0 8px 10px}
.sib-item{width:100%;text-align:left;display:block;background:transparent;cursor:pointer;
  border:1px solid transparent;border-left:3px solid transparent;border-radius:9px;
  padding:8px 10px;margin-bottom:2px}
.sib-item:hover{background:#F8FAFC;border-color:var(--fd-line)}
.sib-item.is-status-new{border-left-color:#FDA4AF}
.sib-item.is-status-open{border-left-color:#7DD3FC}
.sib-item.is-status-closed{border-left-color:#A7F3D0}
.sib-item[aria-current="true"]{background:var(--fd-indigo-50);border-color:var(--fd-indigo-200);
  border-left-color:var(--fd-indigo)}
.sib-item-top{display:flex;align-items:center;gap:7px}
.sib-item-mark{width:6px;height:6px;border-radius:50%;flex:none;background:#CBD5E1}
.sib-item.is-status-new .sib-item-mark{background:var(--fd-rose-ink)}
.sib-item.is-status-open .sib-item-mark{background:var(--fd-sky)}
.sib-item.is-status-closed .sib-item-mark{background:var(--fd-emerald)}
.sib-item-who{font-weight:600;font-size:12px;color:var(--fd-ink-2);flex:1 1 auto;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sib-item.is-new .sib-item-who{color:var(--fd-ink);font-weight:700}
.sib-item-time{font-size:10.5px;color:var(--fd-faint);flex:none}
.sib-item-subject{font-size:12.5px;font-weight:600;margin:3px 0 1px;letter-spacing:-.01em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sib-item-snippet{font-size:11.5px;color:var(--fd-muted);margin:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sib-item-foot{display:flex;align-items:center;gap:5px;margin-top:6px}
.sib-empty{padding:28px 20px;text-align:center;color:var(--fd-muted);font-size:12.5px}
.sib-empty strong{display:block;color:var(--fd-ink);font-size:13.5px;margin-bottom:4px}

/* chips */
.sib-chip{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;
  padding:2px 8px;border-radius:999px;border:1px solid transparent;white-space:nowrap}
.sib-chip::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.sib-chip--new{color:var(--fd-rose-ink);background:var(--fd-rose-bg);border-color:var(--fd-rose-line)}
.sib-chip--open{color:var(--fd-sky);background:var(--fd-sky-bg);border-color:var(--fd-sky-line)}
.sib-chip--closed{color:var(--fd-emerald);background:var(--fd-emerald-bg);border-color:var(--fd-emerald-line)}
.sib-chip--plain{color:var(--fd-ink-2);background:var(--fd-hover);border-color:var(--fd-line)}
.sib-chip--plain::before{display:none}
.sib-chip--violet{color:var(--fd-t3);background:#F5F3FF;border-color:#DDD6FE}
.sib-chip--violet::before{display:none}
.sib-chip--lg{font-size:11px;padding:3px 9px}

/* conversation */
.sib-thread-top{flex:none;display:flex;align-items:center;gap:12px;padding:12px 16px;
  border-bottom:1px solid var(--fd-line-2);background:linear-gradient(180deg,#FBFCFF,var(--fd-surface))}
.sib-avatar{flex:none;border-radius:50%;display:grid;place-items:center;font-weight:700;color:#fff;
  background:linear-gradient(140deg,#6366F1,var(--fd-indigo));width:30px;height:30px;font-size:12px}
.sib-avatar--lg{width:42px;height:42px;font-size:14px}
.sib-avatar--xl{width:56px;height:56px;font-size:18px}
.sib-avatar--player{background:linear-gradient(140deg,#0EA5E9,var(--fd-sky))}
.sib-thread-who{min-width:0;flex:1 1 auto}
.sib-thread-name{margin:0;font-size:15px;font-weight:700;letter-spacing:-.015em;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sib-thread-name:focus{outline:none}
.sib-thread-meta{display:flex;align-items:center;gap:8px;margin-top:3px;flex-wrap:wrap}
.sib-thread-id{font-size:11.5px;color:var(--fd-faint);font-weight:700}
.sib-thread-mail{font-size:12px;color:var(--fd-muted);overflow:hidden;text-overflow:ellipsis}
.sib-thread-tools{display:flex;align-items:center;gap:8px;flex:none}
.sib-thread-tools .fd-btn{padding:8px 13px}
.sib-icon-btn{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--fd-line);
  border-radius:9px;background:var(--fd-surface);color:var(--fd-ink-2);flex:none;cursor:pointer}
.sib-icon-btn:hover{background:var(--fd-indigo-50);border-color:var(--fd-indigo-200);color:var(--fd-indigo-700)}
.sib-thread-body{padding:20px 22px 8px;
  background:radial-gradient(circle at 1px 1px,#E8EDF5 1px,transparent 0) 0 0/22px 22px}
.sib-msg{display:flex;gap:11px;margin-bottom:16px;max-width:100%}
.sib-msg-body{min-width:0;max-width:min(560px,86%)}
.sib-msg-head{display:flex;align-items:baseline;gap:8px;margin-bottom:5px;flex-wrap:wrap}
.sib-msg-from{font-size:12.5px;font-weight:700}
.sib-msg-time{font-size:11px;color:var(--fd-faint)}
.sib-bubble{padding:12px 15px;border-radius:14px;border-top-left-radius:4px;font-size:13.5px;
  line-height:1.6;border:1px solid var(--fd-line);background:var(--fd-surface);color:var(--fd-ink);
  overflow-wrap:anywhere;white-space:pre-wrap}
.sib-msg--out{flex-direction:row-reverse}
.sib-msg--out .sib-msg-head{flex-direction:row-reverse}
.sib-msg--out .sib-msg-body{margin-left:auto}
.sib-msg--out .sib-bubble{background:var(--fd-indigo-50);border-color:var(--fd-indigo-200);
  border-top-left-radius:14px;border-top-right-radius:4px}
.sib-receipt{font-size:11px;color:var(--fd-emerald);margin-top:6px;text-align:right;font-weight:600}
.sib-composer{flex:none;border-top:1px solid var(--fd-line-2);padding:12px 16px 14px;background:var(--fd-surface)}
.sib-notice{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--fd-amber-line);
  background:var(--fd-amber-bg);border-radius:9px;padding:9px 12px;font-size:12.5px;
  color:var(--fd-amber-ink);margin-bottom:10px}
.sib-notice .fd-ico{flex:none;margin-top:1px;color:var(--fd-amber)}
.sib-composer-row{display:flex;gap:10px;align-items:flex-end}
.sib-composer textarea{flex:1 1 auto;min-width:0;resize:none;font-size:13px;height:46px;
  padding:10px 12px;background:#FBFCFE}
.sib-composer textarea:disabled{background:var(--fd-bg);color:var(--fd-faint);cursor:not-allowed}

/* player panel */
.sib-client{background:linear-gradient(180deg,#FBFCFF,var(--fd-surface) 120px)}
.sib-client-head{padding:16px 14px 14px;text-align:center;border-bottom:1px solid var(--fd-line-2)}
.sib-client-head .sib-avatar{margin:0 auto 8px}
.sib-avatar--xl{width:48px;height:48px;font-size:16px}
.sib-client-name{font-size:14.5px;font-weight:700;margin:0;letter-spacing:-.015em;overflow-wrap:anywhere}
.sib-client-mail{font-size:11.5px;color:var(--fd-muted);margin:1px 0 9px;overflow-wrap:anywhere}
.sib-client-chips{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.sib-section{padding:13px 14px;border-bottom:1px solid var(--fd-line-2)}
.sib-section:last-child{border-bottom:none}
.sib-section-title{font-size:12px;font-weight:700;color:var(--fd-ink-2);margin:0 0 10px}
.sib-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font-size:12.5px;
  align-items:baseline}
.sib-dl dt{color:var(--fd-muted)}
.sib-dl dd{margin:0;text-align:right;font-weight:600;overflow-wrap:anywhere}
.sib-mini{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sib-mini-card{border:1px solid var(--fd-line);border-radius:10px;padding:10px 11px;background:var(--fd-surface)}
.sib-mini-label{font-size:10.5px;color:var(--fd-muted);text-transform:uppercase;letter-spacing:.04em;
  font-weight:600}
.sib-mini-value{font-size:16px;font-weight:700;letter-spacing:-.02em;margin-top:3px;
  font-variant-numeric:tabular-nums}
.sib-timeline{list-style:none;margin:0;padding:0}
.sib-timeline li{position:relative;padding:0 0 12px 18px;font-size:12.5px;color:var(--fd-ink-2)}
.sib-timeline li:last-child{padding-bottom:0}
.sib-timeline li::before{content:"";position:absolute;left:0;top:5px;width:7px;height:7px;border-radius:50%;
  background:var(--fd-surface);border:2px solid var(--fd-indigo-200)}
.sib-timeline li::after{content:"";position:absolute;left:3px;top:14px;bottom:1px;width:1px;background:var(--fd-line)}
.sib-timeline li:last-child::after{display:none}
.sib-timeline time{display:block;font-size:11px;color:var(--fd-faint);margin-top:1px}
/* A prize is the thing to notice in a list of tickets. */
.sib-timeline li.is-win{color:var(--fd-ink);font-weight:600}
.sib-timeline li.is-win::before{background:var(--fd-emerald-bg);border-color:var(--fd-emerald)}
.sib-timeline li.is-win b{color:var(--fd-emerald);font-variant-numeric:tabular-nums}

/* What they have won, when they have won. */
.sib-won{background:linear-gradient(180deg,var(--fd-emerald-bg),transparent)}
.sib-won .sib-section-title{color:var(--fd-emerald-ink)}
.sib-won-total{display:flex;flex-direction:column;gap:2px;padding:0 0 12px}
.sib-won-figure{font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--fd-emerald-ink);
  font-variant-numeric:tabular-nums;line-height:1.1}
.sib-won-figure small{font-size:12px;font-weight:700;letter-spacing:0}
.sib-won-sub{font-size:11.5px;color:var(--fd-muted)}
.sib-won-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.sib-won-list li{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  font-size:12.5px;background:var(--fd-surface);border:1px solid var(--fd-emerald-line);
  border-radius:9px;padding:7px 10px}
.sib-won-list li b{font-variant-numeric:tabular-nums;color:var(--fd-emerald-ink);white-space:nowrap}
.sib-won-list li span b{color:var(--fd-ink)}

/* The support agent a reply went out as, on the console side. */
.sib-agent{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--fd-muted)}
.sib-agent img{width:18px;height:18px;border-radius:50%;display:block}
.sib-duty{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;color:var(--fd-muted)}
.sib-duty img{width:26px;height:26px;border-radius:50%;display:block}
.sib-duty b{color:var(--fd-ink)}
.sib-avatar img{width:100%;height:100%;border-radius:50%;display:block}
.sib-actions{display:grid;gap:7px}
.sib-actions .fd-btn{width:100%;justify-content:flex-start}

/* The player panel folds away first, then the rail: on a narrow console the
   conversation is the part that has to stay readable. */
.sib-client-toggle{display:none}
@media (max-width:1499px){
  .sib-shell{grid-template-columns:300px minmax(0,1fr)}
  .sib-client{display:none}
  .sib-client.is-open{display:flex;position:fixed;top:0;right:0;bottom:0;width:316px;z-index:45;
    border-radius:0;box-shadow:-18px 0 40px -28px rgba(15,23,42,.5)}
  .sib-client-toggle{display:grid}
}
@media (max-width:1040px){
  .sib-shell{grid-template-columns:minmax(0,1fr);height:auto;min-height:0}
  .sib-shell .sib-rail{max-height:420px}
  .sib-shell .sib-conv{min-height:560px}
  .sib-thread-tools .fd-btn-label{display:none}
  .sib-thread-tools .fd-btn{padding:8px 10px}
  .sib-client.is-open{position:static;width:auto;border-radius:14px}
}
@media (max-width:640px){
  .sib-thread-body{padding:16px 13px 6px}
  .sib-msg-body{max-width:100%}
  .sib-composer-row{flex-direction:column;align-items:stretch}
}

/* ---- transactions ---- */
.tx-pending{list-style:none;margin:0;padding:0}
.tx-pending li{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid var(--fd-line-2)}
.tx-pending li:last-child{border-bottom:0}
.tx-pending .tx-main{flex:1;min-width:220px}

/* ---- wallet-settings ---- */
.ws-sec{margin-bottom:16px}

/* ---- ported screens: the few rules the mock-ups did not need ---- */
/* The readout under the exposure map. Reserves its line so the panel does not
   jump by one row every time the pointer leaves the canvas. */
.fd-heat-read{margin:10px 0 0;min-height:1.4em;font-size:12.5px;color:var(--fd-ink-2)}
.fd-field-inline{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--fd-line-2)}
.fd-field-inline .fd-label{margin:0}
.fd-input-num{width:110px;text-align:center;letter-spacing:.18em;font-variant-numeric:tabular-nums}
.fd-drawer-note{margin:0 0 16px;font-size:13.5px;color:var(--fd-muted)}
.fd-btn-block{width:100%;justify-content:center}
.fd-form-error{margin:0 0 12px;color:var(--fd-rose-ink);font-size:13px;font-weight:600}
/* A value the console shows but does not let anybody change. Reads as a value,
   not as a disabled input somebody will keep trying to click. */
.fd-fixed{display:inline-block;padding:8px 12px;border-radius:8px;background:var(--fd-hover);
  color:var(--fd-ink-2);font-weight:600;font-variant-numeric:tabular-nums}
.fd-quote{margin:14px 0 0;padding:14px 16px;border-radius:10px;background:var(--fd-bg);
  border-left:3px solid var(--fd-indigo);white-space:pre-wrap;font-size:13.5px;color:var(--fd-ink-2)}
.fd-pre{margin:12px 0;padding:12px;border-radius:10px;background:var(--fd-bg);border:1px solid var(--fd-line-2);
  font-size:12px;max-height:240px;overflow:auto;white-space:pre-wrap}
.fd-caps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.fd-caps li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--fd-ink-2)}
.fd-clamp{display:block;max-width:44ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-small-note{margin:0 0 12px;font-size:13px;color:var(--fd-emerald-ink);font-weight:600}

/* The content region is focused on every screen change so a screen reader
   lands on the new screen rather than staying where the old one was. It is a
   landing point, not a control, and drawing a focus ring around the entire page
   makes the whole console look like one selected object. */
.fd-content:focus,.fd-content:focus-visible{outline:none}

/* Fitting twenty menu entries on a laptop.
 *
 * Six section labels and eighteen links need about 890px; a 949px window leaves
 * the sidebar 844px after its header and footer. So the last two — Admin users
 * and Audit log — fell below the fold, and because the menu scrolls silently
 * there was nothing to say they were there. Two screens, unreachable, with no
 * clue why.
 *
 * Below 1040px of window height the rows and labels tighten just enough for the
 * whole menu to fit. Nothing is hidden and nothing is truncated. */
@media (max-height:1040px){
  .fd-nav{padding:6px 10px 10px}
  .fd-nav-link{height:34px}
  .fd-nav-label{padding:10px 10px 4px}
}
@media (max-height:820px){
  .fd-nav-link{height:31px;font-size:13px}
  .fd-nav-label{padding:8px 10px 3px;font-size:10.5px}
}
/* And if it still does not fit — a very short window, or a longer menu one day
   — the fade says there is more below rather than leaving it to be discovered.
   The fade lives on the nav, never on the sidebar: `.fd-sb` is position:fixed,
   and giving it any other position takes it out of that and pushes the entire
   content column off the side of the screen. */
.fd-nav{position:relative}
.fd-nav::after{content:'';position:sticky;bottom:-10px;display:block;height:22px;margin-top:-22px;
  background:linear-gradient(to bottom,transparent,var(--fd-midnight));pointer-events:none}

/* A published draw, laid out as the player dashboard's result board: the top
   prizes as rows in their prize colours, then each tier's numbers as chips.
   The sizes and colours are the player app's (ld.css), so an admin sees the
   draw exactly as a player does. */
.fd-rb{max-width:560px;margin:0 auto 20px;text-align:left}
.fd-rb-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--fd-line-2)}
.fd-rb-row:first-child{padding-top:0}
.fd-rb-label{display:flex;align-items:center;gap:10px;min-width:0}
.fd-rb-rank{width:26px;height:26px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800;background:var(--rb-bg,var(--fd-indigo));color:#fff}
.fd-rb-name{font-weight:700}
.fd-rb-rate{font-size:12.5px;color:var(--fd-muted);font-variant-numeric:tabular-nums}
.fd-rb .fd-digits{gap:5px}
.fd-rb .fd-digit{width:36px;height:44px;border-radius:9px;font-size:22px;font-weight:800;line-height:1;box-shadow:inset 0 -3px 0 var(--fd-indigo-50)}
.fd-rb-t1{--rb-bg:#C0261A;--rb-edge:#8A1B12}
.fd-rb-t2{--rb-bg:#A16207;--rb-edge:#6E4204}
.fd-rb-t3{--rb-bg:#7E22CE;--rb-edge:#581C87}
.fd-rb-t1 .fd-digit,.fd-rb-t2 .fd-digit,.fd-rb-t3 .fd-digit{background:var(--rb-bg);border:1.5px solid var(--rb-bg);box-shadow:inset 0 -3px 0 var(--rb-edge);color:#fff}
.fd-rb-tier{margin-top:14px}
.fd-rb-tier-head{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:13px}
.fd-rb-tier-name{font-weight:700}
.fd-rb-tier-rate{color:var(--fd-muted);font-variant-numeric:tabular-nums}
.fd-rb-chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none}
.fd-rb-chip{height:30px;display:grid;place-items:center;border-radius:8px;background:var(--fd-bg);border:1px solid var(--fd-line-2);font-weight:600;font-size:13px;font-variant-numeric:tabular-nums;color:var(--fd-ink-2)}
@media (max-width:480px){ .fd-rb .fd-digit{width:30px;height:38px;font-size:19px} }

/* ---------- Dashboard 2 ----------
   The board on the left and what each number paid on the right. The board
   reuses .fd-rb from the Results screen, so the two screens draw one draw the
   same way; these rules only make its numbers selectable and add the payout
   side. Gold for the total because it is prize money — the same prize gold
   (--fd-t2) the second prize uses, not the amber that means "warning". */
.fd-d2-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:16px;align-items:start}
/* The small grey note beside a panel title. The player side has had one as
   .ld-panel-tag all along; the console never did, and three screens now ask
   for it. */
.fd-panel-tag{font-size:12.5px;font-weight:600;color:var(--fd-muted)}
/* Both selectable shapes are real <button>s, so the browser's own button
   chrome has to go. Only the three sides are reset, never the shorthand:
   .fd-rb-row supplies the bottom border, and a blanket border:0 here would
   win over it and erase the line between rows. Padding is left alone so
   .fd-rb-row:first-child can still flatten the top of the first one. */
.fd-d2-pick,.fd-d2-top{cursor:pointer;font:inherit;color:inherit;text-align:inherit;width:100%;-webkit-appearance:none;appearance:none}
.fd-d2-top{background:none;border-top:0;border-left:0;border-right:0}
.fd-d2-pick:hover{border-color:var(--fd-indigo-200);color:var(--fd-ink)}
.fd-d2-pick:focus-visible,.fd-d2-top:focus-visible{outline:2px solid var(--fd-indigo);outline-offset:2px}
.fd-d2-pick.fd-is-won{background:var(--fd-emerald-bg);border-color:var(--fd-emerald-line);color:var(--fd-emerald-ink);font-weight:700}
.fd-d2-pick.fd-is-sel,.fd-d2-top.fd-is-sel{box-shadow:0 0 0 2px var(--fd-indigo)}
.fd-d2-scroll{max-height:520px;overflow:auto}
.fd-d2-row{cursor:pointer}
.fd-d2-row:hover td{background:var(--fd-hover)}
.fd-d2-row.fd-is-sel td{background:var(--fd-indigo-50)}
.fd-d2-row:focus-visible{outline:2px solid var(--fd-indigo);outline-offset:-2px}
.fd-d2-num{font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.05em}
.fd-d2-tier{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--fd-muted)}
.fd-d2-dot{width:8px;height:8px;border-radius:50%;flex:none}
.fd-d2-count{display:inline-block;min-width:23px;padding:1px 8px;border-radius:999px;font-size:11.5px;font-weight:700;background:var(--fd-emerald-bg);color:var(--fd-emerald-ink);border:1px solid var(--fd-emerald-line)}
.fd-d2-count.fd-is-none{background:transparent;color:var(--fd-faint);border-color:transparent;font-weight:500}
.fd-d2-amt{font-weight:700;color:var(--fd-emerald-ink);font-variant-numeric:tabular-nums}
.fd-d2-amt-zero{color:var(--fd-faint);font-variant-numeric:tabular-nums}
.fd-d2-total{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding:16px 20px;background:#FEF8E7;border-top:1px solid rgba(242,178,0,.42)}
.fd-d2-total-label{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:var(--fd-t2)}
.fd-d2-total-label::before{content:'';width:10px;height:10px;border-radius:50%;background:#F2B200;flex:none}
.fd-d2-total-val{font-size:24px;font-weight:800;letter-spacing:-.02em;color:var(--fd-t2);font-variant-numeric:tabular-nums}
.fd-d2-total-val small{font-size:14px;font-weight:600;opacity:.75}
.fd-d2-winners{margin-top:16px}
.fd-d2-winners[hidden]{display:none}
.fd-d2-who{display:flex;flex-direction:column;gap:1px;min-width:0}
.fd-d2-who span{font-size:12px;color:var(--fd-muted);overflow-wrap:anywhere}
.fd-d2-id{font-size:12px;color:var(--fd-faint);font-variant-numeric:tabular-nums}
.fd-d2-empty{padding:28px 20px;text-align:center;color:var(--fd-muted);font-size:13px}
.fd-num-col{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:1000px){ .fd-d2-grid{grid-template-columns:minmax(0,1fr)} }

/* ---------- Draw method ----------
   A chooser, not a form: one method is in force and the rest are alternatives,
   so each option carries what it does and what it costs in payout terms. The
   second group is banded in red because those options decide the result rather
   than draw it. */
.fd-dm-group{display:flex;align-items:center;gap:9px;margin:22px 0 10px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fd-muted)}
.fd-dm-group:first-of-type{margin-top:4px}
.fd-dm-group .fd-dm-bar{height:1px;background:var(--fd-line);flex:1}
.fd-dm-opt{display:block;position:relative;border:1px solid var(--fd-line);border-radius:14px;padding:14px 16px 14px 46px;background:var(--fd-bg);cursor:pointer;margin-bottom:9px}
.fd-dm-opt:hover{border-color:var(--fd-indigo-200)}
.fd-dm-opt:focus-within{outline:2px solid var(--fd-indigo);outline-offset:2px}
.fd-dm-opt input{position:absolute;left:16px;top:17px;width:17px;height:17px;accent-color:var(--fd-indigo);margin:0}
.fd-dm-opt.fd-is-sel{border-color:var(--fd-indigo);background:#fff;box-shadow:0 0 0 2px rgba(79,70,229,.25)}
.fd-dm-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.fd-dm-name{font-weight:700;font-size:14.5px}
.fd-dm-what{margin:3px 0 0;color:var(--fd-muted);font-size:13px;max-width:76ch}
.fd-dm-effect{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums}
.fd-dm-e-none{background:var(--fd-indigo-50);color:var(--fd-indigo-700)}
.fd-dm-e-cap{background:#FEF8E7;color:var(--fd-t2)}
.fd-dm-e-zero{background:#FDF2F1;color:var(--fd-t1)}
.fd-dm-e-part{background:#F9F2FE;color:var(--fd-t3)}
.fd-dm-now{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fd-indigo-700);background:var(--fd-indigo-50);border-radius:999px;padding:2px 8px}
.fd-dm-cap{margin:12px 0 2px;padding:14px 16px;border-radius:12px;background:#FEF8E7;border:1px solid rgba(242,178,0,.42)}
.fd-dm-cap[hidden]{display:none}
.fd-dm-cap-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.fd-dm-cap label{font-weight:600;font-size:13px;color:var(--fd-t2)}
.fd-dm-cap input{width:92px;padding:9px 11px;border-radius:10px;border:1px solid rgba(242,178,0,.42);background:#fff;font:inherit;font-weight:700;font-variant-numeric:tabular-nums;color:var(--fd-ink)}
.fd-dm-cap-note{margin:10px 0 0;font-size:12.5px;color:var(--fd-t2)}
.fd-dm-worked{margin-top:10px;padding:11px 13px;background:#fff;border-radius:10px;border:1px solid rgba(242,178,0,.42);font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--fd-ink-2)}
.fd-dm-warn{display:flex;gap:11px;align-items:flex-start;padding:13px 16px;border-radius:12px;background:#FDF2F1;border:1px solid rgba(192,38,26,.25);color:var(--fd-t1);font-size:13px;margin:6px 0 12px}
.fd-dm-warn svg{flex:none;margin-top:1px}
.fd-dm-basis{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border-radius:12px;background:var(--fd-bg);border:1px solid var(--fd-line)}
.fd-dm-pv{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-top:16px}
.fd-dm-pv-card{padding:14px 16px;border-radius:14px;background:var(--fd-bg);border:1px solid var(--fd-line);min-width:0}
.fd-dm-pv-label{font-size:12px;font-weight:600;color:var(--fd-muted)}
.fd-dm-pv-val{font-size:25px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:3px}
.fd-dm-pv-foot{font-size:11.5px;color:var(--fd-faint);margin-top:3px}
.fd-dm-outcome{margin-top:14px;padding:14px 16px;border-radius:12px;border:1px solid var(--fd-line);background:#fff;font-size:13.5px}
.fd-dm-confirm{display:flex;gap:18px;align-items:flex-start;flex-wrap:wrap;justify-content:space-between}
.fd-dm-reason{width:min(460px,100%)}
.fd-dm-otp{display:flex;gap:8px}
.fd-dm-otp input{width:44px;height:52px;text-align:center;font-size:21px;font-weight:700;border-radius:11px;border:1px solid var(--fd-line);background:var(--fd-bg);font-variant-numeric:tabular-nums;color:var(--fd-ink)}
.fd-dm-otp input:focus-visible{outline:2px solid var(--fd-indigo);outline-offset:2px;background:#fff}
@media (max-width:560px){ .fd-dm-otp input{width:38px;height:46px;font-size:18px} .fd-dm-opt{padding-left:42px} }

  /* Email notifications. A message row carries what it is, how often it went
     out, and whether it may be switched at all. The locked rows are banded in
     red because "always on" is a property of the message, not a setting that
     happens to be switched on. */
  .fd-es-msg{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:16px;padding:14px 16px;border:1px solid var(--fd-line);border-radius:13px;background:var(--fd-bg);margin-bottom:9px}
  .fd-es-msg.fd-is-locked{background:#FDF2F1;border-color:rgba(192,38,26,.25)}
  .fd-es-code{font-size:11.5px;font-weight:700;color:var(--fd-muted);background:#fff;border:1px solid var(--fd-line);border-radius:6px;padding:3px 7px;min-width:40px;text-align:center;font-variant-numeric:tabular-nums;white-space:nowrap}
  .fd-es-name{font-weight:700;font-size:14.5px}
  .fd-es-what{margin:2px 0 0;color:var(--fd-muted);font-size:12.8px;max-width:74ch}
  .fd-es-sent{font-size:12px;color:var(--fd-muted);white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
  .fd-es-sent b{display:block;font-size:15px;color:var(--fd-ink);font-weight:700}
  .fd-es-lock{font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--fd-t1);white-space:nowrap}

  /* The switch. A checkbox that reads as a switch, because "on/off for every
     player" is a state, not a tick-box on a form. */
  .fd-sw{position:relative;width:44px;height:25px;flex:none;display:inline-block}
  .fd-sw input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
  .fd-sw span{position:absolute;inset:0;border-radius:999px;background:var(--fd-indigo);transition:background .15s;pointer-events:none}
  .fd-sw span::after{content:"";position:absolute;top:3px;left:22px;width:19px;height:19px;border-radius:50%;background:#fff;transition:left .15s}
  .fd-sw input:not(:checked)+span{background:#CBD5E1}
  .fd-sw input:not(:checked)+span::after{left:3px}
  .fd-sw input:focus-visible+span{outline:2px solid var(--fd-indigo);outline-offset:2px}

  .fd-es-reach{display:inline-block;margin-top:8px;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:600;background:var(--fd-indigo-50);color:var(--fd-indigo-700);font-variant-numeric:tabular-nums}

  .fd-es-tbl-wrap{overflow-x:auto}
  .fd-es-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
  .fd-es-tbl thead th{text-align:left;padding:9px 20px;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fd-muted);background:var(--fd-bg);border-bottom:1px solid var(--fd-line)}
  .fd-es-tbl tbody td{padding:10px 20px;border-bottom:1px solid var(--fd-line-2)}
  .fd-es-tbl tbody tr:last-child td{border-bottom:0}
  .fd-es-num{text-align:right;font-variant-numeric:tabular-nums}
  .fd-es-pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:700}
  .fd-es-ok{background:var(--fd-emerald-bg);color:var(--fd-emerald-ink);border:1px solid var(--fd-emerald-line)}
  .fd-es-warn{background:var(--fd-amber-bg);color:var(--fd-amber-ink);border:1px solid var(--fd-amber-line)}
  .fd-es-info{background:#F9F2FE;color:var(--fd-t3);border:1px solid rgba(126,34,206,.22)}
  .fd-es-bad{background:var(--fd-rose-bg);color:var(--fd-rose-ink);border:1px solid var(--fd-rose-line)}
  .fd-es-neutral{background:var(--fd-bg);color:var(--fd-muted);border:1px solid var(--fd-line)}

  .fd-es-test{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
  .fd-es-field{display:flex;flex-direction:column;gap:5px}
  .fd-es-field .fd-input{min-width:240px}
  .fd-es-frame{margin-top:16px;border:1px solid var(--fd-line);border-radius:12px;overflow:hidden;background:var(--fd-bg)}
  .fd-es-frame[hidden]{display:none}
  .fd-es-frame-head{padding:10px 14px;font-size:12.5px;font-weight:600;color:var(--fd-muted);border-bottom:1px solid var(--fd-line);background:#fff}
  .fd-es-frame iframe{display:block;width:100%;border:0;height:600px;background:#fff}
  .fd-es-pending{margin-bottom:16px;padding:13px 16px;border-radius:12px;border:1px solid var(--fd-line);background:var(--fd-bg);font-size:13.5px}

  /* Four columns will not fit a phone: the explanation was being squeezed to
     two characters a line. Each row becomes a stack instead. */
  @media (max-width:760px){
    .fd-es-msg{grid-template-columns:auto 1fr;row-gap:10px}
    .fd-es-sent,.fd-sw,.fd-es-lock{grid-column:2}
    .fd-es-sent{text-align:left}
    .fd-es-field .fd-input{min-width:0;width:100%}
    .fd-es-field{width:100%}
    .fd-es-tbl thead th,.fd-es-tbl tbody td{padding-left:14px;padding-right:14px}
  }

  /* Agents. Appointing somebody is a search, a choice and a confirmation, so
     the three sit in that order down the page rather than in one dense row. */
  .fd-ag-find{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
  .fd-ag-results{margin-top:14px;display:grid;gap:8px}
  .fd-ag-results:empty{margin-top:0}
  .fd-ag-hit{display:flex;gap:12px;align-items:flex-start;padding:11px 14px;border:1px solid var(--fd-line);border-radius:12px;background:var(--fd-bg);cursor:pointer}
  .fd-ag-hit:hover{border-color:var(--fd-indigo-200)}
  .fd-ag-hit input{margin:2px 0 0;width:17px;height:17px;accent-color:var(--fd-indigo);flex:none}
  .fd-ag-hit strong{display:block;font-size:14px}
  .fd-ag-sub{display:block;font-size:12px;color:var(--fd-muted);margin-top:2px}
  .fd-ag-flag{color:var(--fd-t1);font-weight:700}
  .fd-ag-chosen{margin-top:16px;padding-top:16px;border-top:1px solid var(--fd-line-2)}
  .fd-ag-chosen[hidden]{display:none}

  .fd-ag-wrap{overflow-x:auto}
  .fd-ag-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
  .fd-ag-tbl thead th{text-align:left;padding:9px 20px;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fd-muted);background:var(--fd-bg);border-bottom:1px solid var(--fd-line);white-space:nowrap}
  .fd-ag-tbl tbody td{padding:11px 20px;border-bottom:1px solid var(--fd-line-2);vertical-align:top}
  .fd-ag-tbl tbody tr:last-child td{border-bottom:0}
  .fd-ag-num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
  .fd-ag-rate{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
  .fd-ag-acts{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
  .fd-ag-pct{width:74px;padding:7px 9px;font-variant-numeric:tabular-nums}
  /* The agents table carries five different kinds of figure, so each is given
     its own colour rather than leaving seven columns of identical grey digits:
     purple for the network, gold for what is earned but still held, emerald for
     what has actually been paid, indigo for turnover and for the rate. */
  .fd-ag-who{display:flex;align-items:center;gap:11px;min-width:0}
  .fd-ag-av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;flex:none;
    background:var(--fd-indigo-100);color:var(--fd-indigo-700);font-size:13px;font-weight:800}
  .fd-ag-chip{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;
    font-size:11.5px;font-weight:700;white-space:nowrap;border:1px solid transparent;
    margin:0 6px 4px 0;font-variant-numeric:tabular-nums}
  .fd-ag-chip-net{background:#F6F0FF;color:var(--fd-t3);border-color:#E6D8FB}
  .fd-ag-chip-mem{background:var(--fd-amber-bg);color:var(--fd-t2);border-color:var(--fd-amber-line)}
  .fd-ag-chip-zero{background:var(--fd-hover);color:var(--fd-faint);border-color:var(--fd-line)}
  .fd-ag-turn{color:var(--fd-indigo);font-weight:800}
  .fd-ag-hold{color:var(--fd-t2);font-weight:800}
  /* A row is now an avatar tall, so its cells centre on it rather than hanging
     from the top.

     The table also has to fit. Seven columns at this file's 20px cell padding
     need more width than the sidebar leaves, and forcing the controls onto one
     line only moved the problem: Suspend ran off the right edge and had to be
     scrolled to. So the gutters pay for it instead, and a long address
     truncates rather than holding the whole row open. */
  .fd-ag-tbl tbody td{vertical-align:middle}
  .fd-ag-tbl thead th,.fd-ag-tbl tbody td{padding-left:12px;padding-right:12px}
  .fd-ag-who strong{display:block;max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .fd-ag-pct{width:64px}
  .fd-btn-sm{padding:7px 12px;font-size:13px}

  /* Top up a wallet. Four numbered steps down the page: money should not move
     until the person is on the screen in front of you, so nothing below step 1
     exists until an account has been found. */
  .fd-tu-step{display:flex;gap:12px;align-items:baseline;margin:0 0 10px}
  .fd-tu-step b{width:20px;height:20px;border-radius:50%;background:var(--fd-indigo-50);color:var(--fd-indigo-700);font-size:11px;font-weight:800;display:grid;place-items:center;flex:none;font-variant-numeric:tabular-nums}
  .fd-tu-step span{font-weight:700;font-size:13.5px}
  .fd-tu-find{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
  .fd-tu-find .fd-input{flex:1 1 260px}
  .fd-tu-who{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:14px;padding:14px 16px;border:1px solid var(--fd-emerald-line);background:var(--fd-emerald-bg);border-radius:13px}
  .fd-tu-avatar{width:42px;height:42px;border-radius:50%;background:var(--fd-indigo);color:#fff;flex:none;display:grid;place-items:center;font-weight:800;font-size:16px}
  .fd-tu-name{font-weight:800;font-size:15px;word-break:break-word}
  .fd-tu-sub{font-size:12.5px;color:var(--fd-emerald-ink);margin-top:1px}
  .fd-tu-bal{margin-left:auto;text-align:right;white-space:nowrap}
  .fd-tu-bal b{display:block;font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}
  .fd-tu-bal span{font-size:11.5px;color:var(--fd-emerald-ink)}
  .fd-tu-amt{height:60px;font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;width:100%}
  .fd-tu-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
  .fd-tu-chip{height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--fd-line);background:var(--fd-bg);font:inherit;font-size:13px;font-weight:700;color:var(--fd-ink-2);cursor:pointer;font-variant-numeric:tabular-nums}
  .fd-tu-chip:hover{border-color:var(--fd-indigo-200)}
  .fd-tu-wallets{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .fd-tu-confirm{margin-top:14px;padding:14px 16px;border-radius:12px;background:var(--fd-indigo-50);border:1px solid rgba(79,70,229,.28);font-size:13.5px}
  .fd-tu-confirm:empty{display:none}
  .fd-tu-pos{color:var(--fd-emerald-ink);font-weight:700}
  .fd-tu-neg{color:var(--fd-t1);font-weight:700}
  @media (max-width:700px){
    .fd-tu-wallets{grid-template-columns:1fr}
    .fd-tu-bal{margin-left:0;text-align:left;width:100%}
  }

  @media (max-width:860px){
    .fd-ag-tbl thead{display:none}
    .fd-ag-tbl tbody tr{display:block;border:1px solid var(--fd-line);border-radius:12px;background:var(--fd-bg);padding:12px 14px;margin:0 20px 10px}
    .fd-ag-tbl tbody td{display:block;border:0;padding:2px 0;text-align:left}
    .fd-ag-num{text-align:left}
    .fd-ag-acts{margin-top:10px}
  }

  /* ------------------------------------------------------------- wallets --
     The two wallets are told apart by colour, the same pair the dashboard's
     week-ahead cards use: indigo for real funds, the logo's gold for Free
     Reward. Nothing held is a dash, so the accounts that hold something are
     what the eye lands on. */
  .fd-wl-real{color:var(--fd-indigo);font-weight:700}
  .fd-wl-rew{color:#8A6400;font-weight:700}
  .fd-wl-zero{color:var(--fd-faint)}

  /* ------------------------------------------- dashboard: the week ahead --
     Seven cards, one per upcoming draw, each split into real funds (indigo)
     and Free Reward (the logo's gold). The two colours carry the meaning, so
     the split reads before any of the figures do. */
  .fd-do-wk{display:flex;gap:18px;align-items:baseline;flex-wrap:wrap}
  .fd-do-wk>div{text-align:right}
  .fd-do-k{display:block;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--fd-faint);font-weight:600}
  .fd-do-v{font-size:16px;font-weight:800;font-variant-numeric:tabular-nums}
  .fd-do-a{color:var(--fd-indigo)}
  .fd-do-b{color:#8A6400}
  .fd-do-rail{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:10px}
  .fd-do-card{background:#fff;border:1px solid var(--fd-line);border-radius:12px;padding:12px;min-width:0}
  .fd-do-card.is-next{border-color:var(--fd-indigo-200);box-shadow:0 0 0 2px var(--fd-indigo-50)}
  .fd-do-card.is-empty{background:#FCFDFE}
  .fd-do-no{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:14px;font-weight:800}
  .fd-do-next{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fd-indigo);background:var(--fd-indigo-50);border:1px solid var(--fd-indigo-200);border-radius:999px;padding:1px 6px}
  .fd-do-when{margin-bottom:10px;font-size:11.5px;color:var(--fd-muted)}
  .fd-do-tot{font-size:19px;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}
  .fd-do-unit{font-size:11px;font-weight:700;color:var(--fd-faint);margin-left:3px}
  .fd-do-totlab{font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--fd-faint);font-weight:600}
  .fd-do-line{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11.5px;
    font-variant-numeric:tabular-nums;padding:2px 0}
  .fd-do-line b{font-weight:700}
  /* The two wallet figures are what the card is for, so they carry the weight
     rather than sitting under a larger headline. */
  .fd-do-line.fd-do-big{font-size:13px;padding:4px 0}
  .fd-do-line.fd-do-big b{font-size:15px;font-weight:800;letter-spacing:-.01em}
  .fd-do-key{display:inline-flex;align-items:center;gap:5px;color:var(--fd-muted)}
  .fd-do-dot{width:8px;height:8px;border-radius:3px;display:block;flex:none}
  .fd-do-dr{background:var(--fd-indigo)}
  .fd-do-dw{background:#F2B200}
  .fd-do-bar{display:flex;height:8px;margin:9px 0 8px;border-radius:999px;overflow:hidden;background:var(--fd-line)}
  .fd-do-bar i{display:block;height:100%}
  .fd-do-bar .fd-do-r{background:var(--fd-indigo)}
  .fd-do-bar .fd-do-w{background:#F2B200}
  .fd-do-split{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;font-variant-numeric:tabular-nums}
  .fd-do-split .fd-do-a,.fd-do-split .fd-do-b{font-weight:700}
  .fd-do-none{color:var(--fd-faint);font-style:italic;font-weight:400}
  .fd-do-meta{margin-top:8px;padding-top:8px;border-top:1px solid var(--fd-line-2);font-size:11.5px;color:var(--fd-muted)}
  @media (max-width:560px){
    .fd-do-rail{grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px}
    .fd-do-card{padding:10px}
  }

/* ---- Dashboard: who is in a draw -------------------------------------------
   Opened from an outlook card, under the cards. No scroll container anywhere:
   the table is as long as the list and the page scrolls, and on a narrow
   screen each player becomes a stacked card instead of a wider table. */
.fd-dp{margin-bottom:16px;overflow:hidden;scroll-margin-top:84px}
.fd-dp-sum{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-bottom:1px solid var(--fd-line-2)}
.fd-dp-kpi{min-width:0;padding:14px 20px;border-right:1px solid var(--fd-line-2)}
.fd-dp-kpi:last-child{border-right:0}
.fd-dp-kpi span{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fd-muted)}
.fd-dp-kpi b{display:block;margin-top:4px;font-size:19px;font-weight:800;font-variant-numeric:tabular-nums;color:#0F172A;white-space:nowrap}
.fd-dp-kpi.is-total{background:var(--fd-indigo-50)}
.fd-dp-kpi.is-total b{color:var(--fd-indigo)}
.fd-dp-table{width:100%;border-collapse:collapse;font-size:13.5px}
.fd-dp-table th{padding:10px 20px;background:var(--fd-bg);border-bottom:1px solid var(--fd-line);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--fd-muted);text-align:left;white-space:nowrap}
.fd-dp-table td{padding:12px 20px;border-bottom:1px solid var(--fd-line-2);vertical-align:middle}
.fd-dp-table .fd-r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.fd-dp-table tbody tr:hover td{background:#FAFBFF}
.fd-dp-table tfoot td{background:var(--fd-bg);font-weight:800;color:#0F172A;border-bottom:0}
.fd-dp-who{display:flex;align-items:center;gap:12px;min-width:0}
.fd-dp-av{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--fd-indigo-50);color:var(--fd-indigo);font-weight:800;font-size:13px}
.fd-dp-id{min-width:0}
.fd-dp-name{display:block;font-weight:700;color:#0F172A;text-decoration:none;overflow-wrap:anywhere}
a.fd-dp-name:hover{color:var(--fd-indigo);text-decoration:underline}
.fd-dp-sub{display:block;margin-top:2px;font-size:12px;color:var(--fd-muted);overflow-wrap:anywhere}
.fd-dp-total strong{display:block;font-size:14px}
.fd-dp-share{display:inline-flex;align-items:center;gap:6px;margin-top:5px;font-size:11px;color:var(--fd-muted)}
.fd-dp-bar{display:inline-block;width:60px;height:4px;border-radius:4px;background:var(--fd-line-2);overflow:hidden}
.fd-dp-bar i{display:block;height:100%;background:var(--fd-indigo);border-radius:4px}
@media (max-width:1100px){
  .fd-dp-sum{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fd-dp-kpi:nth-child(3n){border-right:0}
  .fd-dp-kpi:nth-child(-n+3){border-bottom:1px solid var(--fd-line-2)}
}
@media (max-width:760px){
  .fd-dp-sum{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fd-dp-kpi{border-right:0;border-bottom:1px solid var(--fd-line-2)}
  .fd-dp-kpi:nth-child(odd){border-right:1px solid var(--fd-line-2)}
  .fd-dp-table thead{display:none}
  .fd-dp-table,.fd-dp-table tbody,.fd-dp-table tfoot,.fd-dp-table tr{display:block;width:100%}
  .fd-dp-table tr{padding:12px 16px;border-bottom:1px solid var(--fd-line-2)}
  .fd-dp-table tfoot tr{background:var(--fd-bg)}
  .fd-dp-table td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:3px 0;border:0;background:none}
  .fd-dp-table td[data-label]::before{content:attr(data-label);font-size:12.5px;font-weight:500;color:var(--fd-muted)}
  .fd-dp-table td[data-label="Player"]{padding-bottom:8px}
  .fd-dp-table td[data-label="Player"]::before,.fd-dp-table td[data-label=""]::before{content:none}
  .fd-dp-table .fd-r{text-align:right}
  .fd-dp-total div{text-align:right}
}

/* The logo's four colours on the draw players panel. Red #C0261A, gold #F2B200
   (text in its darker #A16207 so it stays readable), purple #7E22CE, indigo.
   Money keeps the outlook cards' meaning: real funds indigo, Free Reward gold. */
.fd-dp-kpi{position:relative}
.fd-dp-kpi::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--fd-line-2)}
.fd-dp-k-red::before{background:#C0261A}
.fd-dp-k-gold::before{background:#F2B200}
.fd-dp-k-purple::before{background:#7E22CE}
.fd-dp-k-indigo::before{background:var(--fd-indigo)}
.fd-dp-k-total::before{background:var(--fd-indigo)}
.fd-dp-k-red b{color:#C0261A}
.fd-dp-k-gold b{color:#A16207}
.fd-dp-k-purple b{color:#7E22CE}
.fd-dp-k-indigo b{color:var(--fd-indigo-700)}
.fd-dp-kpi.is-total{background:var(--fd-indigo)}
.fd-dp-kpi.is-total span{color:#E0E7FF}
.fd-dp-kpi.is-total b{color:#fff}
.fd-dp-table td.fd-dp-real{color:var(--fd-indigo-700)}
.fd-dp-table td.fd-dp-rew{color:#A16207}
.fd-dp-table tfoot td.fd-dp-grand{color:var(--fd-indigo)}
.fd-dp-c0 .fd-dp-av{background:#FEF2F2;color:#C0261A;box-shadow:inset 0 0 0 1px #FECACA}
.fd-dp-c1 .fd-dp-av{background:#FFFBEB;color:#A16207;box-shadow:inset 0 0 0 1px #FDE68A}
.fd-dp-c2 .fd-dp-av{background:#FAF5FF;color:#7E22CE;box-shadow:inset 0 0 0 1px #E9D5FF}
.fd-dp-c3 .fd-dp-av{background:var(--fd-indigo-50);color:var(--fd-indigo);box-shadow:inset 0 0 0 1px var(--fd-indigo-200)}
.fd-dp-c0 .fd-dp-bar i{background:#C0261A}
.fd-dp-c1 .fd-dp-bar i{background:#F2B200}
.fd-dp-c2 .fd-dp-bar i{background:#7E22CE}
.fd-dp-c3 .fd-dp-bar i{background:var(--fd-indigo)}

/* ---- Sold-out numbers (screens/sold-out.js) ---- */
.so-bar{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.so-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.so-field>span{font-size:12.5px;font-weight:600;color:var(--fd-muted)}
.so-find{width:150px;height:44px;text-align:center;font-size:20px;font-weight:800;letter-spacing:.3em;font-variant-numeric:tabular-nums;padding-left:.3em}
.so-verdict{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--fd-line);background:var(--fd-bg);font-size:13.5px;color:var(--fd-muted)}
.so-verdict.so-is-out{background:var(--fd-rose-bg);border-color:var(--fd-rose-line);color:var(--fd-rose-ink)}
.so-verdict.so-is-open{background:var(--fd-emerald-bg);border-color:var(--fd-emerald-line);color:var(--fd-emerald-ink)}
.so-verdict strong{font-size:15px}
.so-body{display:grid;grid-template-columns:minmax(260px,340px) 1fr;gap:20px;margin-top:18px;align-items:start}
@media (max-width:960px){ .so-body{grid-template-columns:1fr} }
.so-card{border:1px solid var(--fd-line);border-radius:14px;padding:14px 16px;background:#fff;min-width:0}
.so-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.so-card-title{font-size:13.5px;font-weight:700;color:var(--fd-ink)}
.so-card-sub{font-size:12px;color:var(--fd-muted)}
.so-map{display:grid;grid-template-columns:22px repeat(10,1fr);gap:3px;font-variant-numeric:tabular-nums}
.so-map-axis{font-size:10.5px;font-weight:700;color:var(--fd-faint);display:grid;place-items:center}
.so-cell{aspect-ratio:1;border:0;border-radius:5px;padding:0;cursor:pointer;background:var(--fd-line-2);color:transparent;font-size:10px;font-weight:700;transition:transform .08s}
.so-cell:hover{transform:scale(1.12);color:var(--fd-ink)}
.so-cell[data-lv="1"]{background:#FFE4E6}
.so-cell[data-lv="2"]{background:#FDA4AF}
.so-cell[data-lv="3"]{background:#FB7185;color:#fff}
.so-cell[data-lv="4"]{background:var(--fd-rose);color:#fff}
.so-cell[data-lv="3"]:not(:hover),.so-cell[data-lv="4"]:not(:hover){color:transparent}
.so-cell[aria-pressed="true"]{outline:2px solid var(--fd-indigo);outline-offset:1px}
.so-legend{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:11.5px;color:var(--fd-muted)}
.so-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
.so-groups{display:flex;flex-direction:column;gap:14px}
.so-group-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:12.5px;font-weight:700;color:var(--fd-ink-2)}
.so-group-head::after{content:"";flex:1;height:1px;background:var(--fd-line-2)}
.so-group-head .fd-pill{font-size:11px}
.so-nums{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.so-num .fd-digit{width:19px;height:25px;font-size:13px;border-radius:5px;color:var(--fd-rose-ink);border-color:var(--fd-rose-line);box-shadow:inset 0 -2px 0 var(--fd-rose-bg)}
.so-num.so-is-hit .fd-digit{background:var(--fd-rose);border-color:var(--fd-rose);color:#fff;box-shadow:inset 0 -2px 0 rgba(0,0,0,.2)}
.so-empty{padding:28px 12px;text-align:center;color:var(--fd-muted)}

/* Wins as a tree: the draw, then what it paid, prize by prize. */
.sib-tree{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.sib-tree-draw{background:var(--fd-surface);border:1px solid var(--fd-emerald-line);border-radius:10px;
  overflow:hidden}
.sib-tree-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:7px 10px;background:var(--fd-emerald-bg);font-size:12.5px}
.sib-tree-head small{display:block;font-size:10.5px;color:var(--fd-muted);font-weight:400}
.sib-tree-head b{font-variant-numeric:tabular-nums;color:var(--fd-emerald-ink)}
.sib-tree-wins{list-style:none;margin:0;padding:0}
.sib-tree-wins li{display:flex;align-items:baseline;gap:9px;padding:7px 10px;font-size:12px;
  border-top:1px solid var(--fd-line-2)}
.sib-tree-num{font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.sib-tree-what{flex:1;min-width:0}
.sib-tree-what small{display:block;font-size:10.5px;color:var(--fd-muted)}
.sib-tree-wins li b{font-variant-numeric:tabular-nums;white-space:nowrap}

/* The two wallets, and the numbers bought, by the day they were bought. */
.sib-wallets{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sib-wallet{border:1px solid var(--fd-line);border-radius:11px;padding:9px 10px;background:var(--fd-surface);
  display:grid;gap:1px;min-width:0}
.sib-wallet.is-reward{background:linear-gradient(180deg,#FBF7FF,var(--fd-surface));border-color:#E9D5FF}
.sib-wallet-name{font-size:10px;font-weight:700;color:var(--fd-muted);text-transform:uppercase;
  letter-spacing:.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sib-wallet-amt{font-size:18px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  line-height:1.2}
.sib-wallet-note{font-size:10.5px;color:var(--fd-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sib-wallet-foot{margin:9px 0 0;font-size:11.5px;color:var(--fd-muted)}
.sib-bought{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.sib-bought-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:12px}
.sib-bought-head b{font-weight:700}
.sib-bought-head span{color:var(--fd-muted);font-size:11px}
.sib-bought-nums{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.sib-bought-nums span{font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums;
  background:var(--fd-hover);border:1px solid var(--fd-line);border-radius:6px;padding:2px 6px}
.sib-dl dt{color:var(--fd-muted);font-size:12px}
.sib-dl dd{font-size:12.5px}
.sib-id{display:inline-block;font-variant-numeric:tabular-nums;background:var(--fd-hover);
  border:1px solid var(--fd-line);border-radius:6px;padding:1px 7px;font-size:12px}
.sib-ref{overflow-wrap:anywhere;text-align:right}

/* The win message, as the console sees it. */
.sib-winmsg{background:linear-gradient(160deg,var(--fd-indigo-50),var(--fd-surface));
  border-color:var(--fd-indigo-200)}
.sib-winmsg-top{display:flex;align-items:baseline;gap:8px;font-size:12px;color:var(--fd-muted);
  margin-bottom:8px}
.sib-winmsg-top b{font-size:16px;color:var(--fd-ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.sib-winmsg ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px}
.sib-winmsg li{display:flex;align-items:baseline;gap:9px;background:var(--fd-surface);
  border:1px solid var(--fd-line);border-radius:8px;padding:6px 9px;font-size:12px}
.sib-winmsg li b{font-variant-numeric:tabular-nums;white-space:nowrap}
.sib-winmsg-foot{margin-top:8px;font-size:11px;color:var(--fd-faint)}

/* The win message in the console.
   The player's own card is the loud one — deep violet, gold, fireworks, and
   right for the moment somebody wins. This is an inbox on a work screen, and a
   dark card shouting out of a list of pale ones is noise, not news. So it takes
   the same shape and the same figures in the console's own quiet green, which
   is what every other amount on this screen is already wearing. */
.sib-msg .sib-bubble.sib-winmsg{position:relative;overflow:hidden;padding:0;border-radius:14px;
  background:linear-gradient(165deg,var(--fd-emerald-bg),var(--fd-surface) 62%);
  border:1px solid var(--fd-emerald-line);color:var(--fd-ink)}
.sib-winmsg-rays{display:none}
.sib-winmsg-head{position:relative;display:flex;align-items:center;gap:9px;padding:11px 13px 9px}
.sib-winmsg-trophy{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;
  color:#92400E;background:linear-gradient(140deg,#FDE68A,#FBBF24)}
.sib-winmsg-head b{display:block;font-size:10.5px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--fd-emerald-ink)}
.sib-winmsg-head small{display:block;font-size:11px;color:var(--fd-muted)}
.sib-winmsg-amt{margin-left:auto;font-size:20px;font-weight:800;letter-spacing:-.03em;
  color:var(--fd-emerald-ink);font-variant-numeric:tabular-nums}
.sib-winmsg-amt small{font-size:10.5px;font-weight:700;color:var(--fd-muted);margin-left:5px}
.sib-winmsg-digits{position:relative;display:flex;gap:5px;padding:0 13px 10px}
.sib-winmsg-digits span{width:28px;height:32px;border-radius:8px;display:grid;place-items:center;
  font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;
  background:var(--fd-surface);border:1px solid var(--fd-emerald-line);color:var(--fd-ink)}
.sib-winmsg ul{position:relative;padding:0 13px}
.sib-winmsg li{background:var(--fd-surface);border-color:var(--fd-line);color:var(--fd-ink)}
.sib-winmsg li b{color:var(--fd-emerald-ink)}
.sib-winmsg .sib-tree-what small{color:var(--fd-muted)}
.sib-winmsg-foot{position:relative;margin:9px 0 0;padding:8px 13px 11px;font-size:11px;
  color:var(--fd-muted);border-top:1px solid var(--fd-line-2)}
.sib-confetti{position:absolute;inset:0;pointer-events:none;z-index:4}
.sib-scroll{position:relative}