:root{
  --bg-page:#faf8f3;--bg-card:#ffffff;--bg-card-hover:#f5f3ee;--bg-dark:#1a1a2e;
  --text-main:#1a1a2e;--text-muted:#6b6b80;--text-heading:#0e0e1a;
  --ink:#1a1a2e;--ink-secondary:#4a4a5a;--ink-tertiary:#7a7a8a;--ink-inverse:#faf8f3;
  --gold:#c9a84c;--gold-hover:#e0c068;
  --accent:#6366f1;--accent-hover:#818cf8;
  --radius-md:12px;--radius-lg:18px;
  --shadow-md:0 4px 20px rgba(0,0,0,.08);--shadow-lg:0 8px 40px rgba(0,0,0,.12);
  --border-light:rgba(0,0,0,.06);--border-medium:rgba(0,0,0,.1);
  --font-display:'Playfair Display',Georgia,serif;
  --font-body:'DM Sans','Helvetica Neue',sans-serif;
  --font-ui:'DM Sans','Helvetica Neue',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'Cascadia Code','Fira Code',monospace;
}
.skip-to-content{position:absolute;top:-50px;left:0;background:var(--gold);color:#1a1a2e;padding:.6rem 1.2rem;z-index:10000;font-weight:700;text-decoration:none;border-radius:0 0 8px 0;transition:top .15s}
.skip-to-content:focus{top:0}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--font-body);background:var(--bg-page);color:var(--text-main);line-height:1.7;min-height:100vh}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(ellipse 80% 50% at 50% 20%,rgba(201,168,76,.03),transparent 70%)}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.4;
  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)' opacity='0.025'/%3E%3C/svg%3E");
  background-repeat:repeat;background-size:256px}
@media(max-width:768px){body::after{display:none}}
a{color:var(--gold);text-decoration:none;transition:color .2s}
a:hover{color:var(--gold-hover)}

/* NAV — loaded from /shared-nav.css */
[data-theme="dark"]{
  --bg-page:#141425;--bg-card:#1e1e38;--bg-card-hover:#252547;--bg-dark:#1a1a2e;
  --text-main:#e8e8f0;--text-muted:#9898b0;--text-heading:#f8f8ff;
  --ink:#e8e6e1;--ink-secondary:#b0aec0;--ink-tertiary:#8886a0;
  --shadow-md:0 4px 20px rgba(0,0,0,.3);--shadow-lg:0 8px 40px rgba(0,0,0,.4);
  --border-light:rgba(255,255,255,.08);--border-medium:rgba(255,255,255,.12);
}
/* footer dark: in /shared-footer.css */

/* BREADCRUMB */
.breadcrumb{padding:1rem 0;font-size:.85rem;color:var(--text-muted)}
.breadcrumb a{color:var(--text-muted)}
.breadcrumb a:hover{color:var(--gold)}
.breadcrumb .sep{margin:0 .5rem;opacity:.5}

/* ARTICLE */
.article-container{max-width:780px;margin:0 auto;padding:2rem 1.5rem}
.article-header{text-align:center;padding:2rem 0 2.5rem;border-bottom:1px solid rgba(201,168,76,.15);margin-bottom:2.5rem}
.article-emoji{font-size:3rem;margin-bottom:1rem}
.article-tag{display:inline-block;font-family:'Courier New',monospace;font-size:.7rem;color:var(--gold);
  text-transform:uppercase;letter-spacing:.15em;padding:.3rem .8rem;border:1px solid rgba(201,168,76,.3);
  border-radius:20px;margin-bottom:1rem}
.article-title{font-family:Georgia,serif;font-size:2.2rem;color:var(--text-heading);line-height:1.3;margin-bottom:.8rem;
  text-shadow:0 0 80px rgba(201,168,76,.08)}
.article-meta{display:flex;justify-content:center;gap:1.5rem;font-size:.8rem;color:var(--text-muted);font-family:'Courier New',monospace}
.article-desc{font-size:1.1rem;color:var(--text-muted);font-style:italic;margin-top:1rem;line-height:1.6}

/* ARTICLE CONTENT */
.article-content{font-size:1.05rem;line-height:1.85;color:var(--text-main)}
.article-content h2{font-family:Georgia,serif;font-size:1.5rem;color:var(--gold);margin:2.5rem 0 1rem;
  padding-bottom:.5rem;border-bottom:1px solid rgba(201,168,76,.15)}
.article-content h3{font-family:Georgia,serif;font-size:1.15rem;color:var(--text-heading);margin:1.8rem 0 .8rem}
.article-content p{margin-bottom:1.2rem}
.article-content ul,.article-content ol{margin:1rem 0 1.5rem 1.5rem}
.article-content li{margin-bottom:.5rem;line-height:1.7}
.article-content strong{color:var(--text-heading)}
.article-content blockquote{border-left:3px solid var(--gold);padding:.8rem 1.2rem;margin:1.5rem 0;
  background:rgba(201,168,76,.05);border-radius:0 var(--radius-md) var(--radius-md) 0;font-style:italic}
.article-content table{width:100%;border-collapse:collapse;margin:1.5rem 0}
.article-content th,.article-content td{padding:.6rem .8rem;text-align:left;border-bottom:1px solid var(--border-light)}
.article-content th{color:var(--text-muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}

/* CTA */
.article-cta{background:linear-gradient(135deg,rgba(201,168,76,.1),rgba(99,102,241,.1));
  border:1px solid rgba(201,168,76,.25);border-radius:var(--radius-lg);padding:2rem;margin:3rem 0;text-align:center}
.article-cta h3{font-family:Georgia,serif;color:var(--text-heading);font-size:1.2rem;margin-bottom:.5rem}
.article-cta p{color:var(--text-muted);font-size:.9rem;margin-bottom:1rem}
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.5rem;background:var(--gold);
  color:#0e0e1a;font-weight:700;border-radius:8px;font-size:.95rem;transition:all .2s}
.btn-primary:hover{background:var(--gold-hover);color:#0e0e1a;transform:translateY(-1px)}

/* RELATED ARTICLES */
.related-section{margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(201,168,76,.15)}
.related-title{font-family:Georgia,serif;font-size:1.3rem;color:var(--gold);margin-bottom:1.5rem}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.related-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-md);
  padding:1rem;transition:all .3s;display:block;color:var(--text-main);text-decoration:none}
.related-card:hover{background:var(--bg-card-hover);border-color:rgba(201,168,76,.3);transform:translateY(-2px)}
.related-card .rc-emoji{font-size:1.5rem;margin-bottom:.4rem}
.related-card .rc-tag{font-family:'Courier New',monospace;font-size:.6rem;color:var(--gold);text-transform:uppercase;letter-spacing:.1em}
.related-card .rc-title{font-weight:700;font-size:.9rem;color:var(--text-heading);margin-top:.3rem;line-height:1.3}

/* FOOTER — loaded from /shared-footer.css */

@media(max-width:768px){
  .article-container{padding:1.5rem 1rem}
  .article-title{font-size:1.6rem}
  .article-content{font-size:.95rem}
  .related-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  .related-grid{grid-template-columns:1fr}
}

/* Focus-visible — keyboard navigation indicator */
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
:focus:not(:focus-visible){outline:none}

/* Reduced motion — vestibular disorder safety */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:0.01ms!important;animation-iteration-count:1!important;
    transition-duration:0.01ms!important;scroll-behavior:auto!important}
  html{scroll-behavior:auto}
}