/* CSAScoreCheck — Pine & Signal, premium edition.
   Deep-pine fields, warm paper, brass + vivid signal accents.
   Mobile-first. No frameworks, no webfonts (system serif display stack). */
:root{
  --pine:#0C3B2E; --pine2:#082E21; --deep:#05211A;
  --paper:#FAF8F2; --paper2:#F2EEE3; --card:#FFFFFF;
  --signal:#1FA85C; --signal-hi:#2BB673; --signal-lo:#1A9E57; --signaltext:#177A43;
  --brass:#B8860B; --brass-hi:#DFAF57; --brass-soft:#EBCB8B; --brass-text:#7D5F14;
  --amber:#E8A33D; --amber-hi:#F3BE5C; --red:#B02E28; --red-hi:#C03A30;
  --ink:#1E2420; --ink2:#4A564F; --line:#E3DED0; --line2:#EAE4D3;
  --radius:16px;
  --font-d:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --shadow-card:0 1px 2px rgba(30,36,32,.05),0 16px 38px -18px rgba(12,59,46,.28);
  --shadow-panel:0 1px 2px rgba(30,36,32,.04),0 12px 26px -16px rgba(12,59,46,.18);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.6}
h1,h2,h3{color:var(--pine);font-family:var(--font-d);line-height:1.16;margin:0 0 .5em;font-weight:700;letter-spacing:-.015em}
h1{font-size:2.1rem}
h2{font-size:1.55rem;margin-top:1.9em}
h3{font-size:1.16rem;margin-top:1.35em}
p{margin:.55em 0}
a{color:var(--pine);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#C9A44E}
a:hover{color:var(--pine2)}
.wrap{max-width:1060px;margin:0 auto;padding:0 16px}
.small{font-size:.88rem;color:var(--ink2)}
.num{font-variant-numeric:tabular-nums lining-nums}
::selection{background:var(--brass-hi);color:var(--deep)}
:focus-visible{outline:3px solid rgba(223,175,87,.65);outline-offset:2px}

/* section flourish: a short brass-to-signal rule over main headings */
main h2::before{content:"";display:block;width:46px;height:4px;border-radius:2px;
  background:linear-gradient(90deg,var(--brass-hi),var(--signal));margin-bottom:12px}

/* header */
header.site{background:linear-gradient(180deg,#FDFBF6,var(--paper));border-bottom:1px solid var(--line);
  box-shadow:0 10px 28px -18px rgba(12,59,46,.25)}
.hd{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0}
.lockup{display:flex;align-items:baseline;gap:.45em;text-decoration:none;font-weight:800;font-size:1.3rem;letter-spacing:-.01em}
.lockup .mark{display:inline-flex;align-items:center;justify-content:center;width:35px;height:35px;border-radius:9px;
  background:linear-gradient(150deg,#114534,#093325);color:var(--paper);font-size:1.2rem;font-weight:800;align-self:center;
  box-shadow:0 4px 10px -4px rgba(12,59,46,.55),inset 0 1px 0 rgba(255,255,255,.22)}
.lockup .a{color:var(--pine)} .lockup .b{color:var(--signaltext)}
nav.main{display:flex;gap:4px;flex-wrap:wrap}
nav.main a{color:var(--pine);text-decoration:none;font-weight:650;font-size:.95rem;padding:8px 10px;border-radius:8px}
nav.main a:hover{background:var(--paper2)}

/* hero + tool */
.hero{color:var(--paper);padding:34px 0 42px;border-bottom:4px solid var(--brass);
  background:linear-gradient(168deg,#0F4A36 0%,#0B392B 46%,#072A1F 78%,#05211A 100%),
  radial-gradient(120% 90% at 88% -10%,rgba(223,175,87,.17),rgba(223,175,87,0) 55%),
  radial-gradient(90% 75% at -5% 112%,rgba(43,182,115,.15),rgba(43,182,115,0) 55%),
  repeating-linear-gradient(115deg,rgba(255,255,255,.016) 0 2px,rgba(255,255,255,0) 2px 16px)}
.hero h1{color:var(--paper);font-size:2.45rem;line-height:1.07;margin-bottom:.3em}
.hero h2,.hero h3{color:var(--paper)}
.hero p{color:var(--paper)}
.hero a{color:var(--paper)}
.hero .card{color:var(--ink)}
.hero .card h2,.hero .card h3{color:var(--pine)}
.hero .card p{color:var(--ink)}
.hero .card a{color:var(--pine)}
.hero .sub{font-size:1.08rem;line-height:1.55;max-width:36em}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--brass-soft);
  background:rgba(223,175,87,.10);border:1px solid rgba(223,175,87,.55);border-radius:999px;
  padding:6px 13px;font-weight:700;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;margin:0 0 14px}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--signal-hi);
  box-shadow:0 0 0 3px rgba(43,182,115,.25)}
form.tool{margin-top:18px;padding:18px;border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  border:1px solid rgba(250,248,242,.16);
  box-shadow:0 26px 50px -26px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06)}
form.tool label{display:block;color:var(--paper);font-weight:700;margin-bottom:8px}
.toolrow{display:flex;gap:10px;flex-wrap:wrap}
.toolrow input{flex:1 1 220px;font-size:1.15rem;padding:14px 14px;border-radius:12px;border:2px solid #FFFFFF;background:#FFFFFF;color:var(--ink);font-variant-numeric:tabular-nums;
  box-shadow:inset 0 2px 5px rgba(6,35,26,.10)}
.toolrow input::placeholder{color:var(--ink2)}
.btn{display:inline-block;background:linear-gradient(180deg,#0F4A36,#082E21);color:var(--paper);border:1px solid #06231A;
  font-weight:800;font-size:1.05rem;padding:13px 22px;border-radius:12px;cursor:pointer;text-decoration:none;text-align:center;
  box-shadow:0 10px 20px -10px rgba(6,35,26,.5),inset 0 1px 0 rgba(255,255,255,.10);
  transition:transform .12s ease,box-shadow .12s ease,background .12s ease}
.btn:hover{background:linear-gradient(180deg,#114F3A,#06231A);transform:translateY(-1px);
  box-shadow:0 14px 24px -10px rgba(6,35,26,.5),inset 0 1px 0 rgba(255,255,255,.10)}
.btn:active{transform:translateY(1px)}
.hero .btn{background:linear-gradient(180deg,var(--signal-hi),var(--signal-lo));color:#032117;border-color:#0E7A3E;
  box-shadow:0 14px 28px -10px rgba(31,168,92,.55),inset 0 1px 0 rgba(255,255,255,.35)}
.hero .btn:hover{background:linear-gradient(180deg,#33C17E,#128A4C);
  box-shadow:0 18px 32px -10px rgba(31,168,92,.6),inset 0 1px 0 rgba(255,255,255,.35)}
.btn.signal{background:linear-gradient(180deg,var(--signal-hi),var(--signal-lo));border-color:#0E7A3E;color:#032117;
  box-shadow:0 14px 28px -12px rgba(31,168,92,.55),inset 0 1px 0 rgba(255,255,255,.35)}
.toolhelp{color:var(--paper);font-size:.9rem;margin-top:10px}
/* checker.js scrolls #result into view after a lookup renders; the
   margin lands the card heading just under the top edge, not flush. */
#result{scroll-margin-top:20px}
.hero #result .small{color:var(--paper)}
.hero #result .card .small{color:var(--ink2)}
.hero #result .card .kitband .small{color:var(--paper)}
.hero .card .kitband h2,.hero .card .kitband h3{color:var(--paper)}
.hero .card .kitband p{color:var(--paper)}
.toolerr{background:linear-gradient(180deg,var(--red-hi),var(--red));color:var(--paper);border-radius:12px;padding:13px 15px;margin-top:14px;font-weight:600;
  box-shadow:0 12px 24px -12px rgba(158,43,33,.6)}
.picklist{margin-top:14px;display:grid;gap:10px}
.picklist button{text-align:left;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:13px 15px;font-size:1rem;cursor:pointer;box-shadow:var(--shadow-panel)}
.picklist button b{color:var(--pine)}

/* report card */
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px 22px;margin:26px 0;box-shadow:var(--shadow-card)}
#reportcard{border-top:4px solid var(--brass)}
.card h2{margin-top:0}
.verdict{border-radius:12px;padding:16px 18px;font-weight:800;font-size:1.18rem;letter-spacing:-.01em;margin:12px 0 6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.20),0 12px 22px -12px rgba(6,35,26,.5)}
.verdict.ok{background:linear-gradient(180deg,#0C7A3D,#064E24);color:var(--paper)}
.verdict.watch{background:linear-gradient(180deg,var(--amber-hi),var(--amber));color:var(--pine)}
.verdict.act{background:linear-gradient(180deg,var(--red-hi),var(--red));color:var(--paper)}
.scores{display:grid;gap:12px;margin:14px 0}
.score{border:1px solid var(--line2);border-radius:14px;padding:15px 16px;background:#F8F5EE;
  box-shadow:inset 0 1px 0 #FFFFFF}
.score .nm{font-weight:700;color:var(--pine)}
.score .big{font-size:2.2rem;font-weight:800;color:var(--pine);line-height:1.05;letter-spacing:-.02em;margin-top:4px}
.score .big small{font-size:.95rem;font-weight:600;color:var(--ink2)}
.track{height:10px;border-radius:99px;background:#E9E1CC;margin:11px 0 5px;position:relative;
  box-shadow:inset 0 1px 3px rgba(30,36,32,.22)}
.track span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--signal-hi),#128A4C);
  box-shadow:0 1px 5px rgba(18,138,76,.45)}
.track.watch span{background:linear-gradient(90deg,#F0B84F,#DE9426);box-shadow:0 1px 5px rgba(222,148,38,.45)}
.track.act span{background:linear-gradient(90deg,#D6534A,#B02E28);box-shadow:0 1px 5px rgba(176,46,40,.45)}
.track.est span{opacity:.55}
.track::after{content:"";position:absolute;left:65%;top:-3px;bottom:-3px;width:2px;border-radius:2px;background:#8A6214}
.statechip{display:inline-block;font-weight:800;font-size:.85rem;border-radius:999px;padding:4px 11px;margin-left:8px;vertical-align:middle;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);letter-spacing:.02em}
.statechip.ok{background:linear-gradient(180deg,#0E7A3E,#0B6E38);color:var(--paper)}
.statechip.watch{background:linear-gradient(180deg,var(--amber-hi),var(--amber));color:var(--pine)}
.statechip.act{background:linear-gradient(180deg,var(--red-hi),var(--red));color:var(--paper)}
.flags{display:grid;gap:12px;margin:14px 0}
.flag{border:1px solid var(--line2);border-left:5px solid var(--signal);background:#FBF9F3;border-radius:10px;padding:12px 15px;box-shadow:0 6px 14px -10px rgba(12,59,46,.25)}
.flag.watch{border-left-color:var(--amber)}
.flag.act{border-left-color:var(--red)}
.flag .tag{font-weight:800;color:var(--pine);font-size:.85rem;text-transform:uppercase;letter-spacing:.08em}
table.data{width:100%;border-collapse:collapse;margin:14px 0;font-size:.98rem}
table.data th,table.data td{text-align:left;padding:10px 10px;border-bottom:1px solid var(--line2);vertical-align:top}
table.data th{color:var(--brass-text);font-weight:800;font-size:.8rem;text-transform:uppercase;letter-spacing:.07em;border-bottom:2px solid #C9A44E}
table.data tr:hover td{background:#FBF9F3}
.stacktable td{display:block}
.fixes{display:grid;gap:12px}
.fix{border:1px solid var(--line2);border-radius:12px;padding:13px 15px;background:var(--card);box-shadow:var(--shadow-panel)}
.fix b{color:var(--pine)}
.honesty{border-top:1px dashed #D8D2C0;margin-top:18px;padding-top:12px;font-size:.88rem;color:var(--ink2)}

/* kit band */
.kitband{color:var(--paper);border-radius:18px;padding:26px 24px;margin:26px 0;
  background:linear-gradient(165deg,#0E4534,#072A1F);border:1px solid #06231A;border-top:3px solid var(--brass);
  box-shadow:0 24px 44px -22px rgba(6,35,26,.55)}
.kitband h1,.kitband h2,.kitband h3{color:var(--paper)}
.kitband p{color:var(--paper)}
.kitband .price{font-family:var(--font-d);font-size:2.05rem;font-weight:700;color:var(--brass-hi)}
.kitband ul{margin:.4em 0 .8em;padding-left:1.2em}
.kitband li{margin:.35em 0}
.kitband .btn,.checkerjump .btn{background:linear-gradient(180deg,#FFFFFF,#F0EBDD);color:var(--pine);border-color:#D8CFB4;
  box-shadow:0 12px 22px -10px rgba(0,0,0,.45),inset 0 1px 0 #FFFFFF}
.kitband .btn:hover,.checkerjump .btn:hover{background:linear-gradient(180deg,#FFFFFF,#E9E2CE)}
.kitband .small{color:var(--paper)}
.kitband a:not(.btn){color:var(--paper)}

/* kit-only done-for-you offer (kit page top only — never on public pages) */
.dfyoffer{color:var(--paper);border-radius:18px;padding:24px 22px;margin:24px 0;
  background:linear-gradient(155deg,#0E4534,#06231A),radial-gradient(80% 90% at 95% 0%,rgba(223,175,87,.14),rgba(223,175,87,0) 55%);
  border:1.5px solid var(--brass);box-shadow:0 24px 44px -22px rgba(6,35,26,.55)}
.dfyoffer h2{color:var(--paper);margin-top:0}
.dfyoffer p{color:var(--paper)}
.dfyoffer .offertag{display:inline-block;color:var(--brass-soft);border:1px solid rgba(223,175,87,.55);
  background:rgba(223,175,87,.10);border-radius:999px;padding:4px 11px;margin:0 0 10px;
  font-weight:700;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase}
.dfyoffer .btn{background:linear-gradient(180deg,#FFFFFF,#F0EBDD);color:var(--pine);border-color:#D8CFB4;
  box-shadow:0 12px 22px -10px rgba(0,0,0,.45),inset 0 1px 0 #FFFFFF}
.dfyoffer .btn:hover{background:linear-gradient(180deg,#FFFFFF,#E9E2CE)}
.dfyoffer .small{color:var(--paper)}
.dfyoffer a:not(.btn){color:var(--paper)}

/* content */
main{padding:14px 0 44px}
.cards3{display:grid;gap:14px;margin:16px 0}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:19px;box-shadow:var(--shadow-panel);
  transition:transform .12s ease,box-shadow .12s ease}
.panel:hover{transform:translateY(-2px);box-shadow:0 2px 3px rgba(30,36,32,.05),0 18px 30px -16px rgba(12,59,46,.25)}
.panel h3{margin-top:0}
.notice{background:#F3EFE3;border-left:5px solid var(--signal);border-radius:10px;padding:13px 15px;margin:16px 0}
.notice.warn{border-left-color:var(--amber)}
.lock{background:#F6F2E8;border:1.5px dashed #A07E2C;border-radius:12px;padding:15px 17px;margin:16px 0}
.lock .lt{font-weight:800;color:var(--pine)}
details.faq{border-bottom:1px solid var(--line);padding:11px 0}
details.faq summary{font-weight:700;color:var(--pine);cursor:pointer;padding:6px 0}
ul.tight li{margin:.35em 0}
.checkerjump{color:var(--paper);border-radius:var(--radius);padding:20px;margin:20px 0;
  background:linear-gradient(165deg,#0E4534,#072A1F);border:1px solid #06231A;border-top:3px solid var(--brass);
  box-shadow:0 24px 44px -22px rgba(6,35,26,.55)}
.checkerjump h1,.checkerjump h2,.checkerjump h3{color:var(--paper)}
.checkerjump p,.checkerjump li,.checkerjump legend{color:var(--paper)}
.checkerjump a{color:var(--paper)}
.checkerjump .small{color:var(--paper)}
.checkerjump label{color:var(--paper);font-weight:700;display:block;margin-bottom:8px}
.checkerjump .toolrow input{border-color:#FFFFFF}

/* footer */
footer.site{color:var(--paper);margin-top:36px;padding:28px 0 34px;border-top:3px solid var(--brass);
  background:linear-gradient(180deg,#0B3A2B,#051F17),
  radial-gradient(90% 90% at 90% 0%,rgba(223,175,87,.10),rgba(223,175,87,0) 55%)}
footer.site h1,footer.site h2,footer.site h3{color:var(--paper)}
footer.site a{color:var(--paper)}
footer.site .lockup .a{color:var(--paper)}
footer.site p{color:var(--paper)}
.footplate{display:inline-block;background:linear-gradient(180deg,#FFFFFF,#F3EFE3);border-radius:12px;padding:10px 14px;margin-bottom:12px;
  box-shadow:0 10px 22px -12px rgba(0,0,0,.5)}
footer.site .footplate .lockup .a{color:var(--pine)}
footer.site nav{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
footer.site nav a{text-decoration:none;font-weight:600;padding:6px 8px;border-radius:8px}
footer.site nav a:hover{background:rgba(255,255,255,.08)}

@media (min-width:720px){
  h1{font-size:2.6rem}
  .hero h1{font-size:3.05rem}
  .scores{grid-template-columns:1fr 1fr}
  .cards3{grid-template-columns:1fr 1fr 1fr}
  .stacktable td{display:table-cell}
  .stacktable tr{display:table-row}
}
@media (max-width:719px){
  table.stacktable, table.stacktable tbody, table.stacktable tr{display:block;width:100%}
  table.stacktable th{display:none}
  table.stacktable td{display:block;border-bottom:none;padding:6px 10px}
  table.stacktable tr{border-bottom:1px solid var(--line);padding:6px 0}
  .hd{flex-direction:column;align-items:flex-start;gap:4px}
  nav.main a{padding:7px 8px;font-size:.92rem}
  form.tool{padding:14px}
  .toolrow{flex-direction:column}
  .toolrow .btn{flex:0 0 auto;width:100%}
  .toolrow input{flex:0 0 auto;width:100%}
  .card{padding:20px 16px}
  .kitband,.checkerjump{padding:22px 18px}
}

@media print{
  header.site,footer.site{display:none}
  .btn{display:none}
  body{background:#FFFFFF}
  .card,.kitband,.checkerjump,.panel,.fix{box-shadow:none}
  .hero{background:#FFFFFF;color:var(--ink);border-bottom:2px solid var(--pine)}
  .hero h1,.hero h2,.hero h3,.hero p,.hero a{color:var(--pine)}
}