/* Prova app screens: shared by the product pages. Figma: B+B, Mobile app Experience 03 and the HCA record screen. */
.phone-wrap{display:grid;place-items:center}
.phone{position:relative;width:min(320px,78vw);aspect-ratio:320/660;border-radius:54px;background:#050506;box-shadow:inset 0 0 0 10px #1c1c20,inset 0 0 0 11px #3a3a40,0 0 0 1px #2a2a2e,0 60px 120px -30px rgba(125,78,239,.45),0 30px 60px -20px rgba(0,0,0,.8);padding:16px;overflow:hidden}
.island{position:absolute;z-index:3;top:23px;left:50%;transform:translateX(-50%);width:30%;height:4.4%;border-radius:20px;background:#000}
/* ---------- Prova app screens (Figma: B+B / Mobile app Experience 03 and HCA record screen) ----------
   Every size is in Figma px on the 430 px frame, scaled to the phone with --p. */
.phone{width:min(360px,84vw);aspect-ratio:320/660;border-radius:58px;padding:15px}
.screen{position:absolute;inset:15px;border-radius:44px;overflow:hidden;background:var(--ui-ground);padding:0;display:block;container-type:inline-size;box-shadow:inset 0 0 0 1px var(--ui-line);animation:scr .5s var(--ease)}
.screen[hidden]{display:none}
@keyframes scr{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
.island{top:23px;width:30%;height:4.4%}
.app{--p:calc(100cqw / 430);position:absolute;inset:0;color:var(--ui-text);font-size:calc(14*var(--p));line-height:1.43;letter-spacing:0;font-weight:400;overflow:hidden}
.app *{letter-spacing:inherit}
.app .ic{width:calc(24*var(--p));height:calc(24*var(--p));flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.app .num{font-variant-numeric:tabular-nums}
.app .sig{color:var(--ui-signal)}.app .lil{color:var(--ui-lilac)}.app .amb{color:var(--ui-amber)}
.app em{font-style:normal}
.a-sp{flex:1 1 0;min-width:0}
.a-row{display:flex;align-items:center;gap:calc(8*var(--p));min-width:0}
.a-sb{position:absolute;left:calc(27*var(--p));right:calc(29*var(--p));top:0;height:calc(44*var(--p));display:flex;align-items:center;justify-content:space-between;font-size:calc(14*var(--p))}
.a-sys{display:flex;align-items:center;gap:calc(3*var(--p))}
.a-sys i{width:calc(3.5*var(--p));height:calc(3.5*var(--p));border-radius:50%;background:var(--ui-text)}
.a-sys b{width:calc(16*var(--p));height:calc(7*var(--p));border-radius:calc(2*var(--p));background:var(--ui-text);margin-left:calc(9*var(--p))}
.a-hd{position:absolute;left:calc(23*var(--p));right:calc(25*var(--p));top:calc(43*var(--p));height:calc(60*var(--p));display:flex;align-items:center;gap:calc(12*var(--p))}
.a-back{color:var(--ui-silver)}
.a-id{font-size:calc(24*var(--p));line-height:calc(28*var(--p));font-weight:500}
.a-sample{font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-silver)}
.a-ct{position:absolute;left:calc(23*var(--p));right:calc(25*var(--p));top:calc(115*var(--p));display:flex;flex-direction:column;gap:calc(12*var(--p))}
.a-idn{display:flex;align-items:center;gap:calc(12*var(--p))}
.a-idn>div{flex:1;min-width:0}
.a-t{margin:0;font-size:calc(24*var(--p));line-height:calc(28*var(--p));font-weight:500;letter-spacing:0}
.a-m{margin:calc(2*var(--p)) 0 0;font-size:calc(14*var(--p));line-height:calc(20*var(--p));color:var(--ui-silver);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.a-pill{display:inline-flex;align-items:center;gap:calc(6*var(--p));height:calc(28*var(--p));padding:0 calc(10*var(--p));border-radius:999px;background:var(--ui-glass);font-size:calc(14*var(--p));white-space:nowrap}
.a-pill i{width:calc(5*var(--p));height:calc(5*var(--p));border-radius:50%;background:currentColor}
.a-eye{margin:0;font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;white-space:nowrap}
.a-card{border-radius:calc(24*var(--p));background:var(--ui-surface);box-shadow:inset 0 0 0 1px var(--ui-line);padding:calc(16*var(--p))}
.a-card.amb{background:rgba(255,181,71,.06);box-shadow:inset 0 0 0 1px rgba(255,181,71,.55);color:inherit;padding:calc(16*var(--p)) calc(18*var(--p))}
.a-status{display:flex;flex-direction:column;gap:calc(10*var(--p))}
.a-metric{display:flex;align-items:flex-end;gap:calc(8*var(--p))}
.a-metric b{font-size:calc(48*var(--p));line-height:calc(52*var(--p));font-weight:300}
.a-metric span{font-size:calc(14*var(--p));line-height:calc(20*var(--p));color:var(--ui-silver);padding-bottom:calc(6*var(--p))}
.a-bar{display:flex;gap:calc(2*var(--p))}
.a-bar i{height:calc(8*var(--p));border-radius:calc(2*var(--p));width:calc(var(--w) * var(--p));background:var(--ui-slate)}
.a-bar i.si{background:var(--ui-silver)}.a-bar i.am{background:var(--ui-amber)}.a-bar i.sg{flex:1;background:var(--ui-signal)}
.a-lbls{font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-silver)}
.a-replay{display:flex;flex-direction:column;gap:calc(12*var(--p))}
.a-h{font-size:calc(15*var(--p));line-height:calc(20*var(--p));font-weight:500}
.a-chips{display:flex;gap:calc(4*var(--p))}
.a-chips span{padding:calc(5*var(--p)) calc(10*var(--p));border-radius:999px;font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-slate)}
.a-chips span.on{background:var(--ui-glass);color:var(--ui-text)}
.a-chart{position:relative}
.a-chart svg{display:block;width:100%;height:auto;overflow:visible}
.a-chart .band{fill:var(--ui-glass)}
.a-chart .lim{stroke:var(--ui-slate);stroke-width:1;stroke-dasharray:4 4;fill:none}
.a-chart .lbl,.a-ivc .lbl{font:500 12px var(--font);fill:var(--ui-slate)}
.a-chart .win{fill:rgba(184,168,255,.14)}.a-chart .ovr{fill:rgba(255,181,71,.24)}
.a-chart .trace{fill:none;stroke:var(--ui-signal);stroke-width:2;stroke-linecap:round}
.a-chart .ticks .m{fill:var(--ui-slate)}.a-chart .ticks .s{fill:var(--ui-signal)}
.a-chart .rail{stroke:var(--ui-line);stroke-width:1.5}
.a-chart .ev.s{fill:var(--ui-signal)}.a-chart .ev.l{fill:var(--ui-lilac)}.a-chart .ev.a{fill:var(--ui-amber)}
.a-chart .now{fill:var(--ui-ground);stroke:var(--ui-signal);stroke-width:1.5}
.a-chart .scrub{stroke:var(--ui-text);stroke-width:1}
.a-chart .pt{fill:var(--ui-text);stroke:var(--ui-signal);stroke-width:2.5}
.a-call{position:absolute;left:27.4%;top:0;display:flex;flex-direction:column;gap:calc(2*var(--p));padding:calc(8*var(--p)) calc(12*var(--p));border-radius:calc(12*var(--p));background:var(--ui-glass);box-shadow:inset 0 0 0 1px var(--ui-line);white-space:nowrap}
.a-call b{font-size:calc(15*var(--p));line-height:calc(20*var(--p));font-weight:500}
.a-call span{font-size:calc(14*var(--p));line-height:calc(20*var(--p))}
.a-call small{font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-slate)}
.a-axis{position:relative;height:calc(16*var(--p));font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-slate)}
.a-axis span{position:absolute;left:0;top:0}.a-axis span.r{left:auto;right:0;color:var(--ui-silver)}
.a-tags{display:flex;flex-wrap:wrap;gap:calc(8*var(--p))}
.a-tag{display:inline-flex;align-items:center;gap:calc(6*var(--p));padding:calc(5*var(--p)) calc(10*var(--p));border-radius:999px;font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;white-space:nowrap}
.a-tag i{width:calc(6*var(--p));height:calc(6*var(--p));border-radius:50%;background:currentColor}
.a-tag.sig{background:rgba(139,123,255,.14)}.a-tag.lil{background:rgba(184,168,255,.14)}.a-tag.amb{background:rgba(255,181,71,.14)}
.a-btn{display:flex;align-items:center;justify-content:center;gap:calc(12*var(--p));height:calc(52*var(--p));border-radius:999px;font-size:calc(15*var(--p));line-height:calc(20*var(--p));font-weight:500;flex:none}
.a-btn.w{background:var(--ui-text);color:var(--ui-ground)}
.a-btn.g{background:var(--ui-glass);box-shadow:inset 0 0 0 1px var(--ui-line);color:var(--ui-text)}
.a-btn.g .ic{color:var(--ui-slate)}
.a-nav{position:absolute;left:calc(23*var(--p));right:calc(25*var(--p));bottom:calc(25*var(--p));height:calc(72*var(--p));border-radius:999px;background:var(--ui-surface);box-shadow:inset 0 0 0 1px var(--ui-line),0 calc(14*var(--p)) calc(15*var(--p)) rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:0 calc(10*var(--p))}
.a-nav span{width:calc(90*var(--p));height:calc(52*var(--p));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(3*var(--p));font-size:calc(14*var(--p));line-height:calc(20*var(--p));color:var(--ui-silver)}
.a-nav span.on{color:var(--ui-signal)}
.a-big{margin:0;font-size:calc(32*var(--p));line-height:calc(38*var(--p));font-weight:300;letter-spacing:-.005em}
.a-big.c,.a-body.c,.a-foot.c{text-align:center}
.a-body{margin:0;font-size:calc(16*var(--p));line-height:calc(24*var(--p));color:var(--ui-silver)}
.a-foot{margin:0;font-size:calc(14*var(--p));line-height:calc(20*var(--p));color:var(--ui-slate)}
/* screen 0: sheet over Pulse */
.a-under{position:absolute;inset:0;filter:brightness(.34)} /* incidental background text behind the sheet (WCAG 1.4.3 exception) */
.a-hd.home .a-word{width:calc(104*var(--p));height:calc(23*var(--p));color:var(--ui-text)}
.a-round{width:calc(44*var(--p));height:calc(44*var(--p));border-radius:50%;background:var(--ui-glass);display:grid;place-items:center;color:var(--ui-silver)}
.a-stats{position:absolute;left:calc(23*var(--p));right:calc(25*var(--p));top:calc(116*var(--p));display:grid;grid-template-columns:1fr 1fr;gap:calc(14*var(--p))}
.a-stats div{height:calc(60*var(--p));border-radius:999px;background:var(--ui-surface);box-shadow:inset 0 0 0 1px var(--ui-line);display:flex;align-items:center;gap:calc(12*var(--p));padding:0 calc(16*var(--p));font-size:calc(16*var(--p));color:var(--ui-silver)}
.a-stats b{font-size:calc(30*var(--p));font-weight:300;line-height:1}
.a-flag{position:absolute;left:calc(23*var(--p));right:calc(25*var(--p));top:calc(188*var(--p));border-radius:calc(24*var(--p));box-shadow:inset 0 0 0 1px rgba(255,181,71,.5);background:rgba(255,181,71,.05);padding:calc(16*var(--p)) calc(18*var(--p))}
.a-flag div{display:flex;flex-direction:column;gap:calc(4*var(--p));padding:calc(12*var(--p)) 0;border-bottom:1px solid var(--ui-line)}
.a-flag b{font-size:calc(16*var(--p));font-weight:500}.a-flag span{font-size:calc(14*var(--p));color:var(--ui-slate)}
.a-sheet{position:absolute;left:calc(10*var(--p));right:calc(10*var(--p));top:calc(328*var(--p));bottom:calc(34*var(--p));border-radius:calc(40*var(--p));background:var(--ui-surface);box-shadow:inset 0 0 0 1px var(--ui-line),0 calc(-20*var(--p)) calc(60*var(--p)) rgba(0,0,0,.6);display:flex;flex-direction:column;align-items:stretch;padding:calc(60*var(--p)) calc(25*var(--p)) calc(24*var(--p));gap:calc(22*var(--p))}
.a-x{position:absolute;top:calc(18*var(--p));right:calc(18*var(--p));width:calc(32*var(--p));height:calc(32*var(--p));border-radius:50%;background:var(--ui-glass);display:grid;place-items:center;color:var(--ui-silver)}
.a-x .ic{width:calc(14*var(--p));height:calc(14*var(--p));stroke-width:1.6}
.a-illo{position:relative;height:calc(236*var(--p));border-radius:calc(24*var(--p));background:#000;overflow:hidden;perspective:calc(700*var(--p))}
.a-plane{position:absolute;left:4%;right:4%;top:22%}
.a-plane img{width:100%;height:auto;filter:drop-shadow(0 calc(18*var(--p)) calc(26*var(--p)) rgba(0,0,0,.75))}
.a-target{position:absolute;right:9%;top:46%;width:30%;aspect-ratio:1;transform:translateY(-50%);border-radius:50%;border:calc(2*var(--p)) dashed var(--ui-signal)}
.a-target i{position:absolute;inset:-2px;border-radius:50%;border:calc(2*var(--p)) solid var(--ui-signal);opacity:0;animation:aTarget 2.6s var(--ease) infinite}
.a-target i:nth-child(2){animation-delay:1.3s}
@keyframes aTarget{0%{transform:scale(.6);opacity:0}30%{opacity:.8}100%{transform:scale(1.7);opacity:0}}
.a-hold{position:absolute;left:calc(18*var(--p));bottom:calc(26*var(--p));font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-signal)}
.a-sheet .a-body{color:var(--ui-text)}
.a-sheet .a-foot{font-size:calc(13*var(--p))}
/* screen 2: review */
.a-ct .a-big{margin-top:calc(14*var(--p))}
.a-ivl{display:flex;flex-direction:column;gap:calc(12*var(--p));padding:calc(18*var(--p)) calc(16*var(--p)) calc(16*var(--p))}
.a-ivc{display:block;width:100%;height:auto;overflow:visible}
.a-ivc .bars rect{fill:var(--ui-signal)}
.a-ivc .mk{stroke:var(--ui-text);stroke-width:1;stroke-dasharray:3 3}
.a-ivc .lbl{fill:var(--ui-amber)}
.a-ivc .tr{fill:var(--ui-silver)}.a-ivc .ta{fill:var(--ui-amber)}
.a-sm{font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-slate)}
.a-q{margin-top:calc(6*var(--p))}.a-q b{font-size:calc(15*var(--p));line-height:calc(20*var(--p));font-weight:500}.a-q span{font-size:calc(14*var(--p));color:var(--ui-silver)}
.a-input{height:calc(52*var(--p));border-radius:calc(16*var(--p));background:var(--ui-glass);box-shadow:inset 0 0 0 1px var(--ui-line);display:flex;align-items:center;padding:0 calc(16*var(--p));font-size:calc(16*var(--p))}
.a-saved{margin:0;display:flex;align-items:center;gap:calc(6*var(--p));font-size:calc(12*var(--p));line-height:calc(16*var(--p));color:var(--ui-slate)}
.a-saved .ic{width:calc(16*var(--p));height:calc(16*var(--p))}
.a-opt{height:calc(52*var(--p));border-radius:calc(14*var(--p));background:var(--ui-surface);box-shadow:inset 0 0 0 1px var(--ui-line);display:flex;align-items:center;gap:calc(12*var(--p));padding:0 calc(16*var(--p));font-size:calc(15*var(--p));font-weight:500;color:var(--ui-silver)}
.a-opt.on{background:rgba(139,123,255,.08);box-shadow:inset 0 0 0 1px var(--ui-signal);color:var(--ui-text)}
.a-radio{width:calc(22*var(--p));height:calc(22*var(--p));border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ui-slate);display:grid;place-items:center}
.a-opt.on .a-radio{background:var(--ui-signal);box-shadow:none;color:var(--ui-ground)}
.a-radio .ic{width:calc(16*var(--p));height:calc(16*var(--p));stroke-width:2}
/* screen 3: record */
.a-tl{padding:calc(14*var(--p)) calc(14*var(--p)) calc(4*var(--p))}
.a-tl ol{list-style:none;margin:0;padding:0}
.a-tl li{position:relative;display:grid;grid-template-columns:calc(44*var(--p)) calc(22*var(--p)) 1fr;padding-bottom:calc(12*var(--p))}
.a-tl li::before{content:"";position:absolute;left:calc(54*var(--p));top:calc(14*var(--p));bottom:calc(-4*var(--p));width:1px;background:var(--ui-line)}
.a-tl li.next::before{display:none}
.a-tl time{font-size:calc(14*var(--p));line-height:calc(20*var(--p));color:var(--ui-silver)}
.a-tl .nd{position:relative;z-index:1;width:calc(10*var(--p));height:calc(10*var(--p));border-radius:50%;margin:calc(5*var(--p)) 0 0 calc(-1*var(--p))}
.a-tl .nd.s{background:var(--ui-signal)}.a-tl .nd.l{background:var(--ui-lilac)}.a-tl .nd.a{background:var(--ui-amber)}
.a-tl .nd.o{box-shadow:inset 0 0 0 1.5px var(--ui-slate)}
.a-tl li>div{display:flex;flex-direction:column;gap:calc(6*var(--p));min-width:0}
.a-tl li .a-row{align-items:flex-start}
.a-tl b{font-size:calc(15*var(--p));line-height:calc(20*var(--p));font-weight:500}
.a-col{display:flex;flex-direction:column;align-items:flex-end;font-size:calc(14*var(--p));line-height:calc(20*var(--p));color:var(--ui-silver);min-width:calc(40*var(--p))}
.a-col small{font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-slate)}
.a-tl li.next time,.a-tl li.next b,.a-tl li.next .a-row>span{color:var(--ui-slate)}
.a-tl li.next .a-row>span{font-size:calc(14*var(--p))}
.a-note{margin-top:calc(4*var(--p));border-radius:calc(12*var(--p));background:rgba(184,168,255,.08);box-shadow:inset calc(2*var(--p)) 0 0 var(--ui-lilac);padding:calc(10*var(--p)) calc(12*var(--p))}
.a-note small{display:block;font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-lilac)}
.a-note p{margin:calc(4*var(--p)) 0;font-size:calc(14*var(--p));line-height:calc(20*var(--p))}
.a-note small.by{color:var(--ui-slate)}
.a-tot{display:flex;align-items:flex-start;gap:calc(16*var(--p));border-top:1px solid var(--ui-line);margin:0 calc(-14*var(--p));padding:calc(12*var(--p)) calc(14*var(--p)) calc(10*var(--p))}
.a-tot small{display:block;font-size:calc(12*var(--p));line-height:calc(16*var(--p));font-weight:500;color:var(--ui-slate)}
.a-tot b{font-size:calc(15*var(--p));line-height:calc(20*var(--p));font-weight:500}
.a-tot .a-col{color:var(--ui-text)}
.a-acts{display:grid;grid-template-columns:1fr 1fr;gap:calc(10*var(--p))}
@media (prefers-reduced-motion:reduce){.a-target i{animation:none}}
@media (max-width:734px){
  .phone{width:min(340px,86vw);border-radius:52px;padding:13px}
  .screen{inset:13px;border-radius:40px}
}
