/* palette: the dyes of the subcontinent — indigo, turmeric, madder — on cool library-card paper */
:root{
  --ground:#F1F2EF; --surface:#FBFBF9; --ink:#1C2430; --muted:#5E6875; --rule:#D5D9D6;
  --indigo:#2B3A8C; --turmeric:#B87A0C; --madder:#A23246; --teal:#3F7F78; --grey:#8A929B;
  --node:#1C2430; --halo:#F1F2EF; --land:#E2E5DF; --on-bar:#FBFBF9;
  /* colour = field of study, everywhere */
  --f-indology:#2B3A8C; --f-buddhist_studies:#B87A0C; --f-tibetology:#A23246; --f-computational:#1F8A70; --f-sinology:#3F7F78; --f-japanology:#7A4E9C;
  --f-iranian_central_asian:#5C7F2B; --f-linguistics:#2F7FA8; --f-religious_studies:#B0582A; --f-philosophy:#6B6F7A;
  --f-history_archaeology:#8C6D3F; --f-other:#9AA0A6;
  --ui:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
}
@media (prefers-color-scheme: dark){
  :root{
    --ground:#11151B; --surface:#181D25; --ink:#E6E8EA; --muted:#98A2AE; --rule:#2A313B;
    --indigo:#97A3F5; --turmeric:#E3AE45; --madder:#E8889A; --teal:#6FBFB5; --grey:#6B7480;
    --node:#D9DDE2; --halo:#11151B; --land:#1D242D; --on-bar:#11151B;
    --f-indology:#97A3F5; --f-buddhist_studies:#E3AE45; --f-tibetology:#E8889A; --f-computational:#5FD3B3; --f-sinology:#6FBFB5; --f-japanology:#B99AE0;
    --f-iranian_central_asian:#A5C76A; --f-linguistics:#7CC0E6; --f-religious_studies:#E89C6E; --f-philosophy:#A3A8B5;
    --f-history_archaeology:#C9AE7C; --f-other:#6B7480;
  }
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--ground);color:var(--ink);font-family:var(--ui);font-size:14px;line-height:1.45}
button,input,select{font:inherit;color:inherit}
a{color:var(--indigo)}
:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}
[hidden]{display:none!important}

.app{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr) 400px}
.bar{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;padding:10px 18px;border-bottom:1px solid var(--rule);background:var(--surface)}
.bar h1{font-family:var(--serif);font-weight:500;font-size:22px;letter-spacing:-.01em;margin:0;white-space:nowrap}
.bar h1 em{font-style:italic;color:var(--indigo)}
.tabs{display:flex;gap:2px}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:6px 10px;cursor:pointer;color:var(--muted);font-weight:500}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--indigo)}
.search{flex:1 1 180px;max-width:300px;position:relative}
.suggest{position:absolute;z-index:20;left:0;right:0;top:100%;margin:2px 0 0;padding:4px;list-style:none;background:var(--surface);border:1px solid var(--rule);border-radius:3px;box-shadow:0 6px 20px rgb(0 0 0/.12);max-height:60vh;overflow:auto}
.suggest button{display:flex;gap:7px;align-items:baseline;width:100%;text-align:left;background:none;border:0;padding:5px 7px;cursor:pointer;border-radius:2px}
.suggest button:hover,.suggest li:first-child button{background:var(--ground)}
.suggest .none{padding:5px 7px;color:var(--muted)}
#lens{font-weight:500}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none;align-self:center}
.dot.sq{border-radius:1px;background:var(--grey)}
.dot.ring{background:none;border:2px solid var(--f-buddhist_studies)}
.legend{position:absolute;left:12px;bottom:10px;display:flex;flex-wrap:wrap;gap:3px 12px;max-width:calc(100% - 70px);font-size:12px;color:var(--muted);pointer-events:none}
.legend.inline{position:static;margin:4px 0 8px;pointer-events:auto}
.swatch-l{flex:none}
.fields-scroll{height:100%;overflow:auto;padding:18px 20px 40px}
.fields-scroll h2{font-family:var(--serif);font-weight:500;font-size:24px;margin:0 0 6px}
.fields-scroll h3{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:26px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--rule)}
.fields-scroll h3 .c-sub{text-transform:none;letter-spacing:0;font-weight:400}
.scrollx{overflow-x:auto}
.m-num{font-size:11px;fill:var(--ink);font-variant-numeric:tabular-nums;paint-order:stroke;stroke:var(--halo);stroke-width:2.5px}
.m-lab{font-size:12px;fill:var(--ink)}
.search input{width:100%;padding:6px 10px;border:1px solid var(--rule);border-radius:3px;background:var(--ground)}
.bar select{padding:5px 8px;border:1px solid var(--rule);border-radius:3px;background:var(--ground);font-size:13px}

.stage{position:relative;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.tools{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;padding:8px 18px;border-bottom:1px solid var(--rule);font-size:13px;color:var(--muted);min-height:38px}
.view{position:relative;flex:1 1 0;min-height:0}
.view>svg{display:block;width:100%;height:100%}
.view>canvas{display:block;width:100%;height:100%}
#graph,#map{cursor:grab;touch-action:none}
#graph:active,#map:active{cursor:grabbing}
.tg{display:inline-flex;align-items:center;gap:6px;cursor:pointer;user-select:none}
.tg input{position:absolute;opacity:0;pointer-events:none}
.tg:has(input:checked){color:var(--ink)}
.tg:has(input:not(:checked)) .swatch{opacity:.25}
.tg:has(input:focus-visible){outline:2px solid var(--indigo);outline-offset:2px}
.key{display:inline-flex;align-items:center;gap:6px}
.regions{display:inline-flex;gap:4px}
.regions button{border:1px solid var(--rule);background:var(--surface);border-radius:3px;padding:1px 8px;cursor:pointer;font-size:12.5px}
.zoomers{position:absolute;right:12px;bottom:12px;display:flex;flex-direction:column;gap:4px}
.zoomers button{width:30px;height:30px;border:1px solid var(--rule);background:var(--surface);border-radius:3px;cursor:pointer;font-size:16px;line-height:1}
#tip{position:absolute;pointer-events:none;background:var(--ink);color:var(--ground);padding:4px 8px;border-radius:3px;font-size:12px;white-space:nowrap;transform:translate(10px,-130%);z-index:5}

.yearbar{display:flex;align-items:center;gap:12px;padding:8px 18px;border-top:1px solid var(--rule);background:var(--surface)}
.yearbar button{width:30px;height:30px;border:1px solid var(--rule);background:var(--ground);border-radius:50%;cursor:pointer;font-size:11px}
.yearbar input[type=range]{flex:1 1 120px;accent-color:var(--indigo);min-width:0}
.yearbar output{font-family:var(--serif);font-size:24px;font-variant-numeric:tabular-nums;min-width:2.6em;text-align:right}
.yearbar.off output,.yearbar.off input[type=range]{opacity:.35}
.allyears{display:inline-flex;gap:5px;align-items:center;font-size:12.5px;color:var(--muted);white-space:nowrap}
.yearnote{font-size:12.5px;color:var(--muted);min-width:11em}

/* lineage graph */
.tick line{stroke:var(--rule);stroke-width:1}
.tick.major line{stroke:var(--grey);stroke-opacity:.55}
.tick text,.undated text{fill:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.undated text{font-style:italic}
.nowline{stroke:var(--madder);stroke-width:1.5;stroke-dasharray:3 3}
.edge{fill:none;stroke-width:1.1;stroke-opacity:.55}
.edge.student_of{stroke:var(--indigo);stroke-width:1.3;stroke-opacity:.6}
.edge.influenced_by{stroke:var(--turmeric);stroke-dasharray:4 3}
.edge.succeeded{stroke:var(--madder)}
.edge.collaborated_with{stroke:var(--teal);stroke-opacity:.45}
.edge.other{stroke:var(--grey);stroke-dasharray:1.5 3}
.edge.dim{stroke-opacity:.06}
.edge.hl{stroke-opacity:1;stroke-width:2}
.mk-student_of{fill:var(--indigo)} .mk-influenced_by{fill:var(--turmeric)} .mk-succeeded{fill:var(--madder)}
.node{fill:var(--node);stroke:var(--halo);stroke-width:1.5;cursor:pointer}
.node.est{fill:var(--halo);stroke:var(--node);stroke-width:1.2}
.node.dim{opacity:.13}
.node.hl{fill:var(--indigo);stroke:var(--halo)}
.node.at{fill:var(--turmeric)}
.node.sel{stroke:var(--turmeric);stroke-width:3}
.lbl{font-size:11.5px;fill:var(--ink);paint-order:stroke;stroke:var(--halo);stroke-width:3.5px;stroke-linejoin:round;pointer-events:none}
.lbl.big{font-family:var(--serif);font-size:14px;font-weight:500}
.lbl.dim{opacity:.18}

/* chairs */
.chairs-scroll{height:100%;overflow:auto}
#chairs{display:block;min-width:760px}
.c-axis text{fill:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.c-grid line{stroke:var(--rule)}
.c-grid line.major{stroke:var(--grey);stroke-opacity:.5}
.c-head{font-size:13px;font-weight:600;fill:var(--ink);cursor:pointer}
.c-head:hover{text-decoration:underline}
.c-head.sel{fill:var(--turmeric)}
.c-sub{font-size:11.5px;fill:var(--muted);font-weight:400}
.c-rule{stroke:var(--rule)}
.bar-r{cursor:pointer}
.bar-r.model{stroke-dasharray:3 2;stroke-width:1}
.bar-r.study{opacity:.55}
.bar-g.dim{opacity:.15}
.bar-t{font-size:11px;pointer-events:none;fill:var(--ink)}
.bar-t.in{fill:var(--on-bar)}
.swatch{display:inline-block;width:20px;height:9px;border-radius:1px}
.swatch.text{background:var(--indigo)} .swatch.wikidata{background:var(--teal)} .swatch.study{background:var(--turmeric);height:5px}
.swatch.model{border:1px dashed var(--indigo)}
.swatch.line{height:0;border-top:2px solid var(--indigo)}
.swatch.line.succeeded{border-color:var(--madder)} .swatch.line.influenced_by{border-color:var(--turmeric);border-top-style:dashed}
.swatch.line.collaborated_with{border-color:var(--teal)} .swatch.line.other{border-color:var(--grey);border-top-style:dotted}

/* map */
.land{fill:var(--land);stroke:var(--ground);stroke-width:.5;vector-effect:non-scaling-stroke}
.place{fill-opacity:.8;stroke:var(--halo);stroke-width:1.2;cursor:pointer}
.place.study{fill:none;stroke:var(--turmeric);stroke-width:1.6}
.place.idle{fill:var(--grey);fill-opacity:.35;stroke:none}
.place.sel{stroke:var(--turmeric);stroke-width:3}
.plbl{font-size:11.5px;fill:var(--ink);paint-order:stroke;stroke:var(--halo);stroke-width:3px;stroke-linejoin:round;pointer-events:none}

/* side panel */
.panel{border-left:1px solid var(--rule);background:var(--surface);overflow-y:auto;min-height:0;padding:18px 20px 40px}
.panel h2{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.15;margin:0 0 2px;text-wrap:balance}
.panel .dates{font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px}
.panel .field{margin-top:7px;font-size:12.5px;display:flex;flex-wrap:wrap;gap:4px 6px}
.chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--rule);border-radius:10px;padding:1px 8px}
.native{font-size:15px;color:var(--muted);margin-bottom:2px}
.bio{margin:14px 0 0;padding:10px 14px;border-left:3px solid var(--turmeric);background:var(--ground);font-family:var(--serif);font-size:14.5px;line-height:1.45}
.bio footer{margin-top:6px;font-family:var(--ui);font-size:11.5px;color:var(--muted)}
.summary{margin-top:14px!important;font-family:var(--serif);font-size:15.5px;line-height:1.45}
.who{display:inline-flex;gap:6px;align-items:baseline}
.more{margin-top:8px!important}
.panel .aka{margin-top:6px;font-size:12px;color:var(--muted)}
.panel h3{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:22px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between}
.panel p{margin:0 0 10px;max-width:60ch}
.head{display:flex;gap:14px;align-items:flex-start}
.head img{width:84px;height:104px;object-fit:cover;border-radius:2px;flex:none;background:var(--rule);filter:grayscale(.3)}
.links{margin-top:6px;font-size:12px;display:flex;gap:10px;flex-wrap:wrap}
.suggest{color:var(--turmeric);font-weight:500}
.back{background:none;border:0;padding:0;margin:0 0 12px;color:var(--muted);cursor:pointer;font-size:12px}
.back:hover{color:var(--ink)}
.items{display:flex;flex-direction:column;gap:12px;list-style:none;margin:0;padding:0}
.items li{display:flex;flex-direction:column;gap:2px}
.items li.now .who::after{content:" ●";color:var(--madder);font-size:9px;vertical-align:middle}
.who{background:none;border:0;padding:0;text-align:left;cursor:pointer;font-weight:500;color:var(--indigo)}
.who:hover{text-decoration:underline}
.who.inst{color:var(--turmeric)}
.meta{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.tag{font-size:10px;letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--rule);border-radius:2px;padding:0 4px;margin-left:4px;color:var(--muted);white-space:nowrap}
.tag.model{border-style:dashed}
.q{font-family:var(--serif);font-style:italic;font-size:14px;line-height:1.4;color:var(--ink);opacity:.88;border-left:2px solid var(--rule);padding-left:9px;margin-top:2px}
.src{font-style:normal;font-family:var(--ui);font-size:11px;color:var(--muted);white-space:nowrap}
.inferred{font-size:11px;color:var(--madder)}
.rank{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center;margin:0;padding:0;list-style:none}
.rank li{display:contents}
.rank .n{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12.5px;text-align:right}
.stats{display:flex;gap:22px;margin:14px 0 4px;font-variant-numeric:tabular-nums}
.stats div{display:flex;flex-direction:column}
.stats b{font-family:var(--serif);font-weight:500;font-size:24px;line-height:1}
.stats span{font-size:11.5px;color:var(--muted)}
.note{font-size:12px;color:var(--muted)}

@media (max-width:860px){
  html,body{height:auto}
  .app{display:flex;flex-direction:column;height:auto}
  .stage{height:78vh;min-height:460px}
  .panel{border-left:0;border-top:1px solid var(--rule);overflow:visible}
  .yearnote{display:none}
}
@media (prefers-reduced-motion: reduce){ *{transition:none!important;animation:none!important} }
