:root {
  color-scheme: dark;
  --ink: #f7ecd8;
  --muted: #cdbda4;
  --bg: #120f0d;
  --panel: #1c1713;
  --panel-2: #241d17;
  --line: #3c3026;
  --gold: #efb35e;
  --teal: #55dfd0;
  --red: #c66c5d;
}

html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 82% 0%, rgba(65, 196, 184, .10), transparent 28rem),
    radial-gradient(circle at 5% 10%, rgba(239, 179, 94, .08), transparent 24rem),
    var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
::selection { background: rgba(85, 223, 208, .28); color: white; }
.container { width: min(1180px, calc(100% - 2rem)); margin-inline: auto; }
.surface { background: linear-gradient(180deg, rgba(36,29,23,.96), rgba(26,21,17,.96)); border: 1px solid var(--line); box-shadow: 0 18px 50px rgba(0,0,0,.18); }
.kicker { color: var(--teal); text-transform: uppercase; letter-spacing: .14em; font-size: .76rem; font-weight: 800; }
.text-muted { color: var(--muted); }
.gold { color: var(--gold); }
.teal { color: var(--teal); }
.focus-ring:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
.prose-guide h2 { margin-top: 2.5rem; font-size: clamp(1.45rem, 2vw, 1.9rem); line-height: 1.2; }
.prose-guide h3 { margin-top: 1.8rem; font-size: 1.2rem; }
.prose-guide p, .prose-guide li { color: #dfd2bd; }
.prose-guide strong { color: #fff4df; }
.prose-guide a { color: var(--teal); text-decoration: underline; text-underline-offset: 3px; }
.prose-guide table { border-collapse: collapse; width: 100%; min-width: 640px; }
.prose-guide th, .prose-guide td { border-bottom: 1px solid var(--line); padding: .8rem .9rem; text-align: left; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

* { box-sizing: border-box; }
body { overflow-x: hidden; }
main { min-height: 72vh; }
h1,h2,h3 { font-family: Georgia, 'Times New Roman', serif; color: #fff5e4; letter-spacing: -.025em; }
h1 { font-size: clamp(2.35rem, 5vw, 5.4rem); line-height: .98; margin: .45rem 0 1.1rem; }
h2 { font-size: clamp(1.8rem, 3vw, 3rem); line-height: 1.08; }
h3 { line-height: 1.2; }
p { margin: .75rem 0 1rem; }
.lead { color: #e9dcc5; font-size: clamp(1.05rem, 1.6vw, 1.25rem); max-width: 70ch; }
.small { font-size: .88rem; }
.site-header { position: sticky; top: 0; z-index: 60; border-bottom: 1px solid rgba(239,179,94,.13); background: rgba(18,15,13,.86); backdrop-filter: blur(18px); }
.nav-wrap { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; }
.brand { display:flex; align-items:center; gap:.75rem; min-width:0; }
.brand img { border-radius: 14px; width:46px; height:46px; object-fit:contain; }
.brand span { display:flex; flex-direction:column; line-height:1.15; white-space:nowrap; }
.brand b { font-size:.92rem; }
.brand small { color:var(--muted); font-size:.7rem; margin-top:.3rem; }
nav { display:flex; align-items:center; gap:.25rem; font-size:.9rem; }
nav > a, .nav-drop > button { padding:.7rem .75rem; border-radius:.7rem; color:#decfb7; background:transparent; border:0; font:inherit; cursor:pointer; white-space:nowrap; }
nav > a:hover, .nav-drop > button:hover { background:#281f19; color:white; }
.nav-drop { position:relative; }
.nav-menu { display:none; position:absolute; top:100%; right:0; min-width:220px; padding:.55rem; border:1px solid var(--line); border-radius:1rem; background:#191410; box-shadow:0 18px 50px #0009; }
.nav-drop:hover .nav-menu, .nav-drop:focus-within .nav-menu { display:grid; }
.nav-menu a { padding:.68rem .8rem; border-radius:.65rem; color:#ddcfba; }
.nav-menu a:hover { background:#2a211a; color:white; }
.site-footer { margin-top:5rem; padding:2.5rem 0; border-top:1px solid var(--line); background:#0e0c0a; color:var(--muted); }
.footer-grid { display:flex; gap:2rem; justify-content:space-between; align-items:flex-start; }
.footer-grid p { max-width:580px; font-size:.88rem; }
.footer-links { display:flex; gap:1rem; white-space:nowrap; }
.home-hero { padding: clamp(2.4rem,5vw,5rem) 0 2rem; }
.home-hero-grid { display:grid; grid-template-columns: minmax(0,1.03fr) minmax(360px,.97fr); gap:clamp(1.5rem,4vw,4rem); align-items:center; }
.home-copy h1 { max-width: 860px; }
.hero-actions,.cta-row { display:flex; flex-wrap:wrap; gap:.7rem; margin:1.5rem 0; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:45px; padding:.68rem 1rem; border:1px solid #514032; border-radius:.78rem; background:#231c17; color:#f8e9d1; font-weight:750; }
.btn:hover { transform:translateY(-1px); border-color:#80654f; }
.btn.primary { border-color:#2fa99d; background:linear-gradient(180deg,#217e76,#17665f); color:white; box-shadow:0 8px 30px rgba(85,223,208,.12); }
.answer-box { margin:1.5rem 0 2rem; padding:1rem 1.1rem 1rem 1.2rem; border-left:3px solid var(--teal); border-radius:0 .9rem .9rem 0; background:linear-gradient(90deg,rgba(85,223,208,.10),rgba(85,223,208,.025)); }
.answer-label { display:block; color:var(--teal); font-size:.72rem; font-weight:900; text-transform:uppercase; letter-spacing:.13em; margin-bottom:.4rem; }
.answer-box p { margin:.35rem 0; color:#ece0ce; }
.media-figure { margin:1.25rem 0; overflow:hidden; border:1px solid #3a3028; border-radius:1.2rem; background:#16110e; box-shadow:0 20px 65px rgba(0,0,0,.22); }
.media-figure img { width:100%; height:auto; object-fit:cover; background:#0d0b09; }
.media-figure figcaption { display:flex; gap:.65rem; align-items:flex-start; padding:.7rem .9rem; color:#b9aa94; font-size:.76rem; }
.media-figure figcaption span { flex:0 0 auto; padding:.15rem .42rem; border-radius:.38rem; color:#0e1514; background:var(--teal); font-weight:850; text-transform:uppercase; letter-spacing:.05em; font-size:.62rem; }
.section { padding:3.2rem 0; }
.section-heading { max-width:720px; margin-bottom:1.4rem; }
.section-heading h2 { margin:.25rem 0 .6rem; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.feature-card { padding:1.3rem; border-radius:1.1rem; display:flex; flex-direction:column; min-height:185px; transition:.2s ease; }
.feature-card:hover { transform:translateY(-3px); border-color:#65513f; }
.feature-card b { color:var(--teal); font-size:.83rem; text-transform:uppercase; letter-spacing:.08em; }
.feature-card strong { margin:auto 0 .25rem; font-family:Georgia,serif; font-size:2.7rem; color:#fff0d5; }
.feature-card span { color:var(--muted); }
.split { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(1.5rem,5vw,5rem); align-items:center; }
.link-stack { display:grid; margin-top:1.4rem; border-top:1px solid var(--line); }
.link-stack a { padding:.75rem 0; border-bottom:1px solid var(--line); color:var(--teal); font-weight:700; }
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.image-card { overflow:hidden; border:1px solid var(--line); border-radius:1rem; background:#19140f; transition:.2s ease; }
.image-card:hover { transform:translateY(-3px); border-color:#654e39; }
.image-card img { aspect-ratio:16/10; width:100%; height:auto; object-fit:cover; }
.image-card div { padding:1rem; }
.image-card span { color:var(--teal); font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; font-weight:800; }
.image-card h3 { margin:.45rem 0 .15rem; font-size:1.2rem; }
.article-shell { max-width:960px; padding-top:clamp(2.5rem,6vw,5.5rem); }
.article-title { margin-bottom:2rem; }
.article-title h1 { font-size:clamp(2.35rem,5vw,4.7rem); max-width:940px; }
.article-body { max-width:900px; }
.guide-hero { padding-top:clamp(2.5rem,6vw,5.2rem); display:grid; grid-template-columns:1fr .82fr; gap:clamp(1.4rem,4vw,3.5rem); align-items:center; }
.guide-hero h1 { font-size:clamp(2.4rem,5vw,4.8rem); }
.guide-hero-copy p { color:#dfd0ba; font-size:1.08rem; }
.prose-guide > .article-body { padding-top:1.5rem; }
.prose-guide ul,.prose-guide ol { padding-left:1.35rem; }
.prose-guide li { margin:.45rem 0; }
.prose-guide hr { border:0; border-top:1px solid var(--line); margin:2rem 0; }
.evidence-badge { display:inline-flex; margin:.25rem .35rem .25rem 0; padding:.34rem .55rem; border-radius:999px; font-size:.69rem; font-weight:800; letter-spacing:.02em; border:1px solid; }
.evidence-verified { color:#8ff1d8; border-color:#246858; background:#11352e; }
.evidence-community { color:#f4c67e; border-color:#6e4d1f; background:#352611; }
.evidence-reported { color:#d8c1f6; border-color:#604580; background:#2e203e; }
.tool-panel,.result-panel { padding:1.2rem; border-radius:1rem; }
.filter-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:.8rem; }
label { display:grid; gap:.38rem; color:#d6c7b1; font-size:.82rem; font-weight:700; }
input,select { width:100%; min-height:44px; border:1px solid #4a3b2f; border-radius:.7rem; padding:.65rem .75rem; background:#0f0d0b; color:#fff1da; font:inherit; }
input:focus,select:focus { outline:2px solid rgba(85,223,208,.7); outline-offset:1px; border-color:transparent; }
.relic-table { width:100%; border-collapse:collapse; min-width:720px; }
.relic-table th,.relic-table td { padding:.78rem .72rem; border-bottom:1px solid #332920; text-align:left; font-size:.88rem; }
.relic-table th { position:sticky; top:72px; background:#1c1713; color:#bba98f; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; }
.relic-table tr:hover td { background:#211a15; }
.perfect-cell { color:#80eadb; font-weight:850; }
.rarity { display:inline-flex; padding:.18rem .45rem; border:1px solid #4a3d31; border-radius:999px; font-size:.7rem; }
.rarity-legendary { color:#ffd27d; border-color:#7d5e23; }.rarity-epic{color:#e1b1ff;border-color:#76508d}.rarity-rare{color:#8ccaff;border-color:#3d678a}.rarity-uncommon{color:#91df9b;border-color:#3f7547}
.source-note { margin:1.5rem 0; padding:1rem; border:1px dashed #695a48; border-radius:.9rem; color:#d1c1aa; }
.calculator-grid { display:grid; grid-template-columns:1fr .9fr; gap:1rem; margin:1.5rem 0; }
.result-panel { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; align-content:start; }
.result-panel .kicker,.result-panel hr,.result-panel .price-result:last-child { grid-column:1/-1; }
.result-panel hr { width:100%; border:0; border-top:1px solid var(--line); }
.price-result { padding:.8rem; border:1px solid #3e3227; border-radius:.8rem; background:#17120f; }
.price-result small { display:block; color:#a99a84; }
.price-result strong { display:block; font-size:1.8rem; margin-top:.2rem; color:#f8e7ca; }
.price-result.featured { border-color:#27877d; background:#102824; }.price-result.featured strong{color:#79eadb}
.page-simple { max-width:800px; padding-top:4rem; }
.page-simple h1 { font-size:clamp(2.3rem,5vw,4.2rem); }
.notice { padding:1rem; border-radius:.8rem; background:#201910; border:1px solid #4d3b29; color:#dfcfb8; }
@media (max-width: 900px) {
  .home-hero-grid,.guide-hero,.split,.calculator-grid { grid-template-columns:1fr; }
  .home-hero-grid .media-figure { order:-1; }
  .feature-grid,.card-grid { grid-template-columns:1fr 1fr; }
  .filter-grid { grid-template-columns:1fr; }
  .brand small { display:none; }
  nav { overflow-x:auto; max-width:58vw; }
}
@media (max-width: 640px) {
  .container { width:min(100% - 1.1rem,1180px); }
  .nav-wrap { align-items:flex-start; padding:.55rem 0; flex-direction:column; min-height:auto; }
  nav { width:100%; max-width:none; padding-bottom:.2rem; }
  nav > a,.nav-drop>button { padding:.5rem .55rem; }
  .feature-grid,.card-grid { grid-template-columns:1fr; }
  .footer-grid { flex-direction:column; }
  .footer-links { flex-wrap:wrap; }
  .result-panel { grid-template-columns:1fr; }.result-panel .kicker,.result-panel hr,.result-panel .price-result:last-child{grid-column:1}
  h1 { line-height:1.03; }
}
