/* Top of Prompt. Brand: SDM SPACE #0F0E0E, SUN #FECC10, EARTH #1151FE, DUST #FEFEFF */
:root{
  --ground:#FEFEFF; --surface:#F3F5FA; --surface-2:#E9ECF6; --line:#DDE1EE;
  --ink:#141519; --ink-2:#4B4E57; --ink-3:#7A7E88;
  --sun:#FECC10; --sun-ink:#0F0E0E; --earth:#1151FE; --space:#0F0E0E;
  --accent-text:#8A6000;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --body:"Hanken Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"Courier New",monospace;
  --measure:46rem;
  --radius:3px;
}
@media (prefers-color-scheme:dark){
  :root{
    --ground:#0E0E10; --surface:#17181C; --surface-2:#1F2128; --line:#2A2C35;
    --ink:#F2F3F7; --ink-2:#B0B4C1; --ink-3:#7C818F;
    --earth:#89A4FF; --accent-text:#FECC10;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:var(--body); font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--measure); margin:0 auto; padding:0 1.5rem}
.wrap-wide{max-width:64rem; margin:0 auto; padding:0 1.5rem}
p{margin:0 0 1.15rem}
a{color:var(--earth); text-decoration-thickness:1px; text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--sun); outline-offset:3px; border-radius:2px}
strong{font-weight:600}
img{max-width:100%; height:auto}
.skip{position:absolute; left:-9999px}
.skip:focus{left:1rem; top:1rem; z-index:10; background:var(--sun); color:var(--sun-ink); padding:.6rem 1rem; border-radius:var(--radius)}

/* header */
header.site{background:var(--space); color:#FEFEFF; position:sticky; top:0; z-index:5}
header.site .bar{display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:60px; flex-wrap:wrap; max-width:64rem}
.brand{
  font-family:var(--display); font-weight:700; font-size:1.12rem; letter-spacing:-.01em;
  color:#FEFEFF; text-decoration:none; white-space:nowrap;
}
.brand::after{content:""; display:inline-block; width:6px; height:6px; background:var(--sun); border-radius:50%; margin-left:.45rem; vertical-align:middle}
header.site nav{display:flex; gap:1.25rem; flex-wrap:wrap}
header.site nav a{
  color:#C9C6BE; text-decoration:none; font-size:.86rem; font-weight:500;
  padding:.35rem 0; border-bottom:2px solid transparent;
}
header.site nav a:hover{color:#FEFEFF}
header.site nav a[aria-current="page"]{color:var(--sun); border-bottom-color:var(--sun)}

/* hero */
.hero{background:var(--space); color:#FEFEFF; padding:3.6rem 0 3.2rem; border-bottom:1px solid #2B2926}
.hero .eyebrow{color:#A7A49C}
.hero h1{
  font-family:var(--display); font-weight:700; font-size:clamp(2rem,6.2vw,3.2rem);
  line-height:1.05; letter-spacing:-.022em; margin:0 0 1.1rem; text-wrap:balance; max-width:32ch;
}
.hero h1 em{font-style:normal; color:var(--sun)}
.hero .answer{font-size:1.14rem; color:#DCD9D2; max-width:44ch; margin:0 0 1.6rem}
.hero .answer strong{color:#FEFEFF}

.eyebrow{
  font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); margin:0 0 1.2rem;
}

/* sections */
section{padding:3rem 0 .6rem}
section.tint{background:var(--surface); padding:3rem 0 2.4rem; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
h1{font-family:var(--display); font-weight:700; letter-spacing:-.02em; line-height:1.08}
h2{
  font-family:var(--display); font-weight:700; font-size:clamp(1.4rem,4.2vw,1.9rem);
  line-height:1.16; letter-spacing:-.015em; margin:0 0 1rem; text-wrap:balance;
}
h3{font-family:var(--body); font-weight:600; font-size:1.04rem; margin:1.6rem 0 .35rem}
.lede{font-size:1.12rem; color:var(--ink-2)}

/* the answer-first block used at the top of interior pages */
.answer-block{
  border-left:3px solid var(--sun); padding:.1rem 0 .1rem 1.2rem; margin:0 0 1.8rem;
}
.answer-block p{font-size:1.12rem; margin:0}

/* callout */
.callout{background:var(--surface); border-left:3px solid var(--sun); padding:1.3rem 1.4rem; margin:1.6rem 0; border-radius:0 var(--radius) var(--radius) 0}
.callout :last-child{margin-bottom:0}
.callout h3{margin-top:0}
.note{background:var(--surface); border:1px solid var(--line); padding:1.1rem 1.2rem; border-radius:var(--radius); margin:1.6rem 0; font-size:.95rem; color:var(--ink-2)}
.note :last-child{margin-bottom:0}

/* buttons */
.btn{
  display:inline-block; background:var(--sun); color:var(--sun-ink); font-weight:600;
  padding:.8rem 1.4rem; border-radius:var(--radius); text-decoration:none; border:0; cursor:pointer;
  font-family:var(--body); font-size:1rem;
}
.btn:hover{filter:brightness(1.07)}
.btn.ghost{background:transparent; color:inherit; border:1px solid currentColor; font-weight:500}
.btn-row{display:flex; gap:.8rem; flex-wrap:wrap; align-items:center; margin:0 0 .4rem}

/* formula / mono block */
.formula{
  font-family:var(--mono); font-size:.94rem; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); padding:1.1rem 1.2rem; margin:1.2rem 0; overflow-x:auto; color:var(--ink);
}
.formula b{color:var(--accent-text); font-weight:500}

/* tables */
.scroller{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius); margin:1.4rem 0}
table{border-collapse:collapse; width:100%; min-width:30rem; font-size:.95rem}
th,td{text-align:left; padding:.75rem 1rem; border-bottom:1px solid var(--line); vertical-align:top}
thead th{font-family:var(--mono); font-size:.67rem; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); background:var(--surface); font-weight:400}
tbody tr:last-child td{border-bottom:0}
td.k{white-space:nowrap; font-weight:600}

/* lists */
ul.plain{list-style:none; margin:0 0 1.2rem; padding:0; display:grid; gap:.85rem}
ul.plain li{display:grid; grid-template-columns:1.2rem 1fr; gap:.7rem; color:var(--ink-2)}
ul.plain .m{color:var(--accent-text); font-family:var(--mono); line-height:1.5}
ol.steps{padding-left:1.3rem; display:grid; gap:.7rem; margin:0 0 1.2rem}
ol.steps li{color:var(--ink-2)}
ol.steps b{color:var(--ink)}

/* cards */
.cards{display:grid; gap:1.1rem; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); margin:1.5rem 0}
.card{border:1px solid var(--line); border-radius:var(--radius); padding:1.2rem; background:var(--ground)}
.card .role{font-family:var(--mono); font-size:.65rem; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); display:block; margin-bottom:.5rem}
.card h3{margin:0 0 .35rem}
.card p{margin:0; font-size:.95rem; color:var(--ink-2)}

/* prompt sample */
.prompt{
  font-family:var(--mono); font-size:.95rem; line-height:1.55; background:var(--space); color:#FEFEFF;
  border-radius:var(--radius); padding:1.1rem 1.2rem; margin:1.2rem 0;
}
.prompt span{color:var(--sun)}

/* form */
form.tp{display:grid; gap:1.05rem; max-width:32rem; margin:1.6rem 0}
form.tp .row{display:grid; gap:.3rem}
form.tp label{font-weight:600; font-size:.93rem}
form.tp .hint{font-size:.85rem; color:var(--ink-3)}
form.tp input,form.tp select{
  font:inherit; font-size:1rem; padding:.7rem .8rem; border:1px solid var(--line);
  border-radius:var(--radius); background:var(--ground); color:var(--ink); width:100%;
}
form.tp .consent{display:grid; grid-template-columns:1.2rem 1fr; gap:.7rem; align-items:start; font-size:.9rem; color:var(--ink-2)}
form.tp .consent input{width:auto; margin-top:.25rem}
form.tp .status{font-size:.93rem; min-height:1.4rem}
form.tp .status[data-state="error"]{color:#B3261E}
@media (prefers-color-scheme:dark){form.tp .status[data-state="error"]{color:#FF8A80}}

/* footer */
footer.site{border-top:1px solid var(--line); margin-top:3.5rem; padding:2.4rem 0 3rem; background:var(--surface)}
footer.site .wrap{max-width:64rem}
.foot-grid{display:grid; gap:1.8rem; grid-template-columns:repeat(auto-fit,minmax(14rem,1fr)); margin-bottom:2rem}
.foot-grid a{display:block; font-size:.92rem; color:var(--ink-2); text-decoration:none; padding:.15rem 0}
.foot-grid a:hover{color:var(--earth); text-decoration:underline}
.foot-brand{font-family:var(--display); font-weight:700; margin:0 0 .5rem}
.foot-h{font-family:var(--mono); font-size:.66rem; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); margin:0 0 .6rem}
.small{font-size:.88rem; color:var(--ink-3)}
.small a{color:var(--ink-2)}
.updated{border-top:1px solid var(--line); padding-top:1.2rem; margin:0}

/* faq details */
details.q{border-bottom:1px solid var(--line); padding:1rem 0}
details.q summary{font-weight:600; cursor:pointer; list-style:none}
details.q summary::-webkit-details-marker{display:none}
details.q summary::before{content:"+ "; color:var(--accent-text); font-family:var(--mono)}
details.q[open] summary::before{content:"\2212 "}
details.q p{margin:.7rem 0 0; color:var(--ink-2)}

.status-pill{
  display:inline-block; font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase;
  background:var(--sun); color:var(--sun-ink); padding:.25rem .55rem; border-radius:2px; margin-bottom:1rem;
}