/* ShelfSorted — site styles. Tokens from PHASE-4 brand-identity.css (Phase 4), consumed unchanged. */
@font-face{font-family:"Fraunces";src:url("/assets/fonts/Fraunces-var.woff2") format("woff2");font-weight:600 700;font-display:swap}
@font-face{font-family:"Public Sans";src:url("/assets/fonts/PublicSans-var.woff2") format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/assets/fonts/IBMPlexMono-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("/assets/fonts/IBMPlexMono-600.woff2") format("woff2");font-weight:600;font-display:swap}
:root{
--color-pine:#1e4d3b;--color-pine-deep:#143527;--color-clay:#c05b2e;--color-clay-deep:#9a441f;
--color-cream:#faf6ef;--color-paper:#ffffff;--color-sand:#ead9c2;--color-sage:#8fae94;
--color-ink:#26312b;--color-ink-soft:#4a5a50;--color-error:#a4261f;
--font-display:"Fraunces",Georgia,serif;--font-body:"Public Sans",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--font-mono:"IBM Plex Mono",Consolas,monospace;
--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--shadow-card:0 1px 2px rgba(38,49,43,.07),0 4px 14px rgba(38,49,43,.06);--container:72rem}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--color-cream);color:var(--color-ink);font-family:var(--font-body);font-size:1rem;line-height:1.6}
h1,h2,h3{font-family:var(--font-display);color:var(--color-pine);line-height:1.12;margin:.2em 0 .5em}
h1{font-size:2.4rem}h2{font-size:1.7rem}h3{font-size:1.25rem}
a{color:var(--color-pine);text-underline-offset:3px}
a:hover{color:var(--color-clay-deep)}
:focus-visible{outline:3px solid var(--color-clay);outline-offset:2px;border-radius:4px}
.wrap{max-width:var(--container);margin:0 auto;padding:0 1rem}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:var(--color-paper);padding:.5rem 1rem;z-index:50}
header.site{background:var(--color-cream);border-bottom:1px solid var(--color-sand);position:sticky;top:0;z-index:20}
.header-in{display:flex;align-items:center;gap:1rem;padding:.6rem 0;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--font-display);font-size:1.45rem;font-weight:700}
.logo .w1{color:var(--color-pine)}.logo .w2{color:var(--color-clay-deep)}
nav.main{margin-left:auto}nav.main ul{display:flex;gap:.25rem;list-style:none;margin:0;padding:0;flex-wrap:wrap}
nav.main a{display:block;padding:.55rem .8rem;min-height:44px;text-decoration:none;font-weight:600;border-radius:var(--radius-sm)}
nav.main a:hover{background:#fff}
.hero{padding:3rem 0 2rem}
.hero .kicker,.kicker{text-transform:uppercase;letter-spacing:.08em;font-size:.78rem;font-weight:700;color:var(--color-clay-deep)}
.hero h1{font-size:2.9rem;max-width:16ch}
.hero p.lede{font-size:1.2rem;max-width:62ch;color:var(--color-ink-soft)}
.btn{display:inline-flex;align-items:center;min-height:48px;padding:.7rem 1.3rem;border-radius:var(--radius-md);background:var(--color-pine);color:#fff;font-weight:700;text-decoration:none;border:2px solid var(--color-pine);cursor:pointer;font-size:1rem;font-family:var(--font-body)}
.btn:hover{background:var(--color-pine-deep);color:#fff}
.btn.secondary{background:transparent;color:var(--color-pine)}
.btn.secondary:hover{background:#fff;color:var(--color-pine)}
.btn.clay{background:var(--color-clay-deep);border-color:var(--color-clay-deep)}
.grid{display:grid;gap:1rem}
.grid.c2{grid-template-columns:repeat(2,1fr)}.grid.c3{grid-template-columns:repeat(3,1fr)}.grid.c4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid.c3,.grid.c4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid.c2,.grid.c3,.grid.c4{grid-template-columns:1fr}.hero h1{font-size:2.2rem}h1{font-size:1.9rem}}
.card{background:var(--color-paper);border:1px solid var(--color-sand);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:1.1rem}
.card h3{margin-top:0}.card h2{font-size:1.25rem;margin-top:0}.card p{color:var(--color-ink-soft)}
.card a.more{font-weight:700}
.tag{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--color-clay-deep);background:#f7ead9;border-radius:999px;padding:.15rem .6rem;margin-bottom:.5rem}
section{padding:1.6rem 0}
.band{background:var(--color-pine);color:#f3efe6;border-radius:var(--radius-lg);padding:2rem}
.band h2,.band h3{color:#fff}.band a{color:#ffd9a8}
.diagram{background:#fff;border:1px solid var(--color-sand);border-radius:var(--radius-md);padding:1rem}
.crumbs{font-size:.9rem;color:var(--color-ink-soft);padding-top:1rem}
.crumbs a{color:var(--color-ink-soft)}
/* tool panel */
.tool-panel{background:var(--color-paper);border:2px solid var(--color-pine);border-radius:var(--radius-lg);padding:1.4rem;box-shadow:var(--shadow-card)}
.tool-panel h2{margin-top:0}
form.tool{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
@media(max-width:640px){form.tool{grid-template-columns:1fr}}
.field label{display:block;font-weight:600;margin-bottom:.3rem}
.field input,.field select,.field textarea{width:100%;min-height:48px;padding:.6rem .7rem;border:1.5px solid #b9c4bb;border-radius:var(--radius-sm);font:inherit;background:#fff;color:var(--color-ink)}
.field .help{font-size:.85rem;color:var(--color-ink-soft)}
.field.check{display:flex;align-items:center;gap:.6rem}.field.check input{width:26px;height:26px;min-height:26px}
.actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.1rem}
.result{margin-top:1.3rem;border-top:2px dashed var(--color-sand);padding-top:1.1rem}
.result .headline{font-family:var(--font-mono);font-size:2rem;font-weight:600;color:var(--color-pine)}
.result table{border-collapse:collapse;width:100%;margin:.8rem 0}
.result th,.result td{border:1px solid var(--color-sand);padding:.45rem .6rem;text-align:left}
.result th{background:var(--color-cream);font-family:var(--font-mono);font-weight:600}
.bar{margin:.5rem 0}.bar .bar-track{background:#eee2cd;border-radius:999px;height:16px;overflow:hidden}
.bar .bar-fill{background:var(--color-clay);height:100%}
.bar .bar-label{font-size:.85rem;font-family:var(--font-mono)}
.error-box{display:none;background:#fbeae8;border:1.5px solid var(--color-error);color:var(--color-error);border-radius:var(--radius-md);padding:.8rem 1rem;margin-top:1rem;font-weight:600}
details.faq{background:#fff;border:1px solid var(--color-sand);border-radius:var(--radius-md);padding:.8rem 1rem;margin:.5rem 0}
details.faq summary{font-weight:700;cursor:pointer;min-height:44px;display:flex;align-items:center}
footer.site{background:var(--color-pine-deep);color:#e8e2d2;margin-top:3rem;padding:2.2rem 0}
footer.site a{color:#ffd9a8}footer.site h3{color:#fff}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:1.5rem}
@media(max-width:800px){.foot-grid{grid-template-columns:1fr 1fr}}
.small{font-size:.88rem;color:var(--color-ink-soft)}footer .small{color:#c9c2ae}
.chiprow{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0}
.chip{border:1.5px solid var(--color-pine);background:#fff;color:var(--color-pine);border-radius:999px;min-height:44px;padding:.5rem 1rem;font-weight:600;cursor:pointer;font:inherit}
.chip[aria-pressed="true"]{background:var(--color-pine);color:#fff}
.searchrow input{width:100%;min-height:52px;padding:.7rem 1rem;border:1.5px solid #b9c4bb;border-radius:var(--radius-md);font:inherit}
.status-chip{font-family:var(--font-mono);font-size:.8rem;font-weight:600;border-radius:var(--radius-sm);padding:.1rem .5rem;background:#eee2cd}
.status-chip.expired,.status-chip.use-first{background:#f6d3c8;color:#7c2317}
.status-chip.soon{background:#f7ead9;color:var(--color-clay-deep)}
.status-chip.ok{background:#dcead9;color:var(--color-pine)}
/* label sheet */
.checklist{list-style:none;padding:0;margin:1rem 0}
.checklist li{padding:.55rem .8rem;border:1px solid var(--color-sand);border-radius:var(--radius-sm);margin:.4rem 0;background:#fff}
.checklist li::before{content:"☐  ";color:var(--color-clay-deep);font-weight:700}
.bar .bar-label{display:block;margin-bottom:.25rem}
.label-sheet{background:#fff;border:1px solid #999;margin:1rem auto;padding:0;overflow:hidden}
.label-cell{border:1px dashed #b9a888;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--font-display);color:var(--color-ink);padding:2mm;overflow:hidden;word-break:break-word}
.label-scroll{overflow:auto;background:#e9e2d2;padding:1rem;border-radius:var(--radius-md)}
@media print{
 header.site,footer.site,.no-print,.actions,form.tool,.crumbs{display:none!important}
 .tool-panel{border:none;box-shadow:none}
 body{background:#fff}
}
