.hc{color:#f2f2ef;background:linear-gradient(180deg,#08090bb8,#08090beb),var(--bg) center/cover,#0b0c0e;min-height:100svh;font-family:Roboto Flex Variable,Noto Sans JP Variable,sans-serif}.hc-nav{letter-spacing:.2em;align-items:baseline;gap:14px;padding:24px clamp(16px,4vw,56px);font-size:13px;display:flex}.hc-nav b{letter-spacing:.35em;font-size:20px;font-weight:800;font-stretch:125%}.hc-nav span{color:#9a9da3}.hc-nav a{color:inherit;border-bottom:1px solid;margin-left:auto;text-decoration:none}.hc-main{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);align-items:center;gap:clamp(24px,5vw,80px);max-width:1280px;margin:0 auto;padding:clamp(24px,6vh,80px) clamp(16px,4vw,56px) 120px;display:grid}.hc-kicker{letter-spacing:.3em;color:#b9a27a;margin:0;font-size:12px}.hc-text h1{letter-spacing:.04em;margin:12px 0 0;font-size:clamp(36px,5vw,64px);font-weight:700;line-height:1.2}.hc-lead{color:#b7bac0;margin:20px 0 32px;font-size:15px;line-height:2}.hc-ranks{flex-wrap:wrap;gap:8px;display:flex}@media (width<=520px){.hc-ranks{grid-template-columns:1fr 1fr;display:grid}}.hc-ranks button,.hc-tilt{letter-spacing:.16em;color:#f2f2ef;cursor:pointer;background:0 0;border:1px solid #ffffff47;border-radius:999px;min-height:40px;padding:0 16px;font:700 12px Roboto Flex Variable,sans-serif}.hc-ranks button[aria-checked=true]{color:#0b0c0e;background:#f2f2ef;border-color:#f2f2ef}.hc-ranks button:focus-visible,.hc-tilt:focus-visible,.hc-card:focus-visible{outline-offset:4px;outline:2px solid #e7c98a}.hc-tilt{margin-top:16px}.hc-stage{perspective:1100px;touch-action:none;place-items:center;padding:24px;display:grid}.hc-card{--rx:0deg;--ry:0deg;--px:50;--py:50;--hyp:0;aspect-ratio:1.586;width:min(100%,520px);transform:rotateX(var(--rx)) rotateY(var(--ry));transform-style:preserve-3d;border-radius:22px;transition:transform .6s cubic-bezier(.2,.7,.2,1);position:relative;box-shadow:0 40px 60px -30px #000000e6,0 0 0 1px #ffffff14}.hc-card.is-live{transition:none}.hc-face{border-radius:inherit;isolation:isolate;background:var(--metal);color:var(--txt);flex-direction:column;justify-content:space-between;padding:clamp(18px,4.5%,30px);display:flex;position:absolute;inset:0;overflow:hidden}.hc-card[data-rank=silver]{--metal:linear-gradient(135deg,#c9cdd2,#8c9198 45%,#d9dce0 70%,#7e838a);--txt:#1c1e22;--foil:.6}.hc-card[data-rank=gold]{--metal:linear-gradient(135deg,#e9d29a,#b8873d 45%,#f3dfaa 70%,#9a6b2a);--txt:#2a1d0a;--foil:.55}.hc-card[data-rank=platinum]{--metal:linear-gradient(135deg,#eef0f3,#b8bfc9 40%,#f7f8fa 65%,#a9b0ba);--txt:#16181c;--foil:.75}.hc-card[data-rank=black]{--metal:linear-gradient(135deg,#2a2d33,#0e0f12 50%,#33363d 75%,#121317);--txt:#e8e9ec;--foil:.7}.hc-foil{z-index:0;opacity:calc(var(--foil) * (.55 + var(--hyp) * .45));mix-blend-mode:hard-light;-webkit-mask-image:linear-gradient(115deg,transparent calc(var(--px) * 1% - 45%),#000 calc(var(--px) * 1% - 8%),#000 calc(var(--px) * 1% + 8%),transparent calc(var(--px) * 1% + 45%));mask-image:linear-gradient(115deg,transparent calc(var(--px) * 1% - 45%),#000 calc(var(--px) * 1% - 8%),#000 calc(var(--px) * 1% + 8%),transparent calc(var(--px) * 1% + 45%));background:repeating-linear-gradient(115deg,#ff6ec4 0%,#ffd36e 7%,#7dffb2 14%,#6ee7ff 21%,#9b7bff 28%,#ff6ec4 35%) calc(var(--px) * 1%) calc(var(--py) * 1%)/220% 220%, conic-gradient(from calc(var(--px) * 3.6deg) at calc(var(--px) * 1%) calc(var(--py) * 1%),#ff9a9e,#fad0c4,#a1c4fd,#c2e9fb,#d4fc79,#ff9a9e);background-blend-mode:hard-light;filter:saturate(1.4)contrast(1.1);position:absolute;inset:0}.hc-card[data-rank=black] .hc-foil{mix-blend-mode:color-dodge}.hc-emboss{z-index:1;opacity:calc(var(--hyp) * .55);mix-blend-mode:overlay;-webkit-mask-image:radial-gradient(circle at calc(var(--px) * 1%) calc(var(--py) * 1%),#000 0,transparent 70%);mask-image:radial-gradient(circle at calc(var(--px) * 1%) calc(var(--py) * 1%),#000 0,transparent 70%);background:repeating-linear-gradient(45deg,#ffffff8c 0 1px,#0000 1px 9px),repeating-linear-gradient(-45deg,#00000059 0 1px,#0000 1px 9px);position:absolute;inset:0}.hc-glare{z-index:2;mix-blend-mode:soft-light;background:radial-gradient(farthest-corner circle at calc(var(--px) * 1%) calc(var(--py) * 1%),#ffffffd9 0,#fff3 25%,#00000059 90%);position:absolute;inset:0}.hc-top,.hc-chip,.hc-bottom{z-index:3;position:relative}.hc-top{justify-content:space-between;align-items:baseline;display:flex}.hc-top b{letter-spacing:.35em;font-size:clamp(18px,4.2cqw,26px);font-weight:800;font-stretch:125%}.hc-top span{letter-spacing:.28em;font-size:11px;font-weight:700}.hc-chip{aspect-ratio:1.3;background:linear-gradient(135deg,#f5e7b8,#c5a35a 50%,#ead69c);border-radius:6px;width:16%;box-shadow:inset 0 0 0 1px #00000040}.hc-bottom{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.hc-no{letter-spacing:.12em;font-family:JetBrains Mono Variable,monospace;font-size:clamp(12px,3cqw,17px)}.hc-name{text-align:right;letter-spacing:.14em;font-size:clamp(12px,2.8cqw,15px);font-weight:700;display:grid}.hc-name small{opacity:.7;font-size:9px;font-weight:500}.hc-face{container-type:inline-size}.hc-note{color:#8a8d93;margin:0;font-size:11px;position:absolute;bottom:16px;right:16px}@media (width<=860px){.hc-main{grid-template-columns:minmax(0,1fr)}.hc-stage{order:-1}.hc-note{padding:0 16px 80px;position:static}}@media (pointer:coarse){.hc-ranks button{min-height:44px}.hc-nav a{text-underline-offset:4px;border-bottom:0;margin-block:-15px;padding-block:15px;text-decoration:underline}}
