/* =====================================================================
   MAINSTREAM — answers as stars, merging into constellations
   ===================================================================== */
.ms-host{position:fixed;inset:0;z-index:3;pointer-events:none}
.ms-host button,.ms-host .ms-ctl{pointer-events:auto}
.ms-field{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.ms-layer{position:absolute;inset:0}
.ms-pop{animation:msPop .5s cubic-bezier(.2,1.3,.4,1) both}
@keyframes msPop{from{opacity:0;transform:translateY(-16px) scale(.97)}}
.ms-kick{font-size:16px;letter-spacing:4px;text-transform:uppercase;color:#7ff6ff}
.ms-dim{color:var(--ink-3)}
.ms-logo{font-size:88px;line-height:1;letter-spacing:12px;text-shadow:-4px 0 #ff3d9a,4px 0 #2ef0ff,0 0 40px rgba(95,243,255,.55)}
.ms-logo.sm{font-size:48px;letter-spacing:8px}.ms-logo.xs{font-size:32px;letter-spacing:6px}
.ms-ctl{display:flex;gap:12px;justify-content:center;align-items:center}

/* intro */
.ms-intro{position:absolute;left:50%;top:72px;transform:translateX(-50%);width:min(1120px,94vw);text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.ms-intro .ms-kick{background:rgba(6,4,24,.8);padding:2px 12px}
.ms-sub{font-size:24px;color:var(--ink-2);text-shadow:2px 0 #07051a,-2px 0 #07051a,0 2px #07051a,0 -2px #07051a}.ms-sub b{color:#fff}
.ms-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;width:100%;margin-top:8px}
.ms-rule{position:relative;display:flex;flex-direction:column;gap:4px;padding:20px 16px 16px;background:rgba(10,8,34,.9);border:2px solid #2f2878;text-align:left}
.ms-rule .n{position:absolute;right:12px;top:6px;font-weight:700;font-size:48px;line-height:1;color:#241e5e}
.ms-rule b{font-size:24px;color:#fff;letter-spacing:2px}.ms-rule span{font-size:16px;color:var(--ink-2)}
.ms-rule:nth-child(1){border-top:4px solid #5ff3ff}.ms-rule:nth-child(2){border-top:4px solid #ff5fb4}.ms-rule:nth-child(3){border-top:4px solid #ffd34d}
.ms-aboard{width:100%;background:rgba(10,8,34,.86);padding:12px 16px;border:2px solid #2f2878}
.ms-plist{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:8px;min-height:36px}

/* ask */
.ms-qbox{background:rgba(9,7,32,.92);padding:20px 32px 24px;border-top:4px solid #5ff3ff;box-shadow:0 16px 48px rgba(0,0,0,.5)}
.ms-ask{position:absolute;left:50%;top:72px;transform:translateX(-50%);width:min(1120px,92vw)}
.ms-qtop{display:flex;justify-content:space-between;align-items:center;gap:12px}
.ms-q{font-weight:700;font-size:48px;line-height:64px;color:#fff;margin-top:12px;text-shadow:0 4px 0 #1a1050}
.ms-hint{font-size:16px;letter-spacing:2px;color:var(--ink-3);margin-top:8px}.ms-hint b{color:#ffd34d}
.ms-ring{--p:100%;position:relative;width:64px;height:64px;flex:none;display:flex;align-items:center;justify-content:center;background:conic-gradient(#5ff3ff var(--p),#1e1756 0);clip-path:polygon(0 8px,8px 8px,8px 0,calc(100% - 8px) 0,calc(100% - 8px) 8px,100% 8px,100% calc(100% - 8px),calc(100% - 8px) calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,8px calc(100% - 8px),0 calc(100% - 8px))}
.ms-ring::after{content:'';position:absolute;inset:4px;background:#0c0928;clip-path:inherit}
.ms-ring b{position:relative;z-index:1;font-size:32px;color:#fff}
.ms-ring.low{animation:lowpulse .5s steps(2) infinite}
.ms-bottom{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);width:min(1120px,92vw);display:flex;flex-direction:column;align-items:center;gap:12px}
.ms-in{display:flex;align-items:baseline;gap:12px;font-size:24px;color:var(--ink-2);background:rgba(6,4,24,.8);padding:4px 16px}
.ms-big{font-weight:700;font-size:64px;line-height:1;color:#ffd34d;text-shadow:0 0 24px rgba(255,211,77,.7)}
.ms-big.bump{animation:bump .35s cubic-bezier(.2,1.8,.4,1)}
.ms-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.ms-chip{display:flex;align-items:center;gap:8px;padding:4px 12px;font-size:16px;background:rgba(10,8,34,.9);border:2px solid #2a2470;color:var(--ink-3)}
.ms-chip i{display:block;width:14px;height:14px;border:2px dashed #4a3fa0}
.ms-chip.in{color:#fff;border-color:#ffd34d;box-shadow:0 0 12px rgba(255,211,77,.35);animation:pipPop .5s cubic-bezier(.2,1.7,.35,1)}

/* reveal */
.ms-rtop{position:absolute;left:50%;top:64px;transform:translateX(-50%);width:min(1120px,92vw)}
.ms-qbox.sm{padding:12px 24px 16px}.ms-qbox.sm .ms-q{font-size:32px;line-height:40px;margin-top:4px}
.ms-board{position:absolute;right:max(24px,3vw);top:208px;width:min(480px,36vw);max-height:calc(100vh - 300px);overflow:hidden;background:rgba(9,7,32,.92);padding:16px 20px;border-top:4px solid #ff5fb4}
.ms-bh{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ms-counting{font-size:16px;letter-spacing:2px;color:var(--ink-3);text-transform:uppercase}
.ms-counting i{font-style:normal;animation:dots 1s steps(1) infinite}.ms-counting i:nth-child(2){animation-delay:.33s}.ms-counting i:nth-child(3){animation-delay:.66s}
@keyframes dots{50%{opacity:0}}
.ms-counting.done{font-weight:700;color:#ffd34d;letter-spacing:4px;animation:novaHue 1.6s linear infinite}
.ms-rows{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.ms-row{position:relative;display:grid;grid-template-columns:1fr auto 72px;align-items:center;gap:12px;min-height:48px;padding:4px 12px;background:#0e0b34;border:2px solid #241e5e;overflow:hidden}
.ms-row .ms-bar{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,color-mix(in srgb,var(--c) 55%,transparent),color-mix(in srgb,var(--c) 18%,transparent));transition:width .8s cubic-bezier(.2,1.2,.4,1)}
.ms-row > span:not(.ms-bar){position:relative;z-index:1}
.ms-row .ms-lab,.ms-row .ms-n,.ms-row .ms-pct{opacity:0}
.ms-row::after{content:'?';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:24px;color:#2f2878;letter-spacing:8px;background:repeating-linear-gradient(45deg,#0e0b34 0 8px,#120e3e 8px 16px)}
.ms-row.on{border-color:var(--c);box-shadow:0 0 16px color-mix(in srgb,var(--c) 40%,transparent);animation:rowFlip .5s cubic-bezier(.2,1.5,.4,1)}
.ms-row.on::after{display:none}
.ms-row.on .ms-bar{width:var(--w)}
.ms-row.on .ms-lab,.ms-row.on .ms-n,.ms-row.on .ms-pct{opacity:1}
@keyframes rowFlip{0%{transform:scaleY(.1);filter:brightness(3)}60%{transform:scaleY(1.15)}}
.ms-lab{font-size:24px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 2px #07051a}
.ms-n{font-size:16px;color:var(--ink-2)}.ms-n::after{content:' said'}
.ms-pct{font-size:24px;font-weight:700;color:var(--c);text-align:right}
.ms-rest .ms-lab{font-size:16px;color:var(--ink-3)}.ms-rest .ms-pct{font-size:16px;font-weight:400}
.ms-rows li:first-child.on{min-height:64px}.ms-rows li:first-child.on .ms-lab{font-size:32px;color:#fff6c8}.ms-rows li:first-child.on .ms-pct{font-size:32px}
.ms-stand{margin-top:16px;opacity:0;transition:opacity .4s}
.ms-stand.on{opacity:1}
.ms-srow{display:grid;grid-template-columns:32px 1fr auto 64px;gap:8px;align-items:center;font-size:16px;padding:2px 0;border-bottom:1px dashed #241e5e;animation:msPop .4s cubic-bezier(.2,1.4,.4,1) both;animation-delay:calc(var(--i) * 90ms)}
.ms-srow .rk{color:var(--ink-3)}.ms-srow .dl{color:#2ee6a8}.ms-srow .sc{font-weight:700;color:#ffd34d;text-align:right}
.ms-rctl{position:absolute;right:max(24px,3vw);bottom:24px}
.ms-clab{position:absolute;transform:translateX(-50%);text-align:center;white-space:nowrap;animation:labIn .6s cubic-bezier(.2,1.6,.4,1) .45s both;pointer-events:none}
.ms-clab b{display:block;font-size:24px;color:var(--c);text-shadow:2px 0 #07051a,-2px 0 #07051a,0 2px #07051a,0 -2px #07051a,0 0 16px var(--c)}
.ms-clab span{font-size:16px;color:#fff;background:rgba(6,4,24,.8);padding:0 8px}
.ms-clab.big b{font-size:40px;letter-spacing:2px}
@keyframes labIn{from{opacity:0;transform:translateX(-50%) translateY(12px) scale(.6)}}
.ms-banner{position:absolute;left:32%;top:50%;transform:translate(-50%,-50%);z-index:5;text-align:center;padding:16px 40px;background:radial-gradient(ellipse,rgba(40,24,0,.92),rgba(8,4,24,.9));border:4px solid #ffd34d;box-shadow:0 0 60px rgba(255,211,77,.6);animation:banIn .6s cubic-bezier(.2,1.8,.35,1) both;pointer-events:none;max-width:56vw}
.ms-banner span{display:block;font-size:16px;letter-spacing:4px;text-transform:uppercase;color:#ffb84a}
.ms-banner b{display:block;font-weight:700;font-size:64px;line-height:1.1;color:#ffd34d;text-shadow:-3px 0 rgba(255,61,154,.7),3px 0 rgba(46,240,255,.7),0 0 30px rgba(255,211,77,.8);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-banner em{display:block;font-style:normal;font-size:24px;color:#fff;margin-top:4px}
.ms-banner.out{animation:revealOut .45s both}
@keyframes banIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.3) rotate(-6deg)}}

/* final podium */
.ms-final{position:absolute;left:50%;top:72px;transform:translateX(-50%);width:min(1000px,94vw);text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.ms-final .ms-kick{background:rgba(6,4,24,.8);padding:2px 12px}
.ms-podium{display:grid;grid-template-columns:repeat(3,1fr);align-items:end;gap:16px;width:min(760px,100%);margin-top:16px}
.ms-pod{display:flex;flex-direction:column;align-items:center;gap:4px;animation:podUp .8s cubic-bezier(.2,1.4,.4,1) both}
.ms-pod.p1{animation-delay:.6s}.ms-pod.p2{animation-delay:.3s}.ms-pod.p3{animation-delay:0s}
@keyframes podUp{from{opacity:0;transform:translateY(80px)}}
.ms-pod .av svg{display:block;filter:drop-shadow(0 0 12px rgba(95,243,255,.6))}
.ms-pod .nm{font-size:24px;color:#fff;text-shadow:0 2px #07051a;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-pod .sc{font-weight:700;font-size:32px;color:#ffd34d}
.ms-pod .blk{width:100%;display:flex;align-items:flex-start;justify-content:center;padding-top:8px;background:linear-gradient(#1e1756,#0c0928);border-top:4px solid var(--pc)}
.ms-pod .blk b{font-weight:700;font-size:48px;color:var(--pc)}
.ms-pod.p1{--pc:#ffd34d}.ms-pod.p1 .blk{height:200px;box-shadow:0 0 40px rgba(255,211,77,.4)}.ms-pod.p1 .nm{font-size:32px}
.ms-pod.p2{--pc:#c9d0e0}.ms-pod.p2 .blk{height:140px}.ms-pod.p3{--pc:#ff9a3c}.ms-pod.p3 .blk{height:100px}
.ms-pod.p1 .av{animation:novaBob 1.2s ease-in-out infinite}
.ms-rest-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px 16px;width:min(760px,100%)}
.ms-rest-list li{display:flex;justify-content:space-between;font-size:16px;background:rgba(10,8,34,.86);padding:4px 12px}.ms-rest-list b{color:#ffd34d}

/* ---------- phone ---------- */
.ms-phone{width:min(520px,96vw);margin-top:2vh}
.ms-pcard{background:rgba(9,7,32,.94);padding:20px;border-top:4px solid #5ff3ff;text-align:center}
.ms-pcard .ms-qtop{text-align:left}
.ms-pic{display:flex;justify-content:center}.ms-pic svg{width:96px;height:96px;animation:novaBob 1.6s ease-in-out infinite}
.ms-ptxt{font-size:24px;line-height:32px;color:var(--ink-2);margin-top:16px}.ms-ptxt b{color:#fff}
.ms-pwait{font-size:16px;color:var(--ink-3);margin-top:16px;letter-spacing:1px}
.ms-pq{font-weight:700;font-size:32px;line-height:40px;color:#fff;margin-top:12px;text-align:left}
.ms-pq.sm{font-size:24px;line-height:32px;font-weight:400;text-align:center;color:var(--ink-2)}
.ms-pcard .ms-hint{text-align:left}
.ms-form{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.ms-form .btn{min-height:56px;font-size:24px}
.ms-msg{min-height:24px;font-size:16px;color:#ff8fc8}
.ms-locked .ms-pstar{display:flex;justify-content:center;margin:8px 0 12px}.ms-locked .ms-pstar svg{animation:orbitDot 6s linear infinite;filter:drop-shadow(0 0 16px rgba(255,211,77,.8))}
.ms-pans{font-size:32px;line-height:40px;color:#fff;margin-top:8px;word-break:break-word}
.ms-wait{display:flex;justify-content:center;gap:16px;margin-top:24px}
.ms-wait span{width:12px;height:12px;background:#5ff3ff;box-shadow:0 0 10px #5ff3ff;animation:msTw 1.2s steps(2) infinite}
.ms-wait span:nth-child(2){animation-delay:.2s;background:#ff5fb4;box-shadow:0 0 10px #ff5fb4}.ms-wait span:nth-child(3){animation-delay:.4s;background:#ffd34d;box-shadow:0 0 10px #ffd34d}.ms-wait span:nth-child(4){animation-delay:.6s}.ms-wait span:nth-child(5){animation-delay:.8s;background:#c07cff;box-shadow:0 0 10px #c07cff}
@keyframes msTw{50%{opacity:.2;transform:scale(.5)}}
.ms-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.ms-stats div{background:#0e0b34;padding:12px 4px}.ms-stats b{display:block;font-weight:700;font-size:32px;color:#ffd34d}.ms-stats span{font-size:16px;color:var(--ink-3)}
.ms-sum.t-nova,.ms-fin.t-nova{border-top-color:var(--t-nova)}.ms-sum.t-deep,.ms-fin.t-deep{border-top-color:var(--t-deep)}.ms-sum.t-orbit,.ms-fin.t-orbit{border-top-color:var(--t-orbit)}.ms-sum.t-strato,.ms-fin.t-strato{border-top-color:var(--t-strato)}.ms-sum.t-junk{border-top-color:var(--t-junk)}.ms-sum.t-pad{border-top-color:var(--t-pad)}
.ms-rank{font-weight:700;font-size:88px;line-height:1;margin-top:12px;color:#fff;text-shadow:-4px 0 #ff3d9a,4px 0 #2ef0ff,0 0 30px rgba(95,243,255,.6)}
.ms-rank small{font-size:24px;font-weight:400;color:var(--ink-3);margin-left:8px;text-shadow:none}
.ms-ftot{font-size:24px;color:var(--ink-2);margin-top:8px}.ms-ftot b{font-size:48px;color:#ffd34d}
.ms-ftop{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.ms-ftop li{display:grid;grid-template-columns:32px 1fr auto;gap:8px;padding:6px 12px;background:#0e0b34;font-size:16px;text-align:left}.ms-ftop li.me{background:#1a0c36;box-shadow:inset 4px 0 #ff5fb4}.ms-ftop b{color:#ffd34d}

@media (max-width:900px){
  .ms-q{font-size:32px;line-height:40px}.ms-logo{font-size:48px;letter-spacing:6px}
  .ms-rules{grid-template-columns:1fr}.ms-board{left:16px;right:16px;width:auto;top:auto;bottom:88px;max-height:50vh}
  .ms-banner b{font-size:40px}
}
@media (max-width:520px){ .ms-pq{font-size:24px;line-height:32px}.ms-pans{font-size:24px;line-height:32px} }
