/* A1. Cool pale ground, ink, one live cell on Home. */
@font-face{font-family:"Bellefair";src:url("fonts/bellefair-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Schibsted Grotesk";src:url("fonts/schibsted-grotesk-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
:root{--intro:600px;--bg:#EEF1EF;--ink:#1F2A33;--soft:#4C5760;--line:#B6BEBA;--hair:#D7DCD9;--serif:"Bellefair",Didot,serif;--text:"Schibsted Grotesk",system-ui,sans-serif;--edge:64px;--m:17px;--ml:26px}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/26px var(--text);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
h1,h2,h3,p,ol,ul{margin:0;padding:0;list-style:none;font-weight:400}
.hide,main>h1,.pane h2{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.pane{display:none;scroll-margin-top:100vh}
.pane-a{display:block}
main:has(.pane-b:target,.pane-b :target) .pane-a{display:none}
main:has(.pane-b:target,.pane-b :target) .pane-b{display:block}
body{display:flex;flex-direction:column;min-height:100vh;min-height:100svh}
body>main{flex:1 0 auto;width:100%}
.paper :is(h2,h3){text-wrap:balance}
.nb{white-space:nowrap}

/* Tabs */
.bar{padding:28px var(--edge) 0;position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;min-height:58px}
.bar nav{display:flex;gap:56px;font-size:var(--m);line-height:22px}
.who{font:400 24px/22px var(--serif);color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:4px}
.bar .who{color:var(--ink);border-bottom:1px solid var(--line);padding-bottom:4px}
.who:hover,.bar .who:hover{border-bottom-color:var(--ink)}
.who[aria-current],.bar .who[aria-current]{border-bottom:1.5px solid var(--ink)}
.name-cv{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--line);text-underline-offset:.1em}
.name-cv:hover{text-decoration-color:var(--ink)}

/* CV: one column of facts, a small label to the left of each part */
.cv-head{position:static;width:auto;height:auto;overflow:visible;clip-path:none;font:400 40px/1.15 var(--serif);max-width:860px;margin:0 0 52px;text-wrap:balance}
.cv-part{display:grid;grid-template-columns:136px minmax(0,800px);padding:0 0 30px}
.cv-label{position:static;width:auto;height:auto;overflow:visible;clip-path:none;font-size:var(--m);line-height:32px;color:var(--soft)}
.cv-row{display:grid;grid-template-columns:132px minmax(0,1fr);column-gap:24px;padding:4px 0 14px}
.cv-when{color:var(--soft);font-variant-numeric:tabular-nums;font-size:var(--m);line-height:32px;white-space:nowrap}
.cv-what{font-size:var(--m);line-height:var(--ml)}
.cv-what h3{font:400 26px/32px var(--serif)}
.cv-what p{color:var(--soft)}
.cv-what .cv-role{color:var(--ink);line-height:32px}
.cv-what .cv-org{color:var(--ink);text-wrap:pretty}
.cv-note{font-size:.92em}
.cv-points{margin:4px 0 0;padding:0}
.cv-points li{color:var(--soft);padding-left:1em;text-indent:-1em}
.cv-points li::before{content:"\2013\00a0";color:var(--line)}
p.cv-what{color:var(--ink);padding-top:3px}
.cv-place{color:var(--soft)}
.cv-place::before{content:", "}
.cv-skill{font-size:var(--m);line-height:var(--ml);padding:4px 0 10px;max-width:46em}
.cv-k{display:block;color:var(--ink)}
.cv-metrics a{color:var(--ink);text-decoration:none}
.cv-metrics a:hover .cv-num{text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--line)}
.cv-metric{display:inline-block;margin-right:28px;font-size:var(--m);color:var(--soft)}
.cv-num{font:400 34px/40px var(--serif);color:var(--ink);margin-right:.25em}
.cv-links{color:var(--soft)}
.ln{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--line);text-underline-offset:.18em}
@media (max-width:760px){
  .cv-head{font-size:30px;margin-bottom:32px}
  .cv-part{grid-template-columns:1fr;padding-bottom:26px}
  .cv-label{line-height:24px;margin-bottom:6px}
  .cv-row{grid-template-columns:1fr;padding-bottom:16px}
  .cv-when{line-height:22px}
  .cv-what .cv-role{line-height:24px}
  .cv-what h3{font-size:23px;line-height:28px}
}
.bar a{color:var(--soft);padding-bottom:6px;border-bottom:2px solid transparent}
.bar a:hover{color:var(--ink)}
.bar a[aria-current]{color:var(--ink);border-bottom-color:var(--ink)}
.tabs{display:flex;gap:32px;font-size:var(--m);line-height:22px;margin:0 0 44px}
.bar a,.tabs a{position:relative}
.bar a::after,.tabs a::after{content:"";position:absolute;inset:-8px}
.tabs a{color:#525D65;padding-bottom:6px;border-bottom:1.5px solid transparent}
.tabs a:hover{color:var(--ink)}
.tab-a{color:var(--ink)!important;border-bottom-color:var(--ink)!important}
main:has(.pane-b:target,.pane-b :target) .tab-a{color:#525D65!important;border-bottom-color:transparent!important}
main:has(.pane-b:target,.pane-b :target) .tab-b{color:var(--ink);border-bottom-color:var(--ink)}

/* Home: the words at the foot of the field, the live cell beside them */
.page-home main{display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--edge) 56px;position:relative;z-index:1}
.page-home main>h1,.intro h1{position:static;width:auto;height:auto;overflow:visible;clip-path:none;font:400 68px/1.02 var(--serif);letter-spacing:-.004em;margin:0 0 16px}
.page-home .lead,.page-home .rest,.page-home .train{max-width:560px;font-size:18px;line-height:29px;text-wrap:pretty}
.page-home .rest,.page-home .train{margin-top:.55em}
.post{max-width:800px}
.post time{display:block;font-size:var(--m);color:var(--soft);margin-bottom:10px}
.post h1{font:400 44px/1.15 var(--serif);margin:0 0 30px;text-wrap:balance}
.post h1 a{text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--line);text-underline-offset:.2em;text-decoration-skip-ink:auto}
.post h1 a:hover{text-decoration-color:var(--ink)}
.post p{max-width:36em;margin:0 0 1.15em;font-size:var(--m);line-height:calc(var(--ml) + 1px)}
.intro{position:relative;z-index:1;max-width:var(--intro)}
.icons{display:flex;gap:20px;margin-top:22px;align-items:center}
.icons a,.icons li{display:block;color:var(--ink)}
.icons a{padding:10px;margin:-10px}
.icons svg{display:block}
.icons a:hover{color:var(--soft)}
.icons .pending{color:var(--line)}
.cell-static{position:fixed;top:47%;left:calc(var(--intro) + 80px + (100vw - var(--intro) - 96px)/2);width:min(94.7vh,(100vw - var(--intro) - 96px)*1.0526);transform:translate(-50%,-50%);z-index:0}
@media (max-width:999px){.cell-static{top:32%;left:50%;width:min(92vw,58vh)}}
@media (max-width:760px){.cell-static{top:calc(52px + 20vh);left:50%;width:min(92vw,42vh)}}
html.laser-on body{user-select:none;-webkit-user-select:none}
.cell-live .cell-static{display:none}
body:not(.page-home) main,body:not(.page-home) .bar{position:relative;z-index:1}
.bar{pointer-events:none}.bar a,.bar button{pointer-events:auto}
.cell-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
/* Where the cell sits: a fixed box the module reads on load and resize. Home beside the words, reading pages in the margin. */
.cell-box{position:fixed;left:calc(var(--intro) + 80px);right:16px;top:76px;bottom:16px;pointer-events:none;visibility:hidden}
body:not(.page-home) .cell-box{left:952px;right:16px;top:84px;bottom:24px}
@media (min-width:1700px) and (min-height:900px){body:not(.page-home) .cell-box{left:1080px}}
@media (max-width:999px){.page-home .cell-box{left:0;right:0;top:118px;bottom:auto;height:52vh}.ctrl{position:absolute;top:72px;left:0;right:0;justify-content:center}}
@media (max-width:760px){.page-home .cell-box{top:100px;height:40vh}}
@media (max-height:520px) and (min-width:600px){.page-home .cell-box{left:calc(var(--intro) + 40px);top:8px;bottom:8px;height:auto}}
html.cell-dark .tabs a{color:var(--soft)}
html.cell-dark .tab-a,html.cell-dark main:has(.pane-b:target,.pane-b :target) .tab-b{color:var(--ink)!important;border-bottom-color:var(--ink)!important}

/* The cell's controls read like the site's other tabs */
.ctrl{display:flex;align-items:center;gap:36px;font-size:var(--m);line-height:22px;z-index:2}
.ages{display:flex;gap:24px}
.ctrl .cell-mode{margin-left:-12px}
.ages button,.laser{font:inherit;color:var(--soft);background:none;border:0;padding:0 0 6px;margin:0;cursor:pointer;position:relative}
.ages button{border-bottom:1.5px solid transparent}
.ages button::after,.laser::after{content:"";position:absolute;inset:-8px}
.ages button:hover,.laser:hover{color:var(--ink)}
.ages button[aria-pressed=true]{color:var(--ink);border-bottom-color:var(--ink)}
.laser{display:flex;align-items:center;gap:9px;color:var(--ink);padding-bottom:7.5px}
.laser i{display:block;width:13px;height:13px;border-radius:50%;border:1.5px solid #BE4A32}
.laser[aria-pressed=true] i{background:#BE4A32}
.ages button:focus-visible,.laser:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
html.laser-on,html.laser-on body{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='13' cy='13' r='8' fill='none' stroke='%23BE4A32' stroke-width='1.5'/%3E%3Ccircle cx='13' cy='13' r='2.5' fill='%23BE4A32'/%3E%3C/svg%3E") 13 13,crosshair}
.ctrl{position:fixed;top:28px;left:max(48.75vw,620px);z-index:3}
.bar-r{display:flex;align-items:center;gap:22px}.page-mode{padding:0}
@media (max-width:760px){.bar-r{justify-content:space-between;margin-bottom:10px}.bar-r .who{margin-bottom:0}}
@media print{.page-mode{display:none}}
@media (max-width:999px) and (min-width:761px){.ctrl{position:absolute;top:72px;left:0;right:0;justify-content:center}.page-home .cell-box{top:168px;height:40vh}}
.lesion{position:fixed;width:26px;height:26px;margin:-13px 0 0 -13px;border:1.5px solid #BE4A32;border-radius:50%;z-index:1;pointer-events:none}
.lesion::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#BE4A32}

main{padding:72px var(--edge) 96px}
body:not(.page-home) main{max-width:1240px}

/* Science */
.paper{display:grid;grid-template-columns:72px minmax(0,800px);align-items:baseline;padding:0 0 36px}
.paper .gutter{font-size:var(--m);line-height:38px;color:var(--soft);font-variant-numeric:tabular-nums}
.paper :is(h2,h3){grid-column:2;font:400 32px/38px var(--serif)}
.plain .paper{grid-template-columns:minmax(0,900px)}
.plain .paper :is(h2,h3),.plain .paper .summary{grid-column:1}
.paper :is(h2,h3) a{text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--line);text-underline-offset:.2em;text-decoration-skip-ink:auto}
.paper :is(h2,h3) a:hover{text-decoration-color:var(--ink)}
.paper .meta{grid-column:2;margin-top:8px;font-size:var(--m);line-height:var(--ml);color:var(--ink)}
.paper .summary{grid-column:2;max-width:38em;margin-top:2px;font-size:var(--m);line-height:var(--ml);color:var(--soft);text-wrap:pretty}

/* People */
table{width:100%;max-width:1100px;border-collapse:collapse}
thead th{font-weight:400;font-size:var(--m);line-height:22px;color:var(--soft);text-align:left;padding:0 24px 10px 0;border-bottom:1px solid var(--hair)}
tbody td,tbody th{font-weight:400;text-align:left;padding:12px 24px 12px 0;vertical-align:baseline;border-bottom:1px solid var(--hair)}
tbody th{font:400 26px/32px var(--serif)}
thead th:nth-child(1){width:30%}
td{font-size:var(--m)}


@media (max-width:760px){
  :root{--edge:20px;--m:16px;--ml:24px}
  .bar{padding-top:18px}
  .bar{flex-direction:column-reverse;align-items:stretch;min-height:0}
  .bar nav{gap:0;justify-content:space-between;white-space:nowrap}
  .who{display:block;align-self:flex-start;margin-bottom:10px}
  .ctrl{position:absolute;top:16px;left:var(--edge);right:var(--edge);justify-content:space-between;gap:12px}
  .ages{gap:16px}
  .page-home main{padding-bottom:30px}
  .page-home main>h1,.intro h1{font-size:52px;margin-bottom:10px}
  .page-home .lead,.page-home .rest,.page-home .train{font-size:16px;line-height:25px}
  .icons{margin-top:16px}
  main{padding:40px var(--edge) 64px}
  .tabs{margin-bottom:30px}
  .paper{grid-template-columns:auto minmax(0,1fr);column-gap:1ch;padding-bottom:30px}
  .paper :is(h2,h3){grid-column:1/-1;grid-row:1;font-size:27px;line-height:32px}
  .paper .gutter{grid-column:1;grid-row:2;margin-top:6px;line-height:var(--ml)}
  .paper .meta{grid-column:2;grid-row:2;margin-top:6px}
  .paper .summary{grid-column:1/-1;grid-row:3}
  thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  table,tbody,tbody tr{display:block}
  tbody td,tbody th{display:block;width:auto;padding:0;border:0}
  tbody tr{padding:12px 0;border-bottom:1px solid var(--hair)}
  tbody th{font-size:23px;line-height:28px}
}
@media (max-width:359px){
  :root{--edge:15px;--m:15px;--ml:22px}
  .bar a{padding-bottom:3px}
  .bar a::after{inset:-8px -4px}
}
@media (max-height:520px){
  .page-home main>h1,.intro h1{font-size:44px;margin-bottom:8px}
  .page-home .lead,.page-home .rest,.page-home .train{font-size:14px;line-height:21px}
  .icons{margin-top:10px}
  .page-home main{padding-bottom:18px}
  .ctrl{position:fixed;top:56px;left:max(44vw,300px);right:auto}
}
@media (max-height:520px) and (min-width:600px){.intro{max-width:430px}}
@media (max-width:480px) and (max-height:620px){
  .page-home main>h1,.intro h1{font-size:42px;margin-bottom:6px}
  .page-home .lead,.page-home .rest,.page-home .train{font-size:14px;line-height:21px}
  .page-home .rest,.page-home .train{margin-top:.4em}
  .icons{margin-top:10px}
}
.nf{position:fixed;left:50%;top:50%;z-index:0}
.page-404 main>h1{position:static;width:auto;height:auto;clip-path:none;font:400 68px/1.1 var(--serif);margin-top:18vh}
@media (min-width:1700px) and (min-height:900px){
  :root{--intro:700px;--m:19px;--ml:30px}
  .page-home main>h1,.intro h1{font-size:84px}
  .page-home .lead,.page-home .rest,.page-home .train{font-size:19px;line-height:30px}
  .icons svg{width:24px;height:24px}
  .paper{grid-template-columns:80px minmax(0,920px);padding-bottom:42px}
  .paper :is(h2,h3){font-size:38px;line-height:45px}
  .paper .gutter{line-height:45px}
}
@media print{
  .post h1{font-size:22pt}
  .post p{font-size:10pt;line-height:1.45;max-width:none}
  @page{margin:16mm 18mm}
  html,body{background:#fff;color:#000}
  .cell-canvas,.ctrl,.lesion,.tabs,.bar nav{display:none!important}
  .cell-live .cell-static{display:block}
  .bar{padding:0;border:0;position:static}
  .who{display:block;font:400 22pt/1.2 var(--serif);margin-bottom:6mm}
  main{padding:0;max-width:none}
  .pane-a{display:none!important}.pane-b{display:block!important}
  .papers{display:block;gap:0}
  .paper{break-inside:avoid;margin:0 0 3.2mm;padding:0;display:grid;grid-template-columns:12mm 1fr;column-gap:3mm;row-gap:0}
  .paper .gutter{grid-column:1;grid-row:auto;margin:0;font-size:8pt;line-height:1.5;color:#000}
  .paper :is(h2,h3){font-size:12pt;line-height:1.2;grid-column:2;grid-row:auto;margin:0}
  .paper .meta,.paper .summary{font-size:8pt;line-height:1.3;color:#000;grid-column:2;grid-row:auto;margin:0;max-width:none}
  .paper .meta{margin-top:.8mm}
  a{color:#000!important;text-decoration:none!important}
}