:root{color-scheme:dark;--bg:#17121e;--paper:#f6f2ed;--muted:#aaa0b3;--accent:#cda4f1;font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--paper)}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}p,h1,figure{margin:0}
.poster{position:relative;isolation:isolate;width:100%;height:100svh;min-height:650px;overflow:hidden;background:var(--bg)}
.atmosphere{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 58% 40%,#63417b28,transparent 56%),linear-gradient(155deg,#211926 0%,#17121e 58%,#100e17 100%)}
.masthead{position:absolute;z-index:8;top:31px;left:3.4%;right:3.4%;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:19px}.brand strong{font-size:27px;line-height:1;font-weight:900;letter-spacing:-1.5px}.brand span{padding-left:19px;border-left:1px solid #ffffff3d;font-size:13px;letter-spacing:2px}.top-link{display:flex;align-items:center;gap:23px;min-height:44px;font-size:13px}.top-link span{font-size:21px}
.outline{position:absolute;z-index:-1;inset:98px 3.4% 83px;border:1px solid #f4eff140;clip-path:polygon(0 0,100% 0,100% 37%,98.5% 42%,98.5% 76%,100% 81%,100% 100%,0 100%,0 81%,1.5% 76%,1.5% 42%,0 37%)}
.outline i{position:absolute;width:4px;height:4px;background:#cdc2d4}.outline i:nth-child(1){left:0;top:0}.outline i:nth-child(2){right:0;top:0}.outline i:nth-child(3){left:0;bottom:0}.outline i:nth-child(4){right:0;bottom:0}
.studio-label{position:absolute;left:6.1%;top:129px;font-size:12px;font-weight:500;letter-spacing:.16em;color:#d6ccd9;z-index:3}
.hero-type{position:absolute;left:4.1%;top:21%;width:91.8%;font-family:Impact,"Arial Black",sans-serif;font-size:29.6vw;font-weight:400;letter-spacing:-.025em;line-height:1.02;text-align:center;transform:scaleY(1.17);transform-origin:50% 0;z-index:0;color:var(--paper);user-select:none}
.creator{position:absolute;z-index:3;left:51.8%;bottom:-24%;height:119%;width:auto;aspect-ratio:2/3;transform:translateX(-50%);pointer-events:none}.creator img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(18px 18px 28px #05020838)}
.orbit-label{position:absolute;z-index:4;right:8.6%;top:19%;width:106px;height:106px;border-radius:50%;background:var(--accent);color:#25142e;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(12deg)}.orbit-label>span{font-family:Impact,"Arial Black",sans-serif;font-size:50px;line-height:1}.orbit-label small{font-size:10px;letter-spacing:.12em;margin-top:4px}
.side-label{position:absolute;z-index:2;left:2.05%;top:54%;writing-mode:vertical-rl;transform:rotate(180deg);font-size:9px;letter-spacing:.18em;color:#c8bbcf}
.bottom-shade{position:absolute;z-index:4;inset:68% 0 0;background:linear-gradient(transparent,#17121e80 50%,#17121ef7 100%);pointer-events:none}
.intro{position:absolute;z-index:5;left:6.1%;bottom:123px}.tagline{font-size:clamp(22px,2.05vw,34px);letter-spacing:.09em;line-height:1.5;font-weight:500;white-space:nowrap}.descriptor{font-size:13px;letter-spacing:.15em;color:#c8bdce;margin-top:14px}
.entry{position:absolute;z-index:6;right:6.1%;bottom:119px;text-align:center}.view-work{display:flex;align-items:center;justify-content:space-between;gap:47px;min-width:226px;min-height:65px;padding:11px 15px 11px 30px;border-radius:50px;background:var(--paper);color:#211728;font-size:17px;letter-spacing:.14em;font-weight:500}.entry-arrow{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#cda4f1;color:#22142d;font-size:25px}.entry-caption{font-size:9px;letter-spacing:.21em;margin-top:14px;color:#aaa0b3}
.edition{position:absolute;z-index:6;bottom:34px;left:3.4%;right:3.4%;display:flex;justify-content:space-between;gap:20px;font-size:9px;letter-spacing:.14em;color:#a195ac}
@media(min-width:1700px){.creator{height:129%;bottom:-30%}.hero-type{top:17%}}
@media(max-height:720px) and (min-width:761px){.poster{min-height:560px}.masthead{top:19px}.outline{top:78px;bottom:59px}.studio-label{top:104px}.intro{bottom:97px}.entry{bottom:87px}.edition{bottom:24px}.hero-type{top:20%;font-size:27.5vw}.creator{height:120%;bottom:-24%}}
@media(max-width:760px){
  .poster{min-height:690px;height:100svh}
  .masthead{top:max(22px,env(safe-area-inset-top));left:23px;right:23px;gap:12px}
  .brand{gap:12px}.brand strong{font-size:25px}.brand span{font-size:11px;letter-spacing:1px;padding-left:12px}.top-link{font-size:11px;gap:10px}.top-link span{font-size:18px}
  .outline{inset:91px 17px 81px;clip-path:none;border-color:#e8dcef36}
  .studio-label{left:34px;top:112px;font-size:9px;letter-spacing:.15em}
  .hero-type{top:19.2%;left:2%;width:96%;font-size:30.3vw;line-height:1.15;transform:scaleY(1.86);letter-spacing:-.03em}
  .creator{height:81%;bottom:7.5%;left:50%;width:auto;aspect-ratio:2/3;transform:translateX(-50%)}
  .orbit-label{top:15.6%;right:28px;width:59px;height:59px}.orbit-label>span{font-size:31px}.orbit-label small{font-size:6px;margin-top:1px}
  .side-label{left:6px;top:47%;font-size:7px;letter-spacing:.13em}
  .bottom-shade{inset:51% 0 0;background:linear-gradient(transparent,#17121e40 23%,#17121ee8 57%,#17121e 80%)}
  .intro{left:0;right:0;bottom:194px;text-align:center}.tagline{font-size:23px;letter-spacing:.04em}.descriptor{font-size:11px;letter-spacing:.14em;margin-top:10px}
  .entry{left:50%;right:auto;bottom:91px;transform:translateX(-50%)}.view-work{min-width:242px;min-height:58px;font-size:16px;padding:9px 12px 9px 28px;gap:43px}.entry-arrow{width:38px;height:38px;font-size:23px}.entry-caption{font-size:8px;letter-spacing:.18em;margin-top:11px}
  .edition{bottom:max(30px,calc(env(safe-area-inset-bottom) + 16px));left:23px;right:23px;font-size:7px;letter-spacing:.08em}.edition span:first-child{max-width:130px;line-height:1.6}
}
@media(max-width:360px){.brand span{display:none}.tagline{font-size:20px}.creator{height:77%;bottom:14%}.intro{bottom:182px}.entry{bottom:83px}}

/* A2: calm framing leaves the detail and contrast to the metal subject. */
.outline{clip-path:none;border-color:#f4eff128}
.outline i{display:none}
.hero-type{color:#ebe7e9}
.creator img{filter:none}
.edition{justify-content:flex-end;color:#968b9e}
@media(max-width:760px){.edition span:first-child{max-width:none}}
