/* ── Institute — the home page skin ─────────────────────────────────
   One column, print typography, no cards and no shadows.

   Theme: light is the default and is used unless the visitor has chosen
   dark with the toggle (stored in localStorage). The OS preference is
   deliberately NOT followed — this site opens white. */

:root{
  --paper:#FBFBF9;
  --ink:#191C1F;
  --body-ink:#282D33;
  --muted:#666C73;
  --faint:#C3C0B6;
  --rule:#E4E3DE;
  --link:#1F4FA8;
  --link-rule:#C7D5EE;
  --chip:#F1F0EC;
  --chip-edge:#E0DFD8;

  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}
:root[data-theme="dark"]{
  --paper:#14161A;
  --ink:#E7EAED;
  --body-ink:#CDD3D9;
  --muted:#9BA2AA;
  --faint:#3A4048;
  --rule:#282D34;
  --link:#8DB2EA;
  --link-rule:#31496B;
  --chip:#1C2026;
  --chip-edge:#2B3138;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--body-ink);
  font-family:var(--serif);
  font-size:19px;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--link);text-decoration:none;border-bottom:1px solid var(--link-rule)}
a:hover{border-bottom-color:var(--link)}
:focus-visible{outline:2px solid var(--link);outline-offset:3px;border-radius:2px}

.page{max-width:45rem;margin:0 auto;padding:clamp(44px,7vw,88px) clamp(20px,5vw,32px) 76px}

/* ── theme toggle ─────────────────────────────────────────────────── */
.theme-toggle{
  position:fixed;top:14px;right:16px;z-index:10;
  width:38px;height:38px;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--chip);border:1px solid var(--chip-edge);border-radius:3px;
  color:var(--muted);cursor:pointer;
  transition:color .15s,border-color .15s;
}
.theme-toggle:hover{color:var(--ink);border-color:var(--muted)}
.ic-ui{width:17px;height:17px;display:block}
.theme-toggle .ic-ui:nth-child(2){display:none}          /* sun hidden in light */
:root[data-theme="dark"] .theme-toggle .ic-ui:nth-child(1){display:none}
:root[data-theme="dark"] .theme-toggle .ic-ui:nth-child(2){display:block}

/* ── masthead ─────────────────────────────────────────────────────── */
.masthead h1{
  font-size:clamp(33px,6.4vw,45px);font-weight:600;letter-spacing:-.02em;
  line-height:1.05;margin:0 0 11px;color:var(--ink);text-wrap:balance;
}
.role{margin:0;font-size:16px;font-style:italic;color:var(--muted)}
.role span{color:var(--faint);padding:0 6px}

.bio{margin:32px 0 34px}
.bio p{margin:0 0 16px;color:var(--body-ink)}
.bio p:last-child{margin-bottom:0}

/* ── profile links: icon + label, high on the page ────────────────── */
.profiles{
  display:flex;flex-wrap:wrap;gap:9px;
  margin:0 0 40px;
}
.profile{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px 8px 12px;
  background:var(--chip);border:1px solid var(--chip-edge);border-radius:3px;
  color:var(--ink);border-bottom:1px solid var(--chip-edge);
  font-family:var(--mono);font-size:12.5px;letter-spacing:.01em;
  transition:border-color .15s,color .15s,background .15s;
}
.profile:hover{
  border-color:var(--link);color:var(--link);background:var(--paper);
}
.profile .ic{width:17px;height:17px;display:block;flex:none;opacity:.85}
.profile:hover .ic{opacity:1}

/* ── sections ─────────────────────────────────────────────────────── */
.section{margin:0 0 38px}
.section h2,.foot h2{
  font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);
  margin:0 0 15px;padding-bottom:8px;border-bottom:1px solid var(--rule);
}

.tags{margin:0;line-height:1.95;color:var(--body-ink)}
.tags span{color:var(--faint);padding:0 7px}

/* notebook entries */
.posts{margin:0;padding:0;list-style:none}
.posts li{margin:0 0 17px;font-size:17.5px;line-height:1.45}
.posts li:last-child{margin-bottom:0}
.posts time{
  display:block;font-family:var(--mono);font-size:11px;
  color:var(--muted);letter-spacing:.04em;margin-bottom:3px;
}
.posts .lang{font-size:14px;color:var(--muted);font-style:italic;white-space:nowrap}
.posts p{margin:4px 0 0;font-size:15.5px;color:var(--muted);line-height:1.5}

.more{margin:18px 0 0;font-size:15px;color:var(--muted)}
.more span{color:var(--faint);padding:0 6px}

/* ── footer / contact ─────────────────────────────────────────────── */
.foot{margin:44px 0 0}
.foot .row{font-family:var(--mono);font-size:13px;line-height:2}
.foot .lbl{color:var(--muted);font-size:11px;padding-left:7px}
.foot .sep{color:var(--faint);padding:0 10px}

@media (max-width:600px){
  body{font-size:18px}
  .page{padding-top:64px}
  .profiles{gap:7px}
  .profile{padding:7px 11px;font-size:12px}
  .foot .row{line-height:2.4}
  .foot .sep{display:block;height:0;overflow:hidden}
}