.clg-px{--ink:#1a1f2b;--muted:#5f6573;--line:#e3ddd0;--panel:#f6f2e8;--gold:#9c7412;--gold2:#e3b23c;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:14px;padding:22px;margin:28px 0;font-size:16px;line-height:1.45;box-sizing:border-box;max-width:100%}
.clg-px *,.clg-px *::before,.clg-px *::after{box-sizing:border-box}
.clg-px h3{font-family:Georgia,"Times New Roman",serif;font-size:1.5rem;line-height:1.2;margin:0 0 6px;font-weight:700;color:var(--ink)}
.clg-px h4{font-size:1rem;font-weight:700;margin:0 0 10px;color:var(--ink)}
.clg-px p{margin:0}
.clg-px .px-lead{color:var(--muted);font-size:.95rem;max-width:64ch;margin-bottom:18px}
.clg-px button{font:inherit}
.clg-px button:focus-visible{outline:3px solid var(--gold2);outline-offset:2px}
/* club chips */
.clg-px .px-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.clg-px .px-chip{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid var(--line);border-radius:999px;font-size:.84rem;font-weight:600;color:var(--ink);background:#fff}
.clg-px .px-chip[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:#fff}
.clg-px .px-chip b{font-variant-numeric:tabular-nums;font-weight:700;opacity:.7}
.clg-px .sw{width:14px;height:14px;border-radius:3px;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
/* ribbon grid */
.clg-px .px-rib{display:grid;grid-template-columns:62px repeat(10,1fr);gap:4px;align-items:center}
.clg-px .px-dec{font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums}
.clg-px .px-head{font-size:.7rem;color:var(--muted);text-align:center}
.clg-px .px-cell{all:unset;cursor:pointer;height:34px;border-radius:5px;position:relative;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);transition:opacity .2s,transform .2s}
.clg-px .px-cell span{position:absolute;left:3px;bottom:2px;font-size:.62rem;font-weight:700;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.8);font-variant-numeric:tabular-nums}
.clg-px .px-cell.dim{opacity:.13}
.clg-px .px-cell.sel{box-shadow:0 0 0 3px var(--ink);transform:scale(1.06);z-index:1}
.clg-px .px-void{height:34px;border-radius:5px;background:repeating-linear-gradient(45deg,#eee 0 4px,#fafafa 4px 8px)}
.clg-px .px-none{height:34px}
.clg-px .px-note{font-size:.76rem;color:var(--muted);margin-top:8px}
/* club swatches */
.clg-px .c-rm{background:#e3b23c}
.clg-px .c-fcb{background:linear-gradient(90deg,#a50044 50%,#004d98 50%)}
.clg-px .c-atm{background:repeating-linear-gradient(90deg,#cb3524 0 4px,#fff 4px 8px)}
.clg-px .c-ath{background:repeating-linear-gradient(90deg,#1a1a1a 0 2px,#e0301e 2px 6px,#fff 6px 9px)}
.clg-px .c-val{background:#f18e00}
.clg-px .c-rso{background:repeating-linear-gradient(90deg,#0067b1 0 4px,#fff 4px 8px)}
.clg-px .c-dep{background:#1b4f9c}
.clg-px .c-sev{background:linear-gradient(135deg,#fff 50%,#d1101f 50%)}
.clg-px .c-bet{background:#00954c}
/* info panels */
.clg-px .px-info{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.clg-px .px-box{background:var(--panel);border-radius:10px;padding:14px 16px;min-height:120px}
.clg-px .px-box .big{font-family:Georgia,serif;font-size:1.35rem;font-weight:700;line-height:1.2;margin-bottom:4px}
.clg-px .px-box p{font-size:.9rem;color:var(--ink);margin-top:4px}
.clg-px .px-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.clg-px .px-stats div{background:#fff;border-radius:8px;padding:8px 10px}
.clg-px .px-stats small{display:block;font-size:.72rem;color:var(--muted)}
.clg-px .px-stats b{font-size:1.1rem;font-variant-numeric:tabular-nums}
/* race */
.clg-px .px-race{margin-top:22px;border-top:1px solid var(--line);padding-top:18px}
.clg-px .px-ctrl{display:flex;gap:12px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.clg-px .px-play{all:unset;cursor:pointer;background:var(--ink);color:#fff;border-radius:999px;padding:7px 16px;font-size:.86rem;font-weight:600}
.clg-px .px-ctrl input[type=range]{flex:1;min-width:160px;accent-color:var(--gold);margin:0}
.clg-px .px-yr{font-family:Georgia,serif;font-weight:700;font-size:1.2rem;min-width:84px;font-variant-numeric:tabular-nums}
.clg-px .px-bars{display:grid;gap:5px}
.clg-px .px-br{display:grid;grid-template-columns:150px 1fr 34px;gap:8px;align-items:center;font-size:.84rem}
.clg-px .px-br .n{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clg-px .px-br .t{height:16px;background:var(--panel);border-radius:4px;overflow:hidden}
.clg-px .px-br .t i{display:block;height:100%;border-radius:4px;transition:width .15s linear}
.clg-px .px-br .v{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.clg-px .px-lead2{font-size:.88rem;margin-top:10px;color:var(--ink)}
.clg-px .px-foot{margin-top:18px;font-size:.76rem;color:var(--muted);border-top:1px solid var(--line);padding-top:12px}
@media (max-width:680px){
  .clg-px{padding:16px}
  .clg-px .px-rib{grid-template-columns:40px repeat(10,1fr);gap:3px}
  .clg-px .px-cell,.clg-px .px-void,.clg-px .px-none{height:26px}
  .clg-px .px-cell span{display:none}
  .clg-px .px-info{grid-template-columns:1fr}
  .clg-px .px-br{grid-template-columns:104px 1fr 30px}
}
@media (prefers-reduced-motion:reduce){.clg-px *{transition:none!important}}

.clg-px h4 .sw{display:inline-block;vertical-align:-2px;margin-right:6px}

/* --- Einbettung & Mobile --- */
.clg-px{contain:inline-size;width:100%;min-width:0}
.clg-px .px-rib{grid-template-columns:62px repeat(10,minmax(0,1fr))}
.clg-px .px-info{grid-template-columns:repeat(2,minmax(0,1fr))}
.clg-px .px-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.clg-px .px-br{grid-template-columns:150px minmax(0,1fr) 34px}
.clg-px .px-info>*,.clg-px .px-stats>*{min-width:0}
.clg-px .px-stats b{overflow-wrap:anywhere}
@media (max-width:680px){.clg-px .px-rib{grid-template-columns:40px repeat(10,minmax(0,1fr))}.clg-px .px-info{grid-template-columns:minmax(0,1fr)}.clg-px .px-br{grid-template-columns:104px minmax(0,1fr) 30px}}
@media (max-width:400px){.clg-px .px-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* --- Schutz vor Theme-Stilen (article * { color; font-family; font-weight … }) --- */
.clg-px.clg-px *{color:inherit;font-family:inherit;font-weight:inherit;letter-spacing:normal;text-transform:none;line-height:inherit}
.clg-px.clg-px{color:var(--ink);font-weight:400;letter-spacing:normal;text-transform:none}
.clg-px.clg-px h3{font-family:Georgia,"Times New Roman",serif;font-weight:700;color:var(--ink)}
.clg-px.clg-px h4,.clg-px.clg-px b,.clg-px.clg-px strong{font-weight:700}
.clg-px.clg-px h4,.clg-px .px-box,.clg-px.clg-px .px-box p,.clg-px .px-lead2,.clg-px .px-br{color:var(--ink)}
.clg-px .px-box .big,.clg-px .px-yr{font-family:Georgia,serif;font-weight:700}
.clg-px .px-lead,.clg-px .px-dec,.clg-px .px-head,.clg-px .px-note,.clg-px .px-stats small,.clg-px .px-foot{color:var(--muted)}
.clg-px .px-chips .px-chip{color:var(--ink);font-weight:600}
.clg-px .px-chips .px-chip[aria-pressed="true"]{color:#fff}
.clg-px .px-cell span{color:#fff;font-weight:700}
.clg-px .px-ctrl .px-play{color:#fff;font-weight:600}
.clg-px .px-br .v{font-weight:700}