/* Districthive Research Labs, in the family of the AI operations dashboard.
   Tokens and the top bar mirror ai/web/theme; the research classes below keep
   their names so every page and app.js work unchanged. Dark only, like the labs. */
:root{
  --brand-yellow:#ffd701; --brand-orange:#ef987c; --brand-dark:#212325;
  --surface-page:oklch(0.145 0 0); --surface-raised:oklch(0.205 0 0); --surface-sunken:oklch(0.145 0 0); --surface-inverse:oklch(0.985 0 0);
  --text-primary:oklch(0.985 0 0); --text-secondary:oklch(0.8 0 0); --text-muted:oklch(0.708 0 0); --text-inverse:oklch(0.145 0 0);
  --border-default:oklch(1 0 0 / 10%); --border-strong:oklch(1 0 0 / 20%);
  --state-ok:#4ade80; --state-ok-bg:#052e16; --state-warn:#fb923c; --state-warn-bg:#431407; --state-bad:#f87171; --state-bad-bg:#450a0a; --state-info:#60a5fa; --state-info-bg:#172554; --state-idle:#a1a1aa; --state-idle-bg:#27272a;
  --accent:oklch(0.922 0 0); --accent-contrast:oklch(0.205 0 0); --link:var(--brand-yellow); --link-hover:#ffffff;
  --chart-accent:#b08d00; --meter-track:#3a3520;
  --font-ui:-apple-system,"Inter",BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-data:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
  --size-100:.75rem; --size-200:.8125rem; --size-300:.875rem; --size-400:1rem; --size-600:1.25rem; --size-800:1.75rem; --size-900:2.25rem;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --radius:.625rem; --shadow:0 1px 2px rgba(0,0,0,.3);
  /* research aliases: the old names, mapped onto the family tokens */
  --ground:var(--surface-page); --surface:var(--surface-raised); --panel:oklch(0.235 0 0); --line:var(--border-default);
  --ink:var(--text-primary); --ink2:var(--text-secondary); --ink3:var(--text-muted);
  --good:var(--state-ok); --warn:var(--state-warn); --serious:#ef987c; --crit:var(--state-bad);
  --s1:#3987e5; --s2:#d95926; --s3:#199e70; --s4:#c98500; --s5:#d55181; --s6:#008300; --s7:#9085e9; --s8:#e66767;
}
*,*::before,*::after{box-sizing:border-box} html{color-scheme:dark}
body{margin:0;background:var(--surface-sunken);color:var(--text-primary);font:var(--size-300)/1.5 var(--font-ui);-webkit-font-smoothing:antialiased}
a{color:var(--link);text-decoration:underline;text-underline-offset:2px} a:hover{color:var(--link-hover)}
.wrap{max-width:1180px;margin:0 auto;padding:var(--space-5) var(--space-4) var(--space-6)}

/* top bar and tab row, as on the dashboard */
.topbar{display:flex;align-items:baseline;gap:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--border-default)}
.topbar h1{margin:0;font-size:var(--size-600);font-weight:600;letter-spacing:-.01em}
.topbar h1 a{color:inherit;text-decoration:none}
.topbar h1 .logo{display:inline-block;vertical-align:-4px;margin-right:var(--space-2);color:var(--text-primary)}
.topbar h1 .logo svg{width:22px;height:23px;display:block}
.topbar .clock{margin-left:auto;color:var(--text-muted);font:var(--size-200)/1 var(--font-data)}
.topbar .who{color:var(--text-muted);font:var(--size-200)/1 var(--font-data)}
nav.sections{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1);margin:var(--space-4) 0 var(--space-5)}
nav.sections a{padding:var(--space-2) var(--space-3);border-radius:var(--radius);color:var(--text-secondary);text-decoration:none;font-weight:500;white-space:nowrap}
nav.sections a[aria-current="page"]{background:var(--surface-raised);color:var(--text-primary);box-shadow:var(--shadow)}
nav.sections a[target="_blank"]::after{content:" \2197";color:var(--text-muted);font-size:var(--size-100)}
nav.sections details{position:relative;display:block;margin:0;padding:0;font-size:inherit;line-height:inherit}
nav.sections summary{list-style:none;cursor:pointer;display:block;padding:var(--space-2) var(--space-3);border-radius:var(--radius);color:var(--text-secondary);font-weight:500;white-space:nowrap}
nav.sections summary::-webkit-details-marker{display:none}
nav.sections summary::after{content:" \25BE";color:var(--text-muted);font-size:var(--size-100)}
nav.sections details[open] summary,nav.sections summary.on{background:var(--surface-raised);color:var(--text-primary);box-shadow:var(--shadow)}
nav.sections .menu{position:absolute;z-index:20;min-width:200px;margin-top:4px;padding:var(--space-2);border-radius:var(--radius);background:var(--surface-raised);box-shadow:var(--shadow);border:1px solid var(--border-default);display:grid}
nav.sections .menu a{display:block}

main{padding:0}
h1{font-size:var(--size-600);margin:0 0 var(--space-1);font-weight:600;letter-spacing:-.01em}
h2{font-size:var(--size-300);margin:var(--space-5) 0 var(--space-3);color:var(--text-secondary);font-weight:600}
.lede{color:var(--text-secondary);max-width:900px;margin:0 0 var(--space-4)}
.badge{display:inline-flex;align-items:center;gap:var(--space-2);font:500 var(--size-200)/1.6 var(--font-ui);padding:var(--space-1) var(--space-3);border-radius:999px;vertical-align:middle}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.badge-live{background:var(--state-ok-bg);color:var(--state-ok)}
.badge-ph{background:var(--state-warn-bg);color:var(--state-warn)}
.grid{display:grid;gap:var(--space-4)}
.grid.cols3{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.grid.cols2{grid-template-columns:repeat(auto-fill,minmax(440px,1fr))}
.card{background:var(--surface-raised);border:1px solid var(--border-default);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-4)}
.card h3{margin:0 0 var(--space-1);font-size:var(--size-300);font-weight:600;color:var(--text-secondary)}
.kv{font-size:var(--size-200);color:var(--text-muted)}
.big{font-size:var(--size-800);font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin:var(--space-1) 0 2px;line-height:1.1}
.unit{font-size:var(--size-200);color:var(--text-muted);margin-left:4px}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.statustext{font-size:var(--size-100);color:var(--text-secondary);font-family:var(--font-data)}
.chart{width:100%;height:220px;margin-top:var(--space-2)}
.chart.tall{height:320px}
svg text{fill:var(--text-muted);font-size:10px}
.gridline{stroke:var(--border-default);stroke-width:1}
.axis{stroke:var(--text-muted);stroke-width:1}
table.data{width:100%;border-collapse:collapse;font-size:var(--size-200);margin-top:var(--space-2)}
table.data th{text-align:left;color:var(--text-secondary);font-weight:600;border-bottom:1px solid var(--border-default);padding:var(--space-2) var(--space-3);font-size:var(--size-200)}
table.data td{border-bottom:1px solid var(--border-default);padding:var(--space-2) var(--space-3);font-variant-numeric:tabular-nums}
.instcard{border-left:3px solid var(--chart-accent);background:var(--panel);padding:var(--space-3) var(--space-4);margin-top:var(--space-4);border-radius:0 var(--radius) var(--radius) 0}
.instlabel{font-size:var(--size-100);color:var(--text-muted);font-family:var(--font-data)}
.instname{font-weight:600;margin:2px 0}
.instmeta{font-size:var(--size-200);color:var(--text-secondary)}
.note{font-size:var(--size-200);color:var(--text-muted);max-width:860px}
.exploratory{border:1px dashed var(--state-warn);color:var(--state-warn);font:500 var(--size-100)/1.6 var(--font-data);padding:var(--space-1) var(--space-3);border-radius:999px;display:inline-block;margin:0 0 var(--space-3)}
.controls{display:flex;gap:var(--space-3);flex-wrap:wrap;align-items:end;margin:var(--space-3) 0}
.controls label{font-size:var(--size-100);color:var(--text-muted);display:block;margin-bottom:3px}
select,input[type=date],input[type=text],input[type=password],input[type=range]{background:var(--surface-sunken);color:var(--text-primary);border:1px solid var(--border-strong);border-radius:var(--radius);padding:var(--space-2) var(--space-3);font:inherit}
button,.btn{background:var(--accent);color:var(--accent-contrast);border:0;border-radius:var(--radius);padding:var(--space-2) var(--space-4);font:600 var(--size-200)/1.6 var(--font-ui);cursor:pointer}
button.ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border-strong)}
.legend{display:flex;gap:var(--space-4);flex-wrap:wrap;font-size:var(--size-200);color:var(--text-secondary);margin-top:var(--space-2)}
.legend .sw{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.tip{position:fixed;pointer-events:none;background:var(--surface-raised);border:1px solid var(--border-strong);padding:var(--space-2) var(--space-3);border-radius:var(--radius);font-size:var(--size-200);display:none;z-index:99;box-shadow:var(--shadow)}
.foot{border-top:1px solid var(--border-default);margin-top:var(--space-6);padding:var(--space-5) 0;color:var(--text-muted);font-size:var(--size-200)}
.footline{margin-bottom:4px}.footco{font-size:var(--size-100);color:var(--text-muted);margin-top:2px}
.camtile{position:relative;aspect-ratio:16/10;background:linear-gradient(135deg,oklch(0.24 0.01 160),oklch(0.16 0 0));border:1px solid var(--border-default);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:var(--size-200)}
.camlabel{position:absolute;left:10px;bottom:8px;font-size:var(--size-100);color:var(--text-secondary)}
.camlive{position:absolute;right:10px;top:8px}
.healthbar{display:flex;gap:2px;margin-top:6px}
.healthbar i{flex:1;height:14px;border-radius:2px;background:var(--panel)}
.risk{font-size:var(--size-100);font-family:var(--font-data)}
.alert{border:1px solid var(--state-bad);background:var(--state-bad-bg);color:var(--text-primary);padding:var(--space-3) var(--space-4);border-radius:var(--radius);margin-bottom:var(--space-4);font-size:var(--size-200)}

.hero{position:relative;height:48vh;min-height:320px;margin:0 0 var(--space-5);border-radius:var(--radius);overflow:hidden;background:var(--surface-raised) center/cover no-repeat;display:flex;align-items:flex-end}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.3) 55%,oklch(0.145 0 0 / .96) 100%)}
.heroinner{position:relative;z-index:2;padding:0 var(--space-5) var(--space-5);width:100%}
.herotitle{font-size:clamp(26px,4vw,44px);font-weight:600;letter-spacing:-.01em;margin:0}
.herosub{color:var(--text-secondary);font-size:var(--size-300);margin-top:6px;max-width:760px}
.herobadges{margin-top:var(--space-3);display:flex;gap:var(--space-2);flex-wrap:wrap}
.mapwrap{border:1px solid var(--border-default);border-radius:var(--radius);overflow:hidden;background:var(--surface-raised)}
.mapwrap iframe{display:block;width:100%;height:420px;border:0;filter:grayscale(1) invert(1) contrast(1.15) brightness(.9)}
.locgrid{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-4);align-items:start}
@media(max-width:1000px){.locgrid{grid-template-columns:1fr}}
.factrow{display:flex;justify-content:space-between;gap:var(--space-4);border-bottom:1px solid var(--border-default);padding:6px 0;font-size:var(--size-200)}
.factrow b{font-weight:600;color:var(--text-secondary);white-space:nowrap}
.factrow span{text-align:right}

.askpanel{background:var(--surface-raised);border:1px solid var(--border-default);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-5) var(--space-5) var(--space-4);margin:var(--space-2) 0 var(--space-4)}
.asklabel{font-size:var(--size-100);color:var(--text-muted);font-family:var(--font-data);margin-bottom:var(--space-2)}
.askinput{width:100%;font-size:var(--size-400);padding:var(--space-3) var(--space-4);background:var(--surface-sunken);border:1px solid var(--border-strong);border-radius:var(--radius);color:var(--text-primary)}
.askinput:focus{outline:none;border-color:var(--brand-yellow);box-shadow:0 0 0 3px rgba(255,215,1,.15)}
.askrow{display:flex;gap:var(--space-3);align-items:stretch}
.askrow button{font-size:var(--size-300);padding:0 var(--space-5)}
.scopeline{display:flex;gap:var(--space-4);flex-wrap:wrap;align-items:center;margin-top:var(--space-3);font-size:var(--size-200);color:var(--text-secondary)}
.scopeline .dotl{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:1px}
.grimnirquote{border-left:3px solid var(--brand-yellow);background:var(--panel);border-radius:0 var(--radius) var(--radius) 0;padding:var(--space-4) var(--space-5);margin:var(--space-4) 0}
.grimnirquote .speaker{display:flex;gap:var(--space-3);align-items:baseline;margin-bottom:var(--space-2)}
.grimnirquote .speaker b{font-size:var(--size-200)}
.grimnirquote .modelchip{font:var(--size-100)/1.6 var(--font-data);color:var(--text-muted);border:1px solid var(--border-default);border-radius:999px;padding:1px 8px}
.grimnirquote p.answer{font-size:var(--size-400);line-height:1.7;margin:0 0 6px;max-width:960px;color:var(--text-primary)}
@media(max-width:900px){.topbar{flex-wrap:wrap}.topbar .clock{margin-left:0}}

/* species page */
.spstats{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0 0 var(--space-4)}
.spstat{display:flex;flex-direction:column;min-width:110px;padding:var(--space-3) var(--space-4);border-radius:var(--radius);background:var(--surface-raised);border:1px solid var(--border-default);text-decoration:none;color:var(--text-secondary)}
.spstat b{font:600 var(--size-800)/1.1 var(--font-data);color:var(--text-primary)} .spstat span{font-size:var(--size-200)} a.spstat:hover{border-color:var(--border-strong);color:var(--text-primary)}
.spnow{margin:0 0 var(--space-5)}
.spmonths{display:flex;flex-wrap:wrap;gap:var(--space-1);margin:0 0 var(--space-3)}
.spmonths button{background:var(--surface-sunken);color:var(--text-secondary);border:1px solid var(--border-default);padding:var(--space-1) var(--space-3);font-weight:500}
.spmonths button.now{border-color:var(--brand-yellow)} .spmonths button.on{background:var(--accent);color:var(--accent-contrast)}
.spchips{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.spchip{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-3) var(--space-1) var(--space-1);border-radius:999px;background:var(--surface-sunken);border:1px solid var(--border-default);color:var(--text-primary);text-decoration:none;font-size:var(--size-200)}
.spchip img{width:26px;height:26px;border-radius:50%;object-fit:cover} .spchip em{font-style:normal;color:var(--state-ok);font-size:var(--size-100)} .spchip.breeding{border-color:var(--state-ok)} .spchip:hover{border-color:var(--border-strong)}
.spfilter{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center;margin:0 0 var(--space-4);position:sticky;top:0;z-index:5;padding:var(--space-2) 0;background:var(--surface-sunken)}
.spfilter button{background:var(--surface-raised);color:var(--text-secondary);border:1px solid var(--border-default)} .spfilter button.on{background:var(--accent);color:var(--accent-contrast)} .spfilter button span{opacity:.7;font-weight:400}
.spfilter input{margin-left:auto;min-width:200px}
h2.spgroup{margin:var(--space-6) 0 var(--space-3);font-size:var(--size-600);font-weight:600} h2.spgroup .kv{font-weight:400}
.spgrid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.spcard{padding:0;overflow:hidden;display:flex;flex-direction:column}
.spimg{margin:0;position:relative;aspect-ratio:4/3;background:var(--surface-sunken)} .spimg img{width:100%;height:100%;object-fit:cover;display:block}
.spimg figcaption{position:absolute;right:0;bottom:0;padding:2px 8px;font-size:10px;color:#fff;background:rgba(0,0,0,.55);border-top-left-radius:6px}
.spimg-none{display:flex;align-items:center;justify-content:center;font:600 var(--size-900)/1 var(--font-data);color:var(--text-muted)}
.spbody{padding:var(--space-4)} .spbody h3{font-size:var(--size-600);color:var(--text-primary);margin-bottom:2px}
.spnames{color:var(--text-muted);font-size:var(--size-200);margin-bottom:var(--space-2)}
.spstatus{margin:0 0 var(--space-2)}
.splabel{margin:var(--space-3) 0 var(--space-1);font:600 var(--size-100)/1 var(--font-data);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.spfacts{margin:0;padding-left:18px;color:var(--text-secondary);font-size:var(--size-200)} .spfacts li{margin:2px 0} .spabout{color:var(--text-secondary)}
.spref{color:var(--text-muted);font:var(--size-100)/1 var(--font-data);white-space:nowrap}
.spstrip{display:grid;grid-template-columns:repeat(12,1fr);gap:2px}
.spstrip span{display:block;text-align:center;font:var(--size-100)/2 var(--font-data);color:var(--text-muted);background:var(--surface-sunken);border-radius:3px}
.spstrip span.p{background:var(--meter-track);color:var(--text-primary)} .spstrip span.b{background:var(--state-ok-bg);color:var(--state-ok);font-weight:600}
.spcons{margin-top:var(--space-2);color:var(--state-warn)}
.spshot{padding:0;overflow:hidden} .spshot img{width:100%;display:block} .spshot figcaption{padding:var(--space-3) var(--space-4);font-size:var(--size-200);color:var(--text-secondary)} .spshot .kv{display:block}
/* species: the year */
.spyear{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:var(--space-4);margin:0 0 var(--space-4)}
.spyear-panel{background:var(--surface-raised);border:1px solid var(--border-default);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-3) var(--space-3) var(--space-2)}
.spyear-head{display:flex;align-items:baseline;justify-content:space-between} .spyear-head h3{margin:0;font-size:var(--size-300);color:var(--text-primary)}
.spyear-legend{display:flex;gap:var(--space-3);margin:2px 0 4px;font-size:var(--size-100);color:var(--text-muted)} .spyear-legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:4px;vertical-align:-1px}
.spyear-svg{width:100%;height:auto;display:block}
.spyear-val{font:9px var(--font-data);fill:var(--text-secondary);text-anchor:middle} .spyear-m{font:10px var(--font-data);fill:var(--text-muted);text-anchor:middle} .spyear-m.now{fill:var(--text-primary);font-weight:600}
.spyear-table{margin:0 0 var(--space-5)} .spyear-table summary{cursor:pointer;color:var(--text-muted);font-size:var(--size-200)} .spyear-table table{margin-top:var(--space-2)} .spyear-table td,.spyear-table th{text-align:center;font:var(--size-200)/1.4 var(--font-data);padding:2px 6px} .spyear-table td:first-child,.spyear-table th:first-child{text-align:left;font-family:var(--font-ui)}
.sptl-grid{margin:0 0 var(--space-4)} .sptl-grid .card h3{margin-bottom:2px}
.sptl{display:grid;gap:2px;margin-top:var(--space-2)}
.sptl-row{display:grid;grid-template-columns:minmax(120px,1.6fr) repeat(12,1fr);gap:2px;align-items:center}
.sptl-row a{font-size:var(--size-200);color:var(--text-secondary);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:6px} .sptl-row a:hover{color:var(--text-primary)}
.sptl-row span{display:block;height:14px;border-radius:3px;background:var(--surface-sunken)}
.sptl-row span.p{background:color-mix(in srgb,var(--c) 38%,transparent)} .sptl-row span.b{background:var(--c)} .sptl-row span.now{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.sptl-head span{background:none;height:auto;text-align:center;font:10px var(--font-data);color:var(--text-muted)} .sptl-head span.now{color:var(--text-primary);font-weight:600;box-shadow:none}
.sptl-plants{margin:0 0 var(--space-5)} .sptl-plants summary{cursor:pointer;color:var(--text-secondary)} .sptl-plants .sptl-row a{color:var(--text-muted)}
/* species: since the baseline */
.spcmp{margin:0 0 var(--space-4)} .spcmp .spyear-head h3{margin:0}
.spcmp-tl .sptl-row{grid-template-columns:minmax(120px,1.6fr) repeat(12,1fr) minmax(150px,1.8fr)}
.spcmp-tl .sptl-row span.seen{position:relative} .spcmp-tl .sptl-row span.seen i{position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.45)}
.sptl-status{background:none!important;height:auto!important;font:var(--size-100)/1.4 var(--font-data);color:var(--text-muted);white-space:nowrap;padding-left:6px} .sptl-status.ok{color:var(--state-ok)}
.sptl-head .sptl-status{text-align:left}
.spdays{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--space-2);margin:var(--space-2) 0}
.spday{padding:var(--space-2) var(--space-3);border-radius:var(--radius);background:var(--surface-sunken);border:1px solid var(--border-default);font-size:var(--size-200);display:flex;flex-direction:column;gap:2px} .spday b{font-family:var(--font-data);color:var(--text-primary)} .spday span{color:var(--text-muted)} .spday em{font-style:normal;color:#3987e5;font-family:var(--font-data)}
.spcmp-tl .sptl-row span.ring{position:relative} .spcmp-tl .sptl-row span.ring u{position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-6px 0 0 -6px;border:2px solid #3987e5;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.5)} .spcmp-tl .sptl-row span.seen.ring i{margin-left:1px}

/* Code tab (WEB-001) */
.code-stamp .big{font-family:var(--font-data);font-size:var(--size-600);color:var(--text-primary);margin:var(--space-1) 0}
.code-sha code,.code-stamp code{font-family:var(--font-data);font-size:var(--size-100);word-break:break-all;color:var(--text-secondary)}
.code-fns,.code-pages{margin:var(--space-2) 0;line-height:1.9}
.code-view{padding:0;overflow-x:auto;margin-top:var(--space-3)}
.code-view table{border-collapse:collapse;width:100%;font:var(--size-200)/1.55 var(--font-data)}
.code-view td{padding:0 var(--space-3);vertical-align:top;white-space:pre}
.code-view td.ln{width:1%;text-align:right;color:var(--text-muted);user-select:none;border-right:1px solid var(--border-default);background:var(--surface-sunken)}
.code-view td.ln a{color:inherit;text-decoration:none}
.code-view tr.hl td{background:oklch(0.35 0.08 95 / 45%)}
.code-view tr:target td{background:oklch(0.35 0.08 95 / 45%)}
.code-view code{font:inherit;color:#e6edf3}
.code-snip{font-family:var(--font-data);font-size:var(--size-100);white-space:pre-wrap}
.code-how p{font-size:var(--size-300);color:var(--text-secondary);margin:var(--space-2) 0}
.code-how summary{cursor:pointer;color:var(--text-primary)}
.code-dir table.data td:first-child{word-break:break-all}
.code-hash{font-size:var(--size-100)}