/* Small desk tools: shared frame. Load after each page's /style.css. HTML + CSS only. */
:root{
  color-scheme:light dark;
  --bg:#faf7f0;--fg:#22201c;--muted:#5e584e;--accent:#1f5d4b;--accent-fg:#ffffff;--border:#ddd6c8;--card:#ffffff;
  --sdt-bar-bg:#22201c;--sdt-bar-fg:#faf7f0;--sdt-bar-muted:#cfc8ba;--sdt-bar-rule:#22201c;
  --sdt-mark-card:#faf7f0;--sdt-mark-line:#1f5d4b;
  --sdt-tint:#f2ede2;--sdt-field:#8a8378;--sdt-focus:#1f5d4b;
  --sdt-sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans",Arial,sans-serif;
  --sdt-serif:ui-serif,Charter,"Bitstream Charter","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sdt-width:44rem;--sdt-gutter:clamp(1rem,4vw,1.5rem);--sdt-radius:4px;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#1a1815;--fg:#ece7dc;--muted:#b3ac9f;--accent:#8fcdb6;--accent-fg:#10241d;--border:#3a352e;--card:#24211d;
  --sdt-bar-bg:#0e0d0b;--sdt-bar-fg:#ece7dc;--sdt-bar-muted:#b3ac9f;--sdt-bar-rule:#3a352e;
  --sdt-mark-card:#ece7dc;--sdt-mark-line:#1f5d4b;
  --sdt-tint:#211e1a;--sdt-field:#8a8378;--sdt-focus:#8fcdb6;
}}

/* Base */
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{margin:0;padding:0;max-width:none;background:var(--bg);color:var(--fg);font-family:var(--sdt-sans);font-size:1.0625rem;line-height:1.55}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--sdt-focus);outline-offset:2px}
body>header,body>main,body>footer{max-width:var(--sdt-width);margin-inline:auto;padding-inline:var(--sdt-gutter);box-sizing:content-box}

/* Skip link (stays first in the page) */
body>a:first-child{position:absolute;left:var(--sdt-gutter);top:.5rem;z-index:10;padding:.6rem 1rem;background:var(--card);color:var(--fg);border:2px solid var(--fg);border-radius:var(--sdt-radius);font-weight:600;transform:translateY(-250%)}
body>a:first-child:focus{transform:none}

/* Header bar */
.sdt-bar{background:var(--sdt-bar-bg);color:var(--sdt-bar-fg);border-bottom:1px solid var(--sdt-bar-rule)}
.sdt-bar__in{max-width:var(--sdt-width);margin:0 auto;padding:.25rem var(--sdt-gutter);display:flex;align-items:center;flex-wrap:wrap;gap:0 1rem}
.sdt-home{display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;color:inherit;text-decoration:none}
.sdt-home:hover .sdt-name{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}
.sdt-mark{width:1.75rem;height:1.75rem;flex:none}
.sdt-mark-card{fill:var(--sdt-mark-card)}
.sdt-mark-line{stroke:var(--sdt-mark-line)}
.sdt-name{font-family:var(--sdt-serif);font-size:1.1875rem;font-weight:600;letter-spacing:.005em;line-height:1}
.sdt-tagline{font-size:.875rem;color:var(--sdt-bar-muted)}
.sdt-all{margin-left:auto;display:inline-flex;align-items:center;min-height:2.75rem;padding-inline:.25rem;color:inherit;font-size:.9375rem;font-weight:600;text-decoration:underline;text-underline-offset:.22em}
.sdt-bar :focus-visible,.sdt-strip :focus-visible{outline-color:var(--sdt-bar-fg)}
@media (max-width:40rem){.sdt-tagline{display:none}}

/* Page header */
body>header{padding-block:2.5rem 1.25rem}
body>header h1{margin:0 0 .75rem;font-size:clamp(1.75rem,1.35rem + 1.8vw,2.375rem);line-height:1.15;font-weight:700;letter-spacing:-.01em;text-wrap:balance}
.lede{margin:0;max-width:38rem;font-size:1.1875rem;line-height:1.5;color:var(--muted);text-wrap:pretty}

/* Main and sections */
main{padding-bottom:1rem}
main h2{margin:0 0 .75rem;font-size:1.375rem;line-height:1.25;font-weight:700}
main h3{margin:1.5rem 0 .5rem;font-size:1.125rem;line-height:1.3}
main p,main li{text-wrap:pretty}
main>section{margin-top:2rem;padding-top:1.75rem;border-top:1px solid var(--border)}
main>section:first-child{margin-top:0;padding-top:.5rem;border-top:0}

/* Fields */
.field{display:flex;flex-direction:column;gap:.35rem;margin:0 0 1.25rem}
.field label,.field legend{font-weight:600}
.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea{box-sizing:border-box;width:100%;max-width:22rem;min-height:2.75rem;padding:.6rem .75rem;font:inherit;color:var(--fg);background:var(--card);border:1.5px solid var(--sdt-field);border-radius:var(--sdt-radius)}
.field textarea{max-width:none;min-height:6rem}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:3px solid var(--sdt-focus);outline-offset:1px;border-color:var(--fg)}
input[type=checkbox],input[type=radio]{width:1.25rem;height:1.25rem;accent-color:var(--accent)}
.hint{margin:0;font-size:.9375rem;color:var(--muted)}
main button:not(.price),main input[type=submit]{min-height:2.75rem;padding:.6rem 1.25rem;font:inherit;font-weight:600;color:var(--accent-fg);background:var(--accent);border:0;border-radius:var(--sdt-radius);cursor:pointer}

/* Result and answer panels: the index-card top rule */
.result,.answer{margin:1.25rem 0;padding:1rem 1.25rem;background:var(--card);border:1px solid var(--border);border-top:3px solid var(--accent);border-radius:var(--sdt-radius)}
.answer{font-size:1.25rem;font-weight:700;line-height:1.35}
.result .answer{margin:.25rem 0;padding:0;background:none;border:0}
.result>:first-child,.answer>:first-child,.sample>:first-child,.offer>:first-child{margin-top:0}
.result>:last-child,.answer>:last-child,.sample>:last-child,.offer>:last-child{margin-bottom:0}

/* Checklists: ruled lines with empty boxes */
.checklist{margin:1rem 0;padding:0;list-style:none}
.checklist li{position:relative;padding:.6rem 0 .6rem 2rem;border-bottom:1px solid var(--border)}
.checklist li:last-child{border-bottom:0}
.checklist li::before{content:"";position:absolute;left:0;top:calc(.6rem + .3em);width:1rem;height:1rem;box-sizing:border-box;background:var(--card);border:1.5px solid var(--sdt-field);border-radius:2px}
.checklist li:has(input){padding-left:0}
.checklist li:has(input)::before{content:none}
.checklist label{display:flex;gap:.75rem;align-items:flex-start}

/* Tables */
main table{width:100%;border-collapse:collapse;font-size:.9375rem;font-variant-numeric:tabular-nums}
main caption{padding-bottom:.5rem;text-align:left;font-weight:600}
main th,main td{padding:.55rem .75rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--border)}
main th{font-size:.8125rem;font-weight:600;color:var(--muted);border-bottom:1.5px solid var(--fg)}
main th:first-child,main td:first-child{padding-left:0}
@media (max-width:40rem){main table{display:block;overflow-x:auto;white-space:nowrap}}

/* Worked sample */
.sample{margin:1.25rem 0;padding:1.25rem;background:var(--card);border:1px solid var(--border);border-radius:var(--sdt-radius)}

/* Offer: a plain choice, not a checkout */
main>.offer,.offer{margin-top:2.5rem;padding:1.25rem;background:var(--sdt-tint);border:1px solid var(--border);border-radius:var(--sdt-radius)}
.prices{display:flex;flex-wrap:wrap;gap:.625rem;margin:1rem 0}
main button.price{min-height:2.75rem;padding:.6rem 1.1rem;font:inherit;font-weight:600;color:var(--fg);background:var(--card);border:1.5px solid var(--fg);border-radius:var(--sdt-radius);box-shadow:none;cursor:pointer}
main button.price:hover{border-color:var(--accent);color:var(--accent)}
main button.price[aria-pressed=true]{color:var(--bg);background:var(--fg);border-color:var(--fg)}
.status{margin:.5rem 0 0;font-size:.9375rem}
.status:empty{display:none}

/* Tools list (home) */
.tools{margin:.5rem 0 0;padding:0;list-style:none}
.tools li{padding:.85rem 0;border-bottom:1px solid var(--border)}
.tools a{font-weight:600}
.tools li>:not(a){display:block;font-size:.9375rem;color:var(--muted)}

/* Page footer (own words, untouched) */
body>footer{margin-top:3rem;padding-block:1.25rem 1.5rem;font-size:.875rem;color:var(--muted);border-top:1px solid var(--border)}
body>footer p{margin:.25rem 0}

/* Footer strip */
.sdt-strip{background:var(--sdt-bar-bg);color:var(--sdt-bar-fg);font-size:.875rem}
.sdt-strip__in{max-width:var(--sdt-width);margin:0 auto;padding:.5rem var(--sdt-gutter) .75rem;display:flex;flex-wrap:wrap;align-items:center;gap:0 1.25rem}
.sdt-strip a{display:inline-flex;align-items:center;min-height:2.25rem;color:inherit;text-underline-offset:.22em}
.sdt-strip a:first-child{font-family:var(--sdt-serif);font-weight:600;text-decoration:none}
.sdt-strip a:first-child:hover{text-decoration:underline}

/* Print: A4, header becomes a plain name line, strip hidden */
@page{size:A4;margin:16mm 15mm}
@media print{
  :root{--bg:#fff;--fg:#000;--muted:#333;--accent:#000;--border:#999;--card:#fff;--sdt-tint:#fff}
  html,body{background:#fff;color:#000;font-size:10.5pt}
  body>a:first-child,.sdt-strip,.sdt-mark,.sdt-tagline,.sdt-all{display:none!important}
  .sdt-bar{background:none;color:#000;border-bottom:.75pt solid #000}
  .sdt-bar__in,body>header,body>main,body>footer{max-width:none;padding-inline:0}
  .sdt-bar__in{padding-block:0 3pt}
  .sdt-home{min-height:0}
  .sdt-name{font-size:10pt}
  body>header{padding-top:10pt}
  main table{display:table;white-space:normal}
  .result,.answer,.sample,.offer,tr{break-inside:avoid}
  a{color:#000}
}
