:root{
  --bg:#FCFCFA; --panel:#FFFFFF; --ink:#191B1F; --soft:#474B52; --muted:#8B9099;
  --line:#E6E5E0; --line-2:#D8D7D1; --accent:#2B4C6F; --accent-deep:#1E3850;
  --maxw:880px; --sans:"Libre Franklin",system-ui,sans-serif; --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.62; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;}
a{color:var(--accent-deep); text-decoration:none; border-bottom:1px solid rgba(43,76,111,.3); transition:color .15s,border-color .15s;}
a:hover{color:var(--accent); border-color:var(--accent);}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}

nav{position:sticky; top:0; z-index:10; background:rgba(252,252,250,.88); backdrop-filter:blur(6px); border-bottom:1px solid var(--line);}
nav .wrap{display:flex; justify-content:space-between; align-items:center; padding:13px 32px;}
nav .brand{font-weight:600; font-size:.95rem; letter-spacing:-.01em; border:none;}
nav .links{display:flex; gap:22px; flex-wrap:wrap;}
nav .links a{font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--soft); border:none;}
nav .links a:hover{color:var(--accent);}
nav .links a.here{color:var(--accent);}

header.hero{padding:64px 0 24px;}
.hero-grid{display:grid; grid-template-columns:1fr 200px; gap:48px; align-items:start;}
.mark{display:flex; align-items:center; gap:12px; margin:0 0 18px;}
.mark canvas{width:46px; height:46px; border-radius:50%; border:1px solid var(--line-2); display:block;}
.eyebrow{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin:0;}
h1{font-weight:700; font-size:clamp(2.3rem,5.5vw,3.2rem); line-height:1.04; letter-spacing:-.022em; margin:0 0 22px;}
.intro{font-size:1.1rem; color:var(--soft); margin:0 0 26px; max-width:54ch;}
.contacts{display:flex; flex-wrap:wrap; gap:8px;}
.contacts a{font-family:var(--mono); font-size:.76rem; padding:7px 12px; border:1px solid var(--line-2); color:var(--soft); background:var(--panel); border-radius:3px;}
.contacts a:hover{border-color:var(--accent); color:var(--accent);}

.portrait{width:200px; aspect-ratio:4/5; border:1px solid var(--line-2); border-radius:4px; overflow:hidden; position:relative; background:var(--panel); box-shadow:0 10px 28px -18px rgba(25,27,31,.5); justify-self:end;}
.portrait img{width:100%; height:100%; object-fit:cover; display:block;}
.portrait .ph{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:#F4F4F0; color:var(--accent); font-weight:600; font-size:2.6rem;}

.pagehead{padding:52px 0 8px;}
.pagehead .eyebrow{margin-bottom:12px;}
.pagehead h1{font-size:clamp(2rem,5vw,2.6rem);}
.pagehead .lead{color:var(--soft); font-size:1.05rem; max-width:60ch; margin:0;}

section{padding:38px 0; border-top:1px solid var(--line);}
section.flush{border-top:none; padding-top:18px;}
.sec-head{display:flex; align-items:baseline; gap:14px; margin:0 0 20px;}
.sec-num{font-family:var(--mono); font-size:.74rem; color:var(--accent); letter-spacing:.05em;}
h2{font-weight:600; font-size:1.32rem; letter-spacing:-.01em; margin:0;}
h3{font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); margin:26px 0 6px; font-weight:500;}
p{margin:0 0 1.05em; color:var(--ink);}
.soft{color:var(--soft);} .muted{color:var(--muted);} strong{font-weight:600;}

ul.facts{list-style:none; padding:0; margin:6px 0 0;}
ul.facts li{display:grid; grid-template-columns:148px 1fr; gap:14px; padding:8px 0; border-bottom:1px solid var(--line); align-items:baseline;}
ul.facts .k{font-family:var(--mono); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}

.entry{padding:15px 0; border-bottom:1px solid var(--line);}
.entry:last-child{border-bottom:none;}
.entry .title{font-weight:600;}
.entry .where{color:var(--soft); font-size:.95rem;}
.tag{display:inline-block; font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-deep); border:1px solid var(--line-2); padding:2px 7px; border-radius:3px; margin-bottom:7px;}
.doi{font-family:var(--mono); font-size:.78rem;}

.repo{display:flex; gap:13px; align-items:flex-start; padding:16px 18px; border:1px solid var(--line-2); border-radius:8px; background:var(--panel);}
.repo .dot{flex:0 0 auto; width:10px; height:10px; border-radius:50%; background:var(--accent); margin-top:8px;}

.poster{display:grid; grid-template-columns:210px 1fr; gap:22px; align-items:center; margin-top:22px; padding:18px; border:1px solid var(--line); border-radius:8px; background:var(--panel);}
.poster .thumb{border:1px solid var(--line-2); border-radius:5px; overflow:hidden; display:block; background:#EFEFEA;}
.poster .thumb img{width:100%; display:block;}

.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; margin-top:6px;}
a.lcard{display:block; border:1px solid var(--line-2); border-radius:10px; background:var(--panel); padding:16px 18px; color:var(--ink); border-bottom:1px solid var(--line-2);}
a.lcard:hover{border-color:var(--accent); background:#F7F9FB;}
a.lcard .lk{font-family:var(--mono); font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:6px;}
a.lcard .lt{font-weight:600; font-size:1rem; display:block; margin-bottom:2px;}
a.lcard .ls{color:var(--soft); font-size:.9rem;}

.teaser{display:grid; grid-template-columns:1fr 240px; gap:22px; align-items:center; border:1px solid var(--line-2); border-radius:12px; background:var(--panel); padding:20px; margin-top:8px;}
.teaser .tt{font-weight:600; font-size:1.1rem; margin:0 0 6px;}
.teaser .ts{color:var(--soft); font-size:.96rem; margin:0 0 14px;}
.teaser .launch{display:inline-block; font-family:var(--mono); font-size:.74rem; letter-spacing:.04em; padding:9px 16px; border:1px solid var(--accent); border-radius:4px; color:var(--accent-deep); background:#F3F6FA;}
.teaser .launch:hover{background:var(--accent); color:#fff; border-color:var(--accent);}
.teaser .shot{width:100%; border-radius:8px; border:1px solid var(--line); display:block; background:#0d0d0d;}

footer{padding:36px 0 64px; border-top:1px solid var(--line); color:var(--muted); font-size:.82rem;}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
footer a{color:var(--soft);}

.js .reveal{opacity:0; transform:translateY(12px); transition:opacity .55s ease,transform .55s ease;}
.js .reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){ .js .reveal{opacity:1!important; transform:none!important;} html{scroll-behavior:auto;} }

@media (max-width:620px){
  .hero-grid{grid-template-columns:1fr; gap:28px;}
  .portrait{justify-self:start; order:-1; width:150px;}
  ul.facts li{grid-template-columns:1fr; gap:2px;}
  header.hero{padding:40px 0 14px;}
  .teaser{grid-template-columns:1fr;}
  .poster{grid-template-columns:1fr;}
}