/* =====================================================================
   Themed areas (editions, participant pages, simulations).
   The visual theme editor writes --t-* variables; here they are mapped
   onto the design-system tokens so every component follows the theme.
   ===================================================================== */
.themed {
  --text: var(--t-text);
  --muted: var(--t-muted);
  --faint: var(--t-muted);
  --panel: var(--t-surface);
  --panel-2: var(--t-surface-strong);
  --ink-2: var(--t-surface-strong);
  --line: var(--t-border);
  --line-soft: var(--t-border);
  --pink: var(--t-primary);
  --pink-2: var(--t-primary);
  --gold: var(--t-accent);
  --cyan: var(--t-secondary);
  --jury: var(--t-jury);
  --tele: var(--t-tele);
  --font-display: var(--t-font-heading);
  --font-body: var(--t-font-body);
  --r-panel: var(--t-radius);
  --r-control: calc(var(--t-radius) * .6);
  position: relative;
  color: var(--t-text);
  font-family: var(--t-font-body);
  background: var(--t-pattern), var(--t-bg);
  min-height: 70vh;
  padding-bottom: 72px;
}
body.has-theme .site-footer { margin-top: 0; }
.themed h1, .themed h2 { font-family: var(--t-font-heading); color: var(--t-title); }
.themed a { color: var(--t-secondary); }
.themed a.chip, .themed a.btn { text-decoration: none; }
.themed a.btn, .themed a.btn:hover { color: var(--b-fg); }
.themed a.entry-card, .themed .entry-nav a, .themed .side-list a { color: var(--t-text); }
.themed a.chip:hover { border-color: var(--t-primary); }
.t-hero .crumbs, .bio-hero .crumbs { margin: 0 0 10px; padding: 0; max-width: none; }
.themed .panel { backdrop-filter: blur(var(--t-blur)); -webkit-backdrop-filter: blur(var(--t-blur)); }
.themed .btn--primary { --b-fg: var(--t-on-primary); box-shadow: none; }
.themed .btn--gold { --b-fg: var(--t-on-accent); }
.themed .btn:not(.btn--primary):not(.btn--gold) { --b-bg: var(--t-surface); }
.themed .tab[aria-selected="true"], .themed .tab.is-active { color: var(--t-text); border-bottom-color: var(--t-primary); }
.themed .tab { color: var(--t-muted); }
.themed .tab:hover { color: var(--t-text); }
.themed .table th { background: var(--t-surface); color: var(--t-muted); }
.themed .chip { background: var(--t-surface); border-color: var(--t-border); color: var(--t-text); }
.themed .crumbs a, .themed .crumbs ol { color: var(--t-muted); }
.themed .pts { background: var(--t-surface-strong); color: var(--t-text); }
.themed .pts--12 { background: var(--t-accent); color: var(--t-on-accent); }
.themed .pts--jury { background: color-mix(in srgb, var(--t-jury) 26%, transparent); color: var(--t-text); }
.themed .pts--tele { background: color-mix(in srgb, var(--t-tele) 26%, transparent); color: var(--t-text); }
.themed .segmented { background: var(--t-surface); }
.themed .segmented .is-active, .themed .segmented button[aria-pressed="true"] { background: var(--t-text); color: var(--t-bg1); }
.themed select, .themed input, .themed textarea { background: var(--t-surface-strong); color: var(--t-text); }
.themed .empty-state__mark { border-color: var(--t-border); color: var(--t-muted); }

/* ---------- hero ---------- */
.t-hero { position: relative; overflow: hidden; }
.t-hero__inner { max-width: var(--container); margin: 0 auto; padding: clamp(28px, 6vw, 64px) var(--gutter) clamp(24px, 4vw, 40px);
  display: grid; gap: clamp(20px, 4vw, 48px); grid-template-columns: auto 1fr; align-items: center; text-align: var(--t-hero-align); }
.t-hero--center .t-hero__inner { grid-template-columns: 1fr; justify-items: center; }
.t-hero__art { width: clamp(120px, 18vw, 220px); aspect-ratio: 1; border-radius: var(--t-radius); overflow: hidden; box-shadow: 0 24px 60px -24px rgba(0,0,0,.6); background: var(--t-surface); }
.t-hero__art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.t-hero__art .cover-ph { width: 100%; height: 100%; }
.t-hero h1 { margin: 0 0 .35em; font-size: clamp(1.9rem, 5vw, 3.6rem); }
.t-hero__meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.t-hero--center .t-hero__meta { justify-content: center; }
.t-hero__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.t-hero--center .t-hero__actions { justify-content: center; }
.t-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: calc(1 - var(--t-hero-overlay)); }
.t-hero__bg + .t-hero__inner { position: relative; }
@media (max-width: 640px) { .t-hero__inner { grid-template-columns: 1fr; } .t-hero__art { width: 140px; } }

.winner-callout { display: inline-flex; align-items: center; gap: 12px; padding: 10px 16px 10px 10px; border-radius: 999px; background: var(--t-accent); color: var(--t-on-accent); font-weight: 800; }
.winner-callout img { width: 36px; height: 27px; border-radius: 5px; object-fit: cover; }
.winner-callout small { font-weight: 600; opacity: .8; }

.t-tabs { position: sticky; top: 64px; z-index: 20; background: color-mix(in srgb, var(--t-bg1) 82%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.t-tabs .tabs { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.t-body { max-width: var(--container); margin: 0 auto; padding: 28px var(--gutter) 0; }
.t-body .crumbs { padding: 0; margin-left: 0; margin-right: 0; }
.themed .chip--live, .themed .chip--closed, .themed .chip--done { color: var(--t-text); }
