*{margin:0;padding:0;box-sizing:border-box;transition:background-color 3s,color 3s,border-color 3s}
:root{
  --paper:#e4d9be;--paper-dark:#d5c6a1;--paper-darker:#c0aa83;
  --ink:#271e14;--ink-mid:#3f3220;--ink-soft:#4c3f2c;
  --ink-faint:#705a43;--brick:#7e351b;--brick-light:#c4522a;
  --ochre:#725a1b;--ochre-light:#c4a84c;
  --serif:'EB Garamond',Georgia,serif;
  --display:'Cormorant Garamond','EB Garamond',Georgia,serif;
}
/* NIGHT MODE -- three fixed states (day is the default above), no blending
   between them. See assets/js/night-mode.js for how data-daypart gets set. */
:root[data-daypart="dusk"]{
  --paper:#ecb87a;--paper-dark:#dba05c;--paper-darker:#c48a48;
  --ink:#331c10;--ink-mid:#331c10;--ink-soft:#4e3a28;
  --ink-faint:#5f4728;--brick:#8f2d10;--ochre:#6e470e;
}
:root[data-daypart="night"]{
  --paper:#12100f;--paper-dark:#1c1712;--paper-darker:#2a2118;
  --ink:#ede1c8;--ink-mid:#ede1c8;--ink-soft:#b8a483;
  --ink-faint:#8a7a5f;--brick:#e0703c;--ochre:#d9b95c;
}
html{background:var(--paper)}
body{background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:18px;line-height:1.8;min-height:100vh;position:relative;overflow-x:hidden;display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
.hidden{display:none!important}

/* NIGHT MODE ATMOSPHERE -- same sunset sky / starfield / hearth glow on every
   page, not just the homepage. Spans the whole body (nav through footer) since
   body is the positioning context; every other direct child of body is lifted
   above these layers by the z-index rule below. */
body > *:not(.sky-dusk):not(.sky-night):not(.stars):not(.glow){position:relative;z-index:1}
.sky-dusk{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity 3s;
  background:linear-gradient(180deg,#241c38 0%,#5c3352 32%,#a5462f 62%,#d98a3f 100%)}
.sky-night{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity 3s;
  background:linear-gradient(180deg,#0c0a10 0%,#141019 55%,#0c0a0d 100%)}
:root[data-daypart="dusk"] .sky-dusk{opacity:1}
:root[data-daypart="night"] .sky-night{opacity:1}
.stars{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity 3s}
:root[data-daypart="night"] .stars{opacity:1}
.star{position:absolute;border-radius:50%;background:#fff9e8;animation:twinkle var(--dur) ease-in-out infinite;animation-delay:var(--delay)}
@keyframes twinkle{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.star{animation:none;opacity:.75}}
.glow{position:fixed;left:50%;bottom:-10vh;width:140vw;height:70vh;transform:translateX(-50%);z-index:0;pointer-events:none;
  --glow-strength:0;opacity:var(--glow-strength);transition:opacity 3s,background 3s;animation:flicker 5s ease-in-out infinite}
:root[data-daypart="dusk"] .glow{--glow-strength:.85;background:radial-gradient(ellipse at center,#ffb347cc 0%,#ffb34738 32%,transparent 68%)}
:root[data-daypart="night"] .glow{--glow-strength:.55;background:radial-gradient(ellipse at center,#e0703ccc 0%,#e0703c38 32%,transparent 68%)}
@keyframes flicker{0%,100%{opacity:var(--glow-strength)}50%{opacity:calc(var(--glow-strength) * .85)}}
@media (prefers-reduced-motion:reduce){.glow{animation:none}}

/* NAV DAYPART TOGGLE */
.nav-daypart-toggle{position:relative;width:1.9rem;height:1.9rem;flex-shrink:0}
.ndt-pill{position:absolute;top:0;left:0;width:1.9rem;height:1.9rem;border-radius:999px;
  border:1px solid transparent;overflow:hidden;transition:width .28s ease,border-color .28s ease,background-color .28s ease;z-index:50}
.nav-daypart-toggle:hover .ndt-pill,.nav-daypart-toggle:focus-within .ndt-pill{
  width:5.7rem;border-color:var(--ink-faint);background:var(--paper-dark)}
.ndt-row{display:flex;width:5.7rem;height:100%;transform:translateX(var(--ndt-shift,0));transition:transform .28s ease}
.nav-daypart-toggle:hover .ndt-row,.nav-daypart-toggle:focus-within .ndt-row{transform:translateX(0)}
.ndt-btn{flex:0 0 1.9rem;width:1.9rem;height:100%;display:flex;align-items:center;justify-content:center;
  background:none;border:none;cursor:pointer;padding:0;color:var(--ink-faint);transition:color .2s}
.ndt-btn:hover{color:var(--brick)}
.ndt-btn.active{color:var(--brick)}
.ndt-btn svg{width:1.05rem;height:1.05rem;display:block;fill:currentColor}

/* SITE FOOTER -- margin-top:auto (body is now a flex column) pins it to the
   true bottom of the viewport on short pages instead of leaving dead space
   below it; has no effect once content already fills/exceeds the viewport. */
.site-footer{text-align:center;padding:1.5rem 2rem;border-top:1px solid var(--paper-darker);margin-top:auto}
.site-footer p{font-size:1.02rem;letter-spacing:.12em;color:var(--ink-faint);font-variant:small-caps}
.footer-emblem-wrap{width:64px;height:64px;margin:0 auto .85rem;display:flex}
.footer-emblem-wrap img{width:100%;height:100%;object-fit:contain;display:block;transition:filter 3s;filter:drop-shadow(0 0 4px rgba(196,168,76,.4)) drop-shadow(0 0 10px rgba(196,168,76,.22))}
/* drop-shadow (not box-shadow) so the glow hugs the fan's actual silhouette
   instead of its square bounding box. day: soft ochre daylight (default above);
   dusk: warm sunset amber, echoing .glow; night: the same hearth-orange as
   .glow's night radial (#e0703c), not a cool white -- night's real accent
   language here is warm ember, not starlight */
:root[data-daypart="dusk"] .footer-emblem-wrap img{filter:drop-shadow(0 0 5px rgba(255,179,71,.85)) drop-shadow(0 0 13px rgba(255,179,71,.55))}
/* radial glow BEHIND the artwork itself (not just around its edge) so the
   dark ink/crevice pixels within the fan don't read as black gaps against
   the near-black night page -- they pick up ember light instead */
:root[data-daypart="night"] .footer-emblem-wrap img{background:radial-gradient(circle,rgba(224,112,60,.4) 0%,rgba(224,112,60,.15) 55%,transparent 75%);filter:drop-shadow(0 0 4px rgba(224,112,60,.85)) drop-shadow(0 0 13px rgba(224,112,60,.5))}

/* PAPER TEXTURE OVERLAY */
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:999;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");background-size:200px}

/* ORNAMENTS */
.orn{display:block;text-align:center;color:var(--brick);font-size:1.1rem;letter-spacing:.4em;margin:1.5rem 0;opacity:.7}
.orn-rule{display:flex;align-items:center;gap:1rem;margin:2rem 0;color:var(--ink-faint)}
.orn-rule::before,.orn-rule::after{content:'';flex:1;height:1px;background:var(--paper-darker)}
.orn-rule span{font-size:1rem;letter-spacing:.3em;text-transform:uppercase;white-space:nowrap}

/* NAV */
nav{background:var(--paper);border-bottom:2px solid var(--ink);padding:.75rem 2rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;position:sticky;top:0;z-index:100}
:root[data-daypart="dusk"] nav,:root[data-daypart="night"] nav{background:transparent}
.nav-brand{font-family:var(--display);font-size:1.1rem;font-weight:600;letter-spacing:.08em;cursor:pointer;color:var(--ink);justify-self:start;display:inline-flex;align-items:center;gap:.5rem}
.nav-seal{width:1.5em;height:1.5em;flex-shrink:0;border-radius:50%}
.nav-links{display:flex;gap:2rem}
.nav-links a{font-family:var(--serif);font-size:1.1rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);cursor:pointer;transition:color .2s;font-variant:small-caps}
.nav-links a:hover,.nav-links a.active{color:var(--brick)}
.nav-right{display:flex;align-items:center;gap:1rem;justify-self:end}
.nav-login{font-family:var(--serif);font-size:.98rem;letter-spacing:.05em;color:var(--ink-faint);white-space:nowrap;text-decoration:none}
.nav-login:hover{color:var(--ink-soft);text-decoration:underline;text-underline-offset:2px}
.nav-subscribe{font-family:var(--serif);font-size:1rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-variant:small-caps;color:var(--paper);background:var(--brick);border:1px solid var(--brick);padding:.4rem 1.15rem;border-radius:1px;white-space:nowrap;transition:all .2s}
.nav-subscribe:hover{background:#642e19;border-color:#642e19}

/* MOBILE NAV TOGGLE (hamburger) -- hidden on desktop; shown + wired up
   via the @media block below and assets/js/night-mode.js */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:.4rem;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:2.2rem;height:2.2rem;justify-self:end}
.nav-toggle span{display:block;width:1.4rem;height:2px;background:var(--ink);transition:transform .25s ease,opacity .2s ease}
nav.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
nav.nav-open .nav-toggle span:nth-child(2){opacity:0}
nav.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* BTNs */
.btn{display:inline-block;padding:.55rem 1.5rem;font-family:var(--serif);font-size:1.12rem;letter-spacing:.12em;font-variant:small-caps;cursor:pointer;transition:all .2s;border-radius:1px}
.btn-ink{background:var(--ink);color:var(--paper);border:1.5px solid var(--ink)}
.btn-ink:hover{background:var(--ink-mid)}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink-soft)}
.btn-ghost:hover{border-color:var(--ink);background:rgba(28,22,14,.06)}
.btn-brick{background:transparent;color:var(--brick);border:1.5px solid var(--brick)}
.btn-brick:hover{background:rgba(139,58,31,.07)}

/* HOME */
.home-masthead{max-width:780px;margin:0 auto;padding:4rem 2rem 2rem;text-align:center}
.masthead-rule-top{border:none;border-top:3px solid var(--ink);margin-bottom:.5rem}
.masthead-rule-thin{border:none;border-top:1px solid var(--ink);margin-bottom:2rem}
.masthead-title{font-family:var(--display);font-size:clamp(3rem,8vw,5.5rem);font-weight:300;letter-spacing:.06em;line-height:1.05;color:var(--ink);margin-bottom:.25rem}
.masthead-quarterly{font-family:var(--serif);font-size:1.15rem;letter-spacing:.5em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.75rem;display:block}
.masthead-rule-thin2{border:none;border-top:1px solid var(--ink);margin-bottom:.5rem}
.masthead-rule-bot{border:none;border-top:3px solid var(--ink);margin-bottom:2.5rem}
.masthead-def{font-style:italic;font-size:1rem;color:var(--ink-soft);margin-bottom:.5rem}
.masthead-vol{font-size:1.02rem;letter-spacing:.25em;text-transform:uppercase;color:var(--ink-faint)}

/* FEATURED ISSUE SPREAD */
.issue-spread{max-width:900px;margin:0 auto;padding:2rem;display:grid;grid-template-columns:1fr 1.2fr;gap:3rem;align-items:start}
.cover-panel{position:relative}
.cover-frame{border:2px solid #271e14;padding:0;position:relative;background:#271e14}
.cover-frame-inner{border:1px solid var(--paper-dark);margin:6px;overflow:hidden;position:relative}
.cover-painting{width:100%;background:linear-gradient(160deg,#2a1a08 0%,#1a0d04 40%,#0d0804 100%);min-height:340px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.painting-sim{position:absolute;inset:0;background:radial-gradient(ellipse at 60% 35%,rgba(180,120,40,.35) 0%,rgba(100,60,10,.2) 35%,transparent 70%),radial-gradient(ellipse at 30% 60%,rgba(80,40,10,.3) 0%,transparent 50%);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:1.5rem}
.cover-caption{font-family:var(--serif);font-size:1rem;font-style:italic;color:rgba(240,220,180,.55);text-align:center;line-height:1.5}
.cover-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(10,5,2,.92));padding:2rem 1.25rem 1.25rem}
.cover-overlay-title{font-family:var(--display);font-size:1.6rem;font-weight:600;color:var(--paper);letter-spacing:.04em;line-height:1.2;display:block;margin-bottom:.3rem}
.cover-overlay-sub{font-family:var(--serif);font-size:1.1rem;font-style:italic;color:rgba(240,220,180,.7);letter-spacing:.1em;display:block}
.cover-meta{background:#271e14;padding:.6rem 1.25rem;display:flex;justify-content:space-between;align-items:center}
.cover-meta-vol{font-size:.95rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(240,220,180,.5);font-family:var(--serif)}
.cover-meta-season{font-size:.95rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ochre-light);font-family:var(--serif)}

.issue-content{padding-top:.5rem}
.issue-content-label{font-size:.98rem;letter-spacing:.3em;text-transform:uppercase;color:var(--brick);margin-bottom:1.25rem;display:block;font-variant:small-caps}
.issue-content h2{font-family:var(--display);font-size:2rem;font-weight:400;font-style:italic;color:var(--ink);line-height:1.25;margin-bottom:.5rem}
.issue-content-theme{font-family:var(--display);font-size:1.1rem;font-weight:300;color:var(--ink-soft);letter-spacing:.08em;margin-bottom:1.5rem;display:block}
.issue-content p{font-size:.95rem;color:var(--ink-mid);line-height:1.85;margin-bottom:1.5rem}
.toc{margin-bottom:2rem}
.toc-head{font-size:.98rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.75rem;display:block;font-variant:small-caps}
.toc-item{display:flex;align-items:baseline;gap:.75rem;padding:.55rem 0;border-bottom:1px solid var(--paper-darker);cursor:pointer;transition:all .2s}
.toc-item:hover .toc-title{color:var(--brick)}
.toc-marker{color:var(--brick);font-size:1rem;flex-shrink:0}
.toc-title{font-family:var(--serif);font-size:1rem;color:var(--ink);flex:1;transition:color .2s}
.toc-type{font-size:1rem;font-style:italic;color:var(--ink-faint)}
.issue-actions{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1.5rem}

/* ISSUES ARCHIVE */
.archive-wrap{max-width:820px;margin:0 auto;padding:3rem 2rem 5rem}
.archive-wrap h1{font-family:var(--display);font-size:2.8rem;font-weight:300;font-style:italic;color:var(--ink);margin-bottom:.25rem}
.archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem;margin-top:2rem}
.archive-card{border:1.5px solid var(--ink);padding:1.5rem;cursor:pointer;transition:all .2s;position:relative;background:var(--paper-dark)}
.archive-card::before{content:'';position:absolute;inset:3px;border:1px solid var(--paper-darker);pointer-events:none}
.archive-card:hover{background:var(--paper-darker);transform:translateY(-2px)}
.archive-card-label{font-size:.95rem;letter-spacing:.22em;text-transform:uppercase;color:var(--brick);display:block;margin-bottom:.6rem;font-variant:small-caps}
.archive-card h3{font-family:var(--display);font-size:1.3rem;font-style:italic;font-weight:400;color:var(--ink);margin-bottom:.3rem;line-height:1.3}
.archive-card p{font-size:1.12rem;color:var(--ink-soft);font-style:italic;margin-bottom:1rem}
.archive-card-tag{font-size:.95rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ochre);border-bottom:1px solid var(--ochre);padding-bottom:1px;font-variant:small-caps}
.archive-card-coming{font-size:.95rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-faint);font-variant:small-caps}

/* ISSUE HUB */
.hub-wrap{max-width:720px;margin:0 auto;padding:3rem 2rem 5rem}
.back-link{display:inline-flex;align-items:center;gap:.5rem;font-size:1.05rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);cursor:pointer;margin-bottom:2.5rem;transition:color .2s;font-variant:small-caps}
.back-link:hover{color:var(--brick)}
.back-link::before{content:'←';font-variant:normal}
.hub-header{text-align:center;margin-bottom:2.5rem}
.hub-vol{font-size:.98rem;letter-spacing:.3em;text-transform:uppercase;color:var(--brick);display:block;margin-bottom:1rem;font-variant:small-caps}
.hub-title{font-family:var(--display);font-size:3rem;font-weight:300;font-style:italic;color:var(--ink);line-height:1.1;margin-bottom:.5rem}
.hub-sub{font-family:var(--display);font-size:1.2rem;font-weight:300;color:var(--ink-soft);letter-spacing:.08em;display:block;margin-bottom:1.5rem}
.hub-intro{font-size:.95rem;color:var(--ink-mid);max-width:480px;margin:0 auto 2rem;font-style:italic;line-height:1.85}
.hub-quote{font-family:var(--display);font-size:1.05rem;font-style:italic;color:var(--ink-soft);max-width:480px;margin:0 auto 1.5rem;line-height:1.75}
.hub-quote cite{display:block;font-size:1.05rem;color:var(--ink-faint);margin-top:.5rem;font-style:normal;letter-spacing:.1em;text-align:right}
.hub-actions{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-bottom:3rem}
.hub-articles{display:flex;flex-direction:column;gap:0}
.hub-article-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--paper-darker);cursor:pointer;transition:all .2s}
.hub-article-item:first-child{border-top:1px solid var(--paper-darker)}
.hub-article-item:hover .hub-art-title{color:var(--brick)}
.hub-art-left{flex:1}
.hub-art-title{font-family:var(--display);font-size:1.15rem;font-style:italic;color:var(--ink);transition:color .2s;margin-bottom:.15rem}
.hub-art-author{font-size:1.12rem;color:var(--ink-soft)}
.hub-art-type{font-size:.95rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-faint);font-variant:small-caps}
.hub-art-arrow{color:var(--ink-faint);font-size:1.15rem;transition:all .2s}
.hub-article-item:hover .hub-art-arrow{color:var(--brick);transform:translateX(3px)}

/* ARTICLE */
.article-wrap{max-width:660px;margin:0 auto;padding:3rem 2rem 5rem}
.art-header{text-align:center;margin-bottom:3rem}
.art-section{font-size:.98rem;letter-spacing:.3em;text-transform:uppercase;color:var(--brick);display:block;margin-bottom:1.25rem;font-variant:small-caps}
.art-title{font-family:var(--display);font-size:clamp(2rem,5vw,3.2rem);font-weight:300;font-style:italic;color:var(--ink);line-height:1.15;margin-bottom:.75rem}
.art-byline{font-family:var(--serif);font-style:italic;color:var(--ink-soft);font-size:1rem}
.art-body{font-size:1.05rem;line-height:1.9;color:var(--ink)}
.art-body p{margin-bottom:1.5rem;text-align:justify;hyphens:auto}
.art-body p:first-of-type::first-letter{font-family:var(--display);font-size:4.2rem;float:left;line-height:.82;margin-right:.08em;margin-top:.05em;color:var(--brick);font-weight:600}
.art-body blockquote{margin:2.5rem 1rem;padding:1.25rem 1.5rem 1.25rem 2rem;border-left:3px solid var(--brick);background:rgba(28,22,14,.04);font-style:italic;color:var(--ink-mid);font-size:1rem;line-height:1.85}
.art-body blockquote footer{font-size:1.12rem;color:var(--ink-faint);margin-top:.75rem;font-style:normal}
.pullquote{margin:2.5rem 0;padding:1.5rem 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--paper-darker);text-align:center}
.pullquote p{font-family:var(--display);font-size:1.5rem;font-style:italic;font-weight:300;color:var(--ink);line-height:1.4}
.pullquote cite{font-size:1.05rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);display:block;margin-top:.75rem;font-style:normal;font-variant:small-caps}
.art-body .stage-dir{color:var(--ink-faint);font-style:italic;font-size:.92rem;margin-bottom:.75rem;display:block}
.art-body .interview-q{font-style:italic;color:var(--ink-soft);margin-bottom:.3rem}
.art-body .interview-a{margin-bottom:1.25rem}
.art-body .footnote{font-size:1.12rem;color:var(--ink-faint);font-style:italic;border-top:1px solid var(--paper-darker);padding-top:1rem;margin-top:2rem;line-height:1.7}
.art-body .works-cited{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--paper-darker);font-size:1.15rem;color:var(--ink-faint);line-height:1.75}
.art-body .works-cited h4{font-family:var(--serif);font-size:1.05rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.75rem;font-variant:small-caps}
.art-nav{display:flex;justify-content:space-between;align-items:center;margin-top:3.5rem;padding-top:1.5rem;border-top:2px solid var(--ink);gap:1rem}
.art-nav-btn{font-family:var(--serif);font-size:1.08rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);cursor:pointer;padding:.4rem 0;border:none;background:none;transition:color .2s;font-variant:small-caps}
.art-nav-btn:hover{color:var(--brick)}

/* COLOPHON */
.colophon{max-width:500px;margin:3rem auto 0;padding:2rem;text-align:center;border-top:1px solid var(--paper-darker)}
.colophon blockquote{font-family:var(--display);font-style:italic;font-size:1.1rem;color:var(--ink-mid);line-height:1.7;margin-bottom:.75rem}
.colophon cite{font-size:1.05rem;color:var(--ink-faint);display:block;margin-bottom:1.5rem}
.colophon .sign-off{font-size:.9rem;font-style:italic;color:var(--ink-soft);line-height:1.7}
.colophon .troubadours{font-size:1.05rem;letter-spacing:.2em;color:var(--ink-faint);margin-top:.5rem;font-variant:small-caps}

/* ABOUT */
.about-wrap{max-width:680px;margin:0 auto;padding:3rem 2rem 5rem}
.about-wrap h1{font-family:var(--display);font-size:2.8rem;font-weight:300;font-style:italic;color:var(--ink);margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid var(--ink)}
.about-wrap h2{font-family:var(--display);font-size:1.3rem;font-style:italic;font-weight:400;color:var(--brick);margin:2.5rem 0 .75rem}
.about-wrap p{color:var(--ink-mid);margin-bottom:1.25rem;line-height:1.85;font-size:1rem}
.roster{margin:1.5rem 0}
.roster-item{display:flex;align-items:center;gap:1.5rem;padding:1.25rem 0;border-bottom:1px solid var(--paper-darker)}
.roster-item:first-child{border-top:1px solid var(--paper-darker)}
.roster-initial{font-family:var(--display);font-size:2.8rem;font-weight:600;color:var(--brick);line-height:1;flex-shrink:0;width:2.4rem;text-align:center}
.roster-name{font-family:var(--display);font-size:1.15rem;font-style:italic;color:var(--ink);margin-bottom:.2rem}
.roster-role{font-size:1.02rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-faint);font-variant:small-caps}
.roster-org{font-size:.98rem;letter-spacing:.08em;color:var(--brick);font-variant:small-caps;margin-top:.25rem}
.respond-box{border:2px solid var(--brick);padding:2rem;margin-top:2.5rem;text-align:center;position:relative}
.respond-box::before{content:'✦';position:absolute;top:-1rem;left:50%;transform:translateX(-50%);background:var(--paper);padding:0 .5rem;color:var(--brick);font-size:.9rem}
.respond-box h3{font-family:var(--display);font-size:1.2rem;font-style:italic;color:var(--ink);margin-bottom:.75rem}
.respond-box p{font-size:.9rem;color:var(--ink-soft);margin-bottom:.75rem;line-height:1.75}
.respond-box a{color:var(--brick);text-decoration:underline;text-underline-offset:3px}
.respond-box small{font-size:1.08rem;color:var(--ink-faint);font-style:italic}

/* SHARE MODAL */
.modal-overlay{position:fixed;inset:0;background:rgba(28,22,14,.6);z-index:200;display:flex;align-items:center;justify-content:center;padding:1.5rem}
.modal{background:var(--paper);border:2px solid var(--ink);padding:2.5rem;max-width:400px;width:100%;text-align:center;position:relative}
.modal::before{content:'';position:absolute;inset:6px;border:1px solid var(--paper-darker);pointer-events:none}
.modal h3{font-family:var(--display);font-size:1.5rem;font-style:italic;color:var(--ink);margin-bottom:.5rem}
.modal p{color:var(--ink-soft);font-size:.9rem;margin-bottom:1.5rem;font-style:italic}
.share-url{background:var(--paper-dark);border:1px solid var(--paper-darker);padding:.65rem 1rem;font-size:1.08rem;color:var(--ink-soft);font-family:monospace;margin-bottom:1.5rem;word-break:break-all;text-align:left}
.modal-actions{display:flex;gap:.75rem;justify-content:center}

/* ARTICLE ILLUSTRATION */
.art-illustration{margin:0 0 3rem;border:1px solid var(--paper-darker)}
.art-illustration img{width:100%;display:block;filter:sepia(.12) contrast(.97)}
.art-illustration figcaption{padding:.5rem 1rem;font-size:.98rem;letter-spacing:.1em;color:var(--ink-faint);font-style:italic;text-align:center;border-top:1px solid var(--paper-darker)}

/* EMBLEM -- framed watercolor mark, used as recurring site ornament
   (homepage + every issue hub) rather than issue-specific artwork */
.emblem-plate{max-width:280px;margin:0 auto 2.5rem;text-align:center}
.emblem-plate img{width:100%;display:block;padding:14px;border:1px solid var(--ink-faint);box-shadow:0 0 0 6px var(--paper),0 0 0 7px var(--brick-light);transition:box-shadow 3s}
/* night: hearth-orange glow around the frame, PLUS the same glow radiating
   from behind the artwork itself -- the fade-to-transparent radius stays
   inside the image content, so it lights the dark ink/crevice gaps within
   the fan without recoloring the mat/padding ring around it */
:root[data-daypart="night"] .emblem-plate img{background:radial-gradient(circle,rgba(224,112,60,.4) 0%,rgba(224,112,60,.15) 55%,transparent 72%);box-shadow:0 0 0 6px var(--paper),0 0 0 7px var(--brick-light),0 0 32px 10px rgba(224,112,60,.4)}
.emblem-plate-cap{display:block;margin-top:1.1rem;font-family:var(--display);font-style:italic;font-size:.92rem;letter-spacing:.1em;color:var(--ink-faint)}
@media (max-width:600px){.emblem-plate{max-width:210px}}

/* RESPONSIVE */
/* Nav collapses to a hamburger well before body copy needs to reflow --
   brand + 5 links + login/subscribe/daypart-toggle has no room below ~900px
   and was overflowing the viewport uncontained (nav-login/.nav-subscribe
   pushed past the edge and clipped invisible by body's overflow-x:hidden). */
@media(max-width:1000px){
  nav{
    grid-template-columns:1fr auto auto;
    grid-template-areas:
      "brand subscribe toggle"
      "links links links"
      "daypart daypart daypart"
      "login login login";
    row-gap:0;
    column-gap:.75rem;
    position:relative;
  }
  .nav-brand{grid-area:brand;font-size:1rem}
  .nav-toggle{display:flex;grid-area:toggle}
  .nav-links{grid-area:links}
  /* unwraps .nav-right so its children (daypart-toggle, login, subscribe)
     lay out as direct grid items -- lets Subscribe stay always-visible next
     to the hamburger while login/daypart-toggle stay tucked in the dropdown,
     with no markup changes needed across the 12 pages that use it. */
  .nav-right{display:contents}
  .nav-subscribe{grid-area:subscribe;justify-self:end;align-self:center}
  .nav-daypart-toggle{grid-area:daypart}
  .nav-login{grid-area:login}
  nav:not(.nav-open) .nav-links,
  nav:not(.nav-open) .nav-daypart-toggle,
  nav:not(.nav-open) .nav-login{display:none}
  nav.nav-open .nav-links{display:flex;flex-direction:column;gap:0;padding:.5rem 0 0}
  nav.nav-open .nav-links a{padding:.85rem 0;border-bottom:1px solid var(--paper-darker)}
  nav.nav-open .nav-daypart-toggle{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--paper-darker)}
  nav.nav-open .nav-login{display:block;padding-bottom:1rem}
}
@media(max-width:640px){
  .issue-spread{grid-template-columns:1fr;gap:2rem}
  .cover-painting{min-height:220px}
  nav{padding:.65rem 1rem}
  .nav-brand{font-size:.92rem}
  .nav-subscribe{font-size:.95rem;padding:.35rem .85rem}
  .home-masthead,.hub-wrap,.article-wrap,.about-wrap,.archive-wrap{padding-left:1.25rem;padding-right:1.25rem}
}

/* MUSINGS */
.musings-wrap{max-width:720px;margin:0 auto;padding:3rem 2rem 5rem}
.musings-wrap h1{font-family:var(--display);font-size:2.8rem;font-weight:300;font-style:italic;color:var(--ink);margin-bottom:.25rem;text-align:center}
.musings-intro{font-size:.9rem;color:var(--ink-soft);font-style:italic;text-align:center;margin-bottom:1rem}
.musing-entry{padding:2.25rem 0}
.musing-entry:first-child{padding-top:0}
.musing-divider{display:block;text-align:center;color:var(--brick);font-size:1.1rem;letter-spacing:.4em;opacity:.7}
.musing-dateline{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.75rem}
.musing-author{font-size:1rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brick);font-variant:small-caps}
.musing-date{font-size:1.02rem;color:var(--ink-faint);font-style:italic}
.musing-title{font-family:var(--display);font-size:1.4rem;font-style:italic;color:var(--ink);margin-bottom:.5rem}
.musing-body{font-size:.98rem;color:var(--ink-mid);line-height:1.85;white-space:pre-wrap}
.musing-image{margin-top:1rem;border:1px solid var(--paper-darker)}
.musing-image img{width:100%;display:block;filter:sepia(.12) contrast(.97)}
.musing-actions{display:flex;gap:.75rem;margin-top:1rem}
.musing-actions button{background:none;border:none;font-family:var(--serif);font-size:1.05rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);cursor:pointer;padding:0;font-variant:small-caps}
.musing-actions button:hover{color:var(--brick)}
.musing-empty{text-align:center;color:var(--ink-faint);font-style:italic;padding:3rem 0}

/* MUSINGS AUTH FORMS */
.auth-wrap{max-width:420px;margin:0 auto;padding:4rem 2rem 5rem}
.auth-wrap h1{font-family:var(--display);font-size:2.2rem;font-weight:300;font-style:italic;color:var(--ink);text-align:center;margin-bottom:2rem}
.auth-field{margin-bottom:1.25rem}
.auth-field label{display:block;font-size:1rem;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.4rem;font-variant:small-caps}
.auth-field input,.auth-field select,.auth-field textarea{width:100%;padding:.65rem .75rem;font-family:var(--serif);font-size:.95rem;color:var(--ink);background:var(--paper);border:1.5px solid var(--paper-darker)}
.auth-field textarea{min-height:160px;resize:vertical}
.auth-field input:focus,.auth-field select:focus,.auth-field textarea:focus{outline:none;border-color:var(--brick)}
.auth-error{color:var(--brick);font-size:1.15rem;font-style:italic;margin-bottom:1rem;min-height:1.2em}
.auth-links{text-align:center;margin-top:1.5rem;font-size:1.12rem}
.auth-links a{color:var(--ink-soft);text-decoration:underline;text-underline-offset:3px}
.auth-links a:hover{color:var(--brick)}
