/* Site-specific presentation; shared generator styles remain unchanged. */
:root { color-scheme: light; --bg:#f5f4ef; --surface:#fffefa; --text:#203329; --muted:#59675c; --accent:#2e6247; --accent-soft:#e7ece3; --line:#d6dccf; --radius:6px; --wrap:1080px; }
@media (prefers-color-scheme:dark) { :root { color-scheme:dark; --bg:#141d19; --surface:#1c2922; --text:#ecede4; --muted:#b1bdb1; --accent:#add1a2; --accent-soft:#273a2c; --line:#3c4d3e; } }
html { scroll-padding-top:120px; }
[hidden] { display:none !important; }
body { line-height:1.65; }
a, button, input, select { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
button, .button { font:inherit; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); color:var(--text); padding:9px 14px; cursor:pointer; min-height:44px; }
button:hover, .button:hover { border-color:var(--accent); }
button:disabled { cursor:wait; opacity:.6; }
.skip-link { position:fixed; left:16px; top:8px; z-index:20; transform:translateY(-150%); background:var(--surface); padding:10px; }
.skip-link:focus { transform:none; }
.head-row { min-height:76px; justify-content:space-between; gap:12px 28px; }
.brand { display:flex; gap:10px; align-items:center; line-height:1.2; font-family:Georgia,serif; font-size:1.25rem; }
.brand-mark { color:var(--accent); }
.brand-sub { display:block; font:500 .59rem/1.6 system-ui,sans-serif; letter-spacing:.18em; margin-top:4px; color:var(--muted); }
.nav { gap:8px 22px; font-size:.9rem; }
.nav a { padding:5px 0; }
.nav a[aria-current] { box-shadow:0 2px var(--accent); }
h1,h2 { letter-spacing:-.025em; }
h1 { font-family:Georgia,serif; font-size:2.35rem; font-weight:normal; margin:28px 0 18px; }
.hero { padding:52px 0 40px; border-bottom:1px solid var(--line); }
.eyebrow { font-size:.7rem; font-weight:650; letter-spacing:.17em; color:var(--muted); }
.hero h1 { font-size:clamp(2.65rem,5.4vw,4.8rem); line-height:1.07; margin:22px 0; }
.hero h1 em { color:var(--accent); }
.hero-intro { font-size:1.15rem; color:var(--muted); }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin:26px 0 20px; }
.button { display:inline-flex; align-items:center; gap:28px; text-decoration:none; font-size:.92rem; }
.button.primary { color:var(--bg); background:var(--text); border-color:var(--text); }
.hero-note { color:var(--muted); font-size:.8rem; }
.section-heading { margin-top:32px; }
.section-heading h2 { margin-bottom:2px; font-size:1.45rem; }
.section-heading p { color:var(--muted); margin-top:2px; }
.guide-search { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin:18px 0; }
.guide-search label { font-size:.85rem; font-weight:600; }
.guide-search input { flex:1 1 260px; font:inherit; color:var(--text); background:var(--surface); padding:10px 14px; border:1px solid var(--line); border-radius:var(--radius); min-width:0; }
.guide-search-count { color:var(--muted); font-size:.8rem; }
.cards { grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.card { padding:20px; gap:10px; transition:border-color .15s; }
.card-number { font:500 .7rem ui-monospace,monospace !important; color:var(--muted); letter-spacing:.1em; }
.card strong { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.card strong span { color:var(--accent); }
.card>span:last-child { font-size:.88rem; line-height:1.6; }
.answer { border-left:3px solid var(--accent); padding:16px 18px; }
.updated { margin-bottom:22px; }
.crumbs { padding-top:8px; }
.page-contents { border-block:1px solid var(--line); padding:12px 0; display:flex; flex-wrap:wrap; gap:6px 18px; font-size:.85rem; margin:16px 0 24px; }
.page-contents span { color:var(--muted); }
.finder { gap:10px; margin-top:20px; }
.finder input, .finder select { min-height:44px; }
.finder input { flex:2 1 240px; }
.finder select { flex:1 1 220px; }
.finder-count { font-variant-numeric:tabular-nums; min-width:105px; }
.finder-actions { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.finder-actions button { font-size:.8rem; padding:7px 12px; }
.empty-state { border:1px dashed var(--line); padding:20px; border-radius:var(--radius); }
.tracker { display:grid; grid-template-columns:1fr auto; align-items:center; gap:12px; border:1px solid var(--line); background:var(--surface); padding:16px; border-radius:var(--radius); margin:20px 0; }
.tracker-note { margin:2px 0 0; color:var(--muted); font-size:.78rem; }
.tracker-actions { display:flex; gap:6px; flex-wrap:wrap; }
.tracker-actions button { font-size:.8rem; }
.tracker progress { grid-column:1/-1; width:100%; height:8px; accent-color:var(--accent); }
.check-cell { width:52px; text-align:center !important; }
.check-cell label { min-width:38px; min-height:38px; display:inline-flex; justify-content:center; align-items:center; cursor:pointer; }
.check-cell input { width:19px; height:19px; margin:0; accent-color:var(--accent); }
tr.is-done { background:var(--accent-soft); }
tr.is-done td:not(.check-cell) { color:var(--muted); }
.copy-code { display:block; margin-top:8px; font-size:.72rem; min-height:34px; padding:3px 10px; }
table.data { font-size:.87rem; }
table.data th,table.data td { padding:12px; }
.code-solution { white-space:normal; min-width:150px; max-width:280px; }
.code-solution strong { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.93em; overflow-wrap:anywhere; }
.table-wrap:focus-visible { outline-offset:2px; }
.tag { font-size:.65rem; padding:1px 5px; border:1px solid var(--line); }
.related { padding-top:8px; margin-top:28px; border-top:1px solid var(--line); }
.related-links { display:flex; gap:10px; flex-wrap:wrap; }
.related-links a { border:1px solid var(--line); border-radius:var(--radius); padding:9px 13px; font-size:.88rem; text-decoration:none; }
.related-links span { margin-left:14px; }
.home-about { border-top:1px solid var(--line); margin-top:34px; }
.toast { position:fixed; bottom:22px; left:50%; transform:translateX(-50%); z-index:30; margin:0; border:1px solid var(--line); padding:10px 20px; background:var(--text); color:var(--bg); border-radius:var(--radius); box-shadow:0 3px 20px #0002; max-width:calc(100vw - 32px); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.mobile-table-hint { display:none; color:var(--muted); font-size:.8rem; }
@media (max-width:760px) { .cards { grid-template-columns:repeat(2,minmax(0,1fr)); } .head-row { gap:14px; } .nav { width:100%; justify-content:space-between; gap:6px; font-size:.8rem; } .site-head { position:static; } h1 { font-size:1.9rem; } .hero { padding-top:26px; } html { scroll-padding-top:20px; } .tracker { grid-template-columns:1fr; } }
@media (max-width:500px) { .cards { grid-template-columns:1fr; } .card { padding:18px; } .hero-intro { font-size:1rem; } .hero h1 { font-size:2.65rem; } .wrap { padding-inline:16px; } .finder-count { width:100%; } .table-wrap table { min-width:650px; } .table-wrap th { white-space:normal !important; } .table-wrap:has(table thead tr th:nth-child(5)) table { min-width:760px; } .finder select { width:100%; flex-basis:100%; } .nav { flex-wrap:wrap; gap:4px 16px; justify-content:flex-start; } .nav a { min-height:36px; display:flex; align-items:center; } }
@media (max-width:500px) { .mobile-table-hint { display:block; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto !important; transition:none !important; } }