:root{--r-card:16px;--r-tile:12px;--warm:var(--accent);--cool:var(--primary);--rose:var(--bridge);--cool-ink:color-mix(in srgb,var(--primary) 52%,white)}body:before{content:"";position:fixed;inset:-18% -12%;z-index:0;pointer-events:none;background:radial-gradient(34% 30% at 14% 12%,color-mix(in srgb,var(--rose) 24%,transparent),transparent 70%),radial-gradient(36% 34% at 88% 34%,color-mix(in srgb,var(--cool) 26%,transparent),transparent 70%),radial-gradient(26% 24% at 52% 96%,color-mix(in srgb,var(--warm) 14%,transparent),transparent 70%);filter:blur(150px);animation:orbs-drift 28s ease-in-out infinite alternate}@keyframes orbs-drift{0%{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(2%,3%,0) scale(1.06)}}body:after{content:"";position:fixed;inset:0;z-index:9;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px;mix-blend-mode:overlay}.hero{position:relative;padding:clamp(36px,6vh,72px) 0 clamp(28px,4vh,44px)}.hero:before{content:"";position:absolute;inset:0 0 clamp(120px,19vh,180px) 0;z-index:0;border-radius:0 0 28px 28px;background:radial-gradient(120% 95% at 84% 96%,color-mix(in srgb,var(--warm) 62%,transparent),transparent 52%),radial-gradient(85% 75% at 80% 26%,color-mix(in srgb,var(--rose) 60%,transparent),transparent 62%),radial-gradient(70% 90% at 22% 42%,color-mix(in srgb,var(--surface) 46%,transparent),transparent 75%),linear-gradient(215deg,color-mix(in srgb,var(--cool) 62%,var(--surface)) 0,color-mix(in srgb,var(--cool) 44%,var(--surface)) 42%,color-mix(in srgb,var(--rose) 30%,var(--surface)) 78%,color-mix(in srgb,var(--surface) 92%,var(--rose)) 100%)}.hero>.container{position:relative;z-index:1}.hero-grid{align-items:start}.hero .slabel{color:var(--ink)}.hero .slabel b{color:var(--warm)}.hero-title{font-weight:700;font-size:clamp(2.1rem,4.6vw,3.7rem)}.hero-title em{font-style:normal;display:inline-block;background:linear-gradient(100deg,var(--warm) 20%,var(--rose) 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--warm);filter:drop-shadow(0 0 16px color-mix(in srgb,var(--warm) 40%,transparent))}.hero-sub{font-size:1.16rem;color:var(--ink);max-width:46ch}.hero-note{color:color-mix(in srgb,var(--ink) 88%,transparent)}.hero .mock-stage{position:relative;z-index:2;display:grid;justify-items:center}.chip-row li{border-radius:999px;border:1px solid color-mix(in srgb,var(--cool) 38%,transparent);background:color-mix(in srgb,var(--surface-alt) 72%,transparent);color:var(--cool-ink)}.hero-grid>.chip-row{position:relative;z-index:1}.mq{width:min(420px,100%);border-radius:var(--r-card);border:1px solid transparent;background:linear-gradient(color-mix(in srgb,var(--surface-alt) 66%,transparent),color-mix(in srgb,var(--surface) 78%,transparent)) padding-box,linear-gradient(150deg,color-mix(in srgb,var(--warm) 85%,transparent),color-mix(in srgb,var(--rose) 55%,transparent) 34%,color-mix(in srgb,var(--cool) 40%,transparent) 70%,transparent) border-box;backdrop-filter:blur(44px) saturate(2) brightness(1.08);-webkit-backdrop-filter:blur(44px) saturate(2) brightness(1.08);box-shadow:0 2px 14px color-mix(in srgb,var(--rose) 34%,transparent),0 24px 80px color-mix(in srgb,var(--cool) 26%,transparent);padding:12px;display:grid;grid-gap:10px;gap:10px}.mq-head{display:flex;align-items:center;gap:8px;min-width:0;padding:2px 4px 0}.mq-dot{flex:none;width:9px;height:9px;border-radius:50%;background:var(--cool-ink);box-shadow:0 0 8px color-mix(in srgb,var(--cool) 80%,transparent)}.mq-name{font-family:var(--font-head);font-weight:700;font-size:.98rem;color:var(--ink)}.mq-meta{font-size:.8rem;color:var(--ink-muted);min-width:0;white-space:nowrap;overflow:hidden}.mq-phase{margin-left:auto;flex:none;font-size:.72rem;color:var(--warm);border:1px solid color-mix(in srgb,var(--warm) 40%,transparent);border-radius:999px;padding:3px 9px;white-space:nowrap}.mq-frame{position:relative;border-radius:var(--r-tile);overflow:hidden}.mq-frame:not(:has(.mq-badge)) .slot img{filter:grayscale(1) brightness(.25)}.mq-badge{top:10px;left:10px;font-size:.7rem;line-height:1.2;color:var(--warm);background:color-mix(in srgb,var(--surface) 78%,transparent);border:1px solid color-mix(in srgb,var(--warm) 35%,transparent);border-radius:999px;padding:4px 10px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.mq-badge,.mq-q{position:absolute;z-index:2}.mq-q{left:12px;right:12px;bottom:12px;margin:0;font-size:.95rem;line-height:1.45;color:var(--ink);padding:12px 14px;border-radius:14px 14px 14px 0;border:1px solid transparent;background:linear-gradient(color-mix(in srgb,var(--surface) 82%,transparent),color-mix(in srgb,var(--surface) 86%,transparent)) padding-box,linear-gradient(140deg,color-mix(in srgb,var(--cool-ink) 85%,transparent),color-mix(in srgb,var(--cool) 30%,transparent) 55%,transparent) border-box;backdrop-filter:blur(14px) saturate(1.9);-webkit-backdrop-filter:blur(14px) saturate(1.9)}.mq-q-who{display:inline-block;font-size:.68rem;font-weight:600;color:var(--warm);border:1px solid color-mix(in srgb,var(--warm) 45%,transparent);border-radius:999px;padding:1px 8px 2px;margin:0 8px 2px 0;vertical-align:middle}.mq-reply{display:flex;align-items:center;gap:10px;min-width:0;border-radius:999px;padding:9px 9px 9px 16px;border:1px solid color-mix(in srgb,var(--cool) 34%,transparent);background:color-mix(in srgb,var(--surface) 62%,transparent)}.mq-reply span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;color:var(--ink-muted)}.mq-send{flex:none;margin-left:auto;width:34px;height:34px;border-radius:50%;background:linear-gradient(130deg,var(--warm),var(--rose));display:grid;place-items:center;box-shadow:0 1px 8px color-mix(in srgb,var(--warm) 55%,transparent),0 8px 26px color-mix(in srgb,var(--rose) 30%,transparent)}.mq-send:after{content:"→";color:var(--surface);font-weight:700;font-size:15px;transform:rotate(-45deg)}.btn{border-radius:999px;display:inline-flex;align-items:center;gap:10px;font-weight:600}.btn-primary{border:0;background:linear-gradient(115deg,var(--warm) 10%,color-mix(in srgb,var(--rose) 92%,var(--warm)) 95%);color:var(--surface);box-shadow:0 2px 10px color-mix(in srgb,var(--warm) 45%,transparent),0 14px 42px color-mix(in srgb,var(--rose) 30%,transparent)}.btn-primary:after{content:"→";flex:none;width:22px;height:22px;border:1.5px solid color-mix(in srgb,var(--surface) 50%,transparent);border-radius:50%;display:inline-grid;place-items:center;font-size:.82em;line-height:1}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 3px 14px color-mix(in srgb,var(--warm) 55%,transparent),0 18px 52px color-mix(in srgb,var(--rose) 38%,transparent)}.btn-ghost{border:1px solid transparent;color:var(--cool-ink);background:linear-gradient(color-mix(in srgb,var(--surface-alt) 58%,transparent),color-mix(in srgb,var(--surface-alt) 58%,transparent)) padding-box,linear-gradient(140deg,color-mix(in srgb,var(--cool-ink) 90%,transparent),color-mix(in srgb,var(--cool) 45%,transparent) 60%,color-mix(in srgb,var(--cool) 25%,transparent)) border-box;backdrop-filter:blur(18px) saturate(1.8);-webkit-backdrop-filter:blur(18px) saturate(1.8);box-shadow:0 6px 26px color-mix(in srgb,var(--cool) 30%,transparent)}.btn-ghost:hover{color:white}.slabel{letter-spacing:.05em}.slabel .rule{flex:none;width:20px;height:13px;border-radius:7px 7px 7px 0;background:linear-gradient(120deg,var(--warm),var(--rose));box-shadow:0 0 10px color-mix(in srgb,var(--rose) 45%,transparent)}.slabel.mid .rule{background:linear-gradient(120deg,var(--cool-ink),var(--cool));box-shadow:0 0 10px color-mix(in srgb,var(--cool) 45%,transparent)}.slabel b{color:var(--warm)}.slabel.mid b{color:var(--cool-ink)}.hero-face-ring{border-radius:50%;padding:3px;background:conic-gradient(var(--warm),var(--rose),var(--cool),var(--cool-ink),var(--warm));box-shadow:0 1px 6px color-mix(in srgb,var(--rose) 40%,transparent),0 8px 26px color-mix(in srgb,var(--cool) 30%,transparent)}.hero-face-ring .slot{border-radius:50%;border:2px solid var(--surface)}.hero-face-ring .slot img{object-position:50% 12%}.hero-face-dot{background:var(--cool-ink);box-shadow:0 0 8px color-mix(in srgb,var(--cool) 85%,transparent);border-color:var(--surface)}.hero-face-name{color:var(--ink)}.hero-faces-note{color:color-mix(in srgb,var(--ink) 82%,transparent)}.band{padding:clamp(56px,9vh,96px) 0}.panel{position:relative;background:color-mix(in srgb,var(--surface-alt) 55%,transparent)}.panel:before{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cool) 75%,transparent) 30%,color-mix(in srgb,var(--rose) 75%,transparent) 70%,transparent)}.head h2{font-weight:700}.stats{gap:14px}.stats>div{border-radius:var(--r-card);padding:18px 20px;border:1px solid color-mix(in srgb,var(--cool) 22%,transparent);background:color-mix(in srgb,var(--surface-alt) 62%,transparent)}.stats>div:nth-child(odd){border-color:color-mix(in srgb,var(--warm) 26%,transparent)}.stats .num{color:var(--cool-ink)}.stats>div:nth-child(odd) .num{color:var(--warm)}.fcard{border-radius:var(--r-card);border:1px solid color-mix(in srgb,var(--cool) 18%,transparent);background:color-mix(in srgb,var(--surface-alt) 52%,transparent);box-shadow:0 10px 34px color-mix(in srgb,var(--cool) 14%,transparent)}.fcard .ico{border-radius:38%;background:color-mix(in srgb,var(--cool) 24%,transparent);color:var(--cool-ink);border:0}.fcard:nth-child(2n) .ico{background:color-mix(in srgb,var(--warm) 20%,transparent);color:var(--warm)}.fcard:nth-child(2n){border-color:color-mix(in srgb,var(--warm) 20%,transparent);box-shadow:0 10px 34px color-mix(in srgb,var(--rose) 12%,transparent)}.rcard-char{border-radius:var(--r-card);overflow:hidden;border:1px solid transparent;background:linear-gradient(color-mix(in srgb,var(--surface-alt) 82%,transparent),color-mix(in srgb,var(--surface-alt) 82%,transparent)) padding-box,linear-gradient(160deg,color-mix(in srgb,var(--card-tint,var(--cool)) 60%,transparent),transparent 50%) border-box;box-shadow:0 14px 40px color-mix(in srgb,var(--card-tint,var(--cool)) 16%,transparent)}.rcard-media{border-radius:var(--r-tile) var(--r-tile) 0 0}.rcard-media:after{content:"";position:absolute;inset:55% 0 0 0;pointer-events:none;background:linear-gradient(transparent,color-mix(in srgb,var(--card-tint,var(--cool)) 34%,transparent))}.rcard-live,.rcard-persona{border-radius:999px}.rcard-live{background:color-mix(in srgb,var(--cool-ink) 92%,white);color:var(--surface)}.rcard-live:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;background:var(--surface)}.rcard-persona{background:color-mix(in srgb,var(--surface) 74%,transparent);color:var(--warm);border:1px solid color-mix(in srgb,var(--warm) 35%,transparent)}.rcard-char .chip-row li{border-radius:999px;font-size:.78rem}.rcard-stats span+span:before{content:"·";margin:0 7px;color:var(--rose)}.roster-tab{border-radius:999px}.roster-tab.is-active{background:linear-gradient(115deg,var(--warm),color-mix(in srgb,var(--warm) 70%,var(--rose)));color:var(--surface);border-color:transparent}.roster-tab.is-active i{color:color-mix(in srgb,var(--surface) 78%,transparent)}.fan{overflow:hidden;padding:10px 0 4px;--fan-w:clamp(200px,26vw,290px);--fan-h:calc(var(--fan-w) * 4 / 3)}.fan-stage{position:relative;height:calc(var(--fan-h) + 34px);touch-action:pan-y}.fan-card{position:absolute;left:50%;top:16px;width:var(--fan-w);padding:0;border:1px solid color-mix(in srgb,var(--cool) 30%,transparent);border-radius:var(--r-card);overflow:hidden;cursor:pointer;background:var(--surface-alt);transform-origin:50% 130%;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s ease}.fan-card[data-off="0"]{transform:translateX(-50%);background:linear-gradient(var(--surface-alt),var(--surface-alt)) padding-box,linear-gradient(150deg,var(--warm),var(--rose) 45%,var(--cool)) border-box;border:1px solid transparent;box-shadow:0 2px 14px color-mix(in srgb,var(--rose) 38%,transparent),0 26px 70px color-mix(in srgb,var(--cool) 34%,transparent)}.fan-card[data-off="1"]{transform:translateX(calc(-50% + var(--fan-w) * .56)) rotate(9deg) scale(.92)}.fan-card[data-off="2"]{transform:translateX(calc(-50% + var(--fan-w) * 1)) rotate(19deg) scale(.84);opacity:.8}.fan-card[data-off="-1"]{transform:translateX(calc(-50% - var(--fan-w) * .56)) rotate(-9deg) scale(.92)}.fan-card[data-off="-2"]{transform:translateX(calc(-50% - var(--fan-w) * 1)) rotate(-19deg) scale(.84);opacity:.8}.fan-tag{position:absolute;top:10px;left:10px;font-size:.72rem;font-weight:600;color:var(--surface);background:linear-gradient(115deg,var(--warm),color-mix(in srgb,var(--warm) 65%,var(--rose)));border-radius:999px;padding:4px 11px}.fan-caption{max-width:560px;margin:18px auto 0;text-align:center}.fan-count{margin:0 0 6px;font-size:.82rem;color:var(--ink-muted);letter-spacing:.05em}.fan-count b{color:var(--warm);font-weight:700}.fan-caption h3{margin:0 0 6px;font-size:1.25rem;display:inline-flex;align-items:center;gap:10px}.fan-caption h3:before{content:"";flex:none;width:16px;height:11px;border-radius:6px 6px 6px 0;background:linear-gradient(120deg,var(--warm),var(--rose))}.fan-text{margin:0 0 14px;color:var(--ink-muted);font-size:1.02rem}.fan-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;min-width:0}.fan-btn{width:44px;height:44px;border-radius:50%;border:1px solid color-mix(in srgb,var(--cool-ink) 55%,transparent);background:color-mix(in srgb,var(--surface-alt) 62%,transparent);color:var(--cool-ink);font-size:1.05rem;cursor:pointer;display:grid;place-items:center;transition:border-color .2s ease,color .2s ease}.fan-btn:hover{color:white;border-color:var(--cool-ink)}.fan-hint{flex-basis:100%;font-size:.8rem;color:color-mix(in srgb,var(--ink-muted) 80%,transparent)}.steps-pin-mock .mq{width:min(320px,100%)}.steps-pin-list>.step{border-radius:var(--r-card)}.steps-pin-list>.step.on{border:1px solid transparent;background:linear-gradient(color-mix(in srgb,var(--surface-alt) 78%,transparent),color-mix(in srgb,var(--surface-alt) 78%,transparent)) padding-box,linear-gradient(150deg,color-mix(in srgb,var(--cool-ink) 80%,transparent),transparent 60%) border-box;box-shadow:0 14px 44px color-mix(in srgb,var(--cool) 22%,transparent)}.step .n{letter-spacing:.05em;color:var(--warm);display:inline-flex;align-items:center;gap:8px}.steps-pin-list>.step.on .n:before{content:"";width:16px;height:11px;border-radius:6px 6px 6px 0;background:linear-gradient(120deg,var(--warm),var(--rose))}.steps-pin-dots li.on{background:var(--warm)}.checklist,.faq-item,.pcbox,.rcard,.tcard{border-radius:var(--r-card)}.rcard{border:1px solid color-mix(in srgb,var(--cool) 20%,transparent);background:color-mix(in srgb,var(--surface-alt) 55%,transparent);transition:box-shadow .25s ease,border-color .25s ease}.rcard:hover{border-color:color-mix(in srgb,var(--rose) 45%,transparent);box-shadow:0 16px 48px color-mix(in srgb,var(--rose) 18%,transparent)}.rcard .k{color:var(--cool-ink)}.faq-num{color:var(--warm)}.tcard{border:1px solid color-mix(in srgb,var(--rose) 18%,transparent);box-shadow:0 12px 36px color-mix(in srgb,var(--rose) 10%,transparent)}.final-media .slot{border-radius:var(--r-card);box-shadow:0 2px 12px color-mix(in srgb,var(--warm) 30%,transparent),0 26px 80px color-mix(in srgb,var(--cool) 30%,transparent)}.mock-stage{min-width:0}.fc-inner{border-radius:999px;border:1px solid transparent;background:linear-gradient(color-mix(in srgb,var(--surface) 88%,transparent),color-mix(in srgb,var(--surface) 88%,transparent)) padding-box,linear-gradient(120deg,color-mix(in srgb,var(--warm) 70%,transparent),color-mix(in srgb,var(--rose) 45%,transparent) 50%,color-mix(in srgb,var(--cool) 45%,transparent)) border-box;backdrop-filter:blur(24px) saturate(1.9);-webkit-backdrop-filter:blur(24px) saturate(1.9)}.footer{border-top:1px solid color-mix(in srgb,var(--cool) 22%,transparent)}@media (max-width:900px){.hero:before{inset:0 0 clamp(120px,22vh,220px) 0;border-radius:0 0 20px 20px}.fan{--fan-w:clamp(180px,56vw,250px)}.fan-card[data-off="-2"],.fan-card[data-off="2"]{opacity:.45}}@media (max-width:640px){.hero{padding-top:22px}.hero-title{font-size:clamp(1.9rem,8.4vw,2.4rem)}.hero-sub{font-size:1.1rem}.mq{width:100%}.mq-meta{display:none}.band{padding:48px 0}}@media (prefers-reduced-motion:reduce){body:before{animation:none}.fan-card{transition:none}.btn-primary:hover{transform:none}}