/* ============ iOS app inside the phone (378 × 758 pt content area) ============ */
.ap-view{position:absolute;inset:0;display:flex;flex-direction:column;gap:14px;padding:6px 20px 34px;animation:apIn .5s var(--ease) both}
.ap-view.center{align-items:center;justify-content:center;text-align:center}
@keyframes apIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.ap-nav{flex:none;height:40px;display:flex;align-items:center;gap:8px}
.ap-nav b{font-size:17px;font-weight:600;letter-spacing:-.02em}
.ap-pill{margin-left:auto;display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 11px;border-radius:999px;background:var(--ap-fill-3);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.ap-pill.or{background:color-mix(in srgb,var(--ap-orange) 22%,transparent);color:var(--ap-orange)}
.ap-pill.gr{background:color-mix(in srgb,var(--ap-green) 22%,transparent);color:var(--ap-green)}
.ap-lt{font-family:var(--font-display);font-size:31px;line-height:1.1;font-weight:700;letter-spacing:-.02em;margin:0}
.ap-t2{font-family:var(--font-display);font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
.ap-sub{font-size:15px;line-height:1.35;color:var(--cp-text-muted);margin:0}
.ap-sec{font-size:13px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--cp-text-muted);margin:2px 4px -6px}
.ap-group{background:var(--v-card-solid);border-radius:22px;overflow:hidden;flex:none}
.ap-row{display:flex;align-items:center;gap:12px;min-height:50px;padding:8px 16px;font-size:16px}
.ap-row + .ap-row{box-shadow:inset 0 1px 0 var(--ap-sep)}
.ap-row small{display:block;font-size:13px;color:var(--cp-text-muted)}
.ap-row .chev{margin-left:auto;color:var(--ap-gray2)}
.ap-ico{flex:none;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--c,var(--ap-blue));color:var(--ap-white)}
.ap-field{flex:none;height:52px;border-radius:14px;background:var(--v-card-solid);display:flex;align-items:center;padding:0 16px;font-size:18px;font-weight:600;gap:8px}
.ap-field .ph{color:var(--ap-gray2);font-weight:500}
.caret::after{content:"";display:inline-block;width:2px;height:22px;margin-left:2px;vertical-align:-4px;background:var(--ap-blue);animation:blink 1s steps(2) infinite}
.ap-seg{flex:none;display:grid;grid-template-columns:1fr 1fr;padding:2px;height:36px;border-radius:10px;background:var(--ap-fill-3);position:relative}
.ap-seg span{position:relative;z-index:1;display:grid;place-items:center;font-size:14px;font-weight:600;color:var(--cp-text-soft);transition:color .3s}
.ap-seg span.on{color:var(--cp-text)}
.ap-seg::before{content:"";position:absolute;top:2px;bottom:2px;left:2px;width:calc(50% - 2px);border-radius:8px;background:var(--ap-gray2);box-shadow:var(--ap-shadow-1);transition:transform .35s var(--spring)}
.ap-seg.r::before{transform:translateX(100%)}
.ap-btn{flex:none;height:54px;border-radius:999px;border:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:17px;font-weight:600;background:var(--ap-blue);color:var(--ap-white);box-shadow:inset 0 1px 0 var(--v-white-35),0 8px 20px color-mix(in srgb,var(--ap-blue) 35%,transparent);transition:transform .15s,filter .15s}
.ap-btn.gray{background:var(--ap-fill-2);box-shadow:inset 0 1px 0 var(--v-white-10)}
.ap-btn.green{background:var(--ap-green);box-shadow:inset 0 1px 0 var(--v-white-35),0 8px 20px color-mix(in srgb,var(--ap-green) 35%,transparent)}
.ap-btn.press,.press{transform:scale(.95);filter:brightness(1.15)}
.ap-btn.done{background:var(--ap-green)}
.ap-toggle{flex:none;width:51px;height:31px;border-radius:16px;background:var(--ap-fill);position:relative;transition:background .3s}
.ap-toggle::after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:var(--ap-white);box-shadow:0 3px 8px var(--v-black-40);transition:transform .3s var(--spring)}
.ap-toggle.on{background:var(--ap-green)}
.ap-toggle.on::after{transform:translateX(20px)}
.ap-card{background:var(--v-card-solid);border-radius:22px;padding:14px 16px;flex:none}
.ap-foot{margin-top:auto;display:flex;flex-direction:column;gap:10px}
.ap-note{font-size:13px;color:var(--cp-text-muted);text-align:center}
.ap-chip{display:inline-flex;align-items:center;height:34px;padding:0 13px;border-radius:999px;background:var(--ap-fill-3);font-size:14px;font-weight:600;white-space:nowrap;transition:all .25s}
.ap-chip.on{background:color-mix(in srgb,var(--ap-blue) 28%,transparent);color:var(--cp-link)}
.ap-chips{display:flex;flex-wrap:wrap;gap:7px}

/* get-ready card + teaser */
.ap-ready{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.ap-ready .big{width:112px;height:112px;border-radius:30px;display:grid;place-items:center;background:color-mix(in srgb,var(--c,var(--ap-blue)) 24%,transparent);color:var(--c,var(--ap-blue))}
.ap-dots{display:flex;gap:7px}
.ap-dots i{width:8px;height:8px;border-radius:50%;background:var(--ap-gray2);animation:blink 1.2s infinite}
.ap-dots i:nth-child(2){animation-delay:.2s}
.ap-dots i:nth-child(3){animation-delay:.4s}
.ap-teaser{width:100%;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:20px;background:var(--ap-glass);box-shadow:inset 0 0 0 1px var(--ap-glass-stroke);text-align:left}
.ap-teaser small{display:block;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ap-yellow)}
.ap-teaser b{display:block;font-size:16px}

/* slot machine */
.ap-slot{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;border-radius:24px;background:var(--v-card-solid);box-shadow:inset 0 0 0 1px var(--v-hairline)}
.ap-reel-l{font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--cp-text-muted);text-align:center;margin-bottom:6px}
.ap-reel{position:relative;height:78px;border-radius:14px;overflow:hidden;background:var(--ap-black);box-shadow:inset 0 0 0 1px var(--v-hairline-2)}
.ap-reel::before,.ap-reel::after{content:"";position:absolute;left:0;right:0;height:18px;z-index:2;pointer-events:none}
.ap-reel::before{top:0;background:linear-gradient(var(--ap-black),transparent)}
.ap-reel::after{bottom:0;background:linear-gradient(transparent,var(--ap-black))}
.ap-reel-in{position:absolute;left:0;right:0;top:0;transition:transform 2.2s cubic-bezier(.12,.82,.2,1.02)}
.ap-reel-in div{height:78px;display:grid;place-items:center;text-align:center;font-size:16px;font-weight:700;line-height:1.15;padding:0 8px}
.ap-combo{min-height:64px;text-align:center;font-family:var(--font-display);font-size:22px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.ap-combo .x{color:var(--ap-yellow);margin:0 6px}

/* sketch */
.ap-canvas{position:relative;flex:1;min-height:0;border-radius:26px;background:var(--v-paper);display:grid;place-items:center;overflow:hidden}
.ap-canvas .doodle{width:78%;height:78%}
.ap-canvas small{position:absolute;left:0;right:0;bottom:12px;text-align:center;font-size:12.5px;font-weight:600;color:var(--v-ink-2)}
.ap-tools{flex:none;display:flex;align-items:center;justify-content:center;gap:12px;height:48px;border-radius:999px;background:var(--ap-glass);box-shadow:inset 0 0 0 1px var(--ap-glass-stroke)}
.ap-sw{width:26px;height:26px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2px var(--v-card-solid)}
.ap-sw.on{box-shadow:0 0 0 2px var(--v-card-solid),0 0 0 4px var(--ap-white)}
.ap-tools .sym{color:var(--cp-text-soft)}
.ap-prob{font-size:14px;color:var(--cp-text-muted)}
.ap-prob b{color:var(--cp-text);font-weight:600}

/* describe */
.ap-text{flex:none;min-height:118px;border-radius:20px;background:var(--v-card-solid);padding:14px 16px;font-size:19px;line-height:1.35;font-weight:600}
.ap-mic{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--ap-fill-3);color:var(--ap-blue);flex:none}
.ap-mic.rec{background:var(--ap-red);color:var(--ap-white);box-shadow:0 0 0 8px color-mix(in srgb,var(--ap-red) 25%,transparent)}
.ap-microw{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--cp-text-muted)}
.ap-wave{display:flex;align-items:center;gap:3px;height:28px}
.ap-wave i{width:4px;border-radius:2px;background:var(--ap-blue);animation:wv .9s ease-in-out infinite}
@keyframes wv{50%{transform:scaleY(.35)}}

/* glow-up */
.ap-glow{display:grid;grid-template-columns:1fr 30px 1fr;align-items:center;gap:6px}
.ap-before,.ap-after{position:relative;aspect-ratio:1;border-radius:24px;display:grid;place-items:center;overflow:visible}
.ap-before{background:var(--v-paper)}
.ap-before .doodle{width:78%;height:78%}
.ap-after{background:var(--v-card-solid)}
.ap-after .lt{animation:glowIn 1.1s var(--spring) both;animation-delay:var(--gd,1.2s)}
@keyframes glowIn{from{opacity:0;transform:scale(.3) rotate(-25deg);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
.ap-tag{position:absolute;top:-10px;left:-4px;font-size:10.5px;font-weight:800;letter-spacing:.08em;padding:3px 8px;border-radius:7px;background:var(--ap-gray2);color:var(--ap-white);z-index:4}
.ap-tag.b{background:var(--ap-blue)}
.ap-name{font-family:var(--font-display);font-size:34px;font-weight:800;letter-spacing:.06em;text-align:center;line-height:1;min-height:34px}
.ap-tagline{font-size:15px;color:var(--cp-text-soft);text-align:center;margin-top:-6px}
.ap-mini{border-radius:20px;background:var(--v-card-solid);overflow:hidden;font-size:13px;flex:none}
.ap-mini .mh{display:flex;align-items:center;gap:8px;padding:9px 12px;font-weight:700;background:color-mix(in srgb,var(--c,var(--ap-pink)) 26%,var(--v-card-solid))}
.ap-mini .mh span{margin-left:auto;font-weight:600;color:var(--cp-text-soft)}
.ap-mini .ln{display:flex;align-items:center;gap:8px;padding:8px 12px;box-shadow:inset 0 -1px 0 var(--ap-sep)}
.ap-mini .mapw{height:62px;position:relative;background:var(--v-card-2)}
.ap-mini .mapw svg{position:absolute;inset:0;width:100%;height:100%}
.ap-mini .cta{margin:9px 12px 11px;padding:9px;border-radius:999px;text-align:center;font-weight:700;background:var(--c,var(--ap-pink));color:var(--ap-white)}
.mgrid{stroke:var(--v-hairline-2);stroke-width:1}
.mroute{fill:none;stroke:var(--ap-pink);stroke-width:3;stroke-dasharray:6 5;animation:dash 1s linear infinite}
.mdot{fill:var(--ap-pink)}
.mdot2{fill:var(--ap-green)}
@keyframes dash{to{stroke-dashoffset:-22}}

/* duels */
.ap-duel{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0;justify-content:center}
.ap-dcard{position:relative;display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;padding:14px;border-radius:24px;background:var(--v-card-solid);box-shadow:inset 0 0 0 2px transparent;transition:all .35s var(--ease);animation:rise .45s var(--ease) both}
.ap-dcard b{display:block;font-size:18px;font-weight:800;letter-spacing:.05em}
.ap-dcard small{display:block;font-size:13.5px;line-height:1.3;color:var(--cp-text-soft);margin-top:2px}
.ap-dcard.pick{box-shadow:inset 0 0 0 3px var(--ap-green);transform:scale(1.02)}
.ap-dcard.pick::after{content:"✓";position:absolute;right:12px;top:10px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--ap-green);color:var(--ap-white);font-weight:800;font-size:14px}
.ap-dcard.lose{opacity:.35;transform:scale(.97)}
.ap-vs{align-self:center;font-family:var(--font-display);font-size:15px;font-weight:800;color:var(--cp-text-muted);letter-spacing:.1em}
.ap-prog{display:flex;gap:4px}
.ap-prog i{flex:1;height:5px;border-radius:3px;background:var(--ap-fill-2)}
.ap-prog i.on{background:var(--ap-blue)}

/* vote & react */
.ap-vote{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ap-vbtn{height:96px;border-radius:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:22px;font-weight:800;transition:all .3s var(--ease)}
.ap-vbtn.in{background:color-mix(in srgb,var(--ap-green) 22%,transparent);color:var(--ap-green)}
.ap-vbtn.out{background:color-mix(in srgb,var(--ap-red) 20%,transparent);color:var(--ap-red)}
.ap-vbtn.sel{box-shadow:inset 0 0 0 3px currentColor;transform:scale(1.03)}
.ap-react{display:flex;justify-content:space-around;align-items:center;height:62px;border-radius:999px;background:var(--ap-glass);box-shadow:inset 0 0 0 1px var(--ap-glass-stroke);font-size:30px}
.ap-react span{transition:transform .2s}
.ap-react span.hit{transform:scale(1.4) translateY(-6px)}
.ap-meter{height:30px;border-radius:999px;overflow:hidden;display:flex;background:color-mix(in srgb,var(--ap-red) 30%,var(--v-card-solid));font-size:13px;font-weight:800}
.ap-meter i{display:flex;align-items:center;padding-left:12px;background:var(--ap-green);color:var(--ap-black);font-style:normal;transition:width .8s var(--ease)}
.ap-mascot{display:flex;align-items:center;gap:12px;padding:12px;border-radius:22px;background:var(--v-card-solid)}
.ap-mascot b{display:block;font-size:17px}
.ap-mascot small{display:block;font-size:13px;color:var(--cp-text-muted)}

/* notification + mail */
.ap-notif{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:12px 14px;border-radius:24px;background:var(--ap-glass);box-shadow:inset 0 0 0 1px var(--ap-glass-stroke),var(--ap-shadow-2);backdrop-filter:blur(20px);animation:notif .6s var(--spring) both;animation-delay:calc(var(--d,0)*1ms)}
.ap-notif b{display:block;font-size:14.5px}
.ap-notif small{display:block;font-size:13.5px;color:var(--cp-text-soft);line-height:1.3}
.ap-notif .when{float:right;font-size:12px;color:var(--cp-text-muted);font-weight:500}
@keyframes notif{from{opacity:0;transform:translateY(-40px) scale(.96)}to{opacity:1;transform:none}}
.ap-win{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.ap-trophy{width:96px;height:96px;border-radius:28px;display:grid;place-items:center;background:color-mix(in srgb,var(--ap-yellow) 22%,transparent);color:var(--ap-yellow);animation:bob 2s ease-in-out infinite}
.ap-list{display:flex;flex-direction:column;gap:8px}
.ap-li{display:grid;grid-template-columns:30px 1fr;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;background:var(--v-card-solid);font-size:14px;line-height:1.3;animation:rise .45s var(--ease) both;animation-delay:calc(var(--d,0)*1ms)}
.ap-li .sym{color:var(--c,var(--ap-blue))}
.ap-li .plogo{width:26px;height:26px}
/* ============ v3: seed round, turning point, portfolio ============ */
.ph-wallet{flex:none;display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:22px;background:color-mix(in srgb,var(--ap-green) 14%,var(--v-card-solid));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ap-green) 40%,transparent)}
.ph-wallet > span:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.ph-wallet small{font-size:12.5px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--cp-text-muted)}
.ph-wallet b{font-family:var(--font-rounded);font-size:30px;font-weight:800;color:var(--ap-green);font-variant-numeric:tabular-nums}
.ph-wbar{height:8px;border-radius:4px;background:var(--ap-fill-3);overflow:hidden}
.ph-wbar i{display:block;height:100%;border-radius:4px;background:var(--ap-green);transition:width .35s var(--ease)}
.ph-wallet .ph-wsub{text-transform:none;letter-spacing:0;font-weight:500;font-size:12.5px}
.ph-mine{flex:none;display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:16px;background:var(--v-card-solid);font-size:14px;color:var(--cp-text-soft)}
.ph-mine b{color:var(--cp-text)}
.ph-mine .sym{color:var(--ap-green)}
.ph-deals{display:flex;flex-direction:column;gap:10px}
.ph-deal{display:grid;grid-template-columns:50px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-radius:20px;background:var(--v-card-solid);transition:box-shadow .3s}
.ph-deal.in{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--ap-green) 70%,transparent)}
.ph-dt{min-width:0}
.ph-dt b{display:block;font-size:16px;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-dt small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12.5px;line-height:1.3;color:var(--cp-text-muted)}
.ph-step{display:flex;align-items:center;gap:2px;border-radius:14px;background:var(--ap-fill-3);padding:3px}
.ph-step button{appearance:none;border:0;width:38px;height:38px;border-radius:11px;background:var(--v-card-2);color:var(--cp-text);font-size:22px;font-weight:600;line-height:1;cursor:pointer}
.ph-step button:last-child{background:var(--ap-green);color:var(--ap-black)}
.ph-step button:disabled{opacity:.35}
.ph-step button.press{transform:scale(.92)}
.ph-step b{min-width:52px;text-align:center;font-family:var(--font-rounded);font-size:15px;font-variant-numeric:tabular-nums}
.ph-push{flex:none;grid-template-columns:40px 1fr}
.ph-pic{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--ap-red);font-size:22px}
.ph-push b{color:var(--ap-red);letter-spacing:.06em}
.ph-ev{display:flex;flex-direction:column;gap:6px}
.ph-ev > span{font-size:44px;line-height:1}
.ph-opts{display:flex;flex-direction:column;gap:10px}
.ph-opt{appearance:none;border:0;text-align:left;display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:center;padding:14px 16px;border-radius:20px;background:var(--v-card-solid);color:var(--cp-text);cursor:pointer;transition:box-shadow .25s,transform .15s}
.ph-opt .e{font-size:32px;line-height:1}
.ph-opt b{display:block;font-size:17px}
.ph-opt small{display:block;font-size:13px;color:var(--cp-text-muted)}
.ph-opt.sel{box-shadow:inset 0 0 0 3px var(--ap-orange);background:color-mix(in srgb,var(--ap-orange) 14%,var(--v-card-solid))}
.ph-opt:active{transform:scale(.98)}
.ph-res{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;margin-top:30px}
.ph-res small{font-size:15px;color:var(--cp-text-soft)}
.ph-res b{font-family:var(--font-rounded);font-size:76px;font-weight:800;line-height:1.05;animation:pop .6s var(--spring) both}
.ph-res.up b{color:var(--ap-green)}
.ph-res.down b{color:var(--ap-red)}
.ph-res span{font-size:14px;color:var(--cp-text-muted)}
.ph-pf{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:12px 16px;border-radius:20px;background:var(--v-card-solid);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ap-green) 40%,transparent)}
.ph-pf .sym{color:var(--ap-green)}
.ph-pf small{display:block;font-size:12px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--cp-text-muted)}
.ph-pf b{display:block;font-family:var(--font-rounded);font-size:22px;font-weight:800}
.ph-pf em{font-style:normal;font-family:var(--font-rounded);font-size:18px;font-weight:800}
.ph-pf.up em{color:var(--ap-green)}
.ph-pf.down em{color:var(--ap-red)}
.ph-pf.down{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ap-red) 40%,transparent)}

/* ============ v3.2: locked until the host starts the clock ============ */
.ph-veil{position:fixed;inset:0;z-index:40;touch-action:none}
.ph-veil.ready{background:rgba(0,0,0,.32)}
.ph-vbar{position:absolute;left:50%;bottom:calc(26px + env(safe-area-inset-bottom));translate:-50% 0;display:flex;align-items:center;gap:12px;padding:12px 20px 12px 16px;border-radius:999px;white-space:nowrap;background:var(--ap-glass);backdrop-filter:blur(24px) saturate(180%);box-shadow:inset 0 0 0 1px var(--ap-glass-stroke),var(--ap-shadow-3);animation:rise .4s var(--ease) both}
.ph-vbar .sym{color:var(--ap-yellow);animation:blink 1.6s ease-in-out infinite}
.ph-vbar b{display:block;font-size:16px}
.ph-vbar small{display:block;font-size:12.5px;color:var(--cp-text-soft)}
.ph-veil.count{display:grid;place-items:center;background:rgba(0,0,0,.6);backdrop-filter:blur(3px)}
.ph-veil.go{pointer-events:none}
.ph-vnum{font-family:var(--font-rounded);font-size:150px;font-weight:800;line-height:1;color:var(--ap-white);animation:cdPop .55s var(--spring) both}
@keyframes cdPop{from{transform:scale(.5);opacity:0}to{transform:none;opacity:1}}