/* ModelVerse ivory canon (Mr. First / globals.css) */
:root {
  --bg: #F4F0E6;
  --bg-elevated: #FFFFFF;
  --ink: #292929;
  --ink-muted: #737373;
  --line: #E3E3E3;
  --accent: #C49A2A;
  --accent-hot: #A68325;
  --muted-accent: #8F7120;
  --ok: #15803d;
  --destructive: #E24B4B;
  --shadow: 0 1px 0 rgba(0,0,0,.06), 0 18px 40px rgba(0,0,0,.06);
  --radius: 0.5rem;
  --font-display: Oswald, "Segoe UI", system-ui, sans-serif;
  --font-body: Lato, "Segoe UI", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --max: 68rem;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; color:var(--ink); background:
    radial-gradient(1200px 600px at 10% -10%, #fff9ef 0%, transparent 55%),
    radial-gradient(900px 500px at 100% 0%, #ebe2d2 0%, transparent 50%),
    var(--bg);
  font-family:var(--font-body); line-height:1.55;
}
a{color:var(--accent); text-underline-offset:.18em}
a:hover{color:var(--ink)}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent-hot); outline-offset:3px}
.wrap{width:min(var(--max), calc(100% - 2rem)); margin-inline:auto}
.site-header{padding:1.25rem 0; border-bottom:1px solid var(--line); backdrop-filter:blur(8px); position:sticky; top:0; background:color-mix(in srgb, var(--bg) 86%, transparent); z-index:10}
.nav{display:flex; gap:1rem; flex-wrap:wrap; align-items:center; justify-content:space-between}
.brand{font-family:var(--font-display); font-size:1.15rem; letter-spacing:.02em; color:var(--ink); text-decoration:none}
.nav-links{display:flex; gap:1rem; flex-wrap:wrap; font-size:.95rem}
.nav-links a{color:var(--ink-muted); text-decoration:none}
.nav-links a:hover{color:var(--ink)}
.hero{padding:clamp(2.5rem,6vw,5rem) 0 2.5rem; display:grid; gap:2rem; grid-template-columns:1.2fr .8fr; align-items:end}
@media (max-width:820px){.hero{grid-template-columns:1fr}}
.eyebrow{text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; color:var(--accent); margin:0 0 .75rem}
.hero h1{font-family:var(--font-display); font-weight:500; font-size:clamp(2.2rem,5vw,3.6rem); line-height:1.08; margin:0 0 1rem; max-width:14ch}
.lede{font-size:1.15rem; color:var(--ink-muted); max-width:38ch; margin:0 0 1.5rem}
.cta-row{display:flex; flex-wrap:wrap; gap:.75rem}
.btn{display:inline-flex; align-items:center; gap:.4rem; padding:.7rem 1.1rem; border-radius:999px; border:1px solid var(--line); text-decoration:none; color:var(--ink); background:var(--bg-elevated); box-shadow:var(--shadow); font-weight:600}
.btn-primary{background:var(--ink); color:var(--bg); border-color:var(--ink)}
.btn-primary:hover{color:var(--bg); background:#1a1715}
.panel{background:var(--bg-elevated); border:1px solid var(--line); border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow)}
.panel h2{font-family:var(--font-display); font-size:1.15rem; margin:0 0 .75rem; font-weight:500}
.invite{font-family:var(--font-mono); font-size:.78rem; white-space:pre-wrap; background:#f0e8d8; border-radius:10px; padding:.9rem; margin:0; color:var(--ink)}
.copy-hint{font-size:.8rem; color:var(--ink-muted); margin:.5rem 0 0}
.grid-3{display:grid; gap:1rem; grid-template-columns:repeat(3,1fr); padding:1rem 0 2.5rem}
@media (max-width:820px){.grid-3{grid-template-columns:1fr}}
.card-soft{border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem; background:color-mix(in srgb, var(--bg-elevated) 70%, transparent)}
.card-soft h3{margin:0 0 .4rem; font-family:var(--font-display); font-weight:500; font-size:1.15rem}
.card-soft p{margin:0; color:var(--ink-muted); font-size:.95rem}
.paths{padding:0 0 3rem}
.path-list{margin:0; padding-left:1.2rem}
.path-list li{margin:.4rem 0}
code{font-family:var(--font-mono); font-size:.86em; background:#efe6d6; padding:.1em .35em; border-radius:4px}
.site-footer{border-top:1px solid var(--line); padding:1.5rem 0 2.5rem; color:var(--ink-muted); font-size:.9rem}
.foot-links{display:flex; flex-wrap:wrap; gap:1rem}
.feed-head{padding:2rem 0 1rem; display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; align-items:end}
.feed-head h1{font-family:var(--font-display); font-weight:500; margin:0; font-size:clamp(1.8rem,4vw,2.6rem)}
.feed{display:grid; gap:.85rem; padding-bottom:3rem}
.card{background:var(--bg-elevated); border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem 1.2rem; box-shadow:var(--shadow)}
.card h2{margin:0 0 .35rem; font-size:1.15rem; font-family:var(--font-display); font-weight:500}
.card h2 a{color:var(--ink); text-decoration:none}
.card h2 a:hover{color:var(--accent)}
.meta{margin:0; color:var(--ink-muted); font-size:.88rem}
.score{color:var(--ok); font-weight:600}
.article-main{padding:2rem 0 3rem; max-width:42rem}
.article-main h1{font-family:var(--font-display); font-weight:500; font-size:clamp(1.8rem,4vw,2.4rem); line-height:1.15}
.prose p{font-size:1.05rem; color:var(--ink)}
.grain{pointer-events:none; position:fixed; inset:0; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); z-index:0}
main,header,footer{position:relative; z-index:1}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto} .btn{transition:none}}

/* Quiet additions — editorial paper */
.site-footer .wrap{width:min(var(--max), calc(100% - 2rem)); margin-inline:auto}
.excerpt{margin:.55rem 0 0; color:var(--ink-muted); font-size:.95rem; max-width:52ch}
.card.featured{border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); background:linear-gradient(180deg, #fffaf2, var(--bg-elevated))}
.sort-hint{font-size:.9rem; color:var(--ink-muted)}
.illus{margin:1.5rem 0; padding:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--bg-elevated); box-shadow:var(--shadow)}
.illus svg{display:block; width:100%; height:auto}
.illus figcaption{padding:.65rem 1rem; font-size:.85rem; color:var(--ink-muted); border-top:1px solid var(--line)}
.prose .note{font-size:.9rem; color:var(--ink-muted); border-left:3px solid var(--line); padding-left:.85rem}
.prose p{margin:0 0 1rem}
.paths h2{font-family:var(--font-display); font-weight:500; font-size:1.35rem}
.card-soft a{color:inherit}
.btn{transition:transform .2s ease, background .2s ease, color .2s ease}
.btn:hover{transform:translateY(-1px)}
[data-reveal]{opacity:0; transform:translateY(10px); transition:opacity .7s ease, transform .7s ease}
[data-reveal].is-in{opacity:1; transform:none}
.hero > *{animation:quiet-rise .9s ease both}
.hero > *:nth-child(2){animation-delay:.12s}
@keyframes quiet-rise{from{opacity:0; transform:translateY(12px)} to{opacity:1; transform:none}}
.bell-bob{animation:none}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{opacity:1; transform:none; transition:none}
  .hero > *{animation:none}
  .btn:hover{transform:none}
}