@font-face{font-family:Research Sans;src:url('/assets/IBMPlexMono-Regular.woff2') format('woff2');font-display:swap}@font-face{font-family:Research Serif;src:url('/assets/EBGaramond-Regular.woff2') format('woff2');font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;color:#1d1d19;background:#d4d3cb;font-family:Research Sans,'Courier New',monospace;font-size:16px;line-height:1.45;--lx:27%;--ly:12%}a{color:inherit;text-underline-offset:4px}a:hover{text-decoration-thickness:2px}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid #171713;outline-offset:5px}.skip{position:fixed;top:-100px;left:20px;background:#fff;padding:12px;z-index:50}.skip:focus{top:10px}.wall,.wall-texture,#shadows{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}.wall{z-index:-3;background:radial-gradient(ellipse 85% 110% at var(--lx) var(--ly),#f4f3ed 0%,#ddddd4 45%,#b9b9af 100%)}.wall-texture{z-index:-2;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.85' d='M0 0h180v180H0z'/%3E%3C/svg%3E");mix-blend-mode:multiply}#shadows{z-index:-1;filter:url(#rough-shadow)}.filters{position:absolute;width:0;height:0;overflow:hidden}.site-header,main,footer{width:calc(100% - 112px);max-width:1160px;margin-left:auto;margin-right:auto}.site-header{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:35px 0 38px;position:relative;z-index:2}.name{font-size:19px;letter-spacing:-.025em;text-decoration:none;white-space:nowrap}.site-header nav{display:flex;gap:25px;margin-left:auto;font-size:12px}.site-header nav a{text-decoration:none}.languages{display:flex;gap:8px;font-size:11px;margin-left:22px}.languages a{text-decoration:none}.languages [aria-current]{text-decoration:underline}.languages>span{opacity:.5}.sheet{background:#fcfcf8;border:1px solid rgba(60,60,50,.12);transform:rotate(var(--tilt,0deg));box-shadow:3px 6px 7px #0000002b;position:relative}.has-light .sheet{box-shadow:0 1px 2px #00000025;background:linear-gradient(var(--paper-angle,115deg),#fffffc,#f7f7f1)}.introduction{max-width:890px;margin:18px 0 48px;padding:36px 46px 40px}.role{font-size:12px;margin:0 0 17px}.introduction h1{font-family:Research Serif,Garamond,Georgia,serif;font-weight:400;font-size:clamp(35px,4.2vw,55px);line-height:1.06;letter-spacing:-.035em;margin:0 0 20px;max-width:700px}.lead{font-size:20px;line-height:1.4;max-width:705px;margin:0 0 14px}.bio{font-size:15px;line-height:1.65;max-width:720px;margin:0;color:#383831}.overview{display:grid;grid-template-columns:minmax(0,1.95fr) minmax(0,1fr);gap:55px;align-items:start}.publications{padding:30px 32px 20px}.publications h2,.media h2{font-size:13px;font-weight:400;margin:0 0 20px}.publication{display:grid;grid-template-columns:38px 1fr 14px;gap:14px;border-top:1px solid #d0d0c7;padding:19px 0 18px}.year{font-size:11px;padding-top:3px}.publication h4{font-family:Research Serif,Garamond,Georgia,serif;font-size:21px;line-height:1.23;font-weight:400;margin:0}.publication h4 a{text-decoration:none}.publication h4 a:hover{text-decoration:underline;text-decoration-thickness:1px}.publication p{font-size:11px;line-height:1.5;color:#55554d;margin:9px 0 0}.read-link{text-decoration:none;font-size:16px}.media{padding:30px 30px 32px;margin-top:42px}.outlet{font-size:11px;margin:32px 0 10px}.media h3{font-family:Research Serif,Garamond,Georgia,serif;font-size:30px;line-height:1.13;letter-spacing:-.025em;font-weight:400;margin:0 0 20px}.media h3 a{text-decoration:none}.media-intro{font-size:14px;line-height:1.65;margin:0 0 24px}.media-meta{font-size:10px;line-height:1.6;color:#55554d;margin-bottom:28px}.underlined{font-size:12px}.inquiries{margin-top:110px}.section-intro{max-width:680px;margin-bottom:55px}.section-intro h2{font-family:Research Serif,Garamond,Georgia,serif;font-size:36px;letter-spacing:-.025em;font-weight:400;margin:0 0 15px}.section-intro p{font-size:16px;line-height:1.6;max-width:620px;margin:0}.projects{display:grid;grid-template-columns:1fr 1fr;gap:75px}.project{min-width:0}.project-heading{min-height:160px;margin-bottom:25px;max-width:450px}.project-heading h3{font-size:23px;font-weight:400;letter-spacing:-.015em;margin:0 0 14px}.project-heading p{font-size:14px;line-height:1.65;margin:0}.document,.technical,.conversation{margin:0}.document{padding:22px 22px 0}.image-open{border:0;padding:0;display:block;background:transparent;width:100%;text-align:left}.image-open img{display:block;width:100%;height:auto;filter:grayscale(1)}.sketch{width:78%;max-width:370px;margin-left:10px}.sketch img{max-height:400px;width:auto;max-width:100%;margin:auto}.path{margin-top:45px}.path .image-open img{aspect-ratio:1.42;object-fit:contain}.document figcaption,.technical figcaption,.conversation figcaption{font-size:11px;line-height:1.55;color:#46463e;padding:18px 0 20px}.technical{margin-top:42px}.document-bar{display:flex;justify-content:space-between;gap:15px;padding:12px 16px;border-bottom:1px solid #cecec4;font-size:10px}.technical .code-open{padding:18px;background:#f7f7f2}.technical figcaption,.conversation figcaption{padding:16px}.conversation{margin-top:40px}.chat-scroll{height:330px;overflow:auto;padding:22px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#88887c #f2f2eb}.turn+.turn{border-top:1px solid #d4d4ca;margin-top:22px;padding-top:20px}.speaker{font-size:10px;display:block;margin-bottom:9px}.turn p{font-size:13px;line-height:1.6;margin:0}.turn pre{font-family:Research Sans,'Courier New',monospace;white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;line-height:1.6;margin:0}.model{padding-left:14px;border-left:2px solid #b2b2a6}.model>span:last-child{font-size:12px}.project-link{font-size:12px;display:inline-block;margin:28px 12px 0}.project:nth-child(2){padding-top:38px}footer{display:flex;justify-content:space-between;gap:30px;margin-top:110px;padding:35px 0 45px;border-top:1px solid #9b9b90;font-size:10px;color:#44443c}footer>div{display:flex;gap:25px;align-items:center}.motion{padding:0;border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;font-size:10px}.image-dialog{max-width:95vw;max-height:92vh;border:1px solid #555;background:#fafaf5;padding:20px;overflow:auto}.image-dialog::backdrop{background:#222222aa}.image-dialog form{display:flex;justify-content:flex-end;margin-bottom:18px}.image-dialog button{background:transparent;border:0;text-decoration:underline;font-size:12px}.image-dialog>img{display:block;max-width:100%;max-height:73vh;width:auto;height:auto;margin:auto}.image-dialog>p{max-width:800px;font-size:12px;line-height:1.5;margin:20px 0 0}
@media(max-width:1000px){.site-header,main,footer{width:calc(100% - 72px)}.overview{gap:32px;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}.introduction{max-width:850px}.publications{padding:25px 24px 16px}.media{padding:25px 24px}.publication{gap:10px;grid-template-columns:31px 1fr 12px}.publication h4{font-size:20px}.projects{gap:42px}.project-heading{min-height:190px}.sketch{width:90%;margin-left:0}.site-header nav{gap:18px}}
@media(max-width:740px){.site-header,main,footer{width:calc(100% - 42px)}.site-header{padding:26px 0 20px;flex-wrap:wrap;gap:15px}.name{font-size:18px}.languages{margin-left:auto}.site-header nav{order:3;width:100%;margin:0;justify-content:flex-start;gap:23px;font-size:11px;padding-top:5px}.introduction{margin:25px 0 36px;padding:27px 25px 30px}.role{font-size:10px;margin-bottom:17px}.introduction h1{font-size:38px;line-height:1.04;margin-bottom:20px}.lead{font-size:18px}.bio{font-size:14px}.overview{grid-template-columns:1fr;gap:35px}.publications{padding:25px 23px 12px}.publication h4{font-size:21px}.publication{padding:20px 0}.media{max-width:390px;margin:0 0 0 auto;padding:27px;transform:rotate(.6deg)}.media h3{font-size:29px}.outlet{margin-top:24px}.inquiries{margin-top:85px}.section-intro{margin-bottom:42px}.section-intro h2{font-size:31px}.section-intro p{font-size:15px}.projects{display:block}.project-heading{min-height:0;margin-bottom:30px}.project-heading h3{font-size:23px}.sketch{width:82%;margin:0 0 0 5px}.project:nth-child(2){padding-top:75px}.path{margin-top:0}.document{padding:17px 17px 0}.document figcaption{font-size:10px}.technical{margin-top:32px}.conversation{margin-top:30px}.chat-scroll{height:310px;padding:20px}.project-link{margin-top:24px}.project-heading p{font-size:15px}footer{margin-top:75px;flex-direction:column;gap:18px;padding:25px 0 35px}footer>div{justify-content:space-between}.image-dialog{padding:15px}.image-dialog>img{max-height:70vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.motion{display:none}}
/* Monochrome projection study */
body{background:#eee;color:#080808;--lx:32%;--ly:20%}.wall{background:radial-gradient(ellipse 80% 100% at var(--lx) var(--ly),#fff 0%,#fff 30%,#eee 65%,#999 115%)}.wall-texture{opacity:.065;mix-blend-mode:multiply;filter:grayscale(1);background-size:120px 120px}#shadows{filter:none}.sheet,.has-light .sheet{background:transparent;border:0;box-shadow:none;transform:none}.site-header{padding-bottom:20px}.introduction{padding:0;margin:65px 0 65px;max-width:810px}.introduction h1{font-size:54px;max-width:720px;line-height:1.05;position:relative;text-shadow:0 0 20px white,0 0 8px white}.role{margin-bottom:22px}.lead{font-size:20px}.bio{max-width:690px;color:#181818}.overview{display:block}.publications{padding:0;max-width:850px}.publications h2{font-size:13px;margin-bottom:20px}.publication{padding:19px 0;border-color:#777}.publication h4{font-size:23px;text-shadow:0 0 12px white,0 0 5px white}.publication p{color:#222}.inquiries{margin-top:120px}.section-intro{margin-bottom:65px}.project-heading{min-height:150px}.document{padding:0}.sketch{max-width:320px;width:75%;margin-left:25px}.path{margin-top:30px}.document img{mix-blend-mode:multiply}.document figcaption,.technical figcaption,.conversation figcaption{color:#222}.technical{border-top:1px solid #222;border-bottom:1px solid #222}.technical .code-open{padding:15px 0;background:transparent}.technical figcaption{padding-left:0;padding-right:0}.document-bar{padding-left:0;padding-right:0;border-color:#777}.conversation{border-top:1px solid #222;border-bottom:1px solid #222}.chat-scroll{padding-left:0;padding-right:10px}.conversation figcaption{padding-left:0;padding-right:0}.model{border-color:#222}.turn+.turn{border-color:#888}.elsewhere{display:flex;gap:22px;flex-wrap:wrap}footer{color:#111;border-color:#555}footer>div{flex-wrap:wrap}.image-dialog{background:#fff}.image-dialog::backdrop{background:#000b}.read-link,.project-link{color:#000}
@media(max-width:740px){.introduction{margin:45px 0 48px}.introduction h1{font-size:39px}.publications{padding:0}.publication h4{font-size:22px}.project-heading{min-height:0}.projects{display:block}.sketch{margin-left:12px;width:75%}.path{margin-top:0}.elsewhere{gap:18px}footer>div{justify-content:flex-start}.inquiries{margin-top:80px}}

/* Handwritten fragment and photographic light */
body{color:#030303;background:#c4c4c4}
.wall{background:radial-gradient(ellipse 72% 94% at var(--lx) var(--ly),#fff 0%,#fff 19%,#e5e5e5 49%,#888 88%,#454545 130%)}
.wall-texture{opacity:.14;background-size:96px 96px}
.introduction{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:55px;align-items:center;margin-bottom:75px}
.introduction h1,.publication h4{text-shadow:none}
.intro-copy{min-width:0}.intro-fragment{margin:35px 0 0;transform:rotate(-5deg)}
.intro-fragment img{width:100%;height:auto}
@supports (-webkit-background-clip:text){
.intro-copy,.publication h4,.section-intro h2,.project-heading h3{
background-image:radial-gradient(ellipse 145px 125px at var(--ink-x,-500px) var(--ink-y,-500px),#777 0%,#414141 30%,#050505 76%);
background-attachment:fixed;-webkit-background-clip:text;background-clip:text;color:transparent}
.intro-copy a,.publication h4 a{color:inherit}
}
@media(max-width:1000px){.introduction{grid-template-columns:minmax(0,1fr) 230px;gap:30px}.introduction h1{font-size:48px}}
@media(max-width:740px){.introduction{display:block;margin-bottom:65px}.introduction h1{font-size:39px}.intro-fragment{width:72%;max-width:320px;margin:40px 10px 15px auto}}
@media print{.wall,.wall-texture,#shadows{display:none}.intro-copy,.publication h4,.section-intro h2,.project-heading h3{color:#000;background:none}}
/* A fine emulsion layer also crosses the ink. */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:4;opacity:.045;mix-blend-mode:screen;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='white' filter='url(%23f)' d='M0 0h160v160H0z'/%3E%3C/svg%3E");background-size:160px 160px}

/* All typography shares the same light source; the emulsion crosses ink and paper. */
.intro-copy,.publication h4,.section-intro h2,.project-heading h3{background:none;color:inherit}
@supports (-webkit-background-clip:text){
.lit-ink{background-image:radial-gradient(ellipse 150px 135px at var(--ink-x,-500px) var(--ink-y,-500px),#666 0%,#383838 34%,#050505 85%)!important;background-attachment:fixed!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important}
.lit-ink a{color:inherit}
}
#emulsion{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:6;mix-blend-mode:screen}
.image-dialog .lit-ink{background:none!important;color:#111!important}
@media print{#emulsion{display:none}.lit-ink{color:#000!important;background:none!important}}

.introduction{grid-template-columns:minmax(0,1fr) 340px;gap:45px}
@media(max-width:1000px){.introduction{grid-template-columns:minmax(0,1fr) 245px;gap:30px}}



/* One beam: ink, ink grain and emulsion share --beam (set by app.js). Multiply keeps grain inside the beam: black ink stays black outside it. */
@supports (-webkit-background-clip:text){
.lit-ink{background-image:var(--ink-grain,none),radial-gradient(circle var(--beam,300px) at var(--ink-x,-500px) var(--ink-y,-500px),#8c8c8c 0%,#5a5a5a 30%,#1c1c1c 68%,#050505 100%)!important;background-size:128px 128px,auto!important;background-blend-mode:multiply!important}
}

/* Night: the office photo lit by the same beam, then publications as a black band. Materials below keep the wall light. */
main{width:auto;max-width:none;margin:0}
.site-header{position:absolute;top:0;left:0;right:0;z-index:5;color:#eee}
.night{position:relative;z-index:1;background:#050505;color:#e8e8e8}
.introduction{position:relative;display:block;max-width:none;margin:0;padding:0;min-height:clamp(600px,96vh,1000px);overflow:hidden}
.scene,.scene>div{position:absolute;inset:0}
.scene{--scene-pos:72% 60%;--scene-size:auto max(112%,56.6vw)}
.scene>div{background:url('/assets/bureau-nuit.webp') var(--scene-pos)/var(--scene-size) no-repeat}
.scene-base{filter:brightness(.05) contrast(1.1)}
.scene-lit{-webkit-mask:radial-gradient(circle calc(var(--beam,300px)*1.25) at var(--hx,52%) var(--hy,70%),#000 0%,rgba(0,0,0,.72) 32%,rgba(0,0,0,.22) 66%,transparent 100%),linear-gradient(90deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,.28) 42%,#000 66%);-webkit-mask-composite:source-in;mask:radial-gradient(circle calc(var(--beam,300px)*1.25) at var(--hx,52%) var(--hy,70%),#000 0%,rgba(0,0,0,.72) 32%,rgba(0,0,0,.22) 66%,transparent 100%),linear-gradient(90deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,.28) 42%,#000 66%);mask-composite:intersect}
.scene-glow,.scene-bloom{-webkit-mask:url('/assets/bureau-sources.webp') var(--scene-pos)/var(--scene-size) no-repeat;mask:url('/assets/bureau-sources.webp') var(--scene-pos)/var(--scene-size) no-repeat;mask-mode:luminance}
.scene-glow{opacity:.8}
.scene-gl{position:absolute;inset:0;width:100%;height:100%;display:block}
.scene.gl>div{display:none}
.scene-bloom{filter:blur(16px) brightness(1.5);opacity:.55;mix-blend-mode:screen}
.intro-copy{position:relative;z-index:2;width:calc(100% - 112px);max-width:1160px;margin:0 auto;padding:clamp(150px,22vh,240px) 0 120px}
.intro-copy>*{max-width:500px}
.introduction h1{font-size:clamp(40px,4vw,56px);max-width:600px}
.night .bio{color:inherit}
.publications{max-width:none;padding:0;background:radial-gradient(circle calc(var(--beam,300px)*1.15) at var(--ink-x,-999px) var(--ink-y,-999px),#2b2b2b 0%,#141414 38%,#060606 72%,#050505 100%) fixed}
.band{width:calc(100% - 112px);max-width:1160px;margin:0 auto;padding:70px 0 90px}
.band .publication{border-color:#3a3a3a;max-width:900px}
.night .publication p{color:#b5b5b5}
.night .read-link{color:#eee}
.inquiries{width:calc(100% - 112px);max-width:1160px;margin:120px auto 0}
.night a:focus-visible,.site-header a:focus-visible{outline-color:#eee}
@supports (-webkit-background-clip:text){
.night .lit-ink,.site-header .lit-ink{background-image:radial-gradient(circle var(--beam,300px) at var(--ink-x,-500px) var(--ink-y,-500px),#fff 0%,#f2f2f2 35%,#c9c9c9 100%)!important;background-blend-mode:normal!important;background-size:auto!important}
}
@media(max-width:1000px){.intro-copy,.band,.inquiries{width:calc(100% - 72px)}.scene{--scene-pos:45% 62%;--scene-size:auto max(100%,56.6vw)}}
@media(max-width:740px){
.introduction{min-height:0}
.scene{position:relative;height:auto;aspect-ratio:4/3.4;inset:auto}
.scene{--scene-pos:62% 70%;--scene-size:cover}
.scene-lit{-webkit-mask:radial-gradient(circle calc(var(--beam,220px)*.75) at var(--hx,58%) var(--hy,66%),#000 0%,rgba(0,0,0,.6) 35%,transparent 100%);mask:radial-gradient(circle calc(var(--beam,220px)*.75) at var(--hx,58%) var(--hy,66%),#000 0%,rgba(0,0,0,.6) 35%,transparent 100%)}
.intro-copy,.band,.inquiries{width:calc(100% - 42px)}
.intro-copy{padding:28px 0 60px}
.site-header{position:relative;background:#050505;box-shadow:0 0 0 50vw #050505;clip-path:inset(0 -50vw);padding-bottom:20px}
.night{margin-top:-1px}
.band{padding:50px 0 60px}
.inquiries{margin-top:80px}
}
@media print{.scene{display:none}.night{background:none;color:#000}.site-header{position:static;color:#000}}

/* Larger reading sizes; lowercase top bar. */
.site-header nav,.languages{text-transform:lowercase}
.name{font-size:21px}.site-header nav{font-size:14px}.languages{font-size:14px}
.role{font-size:14px}.lead{font-size:23px}.bio{font-size:17px;line-height:1.6}
.introduction h1{font-size:clamp(44px,4.4vw,62px)}
.publications h2{font-size:15px}.year{font-size:13px}.publication h4{font-size:26px}.publication p{font-size:13px}
.section-intro h2{font-size:40px}.section-intro p{font-size:18px}
.project-heading h3{font-size:26px}.project-heading p{font-size:16px}
.document figcaption,.technical figcaption,.conversation figcaption{font-size:13px}.document-bar{font-size:12px}
.speaker{font-size:12px}.turn p{font-size:15px}.turn pre{font-size:13px}.model>span:last-child{font-size:14px}
.project-link{font-size:14px}footer,.motion{font-size:13px}
.intro-copy>*{max-width:540px}

/* Phones: no photo scene, no projector. Plain night band with a soft scroll-driven light and grain. */
@media(max-width:740px){
.scene{display:none}
.introduction{background:radial-gradient(circle calc(var(--beam,220px)*1.3) at var(--ink-x,50%) var(--ink-y,30%),#262626 0%,#111 45%,#050505 100%) fixed}
.intro-copy{padding:40px 0 64px}
.name{font-size:19px}.site-header nav,.languages{font-size:14px}
.introduction h1{font-size:40px}.lead{font-size:20px}.bio{font-size:16px}
.publication h4{font-size:22px}.publication p,.year{font-size:12px}
.section-intro h2{font-size:32px}.section-intro p{font-size:16px}.project-heading p{font-size:15px}
.document figcaption,.technical figcaption,.conversation figcaption{font-size:12px}
}

/* EB Garamond + IBM Plex Mono: the mono runs wide, so body text steps down slightly and gains air; Garamond titles step up. */
body{letter-spacing:-.01em}
.name{font-size:19px;letter-spacing:-.03em}.site-header nav,.languages{font-size:13px}
.role{font-size:13px}.lead{font-size:20px;line-height:1.45}.bio{font-size:15px;line-height:1.7}
.introduction h1{font-size:clamp(48px,4.8vw,68px);letter-spacing:-.025em;line-height:1.02}
.publication h4{font-size:28px;line-height:1.15}.publication p,.year{font-size:12px}
.section-intro h2{font-size:44px}.section-intro p{font-size:16px;line-height:1.7}
.project-heading h3{font-family:Research Serif,Garamond,Georgia,serif;font-size:30px;letter-spacing:-.01em}.project-heading p{font-size:14px;line-height:1.7}
.document figcaption,.technical figcaption,.conversation figcaption{font-size:12px}.turn p{font-size:14px}
.project-link,footer,.motion{font-size:12px}
@media(max-width:740px){.introduction h1{font-size:42px}.lead{font-size:18px}.bio{font-size:14px}.publication h4{font-size:24px}.section-intro h2{font-size:34px}.project-heading h3{font-size:26px}}

/* Affiliations, invitation to talk (address copied on click), copy toast, publication blurbs. */
.affiliations{font-size:13px;color:#bdbdbd;margin:-4px 0 26px;max-width:600px}
.invite{font-size:15px;line-height:1.6;color:#d8d8d8;margin:22px 0 0}
.invite .mail,.invite a{background:none;border:0;padding:0;color:#fff;font:inherit;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.invite .mail:hover,.invite a:hover{text-decoration-thickness:2px}
.toast{position:fixed;left:50%;bottom:28px;z-index:20;margin:0;padding:10px 16px;background:#f2f2f2;color:#050505;font-size:13px;transform:translate(-50%,12px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translate(-50%,0)}
.publication .blurb{font-size:14px;line-height:1.55;color:#cfcfcf;margin:8px 0 0;max-width:640px}
@media(max-width:740px){.affiliations{font-size:12px}.invite{font-size:14px}.publication .blurb{font-size:13px}}
@media(prefers-reduced-motion:reduce){.toast{transition:none}}
@media print{.toast{display:none}}

/* One link language across the site: underlined, thicker underline on hover; white focus ring on dark sections. */
a,.invite .mail{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
a:hover,.invite .mail:hover{text-decoration:underline;text-decoration-thickness:2px}
.site-header nav a,.languages a,.publication h4 a,.read-link,.project-link,.elsewhere a{text-decoration:underline;text-decoration-thickness:1px}
.site-header nav a:hover,.languages a:hover,.publication h4 a:hover,.read-link:hover,.project-link:hover,.elsewhere a:hover{text-decoration-thickness:2px}
.languages [aria-current]{text-decoration:none;opacity:1}.languages a:not([aria-current]){opacity:.75}
.name,.name:hover{text-decoration:none}
.night :focus-visible,.site-header :focus-visible{outline:1px solid #eee;outline-offset:4px}
.invite .mail:focus:not(:focus-visible){outline:none}
.invite{margin-top:18px}
.invite .mail,.invite a{white-space:nowrap}.intro-copy>.invite{max-width:none}

/* A soft, shapeless shadow under the intro text keeps it readable on lit wall. */
.intro-copy>*{filter:drop-shadow(0 0 10px rgba(0,0,0,.85)) drop-shadow(0 0 3px rgba(0,0,0,.6))}

/* Page scrollbar: the native one reserves a gutter that shows the light body background, so with JS it is hidden
   and replaced by a thin overlay thumb (.scrollbar) that appears while scrolling or near the right edge.
   Without JS the native scrollbar stays. */
html.overlay-bar{scrollbar-width:none}html.overlay-bar::-webkit-scrollbar{display:none}
.scrollbar{position:fixed;top:0;right:0;width:14px;height:0;z-index:60;opacity:0;transition:opacity .5s;touch-action:none}
.scrollbar::before{content:"";position:absolute;inset:2px 3px 2px auto;width:4px;border-radius:4px;background:rgba(150,150,145,.7);transition:width .15s,background-color .15s}
html.scrolling .scrollbar{opacity:1;transition-duration:.12s}
.scrollbar:hover::before,.scrollbar.drag::before{width:7px;background:rgba(150,150,145,.95)}
.chat-scroll{scrollbar-color:transparent transparent;transition:scrollbar-color .4s}
.chat-scroll:hover,.chat-scroll:focus-visible,.chat-scroll.scrolling{scrollbar-color:#88887c transparent}
@media(prefers-reduced-motion:reduce){.scrollbar,.scrollbar::before,.chat-scroll{transition:none}}

/* Name and affiliations together in the top bar */
.identity{display:flex;flex-direction:column;gap:7px;min-width:0}
.site-header{align-items:baseline}
.site-header .name{font-size:24px;letter-spacing:-.03em}
.site-header .affiliations{font-size:14px;line-height:1.4;color:#bdbdbd;margin:0;max-width:none}
/* One style for section titles */
.band h2,.section-intro h2{font-family:Research Serif,Garamond,Georgia,serif;font-weight:400;font-size:44px;line-height:1.1;letter-spacing:-.025em;margin:0 0 30px}
/* Publications band light: a layer that fades in only while the pointer is over the band */
.night .publications{position:relative;background:#050505}
.night .publications::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:var(--band-on,1);background:radial-gradient(circle calc(var(--beam,300px)*1.15) at var(--ink-x,-999px) var(--ink-y,-999px),#2b2b2b 0%,#141414 38%,#060606 72%,#050505 100%) fixed}
.night .band{position:relative}
/* Desktop: the intro stops short of the fold so the publications title is always visible */
@media(min-width:741px){.introduction{min-height:max(520px,calc(100vh - 170px))}.intro-copy{padding:clamp(140px,21vh,220px) 0 64px}.band{padding-top:46px}}
@media(max-width:740px){.site-header .name{font-size:20px}.site-header .affiliations{font-size:12px}.band h2,.section-intro h2{font-size:34px}}
.all-pubs{margin:34px 0 0;font-size:15px}
/* Top-bar identity stays legible under the beam, like the intro text */
.site-header .affiliations{font-size:16px;color:#d0d0d0}
.identity>*{filter:drop-shadow(0 0 10px rgba(0,0,0,.85)) drop-shadow(0 0 3px rgba(0,0,0,.6))}
@media(max-width:740px){.site-header .affiliations{font-size:13px}}


/* Publications in columns, separated by space only (no rules) */
.band .publication{border-top:0}
@media(min-width:741px){
 .band{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:44px;align-items:start}
 .band>h2,.band>.all-pubs{grid-column:1/-1}
 .band .publication{max-width:none;grid-template-columns:minmax(0,1fr);row-gap:6px;padding:0 0 64px}
 .band>h2{margin-bottom:44px}
 .band .publication .year{grid-column:1/-1}
}
@media(min-width:741px) and (max-width:1100px){.band{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:740px){.band .publication{padding:0 0 40px}.band>h2{margin-bottom:32px}}
@media(max-width:740px){.band .publication{grid-template-columns:minmax(0,1fr)}}
/* Top-bar links without underline; underline only on hover. The current language stays bright, the other dims. */
.site-header nav a,.languages a,.languages a[aria-current]{text-decoration:none}
.site-header nav a:hover,.languages a:hover{text-decoration:underline;text-decoration-thickness:1px}
.languages a:not([aria-current]){opacity:.6}.languages a:not([aria-current]):hover{opacity:1}
/* Journal right under the title, brighter than the description */
.publication .venue{font-size:14px;color:#e8e8e8;margin:8px 0 0;letter-spacing:.01em}
.publication .venue+.blurb{margin-top:10px}
@media(max-width:740px){.publication .venue{font-size:13px}}
.night .publication .venue.lit-ink{background:none!important;color:#f2f2f2!important}
/* Caption hidden in the dark: near-black text in the bottom-right corner, only readable when the beam lights it */
.scene-note{position:absolute;right:36px;bottom:28px;z-index:2;margin:0;font-size:16px;text-align:right;color:#080808;pointer-events:none}
@media(max-width:740px){.scene-note{display:none}}
.scene-note::before{content:"";position:absolute;inset:-34px -46px;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(245,245,240,.55),rgba(245,245,240,.3) 50%,transparent);filter:blur(10px);opacity:var(--note-lit,0)}

/* Hero centred on the name: lowercase name as h1, affiliations under it, then the research sentence */
.intro-copy>h1{margin-bottom:22px}
.intro-copy>.affiliations{font-size:18px;line-height:1.45;color:#d6d6d6;margin:0 0 34px;max-width:none}
/* Top bar: sections only, a bit larger, on the left; languages on the right */
.site-header nav{margin-left:0;font-size:17px;gap:30px}.languages{margin-left:auto;font-size:15px}
/* Inquiries stacked from most recent to oldest: text on the left, materials on the right */
@media(min-width:741px){
 .projects{display:block}
 .project{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);column-gap:64px;align-items:start;padding-top:0!important;margin-bottom:120px}
 .project>.project-heading{grid-column:1;grid-row:1;min-height:0;max-width:440px}
 .project>:not(.project-heading){grid-column:2}
 .project>figure+figure{margin-top:42px}
}
.project-heading .period{font-size:13px;margin:0 0 10px;color:#555}
@media(max-width:740px){.site-header nav{font-size:15px}.intro-copy>.affiliations{font-size:15px;margin-bottom:24px}}
.project-heading .project-link{margin:20px 0 0}
@media(max-width:740px){.site-header{flex-wrap:nowrap;align-items:baseline}.site-header nav{order:0;width:auto;padding-top:0;gap:20px}.languages{font-size:13px}}
/* hero: descenders of the lit name stay inside its background box; affiliation line alone and larger */
.introduction h1{padding-bottom:.14em;margin-bottom:10px}
.intro-copy>.affiliations{font-size:24px;color:#e2e2e2;margin-bottom:30px}
/* publications: academic articles and public writing side by side */
.band{display:block}
.pub-group>h3{font-size:15px;font-weight:400;color:#a8a8a8;margin:0 0 28px;letter-spacing:.01em}
.pub-list{display:grid;grid-template-columns:minmax(0,1fr);column-gap:44px}
.band .publication{padding:0 0 52px}
.pub-group .all-pubs{margin:0}
@media(min-width:741px){.pub-groups{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:44px;align-items:start}}
@media(min-width:1101px){.pub-groups{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.academic .pub-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:740px){.pub-group+.pub-group{margin-top:56px}.intro-copy>.affiliations{font-size:19px;margin-bottom:22px}
 .site-header nav{flex-wrap:wrap;row-gap:6px;gap:6px 18px}}
/* work with me */
.work{width:calc(100% - 112px);max-width:1160px;margin:40px auto 0}
.work .section-intro{max-width:720px;margin-bottom:0}
.work .themes-title{margin-top:26px}
.themes{margin:12px 0 0;padding:0 0 0 1.2em;font-size:16px;line-height:1.7}
.themes li+li{margin-top:6px}
.work .invite{color:inherit;margin-top:26px;font-size:16px}
.work .invite .mail{color:inherit}
@media(max-width:1000px){.work{width:calc(100% - 72px)}}
@media(max-width:740px){.work{width:calc(100% - 42px)}.themes{font-size:15px}}
.band .publication{align-content:start}
@media(max-width:740px){.work .invite{font-size:14px}}
/* about: full-bleed portrait, dim at the top and clearing towards the paper below; the pointer lifts it like the projector */
.about{position:relative;width:100vw;margin:150px 0 0 calc(50% - 50vw);height:clamp(560px,58vw,880px);overflow:hidden;background:#050505}
.about-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:0 22%;display:block}
.about::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(#050505 0%,rgba(5,5,5,.82) 14%,rgba(5,5,5,.5) 45%,rgba(5,5,5,.12) 78%,rgba(5,5,5,0) 100%)}
.about-light{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:var(--about-on,0);background:radial-gradient(circle calc(var(--beam,300px)*1.1) at var(--ink-x,-999px) var(--ink-y,-999px),rgba(255,255,255,.42) 0%,rgba(255,255,255,.16) 45%,transparent 100%) fixed}
.about::after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;z-index:1;pointer-events:none;background:linear-gradient(transparent,#eee)}
.about-copy{position:absolute;z-index:2;left:max(56%,calc(50% + 60px));right:max(56px,calc(50% - 580px));bottom:12%;color:#0c0c0c}
.about-copy h2{margin-bottom:20px}
.about-copy p{font-size:16px;line-height:1.7;margin:0;max-width:520px}
.work{margin-top:110px}
@media(max-width:1000px){.about-copy{right:36px}}
@media(max-width:740px){.about{height:auto;margin-top:100px;background:none}.about-photo{position:relative;height:auto;aspect-ratio:1.25;object-position:0 30%}
 .about::before{bottom:auto;height:calc(100vw / 1.25)}.about-light,.about::after{display:none}
 .about-copy{position:static;width:calc(100% - 42px);margin:34px auto 0}.about-copy p{font-size:15px}
 .site-header nav{font-size:14px;gap:6px 14px}.work{margin-top:80px}}
.about-copy h2{font-family:Research Serif,Garamond,Georgia,serif;font-weight:400;font-size:44px;line-height:1.1;letter-spacing:-.025em;margin:0 0 24px;padding-bottom:.1em}
.about::after{display:none}
.about{background:none;-webkit-mask-image:linear-gradient(#000 82%,transparent);mask-image:linear-gradient(#000 82%,transparent)}
@media(max-width:740px){.about{-webkit-mask-image:none;mask-image:none}.about-copy h2{font-size:34px}}
.about-copy .lit-ink{background:none!important;color:#0c0c0c!important}
@media(max-width:740px){.site-header{flex-wrap:wrap;row-gap:12px}.site-header nav{order:3;width:100%;flex-wrap:nowrap;justify-content:space-between;gap:8px;font-size:13px;white-space:nowrap}}
/* inquiries: collaboration line, single-figure rows */
.project-heading p.with{font-size:13px;color:#444;margin-top:12px}
.project>.photo,.project>.chart{margin-top:0}
.project>figure.path+figure{margin-top:42px}
.chart .image-open img,.photo .image-open img{max-height:none}
/* full-bleed light sections, each with its own light; text inside keeps plain ink */
.work,.about{position:relative;isolation:isolate;overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);margin-right:0;max-width:none;height:auto;-webkit-mask-image:none;mask-image:none}
.work>.section-intro,.about>.about-copy{position:relative;z-index:2;width:calc(100% - 112px);max-width:1160px;margin:0 auto;left:auto;right:auto;bottom:auto}
.work .lit-ink,.about .lit-ink{background:none!important;color:inherit!important;-webkit-text-fill-color:currentColor!important}
/* work with me: a sheet lit from behind; the source follows the pointer and its rays come through towards us */
.work{margin-top:150px;padding:130px 0 140px;color:#0d0d0d;background:#8f8e88}
.work::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(circle min(620px,80vw) at var(--sx,75%) var(--sy,30%),#fffefa 0%,#f1f0ea 22%,#cfcec7 50%,#a4a39d 78%,#8f8e88 100%)}
.work::after{content:"";position:absolute;inset:-10%;z-index:1;pointer-events:none;mix-blend-mode:soft-light;opacity:.9;
 background:repeating-conic-gradient(from 3deg at calc(var(--sx,75%) + 10%*0) calc(var(--sy,30%)),rgba(255,255,255,0) 0deg 5deg,rgba(255,255,255,.75) 6.5deg 7.5deg,rgba(255,255,255,0) 9deg 13deg,rgba(0,0,0,.12) 15deg 16deg,rgba(255,255,255,0) 18deg 21deg);
 -webkit-mask-image:radial-gradient(circle 900px at var(--sx,75%) var(--sy,30%),#000 5%,transparent 75%);mask-image:radial-gradient(circle 900px at var(--sx,75%) var(--sy,30%),#000 5%,transparent 75%);filter:blur(5px)}
.work .section-intro{max-width:1160px}.work .section-intro>*{max-width:720px}
.work .invite .mail{color:inherit}
/* about: dark room, light falling through a slatted window; the window patch moves with the pointer */
.about{margin-top:0;padding:150px 0 170px;background:#0c0c0c;color:#e9e9e6}
.about::before{content:"";position:absolute;z-index:0;left:var(--sx,62%);top:var(--sy,45%);width:min(760px,95vw);height:430px;pointer-events:none;transform:translate(-50%,-50%) skewX(-22deg) rotate(-8deg);
 background:repeating-linear-gradient(180deg,rgba(255,250,236,.2) 0 34px,rgba(255,250,236,0) 34px 50px);filter:blur(2.5px);
 -webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent);mask-image:radial-gradient(closest-side,#000 55%,transparent)}
.about::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 60% 70% at var(--sx,62%) var(--sy,45%),rgba(255,250,236,.07),transparent 70%)}
.about-copy>*{max-width:640px}
.about-copy h2{color:#f2f2ef}
.about-copy p{font-size:17px;color:#d9d9d4}
footer{margin-top:0}
.about+*{margin-top:0}
@media(max-width:1000px){.work>.section-intro,.about>.about-copy{width:calc(100% - 72px)}}
@media(max-width:740px){.work>.section-intro,.about>.about-copy{width:calc(100% - 42px);margin:0 auto}
 .work{margin-top:100px;padding:80px 0 90px}.about{padding:90px 0 110px}.about::before{height:300px}
 .site-header nav{flex-wrap:wrap;justify-content:flex-start;gap:6px 16px}}
.about .about-copy .lit-ink{color:#f2f2ef!important;-webkit-text-fill-color:#f2f2ef!important}
.about .about-copy p.lit-ink{color:#d9d9d4!important;-webkit-text-fill-color:#d9d9d4!important}
/* the page ends in the dark room, like it began */
footer{position:relative;background:#0c0c0c;box-shadow:0 0 0 100vmax #0c0c0c;clip-path:inset(0 -100vmax -100vmax);color:#bdbdb8;border-top-color:#333}
footer .lit-ink{background:none!important;color:#bdbdb8!important;-webkit-text-fill-color:#bdbdb8!important}
.about .about-copy p{max-width:600px}
/* work with me, v2: text printed on a wall of glass panes; a soft lamp behind them diffuses differently through each texture */
.work::before,.work::after,.about::before,.about::after{content:none}
.work{background:#a7a6a0}
.glass{position:absolute;inset:0;z-index:0;display:flex}
.pane{position:relative;flex:1;overflow:hidden;background:#aeada7;box-shadow:inset 1px 0 0 rgba(255,255,255,.35),inset -1px 0 0 rgba(0,0,0,.22)}
.pane::before{content:"";position:absolute;inset:-12%;background:radial-gradient(circle min(340px,45vw) at calc(var(--sx,75%) - var(--o,0px) + 12%*0) var(--sy,30%),rgba(250,248,240,.95) 0%,rgba(236,234,226,.7) 35%,rgba(200,199,192,.25) 70%,transparent 100%);transform:translate(12%,12%)}
.pane:nth-child(1){--o:33.333vw*0}.pane:nth-child(2){--o:33.333vw}.pane:nth-child(3){--o:66.666vw}
.pane.fluted::before{filter:url(#glass-fluted)}
.pane.fluted::after{content:"";position:absolute;inset:0;mix-blend-mode:soft-light;background:repeating-linear-gradient(90deg,rgba(255,255,255,.55) 0,rgba(255,255,255,0) 7px,rgba(0,0,0,.18) 13px,rgba(255,255,255,.55) 16px)}
.pane.frosted::before{filter:blur(38px)}
.pane.hammered::before{filter:url(#glass-hammered)}
.pane.hammered::after{content:"";position:absolute;inset:0;mix-blend-mode:soft-light;opacity:.6;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.5),transparent 60%) 0 0/34px 30px,radial-gradient(circle at 70% 70%,rgba(0,0,0,.25),transparent 60%) 0 0/34px 30px}
/* about, v2: a sheet of paper under raking light; the lamp skims the surface from where the pointer is */
.about{background:#8a8983;color:#141414}
.paper{position:absolute;inset:0;z-index:0;filter:url(#raking);mix-blend-mode:normal;opacity:.92}
.about .about-copy .lit-ink,.about .about-copy p.lit-ink{color:#141414!important;-webkit-text-fill-color:#141414!important}
.about .about-copy h2,.about .about-copy p{color:#141414;text-shadow:calc(var(--tx,1)*-1px) calc(var(--ty,0)*-1px) 0 rgba(255,255,255,.35),calc(var(--tx,1)*1.4px) calc(var(--ty,0)*1.4px) 1.5px rgba(0,0,0,.28)}
.pane::before{inset:-80px;transform:none;background:radial-gradient(circle min(340px,45vw) at calc(var(--sx,75%) - var(--o) + 80px) calc(var(--sy,30%) + 80px),rgba(250,248,240,.95) 0%,rgba(236,234,226,.7) 35%,rgba(200,199,192,.25) 70%,transparent 100%)}
.pane:nth-child(1){--o:0px}
.paper{opacity:1}
.pane::before{background:radial-gradient(circle min(460px,55vw) at calc(var(--sx,75%) - var(--o) + 80px) calc(var(--sy,30%) + 80px),rgba(252,250,244,1) 0%,rgba(238,236,229,.75) 30%,rgba(205,204,197,.3) 65%,transparent 100%)}
.about .about-copy h2,.about .about-copy p{text-shadow:calc(var(--tx,1)*-.8px) calc(var(--ty,0)*-.8px) 0 rgba(255,255,255,.25),calc(var(--tx,1)*1.2px) calc(var(--ty,0)*1.2px) 1px rgba(0,0,0,.18)}
/* lights off: the wall falls back to a flat dim ambient; section lamps fade */
.wall::after{content:"";position:absolute;inset:0;background:#8e8e8b;opacity:calc(1 - var(--wall-on,1))}
.pane::before{opacity:var(--on,1)}
.paper{opacity:calc(.3 + .7*var(--on,1))}
/* WebGL fluted glass replaces the CSS panes when available */
.glass-gl{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.has-glass .glass{display:none}
.has-glass{background:#5f5e5a}
/* WebGL paper replaces the SVG filter when available; the letterpress impression replaces the CSS emboss */
.paper-gl{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.has-paper .paper{display:none}
.has-paper .about-copy h2,.has-paper .about-copy p{text-shadow:none}
.has-paper .about-copy .lit-ink,.has-paper .about-copy p.lit-ink{color:#1b1a18!important;-webkit-text-fill-color:#1b1a18!important}
/* the ink is drawn by the paper shader; the HTML text stays in place, transparent, for selection and reading tools */
.has-paper .about-copy h2,.has-paper .about-copy p,.has-paper .about-copy .lit-ink,.has-paper .about-copy p.lit-ink{color:transparent!important;-webkit-text-fill-color:transparent!important;text-shadow:none}
.has-paper .about-copy ::selection{background:rgba(40,40,40,.25)}
footer{background:#000;box-shadow:0 0 0 100vmax #000;border-top-color:#222}
/* inquiries, compact: text beside the materials, which sit side by side at a common height;
   methods, objects and fields run underneath the whole project */
.tags{margin:26px 0 0;display:grid;gap:8px}
.tags>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;padding-left:76px}
.tags dt{font-size:11px;color:#666;width:70px;margin-left:-76px;flex:none}
.tags dd{margin:0;font-size:11px;line-height:1.3;padding:3px 7px;border:1px solid #bdbdb5;border-radius:2px;color:#222;white-space:nowrap}
.figures{display:flex;gap:28px;align-items:flex-start}
.figures>figure,.figures>figure+figure,.project .figures>figure{width:auto;max-width:none;margin:0;flex:var(--ar,1) 1 0;min-width:0}
.figures .image-open img,.figures .sketch img{width:100%;height:auto;max-height:none;aspect-ratio:auto}
.figures .sketch{--ar:.79}.figures .path{--ar:1.02}.figures .photo{--ar:1.5}.figures .network{--ar:.99}.figures .chart{--ar:1.46}
.figures figcaption{font-size:11px!important;padding-top:12px!important}
/* Git: the drawing with its caption beside it, the long git blame strip underneath */
.figures.stack{flex-direction:column;gap:22px}
.figures.stack>figure{flex:none;width:100%}
.figures.stack>.sketch{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px;align-items:end}
.figures.stack>.sketch img{height:250px;width:auto}
@media(min-width:741px){
 .project{margin-bottom:96px;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);column-gap:56px}
 .project>.figures{grid-column:2;grid-row:1}
 .project>.tags{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:34px}
 .project>.tags>div{padding-left:0;align-content:start}
 .project>.tags dt{margin:0 0 4px;width:100%}
}
@media(max-width:740px){.project{margin-bottom:72px}.figures{gap:18px}.figures.stack>.sketch img{height:180px}}
@media(max-width:480px){.tags>div{padding-left:0}.tags dt{margin-left:0;width:100%}.figures.stack>.sketch{grid-template-columns:1fr}}
/* inquiries: "En savoir plus" opens the related publications (in place without JS, in a dialog with it) */
.more{margin-top:20px}
.more>summary{display:inline-block;cursor:pointer;font-size:12px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;list-style:none}
.more>summary::-webkit-details-marker{display:none}
.more>summary::after{content:" +"}
.more[open]>summary::after{content:" −"}
.more-panel{margin-top:14px}
.more-panel .project-link{margin:0 0 6px;display:inline-block}
.more-title{font-family:Research Serif,Garamond,Georgia,serif;font-size:28px;line-height:1.15;letter-spacing:-.01em;margin:0 0 14px}
.more-heading{font-size:12px;font-weight:400;color:#555;margin:26px 0 4px}
.more-panel .publication{grid-template-columns:44px 1fr;border-color:#c8c8c0;padding:14px 0}
.more-panel .publication h4{font-size:19px;text-shadow:none}
.more-panel .publication p{font-size:12px}
.more-dialog{width:min(680px,calc(100vw - 32px));max-height:86vh;overflow:auto;border:1px solid #555;background:#fafaf6;color:#111;padding:22px 32px 30px}
.more-dialog::backdrop{background:#000b}
.more-dialog form{display:flex;justify-content:flex-end}
.more-dialog form button{background:transparent;border:0;text-decoration:underline;font-size:12px}
.more-dialog .more-panel{margin-top:0}
@media(max-width:740px){.more-dialog{padding:16px 18px 24px}.more-title{font-size:24px}}
.more-dialog .lit-ink,.more-panel .lit-ink{background:none!important;color:#111!important;-webkit-text-fill-color:currentColor!important}
/* tags: text and frame are inked like the rest of the wall, so the light burns both;
   the frame is the same lit gradient, masked to a 1px ring */
.tags dd{position:relative;border-color:transparent}
.tags dd::before{content:"";position:absolute;inset:-1px;border:1px solid transparent;border-radius:inherit;pointer-events:none;opacity:.42;background-image:var(--ink-grain,none),radial-gradient(circle var(--beam,300px) at var(--ink-x,-500px) var(--ink-y,-500px),#8c8c8c 0%,#5a5a5a 30%,#1c1c1c 68%,#050505 100%);background-size:128px 128px,auto;background-blend-mode:multiply;background-attachment:fixed;background-origin:border-box;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.tags dt.lit-ink{opacity:.75}
.more-panel .tags dd::before,.more-dialog .tags dd::before{display:none}
.more-title+.more-heading{margin-top:8px}
/* work with me: a dark glass, contrasting with the inquiries wall */
.work{background:#3a3a37}
/* "En savoir plus": the underline is drawn as a lit line, since text-clipped underlines paint unevenly */
.more>summary{position:relative;text-decoration:none}
.more>summary::before{content:"";position:absolute;left:0;right:2ch;bottom:-2px;height:1px;background-image:radial-gradient(circle var(--beam,300px) at var(--ink-x,-500px) var(--ink-y,-500px),#8c8c8c 0%,#5a5a5a 30%,#1c1c1c 68%,#050505 100%);background-attachment:fixed}
/* about: the career story runs over a few paragraphs */
.about-copy p+p{margin-top:16px}.about-copy p{max-width:600px}
/* phone pass (28 Oct): menu and languages on one block, location on its own line, office photo as a still backdrop */
@media(max-width:740px){
 .site-header{flex-wrap:nowrap;align-items:flex-start;row-gap:0;gap:16px}
 .site-header nav{order:0;width:auto;flex:1 1 auto;flex-wrap:wrap;justify-content:flex-start;gap:4px 16px;font-size:14px;line-height:1.5;white-space:nowrap;padding-top:0}
 .languages{flex:none;margin-left:0;font-size:14px;line-height:1.5}
 .intro-copy>.affiliations .sep{display:none}
 .intro-copy>.affiliations .place{display:block;font-size:.8em;color:#bdbdbd;margin-top:4px}
 .scene{--scene-pos:38% 55%}
 .scene-base{filter:brightness(.34) contrast(1.05) grayscale(1)}
 .scene-lit,.scene-glow,.scene-bloom{display:none}
 .scene::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.5) 45%,rgba(0,0,0,.2) 80%,rgba(0,0,0,.35) 100%)}
 .introduction{border-bottom:1px solid #2a2a2a}
}
@media(max-width:740px){.scene{display:block}.introduction{background:#050505}}
@media(max-width:740px){.scene{position:absolute;inset:0;width:auto;height:auto;margin:0}.scene>div{background-size:cover}.scene::after{background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.55) 30%,rgba(0,0,0,.78) 60%,rgba(0,0,0,.6) 100%)}.introduction{border-bottom:0;box-shadow:0 1px 0 #333}}
@media(max-width:740px){.scene{top:0;bottom:0;height:auto!important;min-height:100%}.intro-copy{padding:56px 0 72px}.night .publications,.night .publications::before{background:#050505}}
/* footer: lab, publication profiles, contact */
footer .elsewhere{display:flex;flex-wrap:wrap;gap:28px 72px;align-items:flex-start}
.foot-group>p{margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
footer .foot-title{font-size:11px;color:#77776f;margin-bottom:12px;letter-spacing:.02em}
footer .foot-title.lit-ink,footer .foot-title{color:#77776f!important;-webkit-text-fill-color:#77776f!important}
footer .mail{padding:0;border:0;background:none;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;font-size:inherit;color:inherit}
@media(max-width:740px){footer .elsewhere{gap:26px 40px}}

/* Work with me: interests first, then how to work together */
.work .section-intro h2+.themes-title{margin-top:14px}
.work .work-intro{margin-top:26px}