/*
 * Switchable designs. Pick one per site in Settings > Site profile > Design, or flip between them from the
 * "Design" menu in the admin bar while viewing the site (admins only). Same designs as the shared mockup.
 *   editorial  the theme default (no overrides, this file does nothing)
 *   brand      OneClearWinner brand: Inter, the site's blues and amber
 *   minimal    shadcn/ui "Modern Minimal"
 *   paper      shadcn/ui "Vintage Paper"
 *   brutal     shadcn/ui "Neo Brutalism"
 *   soft       Neo brutalism with soft OneClearWinner colours
 * Each design only overrides the tokens site.css already uses (--bg, --accent, --f-display ...), plus a few
 * component rules. Fonts are self-hosted in designs-fonts.css.
 */
:root[data-ds] body{font-family:var(--f-body)}
/* ======================= OneClearWinner brand ======================= */
:root[data-ds="brand"]{
  --bg:#f7faff; --surface:#ffffff; --ink:#212529; --muted:#5b6470; --line:#e1e7f0; --star:#ffb80f;
  --accent:#3d63b0; --accent-soft:#e8eef9; --pop:#ffb80f; --pop-soft:#fff4d6;
  --delta-better:#1f7a3f; --delta-worse:#b4322a;
  --f-display:"Inter",system-ui,sans-serif; --f-body:"Inter",system-ui,sans-serif; --f-hand:"Inter",system-ui,sans-serif;
  --radius:10px; --shadow:0 1px 2px rgba(16,24,40,.06),0 6px 20px rgba(38,65,122,.08);
}
:root[data-ds="brand"][data-theme="dark"]{
  --bg:#0f1622; --surface:#16202f; --ink:#e9eef6; --muted:#9aa7b8; --line:#26344a; --accent:#7ea2e8; --accent-soft:#1c2a42; --pop:#ffc845; --pop-soft:#2e2611;
  --delta-better:#7fd19b; --delta-worse:#f19a91;
}
@media (prefers-color-scheme: dark){:root[data-ds="brand"]:not([data-theme="light"]){
  --bg:#0f1622; --surface:#16202f; --ink:#e9eef6; --muted:#9aa7b8; --line:#26344a; --accent:#7ea2e8; --accent-soft:#1c2a42; --pop:#ffc845; --pop-soft:#2e2611;
  --delta-better:#7fd19b; --delta-worse:#f19a91;
}}
:root[data-ds="brand"] body{font-weight:400}
:root[data-ds="brand"] h1,:root[data-ds="brand"] h2,:root[data-ds="brand"] h3{font-weight:700;letter-spacing:-.02em}
:root[data-ds="brand"] .statement h1{font-weight:800;letter-spacing:-.03em}
:root[data-ds="brand"] .hand{font-style:normal;font-weight:600;color:var(--accent)}
:root[data-ds="brand"] .hello{font-size:17px;text-transform:uppercase;letter-spacing:.08em}
:root[data-ds="brand"] .btn{border-radius:8px;letter-spacing:.02em;text-transform:none;font-size:15px;font-weight:600}
:root[data-ds="brand"] .site-head{background:color-mix(in srgb,var(--surface) 92%,transparent)}
:root[data-ds="brand"] .cat{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:4px 20px 20px;box-shadow:var(--shadow)}
:root[data-ds="brand"] .ph,:root[data-ds="brand"] .card .ph,:root[data-ds="brand"] .art .ph,:root[data-ds="brand"] .fr .ph,:root[data-ds="brand"] .hero-visual .ph{border-radius:12px}
:root[data-ds="brand"] .hv-card,:root[data-ds="brand"] .fpick,:root[data-ds="brand"] .desk,:root[data-ds="brand"] .who{border-radius:14px;box-shadow:var(--shadow)}
:root[data-ds="brand"] .desk{transform:none}
:root[data-ds="brand"] .badge{background:var(--pop-soft);padding:5px 10px;border-radius:999px;letter-spacing:.06em}
:root[data-ds="brand"] .score{background:conic-gradient(var(--pop) calc(var(--s)*1%),var(--line) 0)}
:root[data-ds="brand"] .score span,:root[data-ds="brand"] .fact-num,:root[data-ds="brand"] .price,:root[data-ds="brand"] .stats .num{font-weight:800;letter-spacing:-.02em}
:root[data-ds="brand"] .kicker,:root[data-ds="brand"] .tag,:root[data-ds="brand"] .art-type,:root[data-ds="brand"] .cat-name{color:var(--accent)}
:root[data-ds="brand"] .chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}

/* ======================= shadcn/ui: Modern Minimal ======================= */
:root[data-ds="minimal"]{
  --bg:#ffffff; --surface:#ffffff; --ink:#333333; --muted:#6b7280; --line:#e5e7eb; --star:#f59e0b;
  --accent:#3b82f6; --accent-soft:#e0f2fe; --pop:#3b82f6; --pop-soft:#eff6ff;
  --delta-better:#15803d; --delta-worse:#ef4444;
  --f-display:"Inter",system-ui,sans-serif; --f-body:"Inter",system-ui,sans-serif; --f-hand:"Source Serif 4",Georgia,serif;
  --radius:6px; --shadow:0 1px 3px rgba(0,0,0,.08);
}
:root[data-ds="minimal"][data-theme="dark"]{
  --bg:#171717; --surface:#262626; --ink:#e5e5e5; --muted:#a3a3a3; --line:#404040; --accent:#60a5fa; --accent-soft:#1e3a8a; --pop:#60a5fa; --pop-soft:#1e293b;
  --delta-better:#4ade80; --delta-worse:#f87171;
}
@media (prefers-color-scheme: dark){:root[data-ds="minimal"]:not([data-theme="light"]){
  --bg:#171717; --surface:#262626; --ink:#e5e5e5; --muted:#a3a3a3; --line:#404040; --accent:#60a5fa; --accent-soft:#1e3a8a; --pop:#60a5fa; --pop-soft:#1e293b;
  --delta-better:#4ade80; --delta-worse:#f87171;
}}
:root[data-ds="minimal"] body{font-weight:400}
:root[data-ds="minimal"] h1,:root[data-ds="minimal"] h2,:root[data-ds="minimal"] h3{font-weight:600;letter-spacing:-.015em}
:root[data-ds="minimal"] .hand{font-weight:400}
:root[data-ds="minimal"] .btn{border-radius:6px;text-transform:none;letter-spacing:0;font-size:14px;font-weight:500;padding:11px 18px}
:root[data-ds="minimal"] .link-more{text-transform:none;letter-spacing:0;font-size:14px;color:var(--accent);border-color:var(--accent)}
:root[data-ds="minimal"] .cat{border:1px solid var(--line);border-radius:8px;padding:2px 18px 18px}
:root[data-ds="minimal"] .ph,:root[data-ds="minimal"] .card .ph,:root[data-ds="minimal"] .art .ph,:root[data-ds="minimal"] .fr .ph,:root[data-ds="minimal"] .hero-visual .ph{border-radius:8px}
:root[data-ds="minimal"] .fpick,:root[data-ds="minimal"] .desk,:root[data-ds="minimal"] .hv-card,:root[data-ds="minimal"] .who{border-radius:8px;box-shadow:var(--shadow);transform:none}
:root[data-ds="minimal"] .fpick{border-top-width:1px}
:root[data-ds="minimal"] .badge{border:1px solid var(--line);border-radius:999px;padding:4px 9px;letter-spacing:.04em;font-size:10px}
:root[data-ds="minimal"] .kicker,:root[data-ds="minimal"] .tag,:root[data-ds="minimal"] .art-type,:root[data-ds="minimal"] .cat-name,:root[data-ds="minimal"] .eyebrow{letter-spacing:.06em;font-weight:500}
:root[data-ds="minimal"] .sec + .sec{border-top:0}
:root[data-ds="minimal"] .sec-head.center h2{font-size:clamp(28px,3.2vw,38px)}

/* ======================= shadcn/ui: Vintage Paper ======================= */
:root[data-ds="paper"]{
  --bg:#f5f1e6; --surface:#fffcf5; --ink:#4a3f35; --muted:#7d6b56; --line:#dbd0ba; --star:#a67c52;
  --accent:#8d6e4c; --accent-soft:#ece5d8; --pop:#a67c52; --pop-soft:#e2d8c3;
  --delta-better:#5f7a3a; --delta-worse:#b54a35;
  --f-display:"Libre Baskerville",Georgia,serif; --f-body:"Lora",Georgia,serif; --f-hand:"Lora",Georgia,serif;
  --radius:4px; --shadow:2px 3px 5px rgba(58,46,36,.12);
}
:root[data-ds="paper"][data-theme="dark"]{
  --bg:#2d2621; --surface:#3a322c; --ink:#ece5d8; --muted:#c5bcac; --line:#4a4039; --accent:#c0a080; --accent-soft:#59493e; --pop:#c0a080; --pop-soft:#4a4039;
  --delta-better:#a9c27f; --delta-worse:#e08a74;
}
@media (prefers-color-scheme: dark){:root[data-ds="paper"]:not([data-theme="light"]){
  --bg:#2d2621; --surface:#3a322c; --ink:#ece5d8; --muted:#c5bcac; --line:#4a4039; --accent:#c0a080; --accent-soft:#59493e; --pop:#c0a080; --pop-soft:#4a4039;
  --delta-better:#a9c27f; --delta-worse:#e08a74;
}}
:root[data-ds="paper"] body{font-weight:400;font-size:17px}
:root[data-ds="paper"] h1,:root[data-ds="paper"] h2,:root[data-ds="paper"] h3{font-weight:400;letter-spacing:-.01em}
:root[data-ds="paper"] .statement h1{font-size:clamp(30px,4.2vw,50px);line-height:1.12}
:root[data-ds="paper"] .btn{border-radius:3px;box-shadow:var(--shadow)}
:root[data-ds="paper"] .ph,:root[data-ds="paper"] .card .ph,:root[data-ds="paper"] .art .ph,:root[data-ds="paper"] .fr .ph{border-radius:3px;box-shadow:var(--shadow)}
:root[data-ds="paper"] .ph.photo{filter:sepia(.18) saturate(.92)}
:root[data-ds="paper"] .cat{background:var(--surface);border:1px solid var(--line);padding:4px 20px 20px;box-shadow:var(--shadow)}
:root[data-ds="paper"] .fpick,:root[data-ds="paper"] .hv-card,:root[data-ds="paper"] .who{box-shadow:var(--shadow)}
:root[data-ds="paper"] .sec + .sec{border-top:3px double var(--line)}
:root[data-ds="paper"] .kicker,:root[data-ds="paper"] .tag,:root[data-ds="paper"] .art-type,:root[data-ds="paper"] .cat-name,:root[data-ds="paper"] .eyebrow,:root[data-ds="paper"] .badge{font-family:"Libre Baskerville",Georgia,serif;font-style:italic;text-transform:none;letter-spacing:0;font-size:13px}

/* ======================= shadcn/ui: Neo Brutalism ======================= */
:root[data-ds="brutal"]{
  --bg:#ffffff; --surface:#ffffff; --ink:#000000; --muted:#333333; --line:#000000; --star:#000000;
  --accent:#000000; --accent-soft:#ffff00; --pop:#ff3333; --pop-soft:#ffff00;
  --delta-better:#008a00; --delta-worse:#e00000;
  --f-display:"DM Sans",system-ui,sans-serif; --f-body:"DM Sans",system-ui,sans-serif; --f-hand:"Space Mono",ui-monospace,monospace;
  --radius:0px; --shadow:4px 4px 0 var(--ink);
}
:root[data-ds="brutal"][data-theme="dark"]{
  --bg:#000000; --surface:#1a1a1a; --ink:#ffffff; --muted:#cccccc; --line:#ffffff; --accent:#ffffff; --accent-soft:#333300; --pop:#ff6666; --pop-soft:#ffff33;
  --delta-better:#33cc33; --delta-worse:#ff6666;
}
@media (prefers-color-scheme: dark){:root[data-ds="brutal"]:not([data-theme="light"]){
  --bg:#000000; --surface:#1a1a1a; --ink:#ffffff; --muted:#cccccc; --line:#ffffff; --accent:#ffffff; --accent-soft:#333300; --pop:#ff6666; --pop-soft:#ffff33;
  --delta-better:#33cc33; --delta-worse:#ff6666;
}}
:root[data-ds="brutal"] body{font-weight:400}
:root[data-ds="brutal"] h1,:root[data-ds="brutal"] h2,:root[data-ds="brutal"] h3{font-weight:800;letter-spacing:-.025em}
:root[data-ds="brutal"] .statement h1{text-transform:uppercase;font-size:clamp(32px,4.6vw,56px);line-height:1}
:root[data-ds="brutal"] .fact-num,:root[data-ds="brutal"] .price,:root[data-ds="brutal"] .score span,:root[data-ds="brutal"] .stats .num,:root[data-ds="brutal"] .pick .n{font-family:"Space Mono",ui-monospace,monospace;font-weight:700;letter-spacing:-.04em}
:root[data-ds="brutal"] .btn{border:2px solid var(--ink);box-shadow:var(--shadow);text-transform:uppercase;font-weight:700}
:root[data-ds="brutal"] .btn-primary{background:var(--pop);color:#000}
:root[data-ds="brutal"] .cat,:root[data-ds="brutal"] .fpick,:root[data-ds="brutal"] .hv-card,:root[data-ds="brutal"] .who,:root[data-ds="brutal"] .desk{border:2px solid var(--ink);box-shadow:var(--shadow);background:var(--surface);transform:none}
:root[data-ds="brutal"] .cat{padding:4px 18px 18px}
:root[data-ds="brutal"] .ph,:root[data-ds="brutal"] .card .ph,:root[data-ds="brutal"] .art .ph,:root[data-ds="brutal"] .fr .ph,:root[data-ds="brutal"] .hero-visual .ph{border:2px solid var(--ink);border-radius:0}
:root[data-ds="brutal"] .badge{background:var(--pop-soft);color:#000;border:2px solid #000;padding:3px 8px;font-weight:700}
:root[data-ds="brutal"] .badge::before{background:#000}
:root[data-ds="brutal"] .score{background:var(--pop-soft);border:2px solid #000;box-shadow:2px 2px 0 #000}
:root[data-ds="brutal"] .score::before{display:none}
:root[data-ds="brutal"] .score span{color:#000}
:root[data-ds="brutal"] .chip{border:2px solid var(--ink);border-radius:0;font-weight:600}
:root[data-ds="brutal"] .chip[aria-pressed="true"]{background:var(--pop-soft);color:#000;border-color:#000}
:root[data-ds="brutal"] .site-head{border-bottom:3px solid var(--ink);background:var(--bg)}
:root[data-ds="brutal"] .cat-toggle,:root[data-ds="brutal"] .icon-btn{border:2px solid var(--ink);border-radius:0}
:root[data-ds="brutal"] .sec + .sec{border-top:3px solid var(--ink)}
:root[data-ds="brutal"] .hand{font-style:normal;font-size:.85em}
:root[data-ds="brutal"] .kicker,:root[data-ds="brutal"] .tag,:root[data-ds="brutal"] .art-type,:root[data-ds="brutal"] .cat-name{color:var(--ink);font-weight:800}

/* ======================= Neo brutalism, soft (Jodi, 7 Oct): same structure, OneClearWinner colours ======================= */
:root[data-ds="soft"]{
  --bg:#faf8f3; --surface:#ffffff; --ink:#1d2433; --muted:#4a5466; --line:#1d2433; --star:#1d2433;
  --accent:#3d63b0; --accent-soft:#fdeec2; --pop:#3d63b0; --pop-soft:#fdeec2; --sky:#e3ecfb;
  --delta-better:#2f7a46; --delta-worse:#b4433a;
  --f-display:"DM Sans",system-ui,sans-serif; --f-body:"DM Sans",system-ui,sans-serif; --f-hand:"Space Mono",ui-monospace,monospace;
  --radius:6px; --shadow:3px 3px 0 var(--ink);
}
:root[data-ds="soft"][data-theme="dark"]{
  --bg:#121722; --surface:#1b2232; --ink:#eef2f8; --muted:#b4bccb; --line:#8fa3c7; --accent:#7ea2e8; --accent-soft:#3a3420; --pop:#7ea2e8; --pop-soft:#3a3420; --sky:#233150;
  --delta-better:#7fd19b; --delta-worse:#f19a91;
}
@media (prefers-color-scheme: dark){:root[data-ds="soft"]:not([data-theme="light"]){
  --bg:#121722; --surface:#1b2232; --ink:#eef2f8; --muted:#b4bccb; --line:#8fa3c7; --accent:#7ea2e8; --accent-soft:#3a3420; --pop:#7ea2e8; --pop-soft:#3a3420; --sky:#233150;
  --delta-better:#7fd19b; --delta-worse:#f19a91;
}}
:root[data-ds="soft"] body{font-weight:400}
:root[data-ds="soft"] h1,:root[data-ds="soft"] h2,:root[data-ds="soft"] h3{font-weight:800;letter-spacing:-.025em}
:root[data-ds="soft"] .statement h1{font-size:clamp(34px,4.8vw,58px);line-height:1.04}
:root[data-ds="soft"] .fact-num,:root[data-ds="soft"] .price,:root[data-ds="soft"] .score span,:root[data-ds="soft"] .stats .num,:root[data-ds="soft"] .pick .n{font-family:"Space Mono",ui-monospace,monospace;font-weight:700;letter-spacing:-.04em}
:root[data-ds="soft"] .btn{border:2px solid var(--ink);box-shadow:var(--shadow);border-radius:8px;font-weight:700}
:root[data-ds="soft"] .btn-primary{background:var(--accent);color:#fff}
:root[data-ds="soft"] .cat,:root[data-ds="soft"] .fpick,:root[data-ds="soft"] .hv-card,:root[data-ds="soft"] .who,:root[data-ds="soft"] .desk{border:2px solid var(--ink);box-shadow:var(--shadow);background:var(--surface);transform:none}
:root[data-ds="soft"] .cat{padding:4px 18px 18px}
:root[data-ds="soft"] .ph,:root[data-ds="soft"] .card .ph,:root[data-ds="soft"] .art .ph,:root[data-ds="soft"] .fr .ph,:root[data-ds="soft"] .hero-visual .ph{border:2px solid var(--ink);border-radius:8px}
:root[data-ds="soft"] .badge{background:var(--sky);color:var(--ink);border:2px solid var(--ink);border-radius:999px;padding:3px 9px;font-weight:700}
:root[data-ds="soft"] .badge::before{background:var(--accent)}
:root[data-ds="soft"] .score{background:var(--pop-soft);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
:root[data-ds="soft"] .score::before{display:none}
:root[data-ds="soft"] .score span{color:#1d2433}
:root[data-ds="soft"] .chip{border:2px solid var(--ink);border-radius:999px;font-weight:600}
:root[data-ds="soft"] .chip[aria-pressed="true"]{background:var(--pop-soft);color:#1d2433;border-color:var(--ink)}
:root[data-ds="soft"] .site-head{border-bottom:3px solid var(--ink);background:var(--bg)}
:root[data-ds="soft"] .cat-toggle,:root[data-ds="soft"] .icon-btn{border:2px solid var(--ink)}
:root[data-ds="soft"] .sec + .sec{border-top:3px solid var(--ink)}
:root[data-ds="soft"] .hand{font-style:normal;font-size:.85em}
:root[data-ds="soft"] .kicker,:root[data-ds="soft"] .tag,:root[data-ds="soft"] .art-type,:root[data-ds="soft"] .cat-name{color:var(--ink);font-weight:800}
:root[data-ds="soft"] .cat,:root[data-ds="soft"] .fpick,:root[data-ds="soft"] .hv-card,:root[data-ds="soft"] .who,:root[data-ds="soft"] .desk{border-radius:12px}
:root[data-ds="soft"] .ticker b{background:var(--pop-soft);color:#1d2433;border:2px solid var(--ink)}
:root[data-ds="soft"] .pk-kicker,:root[data-ds="soft"] .eyebrow{color:var(--accent)}