:root { --page:#F4F1F6; --card:#FFFFFF; --ink:#1F1A24; --ink-2:#5A5263; --line:#E3DCE8; --purple:#37003C; --purple-2:#5C0F66; --purple-soft:#F1E6F3; --mint:#39DD9D; --mint-2:#01D7D3; --mint-ink:#08291E;
  --head:"Space Grotesk","Poppins",Arial,sans-serif; --body:"Poppins","Helvetica Neue",Arial,sans-serif; }
*,*::before,*::after { box-sizing:border-box; }
body { margin:0; background:var(--page); color:var(--ink); font-family:var(--body); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:var(--purple-2); }
:focus-visible { outline:3px solid var(--mint-2); outline-offset:2px; }
.wrap { max-width:1080px; margin:0 auto; padding-inline:20px; }
.top { background:linear-gradient(160deg,var(--purple) 0%,#24002A 100%); color:#fff; }
.bar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding-block:14px; }
.home { color:#fff; font-family:var(--head); font-weight:700; font-size:19px; text-decoration:none; }
.bar nav { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.bar nav a { color:#fff; text-decoration:none; font-weight:500; font-size:15px; }
.bar nav a:hover { text-decoration:underline; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1px solid var(--line); background:#fff; color:var(--ink); border-radius:999px; padding:10px 18px; font:600 14.5px var(--body); text-decoration:none; cursor:pointer; min-height:44px; }
.btn:hover { border-color:var(--purple); }
.btn.solid { background:var(--purple); color:#fff; border-color:var(--purple); }
.btn.mint, .bar nav a.btn.mint { background:var(--mint); color:var(--mint-ink); border-color:var(--mint); padding:8px 16px; min-height:40px; }
main { padding-block:22px 48px; }
.crumbs ol { list-style:none; display:flex; flex-wrap:wrap; gap:6px; padding:0; margin:0 0 18px; font-size:13.5px; color:var(--ink-2); }
.crumbs li + li::before { content:"›"; margin-right:6px; color:var(--ink-2); }
h1 { font-family:var(--head); font-size:clamp(28px,4.4vw,44px); line-height:1.1; margin:0 0 10px; overflow-wrap:anywhere; }
h2 { font-family:var(--head); font-size:22px; line-height:1.2; margin:30px 0 12px; }
.lede { color:var(--ink-2); font-size:17px; max-width:75ch; margin:0 0 18px; }
.save { background:#fff; border:1px solid var(--line); border-radius:22px; padding:28px; }
.kicker { margin:0 0 6px; font-size:13px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--purple-2); }
.where { display:flex; align-items:center; gap:8px; color:var(--ink-2); margin:0 0 16px; }
.flag { border-radius:3px; box-shadow:0 0 0 1px rgba(0,0,0,.08); flex:none; vertical-align:-2px; margin-right:6px; }
.where .flag { margin-right:0; }
.hook { font-size:18px; line-height:1.6; max-width:70ch; margin:0 0 16px; }
.meta { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:18px; }
.tag { display:inline-block; font-size:13px; font-weight:600; padding:4px 11px; border-radius:999px; background:var(--purple-soft); color:var(--purple); text-decoration:none; }
a.tag:hover { background:#E6D3EA; }
.tag.core { background:#DDF8EC; color:#0B6B47; } .tag.custom { background:#FDE6E9; color:#A3263A; } .tag.likely { background:#FFF4C7; color:#6B5300; }
.diff { display:inline-flex; align-items:center; gap:4px; font-weight:700; font-size:14px; }
.diff i { font-style:normal; color:#fff; border-radius:8px; padding:2px 9px; font-family:var(--head); }
.d1 { background:#1A8F60; } .d2 { background:#B87F0F; } .d3 { background:#C45A1B; } .d4 { background:#C42F45; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 16px; }
.credit { color:var(--ink-2); font-size:14px; margin:0 0 8px; }
.facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 22px; margin:0; }
.facts div { border-top:1px solid var(--line); padding-top:10px; }
.facts dt { font-size:12.5px; color:var(--ink-2); text-transform:uppercase; letter-spacing:.05em; }
.facts dd { margin:2px 0 0; font-weight:600; }
.rules { padding-left:20px; } .rules li { margin-bottom:6px; }
.items { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.item { background:#fff; border:1px solid var(--line); border-radius:18px; padding:16px 18px; display:flex; flex-direction:column; gap:6px; }
.item-link { font-family:var(--head); font-size:19px; color:var(--ink); text-decoration:none; }
.item-link:hover { color:var(--purple-2); text-decoration:underline; }
.item-sub { color:var(--ink-2); font-size:13.5px; display:flex; align-items:center; }
.item p { margin:0; font-size:14.5px; color:var(--ink); }
.item-meta { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:auto; padding-top:4px; }
.related { margin-top:26px; }
.group h2 { font-size:19px; margin:26px 0 8px; display:flex; align-items:center; gap:4px; }
.group h2 a { color:var(--ink); text-decoration:none; } .group h2 a:hover { text-decoration:underline; }
.group h2 small { font-family:var(--body); font-weight:500; font-size:13px; color:var(--ink-2); margin-left:6px; }
.names { list-style:none; padding:0; margin:0; columns:3 220px; column-gap:22px; }
.names li { break-inside:avoid; padding:3px 0; }
.names.wide small { color:var(--ink-2); }
.table-wrap { overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:18px; padding:6px 16px; }
.gt { width:100%; border-collapse:collapse; font-size:14.5px; }
.gt th { text-align:left; font-size:12.5px; color:var(--ink-2); padding:10px 12px 10px 0; border-bottom:1px solid var(--line); white-space:nowrap; }
.gt td { padding:9px 12px 9px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.gt td small { display:block; color:var(--ink-2); font-size:12.5px; }
.gt .num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.foot { border-top:1px solid var(--line); background:#fff; padding:26px 0 30px; }
.explore { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.explore h2 { font-size:15px; margin:0 0 8px; }
.explore h2 + ul + h2 { margin-top:16px; }
.explore ul { list-style:none; padding:0; margin:0; font-size:14px; columns:2 140px; column-gap:16px; }
.explore li { padding:2px 0; break-inside:avoid; }
.small { font-size:13px; color:var(--ink-2); margin:22px 0 0; }
@media (max-width:760px) {
  .items, .facts { grid-template-columns:minmax(0,1fr); }
  .explore { grid-template-columns:minmax(0,1fr); }
  .save { padding:20px; border-radius:18px; }
  .wrap { padding-inline:16px; }
  .bar nav { gap:12px; }
}