/* 形象图鉴 · 首页形象一览 · 人物名牌 */
.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}}
