@font-face {
  font-family: Inter;
  src: url('assets/inter-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
:root { color-scheme: light; --ink:#171717; --muted:#a3a3a3; --card:#f7f7f7; }
* { box-sizing:border-box; }
body { margin:0; background:#fff; color:var(--ink); font-family:Inter,Arial,sans-serif; font-weight:500; font-optical-sizing:none; font-feature-settings:'calt' 0,'liga' 0; -webkit-font-smoothing:antialiased; }
h1,h2,p { margin:0; }
a { color:inherit; text-decoration:none; cursor:pointer; }
img { display:block; }
a:focus-visible,button:focus-visible { outline:2px solid #777; outline-offset:5px; }
.profile { width:620px; margin-inline:auto; padding-block:100px; display:flex; flex-direction:column; gap:32px; }
.header { display:flex; align-items:center; justify-content:space-between; width:100%; }
.identity { display:flex; gap:12px; align-items:center; }
.avatar { --corner-radius:14; position:relative; width:44px; height:44px; border-radius:99px; overflow:hidden; flex:none; }
.avatar img { position:absolute; inset:0; object-fit:cover; }
.identity-text { display:flex; flex-direction:column; gap:2px; }
h1 { font-size:18px; font-weight:500; letter-spacing:-.27px; line-height:normal; font-feature-settings:'ss11' 1,'calt' 0,'liga' 0; }
.identity-text p { color:var(--muted); font-size:14px; line-height:normal; }
.socials { display:flex; gap:10px; align-items:center; height:32px; }
.social { display:block; width:24px; height:24px; }
.showcase { display:flex; flex-direction:column; gap:10px; transform-origin:center; }
.showcase-card { --corner-radius:20; display:block; width:100%; aspect-ratio:600 / 314; border-radius:20px; overflow:hidden; }
.showcase-card>img { width:100%; height:100%; object-fit:cover; }
.caption { display:flex; justify-content:space-between; align-items:flex-start; font-size:15px; line-height:18px; color:var(--muted); }
#slide-count { font-variant-numeric:tabular-nums; }
.link-section { display:flex; flex-direction:column; gap:10px; }
h2 { font-size:14px; line-height:normal; color:var(--muted); font-weight:500; }
.card { --corner-radius:16; position:relative; display:flex; align-items:center; justify-content:space-between; width:100%; height:48px; padding:12px 12px 12px 16px; border-radius:16px; background:var(--card); transform-origin:center; }
.card-content { display:flex; align-items:center; gap:10px; height:24px; position:relative; min-width:0; }
.card-content>span:last-child { font-size:15px; font-weight:450; line-height:24px; letter-spacing:-.165px; font-feature-settings:'ss11' 1,'calt' 0,'liga' 0; }
.card img { flex:none; }
.arrow { position:relative; }
.studio { background:#08080a; color:#fff; overflow:hidden; }
.studio-logo { width:22px; height:22px; display:grid; place-items:center; }
.studio-art { position:absolute; width:423.949px; height:195px; right:68.05px; bottom:.47px; display:grid; place-items:center; pointer-events:none; }
.studio-art>img { position:absolute; left:50%; top:50%; width:195px; height:423.949px; object-fit:cover; transform:translate(-50%,-50%) rotate(90deg); }
footer { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:14px; line-height:normal; }
time { font-variant-numeric:tabular-nums; }
.smooth-corners { border-radius:0; }
.smooth-corners:focus-visible { outline:0; box-shadow:inset 0 0 0 2px #777; }
/* Mobile layout from Figma 155:3367; existing content and assets are retained. */
@media(max-width:660px) {
  .profile { width:calc(100% - 40px); margin-inline:auto; padding-block:40px; gap:24px; }
  .avatar,.showcase-card,.card { --corner-radius:12; }
  .avatar:not(.smooth-corners),.showcase-card:not(.smooth-corners),.card:not(.smooth-corners) { border-radius:12px; }
  .identity-text { gap:0; }
  h1 { line-height:24px; }
  .identity-text p { line-height:20px; }
  h2 { line-height:22.5px; }
  .caption { gap:12px; }
  .caption p { min-width:0; flex:1; }
  #slide-count { flex:none; }
  .card-content { flex:1; }
  .card-content>span:last-child { min-width:0; }
  .arrow { margin-left:8px; }
}

/* The stage owns hover scale; individual cards move forward/back on slide changes. */
.showcase-stage { position:relative; width:100%; aspect-ratio:600 / 314; }
.showcase-stage .showcase-card { position:absolute; inset:0; }
.carousel-incoming { pointer-events:none; z-index:1; }
.carousel-controls { display:flex; align-items:center; gap:12px; flex:none; }
.carousel-controls button { border:0; background:none; color:inherit; font:inherit; padding:0; cursor:pointer; min-height:18px; }
#carousel-pause { font-size:12px; width:16px; }
.carousel-controls button:hover { color:var(--ink); }