:root {
  --ink: #19312d;
  --muted: #687874;
  --paper: #f7f4ed;
  --white: #fffdf8;
  --line: #d9ddd3;
  --sage: #dbe5d8;
  --moss: #587361;
  --coral: #e87d63;
  --gold: #d8ac5b;
  --blue: #6e95a3;
  --node-seed: #cc79a7;
  --node-intervention: #e69f00;
  --node-review: #0072b2;
  --node-related: #009e73;
  --node-document: #6c757d;
  --node-citation: #d55e00;
  --shadow: 0 20px 50px rgba(31, 53, 47, .1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "DM Sans", sans-serif; }
button, input { font: inherit; }
button { color: inherit; }
button:disabled { cursor: not-allowed; opacity: .45; }
.server-notice { position: sticky; top: 74px; z-index: 18; display:flex; justify-content:center; gap:12px; padding:11px 18px; background:#fff0dc; border-bottom:1px solid #e4c9a5; color:#684b2e; font-size:12px; }
.server-notice span { color:#80664d; }
.server-notice code { background:rgba(255,255,255,.6); padding:2px 4px; border-radius:3px; }
.topbar { height: 74px; padding: 0 clamp(20px, 5vw, 72px); border-bottom: 1px solid rgba(25,49,45,.12); display: flex; align-items: center; gap: 18px; background: rgba(247,244,237,.9); backdrop-filter: blur(12px); position: sticky; top: 0; z-index: 20; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); text-decoration: none; font-weight: 700; letter-spacing: -.03em; font-size: 20px; }
.brand-mark { width: 28px; height: 28px; position: relative; display: inline-block; }
.brand-mark i { width: 7px; height: 7px; position: absolute; border-radius: 50%; background: var(--coral); }
.brand-mark i:nth-child(1) { left: 2px; top: 10px; }.brand-mark i:nth-child(2) { left: 12px; top: 2px; background: var(--gold); }.brand-mark i:nth-child(3) { right: 0; top: 13px; background: var(--moss); }.brand-mark i:nth-child(4) { left: 10px; bottom: 0; background: var(--blue); }
.brand-mark::before { content:""; position:absolute; inset:5px; border: 1px solid var(--moss); transform:rotate(28deg); }
.scope-label { margin-left: auto; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.icon-button { border: 1px solid var(--line); background: transparent; border-radius: 50%; width: 34px; height: 34px; cursor: pointer; font-family: "DM Serif Display"; }
.hero { min-height: 555px; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 74px 20px 80px; text-align: center; background: radial-gradient(circle at 20% 20%, rgba(216,172,91,.12), transparent 22%), radial-gradient(circle at 80% 70%, rgba(88,115,97,.14), transparent 25%); }
.eyebrow { margin: 0 0 16px; text-transform: uppercase; letter-spacing: .16em; font-size: 11px; font-weight: 700; color: var(--coral); }
h1, h2 { font-family: "DM Serif Display", serif; font-weight: 400; letter-spacing: -.035em; }
h1 { margin: 0; font-size: clamp(48px, 7vw, 84px); line-height: .98; }
h1 em { color: var(--moss); font-weight: 400; }
.hero-copy { max-width: 600px; color: var(--muted); font-size: 17px; line-height: 1.7; margin: 26px auto 30px; }
.search { width: min(760px, 100%); height: 66px; border-radius: 12px; background: var(--white); box-shadow: var(--shadow); border: 1px solid rgba(25,49,45,.08); display: flex; align-items: center; padding: 7px 7px 7px 21px; position: relative; z-index: 8; }
.search svg { width: 22px; fill: none; stroke: var(--moss); stroke-width: 1.8; }
.search-input-wrap { flex: 1; min-width: 0; position: relative; height: 100%; display: flex; align-items: center; }
.search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; padding: 0 15px; color: var(--ink); font-size: 15px; }
.search button, .primary-button { border: 0; background: var(--ink); color: white; height: 50px; border-radius: 8px; padding: 0 22px; cursor: pointer; font-weight: 600; }
.search button span { margin-left: 10px; }
.search-suggestions { position: absolute; top: calc(100% + 12px); left: -21px; right: -7px; padding: 8px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: 0 18px 38px rgba(31,53,47,.15); text-align: left; }
.search-suggestions[hidden] { display: none; }
.search .search-suggestion { width: 100%; height: auto; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 8px; border: 0; border-radius: 8px; background: transparent; padding: 10px 11px; color: var(--ink); cursor: pointer; text-align: left; font-size: 13px; font-weight: 500; }
.search .search-suggestion:hover, .search .search-suggestion.active { background: var(--sage); color: var(--ink); }
.search-suggestion-icon { color: var(--moss); font-size: 14px; text-align: center; }
.search-suggestion-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.search-suggestion-meta { color: var(--muted); font-size: 10px; white-space: nowrap; }
.search-suggestions::before { content: "Academic suggestions"; display: block; padding: 4px 11px 7px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.suggestions { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 18px; font-size: 12px; color: var(--muted); }
.suggestions button { border: 1px solid var(--moss); border-radius: 20px; padding: 7px 12px; background: rgba(255,253,248,.72); color: var(--ink); cursor: pointer; transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease; }
.suggestions button:hover, .suggestions button:focus-visible { background: var(--sage); border-color: var(--moss); box-shadow: 0 4px 12px rgba(25,49,45,.12); transform: translateY(-1px); outline: none; }
.suggestions .random-search { border-color: var(--coral); background: var(--coral); color: #fffdf8; font-weight: 600; box-shadow: 0 4px 12px rgba(232,125,99,.2); }
.suggestions .random-search:hover, .suggestions .random-search:focus-visible { background: #d96750; border-color: #d96750; }
.scope-switch { display:flex;align-items:center;justify-content:center;gap:5px;margin-top:12px;padding:4px;background:rgba(219,229,216,.55);border-radius:22px;font-size:11px }
.scope-switch>span { padding:0 8px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:9px }
.scope-switch button { border:0;background:transparent;border-radius:17px;padding:7px 11px;cursor:pointer;color:var(--muted) }
.scope-switch button.active { background:var(--white);color:var(--ink);box-shadow:0 2px 8px rgba(25,49,45,.08) }
.search-hint { margin: 12px auto 0; max-width: 760px; color: var(--muted); font-size: 12px; text-align: center; }
.workspace { background: var(--white); padding: 64px clamp(18px, 4vw, 64px) 90px; }
.workspace-head { max-width: 1500px; margin: auto; display: flex; justify-content: space-between; align-items: end; }
.workspace h2, .how-it-works h2 { margin: 0; font-size: clamp(34px, 4vw, 52px); overflow-wrap: anywhere; }
.view-toggle { background: var(--paper); border-radius: 9px; padding: 4px; display: flex; }
.view-toggle button { border: 0; padding: 10px 15px; border-radius: 7px; background: transparent; cursor: pointer; color: var(--muted); }
.view-toggle button.active { background: var(--white); color: var(--ink); box-shadow: 0 2px 10px rgba(25,49,45,.08); }
.filter-row { max-width: 1500px; margin: 30px auto 18px; display: flex; align-items: center; gap: 8px; overflow: auto; padding-bottom: 2px; }
.filter { white-space: nowrap; padding: 9px 13px; border: 1px solid var(--line); background: transparent; border-radius: 20px; cursor: pointer; font-size: 12px; }
.filter b { font-weight: 500; margin-left: 4px; color: var(--muted); }
.filter.active { background: var(--ink); color: white; border-color: var(--ink); }
.filter.active b { color: #c8d2cf; }
.api-status { margin-left: auto; white-space: nowrap; font-size: 11px; color: var(--muted); }
.api-status i { display: inline-block; width: 6px; height: 6px; background: var(--gold); border-radius: 50%; margin-right: 5px; }
.api-status.live i { background: #6ea275; }
.content-grid { max-width: 1700px; margin: auto; display: grid; grid-template-columns: 300px minmax(0, 1fr) 340px; grid-template-areas:"list graph detail"; height: 720px; border: 1px solid #cfd4d2; border-radius: 10px; overflow: hidden; background:#e7e9e8; }
.content-grid.detail-closed { height: 520px; }
.graph-panel { grid-area:graph; position: relative; min-height: 650px; background:#e8e9e8; overflow: hidden; }
.content-grid.detail-closed .graph-panel { min-height: 0; }
#graphCanvas { position: absolute; inset: 0; width: 100%; height: 100%; cursor: grab; touch-action: none; }
#graphCanvas:active { cursor: grabbing; }
.graph-tooltip { position:absolute; z-index:4; max-width:min(320px,70%); padding:8px 10px; border:1px solid rgba(25,49,45,.16); border-radius:6px; background:rgba(247,247,245,.96); color:var(--ink); box-shadow:0 4px 14px rgba(25,49,45,.12); font-size:11px; line-height:1.35; pointer-events:none; transform:translate(-50%,-100%); }
.graph-help { position: absolute; top: 17px; left: 18px; font-size: 11px; color: #52615f; background: rgba(245,247,246,.82); padding: 7px 10px; border-radius: 6px; backdrop-filter: blur(6px); }
.graph-controls { position: absolute; top: 16px; right: 16px; display: flex; flex-direction: column; box-shadow: 0 4px 16px rgba(25,49,45,.09); }
.graph-controls button { width: 34px; height: 32px; border: 1px solid var(--line); border-bottom: 0; background: var(--white); cursor: pointer; }
.graph-controls button:first-child { border-radius: 7px 7px 0 0; }.graph-controls button:last-child { border-bottom: 1px solid var(--line); border-radius: 0 0 7px 7px; }
.rank-controls { position:absolute; z-index:3; top:16px; right:60px; display:flex; align-items:center; gap:4px; padding:5px; border:1px solid var(--line); border-radius:7px; background:rgba(255,253,248,.92); box-shadow:0 4px 16px rgba(25,49,45,.08); font-size:10px; }
.rank-controls span { padding:0 4px; color:var(--muted); white-space:nowrap; }
.rank-controls button { border:1px solid transparent; border-radius:4px; padding:5px 7px; background:transparent; color:var(--ink); font:600 10px "DM Sans", sans-serif; cursor:pointer; }
.rank-controls button:hover { background:#e8eeec; }.rank-controls button.active { background:var(--ink); color:#fff; }
.legend { position: absolute; left: 18px; bottom: 17px; display: flex; gap: 14px; flex-wrap: wrap; font-size: 10px; color: var(--muted); background: rgba(255,253,248,.88); padding: 8px 10px; border-radius: 6px; }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; }.dot.seed{background:var(--node-seed)}.dot.intervention{background:var(--node-intervention)}.dot.review{background:var(--node-review)}.dot.related{background:var(--node-related)}.dot.document{background:var(--node-document)}
.line { display:inline-block;width:13px;height:2px;margin:0 4px 3px 0 }.line.citation{background:var(--node-citation)}
.paper-detail { grid-area:detail; border-left: 1px solid #cfd4d2; background: #f7f7f5; min-width: 0; overflow-y: auto; max-height: none; }
.paper-detail.closed { display: none; }
.empty-detail { height: 100%; min-height: 500px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 35px; }
.empty-detail h3 { font-family: "DM Serif Display"; font-size: 25px; margin: 22px 0 5px; }
.empty-detail p { color: var(--muted); line-height: 1.6; font-size: 13px; }
.empty-orbit { width: 54px; height: 54px; border: 1px solid var(--sage); border-radius: 50%; position: relative; }.empty-orbit::before { content:""; position:absolute; inset:8px -10px; border: 1px solid var(--sage); border-radius:50%; transform:rotate(35deg)}.empty-orbit i{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--coral);left:3px;top:9px}
.detail-content { position: relative; padding: 28px; }
.detail-close { position: absolute; top: 18px; right: 20px; width: 30px; height: 30px; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--muted); font-size: 24px; font-weight: 300; line-height: 24px; cursor: pointer; }
.detail-close:hover { background: var(--paper); color: var(--ink); border-color: var(--moss); }
.detail-kicker { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--coral); font-weight: 700; }
.detail-content h3 { font-family: "DM Serif Display"; font-size: 26px; line-height: 1.15; font-weight: 400; margin: 12px 0; }
.detail-meta { color: var(--muted); font-size: 12px; line-height: 1.55; }
.detail-content hr { border: 0; border-top: 1px solid var(--line); margin: 22px 0; }
.detail-content h4 { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; margin: 20px 0 8px; }
.detail-content p { color: var(--muted); line-height: 1.65; font-size: 13px; }
.detail-stats { display: grid; grid-template-columns: repeat(auto-fit,minmax(90px,1fr)); gap: 8px; margin: 18px 0; }
.detail-stats div { background: var(--paper); padding: 12px; border-radius: 7px; }.detail-stats b { display:block;font-family:"DM Serif Display";font-size:22px}.detail-stats span{font-size:10px;color:var(--muted)}.metric-source{color:inherit;text-decoration:underline;text-underline-offset:2px}.metric-source:hover{color:var(--ink)}
.reading-tools { margin: 20px 0 4px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #f1f4ef; }
.read-toggle { display:flex; align-items:center; gap:8px; color:var(--ink); font-size:12px; font-weight:700; cursor:pointer; }
.read-toggle input { width:16px; height:16px; accent-color:var(--moss); }
.note-label { display:block; margin-top:14px; margin-bottom:6px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; font-weight:700; }
.reading-tools textarea { display:block; width:100%; box-sizing:border-box; resize:vertical; min-height:72px; border:1px solid var(--line); border-radius:6px; padding:9px 10px; color:var(--ink); background:var(--white); font:12px/1.5 "DM Sans", sans-serif; }
.reading-tools textarea:focus { outline:2px solid rgba(88,115,97,.24); border-color:var(--moss); }
.save-note { margin-top:8px; border:1px solid var(--moss); border-radius:5px; padding:7px 10px; background:transparent; color:var(--ink); cursor:pointer; font-size:11px; font-weight:700; }
.save-note:hover { background:#e2ecdf; }
.note-status { margin-left:8px; color:var(--moss); font-size:10px; }
.paper-link { display: block; text-align: center; background: var(--ink); color: white; text-decoration: none; padding: 13px; border-radius: 7px; font-size: 13px; font-weight: 600; }.access-lock { display:inline-block; margin-right:5px; font-size:.95em; line-height:1; vertical-align:-1px; }.paper-card .access-lock { margin-left:6px; font-size:11px; }
.notebook-button { width: 100%; margin-top: 8px; border: 1px solid var(--moss); border-radius: 7px; background: transparent; color: var(--ink); padding: 11px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.notebook-button:hover { background: #edf3eb; }
.notebook-button.copied { background: #dcebd8; border-color: #7da184; color: var(--ink); }
.relevance { background: #f0f4eb; border-left: 3px solid var(--moss); padding: 10px 12px; border-radius: 0 6px 6px 0; }
.relevance-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; margin:18px 0 0; padding:10px 12px; border:1px solid var(--moss); border-radius:6px; background:#c8dfc4; color:var(--ink); font:600 11px "DM Sans", sans-serif; text-align:left; cursor:pointer; }
.relevance-toggle:hover { background:#b7d5b1; border-color:#456c58; }.relevance-toggle span { color:var(--moss); font-size:15px; transition:transform .15s ease; }.relevance-toggle[aria-expanded="true"] span { transform:rotate(180deg); }.relevance-toggle[aria-expanded="true"] + .relevance { margin-top:8px; }
.connection-loading { font-size: 11px !important; font-style: italic; }
.connection-list { display: grid; gap: 6px; margin-bottom: 18px; }
.connection-list a { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; color: var(--ink); text-decoration: none; font-size: 11px; line-height: 1.35; }
.connection-list a:hover { border-color: var(--moss); }
.connection-list small { color: var(--muted); white-space: nowrap; }
.expand-button { width:100%;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--moss);background:#edf3eb;color:var(--ink);border-radius:7px;padding:11px;margin:18px 0 4px;cursor:pointer;font-size:11px;font-weight:700 }
.expand-button:hover { background:#e2ecdf }
.expand-button span { color:var(--coral);font-size:16px;line-height:0 }
.expand-button.error { border-color:#c94f45; background:#fbe9e7; color:#8d2e28; cursor:not-allowed; opacity:1; }
.expand-button.limit { border-color:#c79c45; background:#fff4d8; color:#765412; cursor:not-allowed; opacity:1; }
.source-warning { background:#f1e9dc;border-left:3px solid var(--gold);padding:11px 12px;border-radius:0 6px 6px 0;color:#705d3f !important }
.list-panel { grid-area:list; padding:0; background:#f4f4f2; overflow-y:auto; max-height:none; border-right:1px solid #cfd4d2; }
.paper-card { width:100%; text-align:left; border:0; border-bottom:1px solid #dfe2e0; background:transparent; padding:14px 15px; margin:0; cursor:pointer; display:grid;grid-template-columns:1fr auto;gap:7px}
.paper-card:hover { background:#e8eeec; }.paper-card h3{font-family:"DM Sans";font-size:12px;line-height:1.35;font-weight:600;margin:0}.paper-card p{margin:0;color:#78827f;font-size:10px}.paper-card .badge{font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#438083}
@media (min-width:851px) {
  .view-toggle { display:none; }
  .list-panel[hidden],.graph-panel[hidden] { display:block; }
}
.how-it-works { padding: 100px clamp(20px, 6vw, 100px); max-width: 1500px; margin: auto; }
.steps { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 50px; border-top: 1px solid var(--line); }
.steps article { padding: 28px 40px 0 0; }.steps article + article { border-left: 1px solid var(--line); padding-left: 40px; }
.steps span { color: var(--coral); font: 20px "DM Serif Display"; }.steps h3{font-size:17px;margin:18px 0 8px}.steps p{font-size:13px;color:var(--muted);line-height:1.65}
footer { border-top: 1px solid var(--line); padding: 38px clamp(20px, 5vw, 72px); display:flex;justify-content:space-between;align-items:end;color:var(--muted);font-size:12px}footer p{margin:8px 0 0}footer a{color:var(--ink)}
dialog { border: 0; border-radius: 14px; padding: 35px; max-width: 620px; color: var(--ink); box-shadow: var(--shadow); } dialog::backdrop{background:rgba(25,49,45,.45);backdrop-filter:blur(3px)}dialog h2{font-size:38px;margin:0}dialog>p:not(.eyebrow){line-height:1.7;color:var(--muted)}.dialog-close{float:right;border:0;background:transparent;font-size:24px;cursor:pointer}.primary-button{margin-top:8px}
.about-flow { display: grid; gap: 12px; margin: 22px 0 24px; }
.about-flow article { border: 1px solid var(--line); border-left: 5px solid var(--moss); border-radius: 10px; padding: 15px 17px 14px 52px; position: relative; background: rgba(219,229,216,.24); }
.about-flow article:nth-child(1) { border-color: rgba(110,149,163,.45); border-left-color: var(--blue); background: rgba(110,149,163,.11); }
.about-flow article:nth-child(2) { border-color: rgba(232,125,99,.45); border-left-color: var(--coral); background: rgba(232,125,99,.10); }
.about-flow article:nth-child(3) { border-color: rgba(216,172,91,.5); border-left-color: var(--gold); background: rgba(216,172,91,.12); }
.about-flow article > span { position: absolute; left: 15px; top: 15px; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--white); background: var(--moss); font-size: 10px; font-weight: 700; letter-spacing: .04em; }
.about-flow article:nth-child(1) > span { background: var(--blue); }
.about-flow article:nth-child(2) > span { background: var(--coral); }
.about-flow article:nth-child(3) > span { background: var(--gold); color: var(--ink); }
.about-flow h3 { margin: 0 0 5px; font-size: 15px; }
.service-brand { display: inline-block; margin-right: 5px; padding: 3px 8px 4px; border-radius: 5px; color: #fff; font-size: .9em; font-weight: 700; letter-spacing: -.02em; text-decoration: none; vertical-align: 1px; }
.service-brand:hover { text-decoration: underline; }
.kagi-brand { background: #fd6820; }
.cohere-brand { background: #191919; }
.openalex-brand { background: #111; letter-spacing: -.04em; }
.about-flow p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.about-subheading { margin: 0 0 6px; font-size: 18px; }
@media (max-width: 850px) {
  .hero { min-height: 510px; padding-top: 55px; }.scope-label{display:none}.workspace{padding-left:12px;padding-right:12px}.workspace-head{align-items:flex-start;gap:22px;flex-direction:column}.content-grid{grid-template-columns:1fr;grid-template-areas:"list";height:auto}.content-grid.detail-closed{height:auto}.graph-panel{grid-area:graph}.paper-detail{display:none;position:fixed;z-index:30;inset:74px 0 0;border:0;max-height:none}.paper-detail.open{display:block}.detail-content{max-width:600px;margin:auto;padding:28px 22px 80px}.detail-content::before{content:none}.detail-close{top:16px;right:18px}.graph-panel{min-height:600px}.content-grid.detail-closed .graph-panel{height:420px;min-height:420px}.list-panel{max-height:600px;border-right:0}.paper-card{padding:17px 14px;min-height:76px}.paper-card h3{font-size:13px}.paper-card p{font-size:11px}.api-status{display:none}.steps{grid-template-columns:1fr}.steps article+article{border-left:0;border-top:1px solid var(--line);padding-left:0}.steps article{padding:26px 0}.how-it-works{padding-top:75px;padding-bottom:75px}footer{align-items:flex-start;gap:28px;flex-direction:column}
}
@media (max-width: 540px) {
  .topbar{height:64px;padding:0 16px}.server-notice{top:64px;display:block}.server-notice span{display:block;margin-top:3px}.hero{padding:52px 16px 65px}h1{font-size:45px}.hero-copy{font-size:15px}.search{height:auto;padding:7px 7px 7px 14px}.search button{padding:0 15px}.search input{font-size:13px}.suggestions span{display:none}.scope-switch{flex-wrap:wrap}.scope-switch>span{width:100%;padding-top:4px}.workspace{padding-top:48px}.workspace h2{font-size:35px}.view-toggle{width:100%}.view-toggle button{flex:1}.filter-row{margin-top:20px}.content-grid,.graph-panel{min-height:540px}.graph-panel{height:65vh}.graph-help{display:none}.rank-controls{top:58px;right:12px}.legend{right:12px;left:12px}.paper-detail{inset:64px 0 0}
}

/* Theme tokens and dark-mode overrides. The graph reads its canvas colours from these tokens. */
:root {
  color-scheme: light;
  --graph-citation: rgba(25,68,72,.72);
  --graph-author: rgba(38,84,88,.56);
  --graph-topic: rgba(48,78,82,.34);
  --graph-read: #2b6a58;
  --graph-active: #52306b;
  --graph-outline: rgba(25,49,45,.78);
  --graph-label: #173735;
  --graph-active-label: #9d3f89;
  --graph-node-label: #fffdf8;
}
[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e4eee9; --muted: #aabbb4; --paper: #172321; --white: #22312e;
  --line: #3a4b46; --sage: #30453d; --moss: #9fc7ae; --coral: #ff9b83; --gold: #e7c477; --blue: #8db7c5;
  --shadow: 0 20px 50px rgba(0,0,0,.32);
  --graph-citation: rgba(167,216,211,.55); --graph-author: rgba(155,203,197,.42); --graph-topic: rgba(170,204,198,.2);
  --graph-read: #9ad2ad; --graph-active: #d9a7ff; --graph-outline: rgba(226,241,235,.78);
  --graph-label: #e4eee9; --graph-active-label: #10231e; --graph-node-label: #10231e;
  --node-seed: #e99ac5; --node-intervention: #f2bd54; --node-review: #70b9e3; --node-related: #57c99c; --node-document: #aeb8c0; --node-citation: #f19a62;
}
[data-theme="dark"] .topbar { background: rgba(23,35,33,.92); border-color: rgba(228,238,233,.16); }
[data-theme="dark"] .hero { background: radial-gradient(circle at 20% 20%, rgba(231,196,119,.1), transparent 22%), radial-gradient(circle at 80% 70%, rgba(159,199,174,.1), transparent 25%); }
[data-theme="dark"] .content-grid { background:#202d2b; border-color:#42534e; }
[data-theme="dark"] .graph-panel { background:#202d2b; }
[data-theme="dark"] .paper-detail { background:#1d2a28; border-color:#42534e; }
[data-theme="dark"] .list-panel { background:#1b2926; border-color:#42534e; }
[data-theme="dark"] .paper-card { border-color:#32433f; }
[data-theme="dark"] .paper-card:hover, [data-theme="dark"] .rank-controls button:hover { background:#30443f; }
[data-theme="dark"] .graph-help { color:#c7d7d0; background:rgba(35,51,47,.86); }
[data-theme="dark"] .server-notice { background:#493b29; border-color:#725f3c; color:#f5dfad; }
[data-theme="dark"] .server-notice span { color:#dbc89d; }
[data-theme="dark"] .reading-tools { background:#273a34; }
[data-theme="dark"] .relevance { background:#293e35; }
[data-theme="dark"] .relevance-toggle { background:#47684f; color:#f0f7f1; }
[data-theme="dark"] .source-warning { background:#443b2e; color:#f0d9a8 !important; }
[data-theme="dark"] dialog { background:#22312e; }
[data-theme="dark"] .search-suggestions::before { color:var(--muted); }
[data-theme="dark"] .search,
[data-theme="dark"] .search-suggestions,
[data-theme="dark"] .suggestions button,
[data-theme="dark"] .scope-switch,
[data-theme="dark"] .view-toggle,
[data-theme="dark"] .rank-controls,
[data-theme="dark"] .legend { background: var(--white); color: var(--ink); border-color: var(--line); }
[data-theme="dark"] .suggestions button { background: rgba(34,49,46,.86); }
[data-theme="dark"] .scope-switch { background: rgba(48,69,61,.8); }
[data-theme="dark"] .scope-switch button.active,
[data-theme="dark"] .view-toggle button.active { background: #30443f; color: var(--ink); }
[data-theme="dark"] .filter.active,
[data-theme="dark"] .rank-controls button.active { background: #b9d8c5; color: #14231f; border-color: #b9d8c5; }
[data-theme="dark"] .filter.active b { color: #2d5143; }
[data-theme="dark"] .rank-controls button { color: var(--ink); }
[data-theme="dark"] .graph-tooltip { background: rgba(34,49,46,.96); border-color: var(--line); color: var(--ink); }
[data-theme="dark"] .reading-tools textarea { background: #1b2926; color: var(--ink); }
[data-theme="dark"] .save-note:hover,
[data-theme="dark"] .notebook-button:hover,
[data-theme="dark"] .expand-button:hover { background: #385247; }
[data-theme="dark"] .notebook-button.copied { background: #41694f; color: #f1fff4; border-color: #8fc49b; }
[data-theme="dark"] .expand-button { background: #30483b; color: var(--ink); }
[data-theme="dark"] .expand-button.error { background: #542e2c; color: #ffd3cc; border-color: #ef8d80; }
[data-theme="dark"] .expand-button.limit { background: #514329; color: #ffe4a8; border-color: #e7c477; }
[data-theme="dark"] .paper-link { color: #14231f; background: #b9d8c5; }
:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto} }

/* Responsive safety rails */
body { overflow-x: hidden; }
button, a { -webkit-tap-highlight-color: transparent; }
@media (max-width: 850px) {
  dialog { width: calc(100% - 32px); max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; }
}
@media (max-width: 540px) {
  h1 { font-size: clamp(40px, 12vw, 45px); }
  .brand { font-size: 18px; }
  .search { min-height: 58px; }
  .search svg { flex: 0 0 18px; }
  .search button { padding-inline: 13px; white-space: nowrap; }
  .search input { padding-inline: 9px; }
  .scope-switch button { padding-inline: 9px; }
  .view-toggle button, .filter { min-height: 40px; }
  .filter-row { margin-inline: -12px; padding-inline: 12px; }
  .graph-panel { max-height: 680px; }
  .legend { gap: 8px; }
}

@media (max-width: 540px) {
  /* Give the search controls their own rows so they remain usable above the keyboard. */
  .search {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    grid-template-rows: 50px 48px;
    gap: 6px 8px;
    align-items: center;
    padding: 7px;
  }
  .search svg { width: 22px; }
  .search-input-wrap { width: 100%; min-width: 0; height: 50px; }
  .search input { padding: 0 6px; font-size: 16px; }
  .search button {
    grid-column: 1 / -1;
    width: 100%;
    height: 48px;
    margin: 0;
    font-size: 15px;
  }
  .search-suggestions {
    left: -7px;
    right: -7px;
    top: calc(100% + 8px);
    max-height: min(300px, 42vh);
    overflow-y: auto;
  }
  .search .search-suggestion { min-height: 44px; }
}

@supports (padding: env(safe-area-inset-top)) {
  .topbar { padding-top: env(safe-area-inset-top); height: calc(64px + env(safe-area-inset-top)); }
  .paper-detail { inset: calc(64px + env(safe-area-inset-top)) 0 0; padding-bottom: env(safe-area-inset-bottom); }
}

/* Use the extra space on large desktop and 4K screens without changing laptop/mobile layout. */
@media (min-width: 1800px) {
  .topbar { padding-inline: clamp(72px, 5vw, 140px); }
  .hero { min-height: 650px; padding-block: 100px; }
  h1 { font-size: clamp(84px, 5vw, 112px); }
  .hero-copy { max-width: 760px; font-size: 20px; }
  .search { width: min(1000px, 76vw); height: 78px; padding-left: 28px; }
  .search input { font-size: 18px; }
  .search button { height: 62px; padding-inline: 30px; font-size: 16px; }
  .workspace { padding: 90px clamp(32px, 5vw, 120px) 120px; }
  .workspace-head, .filter-row, .content-grid { max-width: min(3000px, 86vw); }
  .workspace h2, .how-it-works h2 { font-size: clamp(52px, 3.4vw, 72px); }
  .content-grid { grid-template-columns: 380px minmax(0, 1fr) 420px; height: 820px; }
  .graph-panel { min-height: 750px; }
  .list-panel { font-size: 1.1em; }
  .paper-card { padding: 18px 20px; }
  .paper-card h3 { font-size: 14px; }
  .paper-card p { font-size: 11px; }
  .detail-content { padding: 36px; }
  .detail-content h3 { font-size: 32px; }
  .how-it-works { max-width: min(3000px, 86vw); }
}

/* Final dark-mode layer: kept last so component and responsive rules cannot
   accidentally reintroduce light surfaces or low-contrast text. */
[data-theme="dark"] {
  --surface-1: #172321;
  --surface-2: #1b2926;
  --surface-3: #22312e;
  --surface-4: #30443f;
  --text-strong: #f1f7f4;
  --text-body: #d6e3dd;
  --text-muted: #aebfb7;
  --border-strong: #526861;
  --accent-button: #b9d8c5;
  --accent-button-text: #14231f;
}
[data-theme="dark"] body,
[data-theme="dark"] html { background: var(--surface-1); color: var(--text-body); }
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] .brand,
[data-theme="dark"] .detail-content h3 { color: var(--text-strong); }
[data-theme="dark"] .topbar { background: rgba(23,35,33,.96); border-bottom-color: var(--border-strong); }
[data-theme="dark"] .workspace { background: var(--surface-3); }
[data-theme="dark"] .content-grid { background: var(--surface-2); border-color: var(--border-strong); }
[data-theme="dark"] .graph-panel { background: var(--surface-2); }
[data-theme="dark"] .list-panel { background: var(--surface-1); border-color: var(--border-strong); }
[data-theme="dark"] .paper-detail { background: var(--surface-3); border-color: var(--border-strong); }
[data-theme="dark"] .paper-card { border-bottom-color: #334740; color: var(--text-body); }
[data-theme="dark"] .paper-card:hover { background: var(--surface-4); }
[data-theme="dark"] .paper-card h3,
[data-theme="dark"] .detail-meta,
[data-theme="dark"] .detail-content p,
[data-theme="dark"] .steps p,
[data-theme="dark"] .hero-copy { color: var(--text-body); }
[data-theme="dark"] .paper-card p,
[data-theme="dark"] .search-hint,
[data-theme="dark"] .api-status,
[data-theme="dark"] .scope-label,
[data-theme="dark"] footer,
[data-theme="dark"] .filter b { color: var(--text-muted); }
[data-theme="dark"] .search,
[data-theme="dark"] .search-suggestions,
[data-theme="dark"] .rank-controls,
[data-theme="dark"] .legend,
[data-theme="dark"] .detail-stats div,
[data-theme="dark"] .reading-tools,
[data-theme="dark"] .suggestions button,
[data-theme="dark"] .scope-switch,
[data-theme="dark"] .view-toggle { background: var(--surface-3); border-color: var(--border-strong); color: var(--text-body); }
[data-theme="dark"] .search input,
[data-theme="dark"] .search .search-suggestion,
[data-theme="dark"] .rank-controls button,
[data-theme="dark"] .view-toggle button,
[data-theme="dark"] .scope-switch button,
[data-theme="dark"] .suggestions button { color: var(--text-body); }
[data-theme="dark"] .search input::placeholder,
[data-theme="dark"] .reading-tools textarea::placeholder { color: #91a59c; opacity: 1; }
[data-theme="dark"] .search button,
[data-theme="dark"] .primary-button { background: var(--accent-button); color: var(--accent-button-text); }
[data-theme="dark"] .filter.active,
[data-theme="dark"] .rank-controls button.active,
[data-theme="dark"] .view-toggle button.active,
[data-theme="dark"] .scope-switch button.active { background: var(--accent-button); color: var(--accent-button-text); border-color: var(--accent-button); }
[data-theme="dark"] .filter.active b { color: #315842; }
[data-theme="dark"] .graph-controls button,
[data-theme="dark"] .detail-close,
[data-theme="dark"] .icon-button { background: var(--surface-3); color: var(--text-body); border-color: var(--border-strong); }
[data-theme="dark"] .graph-tooltip,
[data-theme="dark"] .graph-help { background: rgba(34,49,46,.97); color: var(--text-body); border-color: var(--border-strong); }
[data-theme="dark"] .legend { color: var(--text-body); }
[data-theme="dark"] .reading-tools textarea { background: var(--surface-2); color: var(--text-body); border-color: var(--border-strong); }
[data-theme="dark"] .save-note,
[data-theme="dark"] .notebook-button,
[data-theme="dark"] .expand-button { background: var(--surface-4); color: var(--text-strong); border-color: var(--moss); }
[data-theme="dark"] .paper-link { background: var(--accent-button); color: var(--accent-button-text); }
[data-theme="dark"] .relevance { background: #294238; color: var(--text-body); }
[data-theme="dark"] .relevance-toggle { background: #52795d; color: #f3fff5; border-color: #83b88e; }
[data-theme="dark"] dialog { background: var(--surface-3); color: var(--text-body); }

/* Fluid type: grows with the viewport, but stays within comfortable reading limits. */
body { font-size: clamp(15px, calc(14px + .18vw), 18px); }
.brand { font-size: clamp(18px, calc(17px + .2vw), 24px); }
.eyebrow { font-size: clamp(10px, calc(9px + .14vw), 14px); }
.hero-copy { max-width: 760px; font-size: clamp(15px, calc(14px + .28vw), 21px); }
.search input { font-size: clamp(15px, calc(14px + .2vw), 19px); }
.workspace h2, .how-it-works h2 { font-size: clamp(34px, calc(30px + 1.6vw), 72px); }
.filter { font-size: clamp(12px, calc(11px + .12vw), 15px); }
.detail-content h3 { font-size: clamp(26px, calc(24px + .55vw), 38px); }
.detail-content p { font-size: clamp(13px, calc(12px + .12vw), 16px); }
@media (max-width: 540px) {
  .search input { font-size: 16px; }
  .hero-copy { font-size: 15px; }
}

/* Desktop focus layout: compact search area and a graph that owns the viewport. */
@media (min-width: 851px) {
  .hero { min-height: 360px; padding: 44px 20px 54px; }
  .hero-copy { margin: 18px auto 22px; }
  .suggestions { margin-top: 12px; }
  .scope-switch { margin-top: 8px; }
  .workspace { padding: 38px 3vw 72px; }
  .workspace-head { max-width: none; width: min(100%, 3000px); }
  .filter-row { max-width: none; width: min(100%, 3000px); margin-top: 20px; margin-bottom: 12px; }
  .content-grid {
    width: min(100%, 3000px);
    max-width: none;
    height: clamp(520px, calc(100dvh - 300px), 900px);
    min-height: 0;
    grid-template-columns: clamp(230px, 16vw, 320px) minmax(0, 1fr) clamp(280px, 20vw, 380px);
  }
  .content-grid.detail-closed {
    height: clamp(520px, calc(100dvh - 300px), 900px);
    grid-template-columns: clamp(230px, 16vw, 320px) minmax(0, 1fr);
    grid-template-areas: "list graph";
  }
  .graph-panel, .content-grid.detail-closed .graph-panel { min-height: 0; height: 100%; }
  .paper-detail.closed { display: none; }
  .how-it-works { padding-top: 72px; }
}

@media (min-width: 1800px) {
  .hero { min-height: 410px; padding-top: 58px; padding-bottom: 64px; }
  .workspace { padding-inline: 4vw; }
  .content-grid, .content-grid.detail-closed {
    height: clamp(700px, calc(100dvh - 320px), 980px);
  }
  .content-grid { grid-template-columns: 340px minmax(0, 1fr) 420px; }
  .content-grid.detail-closed { grid-template-columns: 340px minmax(0, 1fr); }
  .list-panel { font-size: 1.05em; }
  .paper-card { padding: 17px 20px; }
  .paper-card h3 { font-size: 14px; }
  .paper-card p { font-size: 11px; }
}

/* Final precedence layer for dark mode. */
[data-theme="dark"] body,
[data-theme="dark"] html { background: #172321; color: #d6e3dd; }
[data-theme="dark"] .topbar { background: rgba(23,35,33,.96); border-bottom-color: #526861; }
[data-theme="dark"] .workspace,
[data-theme="dark"] .paper-detail { background: #22312e; }
[data-theme="dark"] .content-grid,
[data-theme="dark"] .graph-panel { background: #1b2926; border-color: #526861; }
[data-theme="dark"] .list-panel { background: #172321; border-color: #526861; }
[data-theme="dark"] .paper-card { border-bottom-color: #334740; color: #d6e3dd; }
[data-theme="dark"] .paper-card:hover { background: #30443f; }
[data-theme="dark"] .paper-card h3,
[data-theme="dark"] .detail-content h3,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4 { color: #f1f7f4; }
[data-theme="dark"] .paper-card p,
[data-theme="dark"] .detail-meta,
[data-theme="dark"] .detail-content p,
[data-theme="dark"] .hero-copy,
[data-theme="dark"] .search-hint,
[data-theme="dark"] .scope-label,
[data-theme="dark"] footer { color: #aebfb7; }
[data-theme="dark"] .search,
[data-theme="dark"] .search-suggestions,
[data-theme="dark"] .rank-controls,
[data-theme="dark"] .legend,
[data-theme="dark"] .detail-stats div,
[data-theme="dark"] .reading-tools,
[data-theme="dark"] .suggestions button,
[data-theme="dark"] .scope-switch,
[data-theme="dark"] .view-toggle,
[data-theme="dark"] .graph-controls button,
[data-theme="dark"] .detail-close,
[data-theme="dark"] .icon-button { background: #22312e; color: #d6e3dd; border-color: #526861; }
[data-theme="dark"] .search input,
[data-theme="dark"] .search .search-suggestion,
[data-theme="dark"] .rank-controls button,
[data-theme="dark"] .view-toggle button,
[data-theme="dark"] .scope-switch button,
[data-theme="dark"] .suggestions button { color: #d6e3dd; }
[data-theme="dark"] .search input::placeholder,
[data-theme="dark"] .reading-tools textarea::placeholder { color: #91a59c; opacity: 1; }
[data-theme="dark"] .search button,
[data-theme="dark"] .primary-button,
[data-theme="dark"] .paper-link { background: #b9d8c5; color: #14231f; }
[data-theme="dark"] .filter.active,
[data-theme="dark"] .rank-controls button.active,
[data-theme="dark"] .view-toggle button.active,
[data-theme="dark"] .scope-switch button.active { background: #b9d8c5; color: #14231f; border-color: #b9d8c5; }
[data-theme="dark"] .filter.active b { color: #315842; }
[data-theme="dark"] .graph-tooltip,
[data-theme="dark"] .graph-help { background: rgba(34,49,46,.97); color: #d6e3dd; border-color: #526861; }
[data-theme="dark"] .reading-tools textarea { background: #1b2926; color: #d6e3dd; border-color: #526861; }
[data-theme="dark"] .save-note,
[data-theme="dark"] .notebook-button,
[data-theme="dark"] .expand-button { background: #30443f; color: #f1f7f4; border-color: #9fc7ae; }
[data-theme="dark"] .relevance { background: #294238; color: #d6e3dd; }
[data-theme="dark"] .relevance-toggle { background: #52795d; color: #f3fff5; border-color: #83b88e; }
[data-theme="dark"] dialog { background: #22312e; color: #d6e3dd; }
[data-theme="dark"] .suggestions .random-search { background: #fd6820; border-color: #fd6820; color: #191919; box-shadow: 0 5px 16px rgba(253,104,32,.28); }
[data-theme="dark"] .suggestions .random-search:hover,
[data-theme="dark"] .suggestions .random-search:focus-visible { background: #9deBfe; border-color: #9deBfe; color: #191919; }
[data-theme="dark"] .search-suggestions .search-suggestion { background: transparent; color: #d6e3dd; }
[data-theme="dark"] .search-suggestions .search-suggestion:hover,
[data-theme="dark"] .search-suggestions .search-suggestion.active { background: #30443f; color: #f1f7f4; }
[data-theme="dark"] .search-suggestions .search-suggestion-icon { color: #9fc7ae; }
[data-theme="dark"] .search-suggestions .search-suggestion-meta { color: #aebfb7; }