*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
    --bg:#111009; --bg-surface:#1a1814; --bg-card:#201e19;
    --text:#ede5cf; --text-muted:#a09282; --text-faint:#6e6548;
    --accent:#e0a83a; --accent-hi:#ebb84a; --accent-dim:rgba(224,168,58,0.10);
    --border:rgba(224,168,58,0.14); --border-soft:rgba(237,229,207,0.06);
    --body-weight:300; color-scheme:dark;
}
@media (prefers-color-scheme:light) { html:not([data-theme="dark"]) { --bg:#faf8f3; --bg-surface:#f3f0e8; --bg-card:#ffffff; --text:#100e08; --text-muted:#68583a; --text-faint:#8f8368; --accent:#b88a18; --accent-hi:#cc9e28; --accent-dim:rgba(184,138,24,0.09); --border:rgba(184,138,24,0.18); --border-soft:rgba(16,14,8,0.05); --body-weight:400; color-scheme:light; } }
html[data-theme="light"] { --bg:#faf8f3; --bg-surface:#f3f0e8; --bg-card:#ffffff; --text:#100e08; --text-muted:#68583a; --text-faint:#8f8368; --accent:#b88a18; --accent-hi:#cc9e28; --accent-dim:rgba(184,138,24,0.09); --border:rgba(184,138,24,0.18); --border-soft:rgba(16,14,8,0.05); --body-weight:400; color-scheme:light; }
html[data-theme="dark"]  { --bg:#111009; --bg-surface:#1a1814; --bg-card:#201e19; --text:#ede5cf; --text-muted:#a09282; --text-faint:#6e6548; --accent:#e0a83a; --accent-hi:#ebb84a; --accent-dim:rgba(224,168,58,0.10); --border:rgba(224,168,58,0.14); --border-soft:rgba(237,229,207,0.06); --body-weight:300; color-scheme:dark; }

html { overscroll-behavior-y: none; }
body { background:var(--bg); color:var(--text); font-family:'Jost',sans-serif; font-weight:var(--body-weight); line-height:1.7; transition:background .3s,color .3s; min-height:100vh; display:flex; flex-direction:column; overscroll-behavior-y: none; }
body::before { content:''; position:fixed; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); opacity:.015; pointer-events:none; z-index:9999; }

nav { padding:1.75rem 4rem; padding-top:calc(1.75rem + env(safe-area-inset-top, 0px)); border-bottom:1px solid var(--border-soft); display:flex; align-items:center; justify-content:space-between; position:sticky; top:var(--ribbon-h, 40px); z-index:10000; background:rgba(17,16,9,0.78); backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px); }
html[data-theme="light"] nav { background:rgba(250,248,243,0.78); }
@media (prefers-color-scheme:light) { html:not([data-theme="dark"]) nav { background:rgba(250,248,243,0.78); } }
.nav-left { display:flex; align-items:center; gap:1.5rem; }
.nav-link { font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint); font-weight:500; text-decoration:none; display:flex; align-items:center; gap:.4rem; transition:color .2s; }
.nav-link:hover { color:var(--accent); }
.nav-right { display:flex; align-items:center; gap:1.25rem; }
.nav-cta { font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500; color:var(--bg); background:var(--accent); padding:.55rem 1rem; text-decoration:none; transition:background .2s; }
.nav-cta:hover { background:var(--accent-hi); }
.theme-toggle { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border:1px solid var(--border); background:transparent; color:var(--text-muted); cursor:pointer; transition:all .2s; }
.theme-toggle:hover { border-color:var(--accent); color:var(--accent); background:var(--accent-dim); }
.theme-toggle svg { width:15px; height:15px; }
.theme-toggle .icon-sun { display:none; } .theme-toggle .icon-moon { display:block; }
html[data-theme="light"] .theme-toggle .icon-sun { display:block; } html[data-theme="light"] .theme-toggle .icon-moon { display:none; }
@media (prefers-color-scheme:light) { html:not([data-theme="dark"]) .theme-toggle .icon-sun { display:block; } html:not([data-theme="dark"]) .theme-toggle .icon-moon { display:none; } }

main { flex:1; padding:4rem 4rem 6rem; max-width:860px; margin:0 auto; width:100%; }

.page-eyebrow { font-size:.65rem; letter-spacing:.28em; text-transform:uppercase; color:var(--accent); font-weight:500; margin-bottom:.75rem; }
.page-title { font-family:'Cormorant Garamond',serif; font-size:clamp(2rem,4vw,3.5rem); font-weight:300; line-height:1.1; color:var(--text); margin-bottom:1rem; }
.page-title em { font-style:italic; color:var(--accent); }
.page-lede { font-size:1rem; color:var(--text-muted); line-height:1.8; margin-bottom:2.5rem; max-width:60ch; }
.page-updated { font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-faint); margin-bottom:3rem; padding-bottom:1.5rem; border-bottom:1px solid var(--border-soft); }

main h2 { font-family:'Cormorant Garamond',serif; font-size:1.6rem; font-weight:500; color:var(--text); margin:2.5rem 0 .75rem; }
main h3 { font-size:.95rem; font-weight:500; color:var(--text); margin:1.25rem 0 .5rem; letter-spacing:.01em; }
main p { color:var(--text-muted); margin-bottom:1rem; max-width:70ch; }
main ul { color:var(--text-muted); margin:0 0 1rem 1.5rem; max-width:70ch; }
main li { margin-bottom:.4rem; }
main a { color:var(--accent); text-decoration:none; border-bottom:1px solid var(--accent-dim); transition:border-color .2s; }
main a:hover { border-color:var(--accent); }

.tag { display:inline-block; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; padding:.15rem .55rem; border:1px solid var(--border); color:var(--accent); margin-right:.4rem; }

.error-wrap { flex:1; display:flex; align-items:center; justify-content:center; padding:4rem 2rem; text-align:center; }
.error-code { font-family:'Cormorant Garamond',serif; font-size:clamp(6rem,15vw,10rem); font-weight:300; line-height:1; color:var(--accent); font-style:italic; margin-bottom:1rem; }
.error-title { font-family:'Cormorant Garamond',serif; font-size:clamp(1.6rem,3vw,2.2rem); font-weight:400; color:var(--text); margin-bottom:.75rem; }
.error-desc { color:var(--text-muted); max-width:42ch; margin:0 auto 2rem; }
.error-cta { display:inline-flex; align-items:center; gap:.5rem; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; font-weight:500; color:var(--bg); background:var(--accent); padding:.7rem 1.4rem; text-decoration:none; transition:background .2s; border:none; }
.error-cta:hover { background:var(--accent-hi); }


@media (max-width:700px) {
    nav, main, footer { padding-left:1.5rem; padding-right:1.5rem; }
}
