@font-face{font-family:DM;src:url('/fonts/dm-400.ttf');font-weight:400;font-display:swap}@font-face{font-family:DM;src:url('/fonts/dm-500.ttf');font-weight:500;font-display:swap}@font-face{font-family:DM;src:url('/fonts/dm-600.ttf');font-weight:600;font-display:swap}@font-face{font-family:DM;src:url('/fonts/dm-700.ttf');font-weight:700;font-display:swap}@font-face{font-family:'Instrument Serif';src:url('/fonts/instrument-serif.ttf');font-display:swap}@font-face{font-family:'Editorial Script';src:url('/fonts/mrs-saint-delafield.ttf');font-display:swap}
:root,html[data-theme="light"]{color-scheme:light;--bg:#f8f5ef;--surface:#ffffff;--ink:#111111;--muted:#625e59;--line:#ded9d3;--accent:#b10b16;--accent-ink:#f8f5ef;--code-bg:#fff;--done:#8d0911;--note-bg:#f1ece4;--note-ink:#111111;--display:'Instrument Serif',Georgia,serif;--body:DM,Arial,sans-serif;--mono:DM,Arial,sans-serif}
body{margin:0;font-family:var(--body);-webkit-font-smoothing:antialiased}h1,h2,h3,.hero h1,.task h2,.step h3,legend{font-family:var(--display);font-weight:400!important;letter-spacing:-.018em} .hero{background:var(--bg);border-bottom:1px solid var(--line)}.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.04}.hero .wrap{padding-block:64px 48px}.lede{font-size:17px;line-height:1.75}.brand{background:#b10b16;border-color:#b10b16}.brand .wrap{padding-block:24px;color:#f8f5ef;align-items:center}.brand strong{color:#f8f5ef;font-size:30px;font-weight:400;line-height:1.05}.brand a{color:inherit;text-decoration:none}.brand a:focus-visible{outline:2px solid #f8f5ef;outline-offset:5px}.brand span a{font:500 13px DM,Arial,sans-serif;border-bottom:1px solid currentColor;padding-bottom:3px}.bar{background:var(--bg)}.task h2,.group>h2,.cat>h2{font-size:clamp(32px,4vw,44px)}.step h3,.idea h3,.pcard h3,.tool h3{font-size:28px}.sign{font-family:'Editorial Script',cursive;font-size:36px}.automate{background:#000;color:#f8f5ef}.automate .btn{background:#f8f5ef;color:#b10b16}.prompt pre{font-family:DM,Arial,sans-serif;font-size:15px}.btn,.copy,.chip{font-family:DM,Arial,sans-serif}.wrap,.panel,.tool,.grid,.pgrid,.ideas{min-width:0}.wrap{width:100%}pre{overflow-wrap:anywhere}.finish{border:1px solid var(--line)}
@media(max-width:540px){.hero .wrap{padding-block:38px}.brand strong{font-size:25px}.brand .wrap{padding-block:20px}.tool,.grid,.pgrid,.ideas{grid-template-columns:1fr}.panel{padding:20px 16px}.out{position:static}.btn{white-space:normal;text-align:center}.row{flex-wrap:wrap}.row input{min-width:0;max-width:100%}}

/* Persistent website navigation, separate from each guide's task tabs. */
header.brand{position:sticky;top:0;z-index:20}.brand .wrap{max-width:1440px;padding-inline:5%;gap:18px}.resource-site-nav{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;font:500 14px DM,Arial,sans-serif}.resource-site-nav a{display:inline-flex;align-items:center;min-height:44px;color:#f8f5ef;text-decoration:none}.resource-site-nav a:hover{text-decoration:underline;text-underline-offset:5px}.resource-site-nav .resource-contact{background:#f8f5ef;color:#8d0911;border-radius:999px;padding:10px 18px}.bar{top:var(--resource-header-height,94px)}.task{scroll-margin-top:calc(var(--resource-header-height,94px) + 115px)}@media(max-width:640px){.brand .wrap{padding-block:14px;gap:10px}.resource-site-nav{width:100%;gap:8px 18px;font-size:13px}.resource-site-nav .resource-contact{padding:8px 12px}.brand strong{font-size:26px}}

/* Shared white navigation and controls across every resource page. */
header.brand { background: #ffffff; border-color: var(--line); }
.brand .wrap, .brand strong, .resource-site-nav a { color: #383430; }
.brand a:focus-visible { outline-color: #383430; }
.btn, .btn.primary, .btn.ghost, .copy, .chip, .tab, .visit,
.automate .btn, .resource-site-nav .resource-contact {
 background: #ffffff; color: #383430; border: 1px solid #383430;
}
.btn:hover, .copy:hover, .chip:hover, .tab:hover, .visit:hover,
.automate .btn:hover, .resource-site-nav .resource-contact:hover {
 background: #f8f5ef; color: #383430;
}
.chip[aria-pressed="true"], .tab[aria-current="true"], .tab[aria-current="step"],
.tab[aria-selected="true"], .tab.active {
 background: #ffffff; color: #383430; border-color: #383430;
 box-shadow: inset 0 -3px 0 #383430; font-weight: 700;
}
.copy.ok { color: #383430; border-color: #383430; }
.btn:focus-visible, .copy:focus-visible, .chip:focus-visible,
.tab:focus-visible, .visit:focus-visible { outline-color: #383430; }
