:root {
  --ink-950: #07110f;
  --ink-900: #0b1714;
  --ink-850: #10201c;
  --ink-800: #162923;
  --moss-500: #789b69;
  --moss-300: #b7c9a4;
  --paper-100: #f4eddb;
  --paper-200: #e7dcc2;
  --paper-300: #d5c5a4;
  --egg-500: #f3b849;
  --egg-400: #ffcb68;
  --coral-500: #de765c;
  --text-on-dark: #f5f0e4;
  --text-muted: #aebdb3;
  --text-on-paper: #1e2c27;
  --line-dark: rgba(231,220,194,.16);
  --line-paper: rgba(30,44,39,.18);
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-tool: 0 24px 70px rgba(0,0,0,.34);
  --content: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x:hidden; color: var(--text-on-dark); background: var(--ink-950); font-family: "Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif; line-height: 1.6; }
button, input { font: inherit; }
a { color: inherit; }
.shell { width: min(calc(100% - 40px), var(--content)); margin-inline: auto; }
.narrow { max-width: 820px; }
.hero > *, .calculator-grid > *, .section-title-row > *, .trust-section > * { min-width: 0; }

.site-header { width: min(calc(100% - 40px), var(--content)); min-height: 76px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line-dark); }
.brand { display: flex; gap: 11px; align-items: center; text-decoration: none; font-size: 15px; letter-spacing: .01em; }
.brand strong { color: var(--egg-400); font-weight: 650; }
.brand-mark { width: 34px; height: 34px; position: relative; display: block; }
.brand-mark i, .brand-mark b, .brand-mark em { position: absolute; display: block; }
.brand-mark i { width: 13px; height: 17px; border: 2px solid var(--egg-400); border-radius: 55% 55% 48% 48%; left: 10px; top: 8px; }
.brand-mark b, .brand-mark em { width: 7px; height: 7px; border: 1px solid var(--moss-300); border-radius: 50%; top: 4px; }
.brand-mark b { left: 1px; }.brand-mark em { right: 1px; }
.brand-mark:before, .brand-mark:after { content:""; position:absolute; height:1px; width:10px; top:10px; background:var(--moss-300); transform-origin:center; }
.brand-mark:before { left:5px; transform:rotate(22deg); }.brand-mark:after { right:5px; transform:rotate(-22deg); }
.site-header nav { display: flex; align-items: center; gap: 28px; font-size: 13px; color: var(--text-muted); }
.site-header nav a { text-decoration: none; padding: 26px 0 23px; border-bottom: 2px solid transparent; }
.site-header nav a:hover, .site-header nav a.is-active { color: var(--text-on-dark); border-color: var(--egg-500); }

.hero { padding: 80px 0 56px; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr); gap: 72px; align-items: center; }
.eyebrow, .section-kicker { margin: 0 0 14px; color: var(--moss-300); font: 700 11px/1.4 "SFMono-Regular", "Cascadia Code", monospace; text-transform: uppercase; letter-spacing: .13em; }
.eyebrow span { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--egg-500); box-shadow: 0 0 0 4px rgba(243,184,73,.13); }
h1, h2, h3 { font-family: Georgia, "Iowan Old Style", "Palatino Linotype", serif; font-weight: 500; line-height: 1.08; }
h1, h2, h3, p, dd { overflow-wrap:anywhere; }
h1 { margin: 0; max-width: 760px; font-size: clamp(42px, 6vw, 72px); letter-spacing: -.035em; }
.lede { max-width: 700px; margin: 24px 0 30px; color: #c8d1ca; font-size: 18px; line-height: 1.7; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.button { min-height: 48px; padding: 12px 18px; border: 1px solid transparent; border-radius: var(--radius-sm); display: inline-flex; justify-content: center; align-items: center; color: var(--text-on-paper); font-weight: 750; text-decoration: none; cursor: pointer; }
.button.primary { background: var(--egg-500); box-shadow: 0 5px 0 #a56c18; }
.button.primary:hover { background: var(--egg-400); transform: translateY(-1px); }
.button.secondary { color: var(--text-on-dark); border-color: var(--line-dark); background: transparent; }
.button.full { width: 100%; margin-top: 8px; }
.version-card { padding: 22px; border: 1px solid var(--line-dark); border-radius: 6px 24px 6px 6px; background: linear-gradient(145deg, rgba(22,41,35,.9), rgba(11,23,20,.98)); box-shadow: var(--shadow-tool); }
.version-top { padding-bottom: 14px; display: flex; justify-content: space-between; color: var(--text-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; border-bottom: 1px solid var(--line-dark); }
.status { color: var(--egg-400); }.status i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: currentColor; }
.version-card dl { margin: 12px 0; }.version-card dl div { padding: 7px 0; display:flex; justify-content:space-between; gap:20px; }
.version-card dt { color: var(--text-muted); font-size: 13px; }.version-card dd { min-width:0; margin:0; font:600 12px/1.6 "SFMono-Regular",monospace; text-align:right; overflow-wrap:anywhere; }
.version-card p { margin: 14px 0 0; color: var(--text-muted); font-size: 12px; border-top: 1px solid var(--line-dark); padding-top: 14px; }

.workbench { margin-bottom: 92px; border: 1px solid var(--line-dark); background: var(--ink-900); box-shadow: var(--shadow-tool); }
.workbench-head { padding: 26px 30px; display: flex; align-items: end; justify-content: space-between; gap: 30px; border-bottom: 1px solid var(--line-dark); }
.workbench h2 { margin: 0; font-size: 33px; }.workbench-head > p { max-width: 410px; margin:0; color:var(--text-muted); font-size:13px; }
.section-kicker { margin-bottom: 8px; }.section-kicker.dark { color: #536f5d; }
.mode-tabs { padding: 0 30px; display:flex; gap:5px; overflow:auto; border-bottom:1px solid var(--line-dark); }
.mode-tabs button { padding: 16px 15px 13px; color: var(--text-muted); background: none; border: 0; border-bottom: 3px solid transparent; white-space: nowrap; cursor: pointer; }
.mode-tabs button.active { color: var(--text-on-dark); border-color: var(--egg-500); }.mode-tabs span { color: var(--egg-500); }
.calculator-grid { padding: 30px; display:grid; grid-template-columns: minmax(280px,.78fr) minmax(360px,1.22fr); gap:30px; }
.inputs-panel { padding: 24px; background: var(--ink-850); border-left: 3px solid var(--moss-500); }
.inputs-panel label { display:block; margin-bottom:8px; color:var(--moss-300); font-size:12px; font-weight:750; text-transform:uppercase; letter-spacing:.08em; }
.select-control { width:100%; min-width:0; min-height:65px; padding:11px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--text-muted); text-align:left; background:var(--ink-950); border:1px solid var(--line-dark); border-radius:var(--radius-sm); cursor:pointer; }
.select-control span { min-width:0; overflow-wrap:anywhere; }
.select-control small { display:block; color:var(--text-on-dark); font-size:15px; font-weight:700; }.select-control b { color:var(--egg-500); font-size:20px; }
.connector { height:40px; display:flex; align-items:center; justify-content:center; }.connector span { width:calc(50% - 22px); height:1px; background:var(--line-dark); }.connector b { width:28px; height:28px; display:grid; place-items:center; color:var(--egg-400); border:1px solid var(--line-dark); border-radius:50%; }
.result-panel { min-height:360px; padding:36px; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; border:1px dashed rgba(243,184,73,.34); background:radial-gradient(circle at 50% 40%, rgba(243,184,73,.08), transparent 35%); }
.empty-egg { width:92px; height:108px; margin-bottom:20px; display:grid; place-items:center; border:2px solid rgba(243,184,73,.62); border-radius:55% 55% 48% 48%; transform:rotate(4deg); }
.empty-egg span { width:34px; height:34px; border:1px solid var(--moss-500); border-radius:50%; box-shadow:18px -16px 0 -10px var(--coral-500), -18px 18px 0 -11px var(--moss-500); }
.result-label { margin:0; color:var(--moss-300); font-size:11px; text-transform:uppercase; letter-spacing:.12em; }.result-panel h3 { margin:8px 0; font-size:28px; }.result-panel > p:not(.result-label) { max-width:480px; margin:0; color:var(--text-muted); font-size:14px; }
.result-meta { width:100%; margin-top:25px; padding-top:16px; display:grid; grid-template-columns:1fr 1fr; gap:10px; border-top:1px solid var(--line-dark); }.result-meta span { color:var(--text-muted); font-size:12px; }.result-meta b { display:block; color:var(--text-on-dark); font-family:monospace; }

.paper-section { padding: 88px 0; color: var(--text-on-paper); background: var(--paper-100); }
.section-title-row { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:end; }.section-title-row h2, .trust-copy h2, .faq h2 { margin:0; font-size:clamp(32px,4vw,48px); letter-spacing:-.025em; }.section-title-row > p { max-width:460px; margin:0; color:#52625b; }
.method-grid { margin-top:54px; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-paper); }
.method-grid article { min-height:235px; padding:25px 30px 10px 0; position:relative; border-right:1px solid var(--line-paper); }.method-grid article + article { padding-left:30px; }.method-grid article:last-child { border-right:0; }
.method-grid span { font:700 12px/1 monospace; color:#708573; }.method-grid h3 { margin:42px 0 12px; font-size:25px; }.method-grid p { color:#52625b; }

.trust-section { padding:96px 0; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }.trust-copy h2 { max-width:540px; }.trust-copy > p:not(.section-kicker) { max-width:570px; color:var(--text-muted); }.text-link { display:inline-block; margin-top:10px; color:var(--egg-400); text-decoration:none; font-weight:700; }.text-link span { margin-left:8px; }
.data-ledger { padding:18px 26px; border-top:2px solid var(--egg-500); background:var(--ink-850); }.data-ledger div { padding:15px 0; display:flex; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line-dark); }.data-ledger div:last-child { border-bottom:0; }.data-ledger span { color:var(--text-muted); }.data-ledger b { color:var(--moss-300); font:600 13px/1.6 monospace; }

.popular { padding:0 0 96px; }.section-title-row.inverse p { color:var(--text-muted); }.placeholder-list { margin-top:35px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.placeholder-list span { padding:20px; color:var(--text-muted); border:1px solid var(--line-dark); background:var(--ink-900); }
.faq h2 { margin-bottom:30px; }.faq details { border-top:1px solid var(--line-paper); }.faq details:last-child { border-bottom:1px solid var(--line-paper); }.faq summary { padding:20px 40px 20px 0; position:relative; cursor:pointer; font:600 19px/1.4 Georgia,serif; list-style:none; }.faq summary:after { content:"+"; position:absolute; right:5px; color:#708573; }.faq details[open] summary:after { content:"−"; }.faq details p { max-width:700px; margin:0 0 22px; color:#52625b; }
footer { padding:38px 0; background:#040b09; border-top:1px solid var(--line-dark); }.footer-grid { display:flex; justify-content:space-between; gap:30px; color:var(--text-muted); font-size:12px; }.footer-grid p { margin:0; }.footer-grid strong { color:var(--text-on-dark); }.footer-grid nav { display:flex; flex-wrap:wrap; gap:18px; }.footer-grid a { text-decoration:none; }

button:focus-visible, a:focus-visible, summary:focus-visible { outline:3px solid var(--egg-400); outline-offset:3px; }
@media (prefers-reduced-motion: no-preference) { .button, a { transition: color .18s ease, background .18s ease, transform .18s ease; } }

@media (max-width: 820px) {
  .site-header { min-height:68px; }.site-header nav { display:none; }
  .hero { max-width:calc(100% - 40px); padding:56px 0 40px; grid-template-columns:minmax(0,1fr); gap:34px; overflow:hidden; }
  .hero-copy, .version-card, .workbench-head, .calculator-grid, .inputs-panel, .result-panel { width:100%; max-width:100%; min-width:0; }
  .version-card { overflow:hidden; }
  .version-top { gap:12px; flex-wrap:wrap; }
  .version-card dl div { align-items:flex-start; }
  .workbench-head, .section-title-row { display:block; }.workbench-head > p, .section-title-row > p { margin-top:14px; }
  .calculator-grid { grid-template-columns:1fr; }
  .method-grid { grid-template-columns:1fr; }.method-grid article, .method-grid article + article { min-height:0; padding:24px 0; border-right:0; border-bottom:1px solid var(--line-paper); }.method-grid h3 { margin:18px 0 8px; }
  .trust-section { grid-template-columns:1fr; gap:38px; }
  .placeholder-list { grid-template-columns:1fr 1fr; }
}

@media (max-width: 520px) {
  .shell, .site-header { width:min(calc(100% - 24px), var(--content)); }
  .brand { font-size:13px; }.hero { padding-top:42px; }.lede { font-size:16px; }.hero-actions { display:grid; }.button { width:100%; }
  .hero { max-width:calc(100% - 24px); }
  .workbench { width:100%; max-width:100%; overflow:hidden; border-left:0; border-right:0; }.workbench-head, .calculator-grid { padding:22px 16px; }.mode-tabs { width:100%; max-width:100%; padding:0 12px; overflow-x:auto; }.inputs-panel { padding:18px 14px; }.result-panel { min-width:0; min-height:320px; padding:26px 18px; }
  .paper-section { padding:64px 0; }.trust-section { padding:72px 0; }.placeholder-list { grid-template-columns:1fr; }
  .footer-grid { display:block; }.footer-grid nav { margin-top:18px; }
}

.fixture-banner { padding: 9px 16px; color: #2d2110; background: var(--egg-400); text-align: center; font: 700 12px/1.4 "SFMono-Regular", monospace; }
.page-hero { padding: 70px 0 46px; }
.page-hero h1 { max-width: 900px; font-size: clamp(42px, 6vw, 68px); }
.page-hero .lede { max-width: 760px; }
.breadcrumb { margin-bottom: 18px; color: var(--moss-300); font-size: 13px; }
.breadcrumb a { color: inherit; text-decoration: none; }
.content-page { min-height: 54vh; padding: 70px 0 90px; color: var(--text-on-paper); background: var(--paper-100); }
.prose { max-width: 820px; }
.prose h2 { margin: 48px 0 14px; font-size: 34px; }
.prose h3 { margin: 30px 0 10px; font-size: 23px; }
.prose p, .prose li { color: #465950; }
.prose a { color: #3e674f; font-weight: 700; }
.prose code { padding: 2px 5px; background: var(--paper-200); border-radius: 3px; }
.mode-tabs a { padding: 16px 15px 13px; color: var(--text-muted); text-decoration: none; white-space: nowrap; border-bottom: 3px solid transparent; }
.mode-tabs a.active { color: var(--text-on-dark); border-color: var(--egg-500); }
.select-native { width: 100%; min-height: 62px; padding: 10px 42px 10px 14px; color: var(--text-on-dark); background: var(--ink-950); border: 1px solid var(--line-dark); border-radius: var(--radius-sm); }
.select-native option { color: #111; background: #fff; }
.pal-search { padding-right: 14px; }
.pal-search::placeholder { color: #83938b; opacity: 1; }
.field-divider { height: 1px; margin: 24px 0; background: var(--line-dark); }
.result-panel.result-ready { align-items: stretch; text-align: left; }
.result-panel.result-ready .result-label, .result-panel.result-ready h3 { text-align: center; }
.result-panel.result-ready > p { margin-inline: auto; text-align: center; }
.result-title { color: var(--egg-400); }
.pair-list { width: 100%; margin-top: 20px; display: grid; gap: 8px; }
.pair-row { padding: 12px 14px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; color: var(--text-on-dark); border: 1px solid var(--line-dark); background: var(--ink-850); }
.pair-row span:nth-child(2) { color: var(--egg-500); }
.pair-row span:last-child { text-align: right; }
.notice { margin: 20px 0; padding: 15px 18px; color: #66450d; border-left: 4px solid var(--egg-500); background: #fff3ce; }
.error-notice { color: #7b2c20; border-color: var(--danger); background: #ffe2dc; }
.dataset-strip { padding: 10px 0; color: var(--text-muted); font: 12px/1.5 "SFMono-Regular", monospace; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }
.dataset-strip .shell { display: flex; gap: 20px; justify-content: space-between; flex-wrap: wrap; }
.directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.directory-card { padding: 20px; color: var(--text-on-paper); text-decoration: none; border: 1px solid var(--line-paper); background: var(--paper-100); }
.directory-card small { display: block; color: #65776e; }
.directory-card strong { font: 500 23px/1.3 Georgia, serif; }
.owned-list { padding: 18px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; background: var(--ink-850); }
.owned-list label { display: flex; gap: 8px; align-items: center; color: var(--text-muted); font-size: 14px; }
.owned-list input { accent-color: var(--egg-500); }
.constraint-list { margin: 18px 0; padding: 16px 18px; display: grid; gap: 10px; color: var(--text-muted); border: 1px solid var(--line-dark); }
.constraint-list legend { padding: 0 7px; color: var(--text-on-dark); font-weight: 700; }
.constraint-list label { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.constraint-list input { accent-color: var(--egg-500); }
.hidden { display: none !important; }
.footer-grid nav a:hover { color: var(--egg-400); }
@media (max-width: 700px) {
  .directory-grid, .chain-controls, .owned-list { grid-template-columns: 1fr; }
  .pair-row { grid-template-columns: 1fr; text-align: left; }
  .pair-row span:last-child { text-align: left; }
}
