/* 形象图鉴 · 首页形象一览 · 人物名牌 */
.character-person strong small{display:block;margin-top:-2px;font:400 10px/1.4 Inter,"PingFang SC",sans-serif;letter-spacing:2px;color:#a9c3b7;text-align:center}

/* ---------- archive stage ---------- */
.look-archive{--accent:#e8cb89;padding-bottom:28px}
.archive-stage{--accent:#e8cb89;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:40px;align-items:center;min-height:600px}
.archive-art{position:relative;height:620px;display:grid;place-items:center;isolation:isolate;border-radius:24px;overflow:hidden;
  background:radial-gradient(ellipse 60% 55% at 50% 45%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 70%),
             linear-gradient(180deg,#0b1a1d66,#0a161900);transition:background .5s}
.archive-art:before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(circle,color-mix(in srgb,var(--accent) 40%,transparent) 1px,transparent 1.6px);background-size:34px 34px;-webkit-mask-image:radial-gradient(ellipse at center,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at center,#000 20%,transparent 70%);opacity:.6}
.archive-bignum{position:absolute;left:4%;top:-2%;z-index:-1;font:500 clamp(120px,16vw,220px)/1 "Songti SC","Noto Serif CJK SC",serif;color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--accent) 45%,transparent);letter-spacing:-4px;user-select:none}
.archive-halo{position:absolute;left:50%;top:46%;width:min(78%,480px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:-1;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);box-shadow:0 0 0 14px color-mix(in srgb,var(--accent) 5%,transparent),0 0 90px color-mix(in srgb,var(--accent) 25%,transparent)}
.archive-halo:after{content:"";position:absolute;inset:7%;border-radius:50%;border:1px dashed color-mix(in srgb,var(--accent) 35%,transparent);animation:haloTurn 80s linear infinite}
.archive-pedestal{position:absolute;left:50%;bottom:22px;width:56%;height:46px;transform:translateX(-50%);border-radius:50%;z-index:-1;background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 35%,#02090b) 0%,transparent 70%);opacity:.8}
.archive-figure{position:absolute;inset:20px 12px 36px;padding:0;border:0;background:none;cursor:zoom-in}
.archive-figure[hidden]{display:none}
.archive-figure img{width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 18px 26px #02090bb0);transition:transform .45s cubic-bezier(.22,1,.36,1)}
.archive-figure:hover img{transform:translateY(-6px) scale(1.015)}
.archive-stage.is-framed .archive-figure{inset:24px 12px 40px}
.archive-stage.is-framed .archive-figure img{object-position:center;filter:drop-shadow(0 24px 40px #02090bcc)}
.archive-stage.is-bust .archive-figure img{-webkit-mask-image:linear-gradient(#000 78%,transparent);mask-image:linear-gradient(#000 78%,transparent)}
.archive-missing{margin:0;padding:18px 26px;border:1px dashed color-mix(in srgb,var(--accent) 60%,transparent);border-radius:18px;color:#cfdcd3;font-size:14px;letter-spacing:2px;background:#ffffff06}
.archive-missing[hidden]{display:none}
.archive-stage.is-changing .archive-figure img,.archive-stage.is-changing .archive-info>*{animation:archiveIn .5s cubic-bezier(.22,1,.36,1) both}
.archive-stage.is-changing .archive-info>*:nth-child(2){animation-delay:.04s}
.archive-stage.is-changing .archive-info>*:nth-child(3){animation-delay:.08s}
.archive-stage.is-changing .archive-info>*:nth-child(4){animation-delay:.12s}
@keyframes archiveIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

.archive-info{min-width:0}
.archive-info .eyebrow{color:var(--accent);margin:0 0 14px;transition:color .4s}
.archive-tag{display:inline-block;margin:0 0 6px;padding:3px 12px;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 50%,transparent);color:color-mix(in srgb,var(--accent) 80%,#fff);font-size:12px;letter-spacing:2px}
.archive-stage.is-special .archive-tag{background:color-mix(in srgb,var(--accent) 18%,transparent)}
.archive-name{margin:6px 0 18px;font-size:clamp(40px,4.6vw,60px);line-height:1.2;letter-spacing:8px;color:#f5ead0}
.archive-traits{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.archive-traits li{display:flex;align-items:center;gap:10px;color:#cddad2;font-size:14px}
.archive-traits li:before{content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.archive-note{margin:0 0 16px;font-size:12px;color:#9db0ac}
.archive-note[hidden]{display:none}
.archive-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.archive-actions>button:not(.button){width:46px;height:46px;border-radius:50%;border:1px solid #e8cb8944;background:#ffffff08;color:#f3e6c4;font-size:18px;transition:background .2s,border-color .2s}
.archive-actions>button:not(.button):hover{background:var(--accent);border-color:var(--accent);color:#16302c}
.archive-zoom{min-height:46px;padding:0 22px;background:transparent!important;border:1px solid color-mix(in srgb,var(--accent) 55%,transparent)!important;color:#f3e6c4!important}
.archive-zoom:hover:not(:disabled){background:var(--accent)!important;color:#16302c!important}
.archive-zoom:disabled{opacity:.45;cursor:not-allowed}
.archive-hint{margin:18px 0 0;font-size:12px;color:#7f948c}

/* ---------- strip (gallery tabs + home lineup) ---------- */
.archive-strip,.look-strip{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:10px;margin-top:26px;padding-top:22px;border-top:1px solid #e8cb8922}
.strip-item{display:grid;justify-items:center;gap:8px;padding:8px 4px 10px;border:1px solid transparent;border-radius:16px;background:transparent;color:#cfdcd3;font:inherit;cursor:pointer;transition:background .25s,border-color .25s,transform .25s}
.strip-item:hover{background:#ffffff08;transform:translateY(-3px)}
.strip-item[aria-selected=true]{background:#e8cb8914;border-color:#e8cb8966}
.strip-thumb{--accent:#e8cb89;position:relative;display:grid;place-items:end center;width:100%;aspect-ratio:3/4;border-radius:12px;overflow:hidden;background:radial-gradient(ellipse 70% 60% at 50% 60%,color-mix(in srgb,var(--accent) 26%,transparent),transparent 72%),#0b1a1d80}
.strip-thumb img{width:100%;height:100%;object-fit:contain;object-position:center bottom;transition:transform .35s}
.is-framed .strip-thumb img{object-fit:cover;object-position:center top}
.strip-item:hover .strip-thumb img{transform:scale(1.06)}
.strip-missing{align-self:center;font:500 28px/1 "Songti SC",serif;color:color-mix(in srgb,var(--accent) 70%,#fff);opacity:.7}
.strip-label{font-size:12px;line-height:1.4;text-align:center;white-space:nowrap}
.strip-label b{color:#e8cb89;font-weight:600;font-variant-numeric:tabular-nums}
.strip-item[aria-selected=true] .strip-label{color:#f8dfa5}
.is-special .strip-thumb{box-shadow:inset 0 0 0 1px #e0525a55}
.home-looks .look-strip{border-top:0;padding-top:0;margin-top:0}
.home-looks .section-heading{margin-bottom:24px}

.sheet-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

@media(max-width:1100px){
  .archive-strip,.look-strip{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:96px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;padding-bottom:8px}
  .strip-item{scroll-snap-align:center}
}
@media(max-width:900px){
  .archive-stage{grid-template-columns:1fr;gap:20px;min-height:0}
  .archive-art{height:min(70vh,520px)}
  .archive-info{text-align:center}
  .archive-traits{justify-items:center}
  .archive-actions{justify-content:center}
}
@media(max-width:600px){
  .archive-art{height:440px;border-radius:18px}
  .archive-name{letter-spacing:5px}
  .archive-strip,.look-strip{grid-auto-columns:84px;gap:6px}
  .strip-label{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.archive-halo:after{animation:none}.archive-stage.is-changing .archive-figure img,.archive-stage.is-changing .archive-info>*{animation:none}}

/* ---------- home hero carousel ---------- */
.hero-carousel{--accent:#e8cb89;min-height:700px;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.hero-carousel .character-halo{transition:box-shadow .6s,border-color .6s;border-color:color-mix(in srgb,var(--accent) 35%,transparent);background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 14%,transparent),transparent 67%)}
.carousel-track{position:absolute;inset:0 0 70px;perspective:1400px}
.carousel-item{--o:0;--a:0;position:absolute;left:50%;bottom:0;width:62%;height:100%;padding:0;border:0;background:none;cursor:pointer;
  transform:translateX(calc(-50% + var(--o) * 36%)) scale(calc(1 - var(--a) * .26));transform-origin:50% 100%;
  opacity:calc(1 - var(--a) * .6);filter:saturate(calc(1 - var(--a) * .35)) blur(calc(var(--a) * .6px));
  z-index:calc(10 - var(--a));transition:transform .75s cubic-bezier(.22,1,.36,1),opacity .6s,filter .6s}
.carousel-item[data-offset="2"],.carousel-item[data-offset="-2"]{opacity:.12}
.carousel-item[data-offset="3"],.carousel-item[data-offset="-3"]{opacity:0;pointer-events:none}
.carousel-item img{width:100%;height:100%;object-fit:contain;object-position:center bottom;pointer-events:none;-webkit-user-drag:none}
.carousel-item.is-active{cursor:zoom-in}
.carousel-item.is-active img{filter:drop-shadow(0 16px 22px #020c1066);animation:characterFloat 7s ease-in-out infinite}
.carousel-item:not(.is-active):hover{opacity:.7}
.carousel-item:focus-visible{outline:none}
.carousel-item:focus-visible img{outline:2px solid var(--accent);outline-offset:6px;border-radius:12px}
.carousel-caption{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);z-index:12;display:grid;justify-items:center;gap:2px;min-width:170px;padding:9px 24px 10px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:22px;background:#12302cf0;backdrop-filter:blur(8px);text-align:center;white-space:nowrap;transition:border-color .5s}
.carousel-no{font-size:10px;letter-spacing:2px;color:var(--accent);font-variant-numeric:tabular-nums}
.carousel-name{font:500 18px/1.3 "Songti SC","Noto Serif CJK SC",serif;letter-spacing:4px;color:#f5e6bf}
.carousel-tag{font-size:10px;letter-spacing:3px;color:#9fc4b2}
.carousel-controls{position:absolute;left:0;right:0;bottom:16px;z-index:11;display:flex;justify-content:space-between;pointer-events:none;padding:0 4%}
.carousel-controls button{pointer-events:auto;width:42px;height:42px;border-radius:50%;border:1px solid #e8cb8944;background:#12302ccc;color:#f3e6c4;font-size:16px;transition:background .2s,color .2s}
.carousel-controls button:hover{background:var(--accent);color:#16302c}
.hero-carousel .hero-art-link{z-index:12}
@media(max-width:1000px){.hero-carousel{min-height:620px}}
@media(max-width:700px){
  .garden-theme .hero>.character-scene.hero-carousel{height:480px;min-height:480px}
  .carousel-track{bottom:64px}
  .carousel-item{width:70%;transform:translateX(calc(-50% + var(--o) * 40%)) scale(calc(1 - var(--a) * .3))}
  .carousel-controls{bottom:14px;padding:0}
  .carousel-name{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.carousel-item{transition:none}.carousel-item.is-active img{animation:none}}

/* ---------- 转盘名牌 v2：细长玻璃条，箭头贴在两侧，下方进度点 ---------- */
.hero-carousel .carousel-caption{bottom:30px;display:grid;grid-template-columns:auto 1px auto;align-items:center;column-gap:16px;min-width:0;
  padding:10px 22px;border-radius:16px;border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  background:linear-gradient(180deg,#14302cd9,#0d2124e6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 10px 30px #02080a66,inset 0 1px 0 #ffffff14}
.hero-carousel .carousel-caption::before{content:"";grid-column:2;grid-row:1/3;align-self:stretch;width:1px;background:linear-gradient(transparent,color-mix(in srgb,var(--accent) 60%,transparent),transparent)}
.hero-carousel .carousel-no{grid-column:1;grid-row:1/3;font:500 13px/1 Inter,sans-serif;letter-spacing:1px;color:color-mix(in srgb,var(--accent) 85%,#fff)}
.hero-carousel .carousel-no b{display:block;font:500 26px/1 "Songti SC","Noto Serif CJK SC",serif;letter-spacing:0;color:var(--accent);margin-bottom:2px}
.hero-carousel .carousel-name{grid-column:3;justify-self:start;font-size:19px;letter-spacing:5px;line-height:1.25}
.hero-carousel .carousel-tag{grid-column:3;justify-self:start;font-size:11px;letter-spacing:2px;color:#a9c3b7}
.hero-carousel .carousel-controls{left:50%;right:auto;bottom:38px;width:min(440px,92%);transform:translateX(-50%);padding:0}
.hero-carousel .carousel-controls button{width:38px;height:38px;font-size:15px;border-color:color-mix(in srgb,var(--accent) 40%,transparent);background:#0d2124cc;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .2s,color .2s,transform .2s}
.hero-carousel .carousel-controls button:hover{transform:scale(1.08)}
.carousel-dots{position:absolute;left:50%;bottom:10px;z-index:12;display:flex;gap:6px;transform:translateX(-50%)}
.carousel-dots i{width:6px;height:6px;border-radius:999px;background:#ffffff30;transition:width .35s,background .35s}
.carousel-dots i.on{width:18px;background:var(--accent)}
@media(max-width:700px){
  .hero-carousel .carousel-caption{bottom:26px;padding:8px 16px;column-gap:12px}
  .hero-carousel .carousel-name{font-size:16px;letter-spacing:3px}
  .hero-carousel .carousel-no b{font-size:22px}
  .hero-carousel .carousel-controls{bottom:31px;width:calc(100% - 20px)}
  .carousel-dots{bottom:8px;gap:5px}.carousel-dots i{width:5px;height:5px}.carousel-dots i.on{width:14px}
}

/* ---------- about page: layered showcase (front / mid / blurred back) ---------- */
.profile-layout .character-scene.about-showcase{--accent:#e8cb89;min-height:640px;align-self:stretch;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.about-showcase .character-halo{width:104%;top:44%;transition:border-color 1.2s,background 1.2s,box-shadow 1.2s;border-color:color-mix(in srgb,var(--accent) 38%,transparent);background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 16%,transparent),transparent 66%);box-shadow:0 0 0 14px color-mix(in srgb,var(--accent) 3%,transparent),0 0 0 16px color-mix(in srgb,var(--accent) 12%,transparent),0 0 90px color-mix(in srgb,var(--accent) 12%,transparent)}
.about-showcase.is-changing .character-halo{animation:showcasePulse 1.4s ease-out}
.showcase-rays{position:absolute;left:50%;top:44%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:-1;border-radius:50%;pointer-events:none;opacity:.5;
  background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--accent) 16%,transparent) 0 3deg,transparent 3deg 18deg);
  -webkit-mask:radial-gradient(circle,#000 18%,transparent 64%);mask:radial-gradient(circle,#000 18%,transparent 64%);animation:haloTurn 120s linear infinite;transition:background 1.2s}
.showcase-stage{position:absolute;inset:0 -8% 76px;overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 94%,transparent),linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 94%,transparent),linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect}
.showcase-look{--x:0%;--y:0%;--s:1;--op:0;--b:0px;--br:1;--sat:1;position:absolute;left:50%;bottom:0;width:62%;height:92%;z-index:1;pointer-events:none;
  transform:translateX(calc(-50% + var(--x))) translateY(var(--y)) scale(var(--s));transform-origin:50% 100%;opacity:var(--op);
  filter:blur(var(--b)) brightness(var(--br)) saturate(var(--sat));will-change:transform,opacity,filter;
  transition:transform 1.5s cubic-bezier(.62,0,.24,1),opacity 1.2s ease,filter 1.5s ease}
.showcase-img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;-webkit-user-drag:none}
.showcase-look[data-role="front"]{--x:13%;--op:1;z-index:4;pointer-events:auto;cursor:zoom-in}
.showcase-look[data-role="front"] .showcase-img{filter:drop-shadow(0 18px 24px #020c1070) drop-shadow(0 0 26px color-mix(in srgb,var(--accent) 22%,transparent));animation:characterFloat 7s ease-in-out infinite}
.showcase-look[data-role="mid"]{--x:-27%;--y:-3%;--s:.72;--op:.86;--b:1.2px;--br:.74;--sat:.78;z-index:3;pointer-events:auto;cursor:pointer}
.showcase-look[data-role="mid"]:hover{--br:.95;--b:0px;--op:1}
.showcase-look[data-role="mid"] .showcase-img{animation:characterFloat 8s ease-in-out -3s infinite}
.showcase-look[data-role="back"]{--x:-8%;--y:-4%;--s:1.5;--op:.42;--b:9px;--br:.95;--sat:1.2;z-index:2;transform-origin:50% 45%}
.showcase-look[data-role="back"] .showcase-img{animation:showcaseDrift 16s ease-in-out infinite alternate}
.showcase-look[data-role="queue"]{--x:-8%;--y:-4%;--s:1.9;--op:0;--b:18px;z-index:1;transform-origin:50% 45%}
.showcase-look[data-role="exit"]{--x:58%;--y:-2%;--s:1.06;--op:0;--b:8px;z-index:5;transition:transform 1.3s cubic-bezier(.5,0,.75,0),opacity .9s ease,filter 1.1s ease}
.showcase-look[data-role="return"]{--x:-60%;--y:-2%;--s:.6;--op:0;--b:6px;z-index:3}
.showcase-look.no-anim{transition:none}
.showcase-sparks{position:absolute;inset:6% 4% 90px;pointer-events:none;z-index:6}
.showcase-sparks i{position:absolute;bottom:0;left:var(--l);width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent),0 0 18px color-mix(in srgb,var(--accent) 60%,transparent);opacity:0;animation:showcaseSpark var(--t) ease-in infinite var(--d);transition:background 1.2s}
.showcase-sparks i:nth-child(1){--l:12%;--t:7s;--d:-1s}.showcase-sparks i:nth-child(2){--l:30%;--t:9s;--d:-4s}.showcase-sparks i:nth-child(3){--l:48%;--t:6.5s;--d:-2.5s}
.showcase-sparks i:nth-child(4){--l:66%;--t:8s;--d:-6s}.showcase-sparks i:nth-child(5){--l:82%;--t:10s;--d:-3s}.showcase-sparks i:nth-child(6){--l:92%;--t:7.5s;--d:-5s;width:3px;height:3px}
.showcase-next{position:absolute;left:2%;top:7%;z-index:7;margin:0;display:grid;gap:1px;padding:6px 14px 7px;border-left:2px solid color-mix(in srgb,var(--accent) 70%,transparent);background:linear-gradient(90deg,#12302ccc,transparent);color:#d9e8de;transition:opacity .5s,transform .5s}
.showcase-next small{font:600 9px/1.3 Inter,sans-serif;letter-spacing:3px;color:#9fc4b2}
.showcase-next span{font:500 14px/1.4 "Songti SC","Noto Serif CJK SC",serif;letter-spacing:3px}
.about-showcase.is-changing .showcase-next{opacity:0;transform:translateX(-10px)}
.about-showcase .showcase-caption{position:absolute;left:50%;bottom:4px;transform:translateX(-50%);z-index:8;display:grid;justify-items:center;gap:3px;min-width:240px;padding:14px 30px 12px;text-align:center;white-space:nowrap;pointer-events:none;border:0;border-radius:0;backdrop-filter:none;letter-spacing:normal;
  background:radial-gradient(ellipse 60% 62% at 50% 55%,#0c221fd9,#0c221f80 55%,transparent 78%)}
.showcase-no{display:flex;align-items:center;gap:0;font:500 10px/1 Inter,sans-serif;letter-spacing:3px;color:#a9c3b7cc;font-variant-numeric:tabular-nums}
.showcase-no:before,.showcase-no:after{content:"";margin:0 10px;width:26px;height:1px;background:linear-gradient(90deg,transparent,var(--accent))}
.showcase-no:after{background:linear-gradient(90deg,var(--accent),transparent)}
.showcase-no b{color:var(--accent);font-size:13px;font-weight:600;margin-right:5px;letter-spacing:2px;text-shadow:0 0 12px color-mix(in srgb,var(--accent) 60%,transparent);transition:color 1s}
.showcase-name{font:500 24px/1.25 "Songti SC","Noto Serif CJK SC",serif;letter-spacing:7px;margin-right:-7px;
  background:linear-gradient(180deg,#fff6dc 20%,color-mix(in srgb,var(--accent) 55%,#f3dfab));-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 10px #020c10aa) drop-shadow(0 0 16px color-mix(in srgb,var(--accent) 28%,transparent))}
.showcase-tag{font-size:10px;letter-spacing:5px;margin-right:-5px;color:#b9d3c6;text-shadow:0 1px 6px #020c10}
.about-showcase.is-changing .showcase-caption>:is(.showcase-no,.showcase-name,.showcase-tag){animation:showcaseText .9s cubic-bezier(.22,1,.36,1)}
.showcase-progress{position:relative;width:64px;height:1px;margin-top:6px;background:#ffffff1c;border-radius:1px;overflow:hidden}
.showcase-progress i{display:block;height:100%;width:100%;background:var(--accent);box-shadow:0 0 6px var(--accent);transform-origin:left;transform:scaleX(0);animation:showcaseProgress var(--dur,6s) linear forwards}
.about-showcase.is-paused .showcase-progress i{animation-play-state:paused}
.showcase-controls{position:absolute;left:0;right:0;bottom:22px;z-index:9;display:flex;justify-content:space-between;pointer-events:none;padding:0 4%}
.showcase-controls button{pointer-events:auto;width:36px;height:36px;border-radius:50%;border:1px solid #e8cb8933;background:#0c221f55;backdrop-filter:blur(4px);color:#f3e6c4cc;font-size:14px;transition:background .25s,color .25s,border-color .25s,transform .25s}
.showcase-controls button:hover{background:color-mix(in srgb,var(--accent) 22%,transparent);border-color:var(--accent);color:#fff6dc;transform:scale(1.08)}
.about-showcase .showcase-link{z-index:8}
@keyframes showcaseDrift{from{transform:translate(-3%,0) scale(1)}to{transform:translate(3%,-2%) scale(1.06)}}
@keyframes showcasePulse{30%{box-shadow:0 0 0 14px color-mix(in srgb,var(--accent) 10%,transparent),0 0 0 22px color-mix(in srgb,var(--accent) 22%,transparent),0 0 140px color-mix(in srgb,var(--accent) 30%,transparent)}}
@keyframes showcaseSpark{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:.9}80%{opacity:.5}100%{transform:translateY(-420px) translateX(18px) scale(1);opacity:0}}
@keyframes showcaseText{from{opacity:0;transform:translateY(8px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
@keyframes showcaseProgress{to{transform:scaleX(1)}}
@media(max-width:1000px){.profile-layout .character-scene.about-showcase{min-height:560px}.showcase-look{width:70%}}
@media(max-width:700px){
  .profile-layout .character-scene.about-showcase{height:470px;min-height:470px}
  .showcase-stage{inset:0 -4% 70px}
  .showcase-look{width:64%}
  .showcase-look[data-role="front"]{--x:14%}
  .showcase-look[data-role="mid"]{--x:-28%;--s:.68}
  .showcase-next{top:3%}
  .showcase-next span{font-size:12px}
  .showcase-name{font-size:19px;letter-spacing:5px;margin-right:-5px}.showcase-caption{min-width:200px}
  .showcase-controls button{width:34px;height:34px}.showcase-controls{bottom:20px;padding:0 1%}
  .showcase-sparks i:nth-child(n+5){display:none}
}
@media(prefers-reduced-motion:reduce){
  .showcase-look{transition:opacity .6s ease,filter .6s ease}
  .showcase-look .showcase-img,.showcase-rays,.showcase-sparks i{animation:none!important}
  .about-showcase.is-changing .character-halo,.about-showcase.is-changing .showcase-caption>*{animation:none}
}
.ambient-paused .about-showcase :is(.showcase-img,.showcase-sparks i,.showcase-rays),.identity-mode .about-showcase :is(.showcase-img,.showcase-sparks i,.showcase-rays){animation-play-state:paused}