@font-face { font-family: Instrument Serif; src: url("/assets/serif.woff2") format("woff2"); font-display: swap; }
:root {
  color-scheme: light; --paper:#f5f2e9; --card:#fffdf6; --ink:#222c25;
  --muted:#506156; --forest:#213e34; --line:#ccd2c4; --green:#e0e8d3; --error:#8b271d;
  font:16px/1.55 system-ui,sans-serif; color:var(--ink); background:var(--paper);
}
* { box-sizing:border-box; }
body { margin:0; }
.wrap { width:min(100% - 2.4rem,70rem); margin-inline:auto; }
.mast { color:var(--card); background:var(--forest); }
.mast-inner { display:flex; min-height:4.5rem; gap:1rem; justify-content:space-between; align-items:center; flex-wrap:wrap; padding-block:.6rem; }
.wordmark { font-family:Instrument Serif,Georgia,serif; font-size:1.85rem; text-decoration:none; color:inherit; }
nav { display:flex; flex-wrap:wrap; gap:.5rem 1.1rem; align-items:center; font-size:.92rem; }
nav a, nav button.link { color:inherit; }
main { padding-block:clamp(1.8rem,5vw,3.8rem) 4rem; }
h1,h2,h3 { font-family:Instrument Serif,Georgia,serif; font-weight:normal; line-height:1; margin:0; }
h1 { font-size:clamp(3.2rem,8vw,6.1rem); letter-spacing:-.035em; }
h2 { font-size:clamp(2.3rem,4.5vw,3.4rem); letter-spacing:-.02em; }
h3 { font-size:1.85rem; }
p { margin:.65rem 0 1rem; }
a { color:#254f3d; text-underline-offset:.2em; }
button, input, textarea { font:inherit; }
button,.button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:.55rem .9rem; border:1px solid var(--forest); border-radius:.35rem; background:var(--forest); color:var(--card); font-weight:650; cursor:pointer; text-decoration:none; }
button:hover,.button:hover { background:#2e5144; }
button:disabled { opacity:.65; cursor:wait; }
button.secondary { background:var(--green); color:var(--forest); border-color:#b0bdac; }
button.secondary:hover { background:#cfdcc4; }
button.link { background:none; border:0; color:#254f3d; text-decoration:underline; text-underline-offset:.2em; padding-inline:0; }
button.link:hover { background:none; }
button.marker { min-height:32px; background:var(--green); border-color:var(--line); color:var(--forest); font-size:.85rem; padding:.18rem .52rem; }
:focus-visible { outline:3px solid #956624; outline-offset:3px; }
input,textarea { background:var(--card); border:1px solid #9aa799; color:var(--ink); border-radius:.35rem; padding:.62rem .72rem; width:100%; }
textarea { resize:vertical; min-height:6.8rem; }
label { font-weight:650; }
.field { display:grid; gap:.35rem; margin-bottom:.9rem; }
.signin { max-width:34rem; margin:auto; padding:clamp(1rem,4vw,2.5rem); background:var(--card); border:1px solid var(--line); border-radius:.5rem; }
.signin h1 { font-size:clamp(2.8rem,6vw,4.1rem); }
.status { display:block; color:var(--muted); }
.status:empty { display:none; }
.status.error { color:var(--error); }
.eyebrow { color:var(--muted); font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.11em; margin-bottom:.65rem; }
.intro { color:var(--muted); max-width:65ch; margin-bottom:1.6rem; }
.layout { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); gap:clamp(1.4rem,4vw,3rem); align-items:start; }
.panel { border-top:1px solid var(--line); padding-top:1.2rem; margin-bottom:2.2rem; }
.panel:first-child { border-top:0; padding-top:0; }
.video { display:block; width:100%; aspect-ratio:16/9; background:var(--forest); border-radius:.45rem; }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem .85rem; margin:.75rem 0; }
.comments,.answers,.clients { padding:0; margin:1rem 0; list-style:none; }
.comments li,.answers li,.clients li { border-top:1px solid var(--line); padding:.9rem 0; }
.comments li:target { background:var(--green); outline:6px solid var(--green); }
.meta { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; color:var(--muted); font-size:.88rem; }
.meta strong { color:var(--ink); }
.copy { white-space:pre-wrap; overflow-wrap:anywhere; margin:.4rem 0; }
details { margin:.7rem 0; }
summary { cursor:pointer; color:var(--forest); font-weight:650; }
.note { padding:.8rem .95rem; background:var(--green); border-radius:.35rem; overflow-wrap:anywhere; }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:.6rem 1rem; }
.client-line { display:flex; flex-wrap:wrap; align-items:center; gap:.7rem; justify-content:space-between; }
.client-line a { font-size:1.15rem; font-weight:650; }
@media(max-width:48rem) { .layout { grid-template-columns:minmax(0,1fr); } }
@media(max-width:35rem) { .admin-grid { grid-template-columns:1fr; } }

[hidden] { display:none !important; }
