/* ============================================================
   SARMS Institute — shared design system
   Single source of truth for every page. Link, do not inline.
   ============================================================ */
:root{
  --paper:#F5F2EA;      --surface:#FCFBF6;   --surface-2:#F0ECE0;
  --ink:#1A1A15;        --ink-soft:#4B4A40;  --ink-faint:#77746A;
  --line:rgba(26,26,21,.14); --line-strong:rgba(26,26,21,.28);
  --pine:#1E4436;       --pine-bright:#2C6B51; --pine-ink:#153026;
  --brass:#8A6D1F;      --brass-bright:#A8871F;
  --legal:#2E6B51;      --restricted:#9A6B12; --illegal:#95292A;
  --grain:.035;
  --serif:"Newsreader",Georgia,serif;
  --sans:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --maxw:1180px;
}
:root[data-theme="dark"]{
  --paper:#13140F;      --surface:#1A1C15;   --surface-2:#20221A;
  --ink:#ECE8DB;        --ink-soft:#B4B0A2;  --ink-faint:#847F70;
  --line:rgba(236,232,219,.14); --line-strong:rgba(236,232,219,.30);
  --pine:#5FB68E;       --pine-bright:#77CFA5; --pine-ink:#0E1F18;
  --brass:#C6A548;      --brass-bright:#DCBB5B;
  --legal:#5FB68E;      --restricted:#D0A24E; --illegal:#D66A6A;
  --grain:.05;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--paper);color:var(--ink);font-family:var(--sans);
  font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  opacity:var(--grain);mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
:root[data-theme="dark"] body::before{mix-blend-mode:screen}
::selection{background:var(--pine);color:var(--paper)}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;position:relative;z-index:2}
@media(max-width:680px){.wrap{padding:0 20px}}
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ink-faint);font-weight:500}

/* ---------- utility bar ---------- */
.util{border-bottom:1px solid var(--line);background:var(--pine-ink);position:relative;z-index:3}
:root[data-theme="dark"] .util{background:#0C1610}
.util .wrap{display:flex;align-items:center;justify-content:space-between;height:34px}
.util-run{font-family:var(--mono);font-size:10.5px;letter-spacing:.24em;
  text-transform:uppercase;color:rgba(245,242,234,.62);white-space:nowrap;overflow:hidden}
.util-run b{color:rgba(245,242,234,.92);font-weight:500}
.toggle{font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(245,242,234,.7);background:none;border:1px solid rgba(245,242,234,.22);
  padding:4px 10px;border-radius:2px;cursor:pointer;transition:.2s;white-space:nowrap}
.toggle:hover{color:#fff;border-color:rgba(245,242,234,.5)}

/* ---------- masthead ---------- */
.mast{border-bottom:1px solid var(--line-strong);position:sticky;top:0;z-index:3;
  background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(10px) saturate(1.2)}
.mast .wrap{display:flex;align-items:center;justify-content:space-between;height:82px;gap:24px}
.brand{display:flex;align-items:center;gap:16px}
.seal{width:46px;height:46px;flex-shrink:0}
.seal .ring-txt{font-family:var(--mono);font-size:7.4px;letter-spacing:.9px;fill:var(--ink-soft);text-transform:uppercase}
.seal .mono-si{font-family:var(--serif);font-weight:600;font-size:20px;fill:var(--ink)}
.seal circle,.seal path,.seal polygon{stroke:var(--ink-soft)}
.wordmark{display:flex;flex-direction:column;gap:1px}
.wordmark .name{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:.02em;line-height:1}
.wordmark .name span{color:var(--pine)}
.wordmark .sub{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint)}
nav.main{display:flex;gap:30px;align-items:center}
nav.main a{font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink-soft);
  position:relative;padding:4px 0;transition:color .2s}
nav.main a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;
  background:var(--pine);transition:width .25s ease}
nav.main a:hover{color:var(--ink)}
nav.main a:hover::after{width:100%}
@media(max-width:860px){nav.main{display:none}.wordmark .sub{display:none}}

/* ---------- hero ---------- */
.hero{padding:88px 0 72px;border-bottom:1px solid var(--line);position:relative}
.hero-grid{display:grid;grid-template-columns:1fr 340px;gap:64px;align-items:start}
@media(max-width:940px){.hero-grid{grid-template-columns:1fr;gap:44px}}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(38px,6vw,72px);
  line-height:1.02;letter-spacing:-.015em;margin:22px 0 0}
.hero h1 em{font-style:italic;color:var(--pine)}
.lede{font-family:var(--serif);font-size:clamp(19px,2.3vw,23px);line-height:1.5;
  color:var(--ink-soft);max-width:40ch;margin-top:30px}
.lede::first-letter{font-size:3.1em;line-height:.82;float:left;font-weight:500;
  padding:6px 12px 0 0;color:var(--pine)}
.hero-cta{display:flex;gap:14px;margin-top:38px;flex-wrap:wrap}
.btn{font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.01em;
  padding:13px 22px;border-radius:2px;cursor:pointer;transition:.2s;display:inline-flex;
  align-items:center;gap:9px;border:1px solid transparent}
.btn-primary{background:var(--pine);color:var(--paper)}
.btn-primary:hover{background:var(--pine-bright);transform:translateY(-1px)}
:root[data-theme="dark"] .btn-primary{color:var(--pine-ink)}
.btn-ghost{border-color:var(--line-strong);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink);background:var(--surface)}
.btn .arw{font-family:var(--mono);transition:transform .2s}
.btn:hover .arw{transform:translateX(3px)}

/* ledger */
.ledger{border:1px solid var(--line-strong);background:var(--surface);border-radius:3px;overflow:hidden}
.ledger-hd{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-faint);padding:14px 18px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.ledger-row{display:flex;justify-content:space-between;gap:16px;padding:14px 18px;
  border-bottom:1px solid var(--line);font-size:14px}
.ledger-row:last-child{border-bottom:none}
.ledger-row .k{color:var(--ink-faint);font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.ledger-row .v{font-weight:600;text-align:right;font-family:var(--serif);font-size:16px}
.ledger-row .v.pos{color:var(--legal)}
.ledger-row .v.accent{color:var(--brass-bright)}

/* section scaffolding */
section{padding:78px 0;border-bottom:1px solid var(--line);scroll-margin-top:96px}
.sec-head{display:flex;align-items:baseline;gap:18px;margin-bottom:14px}
.sec-head .num{font-family:var(--mono);font-size:12px;color:var(--brass);letter-spacing:.1em}
h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.6vw,40px);
  line-height:1.08;letter-spacing:-.01em;max-width:22ch}
.sec-intro{font-size:17px;color:var(--ink-soft);max-width:60ch;margin-top:18px;line-height:1.65}

/* collective block */
.indep{background:var(--pine-ink);border-bottom:1px solid var(--line)}
:root[data-theme="dark"] .indep{background:#0C1610}
.indep *{color:#F5F2EA}
.indep .eyebrow{color:rgba(245,242,234,.55)}
.indep h2{max-width:24ch}
.indep .decl{font-family:var(--serif);font-size:clamp(22px,2.8vw,30px);line-height:1.4;
  font-style:italic;max-width:26ch;margin-top:8px}
.indep-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:44px;
  background:rgba(245,242,234,.14);border:1px solid rgba(245,242,234,.14)}
@media(max-width:800px){.indep-grid{grid-template-columns:repeat(2,1fr)}}
.indep-cell{background:var(--pine-ink);padding:26px 22px}
:root[data-theme="dark"] .indep-cell{background:#0C1610}
.indep-cell .lab{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(245,242,234,.5)}
.indep-cell .big{font-family:var(--serif);font-size:30px;margin:10px 0 6px;color:#fff}
.indep-cell .small{font-size:13px;color:rgba(245,242,234,.72);line-height:1.5}

/* record cards */
.record-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border:1px solid var(--line-strong);border-radius:3px;overflow:hidden;margin-top:40px}
@media(max-width:820px){.record-grid{grid-template-columns:1fr}}
.rec{padding:34px 30px;border-right:1px solid var(--line);background:var(--surface);
  transition:background .25s;position:relative;display:block;color:inherit}
.rec:last-child{border-right:none}
@media(max-width:820px){.rec{border-right:none;border-bottom:1px solid var(--line)}.rec:last-child{border-bottom:none}}
.rec:hover{background:var(--surface-2)}
.rec .idx{font-family:var(--mono);font-size:11px;color:var(--brass);letter-spacing:.12em}
.rec h3{font-family:var(--serif);font-weight:500;font-size:24px;margin:16px 0 12px;line-height:1.15}
.rec p{font-size:14.5px;color:var(--ink-soft);line-height:1.6}
.rec .status{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-faint);margin-top:20px;display:inline-flex;align-items:center;gap:7px}
.rec .dot{width:6px;height:6px;border-radius:50%;background:var(--brass)}

/* tables (legality etc.) */
.tracker{margin-top:40px;border:1px solid var(--line-strong);border-radius:3px;overflow:hidden;background:var(--surface)}
.tracker-note{font-family:var(--mono);font-size:11px;color:var(--ink-faint);
  padding:12px 20px;border-bottom:1px solid var(--line);background:var(--surface-2);
  letter-spacing:.04em;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
table{width:100%;border-collapse:collapse;font-size:14.5px}
thead th{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-faint);text-align:left;padding:14px 20px;border-bottom:1px solid var(--line-strong);font-weight:500}
tbody td{padding:16px 20px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:none}
tbody tr{transition:background .2s}
tbody tr:hover{background:var(--surface-2)}
.jur{font-family:var(--serif);font-size:17px;font-weight:500}
.jur small{display:block;font-family:var(--mono);font-size:10px;color:var(--ink-faint);
  letter-spacing:.08em;margin-top:3px;text-transform:uppercase}
.pill{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:4px 10px;border-radius:2px;font-weight:500;white-space:nowrap;display:inline-block;border:1px solid transparent}
.pill.legal{color:var(--legal);border-color:color-mix(in srgb,var(--legal) 40%,transparent);background:color-mix(in srgb,var(--legal) 10%,transparent)}
.pill.restricted{color:var(--restricted);border-color:color-mix(in srgb,var(--restricted) 40%,transparent);background:color-mix(in srgb,var(--restricted) 10%,transparent)}
.pill.illegal{color:var(--illegal);border-color:color-mix(in srgb,var(--illegal) 40%,transparent);background:color-mix(in srgb,var(--illegal) 10%,transparent)}
td.cite{font-family:var(--mono);font-size:12px;color:var(--ink-faint);line-height:1.5;max-width:26ch}
@media(max-width:760px){
  thead{display:none}
  tbody td{display:block;padding:6px 20px;border:none}
  tbody tr{display:block;padding:16px 0;border-bottom:1px solid var(--line)}
  tbody td.cite{padding-bottom:16px}
}

/* evidence scale (grade cards) */
.grade-scale{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:40px}
@media(max-width:820px){.grade-scale{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.grade-scale{grid-template-columns:1fr}}
.grade{border:1px solid var(--line-strong);border-radius:3px;padding:24px 22px;background:var(--surface);position:relative;overflow:hidden}
.grade .bar{position:absolute;top:0;left:0;height:4px;width:100%}
.grade.g4 .bar{background:var(--legal)}
.grade.g3 .bar{background:var(--brass-bright)}
.grade.g2 .bar{background:var(--restricted)}
.grade.g1 .bar{background:var(--illegal)}
.grade .lvl{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-faint)}
.grade h4{font-family:var(--serif);font-weight:500;font-size:21px;margin:10px 0 8px}
.grade p{font-size:13.5px;color:var(--ink-soft);line-height:1.55}

/* standards list */
.std-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin-top:40px;border-top:1px solid var(--line)}
@media(max-width:760px){.std-grid{grid-template-columns:1fr}}
.std{padding:28px 30px 28px 0;border-bottom:1px solid var(--line);display:flex;gap:20px}
.std:nth-child(odd){border-right:1px solid var(--line);padding-right:40px}
@media(max-width:760px){.std:nth-child(odd){border-right:none;padding-right:0}}
.std .n{font-family:var(--mono);font-size:12px;color:var(--brass);flex-shrink:0;padding-top:4px;letter-spacing:.05em}
.std h4{font-family:var(--serif);font-weight:600;font-size:18px;margin-bottom:7px}
.std p{font-size:14px;color:var(--ink-soft);line-height:1.6}

/* footer */
footer{background:var(--surface-2);padding:70px 0 40px}
.foot-top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px;padding-bottom:44px;border-bottom:1px solid var(--line)}
@media(max-width:760px){.foot-top{grid-template-columns:1fr;gap:32px}}
.foot-brand .name{font-family:var(--serif);font-weight:600;font-size:20px}
.foot-brand .name span{color:var(--pine)}
.foot-disc{font-size:13px;color:var(--ink-soft);line-height:1.65;margin-top:14px;max-width:42ch}
.foot-col h5{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:16px}
.foot-col a{display:block;font-size:14px;color:var(--ink-soft);padding:5px 0;transition:color .2s}
.foot-col a:hover{color:var(--pine)}
.foot-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;
  padding-top:28px;font-family:var(--mono);font-size:11px;color:var(--ink-faint);letter-spacing:.06em}
.foot-meta .reg{display:flex;gap:22px;flex-wrap:wrap}
.not-advice{font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--ink-faint);
  border:1px dashed var(--line-strong);border-radius:3px;padding:14px 18px;margin-top:34px;text-align:center}

/* reveal */
.js .rev{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.js .rev.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rev{opacity:1;transform:none;transition:none}}
:focus-visible{outline:2px solid var(--pine);outline-offset:3px;border-radius:2px}

/* ============================================================
   CONTENT / ARTICLE PAGES
   ============================================================ */
.breadcrumb{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-faint);padding:22px 0 0}
.breadcrumb a{color:var(--ink-faint);transition:color .2s}
.breadcrumb a:hover{color:var(--pine)}
.breadcrumb .sep{margin:0 8px;opacity:.5}

/* compound header */
.cmpd-head{padding:34px 0 40px;border-bottom:1px solid var(--line)}
.cmpd-head .kicker{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass)}
.cmpd-head h1{font-family:var(--serif);font-weight:500;font-size:clamp(34px,5vw,58px);line-height:1.03;letter-spacing:-.015em;margin:14px 0 0}
.cmpd-head .aka{font-family:var(--mono);font-size:13px;color:var(--ink-faint);margin-top:14px;letter-spacing:.03em}
.cmpd-head .oneline{font-family:var(--serif);font-size:clamp(19px,2.2vw,24px);line-height:1.45;color:var(--ink-soft);max-width:46ch;margin-top:22px}
.classflag{display:inline-block;margin-top:20px;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;
  border:1px solid var(--restricted);color:var(--restricted);background:color-mix(in srgb,var(--restricted) 8%,transparent);
  padding:10px 14px;border-radius:3px;line-height:1.5;max-width:62ch}

/* article layout: prose + sticky rail */
.doc{display:grid;grid-template-columns:1fr 320px;gap:56px;align-items:start;padding:48px 0 20px}
@media(max-width:940px){.doc{grid-template-columns:1fr;gap:36px}}
.prose{min-width:0}
.prose h2{font-family:var(--serif);font-weight:500;font-size:clamp(24px,3vw,32px);margin:8px 0 0;letter-spacing:-.01em;max-width:none}
.prose h2:not(:first-child){margin-top:8px}
.prose .block{padding:34px 0;border-bottom:1px solid var(--line)}
.prose .block:last-child{border-bottom:none}
.prose p{font-size:16.5px;line-height:1.7;color:var(--ink-soft);margin-top:16px;max-width:64ch}
.prose p strong{color:var(--ink);font-weight:600}
.prose .secnum{font-family:var(--mono);font-size:12px;color:var(--brass);letter-spacing:.1em;display:block;margin-bottom:12px}
sup.ref{font-family:var(--mono);font-size:.68em;color:var(--pine);font-weight:600;vertical-align:super;padding:0 1px}
sup.ref a{color:var(--pine)}

/* at-a-glance rail card */
.rail{position:sticky;top:104px;display:flex;flex-direction:column;gap:20px}
@media(max-width:940px){.rail{position:static}}
.card{border:1px solid var(--line-strong);border-radius:3px;background:var(--surface);overflow:hidden}
.card-hd{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);
  padding:14px 18px;border-bottom:1px solid var(--line);background:var(--surface-2)}
.card-row{display:flex;justify-content:space-between;gap:14px;padding:13px 18px;border-bottom:1px solid var(--line);font-size:13.5px}
.card-row:last-child{border-bottom:none}
.card-row .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-faint)}
.card-row .v{text-align:right;font-family:var(--serif);font-size:15px;font-weight:500}

/* evidence grade badge (inline) */
.gb{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  padding:3px 9px;border-radius:2px;white-space:nowrap;border:1px solid transparent;display:inline-block}
.gb.established{color:var(--legal);border-color:color-mix(in srgb,var(--legal) 45%,transparent);background:color-mix(in srgb,var(--legal) 12%,transparent)}
.gb.probable{color:var(--brass-bright);border-color:color-mix(in srgb,var(--brass-bright) 45%,transparent);background:color-mix(in srgb,var(--brass-bright) 12%,transparent)}
.gb.preliminary{color:var(--restricted);border-color:color-mix(in srgb,var(--restricted) 45%,transparent);background:color-mix(in srgb,var(--restricted) 12%,transparent)}
.gb.insufficient{color:var(--illegal);border-color:color-mix(in srgb,var(--illegal) 45%,transparent);background:color-mix(in srgb,var(--illegal) 12%,transparent)}

/* evidence rows (outcome + grade) */
.ev{border:1px solid var(--line-strong);border-radius:3px;overflow:hidden;margin-top:22px;background:var(--surface)}
.ev-row{padding:20px 22px;border-bottom:1px solid var(--line)}
.ev-row:last-child{border-bottom:none}
.ev-row .top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.ev-row .outcome{font-family:var(--serif);font-size:18px;font-weight:500}
.ev-row .summary{font-size:14.5px;color:var(--ink-soft);line-height:1.6;margin-top:8px;max-width:62ch}
.ev-row .note{font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);line-height:1.55;margin-top:10px}

/* safety callout */
.safety-box{border:1px solid color-mix(in srgb,var(--illegal) 40%,transparent);border-left:3px solid var(--illegal);
  border-radius:3px;background:color-mix(in srgb,var(--illegal) 5%,transparent);padding:6px 0;margin-top:22px}
.safety-box .srow{padding:16px 22px;border-bottom:1px solid var(--line)}
.safety-box .srow:last-child{border-bottom:none}
.safety-box .top{display:flex;justify-content:space-between;align-items:center;gap:14px}
.safety-box .signal{font-family:var(--serif);font-size:17px;font-weight:500}
.safety-box .summary{font-size:14px;color:var(--ink-soft);line-height:1.6;margin-top:7px;max-width:62ch}

/* trials table wrapper */
.tbl-wrap{overflow-x:auto;margin-top:22px;border:1px solid var(--line-strong);border-radius:3px}
.tbl-wrap table{min-width:640px}
.tbl-wrap td{font-size:14px}
.tbl-wrap .id{font-family:var(--mono);font-size:12.5px;color:var(--ink)}

/* references */
.refs{margin-top:22px;counter-reset:none}
.refs ol{list-style:none;counter-reset:r}
.refs li{counter-increment:r;position:relative;padding:14px 0 14px 40px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.55;color:var(--ink-soft)}
.refs li:last-child{border-bottom:none}
.refs li::before{content:counter(r);position:absolute;left:0;top:14px;font-family:var(--mono);font-size:12px;color:var(--brass);font-weight:600}
.refs a{color:var(--pine);word-break:break-word}
.refs a:hover{text-decoration:underline}
.refs .meta{font-family:var(--mono);font-size:11.5px;color:var(--ink-faint);display:block;margin-top:3px}

/* review meta line */
.reviewed{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--ink-faint);
  padding:20px 0 0;line-height:1.7}
.reviewed b{color:var(--ink-soft);font-weight:500}

/* index grid of compound cards */
.idx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0;
  border:1px solid var(--line-strong);border-radius:3px;overflow:hidden;margin-top:40px}
.idx-card{padding:28px 26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  background:var(--surface);transition:background .2s;display:block;color:inherit}
.idx-card:hover{background:var(--surface-2)}
.idx-card .abbr{font-family:var(--mono);font-size:11px;color:var(--brass);letter-spacing:.1em}
.idx-card h3{font-family:var(--serif);font-weight:500;font-size:22px;margin:12px 0 8px}
.idx-card p{font-size:14px;color:var(--ink-soft);line-height:1.55}
.idx-card .tags{margin-top:16px;display:flex;gap:8px;flex-wrap:wrap}