/* Fantasy Football Trade Analyzer: tokens, base type, header, footer, prose, FAQ.
   Calculator component styles live in calc.css. */
:root{
  --paper:#F7F7F5;--surface:#FFFFFF;--ink:#0A0A0A;--ink-2:#44443F;--mute:#6B6B66;--line:#E3E3DF;--line-2:#CFCFCA;
  --accent:#1F3FBF;--on-accent:#FFFFFF;
  --fair:#15803D;--fair-soft:#E8F7ED;--edge:#B45309;--edge-soft:#FEF3E2;--wins:#B42318;--wins-soft:#FDECEA;
  --qb:#ECE7F6;--qb-ink:#4A3B7A;--rb:#E3F1E9;--rb-ink:#1F5A3D;--wr:#E5ECF7;--wr-ink:#22436E;--te:#F6ECDF;--te-ink:#6B4416;--pk:#ECECE8;--pk-ink:#44443F;
  --font-display:"Iowan Old Style","Charter","Palatino Linotype","Book Antiqua",Georgia,serif;
  --font-ui:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue","Noto Sans",sans-serif;
  --r:6px;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:40px;--s7:64px;
}
@media (prefers-color-scheme:dark){:root{
  --paper:#121211;--surface:#1A1A19;--ink:#ECECE8;--ink-2:#C2C2BC;--mute:#9A9A93;--line:#2C2C2A;--line-2:#3A3A37;
  --accent:#8FA7FF;--on-accent:#0A0A0A;
  --fair:#5BD07A;--fair-soft:#143021;--edge:#F0A24C;--edge-soft:#3A2A14;--wins:#FF8A80;--wins-soft:#3A1A17;
  --qb:#2A2440;--qb-ink:#CFC4F2;--rb:#17301F;--rb-ink:#A9DDBE;--wr:#1A2638;--wr-ink:#B4CAEB;--te:#33281A;--te-ink:#EBCB9F;--pk:#262624;--pk-ink:#C2C2BC;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 14px/1.6 var(--font-ui);font-variant-numeric:tabular-nums}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--s5)}
.svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}

/* header */
.top{border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:var(--s5);height:56px}
.brand{font:600 16px/1 var(--font-display);color:var(--ink)}
.brand:hover{text-decoration:none}
.nav{display:flex;gap:var(--s5);margin-left:var(--s4)}
.nav a{color:var(--ink-2)}
.nav a[aria-current]{color:var(--ink);font-weight:600}
.top .header-fakedoor{margin-left:auto}
.fd-short{display:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);height:32px;padding:0 12px;border-radius:var(--r);font:500 14px/1 var(--font-ui);cursor:pointer;border:1px solid transparent;white-space:nowrap;transition:background-color .15s,border-color .15s,color .15s}
.btn:hover{text-decoration:none}
.btn-primary{background:var(--accent);color:var(--on-accent)}
.btn-primary:hover{background:color-mix(in srgb,var(--accent) 88%,#000)}
.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--line-2)}
.btn-secondary:hover{border-color:var(--ink-2)}
.fakedoor-btn{background:none;border:0;padding:0 4px;font:400 14px/1 var(--font-ui);color:var(--ink-2);cursor:pointer;min-height:32px}
.fakedoor-btn:hover{color:var(--accent);text-decoration:underline}

/* page head */
.page-head{padding-top:var(--s6);padding-bottom:var(--s5)}
h1{font:500 34px/1.15 var(--font-display);margin:0;letter-spacing:-.01em}
.sub{font-size:16px;color:var(--ink-2);margin:var(--s2) 0 0;max-width:680px}
.meta{font-size:12px;line-height:1.5;color:var(--mute);margin:var(--s3) 0 0}
.crumbs{font-size:12px;color:var(--mute);margin:0 0 var(--s3)}
.crumbs a{color:var(--mute)}
.crumbs a:hover{color:var(--accent)}
.crumbs span[aria-current]{color:var(--ink-2)}
.mount{padding-bottom:var(--s6)}

/* below the fold */
.sec{border-top:1px solid var(--line);padding:var(--s6) 0}
.sec h2{font:600 20px/1.3 var(--font-ui);margin:0 0 var(--s3)}
.sec h3{font:600 16px/1.4 var(--font-ui);margin:var(--s5) 0 var(--s2)}
.prose{max-width:680px;color:var(--ink-2)}
.prose p{margin:0 0 var(--s3)}
.prose ul,.prose ol{margin:0 0 var(--s3);padding-left:var(--s5)}
.prose li{margin:0 0 var(--s1)}
.prose strong,.prose h2,.prose h3{color:var(--ink)}
.table-wrap{overflow-x:auto;margin:var(--s3) 0 var(--s4);max-width:760px}
table{border-collapse:collapse;width:100%;font-size:13px}
th,td{text-align:left;vertical-align:top;padding:var(--s2) var(--s3);border-top:1px solid var(--line)}
thead th{border-top:0;border-bottom:1px solid var(--ink-2);font-weight:600;color:var(--ink)}
td{color:var(--ink-2)}
.links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);margin-top:var(--s4)}
.links a{display:block;border-top:1px solid var(--line);padding-top:var(--s3);color:var(--ink)}
.links a:hover{text-decoration:none}
.links a strong{display:block;color:var(--accent);font-weight:600}
.links a span{color:var(--ink-2)}

/* FAQ */
details{border-top:1px solid var(--line);max-width:760px}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{min-height:48px;display:flex;align-items:center;gap:var(--s3);cursor:pointer;font-weight:600;list-style:none}
summary::-webkit-details-marker{display:none}
summary .svg{margin-left:auto;transition:transform .15s}
details[open] summary .svg{transform:rotate(180deg)}
details p{margin:0 0 var(--s4);color:var(--ink-2)}
.final{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap}
.final h2{margin:0}

/* legal and 404 */
.legal{max-width:720px;padding:var(--s6) 0 var(--s7)}
.legal h1{margin-bottom:var(--s3)}
.legal h2{font:600 18px/1.35 var(--font-ui);margin:var(--s6) 0 var(--s3)}
.legal p,.legal li{color:var(--ink-2)}
.legal ul{padding-left:var(--s5)}
.legal code{font-size:13px}

/* footer */
footer{border-top:1px solid var(--line);padding:var(--s5) 0 var(--s6);font-size:12px;line-height:1.5;color:var(--mute)}
footer p{margin:0 0 var(--s2)}
footer nav{display:flex;flex-wrap:wrap;gap:var(--s4)}

@media (max-width:860px){
  .wrap{padding:0 var(--s4)}
  .nav{display:none}
  .top .header-fakedoor{min-height:44px;white-space:nowrap}
  .fd-long{display:none}
  .fd-short{display:inline}
  .page-head{padding-top:var(--s5);padding-bottom:var(--s4)}
  h1{font-size:28px}
  .sub{font-size:15px}
  .btn{height:44px;padding:0 16px}
  .brand{display:inline-flex;align-items:center;min-height:44px}
  .links{grid-template-columns:1fr;gap:var(--s3)}
  .links a{min-height:44px}
  .crumbs a{display:inline-flex;align-items:center;min-height:44px}
  footer a{display:inline-flex;align-items:center;min-height:44px}
  footer{padding-bottom:96px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}