:root{
  --bg:#ffffff; --card:rgba(247,247,251,0.92); --ink:#1b1b1f; --muted:#5b5b66;
  --accent:#9b0054; --violet:#6a1b9a; --hero-bg:rgba(255,249,230,0.9);
  --radius:16px; --shadow:0 4px 16px rgba(0,0,0,.06);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;scroll-behavior:smooth}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial,sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.6; font-size:16px;
  min-height:100vh;
  background-image:url('assets/bg.jpg');
  background-size:cover; background-position:center; background-attachment:fixed;
  position:relative;
}
body::before{
  content:""; position:fixed; inset:0; background:rgba(255,255,255,0.85); z-index:-1;
}
.container{max-width:980px;margin:0 auto;padding:16px;position:relative}
.top{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:center;padding:10px 0}
.top a{color:var(--muted);text-decoration:none;font-weight:600;padding:8px 10px;border-radius:999px}
.top a:active,.top a:hover{background:#fff;border:1px solid #eee;color:var(--accent)}
.lang-toggle{position:absolute;right:16px;top:10px;display:flex;gap:6px}
.sticky{position:sticky;top:0;background:transparent;backdrop-filter:saturate(140%) blur(6px);z-index:10;padding-top:env(safe-area-inset-top)}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin:16px 0}
.hero{display:grid;grid-template-columns:160px 1fr;gap:20px;align-items:flex-start;background:var(--hero-bg);padding:24px}
.portrait{width:160px;height:160px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:var(--shadow)}
.subtitle{margin:0;color:var(--muted);font-weight:700}
.location{margin:6px 0 14px 0;color:var(--muted)}
.intro{margin:0 0 14px 0;font-size:1rem}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.btn{background:linear-gradient(135deg,var(--accent),var(--violet));color:#fff;text-decoration:none;font-weight:700;padding:11px 16px;border-radius:999px;display:inline-block;line-height:1}
.grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:720px){.grid{grid-template-columns:1fr 1fr}}
.project{padding:14px;border-radius:12px;background:#fff;border:1px solid #eee}
.project h3{margin:0 0 6px 0}
.small{color:var(--muted);font-size:.95rem}
.project p{margin:6px 0}
.proj-links{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px}
.aff-tabs{display:flex;gap:8px;margin-bottom:12px}
.chip{border:1px solid #ddd;background:#fff;border-radius:999px;padding:8px 12px;cursor:pointer}
.aff-tabs .chip.active,.aff-tabs .chip:hover{border-color:var(--accent);background:var(--accent);color:#fff}
.filters{display:flex;flex-wrap:nowrap;gap:8px;margin-bottom:12px}
.scrollx{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.scrollx .chip{scroll-snap-align:center;flex:0 0 auto}
.list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.item{padding:14px;background:#fff;border-radius:12px;border:1px solid #eee}
.item .title{margin:0 0 4px 0;font-weight:700}
.item .meta{margin:0;color:var(--muted)}
.tags{display:flex;gap:8px;flex-wrap:wrap;padding:0;margin:8px 0;list-style:none}
.tags li{background:#fff;border:1px solid #eee;border-radius:999px;padding:6px 10px}
.foot{color:var(--muted);text-align:center;font-size:.9rem}
@media(max-width:640px){
  .hero{grid-template-columns:1fr;text-align:center}
  .portrait{margin:0 auto 8px auto}
  .btns{justify-content:center}
  .lang-toggle{position:static;justify-content:center;margin-top:-6px;margin-bottom:6px}
  .container{padding:14px}
  .card{padding:16px}
  .top{gap:6px}
  .top a{padding:6px 8px}
}
section{scroll-margin-top:72px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.skip{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip:focus{left:16px;top:16px;width:auto;height:auto;background:#000;color:#fff;padding:8px 12px;border-radius:8px;z-index:1000}