/* Swiss x dark glass theme (v1.2). Applies everywhere EXCEPT the ITYSL voting page, which keeps the retro look.
   Scoped to html[data-theme="swiss"]; app.js switches the theme on every route change. */
html[data-theme="swiss"]{
  --bg:#06070c; --panel:rgba(255,255,255,.055); --panel2:rgba(255,255,255,.09); --line:rgba(255,255,255,.2);
  --text:#f2f3f8; --muted:#a9aec8; --accent:#ff3b2f; --accent-ink:#fff; --accent2:#ff6a5f;
}
html[data-theme="swiss"]::after{display:none}                               /* no film grain */
html[data-theme="swiss"] body{font-family:"Inter Tight",system-ui,-apple-system,"Segoe UI",sans-serif;background:#06070c;
  background-image:linear-gradient(to right,rgba(255,255,255,.05) 1px,transparent 1px);background-size:calc(100% / 12) 100%;background-attachment:fixed}
html[data-theme="swiss"] body::before,html[data-theme="swiss"] body::after{clip-path:none;width:780px;height:780px;pointer-events:none}
html[data-theme="swiss"] body::before{left:-300px;top:-320px;right:auto;bottom:auto;background:radial-gradient(closest-side,rgba(255,59,47,.40),transparent)}
html[data-theme="swiss"] body::after{right:-320px;bottom:-280px;left:auto;top:auto;background:radial-gradient(closest-side,rgba(59,77,255,.42),transparent)}

/* header: the wordmark stays in the retro script; everything else is Swiss */
html[data-theme="swiss"] .top{background:rgba(6,7,12,.74);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding-left:20px}
html[data-theme="swiss"] nav a{font:700 12px "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:#c9ccdd;border-radius:0;background:none;padding:9px 12px;border-bottom:2px solid transparent}
html[data-theme="swiss"] nav a:hover,html[data-theme="swiss"] nav a.on{color:#fff;background:none;border-bottom-color:var(--accent)}
html[data-theme="swiss"] nav a.morebtn{background:var(--accent);color:#fff;text-shadow:none;border-radius:0;box-shadow:none;font-size:13px;padding:11px 20px;margin:0 8px;transform:none;border-bottom:2px solid var(--accent)}
html[data-theme="swiss"] nav a.morebtn:hover,html[data-theme="swiss"] nav a.morebtn.on{background:#fff;color:#06070c;outline:none;box-shadow:none;transform:none;border-bottom-color:#fff}
html[data-theme="swiss"] main{max-width:1120px}

/* type */
html[data-theme="swiss"] h1{font-family:"Inter Tight",sans-serif;font-weight:900;font-size:clamp(42px,8vw,104px);line-height:.9;letter-spacing:-.05em;color:#fff;text-shadow:none;margin:6px 0 14px}
html[data-theme="swiss"] h2{font-family:"Inter Tight",sans-serif;font-weight:900;letter-spacing:-.03em}
html[data-theme="swiss"] .sub{font:400 12px "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);text-align:left}
html[data-theme="swiss"] .muted{color:var(--muted)}
html[data-theme="swiss"] .se,html[data-theme="swiss"] .badge,html[data-theme="swiss"] .vhint{font-family:"JetBrains Mono",monospace;letter-spacing:.06em}
html[data-theme="swiss"] .se{font-weight:700;font-size:11px}
html[data-theme="swiss"] a{color:#fff}
html[data-theme="swiss"] .topicbar a{color:var(--accent2)}

/* controls */
html[data-theme="swiss"] button:not(.topic-card):not(.qopt):not(.link),html[data-theme="swiss"] .btn{border-radius:0;font:700 12px "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.05em;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.3);color:#fff}
html[data-theme="swiss"] .topic-card,html[data-theme="swiss"] .qopt{font-family:"Inter Tight",sans-serif;text-transform:none;letter-spacing:normal;color:#f2f3f8}
html[data-theme="swiss"] .qopt .qsrc{font-family:"JetBrains Mono",monospace;text-transform:uppercase}
html[data-theme="swiss"] button:not(.topic-card):not(.qopt):not(.link):hover,html[data-theme="swiss"] .btn:hover{border-color:#fff}
html[data-theme="swiss"] button.primary,html[data-theme="swiss"] .btn.primary,html[data-theme="swiss"] .actions .btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
html[data-theme="swiss"] button.link{background:none;border:none;text-transform:none;font:12px "Inter Tight";color:var(--muted)}
html[data-theme="swiss"] input,html[data-theme="swiss"] select,html[data-theme="swiss"] textarea{border-radius:0;background:rgba(255,255,255,.06);border:1px solid var(--line);color:#fff;font-family:"Inter Tight",sans-serif}
html[data-theme="swiss"] .check{color:var(--muted)}

/* glass surfaces with hairlines */
html[data-theme="swiss"] .card,html[data-theme="swiss"] .row,html[data-theme="swiss"] .sheet,html[data-theme="swiss"] .qcard,html[data-theme="swiss"] .topic-card,html[data-theme="swiss"] .tile{
  border-radius:0;border:1px solid var(--line);background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:none}
html[data-theme="swiss"] .card h3{font-weight:900;letter-spacing:-.03em}
html[data-theme="swiss"] .duel .card:hover{border-color:#fff;transform:none;box-shadow:0 0 0 1px #fff,0 0 44px rgba(255,59,47,.28)}
html[data-theme="swiss"] .thumb{border-bottom:1px solid var(--line)}
html[data-theme="swiss"] .tag{border-radius:0;background:var(--accent);color:#fff;font-family:"JetBrains Mono",monospace}
html[data-theme="swiss"] .crank{border-radius:0;font-family:"JetBrains Mono",monospace;letter-spacing:.02em;box-shadow:none}
html[data-theme="swiss"] .extra b{color:var(--accent2)}
html[data-theme="swiss"] .chip,html[data-theme="swiss"] .badge{border-radius:0;background:rgba(255,255,255,.07)}
html[data-theme="swiss"] .badge.you{background:var(--accent);border-color:var(--accent);color:#fff}

/* scoreboard + progress */
html[data-theme="swiss"] .board{gap:12px}
html[data-theme="swiss"] .tile{text-align:left;padding:14px 18px}
html[data-theme="swiss"] .tile b{font-family:"Inter Tight",sans-serif;font-weight:900;font-size:54px;letter-spacing:-.05em;line-height:1;color:#fff;text-shadow:none}
html[data-theme="swiss"] .tile span{font:700 11px "JetBrains Mono",monospace;letter-spacing:.12em}
html[data-theme="swiss"] .tile.bump b{color:var(--accent2)}
html[data-theme="swiss"] .bar{height:6px;border-radius:0;background:rgba(255,255,255,.12);box-shadow:none}
html[data-theme="swiss"] .bar i{border-radius:0;background:var(--accent);box-shadow:0 0 16px var(--accent)}
html[data-theme="swiss"] .bar i::after{opacity:.5}

/* Rank More: topics as full-width glass rows with a colored edge */
html[data-theme="swiss"] .topics{grid-template-columns:1fr;gap:10px}
html[data-theme="swiss"] .topic-card{display:grid;grid-template-columns:64px 1.2fr 1.5fr 150px auto;align-items:center;gap:6px 18px;padding:18px 20px;position:relative;overflow:hidden;
  box-shadow:inset 3px 0 0 var(--c),0 0 30px -14px var(--c);transition:.15s}
html[data-theme="swiss"] .topic-card:hover{transform:translateX(6px);border-color:#fff}
html[data-theme="swiss"] .topic-card .emo{height:auto;background:none;font-size:34px;display:block}
html[data-theme="swiss"] .topic-card b{padding:0;font-size:26px;font-weight:900;letter-spacing:-.03em}
html[data-theme="swiss"] .topic-card .tg{padding:0;font-size:14px}
html[data-theme="swiss"] .topic-card .mini{margin:0;height:5px;border-radius:0}
html[data-theme="swiss"] .topic-card .mini i{background:var(--accent)}
html[data-theme="swiss"] .topic-card .cnt{padding:0;font:700 11px "JetBrains Mono",monospace;text-transform:uppercase;color:#fff;white-space:nowrap}

/* lists, tabs, quotes, tables, forms, banner, footer */
html[data-theme="swiss"] .row .pos{font-family:"Inter Tight",sans-serif;font-weight:900}
html[data-theme="swiss"] .score{border-radius:0;font-family:"JetBrains Mono",monospace;color:#fff}
html[data-theme="swiss"] .score.votes{background:rgba(255,255,255,.08);border:1px solid var(--line)}
html[data-theme="swiss"] .row.me{outline:2px solid var(--accent);background:rgba(255,59,47,.1)}
html[data-theme="swiss"] .row.dragging{outline-color:var(--accent)}
html[data-theme="swiss"] .tab{border-radius:0;background:rgba(255,255,255,.05);font:700 12px "JetBrains Mono",monospace;text-transform:uppercase}
html[data-theme="swiss"] .tab.on{background:var(--accent);border-color:var(--accent);color:#fff}
html[data-theme="swiss"] .tab .n{border-radius:0}
html[data-theme="swiss"] body.reordering .rbar{background:rgba(6,7,12,.96)}
html[data-theme="swiss"] .qopt{border-radius:0;background:rgba(255,255,255,.05)}
html[data-theme="swiss"] .qopt.on{border-color:var(--accent);background:rgba(255,59,47,.12)}
html[data-theme="swiss"] .qbar,html[data-theme="swiss"] .qbar i{border-radius:0}
html[data-theme="swiss"] .qbar i{background:var(--accent)}
html[data-theme="swiss"] th{font:700 11px "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
html[data-theme="swiss"] .match{color:var(--accent2);font-weight:900;letter-spacing:-.03em}
html[data-theme="swiss"] .modal{background:rgba(0,0,0,.78)}
html[data-theme="swiss"] .sheet{background:#0b0c14}
html[data-theme="swiss"] .quote-pop{background:#0b0c14;border:2px solid var(--accent);border-radius:0;box-shadow:0 0 70px rgba(255,59,47,.35)}
html[data-theme="swiss"] .quote-pop small{color:var(--accent2);font-family:"JetBrains Mono",monospace}
html[data-theme="swiss"] .beta{background:rgba(255,59,47,.16);color:#f2f3f8;border-bottom:1px solid rgba(255,59,47,.55);font-size:13px}
html[data-theme="swiss"] .beta a{color:#fff}
html[data-theme="swiss"] .beta button{background:rgba(255,255,255,.12);color:#fff;border-color:transparent}
html[data-theme="swiss"] .foot{border-top:1px solid var(--line);color:var(--muted)}
html[data-theme="swiss"] .ver{font-family:"JetBrains Mono",monospace}

@media(max-width:700px){
  html[data-theme="swiss"] body::before,html[data-theme="swiss"] body::after{width:460px;height:460px}
  html[data-theme="swiss"] .top{padding-left:12px}
  html[data-theme="swiss"] nav a{font-size:12px;padding:10px 12px}
  html[data-theme="swiss"] nav a.morebtn{font-size:12px;padding:10px 16px;margin:0 6px}
  html[data-theme="swiss"] .tile b{font-size:30px}
  html[data-theme="swiss"] .topic-card{grid-template-columns:48px 1fr;padding:14px}
  html[data-theme="swiss"] .topic-card .tg,html[data-theme="swiss"] .topic-card .mini,html[data-theme="swiss"] .topic-card .cnt{grid-column:1 / -1}
  html[data-theme="swiss"] .topic-card b{font-size:22px}
}