*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#F9F5F0;color:#1A1A1A;font-family:Inter,sans-serif;font-size:15px}
a{color:inherit;text-decoration:none}
.stripe{height:5px;background:linear-gradient(to right,
#1A1A1A 0% 14.3%,#777777 14.3% 28.6%,#5C4033 28.6% 42.9%,
#D2691E 42.9% 57.1%,#D4A017 57.1% 71.4%,#C8B89A 71.4% 85.7%,
#fff 85.7% 100%)}
.card{background:#fff;border-radius:16px;border:1px solid #C8B89A;
padding:14px 16px;margin-bottom:10px;
box-shadow:0 1px 4px rgba(0,0,0,.06)}
.badge{display:inline-block;font-size:.63rem;font-weight:600;
padding:2px 7px;border-radius:999px;margin-left:3px}
.btn-o{background:#D2691E;color:#fff;border-radius:999px;
padding:7px 16px;font-size:12px;font-weight:600;
text-decoration:none;white-space:nowrap;display:inline-block}
.btn-g{background:#D4A017;color:#1A1A1A;border-radius:999px;
padding:7px 16px;font-size:12px;font-weight:600;
text-decoration:none;white-space:nowrap;display:inline-block}
.btn-t{background:#C8B89A;color:#5C4033;border-radius:999px;
padding:7px 12px;font-size:12px;font-weight:600;
text-decoration:none;white-space:nowrap;display:inline-block}
.sh{font-size:11px;font-weight:700;letter-spacing:.1em;
text-transform:uppercase;color:#777777;
margin:22px 0 10px;display:flex;align-items:center;gap:8px}
.cp{font-size:10px;background:#C8B89A;color:#5C4033;
border-radius:999px;padding:1px 8px}
.htmx-indicator{opacity:0;transition:opacity .2s;font-size:12px;
color:#D4A017;text-align:center;padding:6px 0}
/* Admin dashboard (desktop-first; served via shell_wide). Mobile-safe: the
grid and stat strip collapse to a single column below 1100px. */
.adm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
gap:10px;margin:12px 0 6px}
.adm-stat{background:#fff;border:1px solid #C8B89A;border-radius:12px;
padding:10px 12px;text-align:center;display:block}
.adm-stat b{display:block;font-size:24px;line-height:1.2;color:#5C4033}
.adm-stat.hot b{color:#D2691E}
.adm-stat span{font-size:9.5px;font-weight:700;letter-spacing:.08em;
text-transform:uppercase;color:#777777}
/* ── Tabs ────────────────────────────────────────────────────────────
       The admin is one very long page and every section already had an anchor,
       so the anchors ARE the tabs. Counts live in the tab label, which retires
       the separate stat strip that duplicated them.
       Panels start visible; `.js-tabs` is added by script, so no-JS keeps the
       old scrolling page with working anchors instead of showing nothing. */
    .adm-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 16px;
border-bottom:2px solid #C8B89A;padding-bottom:8px}
.adm-tab{appearance:none;background:#fff;border:1px solid #C8B89A;
border-radius:999px;padding:5px 12px;font:inherit;font-size:12px;
color:#1A1A1A;cursor:pointer;display:inline-flex;align-items:baseline;gap:6px}
.adm-tab:hover{border-color:#5C4033}
.adm-tab[aria-selected='true']{background:#5C4033;color:#fff;border-color:#5C4033}
.adm-tab b{font-size:12px;font-variant-numeric:tabular-nums}
.adm-tab.hot b{color:#D2691E}
.adm-tab[aria-selected='true'] b{color:#fff}
.adm-tab.empty{opacity:.55}
.js-tabs .adm-panel{display:none}
.js-tabs .adm-panel.is-active{display:block}
/* ── The rung ladder + pipeline flow ───────────────────────────────── */
    .adm-two{display:grid;grid-template-columns:1fr;gap:18px;align-items:start}
@media(min-width:1100px){.adm-two{grid-template-columns:2fr 1fr}}
.rung{display:flex;gap:8px;align-items:baseline;padding:4px 0;
border-bottom:1px dotted #C8B89A;font-size:12px}
.rung i{font-style:normal;font-weight:700;color:#5C4033;min-width:16px}
.rung s{text-decoration:none;color:#777777;font-size:11px;margin-left:auto;
white-space:nowrap}
.flow{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch;margin:8px 0 4px}
.flow .step{flex:1 1 150px;min-width:140px;background:#F9F5F0;
border:1px solid #C8B89A;border-radius:10px;padding:9px 11px}
.flow .step h4{margin:0 0 3px;font-size:12px;color:#5C4033}
.flow .step p{margin:0;font-size:11px;color:#777777;line-height:1.45}
.flow .arrow{align-self:center;color:#C8B89A;font-size:18px;flex:0 0 auto}
.adm-grid{display:grid;grid-template-columns:1fr;gap:0 28px;align-items:start}
@media(min-width:1100px){.adm-grid{grid-template-columns:3fr 2fr}}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator{opacity:1}
.dtab{padding:6px 14px;border-radius:999px;font-size:12px;
font-weight:600;border:1px solid #C8B89A;cursor:pointer;
white-space:nowrap;text-decoration:none;display:inline-block}
.dtab-on{background:#5C4033;color:#fff;border-color:#5C4033}
.dtab-off{background:#fff;color:#777777}
.tl-dot{width:36px;height:36px;border-radius:50%;
background:#5C4033;color:#fff;font-size:10px;font-weight:700;
display:flex;align-items:center;justify-content:center;
flex-shrink:0;line-height:1.1;text-align:center}
.tl-line{width:2px;background:#C8B89A;flex:1;margin:4px auto 0}
.cat{font-size:9px;font-weight:700;padding:2px 7px;border-radius:999px;
text-transform:uppercase;letter-spacing:.05em;display:inline-block;
margin-bottom:6px}
/* Hamburger drawer */
.drawer-chk{display:none}
.drawer-backdrop{display:none;position:fixed;inset:0;
background:rgba(0,0,0,.45);z-index:200}
.drawer-panel{position:fixed;top:0;right:0;bottom:0;width:280px;
background:#F9F5F0;z-index:201;padding:20px 20px 80px;
overflow-y:auto;transform:translateX(100%);
transition:transform .2s ease}
.drawer-chk:checked ~ .drawer-backdrop{display:block}
.drawer-chk:checked ~ .drawer-panel{transform:translateX(0)}
.drawer-open-btn{background:none;border:1px solid #C8B89A;border-radius:8px;
padding:6px 10px;cursor:pointer;font-size:16px;
color:#5C4033;display:flex;align-items:center;gap:4px;
font-family:inherit}
.drawer-close-btn{display:block;text-align:right;font-size:20px;
color:#777777;cursor:pointer;margin-bottom:16px;
text-decoration:none}
/* Titleholders see-more (pure CSS) */
.th-toggle{display:none}
.th-extra{display:none}
.th-toggle:checked ~ .th-extra{display:block}
.th-toggle:checked ~ .th-more{display:none}
.th-more{font-size:11px;color:#D2691E;cursor:pointer;
display:inline-block;padding:5px 0;user-select:none}
/* Artifact viewer (pure CSS) */
.art-chk{display:none}
.art-panel{display:none;margin-top:6px;padding:8px 10px;background:#f3eee3;
border:1px solid #e0d4c0;border-radius:8px}
.art-chk:checked ~ .art-panel{display:block}
.art-badge{display:inline-flex;gap:5px;align-items:center;font-size:11px;
color:#5C4033;background:#efe9dd;border:1px solid #C8B89A;
border-radius:20px;padding:2px 9px;cursor:pointer}