#app{
    color-scheme:light !important;
    --bg:#EDEAE1; --surface:#F7F4EC; --surface-hi:#F1EDE3;
    --dark-band:#181616; --on-dark:#F3F0EA;
    --ink:#181616; --ink-dim:#6B6055; --ink-faint:#8A7F70;
    --accent-fill:#be9e5e; --accent-text:#82682f; --accent-soft:rgba(190,158,94,.16);
    --felt-line:#0E8F55; --felt-wash:rgba(14,143,85,.16);
    --tile-blue:#25588F; --tile-blue-soft:rgba(37,88,143,.12);
    --tile-plum:#71458C; --tile-plum-soft:rgba(113,69,140,.12);
    --good:#0b7a2c; --good-soft:rgba(11,122,44,.14);
    --critical:#b5432f; --critical-soft:rgba(181,67,47,.14);
    --neutral:#6B6055; --neutral-soft:rgba(107,96,85,.14);
    --line:rgba(24,22,22,.13); --line-strong:rgba(24,22,22,.26);
    --shadow:rgba(24,22,22,.16);
    --radius:10px;
  }
  @media (prefers-color-scheme: dark){
    #app{
      color-scheme:dark !important;
      --bg:#181616; --surface:#221F1D; --surface-hi:#2A2724;
      --dark-band:#000000; --on-dark:#F3F0EA;
      --ink:#F3F0EA; --ink-dim:#C9BEA9; --ink-faint:#9C9280;
      --accent-fill:#be9e5e; --accent-text:#be9e5e; --accent-soft:rgba(190,158,94,.2);
      --felt-line:#3FE08A; --felt-wash:rgba(63,224,138,.2);
      --tile-blue:#6FA8E8; --tile-blue-soft:rgba(111,168,232,.16);
      --tile-plum:#D0A8EE; --tile-plum-soft:rgba(208,168,238,.16);
      --good:#3ecb70; --good-soft:rgba(62,203,112,.16);
      --critical:#e2775f; --critical-soft:rgba(226,119,95,.16);
      --neutral:#C9BEA9; --neutral-soft:rgba(201,190,169,.14);
      --line:rgba(243,240,234,.14); --line-strong:rgba(243,240,234,.28);
      --shadow:rgba(0,0,0,.5);
    }
  }

  #app, #app *{ box-sizing:border-box !important; }
  /* Full-width background wrapper: on a page whose surrounding area is not ours
     to style (e.g. a WordPress theme's content column), this fills that area
     with our own background instead of leaving the host's default showing. */
  #app{
    background-color:var(--bg) !important; color:var(--ink) !important;
    background-image:radial-gradient(circle at 1px 1px, rgba(127,122,112,.18) 1px, transparent 0) !important;
    background-size:16px 16px !important;
    font-family:"Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif !important;
    font-size:15px !important; line-height:1.5 !important;
    -webkit-font-smoothing:antialiased;
  }

  #view.enter{ animation:viewIn .35s cubic-bezier(.2,.7,.3,1) both !important; }
  @keyframes viewIn{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
  @media (prefers-reduced-motion: reduce){ #view.enter{ animation:none !important; } }
  .tabular{ font-variant-numeric:tabular-nums !important; font-family:"IBM Plex Mono", ui-monospace, monospace !important; }

  #app h1, #app h2, #app h3, #app h4, #app h5, #app h6{ font-family:"Playfair Display", Georgia, serif !important; text-wrap:balance !important; margin:0 !important; color:var(--ink) !important; }
  #app a{ color:var(--accent-text) !important; }
  #app button{ font-family:inherit !important; }
  #app ::selection{ background:var(--accent-fill) !important; color:#fff !important; }

  .app{ max-width:1180px !important; margin:0 auto !important; padding:0 20px 64px !important; }

  /* ---------- Header ---------- */
  .site-header{
    position:sticky !important; top:0 !important; z-index:40 !important;
    background:color-mix(in oklab, var(--bg) 88%, transparent) !important;
    backdrop-filter:blur(10px) !important;
    border-bottom:1px solid var(--line) !important;
  }
  .header-inner{
    max-width:1180px !important; margin:0 auto !important; padding:14px 20px 12px !important;
    display:flex !important; align-items:center !important; gap:16px !important; flex-wrap:wrap !important;
  }
  .wordmark{ display:flex !important; align-items:center !important; gap:10px !important; margin-right:auto !important; }
  .wordmark-text{ cursor:pointer !important; transition:opacity .15s !important; }
  .wordmark-text:hover{ opacity:.75 !important; }
  .wordmark-text:focus-visible{ outline:2px solid var(--accent-text) !important; outline-offset:3px !important; border-radius:4px !important; }
  .wordmark h1{ font-family:"Poiret One", cursive !important; font-size:28px !important; font-weight:400 !important; letter-spacing:.03em !important; text-transform:uppercase !important; }
  .wordmark .sub{ font-size:11.5px !important; color:var(--ink-faint) !important; text-transform:uppercase !important; letter-spacing:.09em !important; margin-top:1px !important; font-family:"Open Sans",sans-serif !important; }

  .header-search{ position:relative !important; display:flex !important; align-items:center !important; }
  .header-search .search-ic{ position:absolute !important; left:10px !important; font-size:12px !important; opacity:.6 !important; pointer-events:none !important; }
  .header-search input{
    width:130px !important; padding:6px 10px 6px 28px !important; border-radius:999px !important; border:1px solid var(--line-strong) !important;
    background:var(--surface) !important; color:var(--ink) !important; font-size:12.5px !important; font-family:inherit !important;
    transition:width .2s ease !important;
  }
  .header-search input:focus{ width:190px !important; outline:2px solid var(--accent-text) !important; outline-offset:1px !important; }

  .search-dropdown{
    position:absolute !important; top:calc(100% + 6px) !important; left:0 !important; min-width:210px !important;
    background:var(--surface) !important; border:1px solid var(--line-strong) !important; border-radius:10px !important;
    box-shadow:0 10px 24px var(--shadow) !important; list-style:none !important; margin:0 !important; padding:4px !important;
    max-height:280px !important; overflow-y:auto !important; display:none !important; z-index:50 !important;
  }
  .search-dropdown.show{ display:block !important; }
  .search-dropdown li{ padding:7px 11px !important; border-radius:6px !important; cursor:pointer !important; font-size:13px !important; transition:background .1s !important; }
  .search-dropdown li:hover{ background:var(--accent-soft) !important; color:var(--accent-text) !important; }
  .search-dropdown li.no-match{ cursor:default !important; color:var(--ink-faint) !important; }
  .search-dropdown li.no-match:hover{ background:none !important; color:var(--ink-faint) !important; }

  .eightball{ width:30px !important; height:30px !important; flex:none !important; animation:spin 9s linear infinite !important; cursor:pointer !important; transition:filter .2s !important; }
  .eightball:hover{ opacity:.85 !important; }
  .eightball.zoom{ animation:spinfast .6s cubic-bezier(.3,.1,.3,1) 1 !important; }
  @media (prefers-reduced-motion: reduce){ .eightball{ animation:none !important; } .eightball.zoom{ animation:none !important; } }
  @keyframes spin{ to{ transform:rotate(360deg); } }
  @keyframes spinfast{ to{ transform:rotate(1080deg); } }

  nav.tabs{ display:flex !important; gap:2px !important; background:var(--surface) !important; border:1px solid var(--line) !important; border-radius:999px !important; padding:3px !important; }
  nav.tabs button{
    border:none !important; background:transparent !important; color:var(--ink-dim) !important;
    padding:8px 14px 8px 11px !important; border-radius:999px !important; font-size:13px !important; font-weight:600 !important;
    cursor:pointer !important; letter-spacing:.01em !important; transition:background .18s, color .18s, transform .18s !important;
    display:inline-flex !important; align-items:center !important; gap:6px !important;
  }
  nav.tabs button.icon-only{ padding:8px 11px !important; }
  nav.tabs button .ic{ font-size:12px !important; line-height:1 !important; filter:grayscale(.15) !important; transition:transform .3s !important; }
  nav.tabs button:hover{ color:var(--ink) !important; transform:translateY(-1px) !important; }
  nav.tabs button:hover .ic{ transform:scale(1.25) rotate(-8deg) !important; }
  nav.tabs button.active{ background:var(--dark-band) !important; color:var(--on-dark) !important; box-shadow:0 2px 10px rgba(190,158,94,.35) !important; }
  nav.tabs button:focus-visible{ outline:2px solid var(--accent-text) !important; outline-offset:2px !important; }

  .cue-divider{
    height:3px !important; margin:40px 0 30px !important; border-radius:3px !important;
    background:linear-gradient(90deg, var(--accent-fill) 0 22px, var(--line) 22px 100%) !important;
    position:relative !important;
  }
  .cue-divider::before{
    content:"" !important; position:absolute !important; left:0 !important; top:50% !important; translate:0 -50% !important;
    width:9px !important; height:9px !important; border-radius:50% !important; background:var(--dark-band) !important;
    box-shadow:0 0 0 2px var(--accent-fill) !important;
  }
  .cue-divider::after{
    content:"" !important; position:absolute !important; right:16% !important; top:50% !important; translate:0 -65% !important;
    width:7px !important; height:7px !important; border-radius:50% !important; background:#1E5FAE !important;
    box-shadow:26px 5px 0 -1px #D82F2F, 46px -6px 0 -1.5px #F4C430 !important;
    opacity:.65 !important; animation:driftballs 5s ease-in-out infinite alternate !important;
  }
  @keyframes driftballs{ from{ transform:translate(0,0); } to{ transform:translate(-4px,2px); } }
  @media (prefers-reduced-motion: reduce){ .cue-divider::after{ animation:none !important; } }

  /* ---------- Stat tiles ---------- */
  .stat-grid{ display:grid !important; grid-template-columns:repeat(auto-fit, minmax(170px,1fr)) !important; gap:12px !important; }
  .stat-tile{
    background:var(--surface); border:1px solid var(--line) !important; border-radius:var(--radius) !important;
    padding:16px 16px 14px !important; transition:transform .2s ease, box-shadow .2s ease !important;
    perspective:480px !important;
  }
  .stat-tile:hover{ transform:translateY(-3px) !important; box-shadow:0 10px 22px var(--shadow) !important; }
  .flip-zone{ transform-style:preserve-3d !important; opacity:1 !important; }
  .stat-tile .label{ font-size:11px !important; text-transform:uppercase !important; letter-spacing:.08em !important; color:var(--ink-faint) !important; font-weight:600 !important; }
  .stat-tile .value{ font-family:"Playfair Display", serif !important; font-weight:700 !important; font-size:30px !important; margin-top:4px !important; font-variant-numeric:tabular-nums !important; }
  .stat-tile .value small{ font-size:15px !important; font-weight:500 !important; color:var(--ink-dim) !important; font-family:"Open Sans",sans-serif !important; }
  .stat-tile .who{ margin-top:6px !important; font-size:13px !important; color:var(--ink-dim) !important; transition:opacity .2s !important; min-height:16px !important; }
  .stat-tile .who b{ color:var(--ink) !important; font-weight:600 !important; }

  /* ---------- Sections / cards ---------- */
  section.block{ margin-top:8px !important; }
  .block-head{ display:flex !important; align-items:baseline !important; justify-content:space-between !important; gap:12px !important; margin-bottom:14px !important; flex-wrap:wrap !important; }
  .block-head h2{ font-size:21px !important; font-weight:600 !important; }
  .block-head .hint{ font-size:12.5px !important; color:var(--ink-faint) !important; }

  .card{ background:var(--surface) !important; border:1px solid var(--line); border-radius:var(--radius) !important; overflow:hidden !important; transition:box-shadow .2s ease !important; }
  .card:hover{ box-shadow:0 8px 20px var(--shadow) !important; }
  .card + .card{ margin-top:14px !important; }
  .card-title{
    background:var(--dark-band) !important; color:var(--on-dark) !important; position:relative !important;
    padding:9px 16px 12px !important; font-weight:600 !important; font-size:14px !important; letter-spacing:.01em !important;
    display:flex !important; align-items:center !important; justify-content:space-between !important; gap:8px !important;
  }
  .card-title::after{
    content:"" !important; position:absolute !important; left:16px !important; right:16px !important; bottom:3px !important; height:2px !important;
    background-image:radial-gradient(circle, var(--accent-fill) 1.4px, transparent 1.6px) !important;
    background-size:13px 2px !important; background-repeat:repeat-x !important; opacity:.55 !important;
  }
  .card-title .n{ font-size:11px !important; opacity:.75 !important; font-weight:500 !important; }

  .leader-list{ list-style:none !important; margin:0 !important; padding:6px 4px !important; }
  .leader-list li{
    display:grid !important; grid-template-columns:28px 1fr auto !important; align-items:center !important; gap:12px !important;
    padding:10px 14px !important; border-radius:7px !important; cursor:pointer !important; min-height:44px !important;
    transition:background .15s, transform .15s !important;
  }
  .leader-list li:hover{ background:var(--accent-soft) !important; transform:translateX(3px) !important; }
  .leader-list li.top3{ background:rgba(190,158,94,.09) !important; }
  .leader-list li.top3:hover{ background:var(--accent-soft) !important; }
  .ball-badge{ width:26px !important; height:26px !important; display:block !important; transition:transform .35s cubic-bezier(.3,1.4,.5,1) !important; }
  .leader-list li:hover .ball-badge, table.std tbody tr:hover .ball-badge{ transform:rotate(-30deg) scale(1.12) !important; }
  [role="button"]{ outline:none !important; }
  [role="button"]:focus-visible{ outline:2px solid var(--accent-text) !important; outline-offset:-2px !important; }
  .leader-list .rk{ font-family:"Playfair Display",serif !important; font-weight:700 !important; color:var(--ink-faint) !important; font-size:15px !important; }
  .leader-list li:nth-child(1) .rk, .leader-list li:nth-child(2) .rk, .leader-list li:nth-child(3) .rk{ color:var(--accent-text) !important; }
  .leader-list .nm{ font-weight:400 !important; font-size:14.5px !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; min-width:0 !important; transition:color .15s !important; }
  .leader-list li:hover .nm{ color:var(--accent-text) !important; }
  .leader-list .vv{ font-family:"IBM Plex Mono",monospace !important; font-size:13.5px !important; color:var(--ink-dim) !important; text-align:right !important; white-space:nowrap !important; flex:none !important; }
  .leader-list .vv b{ color:var(--ink) !important; font-weight:600 !important; }

  .leaders-grid{ display:grid !important; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)) !important; gap:14px !important; align-items:stretch !important; }
  .leaders-grid .card{ display:flex !important; flex-direction:column !important; }
  .leaders-grid .card .leader-list{ flex:1 !important; }
  .leaders-grid.cols3{ grid-template-columns:repeat(3, 1fr) !important; }
  @media (max-width:920px){ .leaders-grid.cols3{ grid-template-columns:repeat(2, 1fr) !important; } }
  @media (max-width:600px){ .leaders-grid.cols3{ grid-template-columns:1fr !important; } }

  .leader-list.matchline li{ grid-template-columns:1fr auto 1fr !important; cursor:default !important; }
  .leader-list.matchline .nm{ cursor:pointer !important; font-weight:400 !important; font-size:14px !important; transition:color .15s !important; }
  .leader-list.matchline .nm.nm-dim{ color:var(--ink-dim) !important; }
  .leader-list.matchline li .nm:hover{ color:var(--accent-text) !important; }

  /* ---------- Tables ---------- */
  .table-scroll{ overflow-x:auto !important; }
  table.std{ width:100% !important; border-collapse:collapse !important; font-size:14.5px !important; min-width:560px !important; }
  table.std th, table.std td{ padding:11px 12px !important; border-bottom:1px solid var(--line) !important; text-align:right !important; white-space:nowrap !important; vertical-align:middle !important; line-height:26px !important; }
  table.std thead th{
    text-align:right !important; font-size:11px !important; text-transform:uppercase !important; letter-spacing:.06em !important;
    color:var(--ink-faint) !important; font-weight:600 !important; border-bottom:1px solid var(--line-strong) !important; line-height:normal !important;
  }
  table.std tbody tr{ cursor:pointer !important; transition:background .15s !important; }
  table.std tbody tr:hover{ background:var(--accent-soft) !important; }
  table.std tbody tr.top3{ background:rgba(190,158,94,.09) !important; }
  table.std tbody tr.titlewin{ background:rgba(190,158,94,.14) !important; }
  table.std tbody tr.titlewin td:nth-child(2){ font-weight:700 !important; color:var(--accent-text) !important; }
  table.std.player-history td.trophy-cell{ width:26px !important; text-align:center !important; padding-left:4px !important; padding-right:0 !important; font-size:14px !important; }
  table.std td.plc{ font-family:"Playfair Display",serif !important; font-weight:700 !important; font-size:15.5px !important; }
  table.std td.diff-pos{ color:var(--good) !important; }
  table.std td.diff-neg{ color:var(--critical) !important; }
  .star-ekt{ color:var(--accent-text) !important; font-weight:700 !important; margin-left:3px !important; }
  .name-cell{ display:flex !important; align-items:center !important; gap:10px !important; min-width:0 !important; }
  .name-cell .nm-text{ overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; min-width:0 !important; flex:1 1 auto !important; }
  .plc-slot{
    display:inline-flex !important; align-items:center !important; justify-content:center !important; flex:none !important;
    width:28px !important; font-family:"Playfair Display",serif !important; font-weight:700 !important; font-size:15.5px !important; color:var(--ink-faint) !important;
  }

  table.std.rank-table th:nth-child(1), table.std.rank-table td:nth-child(1){ text-align:left !important; white-space:normal !important; }
  table.std.rank-table tbody tr:hover td:nth-child(1){ color:var(--accent-text) !important; }
  table.std.player-history th:nth-child(2), table.std.player-history td:nth-child(2),
  table.std.player-history th:nth-child(3), table.std.player-history td:nth-child(3){ text-align:left !important; white-space:nowrap !important; }

  /* ---------- Season controls ---------- */
  .season-picker{ display:flex !important; align-items:center !important; gap:10px !important; flex-wrap:wrap !important; }
  .season-picker select{
    background:var(--surface) !important; color:var(--ink) !important; border:1px solid var(--line-strong) !important;
    border-radius:7px !important; padding:7px 28px 7px 12px !important; font-size:13.5px !important; font-family:inherit !important;
    -webkit-appearance:none; -moz-appearance:none; appearance:none !important;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%238A7F70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat:no-repeat !important; background-position:right 11px center !important;
  }
  .stepper{ display:flex !important; gap:4px !important; }
  .stepper button{
    width:30px !important; height:30px !important; border-radius:7px !important; border:1px solid var(--line-strong) !important;
    background:var(--surface) !important; color:var(--ink) !important; cursor:pointer !important; font-size:14px !important;
    transition:background .15s, transform .15s !important;
  }
  .stepper button:hover{ background:var(--accent-soft) !important; transform:translateY(-1px) !important; }
  .stepper button:active{ transform:translateY(0) scale(.94) !important; }
  .status-chip{
    font-size:11px !important; padding:3px 9px !important; border-radius:999px !important; border:1px solid var(--line-strong) !important;
    color:var(--ink-dim) !important; text-transform:uppercase !important; letter-spacing:.05em !important; font-weight:600 !important;
  }

  /* ---------- Player profile ---------- */

  .profile-head{ display:flex !important; align-items:flex-end !important; justify-content:space-between !important; gap:16px !important; flex-wrap:wrap !important; margin:22px 0 16px !important; }
  .profile-head h2{ font-size:30px !important; }
  .profile-head .tag{ font-size:12.5px !important; color:var(--ink-faint) !important; margin-top:4px !important; }
  .profile-stats{ display:grid !important; grid-template-columns:repeat(auto-fit, minmax(115px,1fr)) !important; gap:10px !important; width:100% !important; margin-bottom:20px !important; }
  .profile-stats .p-stat{
    background:var(--surface); border:1px solid var(--line) !important; border-radius:var(--radius) !important;
    padding:12px 14px !important; transition:transform .18s ease, box-shadow .18s ease !important;
  }
  .profile-stats .p-stat:hover{ transform:translateY(-2px) !important; box-shadow:0 8px 18px var(--shadow) !important; }
  .profile-stats .p-stat .v{ font-family:"Playfair Display",serif !important; font-weight:700 !important; font-size:24px !important; font-variant-numeric:tabular-nums !important; }
  .profile-stats .p-stat .l{ margin-top:2px !important; font-size:10.5px !important; text-transform:uppercase !important; letter-spacing:.06em !important; color:var(--ink-faint) !important; }

  .rank-chart{ width:100% !important; height:auto !important; display:block !important; overflow:visible !important; }
  .rank-chart .axis{ stroke:var(--line-strong) !important; stroke-width:1 !important; }
  .rank-chart .area{ opacity:.9 !important; }
  .rank-chart .line{
    fill:none !important; stroke:var(--felt-line) !important; stroke-width:3 !important; stroke-linecap:round !important; stroke-linejoin:round !important;
    stroke-dasharray:3000 !important; stroke-dashoffset:3000; animation:drawline 1.4s cubic-bezier(.2,.7,.3,1) forwards !important;
  }
  @keyframes drawline{ to{ stroke-dashoffset:0; } }
  @keyframes popin{ from{ opacity:0; transform:scale(.1); } to{ opacity:1; transform:scale(1); } }
  .rank-chart .ball-pt{ transform-box:fill-box !important; transform-origin:center !important; transition:transform .2s !important; cursor:pointer !important; }
  .rank-chart .ball-pt:hover{ transform:scale(1.35) !important; }
  @keyframes titlepulse{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.18); } }
  .rank-chart .axis-label{ font-size:8.5px !important; fill:var(--ink-faint) !important; font-family:"IBM Plex Mono",monospace !important; }
  .chart-legend{ display:flex !important; gap:16px !important; font-size:12px !important; color:var(--ink-dim) !important; margin-top:6px !important; }
  .chart-legend span{ display:inline-flex !important; align-items:center !important; gap:6px !important; }
  @media (prefers-reduced-motion: reduce){
    .rank-chart .line{ animation:none !important; stroke-dashoffset:0 !important; }
    .rank-chart .ball-pt, .rank-chart .ball-pt-title{ animation:none !important; }
  }
  .chart-legend i{ width:9px !important; height:9px !important; border-radius:50% !important; display:inline-block !important; }

  /* ---------- Career balance bar ---------- */
  .balance-bar{ display:flex !important; height:24px !important; border-radius:6px !important; overflow:hidden !important; border:1px solid var(--line) !important; }
  .balance-bar .seg{ height:100% !important; min-width:0 !important; }
  .balance-bar .seg.win{ background:var(--good) !important; }
  .balance-bar .seg.draw{ background:var(--neutral) !important; }
  .balance-bar .seg.loss{ background:var(--critical) !important; }
  .balance-legend{ display:flex !important; gap:18px !important; flex-wrap:wrap !important; margin-top:9px !important; font-size:12.5px !important; color:var(--ink-dim) !important; }
  .balance-legend .sw{ display:inline-block !important; width:9px !important; height:9px !important; border-radius:2px !important; margin-right:6px !important; vertical-align:-1px !important; }
  .balance-legend .sw.win{ background:var(--good) !important; }
  .balance-legend .sw.draw{ background:var(--neutral) !important; }
  .balance-legend .sw.loss{ background:var(--critical) !important; }

  .h2h-list{ list-style:none !important; margin:0 !important; padding:0 !important; display:grid !important; gap:6px !important; }
  .h2h-list li{
    display:grid !important; grid-template-columns:1fr auto auto !important; gap:10px !important; align-items:center !important;
    padding:8px 12px !important; border-radius:8px !important; background:var(--surface-hi) !important; border:1px solid var(--line) !important;
    cursor:pointer !important; transition:background .15s !important;
  }
  .h2h-list li:hover{ background:var(--accent-soft) !important; }
  .h2h-list li:hover span:first-child{ color:var(--accent-text) !important; }
  .h2h-list .score{ font-family:"IBM Plex Mono",monospace !important; font-weight:600 !important; font-size:13.5px !important; }
  .result-pill{ font-size:10.5px !important; font-weight:700 !important; padding:2px 8px !important; border-radius:999px !important; text-transform:uppercase !important; letter-spacing:.04em !important; }
  .result-pill.win{ background:var(--good-soft) !important; color:var(--good) !important; }
  .result-pill.loss{ background:var(--critical-soft) !important; color:var(--critical) !important; }
  .result-pill.draw{ background:var(--neutral-soft) !important; color:var(--neutral) !important; }

  /* ---------- Crosstable ---------- */
  .xt-scroll{ overflow:auto !important; max-width:100% !important; }
  table.xt{ border-collapse:separate !important; border-spacing:4px !important; font-size:13px !important; table-layout:fixed !important; }
  table.xt th{ font-weight:600 !important; color:var(--ink-dim) !important; }
  table.xt thead th:first-child{ width:140px !important; }
  table.xt th.rowhead{
    text-align:right !important; padding-right:10px !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
    font-size:13px !important; font-weight:400 !important; width:140px !important; cursor:pointer !important;
    position:sticky !important; left:0 !important; background:var(--surface) !important; z-index:1 !important; transition:color .12s !important;
  }
  table.xt tbody tr:nth-child(even) th.rowhead{ background:var(--surface-hi) !important; }
  table.xt th.rowhead.xt-hi, table.xt th.colhead.xt-hi{ color:var(--accent-text) !important; }
  table.xt th.colhead{
    text-align:left !important; vertical-align:bottom !important; width:62px !important; cursor:pointer !important;
    font-size:13px !important; font-weight:400 !important; white-space:normal !important; line-height:1.25 !important; padding-bottom:8px !important; transition:color .12s !important;
  }
  table.xt td.cell{
    width:62px !important; height:34px !important; text-align:center !important; border-radius:6px !important; font-family:"IBM Plex Mono",monospace !important;
    font-size:12px !important; font-weight:700 !important; color:var(--ink) !important; transition:transform .12s, outline-color .12s !important;
  }
  table.xt td.cell:not(.self){ cursor:pointer !important; }
  table.xt td.cell:not(.self):hover{
    transform:scale(1.15) !important; outline:2px solid var(--accent-fill) !important; outline-offset:-2px !important;
    position:relative !important; z-index:2 !important;
  }
  table.xt td.cell.empty:hover{ background:var(--accent-soft) !important; }
  table.xt td.cell.win{ background:var(--good-soft) !important; color:var(--good) !important; }
  table.xt td.cell.loss{ background:var(--critical-soft) !important; color:var(--critical) !important; }
  table.xt td.cell.draw{ background:var(--neutral-soft) !important; color:var(--neutral) !important; }
  table.xt td.cell.self{ background:var(--line) !important; }
  table.xt td.cell.empty{ background:transparent !important; color:var(--ink-faint) !important; font-size:14px !important; }
  table.xt tbody tr:nth-child(even) td.cell.empty{ background:var(--surface-hi) !important; }
  .xt-legend{ display:flex !important; gap:18px !important; flex-wrap:wrap !important; font-size:12.5px !important; color:var(--ink-dim) !important; margin:12px 0 4px !important; }
  .xt-legend span{ display:inline-flex !important; align-items:center !important; gap:6px !important; }
  .xt-legend i{ width:11px !important; height:11px !important; border-radius:3px !important; display:inline-block !important; }

  .duel-rail{ display:flex !important; align-items:center !important; gap:12px !important; margin:2px 0 2px !important; cursor:pointer !important; }
  .duel-name{ font-size:13.5px !important; font-weight:400 !important; cursor:pointer !important; flex:0 1 auto !important; max-width:38% !important; overflow:hidden !important; text-overflow:ellipsis !important; white-space:nowrap !important; transition:color .2s, opacity .2s !important; }
  .duel-name:hover{ color:var(--accent-text) !important; }
  .duel-name.left{ text-align:right !important; }
  .duel-name.right{ text-align:left !important; }
  .duel-name.win{ color:var(--good) !important; }
  .duel-name.lose{ color:var(--critical) !important; opacity:.55 !important; }
  .duel-track{ position:relative !important; flex:1 1 auto !important; height:16px !important; min-width:70px !important; }
  .duel-track::before{ content:"" !important; position:absolute !important; left:0 !important; right:0 !important; top:50% !important; height:2px !important; background:var(--line-strong) !important; transform:translateY(-50%) !important; }
  .duel-track::after{ content:"" !important; position:absolute !important; left:50% !important; top:50% !important; width:2px !important; height:10px !important; background:var(--line-strong) !important; transform:translate(-50%,-50%) !important; }
  .duel-ball{
    position:absolute !important; top:50% !important; left:50% !important; translate:-50% -50% !important;
    width:14px !important; height:14px !important; border-radius:50% !important; background:#F3EFE3 !important; border:1.5px solid var(--line-strong) !important;
    transition:left .9s cubic-bezier(.3,.6,.3,1) !important;
  }
  @media (prefers-reduced-motion: reduce){ .duel-ball{ transition:none !important; } }
  .duel-score-line{ text-align:center !important; font-family:"IBM Plex Mono",monospace !important; font-size:11px !important; color:var(--ink-faint) !important; margin:4px 0 24px !important; letter-spacing:.04em !important; }

  .liga-tabs{ display:flex !important; gap:6px !important; margin-bottom:14px !important; }
  .liga-tabs button{
    border:1px solid var(--line-strong) !important; background:var(--surface) !important; color:var(--ink-dim) !important;
    padding:6px 14px !important; border-radius:8px !important; font-size:13px !important; font-weight:600 !important; cursor:pointer !important;
  }
  .liga-tabs button.active{ background:var(--dark-band); color:var(--on-dark); border-color:var(--dark-band); }

  .muted{ color:var(--ink-faint) !important; font-size:13px !important; }
  .note{ font-size:12.5px !important; color:var(--ink-faint) !important; line-height:1.6 !important; margin-top:8px !important; }

  /* ---------- Admin ---------- */
  .admin-light-scope{
    background:#EDEAE1 !important; color:#181616 !important; border-radius:14px !important; padding:4px 4px 18px !important;
    --bg:#EDEAE1; --surface:#F7F4EC; --surface-hi:#F1EDE3;
    --ink:#181616; --ink-dim:#6B6055; --ink-faint:#8A7F70;
    --dark-band:#181616; --on-dark:#F3F0EA;
    --accent-fill:#be9e5e; --accent-text:#82682f; --accent-soft:rgba(190,158,94,.16);
    --good:#0b7a2c; --good-soft:rgba(11,122,44,.14);
    --critical:#b5432f; --critical-soft:rgba(181,67,47,.14);
    --neutral:#6B6055; --neutral-soft:rgba(107,96,85,.14);
    --line:rgba(24,22,22,.13); --line-strong:rgba(24,22,22,.26);
    --shadow:rgba(24,22,22,.16);
  }
  .admin-field{ font-size:11px !important; text-transform:uppercase !important; letter-spacing:.06em !important; color:var(--ink-faint) !important; font-weight:600 !important; display:block !important; }
  .admin-field input, .admin-field select{
    margin-top:5px !important; width:100% !important; padding:8px 10px !important; border-radius:7px !important; border:1px solid var(--line-strong) !important;
    background:var(--surface-hi) !important; color:var(--ink) !important; font-size:14px !important; font-family:inherit !important; text-transform:none !important; letter-spacing:normal !important;
  }
  .admin-light-scope select{
    padding:8px 10px !important; border-radius:7px !important; border:1px solid var(--line-strong) !important;
    background:var(--surface-hi) !important; color:var(--ink) !important; font-size:14px !important; font-family:inherit !important;
  }
  #admLiga1 input[type="text"], #admLiga2 input[type="text"], #admLiga3 input[type="text"]{
    padding:6px 8px !important; border-radius:6px !important; border:1px solid var(--line-strong) !important; background:var(--surface-hi) !important; color:var(--ink) !important; font-size:13px !important;
  }
  #admLiga1 input[type="number"], #admLiga2 input[type="number"], #admLiga3 input[type="number"]{
    padding:6px 6px !important; border-radius:6px !important; border:1px solid var(--line-strong) !important; background:var(--surface-hi) !important; color:var(--ink) !important; font-size:13px !important; text-align:right !important;
  }
  #admLiga1 input[type="checkbox"], #admLiga2 input[type="checkbox"], #admLiga3 input[type="checkbox"]{ width:16px !important; height:16px !important; }
  .adm-remove-row{
    border:none !important; background:transparent !important; color:var(--critical) !important; cursor:pointer !important; font-size:14px !important; padding:4px 6px !important; border-radius:6px !important;
  }
  .adm-remove-row:hover{ background:var(--critical-soft) !important; }
  .adm-add-row{
    border:1px solid rgba(255,255,255,.3) !important; background:transparent !important; color:var(--on-dark) !important; cursor:pointer !important;
    font-size:12px !important; font-weight:600 !important; padding:4px 12px !important; border-radius:999px !important;
  }
  .adm-add-row:hover{ background:rgba(255,255,255,.12) !important; }
  .admin-save-btn{
    background:var(--dark-band) !important; color:var(--on-dark) !important; border:none !important; padding:11px 22px !important; border-radius:999px !important;
    font-size:14px !important; font-weight:600 !important; cursor:pointer !important; transition:transform .15s, box-shadow .15s !important;
  }
  .admin-save-btn:hover{ transform:translateY(-1px) !important; box-shadow:0 6px 16px var(--shadow) !important; }
  .admin-save-btn:active{ transform:translateY(0) !important; }

  footer.site-footer{ margin-top:56px !important; padding-top:20px !important; border-top:1px solid var(--line) !important; font-size:12px !important; color:var(--ink-faint) !important; line-height:1.7 !important; }

  @media (max-width:640px){
    .profile-head h2{ font-size:22px !important; }
    .stat-tile .value{ font-size:24px !important; }
  }

  /* WordPress-Theme: Container-Padding/Weiss deaktivieren, wo unser Widget drinsteckt */
  .main-content:has(#app),
  .sidebar-alt:has(#app),
  .page-content:has(#app),
  .entry-content:has(#app){
    padding:0 !important;
    background:transparent !important;
    background-color:transparent !important;
  }