/* Selected author compositions 3 and 8. Everything is scoped to this component. */
.fsp-author-frame {
  container: fsp-author / inline-size;
  width:100%; max-width:1200px; margin:25px auto;
  --fsp-paper:#ebedf0; --fsp-ink:#313847; --fsp-muted:#505a68;
  --fsp-label:#69579d; --fsp-icon:#836cc5; --fsp-light:#766c910d;
  --fsp-rule:color-mix(in srgb,var(--fsp-label) 20%,var(--fsp-paper));
  --fsp-fine:-2px -2px 5px #fff,2px 3px 5px color-mix(in srgb,var(--fsp-ink) 25%,transparent);
  --fsp-pressed:inset 2px 2px 5px color-mix(in srgb,var(--fsp-ink) 23%,transparent),inset -3px -3px 6px #fff;
}
.fsp-author-frame .fsp-author,.fsp-author-frame .fsp-author * { box-sizing:border-box; min-width:0; }
.fsp-author-frame .fsp-author { font:400 16px/1.4 Rubik,Arial,sans-serif; color:var(--fsp-ink); overflow-wrap:break-word; }
.fsp-author-frame .fsp-author-name { display:block; font-size:23px; line-height:1.2; font-weight:600; color:var(--fsp-ink); }
.fsp-author-frame .fsp-author-role { display:block; margin:5px 0 0; font-size:12px; line-height:1.4; font-weight:400; color:var(--fsp-muted); }
.fsp-author-frame .fsp-author-identity { display:block; }
.fsp-author-frame .fsp-author-profile { display:flex; gap:20px; align-items:center; }
.fsp-author-frame .fsp-author-portrait { display:block; flex:none; width:95px; height:95px; padding:5px; border-radius:50%; background:var(--fsp-paper); box-shadow:var(--fsp-pressed); overflow:hidden; }
.fsp-author-frame .fsp-author-portrait img { width:100%; height:100%; max-width:100%; display:block; object-fit:cover; object-position:45% 35%; border-radius:inherit; filter:none; }
.fsp-author-frame .fsp-author-bio { margin:0; font-size:16px; line-height:1.4; color:var(--fsp-ink); }
.fsp-author-frame .fsp-author-icon { display:block; flex:none; width:22px; height:22px; fill:none; stroke:currentColor; color:var(--fsp-icon); stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.fsp-author-frame .fsp-author-topics { display:flex; flex-wrap:wrap; gap:5px 10px; list-style:none; padding:0; margin:0; }
.fsp-author-frame .fsp-author-topics>li { margin:0; list-style:none; font-size:12px; line-height:1.4; font-weight:400; color:var(--fsp-label); background:var(--fsp-light); border-radius:6px; padding:5px 10px; }
.fsp-author-frame .fsp-author-topics>li::before { content:none; }
.fsp-author-frame .fsp-author-stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:0; padding:0; }
.fsp-author-frame .fsp-author-stats>div { display:grid; grid-template-columns:20px minmax(0,1fr); column-gap:10px; row-gap:5px; align-content:start; }
.fsp-author-frame .fsp-author-stats dt { grid-column:1/-1; grid-row:2; margin:0; padding:0; font-size:12px; line-height:1.3; font-weight:400; color:var(--fsp-muted); }
.fsp-author-frame .fsp-author-stats dd { grid-column:2; grid-row:1; margin:0; padding:0; font-size:20px; line-height:1.15; font-weight:600; white-space:nowrap; color:var(--fsp-ink); }
.fsp-author-frame .fsp-author-stats .fsp-author-metric-icon { grid-column:1; grid-row:1; width:20px; height:20px; align-self:center; }
/* Variant 3: author and biography on the left, general author data on the right. */
.fsp-author-frame .fsp-author--3 { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:20px; }
.fsp-author-frame .fsp-author-main,.fsp-author-frame .fsp-author-data { display:grid; gap:20px; align-content:start; padding:25px; border-radius:15px; background:var(--fsp-paper); box-shadow:var(--fsp-fine); }
.fsp-author-frame .fsp-author-data { box-shadow:var(--fsp-pressed); }
.fsp-author-frame .fsp-author--3 .fsp-author-portrait { width:85px; height:85px; }
.fsp-author-frame .fsp-author--3 .fsp-author-role { display:flex; align-items:center; gap:7px; margin:0 0 8px; color:var(--fsp-label); }
.fsp-author-frame .fsp-author-role .fsp-author-expert-icon { width:18px; height:18px; }
.fsp-author-frame .fsp-author--3 .fsp-author-stats { grid-template-columns:1fr 1fr; gap:20px; }
.fsp-author-frame .fsp-author--3 .fsp-author-stats>div { padding:10px 15px; border-radius:8px; background:var(--fsp-paper); box-shadow:var(--fsp-fine); }
.fsp-author-frame .fsp-author--3 .fsp-author-stats>div:last-child { grid-column:1/-1; }
/* Variant 8: central portrait, biography and a symmetrical row of author data. */
.fsp-author-frame .fsp-author--8 { display:flex; flex-direction:column; align-items:center; gap:15px; padding:25px; border-radius:15px; background:var(--fsp-paper); box-shadow:var(--fsp-pressed); text-align:center; }
.fsp-author-frame .fsp-author--8 .fsp-author-portrait { width:130px; height:130px; box-shadow:var(--fsp-fine); }
.fsp-author-frame .fsp-author--8 .fsp-author-role { color:var(--fsp-label); }
.fsp-author-frame .fsp-author--8 .fsp-author-bio { max-width:900px; }
.fsp-author-frame .fsp-author--8 .fsp-author-topics { justify-content:center; }
.fsp-author-frame .fsp-author--8 .fsp-author-stats { width:100%; margin:5px 0; padding:20px 15px; border:0; border-radius:12px; background:var(--fsp-paper); box-shadow:var(--fsp-fine); gap:25px; }
.fsp-author-frame .fsp-author--8 .fsp-author-stats>div { justify-content:center; grid-template-columns:auto auto; }
.fsp-author-frame .fsp-author--8 .fsp-author-stats dt { text-align:center; }
@container fsp-author (max-width:1050px) {
  .fsp-author-frame .fsp-author--3 { grid-template-columns:1fr 1fr; }
}
@container fsp-author (max-width:800px) {
  .fsp-author-frame .fsp-author--3 { grid-template-columns:1fr; }
  .fsp-author-frame .fsp-author--3 .fsp-author-stats { grid-template-columns:1fr 1fr; gap:15px; }
  .fsp-author-frame .fsp-author--3 .fsp-author-stats>div:last-child { grid-column:1/-1; }
  .fsp-author-frame .fsp-author--3 .fsp-author-stats>div { padding:10px; }
  .fsp-author-frame .fsp-author-data { gap:15px; }
}
@container fsp-author (max-width:600px) {
  .fsp-author-frame .fsp-author-name { font-size:22px; }
  .fsp-author-frame .fsp-author-profile { gap:15px; }
  .fsp-author-frame .fsp-author-topics { gap:5px; }
  .fsp-author-frame .fsp-author-stats { grid-template-columns:1fr 1fr; gap:15px; }
  .fsp-author-frame .fsp-author-stats>div { min-height:55px; }
  .fsp-author-frame .fsp-author-stats>div:last-child { grid-column:1/-1; }
  .fsp-author-frame .fsp-author-stats .fsp-author-metric-icon { width:18px; height:18px; }
  .fsp-author-frame .fsp-author--3 { grid-template-columns:1fr; gap:15px; }
  .fsp-author-frame .fsp-author--3 .fsp-author-main,.fsp-author-frame .fsp-author--3 .fsp-author-data { padding:20px 15px; border-radius:15px; gap:20px; }
  .fsp-author-frame .fsp-author--3 .fsp-author-portrait { width:85px; height:85px; }
  .fsp-author-frame .fsp-author--3 .fsp-author-stats { grid-template-columns:1fr 1fr; gap:15px; }
  .fsp-author-frame .fsp-author--3 .fsp-author-stats>div,.fsp-author-frame .fsp-author--3 .fsp-author-stats>div:last-child { padding:15px 10px; }
  .fsp-author-frame .fsp-author--3 .fsp-author-stats>div:last-child { grid-column:1/-1; }
  .fsp-author-frame .fsp-author--8 { padding:25px 15px; border-radius:0; gap:15px; }
  .fsp-author-frame .fsp-author--8 .fsp-author-bio { text-align:left; }
  .fsp-author-frame .fsp-author--8 .fsp-author-stats { grid-template-columns:1fr 1fr; padding:20px 10px; margin:5px 0; gap:20px 15px; }
  .fsp-author-frame .fsp-author--8 .fsp-author-stats>div { grid-template-columns:20px minmax(0,1fr); text-align:left; justify-content:start; }
  .fsp-author-frame .fsp-author--8 .fsp-author-stats dt { text-align:left; }
}
@container fsp-author (max-width:360px) {
  .fsp-author-frame .fsp-author-name { font-size:20px; }
}
/* Center the language metric only in the author block used outside the homepage. */
.fsp-author-frame .fsp-author--3 .fsp-author-stats>div:last-child{grid-template-columns:20px auto;justify-content:center;justify-items:center;text-align:center}
.fsp-author-frame .fsp-author--3 .fsp-author-stats>div:last-child dt{text-align:center}

.fsp-author-frame .fsp-author--3 .fsp-author-stats>.fsp-author-language{grid-template-columns:20px minmax(0,1fr);justify-content:start;justify-items:start;text-align:left}
.fsp-author-frame .fsp-author--3 .fsp-author-stats>.fsp-author-language dt{text-align:left}

@container fsp-author (max-width:360px) {
 .fsp-author-frame .fsp-author--3 .fsp-author-stats>div { column-gap:5px; }
 .fsp-author-frame .fsp-author--3 .fsp-author-stats dd { font-size:18px; }
}

@container fsp-author (max-width:360px){.fsp-author-frame .fsp-author--8 .fsp-author-stats>div{column-gap:5px}.fsp-author-frame .fsp-author--8 .fsp-author-stats dd{font-size:18px}}

/* Keep homepage statistics readable before the five-column band becomes narrow. */
@container fsp-author (max-width:800px){.fsp-author-frame .fsp-author--8 .fsp-author-stats{grid-template-columns:1fr 1fr;gap:20px 15px}.fsp-author-frame .fsp-author--8 .fsp-author-stats>div:last-child{grid-column:1/-1}}

/* Short separators belong to the homepage's raised statistics band only. */
.fsp-author-frame .fsp-author--8 .fsp-author-stats>div{position:relative}
.fsp-author-frame .fsp-author--8 .fsp-author-stats>div+div::before{content:'';position:absolute;left:calc(-25px / 2);top:50%;width:1px;height:30px;border-radius:2px;background:var(--fsp-rule);transform:translateY(-50%)}
@container fsp-author (max-width:800px){
 .fsp-author-frame .fsp-author--8 .fsp-author-stats>div+div::before{left:calc(-15px / 2)}
 .fsp-author-frame .fsp-author--8 .fsp-author-stats>div:nth-child(odd)::before{display:none}
}