:root { color-scheme: light; --ink:#17212b; --muted:#5c6873; --line:#d8dee3; --paper:#ffffff; --ground:#f3f5f6; --accent:#135f85; --warn:#8a5418; }
* { box-sizing: border-box; }
body { margin:0; background:var(--ground); color:var(--ink); font-family:Arial,sans-serif; font-size:14px; }
a { color:var(--accent); }
code { font-family:Consolas,monospace; font-size:.9em; overflow-wrap:anywhere; }
.app-header { position:sticky; top:0; z-index:20; min-height:58px; padding:10px 24px; background:#14232d; color:white; display:flex; align-items:center; justify-content:space-between; box-shadow:0 1px 4px #0004; }
.brand { color:white; text-decoration:none; font-size:20px; font-weight:700; letter-spacing:.02em; }
.subtitle { color:#b9c7d0; margin-left:12px; }
.authority { color:#c9d7df; font-family:Consolas,monospace; font-size:12px; text-align:right; }
main { width:min(1800px,calc(100% - 32px)); margin:0 auto 48px; }
.page-heading { padding:26px 4px 14px; }
.page-heading h1 { font-size:30px; margin:2px 0 7px; }
.page-heading p { color:var(--muted); margin:3px 0; }
.eyebrow { color:var(--accent)!important; font-size:12px; text-transform:uppercase; letter-spacing:.11em; font-weight:700; }
.roast-heading { display:flex; justify-content:space-between; align-items:flex-end; }
.heading-status { display:flex; gap:8px; padding-bottom:8px; }
.back { margin-top:18px; }
.status,.quality { display:inline-block; padding:3px 7px; border:1px solid #b8c4ca; border-radius:3px; background:#f7f9fa; font-size:11px; font-weight:700; white-space:nowrap; }
.quality-not_recorded,.quality-derived_unavailable,.quality-source_sentinel { background:#fff3df; border-color:#d9b26d; color:#70410e; }
.table-panel,.chart-panel,.provenance,.compatibility-error { background:var(--paper); border:1px solid var(--line); box-shadow:0 1px 2px #0000000c; margin:12px 0; padding:16px; overflow:auto; }
.wide-table { padding:0; }
.wide-table h2 { padding:0 16px; }
table { width:100%; border-collapse:collapse; }
th { position:sticky; top:0; background:#edf1f3; color:#364550; font-size:11px; text-align:left; text-transform:uppercase; letter-spacing:.045em; }
th,td { padding:9px 10px; border-bottom:1px solid #e1e6e9; vertical-align:top; }
tbody tr:hover { background:#f7fafb; }
.roast-link { font-size:16px; font-weight:700; }
.metadata-grid { display:grid; grid-template-columns:repeat(4,minmax(220px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.metadata-grid>div { min-height:93px; background:white; padding:13px; display:flex; flex-direction:column; gap:7px; }
.metadata-grid span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.metadata-grid small { color:var(--muted); }
.master-clock-summary { margin:12px 0; padding:13px 16px; display:flex; align-items:center; gap:28px; flex-wrap:wrap; color:#dce9ef; background:#24404f; border:1px solid #17303d; }
.master-clock-summary div { display:flex; flex-direction:column; gap:4px; }
.master-clock-summary span { color:#a9c1cd; font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.master-clock-summary p { margin:0 0 0 auto; color:#c4d5dd; }
.chart-panel { padding:8px 12px 13px; }
.chart-note { margin:0 18px 8px; color:var(--muted); }
.split-grid { display:grid; grid-template-columns:3fr 1fr; gap:12px; }
.table-panel h2 { margin-top:0; }
.provenance summary { cursor:pointer; font-size:18px; font-weight:700; }
.provenance-body { padding-top:14px; }
.compatibility-error { max-width:760px; margin:80px auto; padding:30px; border-left:5px solid #a34a3a; }
.compatibility-error h1 { margin-top:4px; }
@media (max-width:1050px) { .metadata-grid { grid-template-columns:repeat(2,minmax(220px,1fr)); } .split-grid { grid-template-columns:1fr; } .authority { display:none; } }
@media (max-width:620px) { main { width:calc(100% - 16px); } .metadata-grid { grid-template-columns:1fr; } .subtitle { display:none; } }

.app-header .drinking-nav{color:#deebe4;margin-inline-start:15px;text-decoration:none}
