/* NexyCell — battery digital-twin platform. Dark scientific theme. */
:root {
  --bg: #0a0e16;
  --bg2: #0f1422;
  --panel: #131a2a;
  --panel2: #182135;
  --line: #232d44;
  --line2: #2e3a55;
  --txt: #e6ecf7;
  --txt2: #9fb0cc;
  --txt3: #6b7a99;
  --acc: #34e2c4;      /* teal — NexyCell accent */
  --acc2: #5b8cff;     /* blue */
  --warn: #ffb454;
  --bad: #ff6b6b;
  --good: #4ade80;
  --cath: #ff7a59;     /* cathode orange */
  --anode: #9b8cff;    /* anode violet */
  --shadow: 0 8px 30px rgba(0,0,0,0.5);
  --radius: 14px;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: var(--sans); color: var(--txt); background: var(--bg);
  background-image: radial-gradient(1200px 600px at 80% -10%, rgba(52,226,196,0.07), transparent 60%),
                    radial-gradient(900px 500px at 0% 10%, rgba(91,140,255,0.06), transparent 55%);
  -webkit-font-smoothing: antialiased; line-height: 1.5;
}
a { color: var(--acc2); text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

/* ---- Top bar ---- */
.topbar {
  position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 18px;
  padding: 0 22px; height: 58px; background: rgba(10,14,22,0.82);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; letter-spacing: -0.02em; font-size: 18px; }
.brand .logo { width: 26px; height: 26px; }
.brand b { color: var(--acc); }
.brand .tag { font-size: 10px; color: var(--txt3); font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; margin-left: 2px; }
.nav { display: flex; gap: 4px; margin-left: 8px; overflow: visible; }
.nav::-webkit-scrollbar { display: none; }
.nav button {
  background: transparent; border: 0; color: var(--txt2); font-size: 13px; font-weight: 600;
  padding: 8px 13px; border-radius: 9px; display: flex; align-items: center; gap: 7px;
}
.nav button .n { font-family: var(--mono); font-size: 10px; color: var(--txt3); }
.nav button:hover { color: var(--txt); background: var(--panel); }
.nav button.active { color: var(--bg); background: var(--acc); }
.nav button.active .n { color: rgba(0,0,0,0.55); }
.nav-link{color:var(--txt2);font-size:13px;font-weight:600;padding:8px 13px;border-radius:9px;display:flex;align-items:center;white-space:nowrap}.nav-link:hover{color:var(--txt);background:var(--panel)}
/* simulation dropdown */
.chem-block{background:var(--panel2);border:1px solid var(--line);border-radius:11px;padding:12px;margin-bottom:15px}
.chem-title{font-size:11.5px;font-weight:700;color:var(--cath);margin-bottom:10px}
.seg.sm{padding:3px}
.seg.sm button{font-size:11px;padding:5px 4px}
.depth-band { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.depth-cell { background: linear-gradient(165deg, var(--panel2) 0%, var(--panel) 70%); border: 1px solid var(--line2); border-radius: 14px; padding: 18px 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; cursor: pointer; transition: .16s ease; text-align: left; position: relative; overflow: hidden; }
.depth-cell::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--acc), var(--acc2)); transform: scaleX(0); transform-origin: left; transition: transform .2s ease; }
.depth-cell:hover { border-color: var(--acc); transform: translateY(-3px); box-shadow: 0 10px 28px rgba(0,0,0,0.35); }
.depth-cell:hover::before { transform: scaleX(1); }
.dc-n { font-size: 26px; font-weight: 800; font-family: var(--mono); letter-spacing: -0.03em; color: var(--acc); }
.dc-k { font-size: 12px; color: var(--txt2); font-weight: 600; }
@media (max-width: 720px){ .depth-band { grid-template-columns: repeat(2, 1fr); } }
/* --- premium main polish --- */
#lib-tabs { display: none; }
.hero { margin-bottom: 20px; position: relative; }
.hero h1 { font-size: 46px; letter-spacing: -0.035em; }
.hero h1 .grad-text { background: linear-gradient(100deg, var(--acc) 0%, var(--acc2) 55%, #a78bfa 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero::before { content: ""; position: absolute; left: -50px; top: -30px; width: 340px; height: 260px; background: radial-gradient(circle, rgba(52,226,196,0.13), transparent 70%); filter: blur(18px); pointer-events: none; z-index: 0; }
.hero > div { position: relative; z-index: 1; }
.flowstep { background: linear-gradient(160deg, var(--panel2), var(--panel)); border: 1px solid var(--line2); }
.flowstep:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.3); }
/* capabilities grid */
.autodesign { display: flex; align-items: stretch; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.ad-label { display: flex; align-items: center; font-size: 12.5px; font-weight: 700; color: var(--txt2); padding-right: 4px; }
.ad-btn { background: linear-gradient(165deg, var(--panel2), var(--panel)); border: 1px solid var(--line2); border-radius: 11px; padding: 9px 16px; cursor: pointer; display: flex; flex-direction: column; align-items: flex-start; gap: 1px; transition: .14s; }
.ad-btn b { font-size: 13px; color: var(--txt); }
.ad-btn span { font-size: 10.5px; color: var(--txt3); }
.ad-btn:hover { border-color: var(--acc); transform: translateY(-2px); }
.ad-btn.active { border-color: var(--acc); background: linear-gradient(165deg, rgba(52,226,196,0.12), var(--panel)); }
.ad-btn.active b { color: var(--acc); }
.insight-card { border-color: var(--line2); background: linear-gradient(165deg, rgba(52,226,196,0.05), var(--panel) 60%); }
.insight-list { list-style: none; display: flex; flex-direction: column; gap: 9px; margin-top: 2px; }
.insight-list li { font-size: 13px; line-height: 1.55; color: var(--txt2); padding-left: 20px; position: relative; }
.insight-list li::before { content: "▸"; color: var(--acc); position: absolute; left: 3px; font-weight: 700; }
.insight-list li.muted::before { content: ""; }
.cap-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.cap-card { background: linear-gradient(165deg, var(--panel2), var(--panel)); border: 1px solid var(--line2); border-radius: 14px; padding: 20px; text-align: left; cursor: pointer; transition: .16s ease; display: flex; flex-direction: column; gap: 6px; }
.cap-card:hover { border-color: var(--acc); transform: translateY(-3px); box-shadow: 0 10px 28px rgba(0,0,0,0.32); }
.cap-ico { font-size: 26px; }
/* inline SVG icon slots (icons.js data-ic mount) — one line-icon language everywhere */
.ic-slot { display: inline-flex; align-items: center; justify-content: center; }
.ic-slot .ic { width: 17px; height: 17px; color: var(--acc); }
h4 > .ic-slot { vertical-align: -3px; }
.cap-ico.ic-slot .ic { width: 26px; height: 26px; }
.role-card .ic-slot .ic { width: 26px; height: 26px; }
.plan-ic.ic-slot .ic { width: 30px; height: 30px; }
.pill .ic-slot .ic { width: 14px; height: 14px; }
.pill .ic-slot { vertical-align: -3px; }
.dc-n .ic { width: 22px; height: 22px; vertical-align: -3px; margin-right: 3px; }
.cap-card b { font-size: 15px; color: var(--txt); }
.cap-card p { font-size: 12.5px; color: var(--txt2); line-height: 1.55; }
@media (max-width: 860px){ .cap-grid { grid-template-columns: repeat(2, 1fr); } }
/* how-it-works */
.how-row { display: flex; align-items: stretch; gap: 10px; }
/* the workflow band gets its own backdrop — one tonal shift breaks the card-grid monotony */
.how-row { background: linear-gradient(120deg, rgba(91,140,255,0.06), rgba(52,226,196,0.05)); border: 1px solid var(--line); border-radius: 16px; padding: 18px; }
.how-step { flex: 1; background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 16px; }
.how-step .how-n { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--acc); color: #04120e; font-weight: 800; font-size: 13px; margin-bottom: 8px; }
.how-step b { display: block; font-size: 14px; margin-bottom: 3px; }
.how-step p { font-size: 12px; color: var(--txt2); }
.how-arrow { display: flex; align-items: center; color: var(--txt3); font-size: 20px; }
@media (max-width: 860px){ .how-row { flex-direction: column; } .how-arrow { transform: rotate(90deg); justify-content: center; height: 18px; } }
/* CTA band */
.cta-band { margin-top: 48px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 28px 34px; border-radius: 18px; background: linear-gradient(120deg, rgba(52,226,196,0.12), rgba(91,140,255,0.08)); border: 1px solid var(--line2); flex-wrap: wrap; }
.cta-band h3 { font-size: 23px; letter-spacing: -0.02em; }
.cta-band p { color: var(--txt2); font-size: 14px; margin-top: 4px; }
.foot-contact{margin-top:10px;font-size:13px;color:var(--txt2)}
.foot-contact a{color:var(--acc);font-weight:600}
.btn.lg { padding: 14px 26px; font-size: 15px; }
.nav-dd { position: relative; }
.dd-caret { font-size: 8px; opacity: 0.65; margin-left: -2px; }
.nav-dd-menu { position: absolute; top: calc(100% + 4px); left: 0; min-width: 168px; background: var(--panel); border: 1px solid var(--line2); border-radius: 11px; padding: 6px; display: none; flex-direction: column; gap: 2px; z-index: 60; box-shadow: var(--shadow); }
.nav-dd.open .nav-dd-menu { display: flex; }
.nav-dd-menu button { width: 100%; justify-content: flex-start; }
.nav-dd-menu button:hover { background: var(--panel2); }
.topbar .right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.pill { font-size: 11px; color: var(--txt2); background: var(--panel); border: 1px solid var(--line); padding: 5px 11px; border-radius: 99px; font-family: var(--mono); white-space: nowrap; }
.pill .dot { color: var(--good); }
/* The topbar holds ~18 items; when flex squeezes them, CJK labels (which inherit the
   global overflow-wrap:anywhere) broke into VERTICAL one-char-per-line text — even at
   1440px. nowrap on every topbar label kills that failure mode; the width itself is
   handled by the progressive icon-only steps below. */
.brand, .nav button, .tbtn { white-space: nowrap; }
/* The nav+right rows are all nowrap flex, so the topbar's min-content width is the SUM of
   every item — measured 1502px, i.e. a horizontal scrollbar on every desktop up to ~1500px
   (and +3px even at 1920). Tighten paddings/gaps below 1980px, and clip any residual
   overflow at the root (clip, not hidden: it must not create a scroll container). */
html { overflow-x: clip; }
@media (max-width: 1980px) {
  .topbar { gap: 12px; }
  .nav button, .nav-link { padding: 8px 10px; }
  .topbar .right { gap: 9px; }
}
@media (max-width: 1600px) {
  .pill.share-btn span:not(.cmp-badge) { display: none; }   /* right-side actions → icon-only (emoji stays) */
  .brand .tag { display: none; }
  #status-pill span:not(.dot) { display: none; }            /* engines-online → just the green dot */
}
/* RTL topbar cluster (lang dropdown + mirrored pills) needs ~50px more room than LTR at
   the same width — the 1420px LTR threshold below leaves #status-pill clipped off-screen
   in Arabic at common desktop widths like 1440px (overflow-x:clip hides it with no
   scrollbar cue, so it silently disappears rather than visibly breaking). */
@media (max-width: 1520px) {
  [dir="rtl"] #status-pill { display: none; }
  [dir="rtl"] .topbar .right { gap: 6px; }
}
@media (max-width: 1420px) {
  #status-pill { display: none; }
  .nav button .n { display: none; }
  .nav button, .nav-link { padding: 8px 8px; }
  .topbar { gap: 10px; }
  .topbar .right { gap: 6px; }
  .topbar .right .pill { padding: 5px 7px; }
}

/* ---- Light theme (opt-in toggle; decision-maker friendly). Token remap first, then the
   handful of rules that hardcode dark colors instead of tokens. ---- */
:root[data-theme="light"] {
  --bg: #f4f7fb; --bg2: #eaeff7; --panel: #ffffff; --panel2: #f0f4fa;
  --line: #dde5f0; --line2: #c6d2e4;
  --txt: #17223c; --txt2: #445780; --txt3: #7181a3;
  --acc: #0d9e86; --acc2: #3565e0; --warn: #b45309; --bad: #d6455d; --good: #178f60;
}
:root[data-theme="light"] body { background: var(--bg); color: var(--txt); }
:root[data-theme="light"] .topbar { background: rgba(255,255,255,0.86); border-bottom-color: var(--line); }
:root[data-theme="light"] .nav button.active { color: #fff; }
:root[data-theme="light"] .card { background: var(--panel); box-shadow: 0 1px 2px rgba(23,34,60,0.05); }
:root[data-theme="light"] .card:hover { box-shadow: 0 10px 28px rgba(23,34,60,0.10); }
:root[data-theme="light"] .depth-cell:hover { box-shadow: 0 10px 24px rgba(23,34,60,0.12); }
:root[data-theme="light"] .preset-card:hover { box-shadow: 0 6px 18px rgba(23,34,60,0.10); }
:root[data-theme="light"] .hero-demo { background: linear-gradient(160deg, rgba(13,158,134,0.06), rgba(53,101,224,0.05) 55%, var(--panel)); }
:root[data-theme="light"] .cta-band { background: linear-gradient(120deg, rgba(13,158,134,0.10), rgba(53,101,224,0.07)); }
:root[data-theme="light"] .how-row { background: linear-gradient(120deg, rgba(53,101,224,0.05), rgba(13,158,134,0.05)); }
:root[data-theme="light"] .btn.primary { color: #fff; }
:root[data-theme="light"] .nav button.active .n { color: rgba(255,255,255,0.7); }

/* Landing About fold — the company/founder biography is reference material, not the sales
   pitch; collapsed by default so the landing reads sections, not a text wall. */
.about-fold > summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 8px; color: var(--txt2); font-size: 13px; font-weight: 600; padding: 9px 15px; border: 1px solid var(--line2); border-radius: 10px; background: var(--panel); margin-bottom: 14px; }
.about-fold > summary::-webkit-details-marker { display: none; }
.about-fold > summary::before { content: "▸"; color: var(--acc); transition: transform .15s ease; }
.about-fold[open] > summary::before { transform: rotate(90deg); }
.about-fold > summary:hover { border-color: var(--acc); color: var(--txt); }

/* ---- Layout ---- */
.wrap { max-width: 1280px; margin: 0 auto; padding: 26px 22px 80px; }
.view { display: none; animation: fade .25s ease; }
.view.active { display: block; }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: 30px; align-items: center; margin-bottom: 14px; }
.hero h1 { font-size: 40px; line-height: 1.08; letter-spacing: -0.03em; margin-bottom: 14px; }
.hero h1 .grad-text { background: linear-gradient(90deg, var(--acc), var(--acc2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero p { color: var(--txt2); font-size: 15px; max-width: 50ch; }
.hero-eyebrow{display:block;color:var(--acc);font:700 11px var(--mono);letter-spacing:.12em;margin-bottom:12px}
.hero .cta { margin-top: 22px; display: flex; gap: 12px; flex-wrap: wrap; }
.btn { border: 1px solid var(--line2); background: var(--panel); color: var(--txt); padding: 11px 18px; border-radius: 10px; font-weight: 600; font-size: 14px; display: inline-flex; align-items: center; gap: 8px; }
.btn[hidden] { display: none; }
.btn:hover { border-color: var(--acc); }
.btn.primary { background: var(--acc); color: #04120e; border-color: var(--acc); }
.btn.primary:hover { filter: brightness(1.08); }

.flowmap { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
/* Hero live demo — real engine output above the fold; clicking opens the simulator */
.hero-demo { grid-column: 1 / -1; text-align: left; cursor: pointer; background: linear-gradient(160deg, rgba(52,226,196,0.07), rgba(91,140,255,0.05) 55%, var(--panel)); border: 1px solid var(--line2); border-radius: 14px; padding: 14px 16px 12px; transition: border-color .15s, transform .12s; }
.hero-demo:hover { border-color: var(--acc); transform: translateY(-2px); }
.hero-demo-head { display: flex; align-items: baseline; gap: 8px; font-size: 13px; color: var(--txt); margin-bottom: 8px; }
.hero-demo-head .hd-dot { color: var(--good); font-size: 9px; animation: pulse 2.2s ease-in-out infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.hero-demo-head .sub { color: var(--txt3); font-size: 11.5px; font-family: var(--mono); }
#hero-demo-chart { display: block; width: 100%; height: 92px; }
.hero-demo-kpis { display: flex; gap: 18px; margin-top: 9px; }
.hero-demo-kpis span { display: flex; flex-direction: column; }
.hero-demo-kpis b { font: 800 16px var(--mono); color: var(--acc); letter-spacing: -0.02em; }
.hero-demo-kpis small { font-size: 10.5px; color: var(--txt3); }
/* first-visit nudge (once, dismissed on any click) */
.hero-demo-hint { margin-top: 11px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--acc); background: rgba(52,226,196,.09); display: grid; gap: 3px; animation: hint-in .3s ease; }
/* author `display:grid` above beats the UA [hidden]{display:none} rule on specificity
   ties (author origin always wins) — without this, the box renders regardless of the
   hidden attribute, defeating the one-time/dismiss logic in app.js entirely. */
.hero-demo-hint[hidden] { display: none; }
:root[data-theme="light"] .hero-demo-hint { background: rgba(13,158,134,.09); }
.hero-demo-hint b { font-size: 12.5px; color: var(--acc); }
.hero-demo-hint span { font-size: 11.5px; color: var(--txt2); line-height: 1.5; }
.hero-demo-hint .hd-dismiss { justify-self: end; margin-top: 2px; font-weight: 700; color: var(--txt3); font-size: 11px; }
.hero-demo-hint:hover .hd-dismiss { color: var(--acc); }
@keyframes hint-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
/* free-tier quota chip */
.quota-chip { margin-top: 8px; font: 600 11.5px var(--mono); color: var(--txt3); display: flex; align-items: center; gap: 7px; }
.quota-chip.low { color: var(--warn); }
@media (prefers-reduced-motion: reduce) { .hero-demo-hint { animation: none; } }
/* draw-in on load + hover isolates one C-rate curve */
#hero-demo-chart .hd-line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: hd-draw 1.1s ease forwards; transition: opacity .18s, stroke-width .18s; }
@keyframes hd-draw { to { stroke-dashoffset: 0; } }
#hero-demo-chart[data-hl] .hd-line { opacity: .12; }
#hero-demo-chart[data-hl="0"] .hd-line:nth-of-type(1), #hero-demo-chart[data-hl="1"] .hd-line:nth-of-type(2), #hero-demo-chart[data-hl="2"] .hd-line:nth-of-type(3) { opacity: 1; stroke-width: 3.2; }
@media (prefers-reduced-motion: reduce) { #hero-demo-chart .hd-line { animation: none; stroke-dashoffset: 0; } }
.flowstep { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; position: relative; cursor: pointer; transition: .15s; }
.flowstep:hover { border-color: var(--acc); transform: translateX(3px); }
.flowstep .badge { font-family: var(--mono); font-size: 10px; color: var(--acc); letter-spacing: 0.1em; text-transform: uppercase; }
.flowstep h3 { font-size: 16px; margin: 5px 0 4px; }
.flowstep p { font-size: 12.5px; color: var(--txt2); }
.flowstep .ico { position: absolute; right: 18px; top: 16px; font-size: 22px; opacity: 0.85; }
.role-start{margin:34px 0}.role-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.role-card{border:1px solid var(--line2);background:linear-gradient(165deg,var(--panel2),var(--panel));color:var(--txt);border-radius:14px;padding:18px;text-align:left;display:flex;flex-direction:column;gap:7px;transition:.16s}.role-card>span{font-size:24px}.role-card b{font-size:14px}.role-card small{color:var(--txt2);line-height:1.5;min-height:56px}.role-card em{color:var(--acc);font-size:12px;font-style:normal;font-weight:700}.role-card:hover{border-color:var(--acc);transform:translateY(-3px)}
@media(max-width:960px){.role-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.role-grid{grid-template-columns:1fr}}

/* ---- Section grid ---- */
.section-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 18px; flex-wrap: wrap; }
.section-head h2 { font-size: 24px; letter-spacing: -0.02em; }
.section-head .layer-no { font-family: var(--mono); font-size: 12px; color: var(--acc); border: 1px solid var(--line2); border-radius: 7px; padding: 3px 9px; }
.section-head p { color: var(--txt2); font-size: 13.5px; flex: 1 1 280px; }

.grid { display: grid; gap: 18px; }
.cols-2 { grid-template-columns: 380px 1fr; }
.cols-2b { grid-template-columns: 1fr 1fr; }
.cols-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 960px) { .cols-2, .cols-2b, .cols-3, .hero { grid-template-columns: 1fr; } .hero h1 { font-size: 32px; } }

.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; }
.card.pad-sm { padding: 14px; }
.card h4 { font-size: 13px; font-weight: 700; color: var(--txt); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; letter-spacing: -0.01em; }
.card h4 .tag-c { color: var(--cath); } .card h4 .tag-a { color: var(--anode); }
.card .sub { font-size: 11.5px; color: var(--txt3); font-weight: 500; }

/* ---- Controls ---- */
.ctrl { margin-bottom: 15px; }
.ctrl label { display: flex; justify-content: space-between; font-size: 12px; color: var(--txt2); margin-bottom: 7px; font-weight: 600; }
.ctrl label .val { font-family: var(--mono); color: var(--acc); }
input[type=range] { -webkit-appearance: none; width: 100%; height: 5px; border-radius: 99px; background: var(--line2); outline: none; }
input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; border-radius: 50%; background: var(--acc); cursor: pointer; box-shadow: 0 0 0 4px rgba(52,226,196,0.18); }
input[type=range].cath::-webkit-slider-thumb { background: var(--cath); box-shadow: 0 0 0 4px rgba(255,122,89,0.18); }
input[type=range].anode::-webkit-slider-thumb { background: var(--anode); box-shadow: 0 0 0 4px rgba(155,140,255,0.18); }
select, .seg {
  width: 100%; background: var(--panel2); color: var(--txt); border: 1px solid var(--line2);
  border-radius: 9px; padding: 9px 11px; font-size: 13px; font-family: inherit;
}
.seg { display: flex; gap: 4px; padding: 4px; }
.seg button { flex: 1; background: transparent; border: 0; color: var(--txt2); font-size: 12px; font-weight: 600; padding: 7px 4px; border-radius: 6px; }
.seg button.active { background: var(--acc); color: #04120e; }
.seg.off { opacity: 0.4; pointer-events: none; }
.note.dim { color: var(--txt3); opacity: 0.85; }

/* ---- Readouts ---- */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.kpi { background: var(--panel2); border: 1px solid var(--line); border-radius: 11px; padding: 12px 13px; }
.kpi .k { font-size: 10.5px; color: var(--txt3); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.kpi .v { font-size: 22px; font-weight: 700; font-family: var(--mono); letter-spacing: -0.02em; margin-top: 3px; }
.kpi .v small { font-size: 12px; color: var(--txt2); font-weight: 500; }
.kpi .d { font-size: 10.5px; margin-top: 3px; color: var(--txt3); }
.kpi.good .v { color: var(--good); } .kpi.warn .v { color: var(--warn); } .kpi.bad .v { color: var(--bad); }
.kpi.acc .v { color: var(--acc); }

.bars { display: flex; flex-direction: column; gap: 9px; }
.bar { }
.bar .lab { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--txt2); margin-bottom: 4px; }
.bar .lab b { color: var(--txt); font-family: var(--mono); }
.bar .track { height: 7px; background: var(--line); border-radius: 99px; overflow: hidden; }
.bar .fill { height: 100%; border-radius: 99px; transition: width .35s ease; background: var(--acc); }

canvas.chart { width: 100%; height: 210px; display: block; }
canvas.chart.tall { height: 240px; }
#view-cell .card h4 { margin-bottom: 10px; }
#view-cell .ctrl { margin-bottom: 11px; }
.legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; font-size: 11.5px; color: var(--txt2); }
.legend i { display: inline-block; width: 11px; height: 3px; border-radius: 2px; margin-right: 5px; vertical-align: middle; }

.note { font-size: 11px; color: var(--txt3); margin-top: 10px; line-height: 1.5; }
.note b { color: var(--txt2); }
.tagrow { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 4px; }
.chip { font-size: 11px; font-family: var(--mono); color: var(--txt2); background: var(--panel2); border: 1px solid var(--line); padding: 3px 9px; border-radius: 99px; }
.chip.on { color: var(--acc); border-color: var(--acc); }

.verdict { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border-radius: 11px; border: 1px solid var(--line2); background: var(--panel2); }
.verdict .lvl { font-size: 26px; }
.verdict .txt b { font-size: 14px; } .verdict .txt div { font-size: 12px; color: var(--txt2); }

table.tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
table.tbl th, table.tbl td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); }
table.tbl th { color: var(--txt3); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }
table.tbl td.num { font-family: var(--mono); text-align: right; }
table.tbl th.num { text-align: right; }
table.tbl tr:hover td { background: var(--panel2); }

.banner { display: flex; align-items: center; gap: 10px; background: var(--panel2); border: 1px solid var(--line); border-left: 3px solid var(--acc); border-radius: 10px; padding: 11px 14px; font-size: 12.5px; color: var(--txt2); margin-bottom: 16px; }
.banner.cath { border-left-color: var(--cath); }
.banner.warn { border-left-color: var(--warn); }
.footer { text-align: center; color: var(--txt3); font-size: 11.5px; padding: 30px 0 10px; border-top: 1px solid var(--line); margin-top: 40px; }
.footer b { color: var(--txt2); }
.spark { font-family: var(--mono); }
.divider { height: 1px; background: var(--line); margin: 16px 0; }
.muted { color: var(--txt3); }
.flex { display: flex; gap: 10px; align-items: center; }
.flex.between { justify-content: space-between; }
.stage-pills { display: flex; gap: 5px; flex-wrap: wrap; }
.stage-pills .sp { font-size: 10.5px; font-family: var(--mono); padding: 3px 8px; border-radius: 6px; border: 1px solid var(--line); color: var(--txt3); }
.stage-pills .sp.hot { color: var(--bad); border-color: var(--bad); background: rgba(255,107,107,0.08); }

/* ---- A11y ---- */
.skip-link { position: absolute; left: 12px; top: -48px; z-index: 200; background: var(--panel); border: 1px solid var(--line2); color: var(--txt); padding: 9px 16px; border-radius: 8px; font-size: 14px; font-weight: 600; transition: top .15s ease; }
.skip-link:focus { top: 10px; }
:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; border-radius: 5px; }
input[type=range]:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px rgba(52,226,196,0.35); }

/* ---- Topbar tools ---- */
.toolbtns { display: flex; gap: 6px; }
.tbtn { display: inline-flex; align-items: center; gap: 6px; background: var(--panel); border: 1px solid var(--line2); color: var(--txt2); font-size: 12px; font-weight: 600; padding: 7px 11px; border-radius: 9px; }
.tbtn:hover { color: var(--txt); border-color: var(--acc); }
.tbtn.primary { background: var(--acc); color: #04120e; border-color: var(--acc); }
.tbtn.primary:hover { filter: brightness(1.08); }
.lang-select { width: auto; min-width: 88px; background: var(--panel); border: 1px solid var(--line2); color: var(--txt2); font-size: 12px; font-weight: 600; padding: 7px 9px; border-radius: 9px; }
@media (max-width: 1180px) { #status-pill { display: none; } }
@media (max-width: 860px) { .tbtn span { display: none; } .brand .tag { display: none; } }
@media (max-width: 680px) { .nav button .n { display: none; } .topbar { gap: 10px; padding: 0 14px; } }

/* ---- Methodology ---- */
.lead { font-size: 16px; line-height: 1.7; color: var(--txt); max-width: 78ch; }
.m-h { font-size: 14px; margin-bottom: 10px; }
.m-b { font-size: 13px; line-height: 1.72; color: var(--txt2); }
.cite-text { font-family: var(--mono); font-size: 12px; color: var(--txt2); background: var(--panel2); border: 1px solid var(--line); border-radius: 9px; padding: 12px 14px; line-height: 1.6; }
.mc-row { display: grid; grid-template-columns: 130px 1fr; gap: 14px; padding: 11px 0; border-top: 1px solid var(--line); font-size: 12.5px; }
.mc-row:first-of-type { border-top: 0; }
.mc-k { color: var(--txt3); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; font-size: 10.5px; padding-top: 2px; }
.mc-v { color: var(--txt2); line-height: 1.6; }
.mc-v b { color: var(--txt); }
.mc-queries { display: flex; flex-wrap: wrap; gap: 5px; }
.mc-queries code { font-family: var(--mono); font-size: 11px; color: var(--acc); background: var(--panel2); border: 1px solid var(--line); border-radius: 6px; padding: 2px 7px; }
@media (max-width: 640px) { .mc-row { grid-template-columns: 1fr; gap: 4px; } }
.mv-bars { display: flex; flex-direction: column; gap: 5px; }
.mv-bar { display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: 10px; font-size: 11.5px; }
.mv-bl { color: var(--txt2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mv-bt { height: 8px; background: var(--line); border-radius: 99px; overflow: hidden; }
.mv-bf { display: block; height: 100%; background: linear-gradient(90deg, var(--acc2), var(--acc)); border-radius: 99px; }
.mv-bn { font-family: var(--mono); color: var(--txt3); text-align: right; white-space: nowrap; }
@media (max-width: 640px) { .mv-bar { grid-template-columns: 110px 1fr auto; } }
.mv-bf.lv-crowded { background: var(--bad); } .mv-bf.lv-moderate { background: var(--warn); } .mv-bf.lv-sparse { background: var(--good); }
.mv-pat{margin-left:8px;color:var(--anode);font-size:11px;white-space:nowrap}
.mv-bar.clk{cursor:pointer;border-radius:7px;padding:2px 4px;margin:0 -4px;transition:background .12s}
.mv-bar.clk:hover{background:var(--panel2)}
.mv-bar.clk:hover .mv-bn{color:var(--acc)}
.mv-bar.mine .mv-bl { color: var(--acc); font-weight: 700; }
#opt-families .chip { cursor: pointer; }
#opt-families .chip.on { color: var(--acc); border-color: var(--acc); background: rgba(52,226,196,0.08); }
#opt-objective { flex-wrap: wrap; }
#opt-table { font-size: 11.5px; }
#opt-best .ai-bubble, #gap-ai-out .ai-bubble { font-size: 12.5px; line-height: 1.6; padding: 12px 14px; border-radius: 11px; border: 1px solid var(--line); }
.btn.sm { padding: 6px 11px; font-size: 12px; }
.btn.danger { border-color: rgba(255,107,107,0.4); color: var(--bad); }
.btn.block { display: block; width: 100%; text-align: left; margin-bottom: 8px; }

/* ---- Modal ---- */
.modal-overlay { position: fixed; inset: 0; z-index: 100; background: rgba(4,7,12,0.66); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; padding: 20px; animation: fade .18s ease; }
.modal-overlay[hidden] { display: none; }
.modal { width: 100%; max-width: 460px; background: var(--panel); border: 1px solid var(--line2); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; }
.modal.modal-wide { max-width: 940px; }
.modal-wide .pat-desc { max-height: 46vh; }
.modal-wide .pat-abs { font-size: 12.5px; }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.modal-head h3 { font-size: 15px; letter-spacing: -0.01em; }
.modal-x { background: transparent; border: 0; color: var(--txt3); font-size: 16px; padding: 4px 8px; border-radius: 7px; }
.modal-x:hover { color: var(--txt); background: var(--panel2); }
.modal-body { padding: 18px; }
.export-opts .btn { font-size: 13px; }
.gate-b { font-size: 13px; color: var(--txt2); margin-bottom: 14px; line-height: 1.6; }
.gate-input { width: 100%; background: var(--panel2); border: 1px solid var(--line2); border-radius: 9px; padding: 11px 13px; color: var(--txt); font-size: 14px; }
.gate-err { color: var(--bad); font-size: 12px; margin-top: 7px; }
.gate-actions { display: flex; gap: 8px; margin-top: 16px; }
.lead-consent { display:flex; align-items:flex-start; gap:8px; color:var(--txt2); font-size:12px; line-height:1.45; cursor:pointer; }
.lead-consent input { margin-top:2px; flex:0 0 auto; accent-color:var(--acc); }
.save-pick{display:flex;align-items:center;gap:8px;cursor:pointer}.save-pick input{accent-color:var(--acc)}
.cmp-tbl{font-size:12px}.cmp-k{color:var(--txt3);font-weight:600}.cmp-best{color:var(--acc);font-weight:700;background:rgba(52,226,196,0.08)}
/* Discovery — confidence badges + result rows */
.conf-badge{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;padding:3px 8px;border-radius:6px;border:1px solid transparent}
.cb-calib{color:var(--good);border-color:rgba(74,222,128,0.4);background:rgba(74,222,128,0.08)}
.cb-dft{color:var(--acc2);border-color:rgba(91,140,255,0.4);background:rgba(91,140,255,0.08)}
.cb-ai{color:var(--warn);border-color:rgba(255,180,84,0.4);background:rgba(255,180,84,0.08)}
.disc-tabs button.active{background:var(--acc);color:#04120e}
.disc-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line)}
.disc-row .dr-main b{font-size:13px;color:var(--txt)}
.disc-row .dr-tag{font-size:10px;color:var(--acc);font-weight:600;margin-left:6px}
.disc-row .dr-sub{font-size:11px;color:var(--txt3);margin-top:2px;line-height:1.45}
.disc-row .dr-meta{font-family:var(--mono);font-size:11px;color:var(--txt2);text-align:right;white-space:nowrap}
.disc-row .dr-meta .dr-bad{color:var(--txt3)}
.disc-row .dr-est{font-size:11px;color:var(--acc2);margin-top:3px;font-family:var(--mono)}
.disc-row .dr-est .dr-estlbl{color:var(--txt3);font-family:var(--font);font-size:10px;margin-left:4px}
.disc-row.clk{cursor:pointer;transition:border-color .15s,background .15s}
.disc-row.clk:hover{border-color:var(--acc);background:var(--panel2)}
.disc-row .dr-meta .dr-chev{color:var(--acc);font-weight:700;margin-left:8px}
/* compound detail modal */
.modal-body{max-height:74vh;overflow-y:auto}
.cmp-cls{margin:-4px 0 6px;font-size:12.5px}
.cmp-sec-h{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--txt3);margin:16px 0 7px;border-top:1px solid var(--line);padding-top:12px}
.cmp-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.cmp-grid>div{background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:7px 10px}
.cmp-grid span{display:block;font-size:10.5px;color:var(--txt3)}
.cmp-grid b{font-size:13px;font-family:var(--mono)}
.cmp-est{margin-top:9px;font-size:12px;color:var(--txt2)}
.cmp-est .dr-estlbl{color:var(--txt3);font-size:10px;margin-left:4px}
.cmp-more{margin-top:8px;font-size:12px}
.rag-h{font-size:13.5px;margin:10px 0 4px;color:var(--txt)}
.de-dft-row{font-family:var(--mono);font-size:12.5px;color:var(--txt);margin-bottom:4px}
/* live chemical formula chip */
.chem-formula{margin:2px 0 12px;padding:10px 13px;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;line-height:1.5}
.chem-formula .cf-main{font-family:var(--mono);font-size:18px;font-weight:700;color:var(--acc);letter-spacing:.2px}
.chem-formula .cf-main sub{font-size:0.62em;font-weight:600}
.chem-formula .cf-tail{display:block;margin-top:3px;font-size:11.5px;color:var(--txt3)}
/* stoichiometry / validity checklist */
#chem-balance{display:flex;flex-direction:column;gap:3px}
#chem-balance .chk{font-size:11.5px;line-height:1.5}
#chem-balance .chk.ok{color:var(--good)}
#chem-balance .chk.warn{color:var(--warn)}
#chem-balance .chk.bad{color:var(--bad)}
.seg.wrap{flex-wrap:wrap;gap:5px}
#chem-dop-eff{color:var(--txt3)}
/* synthesis process design card */
.proc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:760px){.proc-grid{grid-template-columns:1fr}}
.proc-opt{font-size:11px;color:var(--txt3);margin-top:5px}
.proc-opt .pw-ok{color:var(--good)} .proc-opt .pw-warn{color:var(--warn)} .proc-opt .pw-bad{color:var(--bad)}
.proc-toggles{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.ptog{flex:1;min-width:120px;padding:8px 10px;border:1px solid var(--line2);border-radius:9px;background:var(--panel2);color:var(--txt2);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}
.ptog:hover{border-color:var(--acc)}
.ptog.on{border-color:var(--acc);background:rgba(52,226,196,0.12);color:var(--acc)}
.proc-warns{margin-top:12px;display:flex;flex-direction:column;gap:4px}
.pw-line{font-size:11.5px;line-height:1.5;color:var(--warn)}
.pw-line.pw-ok{color:var(--good)}
/* printable report (PDF) */
.print-report{display:none}
@media print{
  @page{margin:14mm}
  body{background:#fff!important}
  body>*:not(#print-report){display:none!important}
  #print-report{display:block!important;color:#0c1118;font-family:'Segoe UI',system-ui,sans-serif}
  .pr-top{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #2bb69a;padding-bottom:8px;font-size:12px;color:#5a6675}
  .pr-brand b{color:#0c1118}
  .pr-h1{font-size:20px;margin:14px 0 4px;color:#0c1118}
  .pr-formula{font-family:ui-monospace,monospace;font-size:16px;font-weight:700;color:#13917a;margin-bottom:14px}
  .pr-formula sub{font-size:.62em}.pr-formula .cf-tail{font-size:11px;color:#5a6675;font-family:'Segoe UI',sans-serif}
  .pr-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
  .pr-m{border:1px solid #dde3ea;border-radius:8px;padding:8px 10px}
  .pr-mv{font-size:18px;font-weight:800;color:#0c1118}.pr-mv span{font-size:11px;font-weight:600;color:#5a6675}
  .pr-ml{font-size:10px;color:#5a6675;margin-top:2px}
  .pr-cols{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .pr-card h3{font-size:11px;color:#13917a;margin:0 0 6px;text-transform:uppercase;letter-spacing:.04em}
  .pr-table{width:100%;border-collapse:collapse;font-size:12px}
  .pr-table td{padding:4px 6px;border-bottom:1px solid #eef1f5}
  .pr-table td:first-child{color:#5a6675;width:46%}.pr-table td:last-child{color:#0c1118;font-weight:600}
  .pr-note{font-size:10px;color:#7a8696;margin-top:14px;line-height:1.5;border-top:1px solid #eef1f5;padding-top:8px}
  .pr-foot{display:flex;justify-content:space-between;font-size:10px;color:#9aa6b4;margin-top:8px}
}
/* loading skeleton */
.skel{display:flex;flex-direction:column;gap:8px;padding:4px 0}
.skel-line{height:11px;border-radius:6px;background:linear-gradient(90deg,var(--panel2) 25%,var(--line2) 38%,var(--panel2) 60%);background-size:300% 100%;animation:shimmer 1.4s ease infinite}
@keyframes shimmer{0%{background-position:120% 0}100%{background-position:-120% 0}}
/* workflow stepper */
.stepper{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 20px;padding:9px 13px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.stepper[hidden]{display:none}
.stepper .step{display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border-radius:8px;background:transparent;border:1px solid transparent;color:var(--txt3);font-size:12.5px;font-weight:600;cursor:pointer;transition:all .15s}
.stepper .step:hover{color:var(--txt);background:var(--panel2)}
.stepper .step.active{color:var(--acc);border-color:var(--acc);background:rgba(52,226,196,0.08)}
.stepper .step-n{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--panel2);font-size:10px;font-weight:700}
.stepper .step.active .step-n{background:var(--acc);color:#06121a}
.stepper .step-arrow{color:var(--txt3);font-size:12px}
@media(max-width:620px){.stepper .step span:not(.step-n){display:none}.stepper .step{padding:6px 8px}.stepper{gap:3px}}
/* preset template cards (1-click start) */
.preset-strip{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch;margin-top:14px}
.preset-lbl{align-self:center;font-size:12px;color:var(--txt3);font-weight:600;margin-right:2px}
.preset-card{flex:1;min-width:150px;text-align:left;background:var(--panel);border:1px solid var(--line2);border-radius:12px;padding:12px 14px;cursor:pointer;transition:border-color .15s,transform .12s,box-shadow .15s;display:flex;flex-direction:column;gap:2px}
.preset-card:hover{border-color:var(--acc);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.2)}
.preset-card .preset-ic{font-size:20px}
.preset-card .preset-ic.ic-slot .ic{width:22px;height:22px}
.preset-card b{font-size:13px;color:var(--txt);margin-top:2px}
.preset-card .preset-d{font-size:11px;color:var(--txt3)}
.preset-card .preset-radar{align-self:center;margin-top:4px}
.preset-card .preset-radar .viz-svg-sm{width:150px;height:150px}
.preset-card .preset-val{font:700 11.5px var(--mono);color:var(--acc);margin-top:2px}
/* onboarding hero copilot */
.hero-copilot{background:linear-gradient(135deg,rgba(52,226,196,0.09),rgba(91,140,255,0.09));border:1px solid var(--line2);border-radius:16px;padding:20px 22px}
.hero-copilot .hc-title{font-size:18px;font-weight:800;color:var(--txt)}
.hero-copilot .hc-sub{font-size:13px;color:var(--txt3);margin:4px 0 14px;line-height:1.55}
.hero-copilot .copilot{background:transparent;border:none;padding:0;margin:0}
/* toast notifications */
.toast-host{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast{background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:10px 18px;font-size:13px;font-weight:500;color:var(--txt);box-shadow:var(--shadow);opacity:0;transform:translateY(12px);transition:opacity .22s ease,transform .22s ease;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateY(0)}
.toast.toast-error{border-color:var(--bad);color:var(--bad)}
.share-btn{cursor:pointer;font:inherit;transition:border-color .15s,color .15s}
.share-btn:hover{border-color:var(--acc);color:var(--acc)}
.cmp-badge{display:inline-flex;align-items:center;justify-content:center;min-width:15px;height:15px;padding:0 4px;margin-left:5px;border-radius:8px;background:var(--acc);color:#06121a;font-size:10px;font-weight:700}
.cmp-badge[hidden]{display:none}
.save-new{display:flex;gap:8px;margin-bottom:14px}.save-new input{flex:1}
.plan-card{display:flex;flex-direction:column;text-align:center;align-items:center}
.plan-card .plan-ic{font-size:30px;margin-bottom:6px}
.plan-card h4{margin:2px 0 6px}
.plan-card .sub{flex:1;line-height:1.6}
.plan-card .plan-cta{margin-top:14px;align-self:stretch}
/* A/B compare table */
.cmp-wrap{overflow-x:auto}
.cmp-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:340px}
.cmp-table th,.cmp-table td{padding:8px 10px;text-align:center;border-bottom:1px solid var(--line)}
.cmp-table th{font-weight:700;color:var(--txt);vertical-align:top}
.cmp-table .cmp-formula{font-family:var(--mono);font-size:11px;color:var(--acc);font-weight:600;margin-top:3px}
.cmp-table .cmp-fam{font-size:10px;color:var(--txt3);font-weight:400;margin-top:1px}
.cmp-table .cmp-rl{text-align:left;color:var(--txt3);font-size:11.5px;font-weight:500}
.cmp-table td.cmp-best{color:var(--good);font-weight:700;background:rgba(74,222,128,0.10)}
.cmp-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;justify-content:center}
/* uncertainty ± band (in KPI detail) */
.unc{display:flex;align-items:center;gap:6px;margin-top:4px}
.unc-track{position:relative;flex:1;height:5px;background:var(--panel2);border-radius:3px;min-width:34px}
.unc-band{position:absolute;top:0;height:5px;left:50%;transform:translateX(-50%);border-radius:3px;opacity:.5}
.unc-band.unc-hi{background:var(--acc)}
.unc-band.unc-md{background:var(--warn)}
.unc-band.unc-lo{background:var(--warn);opacity:.7}
.unc-mid{position:absolute;top:-1px;left:50%;transform:translateX(-50%);width:1.5px;height:7px;background:var(--txt2);border-radius:1px}
.unc-lbl{font-size:10px;color:var(--txt3);font-family:var(--mono);flex:none}
/* sensitivity tornado */
.sens-row{display:flex;align-items:center;gap:10px;margin-bottom:7px}
.sens-lbl{width:74px;font-size:11.5px;color:var(--txt2);flex:none;text-align:right}
.sens-track{position:relative;flex:1;height:18px;background:var(--panel2);border-radius:5px}
.sens-bar{position:absolute;top:3px;height:12px;background:linear-gradient(90deg,var(--acc),var(--acc2));border-radius:3px;opacity:.85}
.sens-base{position:absolute;top:-1px;width:2px;height:20px;background:var(--txt2)}
.sens-span{width:46px;font-size:11px;color:var(--txt3);flex:none;font-family:var(--mono)}
.sens-axislbl{display:flex;justify-content:space-between;font-size:10px;color:var(--txt3);margin-top:6px;padding-left:84px}
/* regulatory readiness */
.comp-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 6px;border-bottom:1px solid var(--line);cursor:pointer;transition:background .15s}
.comp-row:hover{background:var(--panel2)}
.comp-main b{font-size:12.5px}
.comp-body{font-size:10px;color:var(--txt3);border:1px solid var(--line);border-radius:4px;padding:0 5px;margin-left:5px}
.comp-scope{font-size:10.5px;color:var(--txt3);margin-top:2px}
.comp-badge{flex:none;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:99px;white-space:nowrap}
.comp-ok{background:rgba(74,222,128,0.14);color:var(--good)}
.comp-warn{background:rgba(250,204,21,0.14);color:var(--warn)}
.comp-bad{background:rgba(248,113,113,0.14);color:var(--bad)}
.grounding{margin:8px 0 2px;font-size:11.5px;color:var(--txt3);line-height:1.65}
.grounding:empty{display:none}
.grounding .gr-lbl{font-weight:700;color:var(--txt2);margin-right:4px}
.grounding a{color:var(--acc2);text-decoration:none}
.grounding a:hover{text-decoration:underline}
.cp-ground{margin-top:8px}
.pw-line.clk{cursor:pointer;border-radius:5px;padding:1px 4px;margin:0 -4px;transition:background .15s}
.pw-line.clk:hover{background:var(--panel2)}
.pw-line .pw-cite{opacity:.5;font-size:10px}
.proc-design-bar{margin:0 0 10px;padding:9px 13px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;font-size:12.5px}
.proc-design-bar .cf-main{font-family:var(--mono);font-weight:700;color:var(--acc)}
.proc-design-bar .cf-main sub{font-size:.62em}
.proc-stage{font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--acc);margin:15px 0 7px;padding-bottom:5px;border-bottom:1px solid var(--line)}
.proc-stage:first-child{margin-top:0}
/* design copilot (natural language → design) */
.copilot{margin-bottom:16px;background:linear-gradient(135deg,rgba(52,226,196,0.07),rgba(91,140,255,0.07));border:1px solid var(--line2);border-radius:14px;padding:14px}
.copilot-row{display:flex;gap:9px;align-items:center}
.copilot-ico{color:var(--acc);font-size:18px;flex:none}
.copilot-row input{flex:1;min-width:0;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;padding:11px 14px;color:var(--txt);font-size:14px;transition:box-shadow .3s,border-color .3s}
.flowstep .ico svg{width:24px;height:24px;color:var(--acc);display:block}
.preset-radar{width:92px;height:92px;margin:8px auto 2px;color:var(--acc);opacity:.95}
.preset-radar svg{width:100%;height:100%}
.hero-copilot .copilot-row input{animation:cpGlow 3.6s ease-in-out infinite}
.hero-copilot .copilot-row input:focus{animation:none;border-color:var(--acc);box-shadow:0 0 0 1px var(--acc),0 0 20px rgba(52,226,196,.28);outline:none}
@keyframes cpGlow{0%,100%{box-shadow:0 0 7px rgba(52,226,196,.08)}50%{box-shadow:0 0 16px rgba(52,226,196,.20)}}
.copilot-row input:focus{border-color:var(--acc);outline:none}
.copilot-go{flex:none;white-space:nowrap}
@media(max-width:600px){.cmp-grid{grid-template-columns:1fr}.copilot-row{flex-wrap:wrap}.copilot-row input{flex:1 1 100%}}
.copilot-ex{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.cex{padding:4px 11px;border:1px solid var(--line);border-radius:99px;background:transparent;color:var(--txt3);font-size:11.5px;cursor:pointer;transition:all .15s}
.cex:hover{border-color:var(--acc);color:var(--acc)}
.copilot-out{margin-top:11px}
.copilot-out:empty{display:none}
.copilot-note{font-size:12.5px;color:var(--txt2);margin-bottom:8px;line-height:1.55}
.copilot-applied{font-size:12px;color:var(--txt3);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cp-refine{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}
.cp-refine-lbl{font-size:11.5px;color:var(--txt3);font-weight:600;margin-right:2px}
.cchip{display:inline-block;padding:3px 9px;background:var(--panel2);border:1px solid var(--line);border-radius:7px;font-size:11px;color:var(--txt2);font-weight:600}
.disc-act{margin-top:8px;display:inline-flex;font-size:11px;color:var(--acc);cursor:pointer;font-weight:600}
/* RAG — grounded answer + sources */
.rag-cite{color:var(--acc);font-weight:700;font-size:0.8em;cursor:pointer}
.rag-cite:hover{text-decoration:underline}
.rag-flash{background:rgba(52,226,196,0.16);border-radius:5px;transition:background .3s}
.p2d-bar{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.p2d-res{font-size:12.5px;color:var(--txt2);margin-top:10px;background:var(--panel2);border:1px solid var(--acc);border-radius:8px;padding:9px 12px;line-height:1.6}
.val-prov{font-size:12.5px;color:var(--txt2);margin:12px 0 8px}
.val-prov a{color:var(--acc)}
.val-checks{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.val-chk{font-size:11.5px;padding:4px 9px;border-radius:6px;border:1px solid var(--line2);background:var(--panel2)}
.val-chk.ok{border-color:var(--acc);color:var(--txt)}
.val-chk.no{border-color:var(--bad);color:var(--bad)}
.val-rc{font-size:12.5px;color:var(--txt2);margin-top:10px}
.fit-ta{width:100%;box-sizing:border-box;font-family:ui-monospace,monospace;font-size:12px;background:var(--panel2);color:var(--txt);border:1px solid var(--line2);border-radius:8px;padding:9px;resize:vertical}
.fit-lab{font-size:12.5px;color:var(--txt2);display:inline-flex;align-items:center;gap:6px}
.fit-num{width:64px;background:var(--panel2);color:var(--txt);border:1px solid var(--line2);border-radius:6px;padding:5px 7px}
.btn.ghost{background:transparent;border:1px solid var(--line2)}
.pat-abs{font-size:12px;color:var(--txt2);line-height:1.55;margin:8px 0 6px}
.pat-cpc{font-size:10.5px;color:var(--txt3);font-family:var(--mono);margin-bottom:6px}
.pat-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px;align-items:center}
.pat-detail{background:none;border:none;cursor:pointer;padding:0;font:inherit}
.pat-claim{font-size:12px;color:var(--txt2);line-height:1.55;margin-bottom:7px;padding-left:8px;border-left:2px solid var(--line2)}
/* patent list (row-by-row, click → detail) */
.pat-list{display:flex;flex-direction:column;border:1px solid var(--line2);border-radius:12px;overflow:hidden;background:var(--panel)}
.pat-row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid var(--line2);cursor:pointer;transition:background .12s}
.pat-row:last-child{border-bottom:none}
.pat-row:hover{background:var(--panel2)}
.pat-row:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.pat-row-main{flex:1;min-width:0}
.pat-row-h{display:flex;gap:10px;align-items:center;margin-bottom:4px;flex-wrap:wrap}
.pat-row-code{font-family:var(--mono);font-size:11px;color:var(--acc)}
.pat-row-year{font-size:11px;color:var(--txt3)}
.pat-row-asg{font-size:11px;color:var(--txt2)}
.pat-row-title{font-weight:600;font-size:14px;color:var(--txt);line-height:1.4;margin-bottom:4px}
.pat-row-abs{font-size:12px;color:var(--txt3);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pat-row-go{flex:none;font-size:12px;color:var(--acc);white-space:nowrap;font-weight:600}
@media(max-width:600px){.pat-row-go{display:none}}
.pat-row-ctry{font-size:10px;font-weight:700;color:var(--bg);background:var(--txt3);border-radius:4px;padding:1px 5px}
.pat-sel{background:var(--panel2);border:1px solid var(--line2);border-radius:9px;color:var(--txt);font-size:13px;padding:0 10px;flex:none;max-width:170px}
.pat-subfilter{display:flex;align-items:center;gap:8px;margin-top:8px}
/* advanced search panel */
.pat-adv{margin-top:10px;border:1px solid var(--line2);border-radius:10px;background:var(--panel)}
.pat-adv>summary{cursor:pointer;padding:9px 14px;font-size:13px;font-weight:600;color:var(--txt2);list-style:none}
.pat-adv>summary::-webkit-details-marker{display:none}
.pat-adv[open]>summary{border-bottom:1px solid var(--line2)}
.pat-adv-body{padding:14px;display:flex;flex-direction:column;gap:12px}
.adv-field{display:flex;gap:12px;align-items:flex-start}
.adv-field>label{flex:none;width:88px;font-size:12.5px;color:var(--txt3);font-weight:600;padding-top:7px}
.adv-grow{flex:1;min-width:0}
.adv-row{display:flex;gap:7px;margin-bottom:7px;align-items:center}
.adv-row .adv-rv{flex:1}
.adv-row .pat-sel{max-width:120px}
.adv-rx{background:none;border:none;color:var(--txt3);cursor:pointer;font-size:16px;flex:none}
.adv-checks{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:6px}
.adv-chk{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--txt2);cursor:pointer}
.adv-num{max-width:90px}
.adv-actions{display:flex;gap:8px;margin-top:4px}
.search-strategy{margin-bottom:14px;padding:14px}.search-strategy summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;align-items:center}.search-strategy summary small{color:var(--txt3);font-size:11px}.strategy-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}.strategy-grid label{display:flex;flex-direction:column;gap:5px;color:var(--txt2);font-size:12px}.strategy-grid textarea{resize:vertical}.strategy-output{display:flex;flex-direction:column;gap:7px;margin-top:12px}.strategy-output code{display:block;white-space:pre-wrap;overflow-wrap:anywhere;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px;color:var(--acc);font:12px var(--mono)}.strategy-output small{color:var(--txt3)}@media(max-width:700px){.strategy-grid{grid-template-columns:1fr}}
.gate-input{background:var(--panel2);border:1px solid var(--line2);border-radius:8px;color:var(--txt);font-size:13px;padding:7px 10px;width:100%}
.pat-sublabel{font-size:12px;color:var(--txt3);font-weight:600}
.pat-detmeta{font-size:12px;color:var(--txt2);margin-bottom:12px;line-height:1.6;border-bottom:1px solid var(--line);padding-bottom:10px}
/* ---- inline SVG icons (NEXPERT.icon) ---- */
.ic{width:16px;height:16px;display:inline-block;vertical-align:-3px;flex:none}
h4 .ic{width:17px;height:17px;color:var(--acc);vertical-align:-3.5px}
.kpi .k .ic{width:12px;height:12px;vertical-align:-2px;opacity:.75}
/* dedicated patent page */
.pat-pg-hero{background:linear-gradient(135deg,rgba(52,226,196,.07),rgba(91,140,255,.07));border:1px solid var(--line2);border-radius:16px;padding:18px 20px;margin-bottom:14px;position:relative;overflow:hidden}
.hero-wm{position:absolute;right:-16px;top:-20px;width:170px;height:170px;color:var(--acc);opacity:.05;pointer-events:none;transform:rotate(12deg)}
.pp-badges{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:11px}
.pp-badges:empty{display:none}
.pp-badge{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:4px 11px;border-radius:99px;border:1px solid var(--line2);color:var(--txt2);background:rgba(19,26,42,.55)}
.pp-badge .ic{width:13px;height:13px}
.pp-badge.good{color:var(--good);border-color:rgba(74,222,128,.45);background:rgba(74,222,128,.08)}
.pp-badge.acc{color:var(--acc);border-color:rgba(52,226,196,.45);background:rgba(52,226,196,.07)}
.pp-badge.hot{color:var(--warn);border-color:rgba(255,180,84,.5);background:rgba(255,180,84,.08)}
.pp-badge.dim{color:var(--txt3)}
.ego-net .ego-n{cursor:pointer}
.ego-net .ego-n:hover circle{stroke:#fff;stroke-width:1.2}
.ego-net .ego-n:focus-visible circle{stroke:#fff;stroke-width:1.5}
.pat-pg-stats{grid-template-columns:repeat(auto-fit,minmax(128px,1fr));margin-top:10px}
.pat-pg-stats:empty{display:none}
.pat-pg-stats .kpi{background:rgba(19,26,42,.6)}
.pat-pg-stats .kpi .v{font-size:18px}
.pat-desc.rich{white-space:normal}
.pat-desc.rich p{margin:0 0 10px}
.pat-desc.rich p:last-child{margin-bottom:0}
.pat-desc-h{font-weight:700;color:var(--acc);font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin:14px 0 7px;padding-top:10px;border-top:1px dashed var(--line)}
.pat-desc-h:first-child{margin-top:0;padding-top:0;border-top:none}
.chip-lv{display:inline-block;font-style:normal;font-size:8.5px;font-weight:800;letter-spacing:.03em;color:var(--txt3);background:rgba(255,255,255,.06);border-radius:4px;padding:1px 4px;margin-right:5px;vertical-align:1px}
.chip.on .chip-lv{color:var(--acc);background:rgba(52,226,196,.12)}
#pat-pg-tags .chip{cursor:default}
#pat-pg-tags button.chip{cursor:pointer;transition:border-color .15s,color .15s}
#pat-pg-tags button.chip:hover{border-color:var(--acc);color:var(--acc)}
#pat-pg-tags .chip.on{color:var(--acc);border-color:var(--acc);background:rgba(52,226,196,.08)}
.pat-pg-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.pat-pg-actions{display:flex;gap:8px;flex-wrap:wrap}
.coll-star2{font-size:15px;line-height:1;min-width:34px}.coll-star2.on{color:var(--warn);border-color:var(--warn)}
.pat-pg-title{font-size:22px;line-height:1.25;letter-spacing:-0.01em;margin-bottom:8px}
#view-patent .pat-desc{max-height:none}
#pat-pg-similar:empty{display:none}
.sim-row.pat-nav{width:100%;text-align:left;background:none;border:none;border-bottom:1px solid var(--line);cursor:pointer;font:inherit}
.sim-row.pat-nav:hover{background:var(--panel2)}
/* unified search (papers + patents + standards + policies) */
#uni-out:empty{display:none}
.uni-card{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px 22px;margin-bottom:16px;padding-right:38px}
@media(max-width:700px){.uni-card{grid-template-columns:1fr}}
.uni-h{display:flex;align-items:center;gap:8px;font-size:12.5px;margin-bottom:4px}
.uni-row{font-size:12px;color:var(--txt2);padding:3px 0;border-bottom:1px dashed var(--line);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uni-x{position:absolute;top:8px;right:8px}
/* AI briefing */
.brief-h{display:block;font-weight:800;color:var(--acc);margin:10px 0 3px;font-size:13px}
.brief-body{font-size:12.5px;line-height:1.65;color:var(--txt);border:1px solid var(--line)}
/* competitor A vs B */
.vs-mix{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.vs-row{display:grid;grid-template-columns:1fr 118px 1fr;align-items:center;gap:8px;font-size:11px}
.vs-bar{height:8px;background:var(--panel2);border-radius:4px;overflow:hidden;display:flex;justify-content:flex-end}
.vs-bar>span{height:8px;background:var(--acc);border-radius:4px;display:block}
.vs-bar.b{justify-content:flex-start}
.vs-bar.b>span{background:var(--acc2)}
.vs-c{color:var(--txt3);text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* saved / recent patent queries */
#pat-qmem{margin:8px 0 4px}
#pat-qmem:empty{display:none}
.qmem-pair{display:inline-flex;align-items:center;gap:1px}
.qmem-x{background:none;border:none;color:var(--txt3);cursor:pointer;font-size:11px;padding:2px 4px}
.qmem-x:hover{color:var(--bad)}
#pat-fam-wrap.off2{opacity:.42;cursor:not-allowed}
#pro-btn.pro-on{border-color:var(--warn);color:var(--warn)}
.wbadge{display:inline-flex;align-items:center;font-size:9.5px;font-weight:800;color:#04120e;background:var(--warn);border-radius:99px;padding:1px 6px;margin-left:4px;vertical-align:1px}
.fc-n.wnew{color:var(--warn);font-weight:800}
.watch-add{background:var(--panel2);border:1px dashed var(--line2);border-radius:99px;color:var(--txt);font-size:11px;padding:4px 11px;width:150px}
.watch-add:focus{outline:none;border-color:var(--acc)}
/* collection (bookmark) stars + viewer */
.coll-star{background:none;border:none;color:var(--txt3);font-size:15px;cursor:pointer;flex:none;padding:2px 5px;border-radius:6px;align-self:center;line-height:1}
.coll-star:hover{color:var(--warn)}
.coll-star.on{color:var(--warn)}
.coll-row{display:flex;align-items:center;gap:9px;padding:8px 4px;border-bottom:1px solid var(--line);font-size:12.5px}
.coll-row a{flex:1;min-width:0;color:var(--txt);overflow-wrap:anywhere}
.coll-meta{flex:none;font-size:11px;color:var(--txt3);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coll-rm{background:none;border:none;color:var(--txt3);cursor:pointer;font-size:13px;flex:none}
.coll-rm:hover{color:var(--bad)}
/* independent-claim badge */
.clm-ind{display:inline-block;font-size:9px;font-weight:700;color:var(--acc);border:1px solid var(--acc);border-radius:4px;padding:0 4px;margin-left:4px;vertical-align:1px}
.pat-claim.indep{border-left-color:var(--acc)}
/* similar-patent rows in the detail modal (semantic neighbours from Vectorize) */
#pd-similar{margin-top:14px}
#pd-similar:empty{display:none}
.sim-row{display:flex;gap:10px;align-items:flex-start;padding:8px 6px;border-bottom:1px solid var(--line);color:var(--txt);transition:background .12s;border-radius:6px}
.sim-row:hover{background:var(--panel2)}
.sim-score{flex:none;font-family:var(--mono);font-size:11px;font-weight:700;color:var(--acc);min-width:36px;padding-top:1px}
.sim-main{min-width:0}
.sim-main b{display:block;font-size:12.5px;line-height:1.4;font-weight:600}
.sim-meta{display:block;font-size:11px;color:var(--txt3);margin-top:2px;overflow-wrap:anywhere}
.pat-desc{font-size:12.5px;color:var(--txt2);line-height:1.65;max-height:320px;overflow-y:auto;white-space:pre-wrap;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin-bottom:8px}
/* patent intelligence */
.pat-tabs{display:flex;gap:8px;align-items:center;margin-bottom:14px}
.pat-tab{display:inline-flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:7px 15px;cursor:pointer;color:var(--txt2);font-size:13px;font-weight:600}
.pat-tab.on{background:var(--acc);border-color:var(--acc);color:#06121a}
.pat-tab .pt-n{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:var(--panel2);color:var(--txt3);font-size:11px;font-weight:700}
.pat-tab.on .pt-n{background:rgba(6,18,26,.25);color:#06121a}
.pt-arrow{color:var(--txt3);font-size:14px}
.intel-note{font-size:12px;color:var(--txt3);line-height:1.6}
.intel-list{display:flex;flex-direction:column;gap:7px;margin-top:10px}
.intel-row{display:flex;align-items:center;gap:9px;font-size:12.5px}
.intel-rank{flex:none;width:18px;text-align:right;color:var(--txt3);font-family:var(--mono);font-size:11px}
.intel-name{flex:none;width:120px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.intel-bar{flex:1;height:8px;background:var(--panel2);border-radius:4px;overflow:hidden}
.intel-bar>span{display:block;height:8px;background:var(--acc);border-radius:4px}
.intel-val{flex:none;width:96px;text-align:right;color:var(--txt2);font-family:var(--mono);font-size:11px}
.intel-cite{color:var(--acc)}
.lv3-drill{cursor:pointer;border-radius:6px}.lv3-drill:hover{background:var(--panel2)}
.lv3-drill .intel-name{width:230px}
.lv3-g{display:inline-block;padding:1px 5px;border-radius:4px;background:var(--panel2);color:var(--txt3);font-size:10px;margin-right:2px;vertical-align:1px}
@media(max-width:600px){.lv3-drill .intel-name{width:150px}}
.intel-chart{display:flex;align-items:flex-end;gap:6px;height:120px;margin-top:12px;padding:0 4px}
.cbar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.cbar{width:100%;max-width:32px;background:var(--acc);border-radius:4px 4px 0 0;min-height:4px;transition:height .2s}
.cbar-lbl{font-size:10px;color:var(--txt3);margin-top:5px;font-family:var(--mono)}
.intel-pending{font-size:12.5px;color:var(--txt3);background:var(--panel2);border:1px dashed var(--line2);border-radius:8px;padding:14px;margin-top:10px;line-height:1.6}
.intel-scope{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--txt);background:rgba(52,226,196,.08);border:1px solid var(--acc);border-radius:9px;padding:9px 14px;font-weight:600}
.pat-count-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0 12px;flex-wrap:wrap}
/* SVG chart toolkit (NEXPERT.viz) */
.viz-svg{width:100%;height:auto;color:var(--txt2);margin-top:8px}
.visual-export{display:flex;justify-content:flex-end;gap:5px;margin:-2px 0 4px}.visual-export button{border:1px solid var(--line);border-radius:6px;background:var(--panel2);color:var(--txt2);font:600 10px var(--mono);padding:4px 7px;cursor:pointer}.visual-export button:hover{color:var(--accent);border-color:var(--accent)}
.viz-svg-sm{width:130px;height:130px;flex:none}
.viz-donut{display:flex;align-items:center;gap:14px;margin-top:10px;flex-wrap:wrap}
.viz-legend{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--txt2)}
.viz-leg{display:flex;align-items:center;gap:7px}
.viz-leg b{color:var(--txt);font-family:var(--mono);font-size:11px}
.viz-dot{width:10px;height:10px;border-radius:3px;flex:none}
.viz-hbars{display:flex;flex-direction:column;gap:7px;margin-top:10px}
.viz-hbar{display:flex;align-items:center;gap:9px;font-size:12.5px}
.viz-hbar-l{flex:none;width:120px;color:var(--txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.viz-hbar-t{flex:1;height:8px;background:var(--panel2);border-radius:4px;overflow:hidden}
.viz-hbar-t>span{display:block;height:8px;border-radius:4px}
.viz-hbar-v{flex:none;width:60px;text-align:right;color:var(--txt2);font-family:var(--mono);font-size:11px}
@media(max-width:600px){.viz-hbar-l{width:84px}}
.intel-drill{cursor:pointer;border-radius:6px;padding:2px 4px;margin:0 -4px}
.intel-drill:hover{background:var(--panel2)}
/* heatmap */
.viz-heat-wrap{overflow-x:auto}
.viz-heat{display:grid;gap:3px;margin-top:10px;min-width:420px}
.viz-heat-ch{font-size:10px;color:var(--txt3);text-align:center;padding:2px;line-height:1.2}
.viz-heat-rh{font-size:11px;color:var(--txt2);display:flex;align-items:center;padding-right:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:120px}
.viz-heat-cell{height:30px;display:flex;align-items:center;justify-content:center;font-size:10px;color:#06121a;font-weight:600;border-radius:3px;font-family:var(--mono)}
/* treemap (compact) */
.viz-tree{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px}
.viz-tree-tile{min-height:34px;border-radius:7px;padding:5px 9px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:6px;color:#06121a;transition:transform .12s;min-width:84px}
.viz-tree-tile:hover{transform:scale(1.02)}
.viz-tree-tile span{font-size:11px;font-weight:700;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.viz-tree-tile b{font-size:10px;opacity:.8;font-family:var(--mono);flex:none}
/* loading spinner */
.loading{display:flex;align-items:center;gap:10px;color:var(--txt3);font-size:13px;padding:22px 4px}
.spin{width:16px;height:16px;border:2px solid var(--line2);border-top-color:var(--acc);border-radius:50%;animation:spinr .7s linear infinite;flex:none}
@keyframes spinr{to{transform:rotate(360deg)}}
@media(max-width:600px){.intel-name{width:86px}.intel-val{width:70px}}
.search-hint{font-size:11.5px;color:var(--txt3);margin:7px 2px 2px;line-height:1.7}
.search-hint code{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:1px 5px;font-size:11px;color:var(--txt2)}
.rag-src{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.rag-src-h{font-size:11px;text-transform:uppercase;letter-spacing:0.05em;color:var(--txt3);font-weight:700;margin-bottom:8px}
.rag-src-row{font-size:12px;color:var(--txt2);margin-bottom:8px;line-height:1.5}
.rag-src-row a{color:var(--acc)}
.rag-n{font-family:var(--mono);color:var(--txt3);margin-right:4px}
.rag-src-m{font-size:11px;color:var(--txt3);margin-top:1px}
.rag-tag{font-size:9.5px;font-weight:700;text-transform:uppercase;padding:1px 6px;border-radius:5px;border:1px solid transparent}
.rag-paper{color:var(--acc2);border-color:rgba(91,140,255,0.4);background:rgba(91,140,255,0.08)}
.rag-standard{color:var(--good);border-color:rgba(74,222,128,0.4);background:rgba(74,222,128,0.08)}
.rag-policy{color:var(--warn);border-color:rgba(255,180,84,0.4);background:rgba(255,180,84,0.08)}
/* About / company */
.about-list{margin-top:10px;padding-left:0;list-style:none}
.about-list li{font-size:12.5px;color:var(--txt2);line-height:1.6;padding-left:14px;position:relative;margin-bottom:6px}
.about-list li::before{content:"–";position:absolute;left:0;color:var(--acc)}
.opt-w{}
.save-list { display: flex; flex-direction: column; gap: 8px; }
.save-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--panel2); border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px; }
.save-row b { font-size: 13px; } .save-act { display: flex; gap: 6px; }

/* ---- Footer micro-attribution ---- */
.footer .attrib { margin-top: 10px; font-size: 9.5px; color: rgba(107,122,153,0.55); letter-spacing: 0.01em; }
.foot-family { margin-top: 12px; font-size: 11.5px; color: var(--txt3); }
.foot-family a { color: var(--txt2); font-weight: 600; text-decoration: none; }
.foot-family a:hover { color: var(--acc); }
.foot-family .foot-sib { display: block; margin-top: 4px; color: var(--txt3); }
.foot-family .foot-sib a { margin: 0 5px; font-weight: 500; }
.foot-family .foot-cur { color: var(--acc); font-weight: 700; }
.foot-family .foot-soon { margin: 0 5px; color: var(--txt3); opacity: 0.6; cursor: default; }
.foot-grid { display: flex; flex-wrap: wrap; gap: 7px 8px; justify-content: center; margin-top: 10px; }
.foot-grid a { padding: 4px 12px; border: 1px solid var(--line); border-radius: 99px; font-size: 11px; font-weight: 600; color: var(--txt2); transition: border-color .15s, color .15s; }
.foot-grid a:hover { border-color: var(--acc); color: var(--acc); }
.foot-grid a.foot-cur { border-color: var(--acc); color: var(--acc); background: rgba(52,226,196,0.1); }

/* ---- Library ---- */
.lib-tabs button.active { background: var(--acc); color: #04120e; }
.lib-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.lib-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 15px 16px; transition: border-color .15s; }
.lib-card:hover { border-color: var(--line2); }
.lib-card-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.lib-code { font-family: var(--mono); font-size: 12.5px; font-weight: 700; color: var(--acc); }
.lib-body { font-size: 11px; color: var(--txt3); }
.lib-title2 { font-size: 13px; color: var(--txt); }
.lib-scope { font-size: 12.5px; color: var(--txt2); line-height: 1.55; }
.lib-link { display: inline-block; margin-top: 9px; font-size: 11.5px; color: var(--acc2); }
.reg-chip { font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 99px; letter-spacing: 0.02em; }
.reg-global { background: rgba(91,140,255,0.14); color: #8fb0ff; }
.reg-us { background: rgba(91,140,255,0.14); color: #8fb0ff; }
.reg-eu { background: rgba(52,226,196,0.14); color: var(--acc); }
.reg-kr { background: rgba(255,122,89,0.16); color: #ff9a78; }
.reg-jp { background: rgba(255,107,107,0.14); color: #ff8f8f; }
.reg-cn { background: rgba(255,180,84,0.16); color: var(--warn); }
.reg-in { background: rgba(155,140,255,0.16); color: #b3a6ff; }
.live-badge { font-size: 8.5px; font-weight: 800; letter-spacing: 0.06em; padding: 1px 6px; border-radius: 99px; background: var(--acc); color: #04120e; }
.stage-badge { font-size: 9.5px; font-weight: 700; padding: 2px 8px; border-radius: 99px; }
.sg-Materials { background: rgba(255,122,89,0.16); color: var(--cath); }
.sg-Cell { background: rgba(52,226,196,0.14); color: var(--acc); }
.sg-ModulePack { background: rgba(91,140,255,0.16); color: #8fb0ff; }
.sg-Recycling { background: rgba(74,222,128,0.16); color: var(--good); }
.sg-Crosscutting { background: rgba(148,163,184,0.16); color: var(--txt2); }
.std-badge { font-size: 9px; font-weight: 700; padding: 1px 6px; border-radius: 99px; }
.std-badge.mand { background: rgba(255,107,107,0.16); color: var(--bad); }
.std-badge.st-upcoming { background: rgba(52,226,196,0.14); color: var(--acc); }
.std-badge.st-withdrawn { background: rgba(148,163,184,0.16); color: var(--txt3); }
.lib-card.dim { opacity: 0.6; }
.equiv-tbl { font-size: 11.5px; min-width: 640px; }
.equiv-tbl th { white-space: nowrap; }
.equiv-tbl td { vertical-align: top; }
.equiv-tbl td b { color: var(--acc); }
.lib-controls { margin-bottom: 16px; }
.lib-filter { width: 100%; max-width: 420px; background: var(--panel2); border: 1px solid var(--line2); border-radius: 9px; color: var(--txt); font-size: 13px; padding: 9px 12px; margin-bottom: 12px; }
.fline { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.flabel { font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--txt3); font-weight: 700; margin-right: 4px; min-width: 52px; }
.fchip { background: var(--panel2); border: 1px solid var(--line); color: var(--txt2); font-size: 11.5px; font-weight: 600; padding: 4px 11px; border-radius: 99px; }
.fchip:hover { border-color: var(--line2); color: var(--txt); }
.fchip.on { background: var(--acc); color: #04120e; border-color: var(--acc); }
.lib-count { font-size: 11.5px; color: var(--txt3); font-family: var(--mono); margin-top: 6px; }
.lib-topic { font-size: 10px; color: var(--txt3); background: var(--panel2); border: 1px solid var(--line); padding: 1px 7px; border-radius: 99px; margin-left: auto; }
.paper-theme { color: var(--acc); font-weight: 600; }
.paper-cited { color: var(--warn); font-weight: 600; }
.orcid { display: inline-block; font-size: 9px; font-weight: 700; color: #04120e; background: #a6ce39; border-radius: 3px; padding: 0 3px; vertical-align: middle; text-decoration: none; }
.paper-content { font-size: 11.5px; color: var(--txt3); margin-top: 5px; line-height: 1.5; max-width: 92%; }
.s2-btn { background: transparent; border: 1px solid var(--line2); color: var(--acc2); font-size: 10px; font-weight: 600; padding: 0 6px; border-radius: 5px; cursor: pointer; }
.s2-btn:hover { border-color: var(--acc2); } .s2-btn:disabled { opacity: 0.5; }
.s2-graph { margin-top: 6px; font-size: 11.5px; color: var(--acc); font-family: var(--mono); }
.s2-tldr { color: var(--txt2); font-family: var(--sans); margin-top: 3px; line-height: 1.5; }
.tech-filter { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; margin-bottom: 16px; }
.tech-filter .fline { margin-bottom: 7px; }
.tech-filter .fline:last-child { margin-bottom: 0; }
.tech-filter .flabel { min-width: 92px; color: var(--txt2); }
.fc-n { font-size: 9.5px; color: var(--txt3); font-family: var(--mono); margin-left: 2px; }
.fchip.on .fc-n { color: rgba(0,0,0,0.5); }
.pager { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 16px 0 4px; }
.pager .btn[disabled] { opacity: 0.4; pointer-events: none; }
/* news feed */
.news-list { display: flex; flex-direction: column; }
.news-day { font: 700 11px var(--mono); color: var(--txt3); letter-spacing: .08em; padding: 16px 6px 6px; border-bottom: 1px solid var(--line2); }
/* deterministic per-source badge (hue from the source name — no external favicon fetches) */
.news-fav { flex: none; width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; font: 700 12.5px var(--mono); background: hsl(var(--h) 45% 20%); color: hsl(var(--h) 75% 72%); border: 1px solid hsl(var(--h) 45% 30%); }
:root[data-theme="light"] .news-fav { background: hsl(var(--h) 65% 92%); color: hsl(var(--h) 55% 34%); border-color: hsl(var(--h) 50% 80%); }
.news-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 6px; border-bottom: 1px solid var(--line); color: var(--txt); transition: background .12s; }
.news-row:hover { background: var(--panel2); }
.news-main { flex: 1; min-width: 0; }   /* keep titles left-aligned beside the source badge */
.news-main b { font-size: 13.5px; line-height: 1.45; font-weight: 600; }
.news-meta { font-size: 11.5px; color: var(--txt3); margin-top: 4px; }
.news-cat { font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 99px; margin-right: 4px; }
.nc-news { background: rgba(91,140,255,0.16); color: #8fb0ff; }
.nc-paper { background: rgba(52,226,196,0.14); color: var(--acc); }
.nc-policy { background: rgba(255,180,84,0.16); color: var(--warn); }
.news-go { color: var(--txt3); flex-shrink: 0; font-size: 14px; }
.news-row:hover .news-go { color: var(--acc); }
.lib-search { display: flex; gap: 10px; margin-bottom: 18px; }
.lib-search input { flex: 1; background: var(--panel2); border: 1px solid var(--line2); border-radius: 10px; color: var(--txt); font-size: 14px; padding: 11px 14px; }
.paper-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 12px 4px; border-bottom: 1px solid var(--line); }
.paper-main b { font-size: 13.5px; color: var(--txt); line-height: 1.4; }
.paper-meta { font-size: 11.5px; color: var(--txt3); margin-top: 3px; }
.paper-doi { flex-shrink: 0; font-size: 11.5px; font-family: var(--mono); color: var(--acc2); border: 1px solid var(--line2); border-radius: 7px; padding: 4px 9px; align-self: center; }
.paper-doi:hover { border-color: var(--acc2); }

/* ---- AI assistant ---- */
.ai-fab { position: fixed; right: 22px; bottom: calc(22px + env(safe-area-inset-bottom)); z-index: 80; display: flex; align-items: center; gap: 8px;
  background: linear-gradient(135deg, var(--acc), var(--acc2)); color: #04120e; border: 0; font-weight: 700;
  padding: 12px 18px; border-radius: 99px; box-shadow: 0 8px 24px rgba(52,226,196,0.3); font-size: 14px; }
.ai-fab:hover { filter: brightness(1.07); transform: translateY(-1px); }
.ai-fab.hidden { display: none; }
.ai-panel { position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom)); z-index: 90; width: 380px; max-width: calc(100vw - 32px);
  height: 560px; max-height: calc(100vh - 90px); max-height: calc(100dvh - 90px); display: flex; flex-direction: column;
  background: var(--panel); border: 1px solid var(--line2); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; animation: fade .2s ease; }
.ai-panel[hidden] { display: none; }
.ai-head { display: flex; align-items: flex-start; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--line); background: var(--panel2); }
.ai-head b { font-size: 14px; } .ai-subt { font-size: 11px; color: var(--txt3); margin-top: 2px; }
.ai-mode { font-size: 9.5px; font-family: var(--mono); color: var(--warn); border: 1px solid var(--warn); border-radius: 5px; padding: 1px 5px; margin-left: 6px; vertical-align: middle; }
.ai-mode[hidden] { display: none; }
.ai-head-act { display: flex; gap: 4px; }
.ai-x { background: transparent; border: 0; color: var(--txt3); font-size: 15px; padding: 3px 7px; border-radius: 7px; }
.ai-x:hover { color: var(--txt); background: var(--panel); }
.ai-log { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.ai-msg { display: flex; flex-direction: column; gap: 5px; max-width: 88%; }
.ai-msg.user { align-self: flex-end; align-items: flex-end; }
.ai-msg.bot { align-self: flex-start; }
.ai-bubble { font-size: 13px; line-height: 1.55; padding: 10px 13px; border-radius: 13px; }
.ai-msg.user .ai-bubble { background: var(--acc); color: #04120e; border-bottom-right-radius: 4px; }
.ai-msg.bot .ai-bubble { background: var(--panel2); color: var(--txt); border: 1px solid var(--line); border-bottom-left-radius: 4px; }
.ai-bubble code { font-family: var(--mono); font-size: 12px; background: rgba(255,255,255,0.08); padding: 1px 5px; border-radius: 4px; }
.ai-chip { font-size: 11px; color: var(--acc); font-weight: 600; }
.ai-dots { color: var(--txt3); }
.ai-turnstile{padding:0 12px;display:flex;justify-content:center}
.ai-turnstile:empty{display:none}
.ai-input { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--line); align-items: flex-end; }
.ai-input textarea { flex: 1; resize: none; background: var(--panel2); border: 1px solid var(--line2); border-radius: 10px;
  color: var(--txt); font-family: inherit; font-size: 13px; padding: 10px 12px; line-height: 1.4; max-height: 110px; }
.ai-send { background: var(--acc); color: #04120e; border: 0; width: 38px; height: 38px; border-radius: 10px; font-size: 15px; flex-shrink: 0; }
.ai-send:hover { filter: brightness(1.08); }
@media (max-width: 480px) { .ai-panel { right: 8px; bottom: calc(8px + env(safe-area-inset-bottom)); left: 8px; width: auto; height: calc(100vh - 78px); height: calc(100dvh - 78px); } .ai-fab span { display: none; } }

/* ---- Mobile ---- */
@media (max-width: 760px) {
  /* topbar becomes two rows: brand + language on row 1, full-width scrollable tab strip on row 2 */
  .topbar { height: auto; flex-wrap: wrap; padding: 8px max(12px, env(safe-area-inset-right)) 8px max(12px, env(safe-area-inset-left)); gap: 8px 12px; }
  .brand { order: 1; font-size: 16px; }
  .topbar .right { order: 2; margin-left: auto; }
  /* tabs wrap onto multiple rows (robust on Android/iOS); the Simulation dropdown stays a
     normal closed dropdown that opens on tap — no fragile flatten / absolute→static gymnastics */
  .nav { order: 3; flex-basis: 100%; width: 100%; margin-left: 0; flex-wrap: wrap; gap: 4px; }
  .nav button { flex: 0 0 auto; white-space: nowrap; }
  .nav-dd-menu { right: auto; left: 0; }
}
@media (max-width: 600px) {
  .wrap { padding: 16px max(13px, env(safe-area-inset-right)) 64px max(13px, env(safe-area-inset-left)); }
  .section-head { margin-bottom: 14px; }
  .section-head h2 { font-size: 20px; }
  .hero h1 { font-size: 27px; }
  .hero p { font-size: 14px; }
  .cta-band { padding: 22px 20px; text-align: center; justify-content: center; }
  .cta-band h3 { font-size: 20px; }
  .kpi .v { font-size: 20px; }
  #cmp-out { overflow-x: auto; }
  table.tbl { font-size: 12px; }
  table.tbl th, table.tbl td { padding: 7px 8px; }
}

/* ---- Print ---- */
@media print {
  .topbar, .nav, .toolbtns, .lang-select, .cta, .tagrow, .flowmap, .footer, .skip-link, .banner { display: none !important; }
  body { background: #fff; color: #000; }
  .view { display: block !important; }
  .card { border-color: #ccc; break-inside: avoid; }
}
.ws-facets{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 12px}
.ws-facet{flex:1;min-width:130px;background:var(--panel2);border:1px solid var(--line2);border-radius:8px;padding:10px 12px}
.ws-facet b{display:block;font-size:12.5px;margin-bottom:3px}
.ws-facet span{font-size:12px;color:var(--txt2)}
.ws-insight{font-size:13px;line-height:1.6;margin-top:12px;background:var(--panel2);border-left:3px solid var(--acc);border-radius:6px;padding:10px 13px}
.clu-chips{display:flex;flex-wrap:wrap;gap:7px}
.clu-chips .fchip{cursor:pointer}
[dir="rtl"] table.tbl td.num,[dir="rtl"] .mono,[dir="rtl"] .lib-count,[dir="rtl"] .viz-svg text{direction:ltr;unicode-bidi:embed}
[dir="rtl"] .topbar,[dir="rtl"] .nav{direction:rtl}
.cmp-delta{font-size:9.5px;font-weight:700;margin-top:2px;line-height:1}
.cmp-delta.up{color:var(--good)}
.cmp-delta.down{color:var(--bad)}
.cmp-note{font-size:11px;color:var(--txt3);margin:9px 0 2px}
#undo-btn,#redo-btn{font-size:15px;min-width:34px}
#undo-btn:disabled,#redo-btn:disabled{opacity:.35;cursor:default}
[dir="rtl"] .topbar .right{margin-left:0;margin-right:auto}
[dir="rtl"] .cmp-delta{direction:ltr}
.val-suite td>div:first-child{font-weight:600}
.vs-lit{font-size:10px;margin-top:2px;line-height:1.2}
.vs-lit.ok{color:var(--good)}
.vs-lit.off{color:var(--warn)}
[dir="rtl"] .val-suite td.num,[dir="rtl"] .vs-lit{direction:ltr}
.q-why{margin-top:3px;font-size:11px;color:var(--txt3);font-family:var(--mono)}
.ws-badge{flex:none;font-size:10.5px;padding:1px 7px;border-radius:9px;margin-left:6px;white-space:nowrap}
.ws-hot{background:rgba(255,140,60,.14);color:var(--warn)}
.ws-cold{background:var(--panel2);color:var(--txt3)}
.tk-list{margin:10px 0 2px;padding-left:20px;display:flex;flex-direction:column;gap:7px;font-size:13px;line-height:1.55;color:var(--txt2)}
.tk-list li::marker{color:var(--acc)}
.paper-row.has-abs{cursor:pointer}
.paper-row.has-abs .paper-content{display:none}
.paper-row.has-abs.open .paper-content{display:block}
.abs-chip{font-size:10.5px;padding:1px 8px;border-radius:9px;background:var(--panel2);color:var(--txt2);border:1px solid var(--line);cursor:pointer;margin-left:8px;vertical-align:1px}
.abs-chip:hover{color:var(--txt)}

/* ---- Line-wrapping / mobile hardening ---- */
/* Korean: never break inside a word (keep-all), but still allow an emergency break when a
   token would otherwise overflow (anywhere). zh/ja keep default CJK breaking. */
:lang(ko){word-break:keep-all;overflow-wrap:anywhere}
body{overflow-wrap:break-word}
/* unbreakable tokens (DOIs, patent numbers, URLs) must never push the layout sideways */
.rag-src-row,.rag-src-m,.paper-meta,.pat-detmeta,.lib-scope,.news-meta{overflow-wrap:anywhere}
.card h4{flex-wrap:wrap}                    /* long subtitle wraps under the title, not squeezed beside it */
.lib-search input{min-width:0}              /* flex inputs may shrink below their intrinsic size */
.adv-row .adv-rv{min-width:0}
.copilot-out .ai-bubble{overflow-wrap:anywhere}
@media(max-width:600px){
  /* iOS Safari auto-zooms focused inputs under 16px — keep text inputs at 16px on phones */
  .lib-search input,.lib-filter,.gate-input,.copilot-row input,.ai-input textarea,.fit-ta{font-size:16px}
  .lib-search{flex-wrap:wrap}
  .lib-search .pat-sel{flex:1 1 100%;max-width:none}   /* field selector gets its own row */
  .adv-field{flex-direction:column;gap:6px}
  .adv-field>label{width:auto;padding-top:0}
  .card{overflow-x:auto}                    /* wide tables scroll inside the card, never the page */
  .modal-overlay{padding:10px}
  .modal{max-width:none}                    /* patent detail reads full-width on phones */
  .paper-content{max-width:100%}
}
.cell-section-card{grid-column:1/-1}.cell-section-svg{display:block;width:100%;max-height:360px}.cell-layer{cursor:pointer;outline:none}.cell-layer:hover rect,.cell-layer:focus rect{filter:brightness(1.18);stroke:var(--acc,#34e2c4);stroke-width:4}.cell-layer.active rect{stroke:#fff;stroke-width:5}
.cell-viz-head{gap:12px;align-items:center}.cell-viz-head h4{margin:0}.cell-viz-toggle{flex:0 0 auto}.cell-exploded-svg{display:block;width:100%;max-height:430px}.cell-exploded-svg .cell-layer:hover polygon,.cell-exploded-svg .cell-layer:focus polygon,.cell-exploded-svg .cell-layer.active polygon{stroke:#fff;stroke-width:4;filter:brightness(1.12)}@media(max-width:650px){.cell-viz-head{align-items:flex-start;flex-direction:column}.cell-viz-toggle{align-self:stretch}.cell-viz-toggle button{flex:1}}
.process-sankey-svg{display:block;width:100%;max-height:390px;overflow:visible}.process-node{cursor:pointer;outline:none}.process-node:hover rect,.process-node:focus rect,.process-node.active rect{stroke:#fff;stroke-width:4;filter:brightness(1.12)}
.ternary-card{margin-top:18px}.ternary-svg{display:block;width:100%;max-height:520px}.ternary-point{cursor:pointer;outline:none}.ternary-point:hover circle,.ternary-point:focus circle,.ternary-point.active circle{stroke:#fff;stroke-width:4;filter:brightness(1.15)}
.tech-network-card{margin-top:18px}.tech-network-svg{display:block;width:100%;max-height:470px}.tech-node{cursor:pointer;outline:none}.tech-node:hover circle,.tech-node:focus circle,.tech-node.active circle{stroke:#fff;stroke-width:4;filter:brightness(1.12)}.tech-edge{transition:opacity .18s}.tech-network-svg:has(.tech-node.active) .tech-edge{opacity:.16}.tech-network-svg .tech-edge.active{opacity:.9;stroke-width:4}
.crystal-card{margin-top:18px}.crystal-particle-svg{display:block;width:100%;max-height:470px}.crystal-atom,.crystal-surface{cursor:pointer;outline:none}.crystal-atom:hover circle,.crystal-atom:focus circle,.crystal-atom.active circle,.crystal-surface:hover ellipse,.crystal-surface:focus ellipse,.crystal-surface.active ellipse{stroke:#fff;stroke-width:4;filter:brightness(1.15)}
.trust-head{align-items:center;gap:12px}.trust-head h4{margin:0}.trust-score{display:flex;align-items:center;gap:14px;margin:14px 0;padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}.trust-score .score{font-size:30px;font-weight:850;line-height:1}.trust-score .grade{font-weight:800}.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0}.trust-metric{border:1px solid var(--line);border-radius:10px;padding:11px}.trust-metric .tm-head{display:flex;justify-content:space-between;gap:8px;font-size:11px}.trust-metric .tm-range{font-size:15px;font-weight:800;margin:7px 0}.trust-metric .tm-track{height:6px;background:var(--line);border-radius:5px;overflow:hidden}.trust-metric .tm-track i{display:block;height:100%;border-radius:5px}.trust-check{display:grid;grid-template-columns:22px minmax(130px,.7fr) 1.6fr;gap:8px;align-items:start;padding:7px 2px;border-top:1px solid var(--line);font-size:11px}.trust-check .ok{color:var(--good)}.trust-check .warn{color:var(--warn)}.trust-check .bad{color:var(--bad)}@media(max-width:800px){.trust-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.trust-grid{grid-template-columns:1fr}.trust-head{align-items:flex-start;flex-direction:column}.trust-check{grid-template-columns:22px 1fr}.trust-check span:last-child{grid-column:2}}