/* Animated feature cards, taken from the deployed site's rail (styles.css + the mist palette)
   and scoped under .portal .track so they cannot clash with the portal styles. */
.portal .track{--ink:#101415;--teal:#2A9D8F;--orange:#C65D1E;--card:#2B3844;--inset:rgba(255,255,255,.09);--mute-w:#B6C1C8}
.portal .track .card{position:relative;flex:0 0 min(86vw,470px);height:min(82vh,700px);min-height:630px;border-radius:30px;padding:32px 30px;color:#fff;overflow:hidden;scroll-snap-align:start;display:flex;flex-direction:column;background:var(--bg);isolation:isolate}
.portal .track .card::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(75% 55% at 85% 95%,var(--glow),transparent 70%),radial-gradient(55% 40% at 0% 60%,var(--glow2,transparent),transparent 70%)}
.portal .track .card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.5),transparent 40%),radial-gradient(rgba(255,255,255,.13) 1px,transparent 1.6px) 0 0/22px 22px}
.portal .track .card h3{font-weight:300;font-size:clamp(1.875rem,2.7vw,2.5rem);line-height:1.04;letter-spacing:-.025em;max-width:10ch}
.portal .track .f-emerg{--bg:#5a2508;--glow:rgba(198,93,30,.85);--glow2:rgba(255,170,100,.18)}
.portal .track .f-dai{--bg:#0a2926;--glow:rgba(42,157,143,.6)}
.portal .track .f-comm{--bg:#14504a;--glow:rgba(120,230,214,.4);--glow2:rgba(255,255,255,.1)}
.portal .track .f-sleep{--bg:#09202a;--glow:rgba(70,140,170,.42);--glow2:rgba(42,157,143,.25)}
.portal .track .f-ai{--bg:#14191b;--glow:rgba(42,157,143,.5);--glow2:rgba(198,93,30,.3)}
.portal .track .f-share{--bg:#10262a;--glow:rgba(198,93,30,.5);--glow2:rgba(42,157,143,.35)}
.portal .track .card::after{background:linear-gradient(180deg,rgba(0,0,0,.5),transparent 32%),linear-gradient(0deg,rgba(0,0,0,.5),transparent 38%),radial-gradient(rgba(255,255,255,.13) 1px,transparent 1.6px) 0 0/22px 22px}
.portal .track .card h3{max-width:12ch}
.portal .track .tag{align-self:flex-start;margin-bottom:12px;padding:4px 11px;border-radius:20px;background:rgba(255,255,255,.16);font-size:0.6875rem;font-weight:800;letter-spacing:.16em}
.portal .track .viz{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;margin:14px 0 16px}
.portal .track .viz>svg{display:block;width:100%;height:auto;max-height:100%;overflow:visible}
.portal .track .lbl text{paint-order:stroke;stroke:rgba(0,0,0,.4);stroke-width:3px}
.portal .track .flow{stroke-dasharray:4 6;animation:dash 1.4s linear infinite}
@keyframes dash{to{stroke-dashoffset:-20}}
.portal .track .cap{position:relative;z-index:2}
.portal .track .cap p{margin:0 0 14px;font-weight:300;font-size:1.0312rem;line-height:1.5;color:rgba(255,255,255,.9)}
.portal .track .explore{display:inline-block;padding-bottom:3px;border-bottom:1px solid rgba(255,255,255,.7);font-size:0.7812rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;transition:color .2s,border-color .2s}
.portal .track .explore::after{content:" \2192";transition:margin .2s}
.portal .track .explore:hover{color:#5fe3d3;border-color:#5fe3d3}
.portal .track .explore:hover::after{margin-left:4px}
.portal .track .dai-wrap{width:100%}
.portal .track .dai{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.portal .track .dm{padding:18px 16px;border-radius:20px;background:rgba(0,0,0,.3)}
.portal .track .dm label{display:block;font-size:0.6875rem;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.65)}
.portal .track .dm b{display:block;margin:8px 0 0;font-size:clamp(2.125rem,3.4vw,2.75rem);font-weight:300;line-height:1;letter-spacing:-.03em}
.portal .track .dm b small{margin-left:4px;font-size:0.9375rem;font-weight:700;letter-spacing:0}
.portal .track .dm .bar{position:relative;height:6px;margin:18px 0 12px;border-radius:4px;background:rgba(255,255,255,.18)}
.portal .track .dm .bar i{display:block;height:100%;width:var(--w);border-radius:4px;background:#5fe3d3;animation:grow 1.4s ease both}
.portal .track .dm .bar u{position:absolute;top:-5px;left:var(--avg);width:2px;height:16px;background:#fff}
.portal .track .dm .delta{font-size:0.75rem;color:rgba(255,255,255,.75)}
.portal .track .dm .delta em{font-style:normal;font-weight:800;color:#5fe3d3}
.portal .track .legend{display:flex;align-items:center;gap:8px;margin:14px 2px 0;font-size:0.6875rem;color:rgba(255,255,255,.65)}
.portal .track .legend u{display:inline-block;width:2px;height:12px;background:#fff}
@keyframes grow{from{width:0}}
.portal .track .pat{width:100%;display:grid;gap:10px}
.portal .track .sl{padding:14px 16px 10px;border-radius:20px;background:rgba(0,0,0,.3)}
.portal .track .sl-h{display:flex;justify-content:space-between;align-items:baseline}
.portal .track .sl-h b{font-size:2.125rem;font-weight:300;letter-spacing:-.02em}
.portal .track .sl-h span{font-size:0.6875rem;font-weight:800;letter-spacing:.14em;color:rgba(255,255,255,.65)}
.portal .track .sl svg{display:block;width:100%;height:auto;margin:6px 0 4px}
.portal .track .sl-t{display:flex;justify-content:space-between;font-size:0.625rem;color:rgba(255,255,255,.55)}
.portal .track .mini{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.portal .track .mini div{padding:10px 11px;border-radius:14px;background:rgba(0,0,0,.3)}
.portal .track .mini b{display:block;font-size:1.1875rem;font-weight:700;line-height:1.2}
.portal .track .mini span{font-size:0.6562rem;color:rgba(255,255,255,.7)}
.portal .track .chat{width:100%;display:grid;gap:10px}
.portal .track .topics{display:flex;gap:6px;flex-wrap:wrap}
.portal .track .topics span{padding:4px 10px;border-radius:20px;border:1px solid rgba(255,255,255,.3);font-size:0.625rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.portal .track .msg{max-width:90%;padding:12px 14px;border-radius:18px 18px 18px 6px;background:rgba(255,255,255,.12);font-size:0.875rem;line-height:1.4}
.portal .track .msg.me{justify-self:end;background:#fff;color:var(--ink);border-radius:18px 18px 6px 18px;font-weight:600}
.portal .track .qr{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.portal .track .qr span{padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.4);font-size:0.75rem;font-weight:700}
.portal .track .qr span.on{background:var(--teal);border-color:var(--teal)}
.portal .track .msg.appt{display:flex;gap:12px;align-items:center;background:rgba(42,157,143,.28)}
.portal .track .msg.appt .d{flex:none;width:44px;padding:5px 0;border-radius:10px;background:#fff;color:var(--ink);text-align:center;line-height:1.1}
.portal .track .msg.appt .d small{display:block;font-size:0.5625rem;font-weight:800;color:var(--orange)}
.portal .track .msg.appt .d b{font-size:1.125rem}
.portal .track .msg.appt p{margin:0;font-size:0.875rem}
.portal .track .msg.appt p span{display:block;font-size:0.75rem;color:rgba(255,255,255,.7)}
/* motion */
.portal .track .card:not(.on-screen) *{animation-play-state:paused!important}
.portal .track .f-dai .dm .bar i{transform-origin:left;animation:dai-bar 7s ease-out infinite}
.portal .track .f-dai .dm .bar u{animation:dai-mark 7s ease-out infinite}
.portal .track .f-dai .dm .delta{animation:dai-delta 7s ease-out infinite}
.portal .track .f-dai .dm:nth-child(2) .bar i,.portal .track .f-dai .dm:nth-child(2) .bar u,.portal .track .f-dai .dm:nth-child(2) .delta{animation-delay:.3s}
@keyframes dai-bar{0%{transform:scaleX(0)}20%,88%{transform:scaleX(1)}97%,100%{transform:scaleX(0)}}
@keyframes dai-mark{0%,14%{opacity:0}24%,88%{opacity:1}97%,100%{opacity:0}}
@keyframes dai-delta{0%,22%{opacity:0;transform:translateY(5px)}30%,88%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(5px)}}
.portal .track .f-sleep .mini div{animation:mini-pop 9s ease-out infinite}
.portal .track .f-sleep .mini div:nth-child(2){animation-delay:.15s}
.portal .track .f-sleep .mini div:nth-child(3){animation-delay:.3s}
.portal .track .f-sleep .mini div:nth-child(4){animation-delay:.45s}
@keyframes mini-pop{0%,44%{opacity:.3;transform:translateY(6px)}54%,90%{opacity:1;transform:none}98%,100%{opacity:.3;transform:translateY(6px)}}
.portal .track .f-ai .chat>:nth-child(1){animation:ai-a 13s ease-out infinite}
.portal .track .f-ai .chat>:nth-child(2){animation:ai-b 13s ease-out infinite}
.portal .track .f-ai .chat>:nth-child(3){animation:ai-c 13s ease-out infinite}
.portal .track .f-ai .chat>:nth-child(4){animation:ai-d 13s ease-out infinite}
.portal .track .f-ai .qr{animation:none}
.portal .track .f-ai .qr span.on{animation:ai-tap 13s ease-out infinite}
@keyframes ai-a{0%{opacity:0;transform:translateY(8px)}3%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes ai-b{0%,5%{opacity:0;transform:translateY(8px)}9%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes ai-c{0%,33%{opacity:0;transform:translateY(8px)}37%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes ai-d{0%,50%{opacity:0;transform:translateY(8px)}54%,92%{opacity:1;transform:none}97%,100%{opacity:0;transform:translateY(8px)}}
@keyframes ai-tap{0%,23%{opacity:.5;transform:scale(1)}26%{opacity:1;transform:scale(.92)}31%,100%{opacity:1;transform:scale(1)}}
/* mist palette */
.portal .track .f-dai{--bg:#3F7A92;--glow:rgba(201,225,232,.55);--glow2:rgba(247,249,248,.18)}
.portal .track .f-sleep{--bg:#2F5568;--glow:rgba(127,175,194,.55);--glow2:rgba(201,225,232,.25)}
.portal .track .f-comm{--bg:#4C829A;--glow:rgba(247,249,248,.42);--glow2:rgba(201,225,232,.3)}
.portal .track .f-emerg{--bg:#9A6A2A;--glow:rgba(248,246,241,.4);--glow2:rgba(242,200,121,.3)}
.portal .track .f-ai{--bg:#34424F;--glow:rgba(127,175,194,.55);--glow2:rgba(184,122,30,.28)}
.portal .track .f-share{--bg:#456F85;--glow:rgba(201,225,232,.5);--glow2:rgba(184,122,30,.22)}
.portal .track .card [stroke="#5FE3D3" i]{stroke:#C9E1E8}
.portal .track .card [fill="#5FE3D3" i]{fill:#C9E1E8}
.portal .track .card [stop-color="#5FE3D3" i]{stop-color:#C9E1E8}
.portal .track .card [stroke="#2A9D8F" i]{stroke:#7FAFC2}
.portal .track .card [fill="#2A9D8F" i]{fill:#7FAFC2}
.portal .track .card [stop-color="#2A9D8F" i]{stop-color:#7FAFC2}
.portal .track .card [stroke="#FF8A4C" i]{stroke:#F2C879}
.portal .track .card [fill="#FF8A4C" i]{fill:#F2C879}
.portal .track .card [stop-color="#FF8A4C" i]{stop-color:#F2C879}
.portal .track .card [stroke="#C65D1E" i]{stroke:#E0A24A}
.portal .track .card [fill="#C65D1E" i]{fill:#E0A24A}
.portal .track .card [stop-color="#C65D1E" i]{stop-color:#E0A24A}
.portal .track .card [stroke="#f2b84b" i]{stroke:#F2C879}
.portal .track .card [fill="#f2b84b" i]{fill:#F2C879}
.portal .track .card [stop-color="#f2b84b" i]{stop-color:#F2C879}
.portal .track .card [stroke="#14504a" i]{stroke:#3F7A92}
.portal .track .card [fill="#14504a" i]{fill:#3F7A92}
.portal .track .card [stop-color="#14504a" i]{stop-color:#3F7A92}
.portal .track .card [stroke="#0F1516" i]{stroke:#2B3844}
.portal .track .card [fill="#0F1516" i]{fill:#2B3844}
.portal .track .card [stop-color="#0F1516" i]{stop-color:#2B3844}
.portal .track .card [stroke="#6fe0d1" i]{stroke:#F7F9F8}
.portal .track .card [fill="#6fe0d1" i]{fill:#F7F9F8}
.portal .track .card [stop-color="#6fe0d1" i]{stop-color:#F7F9F8}
.portal .track .card [stroke="#14564e" i]{stroke:#3F7A92}
.portal .track .card [fill="#14564e" i]{fill:#3F7A92}
.portal .track .card [stop-color="#14564e" i]{stop-color:#3F7A92}
/* sizing for the narrower portal carousel */
.portal .track .card{flex:none;width:100%;height:100%;min-height:450px;padding:24px 22px;border-radius:20px}
.portal .track .card h3{font-weight:500;font-size:1.375rem;line-height:1.15;letter-spacing:-.01em;max-width:none}
.portal .track .cap p{font-size:0.875rem;line-height:1.45;margin-bottom:12px}
.portal .track .viz{margin:10px 0 12px}
.portal .track .explore{font-size:0.7188rem;color:#fff}
.portal .track .dm b{font-size:1.875rem}
.portal .track .dm{padding:14px 12px}
.portal .track .sl-h b{font-size:1.625rem}
.portal .track .msg{font-size:0.8125rem;padding:10px 12px}
@media (prefers-reduced-motion:reduce){.portal .track .card *{animation:none!important}}