/* Leo's portfolio: what the shared project-page styles need on top (nav wordmark instead of the studio logo) */
.nav .brand{font:600 15px/1 var(--display);letter-spacing:-.01em;white-space:nowrap}
/* award badges that link to the award page */
a.badge{color:inherit;text-decoration:none;transition:opacity .2s}
a.badge:hover{opacity:.75}
a.badge:hover span{text-decoration:underline;text-underline-offset:3px}
/* 10/16 Leo: every award as its official logo, never a typed award name: the badge shows the logo alone, larger
   (the name stays for screen readers) */
a.badge img{height:72px}
a.badge span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* "More projects": the end of every project page (three tiles + the way back to the overview) */
.more{--m-ink:#1d1d1f;--m-ink2:#6e6e73;--m-line:#e5e5ea;--m-card:#fff;border-top:1px solid var(--m-line);padding:clamp(48px,6vw,72px) 0 clamp(56px,7vw,88px);color:var(--m-ink)}
[data-theme="dark"] .more{--m-ink:#f5f5f7;--m-ink2:#86868b;--m-line:#2c2c2e;--m-card:#fff}
.more__in{max-width:1080px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.more__head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px}
.more__eyebrow{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--m-ink2)}
.more__title{margin:0;font-size:clamp(26px,3vw,34px);line-height:1.15;letter-spacing:-.025em;font-weight:600;color:var(--m-ink)}
.more__all{flex:none;display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 18px;border-radius:999px;background:var(--m-ink);color:var(--m-card);
  font-size:14px;font-weight:600;text-decoration:none;transition:transform .2s ease,opacity .2s ease}
[data-theme="dark"] .more__all{color:#000}
.more__all:hover{transform:translateY(-1px);opacity:.9}
.more__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.more__card{display:block;min-width:0;color:inherit;text-decoration:none}
.more__img{display:block;aspect-ratio:2/1;border-radius:16px;border:1px solid var(--m-line);background:var(--m-card);overflow:hidden}
[data-theme="dark"] .more__img{border-color:transparent}
.more__img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.more__img img.fit{object-fit:contain}
.more__card:hover .more__img img{transform:scale(1.03)}
.more__card b{display:block;margin-top:10px;font-size:16px;line-height:1.25;font-weight:600;color:var(--m-ink)}
.more__line{display:block;margin-top:2px;font-size:13px;line-height:1.4;color:var(--m-ink2)}
/* with a research group chosen on the home page (more.js): the group's colour, its projects, the way back to it */
.more[data-lens="personal-robots"]{--m-g:#3b7be6}.more[data-lens="tangible-media"]{--m-g:#1f9e86}.more[data-lens="cyborg-psychology"]{--m-g:#7a63e6}
.more__eyebrow{display:flex;align-items:center;gap:7px}
.more__dot{width:8px;height:8px;border-radius:50%;background:var(--m-g,currentColor);box-shadow:0 0 0 3px rgba(127,127,127,.18)}
.more__overview{margin-left:auto;line-height:40px;font-size:14px;font-weight:500;color:var(--m-ink2);text-decoration:none;white-space:nowrap}
.more__overview:hover{color:var(--m-ink)}
.more__card.is-soon{cursor:default}
.more__card.is-soon .more__img img{transform:none}
@media (max-width:760px){.more__grid{grid-template-columns:1fr 1fr}.more__grid .more__card:nth-child(3){display:none}}
@media (max-width:480px){.more__head{flex-direction:column;align-items:flex-start}.more__overview{margin-left:0}.more__grid{grid-template-columns:1fr}.more__grid .more__card:nth-child(3){display:block}}

/* ---------- global nav, after apple.com (Leo 10/21 "顶部菜单栏 学苹果这种干净的"): one quiet 44 px row, 12 px type, the
   name, five links, Contact and the theme switch spread evenly over 1024 px; no pills, no line. Phones: name, theme, menu. ---------- */
:root{--nav:44px}
.nav{background:rgba(250,250,252,.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:0}
[data-theme="dark"] .nav{background:rgba(22,22,23,.8)}
.nav.scrolled{border-color:transparent}
.nav .wrap{max-width:1024px;height:var(--nav);padding:0 22px;gap:0;justify-content:space-between}
.nav ul,.nav .links,.nav .right{display:contents}
.nav ul li{list-style:none}
.nav .brand,.nav ul a,.nav .right>a{display:block;padding:0 8px;font:400 12px/var(--nav) var(--text);letter-spacing:-.01em;color:var(--ink);opacity:.8;
  white-space:nowrap;background:none;border-radius:0;transition:opacity .2s}
.nav .brand{font-weight:600;opacity:.92}
.nav .brand:hover,.nav ul a:hover,.nav ul a.on,.nav .right>a:hover{opacity:1}
.nav .theme{display:grid;place-items:center;width:auto;height:var(--nav);padding:0 8px;border:0;border-radius:0;background:none;color:var(--ink);opacity:.8;cursor:pointer}
.nav .theme:hover{opacity:1}
.nav .theme svg{width:15px;height:15px}
.nav .burger{display:none;position:relative;width:40px;height:var(--nav);margin-right:-8px;padding:0;border:0;border-radius:0;background:none;color:var(--ink);cursor:pointer}
.nav .burger i{position:absolute;left:12px;top:50%;width:16px;height:1.2px;border-radius:1px;background:currentColor;opacity:.8;transition:transform .25s;transform:translateY(-3px)}
.nav .burger i:last-child{transform:translateY(3px)}
body.menu .nav .burger i:first-child{transform:rotate(45deg)}
body.menu .nav .burger i:last-child{transform:rotate(-45deg)}
.mnav{position:fixed;inset:var(--nav) 0 0;z-index:49;display:none;padding-top:20px;background:#fafafc}
[data-theme="dark"] .mnav{background:#161617}
body.menu .mnav{display:block}
.mnav .wrap{max-width:1024px;padding:0 48px}
.mnav a{display:block;padding:6px 0;border:0;font:600 28px/1.25 var(--display);letter-spacing:-.015em;color:var(--ink)}
.mnav a.c{margin-top:22px;font:400 14px/1.4 var(--text);color:var(--ink-2)}
@media (max-width:833px){
  .nav .wrap{padding:0 16px}
  .nav ul,.nav .links,.nav .right>a{display:none}
  .nav .brand{margin-right:auto;padding-left:0}
  .nav .burger{display:block}
}
@media (max-width:480px){.mnav .wrap{padding:0 28px}}