@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;450;500;600;650;700&display=swap');
:root{--bg:#f6f2ea;--ink:#292622;--muted:#68605a;--dark:#36322e;--rose:#b2b79c;--pink:#beca9a;--button:#beca9a;--blue:#245cd4;--border:#d8d0c5}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Outfit,'Trebuchet MS',sans-serif;font-size:17px;line-height:1.65}body.locked{overflow:hidden}a{color:#616545;text-decoration:none}a:hover{text-decoration:underline}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid #245cd4;outline-offset:5px}button:disabled{cursor:default}img{display:block;max-width:100%}.skip{position:fixed;left:15px;top:-60px;background:white;padding:10px;z-index:100}.skip:focus{top:15px}.topbar{height:70px;background:var(--dark);color:#f6f2ea;display:flex;justify-content:space-between;align-items:center;padding:0 30px;position:sticky;top:0;z-index:30;box-shadow:0 4px 14px #0002}.brand{color:inherit;display:flex;align-items:center;gap:13px;font-size:18px}.brand:hover{text-decoration:none}.monogram{display:grid;place-items:center;width:38px;height:38px;border:1px solid #a59a8b;border-radius:50%;font-size:22px;font-weight:300}.nav-right{display:flex;align-items:center;gap:27px}.nav-hint{font-size:12px;letter-spacing:.12em;color:#c3bcb2}.menu-button{background:transparent;border:0;color:inherit;width:42px;height:42px;font-size:26px;display:grid;place-items:center}.menu{position:fixed;inset:70px 0 0;background:var(--dark);color:var(--bg);z-index:29;overflow:auto;padding:42px max(30px,10vw)}.menu[hidden]{display:none}.menu nav{max-width:900px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:45px}.menu a{color:inherit;display:block;font-size:25px;line-height:1.9}.menu .small{font-size:13px;letter-spacing:.15em;color:#bab0a3;margin-bottom:12px}.menu-foot{border-top:1px solid #ffffff25;margin:40px auto 0;padding-top:24px;max-width:900px;color:#bdb5aa;font-size:14px}main{max-width:1152px;padding:0 40px;margin:0 auto}.hero{position:relative;margin:30px -18px 0;padding:65px 65px 70px;background:#fffdf8;clip-path:polygon(1% 1%,8% 0%,16% 1%,24% .5%,31% 1.2%,39% 0%,47% .5%,55% 0%,64% 1%,73% .2%,81% 1%,90% .5%,99% 1%,99.5% 13%,99% 23%,100% 34%,99.3% 44%,100% 56%,99% 66%,99.6% 78%,99% 88%,100% 98%,91% 99%,83% 98.5%,75% 100%,65% 99%,56% 100%,47% 99%,38% 100%,29% 98.6%,20% 99.6%,10% 99%,0 100%,.6% 88%,0 76%,.7% 65%,0 53%,.5% 41%,0 29%,.6% 17%);display:grid;grid-template-columns:1.12fr 1fr;gap:45px;align-items:center}.hero::before{content:'';position:absolute;inset:0;opacity:.055;background-image:url('assets/paper.svg');pointer-events:none}.hero-copy,.hero-portrait{position:relative}.hero h1{font-size:45px;line-height:1.15;font-weight:600;letter-spacing:-.035em;margin:0 0 18px}.hero .alias{font-size:20px;margin:0 0 15px;color:#74635a}.hero .tagline{max-width:350px;margin:0 0 24px}.hero-points{list-style:none;margin:0 0 29px;padding:0;font-size:16px;line-height:2.1}.hero-points span{display:inline-block;width:29px}.button{display:inline-flex;align-items:center;justify-content:center;gap:15px;border:0;border-radius:10px;background:#beca9a;color:#292622;padding:11px 25px;font-size:18px;box-shadow:6px 8px 16px -12px #0009;transition:background .2s,transform .2s}.button:hover{background:#b2b79c;text-decoration:none;transform:translateY(-2px)}.hero-portrait{margin:0;align-self:center;transform:rotate(1.5deg);background:#fff;padding:10px 10px 0;box-shadow:2px 6px 17px #0001}.hero-portrait:before{content:'';position:absolute;width:105px;height:26px;background:#d8c9b4a0;top:-12px;left:35%;transform:rotate(-5deg)}.hero-portrait img{width:100%;height:350px;object-fit:cover;object-position:62% 50%}.hero-portrait figcaption{font-size:13px;color:#74635a;text-align:center;padding:12px 4px}.section{margin-top:85px}.section-heading{font-size:32px;line-height:1.2;letter-spacing:-.025em;font-weight:600;margin:0 0 15px}.section-intro{max-width:820px;margin:0 0 25px;color:#5e5650}.blue{color:var(--blue)}.cards{display:grid;grid-template-columns:1fr 1fr;gap:22px}.card{padding:26px;border-radius:8px;background:var(--rose);color:#251f1b;display:flex;flex-direction:column;align-items:flex-start}.card:nth-child(even){background:var(--pink)}.card h3{font-size:24px;font-weight:550;line-height:1.25;margin:8px 0 12px}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.16em;font-weight:500}.card p{margin:0 0 18px;font-size:16px;line-height:1.65}.card figure{margin:0 0 17px;width:100%;overflow:hidden;border-radius:5px;background:#f3ede5}.card img{width:100%;height:245px;object-fit:cover;transition:transform .5s}.card a:hover img{transform:scale(1.025)}.card a.cover{width:100%}.card a.read{color:#616545;border-bottom:1px solid #61654555;line-height:1.8;margin-top:auto}.placeholder{min-height:205px;background:#beca9a59;border:1px dashed #b2b79c;box-shadow:none}.placeholder:nth-child(even){background:#b2b79c21}.placeholder h3{font-size:23px}.placeholder .space{flex:1;min-height:25px}.soon{color:#766963;font-size:13px}.section-bottom{text-align:center;margin-top:26px}.feature{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;margin-top:28px}.feature img{width:100%;height:310px;object-fit:cover;border-radius:7px}.feature p{margin:0 0 22px}.photo-strip{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:14px;margin:25px 0}.photo-strip button{border:0;padding:0;background:none;overflow:hidden;border-radius:6px}.photo-strip img{width:100%;height:220px;object-fit:cover;transition:transform .4s}.photo-strip button:hover img{transform:scale(1.03)}.journal-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.journal{border:1px solid #93877b55;border-radius:8px;padding:20px;background:#f9f7f2}.journal img{width:100%;height:260px;object-fit:cover;border-radius:4px}.journal h3{font-weight:550;font-size:25px;margin:18px 0 10px}.journal p{margin:0 0 20px}.journal .button{font-size:16px;padding:8px 18px}.footer{margin-top:85px;padding:36px 30px;background:var(--dark);color:#c8c0b5;text-align:center;font-size:14px}.footer .name{color:#f5f1e9;font-size:22px;margin-bottom:10px}.footer a{color:#f3ece1;margin:0 12px}.footer .credits{margin:18px 0 0;font-size:12px}.detail-head{padding:55px 0 20px;max-width:850px}.back{font-size:14px;display:inline-block;margin-bottom:30px}.detail-head h1{font-weight:550;letter-spacing:-.04em;font-size:clamp(34px,5vw,56px);line-height:1.12;margin:15px 0}.detail-head .subtitle{color:#616545;font-size:23px;margin:0 0 20px}.detail-head .lead{font-size:20px;line-height:1.6}.detail-cover{width:100%;max-height:570px;object-fit:cover;border-radius:8px}.story-text{max-width:780px;margin:40px auto;font-size:19px;line-height:1.85}.gallery-title{font-size:28px;font-weight:500;margin-top:50px}.gallery{columns:3;column-gap:18px}.gallery figure{margin:0 0 20px;break-inside:avoid;background:#eee7dc;border-radius:6px;overflow:hidden}.gallery button{width:100%;padding:0;background:none;border:0;display:block}.gallery img{width:100%;height:auto}.gallery figcaption{font-size:13px;color:#6d6257;padding:10px 12px}.next-story{margin-top:50px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--border);padding-top:25px}.lightbox{border:0;background:#201d1af5;color:white;position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:60px 70px 35px}.lightbox::backdrop{background:#201d1a}.lightbox .image-wrap{height:calc(100% - 50px);display:flex;align-items:center;justify-content:center}.lightbox img{max-width:100%;max-height:100%;object-fit:contain}.lightbox .caption{text-align:center;font-size:15px;margin-top:18px}.lightbox button{background:transparent;border:0;color:white;font-size:32px;position:absolute;z-index:1;width:48px;height:48px}.close-lightbox{top:8px;right:15px}.prev-photo{left:10px;top:48%}.next-photo{right:10px;top:48%}.about-text{max-width:730px}.interest-links{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0}.interest-links a{padding:8px 17px;border:1px solid var(--border);border-radius:6px;color:var(--ink)}
@media(min-width:1500px){main{max-width:1250px}.hero{padding:75px}.hero-portrait img{height:390px}}
@media(max-width:800px){main{padding:0 24px}.topbar{padding:0 18px;height:64px}.nav-hint{display:none}.menu{top:64px}.hero{margin:20px -10px 0;padding:45px 28px;gap:28px}.hero h1{font-size:36px}.hero-portrait img{height:320px}.hero-points{font-size:14px}.hero .tagline{font-size:16px}.card{padding:21px}.card img{height:210px}.feature{gap:24px}.feature img{height:260px}.photo-strip img{height:165px}.journal img{height:210px}.gallery{columns:2}}
@media(max-width:580px){body{font-size:16px}.brand{font-size:16px}.hero{display:flex;flex-direction:column;padding:40px 30px 45px;align-items:stretch}.hero h1{font-size:39px}.hero .tagline{max-width:none}.hero-points{font-size:15px;margin-bottom:20px}.hero-portrait{width:100%;max-width:340px;align-self:center;margin-top:10px}.hero-portrait img{height:300px}.section{margin-top:55px}.section-heading{font-size:28px}.cards,.journal-grid,.feature{grid-template-columns:1fr}.card img{height:235px}.placeholder{min-height:170px}.feature img{height:265px}.photo-strip{gap:8px}.photo-strip img{height:125px}.journal img{height:250px}.menu nav{grid-template-columns:1fr;gap:25px}.menu a{font-size:23px}.gallery{columns:2;column-gap:10px}.gallery figcaption{padding:8px;font-size:12px}.story-text{font-size:17px}.detail-head{padding-top:30px}.detail-head .lead{font-size:18px}.lightbox{padding:65px 30px 40px}.prev-photo{left:0}.next-photo{right:0}.lightbox button{width:35px}.next-story{flex-direction:column}.footer{margin-top:55px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
/* Match the reference's paper hero and scroll-revealed navigation. */
.hero{max-width:1000px;margin:32px auto 0;padding:42px 48px 105px;gap:42px;align-items:start;background:transparent;clip-path:none;filter:drop-shadow(5px 9px 13px #0004)}
.hero::before{opacity:1;background:#f0f0f0;clip-path:polygon(0 0,100% 0,100% 100%,96% 99%,94% 98%,90% 97.5%,87% 96.4%,83% 96%,79% 95%,75% 95.4%,71% 95.2%,67% 96%,64% 95.8%,60% 95%,56% 94%,52% 93.5%,48% 92.7%,44% 91.8%,40% 90%,36% 90%,32% 89.4%,28% 89%,24% 89.3%,20% 88.4%,16% 88.7%,12% 87.3%,8% 86.6%,5% 85.5%,0 84.5%)}
.hero h1{font-size:36px;line-height:1.3}.hero .alias{font-size:18px;margin-bottom:12px}.hero .tagline{max-width:420px}.hero-points{margin-bottom:24px}.hero-copy>.button{display:flex;width:max-content;margin:0 auto}.hero-portrait{transform:none;background:transparent;box-shadow:none;padding:0;align-self:start;margin-top:4px}.hero-portrait:before{display:none}.hero-portrait img{height:335px;border-radius:10px;object-position:75% 50%}.hero-portrait figcaption{display:none}.home-page{padding-top:15px}.home-page .topbar{position:fixed;inset:0 0 auto;transform:translateY(-110%);transition:transform .25s}.home-page .topbar.revealed,.home-page .topbar:focus-within{transform:translateY(0)}.nav-hint{display:none}
@media(max-width:800px){.hero{padding:35px 32px 100px;gap:25px}.hero h1{font-size:32px}.hero-portrait img{height:310px}.hero .tagline{font-size:16px}}
@media(max-width:580px){.home-page{padding-top:64px}.home-page .topbar{transform:none}.hero{margin:20px 0 0;padding:32px 24px 105px}.hero h1{font-size:34px}.hero::before{clip-path:polygon(0 0,100% 0,100% 100%,90% 99%,80% 99.3%,70% 98.4%,60% 98.8%,50% 98%,40% 98.4%,30% 97.4%,20% 97.6%,10% 97%,0 96%)}.hero-portrait{margin-top:25px}.hero-portrait img{height:310px}.hero-copy>.button{margin:0}.hero-points{font-size:14px}}

/* Research stories */
.research-card .cover img{object-fit:contain;background:#fff}.research-card .eyebrow{line-height:1.6}.research-cover{object-fit:contain!important;background:#fff;padding:20px;box-sizing:border-box}.paper-citation{padding:28px;background:#eee7f4;border-radius:18px;margin-bottom:44px}.paper-citation h2{font-size:25px;line-height:1.4}.paper-citation p{font-size:16px}.research-section{margin:38px 0}.research-section h2{font-size:27px;line-height:1.3}.research-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.research-metrics>div{background:#eee7f4;border-radius:16px;padding:24px 16px}.research-metrics strong{display:block;font-size:32px;color:#665087}.research-metrics span{display:block;font-size:14px;line-height:1.5;margin-top:8px}.metric-note{font-size:13px!important;color:#777}.research-gallery{columns:2}.research-gallery figure{background:#fff;border-radius:14px;padding:14px;box-sizing:border-box}.research-gallery img{object-fit:contain}.research-gallery figcaption{color:#555;line-height:1.5;font-size:14px;padding:12px 4px}.research-story .detail-head h1{overflow-wrap:anywhere}@media(max-width:650px){.research-gallery{columns:1}.research-metrics{grid-template-columns:1fr}.research-metrics>div{padding:18px}.paper-citation{padding:20px}.paper-citation h2{font-size:21px}.research-cover{padding:5px}}

/* Homepage portrait: preserve the full supplied photograph. */
.hero-portrait img{height:auto;aspect-ratio:3 / 4;object-fit:contain;object-position:center}

/* Rotate sideways originals for upright viewing, including the lightbox. */
.upright-photo{position:relative;display:block;width:100%;overflow:hidden}.gallery .upright-photo img{position:absolute;left:50%;top:50%;width:var(--rotated-width);max-width:none;height:auto;transform:translate(-50%,-50%) rotate(-90deg)}
.lightbox img.upright-lightbox{transform:rotate(-90deg);max-width:calc(100dvh - 170px);max-height:calc(100vw - 100px);width:auto;height:auto}
/* Keep the clarinet player's head within the homepage card crop. */
.journal a[href="story.html?project=music"] img{object-position:50% 22%}

/* About Me: horizontally scrollable personal photo album. */
.about-album{margin:20px 0 40px;min-width:0}.album-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.album-heading h2{font-size:25px;line-height:1.3;margin:0 0 8px}.album-heading p{font-size:14px;color:var(--muted);margin:0}.album-controls{display:flex;gap:8px;flex-shrink:0}.album-controls button{border:1px solid var(--border);background:var(--button);color:var(--ink);width:44px;height:44px;border-radius:50%;font-size:22px}.album-controls button:disabled{opacity:.35}.album-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:5px 0 16px;scrollbar-width:thin;scrollbar-color:var(--rose) var(--bg)}.album-slide{flex:0 0 46%;min-width:0;margin:0;scroll-snap-align:start;border-radius:9px;background:#eee7dc;overflow:hidden}.album-slide button{border:0;background:transparent;padding:0;display:block;width:100%}.album-slide img{width:100%;aspect-ratio:3 / 2;height:auto;object-fit:contain}.album-slide figcaption{padding:12px 16px;font-size:14px;color:var(--muted)}@media(max-width:650px){.album-slide{flex-basis:90%}.album-heading{align-items:flex-end;gap:12px}.album-heading h2{font-size:22px}.album-controls button{width:38px;height:38px}.album-heading p{font-size:13px}}

/* Research summaries with methods, data and experimental evidence. */
.paper-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin:24px 0}.paper-link{font-size:15px;text-decoration:underline;text-underline-offset:4px}.research-card>.paper-link{margin-top:13px;color:#616545}.research-article>.paper-citation{margin:20px 0 28px}.research-contents{display:flex;gap:9px;flex-wrap:wrap;border-bottom:1px solid var(--border);padding-bottom:28px;margin-bottom:40px}.research-contents a{font-size:13px;border:1px solid var(--border);border-radius:7px;padding:7px 12px;color:var(--ink)}.research-body{max-width:900px;margin:auto}.research-chapter{margin:0 0 54px;scroll-margin-top:90px}.research-chapter h2{font-size:28px;line-height:1.3;letter-spacing:-.02em}.research-chapter p{font-size:18px;line-height:1.85;color:#514a44}.research-figure{margin:26px 0;background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px}.research-figure button{display:block;width:100%;padding:0;border:0;background:none}.research-figure img{width:100%;height:auto;max-height:540px;object-fit:contain}.research-figure figcaption{font-size:14px;color:var(--muted);line-height:1.6;padding-top:15px}.research-table{max-width:100%;overflow-x:auto;margin:24px 0;border:1px solid var(--border);border-radius:10px;background:#fffcf7}.research-table table{width:100%;border-collapse:collapse;font-size:15px}.research-table caption{text-align:left;padding:15px 18px;color:var(--muted);font-size:13px}.research-table th,.research-table td{padding:13px 18px;text-align:left;border-top:1px solid var(--border)}.research-table thead{background:#eee7f4}.research-table tbody th{font-weight:500}.research-table tbody tr:last-child{background:#f0ebe3}@media(max-width:650px){.research-chapter h2{font-size:24px}.research-chapter p{font-size:16px}.research-figure{padding:10px}.research-table th,.research-table td{padding:10px 12px;font-size:13px}.paper-actions .button{font-size:16px}.research-contents{gap:6px}.research-contents a{font-size:12px}}

/* Preserve the article screenshot and frame the musician on the detail page. */
.research-card a[href="story.html?project=review"] img{height:auto;object-fit:contain}
.detail-cover[src="assets/image44.webp"]{object-position:50% 22%}

.detail-cover[src="assets/volleyball-detail.jpg"]{max-height:none;height:auto;object-fit:contain}

/* Personal introduction supplied by Bonnie. */
.hero-introduction{max-width:430px;margin:23px 0 30px}.hero-interest{font-size:21px;line-height:1.6;margin:0 0 20px;color:#292622}.hero-interest strong{color:#616545;font-weight:600}.hero-welcome{font-size:17px;line-height:1.85;color:#514a44;margin:0;padding-left:18px;border-left:3px solid #b2b79c}@media(max-width:800px){.hero-interest{font-size:19px}.hero-welcome{font-size:16px}}@media(max-width:580px){.hero-introduction{max-width:none;margin:20px 0 25px}.hero-interest{font-size:19px}.hero-welcome{font-size:16px;line-height:1.8;padding-left:14px}}

.detail-cover[src="assets/new-year-gala-hd.jpg"]{max-height:none;height:auto;object-fit:contain}
.feature img[src="assets/new-year-gala-hd.jpg"]{object-position:center 70%}
