/* ==========================================================================
   Train Live /analyze - "Movement analysis" (includes/skin/trainlive/analyze.php).
   Source of truth: claude.ai artifact "Train Live Portal", file
   perfoscan/Video Analysis.html (2026-11-11). Loaded AFTER css/landing-trainlive.css,
   which brings the tokens, the top bar, .btn / .btn-ghost, the language picker and the
   footer; everything here is scoped to body.tla (that file styles bare `section`, `h2`
   and `a`). trainlive.it only - perfoscan pages never load this file.

   The script is the shared js/analyze.js, so a few class names are its own: the nodes
   it generates (sk-person*, sk-chip, sk-cntpill, sk-obs*, sk-cue*, sk-metric*), its
   state classes (sk-stage--empty / --crop, sk-paynote--*, sk-fadeout, sk-unblur, .drag,
   .attn, .one) and the modal shell of js/ski-how.js (sk-modal*, body.sk-noscroll).
   ========================================================================== */
.tla{--teal-ink:#0d726e;--green-ink:#177a55;--amber-ink:#8a5a00;--amber-bg:#fff1cf;--violet-ink:#5b3fc4;--violet-bg:#ece8fb;--danger:#b3261e;--dark:#0d1f1b;--dark-2:#193530;--mint:#7df0cf;--grad-deep:linear-gradient(118deg,#1f9467 0%,#12878a 50%,#2b6cab 100%);--vf-h:clamp(360px,46vw,520px);min-height:100vh}
.tla [hidden]{display:none!important}
.tla :focus-visible{outline:3px solid var(--teal-ink);outline-offset:3px}
.tla :where(button){font-family:inherit;color:inherit}
.tla .bg-waves .w2{top:46%}
.tla-main{padding-bottom:40px}
.tla-main a{color:var(--teal-ink)}
.tla-main a.btn-ghost,.tla-main a.btn-ghost:hover{color:var(--ink)}
.tla-main h2,.sk-modal h2{font-size:inherit;letter-spacing:normal;line-height:inherit;margin-top:0}
/* one <h1> per page (the upload screen); the later screens' titles are <h2 class="h1"> with the same look */
.tla h1,.tla-main h2.h1{font-size:clamp(30px,4.3vw,46px);line-height:1.06;letter-spacing:-.032em;font-weight:800;text-wrap:balance}
.tla footer{margin-top:0}

/* buttons (the landing's .btn + the design's ink / gradient / block variants) */
.tla-main .btn,.sk-modal .btn{gap:9px;line-height:1.2;white-space:normal;text-align:center;text-decoration:none;transition:transform .15s,box-shadow .15s,background .15s,border-color .15s}
.tla .btn svg{flex:none}
.tla-main .btn-ghost,.sk-modal .btn-ghost{background:rgba(255,255,255,.55)}
.tla .btn-ghost:hover{border-color:var(--teal-ink);color:var(--ink)}
.btn-ink{background:var(--ink);color:#fff;box-shadow:0 8px 22px rgba(17,48,42,.26)}
.tla a.btn-ink,.tla a.btn-ink:hover{color:#fff}
.btn-ink:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(17,48,42,.32);color:#fff}
.btn-grad{background:var(--grad);color:#0b2620;font-weight:800;box-shadow:0 8px 22px rgba(47,174,125,.32)}
.btn-grad:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(47,174,125,.42);color:#0b2620}
.tla .btn-lg{font-size:16px;padding:15px 30px}
.btn-block{width:100%}
.tla .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}

/* shared bits */
.flabel{font-size:12.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--teal-ink)}
.tla h2.flabel{font-size:12.5px;letter-spacing:.13em;line-height:1.3}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;border-radius:999px;padding:5px 11px;line-height:1}
.tag-amber{background:var(--amber-bg);color:var(--amber-ink)}
.tag-ok{background:#dff3ea;color:var(--green-ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--surface-soft);border:1px solid var(--line);border-radius:999px;padding:7px 14px;font-size:13.5px;font-weight:700;color:var(--ink);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.chip img{height:22px;width:auto;mix-blend-mode:multiply}
.chip.soft{font-weight:600;color:var(--ink-2);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* stepper */
.stepper{list-style:none;display:flex;gap:4px;margin:24px auto 0;padding:5px;background:var(--surface-soft);border:1px solid var(--line);border-radius:999px;width:fit-content;max-width:100%;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.stepper li{display:flex;align-items:center;gap:8px;padding:6px 14px 6px 7px;border-radius:999px;font-size:13.5px;font-weight:700;color:var(--ink-2);white-space:nowrap}
.stepper .n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:700 12.5px var(--num);background:rgba(17,48,42,.08);color:var(--ink-2)}
.stepper .n svg{display:none}
.stepper li[aria-current=step]{background:var(--ink);color:#fff}
.stepper li[aria-current=step] .n{background:#fff;color:var(--ink)}
.stepper li.done{color:var(--ink)}
.stepper li.done .n{background:var(--green-ink);color:#fff}
.stepper li.done .n b{display:none}
.stepper li.done .n svg{display:block}

/* a subscriber: state + the way to the Stripe customer portal, on every step */
.subbar{margin:14px auto 0;width:fit-content;max-width:100%;display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;font-size:13.5px;font-weight:700;color:var(--green-ink)}
.subbar svg{flex:none}
.linkbtn{background:none;border:none;font:inherit;font-weight:700;color:var(--teal-ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:6px 4px}

/* screens */
.tla section.screen{padding:34px 0 70px;scroll-margin-top:0}
.tla section.screen:not([hidden]){animation:tlaRise .5s cubic-bezier(.2,.7,.2,1)}
@keyframes tlaRise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.shead{text-align:center;max-width:700px;margin:0 auto 28px}
.ssub{margin-top:12px;font-size:18px;line-height:1.5;color:var(--ink-2)}
.shead .chips{margin-top:16px}
.narrow{max-width:820px;margin:0 auto}

/* 1 - upload */
.up{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:48px;align-items:start}
.up-intro .eyebrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.up-intro h1{margin-top:14px}
.up-intro .ssub{max-width:520px}
.block{margin-top:30px;min-width:0;border:0}
.sports{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.sp{position:relative;display:block}
.sp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.sp .tile{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:16px 12px 17px;border-radius:20px;background:var(--surface-soft);border:2px solid var(--line);transition:border-color .2s,box-shadow .2s,background .2s}
.sp .tile img{height:96px;width:auto;mix-blend-mode:multiply;margin-bottom:6px}
.sp .tile b{font-size:16.5px;letter-spacing:-.01em}
.sp .tile span{font-size:13px;color:var(--ink-2);font-weight:600}
.sp:hover .tile{border-color:var(--line-2)}
.sp input:checked+.tile{border-color:var(--teal-ink);background:linear-gradient(160deg,#ecfaf2,#e6f4f8);box-shadow:0 0 0 4px rgba(43,178,171,.16)}
.sp input:focus-visible+.tile{outline:3px solid var(--teal-ink);outline-offset:3px}
.sp .tile .tick{position:absolute;z-index:1;top:10px;right:10px;width:24px;height:24px;border-radius:50%;background:var(--green-ink);color:#fff;display:grid;place-items:center;opacity:0;transform:scale(.6);transition:.2s}
.sp input:checked+.tile .tick{opacity:1;transform:none}
.soon{margin-top:12px;display:flex;gap:12px;align-items:center;padding:12px 15px;border-radius:15px;border:1.5px dashed var(--line-2);font-size:13.5px;line-height:1.45;font-weight:600;color:var(--ink-2)}
.soon .plus{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--violet-bg);color:var(--violet-ink)}
.soon b{color:var(--ink)}
.tips{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:10px}
.tips li{display:flex;gap:14px;align-items:center;background:var(--surface-soft);border:1px solid var(--line);border-radius:18px;padding:13px 16px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.tips .ic{flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--grad-soft);color:var(--green-ink)}
.tips b{font-size:15.5px;display:block}
.tips div span{display:block;margin-top:2px;font-size:13.5px;color:var(--ink-2);line-height:1.45}

.dropcard{background:var(--surface);border-radius:30px;box-shadow:var(--shadow-lg);padding:16px;position:sticky;top:86px}
.scanfig{position:relative;height:178px;border-radius:18px;background:var(--grad-soft);display:grid;place-items:center;overflow:hidden}
.scanfig img{height:150px;width:auto;mix-blend-mode:multiply}
.scanfig::after{content:"";position:absolute;left:8%;right:8%;top:50%;height:2px;background:linear-gradient(90deg,transparent,rgba(13,114,110,.55),transparent);animation:tlaSweep 3.4s ease-in-out infinite}
@keyframes tlaSweep{0%,100%{transform:translateY(-62px)}50%{transform:translateY(62px)}}
.cnr{position:absolute;width:22px;height:22px;border:2.5px solid var(--teal-ink);opacity:.7}
.cnr.tl{top:14px;left:14px;border-right:0;border-bottom:0;border-radius:7px 0 0 0}
.cnr.tr{top:14px;right:14px;border-left:0;border-bottom:0;border-radius:0 7px 0 0}
.cnr.bl{bottom:14px;left:14px;border-right:0;border-top:0;border-radius:0 0 0 7px}
.cnr.br{bottom:14px;right:14px;border-left:0;border-top:0;border-radius:0 0 7px 0}
.dz{margin-top:14px;border:2px dashed rgba(13,114,110,.38);border-radius:20px;padding:24px 20px 22px;text-align:center;background:linear-gradient(180deg,#f4fbf8,#fff);transition:.2s}
.dz.drag{border-color:var(--teal-ink);background:#e7f7f1;box-shadow:inset 0 0 0 4px rgba(43,178,171,.14)}
.dz-ic{width:52px;height:52px;margin:0 auto;border-radius:16px;background:var(--grad);display:grid;place-items:center;color:#0b2620;box-shadow:0 8px 18px rgba(47,174,125,.3)}
.tla .dz h2{margin-top:14px;font-size:20px;letter-spacing:-.02em;line-height:1.2}
.dz p{margin-top:5px;font-size:15px;color:var(--ink-2)}
.dz .meta{margin-top:10px;font-size:13px;font-weight:600;color:var(--ink-2)}
.consent{margin-top:14px;display:flex;gap:12px;align-items:flex-start;padding:13px 14px;border-radius:15px;background:#f3f8f7;border:1.5px solid transparent;font-size:14px;line-height:1.5;color:var(--ink);cursor:pointer;position:relative;transition:border-color .2s,background .2s}
.consent input{position:absolute;left:14px;top:13px;width:22px;height:22px;opacity:0;cursor:pointer}
.consent .box{flex:none;width:22px;height:22px;border-radius:7px;border:2px solid #5a756c;background:#fff;display:grid;place-items:center;color:#fff;transition:.15s}
.consent input:checked+.box{background:var(--green-ink);border-color:var(--green-ink)}
.consent input:focus-visible+.box{outline:3px solid var(--teal-ink);outline-offset:2px}
.consent a{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.consent.attn{border-color:var(--danger);background:#fdf1f0}
.pending{margin-top:10px;display:flex;gap:9px;align-items:flex-start;padding:11px 13px;border-radius:13px;background:#e9f6f1;font-size:13.5px;line-height:1.45;font-weight:600;color:var(--ink)}
.pending svg{flex:none;margin-top:1px}
.pending strong{overflow-wrap:anywhere}
.filebtn{position:relative;margin-top:14px;cursor:pointer}
.filebtn input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.filebtn:focus-within{outline:3px solid var(--teal-ink);outline-offset:3px}
.blocked{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 26px;background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--teal-ink);border-radius:20px;padding:16px 20px;box-shadow:var(--shadow-sm)}
.blocked .ic{flex:none;width:46px;height:46px;border-radius:14px;background:var(--grad-soft);display:grid;place-items:center;color:var(--green-ink)}
.blocked-txt{flex:1;min-width:220px}
.tla .blocked h2{font-size:17.5px;letter-spacing:-.01em;line-height:1.25}
.blocked p{margin-top:3px;font-size:14px;line-height:1.5;color:var(--ink-2)}

/* viewfinder (the clip's first frame while it uploads, the athlete's crop while it is analyzed) */
.vf{position:relative;height:var(--vf-h);border-radius:28px;overflow:hidden;background:var(--dark);display:grid;place-items:center;box-shadow:var(--shadow-lg);isolation:isolate}
.vf-bg{position:absolute;left:-50px;top:-50px;width:calc(100% + 100px);height:calc(100% + 100px);max-width:none;object-fit:cover;filter:blur(30px) saturate(1.15) brightness(.55);z-index:-1}
.vf-frame{position:relative;display:flex;max-width:calc(100% - 44px);border-radius:12px;overflow:hidden;box-shadow:0 14px 44px rgba(0,0,0,.4)}
.vf-frame>img,.vf-frame>video{display:block;max-width:100%;max-height:calc(var(--vf-h) - 44px);width:auto;height:auto}
/* the picked athlete's crop is a small portrait thumbnail: let it fill the viewfinder's height */
.vf.sk-stage--crop .vf-frame>img{height:calc(var(--vf-h) - 44px);width:auto;max-width:100%;object-fit:cover}
.vf.sk-stage--empty .vf-frame{width:min(52%,250px);aspect-ratio:9/16;max-height:calc(var(--vf-h) - 44px);background:linear-gradient(160deg,#24443d,#17302b)}
.vf-scan{position:absolute;left:0;right:0;top:0;height:26%;background:linear-gradient(to bottom,rgba(125,240,207,0),rgba(125,240,207,.2) 80%,rgba(200,255,238,.95) 100%);animation:tlaScan 2.6s cubic-bezier(.4,0,.6,1) infinite;mix-blend-mode:screen;pointer-events:none}
@keyframes tlaScan{from{transform:translateY(-100%)}to{transform:translateY(400%)}}
.vf .cnr{width:34px;height:34px;border-width:3px;border-color:var(--mint);opacity:1}
.vf .cnr.tl,.vf .cnr.tr{top:20px}.vf .cnr.bl,.vf .cnr.br{bottom:20px}
.vf .cnr.tl,.vf .cnr.bl{left:20px}.vf .cnr.tr,.vf .cnr.br{right:20px}
.vf-pill{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;align-items:center;gap:9px;background:rgba(13,31,27,.86);color:#fff;font-weight:700;font-size:14.5px;padding:10px 18px;border-radius:999px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);white-space:nowrap;max-width:calc(100% - 28px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.vf-pill span{overflow:hidden;text-overflow:ellipsis}
.vf-pill i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--mint);animation:tlaBlink 1.2s infinite}
@keyframes tlaBlink{50%{opacity:.25}}
.prog{margin-top:20px}
.prog-bar{height:10px;border-radius:999px;background:rgba(17,48,42,.1);overflow:hidden}
.prog-bar i{display:block;height:100%;width:0;border-radius:999px;background:var(--grad-deep);transition:width .4s ease}
.prog-row{margin-top:10px;display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--ink)}
.prog-row b{font-size:15px;letter-spacing:0;color:var(--green-ink)}
.prog-note{margin-top:6px;min-height:20px;font-size:13.5px;color:var(--ink-2)}

/* 3 - pick (cards are built by js/analyze.js renderPersons()) */
.found{display:flex;align-items:center;gap:16px;background:var(--surface);border-radius:22px;padding:16px 20px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.found .ic{flex:none;width:48px;height:48px;border-radius:14px;background:var(--grad-soft);display:grid;place-items:center;color:var(--green-ink)}
.found b{display:block;font-size:18px;letter-spacing:-.01em}
.found div span{display:block;margin-top:2px;font-size:14px;color:var(--ink-2)}
.aths{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:14px}
.aths.one{grid-template-columns:minmax(0,230px);justify-content:center}
.sk-person{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;text-align:left;background:var(--surface);border:2px solid transparent;border-radius:22px;padding:10px 10px 14px;box-shadow:var(--shadow-sm);cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.sk-person:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.sk-person__img{position:relative;display:block;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:linear-gradient(160deg,#dbe9ea,#cfe0e4)}
.sk-person__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.sk-person__img .ph{position:absolute;inset:0;display:grid;place-items:center;color:#86a098}
.sk-person__ok{position:absolute;z-index:2;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:var(--green-ink);color:#fff;display:grid;place-items:center;border:2px solid #fff;opacity:0;transform:scale(.6);transition:.2s}
.sk-person__txt{display:flex;flex-direction:column;align-items:flex-start}
.sk-person__txt b{margin:12px 4px 0;font-size:16.5px;letter-spacing:-.01em}
.sk-person__txt span{margin:2px 4px 0;font-size:13.5px;color:var(--ink-2);font-weight:600}
.sk-person__txt .sk-person__best{margin:9px 4px 0;background:var(--ink);color:#fff;font-size:11.5px;font-weight:800;border-radius:999px;padding:5px 10px}
.aths.one .sk-person__best{display:none}
.sk-person[aria-pressed=true]{border-color:var(--teal-ink);box-shadow:0 0 0 4px rgba(43,178,171,.18),var(--shadow-md)}
.sk-person[aria-pressed=true] .sk-person__ok{opacity:1;transform:none}
.pickbar{margin-top:24px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}

/* 4 - analyze */
.an{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:22px;max-width:980px;margin:0 auto;align-items:stretch}
.status{background:var(--surface);border-radius:28px;box-shadow:var(--shadow-md);padding:28px 28px 26px;display:flex;flex-direction:column}
.pct{margin-top:6px;font-size:84px;font-weight:700;line-height:1;letter-spacing:-.04em;color:var(--ink)}
.status .prog-bar{margin-top:16px}
.now{margin-top:10px;min-height:20px;font-size:13.5px;font-weight:600;color:var(--ink-2)}
.stages{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:14px}
.stages li{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:600;color:var(--ink-2)}
.stages .dot{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--line-2);display:grid;place-items:center;color:#fff}
.stages .dot svg{opacity:0}
.stages li.done{color:var(--ink)}
.stages li.done .dot{background:var(--green-ink);border-color:var(--green-ink)}
.stages li.done .dot svg{opacity:1}
.stages li.cur{color:var(--ink);font-weight:800}
.stages li.cur .dot{border-color:rgba(13,114,110,.25);border-top-color:var(--teal-ink);animation:tlaSpin .9s linear infinite}
@keyframes tlaSpin{to{transform:rotate(360deg)}}
.status-foot{margin-top:auto;padding-top:22px;font-size:13.5px;line-height:1.5;color:var(--ink-2)}

/* 5 - result */
.res{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:26px;align-items:start;max-width:1000px;margin:0 auto}
.vid[hidden]+.res-side{grid-column:1/-1}
.vid{background:var(--dark);border-radius:30px;padding:10px;box-shadow:var(--shadow-lg),0 30px 80px rgba(20,70,90,.18);position:sticky;top:86px}
.vid-view{position:relative;aspect-ratio:9/16;border-radius:21px;overflow:hidden;background:var(--dark-2)}
.vid-view video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block;background:#000}
.res-side{display:flex;flex-direction:column;gap:18px;min-width:0}
.score{background:var(--surface);border-radius:28px;box-shadow:var(--shadow-md);padding:24px 26px}
.score-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.score-main{margin-top:16px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.ring{position:relative;flex:none;width:132px;height:132px;display:grid;place-items:center}
.ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:11;stroke-linecap:round}
.ring .bg{stroke:rgba(17,48,42,.08)}
.ring .fg{stroke:url(#ringgrad);stroke-dasharray:345.6;stroke-dashoffset:345.6;transition:stroke-dashoffset 1.2s cubic-bezier(.2,.7,.2,1)}
.ring b{position:relative;font-size:50px;font-weight:700;letter-spacing:-.04em;line-height:1}
.score-txt{flex:1;min-width:200px}
.lvl{font-size:26px;font-weight:800;letter-spacing:-.02em;background:var(--grad-deep);-webkit-background-clip:text;background-clip:text;color:transparent;width:fit-content;min-height:1em}
.score-txt p{margin-top:6px;font-size:14.5px;line-height:1.55;color:var(--ink-2)}
.score-txt .sum{font-weight:700;color:var(--ink)}
.score .chips{justify-content:flex-start;margin-top:16px}
.score .chip{background:#f1f7f6;font-size:12.5px;padding:6px 12px}
.acts{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}
.subline{margin-top:14px;font-size:13.5px;font-weight:700;color:var(--green-ink)}
.tla-main a.savedpill{margin-top:14px;display:inline-flex;align-items:center;gap:8px;background:#e9f6f1;color:var(--green-ink);font-size:13.5px;font-weight:700;border-radius:999px;padding:8px 14px;text-decoration:none}
.locked{position:relative;display:grid;border-radius:28px;overflow:hidden;background:var(--surface-soft);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.locked>*{grid-area:1/1}
.pv{padding:22px;filter:blur(7px);opacity:.8;pointer-events:none;user-select:none}
.pv-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pv-t{background:#fff;border-radius:16px;padding:12px 14px}
.pv-t span{display:block;height:9px;width:68%;border-radius:9px;background:#b9cbc6;margin:3px 0 6px}
.pv-t b{display:block;font:700 26px var(--num)}
.pv-t i{display:block;height:6px;border-radius:9px;background:var(--grad);width:var(--v)}
.pv-rows{margin-top:12px;display:flex;flex-direction:column;gap:10px}
.pv-r{background:#fff;border-radius:16px;padding:14px 16px;border-left:5px solid #f08a5d}
.pv-r:nth-child(2){border-left-color:#f2b84b}.pv-r:nth-child(3){border-left-color:#3fbf9f}
.pv-r b{display:block;height:11px;width:44%;border-radius:9px;background:#8ea7a0}
.pv-r span{display:block;height:9px;width:62%;border-radius:9px;background:#c5d5d0;margin-top:9px}
.lock{align-self:end;justify-self:center;position:relative;margin:132px 20px 22px;max-width:500px;background:var(--surface);border-radius:26px;box-shadow:var(--shadow-lg);padding:30px 30px 24px;text-align:center}
.lock-ic{width:58px;height:58px;margin:0 auto;border-radius:18px;background:var(--grad);display:grid;place-items:center;color:#0b2620;box-shadow:0 10px 22px rgba(47,174,125,.32)}
.tla .lock h2{margin-top:16px;font-size:26px;letter-spacing:-.025em;line-height:1.12}
.lock>p{margin-top:10px;font-size:15px;line-height:1.55;color:var(--ink-2)}
.ticks{list-style:none;margin:16px auto 0;display:flex;flex-direction:column;gap:9px;text-align:left;max-width:400px}
.ticks li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;font-weight:600}
.ticks svg{flex:none;margin-top:2px;color:var(--green-ink)}
.lock .btn{margin-top:20px}
.lock .fine{margin-top:12px;font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.locked.sk-fadeout{opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .4s ease}

/* the unlocked report: the blurred preview, for real */
.full{display:flex;flex-direction:column;gap:14px}
.full.sk-unblur{animation:tlaUnblur .7s ease both}
@keyframes tlaUnblur{from{filter:blur(8px);opacity:.3}to{filter:none;opacity:1}}
.sk-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sk-chip{display:block;background:#fff;border-radius:16px;padding:12px 14px;font-size:12px;font-weight:700;color:var(--ink-2);box-shadow:var(--shadow-sm);overflow-wrap:anywhere}
.sk-chip span{display:block;margin-top:2px;font:700 26px var(--num);color:var(--ink)}
.sk-chip span.na{font:600 12.5px var(--font);color:var(--ink-3);margin-top:8px}
.sk-chip::after{content:"";display:block;margin-top:4px;height:6px;border-radius:9px;background:var(--grad);width:var(--v,0)}
.work{margin-top:8px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.tla .work h2{font-size:20px;letter-spacing:-.02em;line-height:1.2}
.work .cnt{display:flex;gap:6px;flex-wrap:wrap}
.sk-cntpill{font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 10px;background:var(--amber-bg);color:var(--amber-ink)}
.sk-cntpill.critical{background:#fde4e1;color:var(--danger)}
.cues{display:flex;flex-direction:column;gap:10px}
.cues:empty{display:none}
.sk-cue,.sk-obs{background:#fff;border-radius:16px;padding:14px 16px;border-left:5px solid #f2b84b;box-shadow:var(--shadow-sm)}
.sk-cue--critical,.sk-obs--critical{border-left-color:#e0532d}
.sk-cue--high,.sk-obs--high{border-left-color:#f08a5d}
.sk-cue--medium,.sk-obs--medium{border-left-color:#f2b84b}
.sk-cue--low,.sk-obs--low{border-left-color:#8fb7d8}
.sk-cue--good{border-left-color:#3fbf9f}
.sk-cue__meta,.sk-obs__meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.sk-cue__sev,.sk-obs__sev{color:var(--amber-ink)}
.sk-cue--critical .sk-cue__sev,.sk-obs--critical .sk-obs__sev{color:var(--danger)}
.sk-cue--good .sk-cue__sev{color:var(--green-ink)}
.sk-cue__cat,.sk-obs__cat{color:var(--ink-2)}
.sk-cue__t,.sk-obs__t{margin-top:6px;font-size:15px;font-weight:700;line-height:1.4}
.sk-cue__v,.sk-obs__v{margin-top:4px;font:600 13.5px var(--num);color:var(--ink-2)}
/* the key frame: the annotated still the point refers to, left of the text; a click opens it full size */
.sk-cue--pic{display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;align-items:start}
.sk-cue__kf{position:relative;display:block;width:112px;aspect-ratio:9/16;padding:0;border:0;border-radius:12px;overflow:hidden;background:var(--dark-2);cursor:zoom-in;box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s}
.sk-cue__kf:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.sk-cue__kf img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.sk-cue__kf::after{content:"";position:absolute;right:6px;bottom:6px;width:26px;height:26px;border-radius:50%;background:rgba(13,31,27,.72) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 4H4v5M15 4h5v5M9 20H4v-5M15 20h5v-5'/%3E%3C/svg%3E") center/14px no-repeat}
.sk-cue__body{min-width:0}
.sk-cue__more{margin-top:8px}
.sk-cue__more summary{cursor:pointer;width:fit-content;font-size:13px;font-weight:700;color:var(--teal-ink);text-decoration:underline;text-underline-offset:3px;list-style:none}
.sk-cue__more summary::-webkit-details-marker{display:none}
.sk-cue__more p{margin-top:6px;font-size:14px;line-height:1.55;color:var(--ink-2)}
.sk-cue__next{margin-top:10px;background:#f1f7f6;border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.5;color:var(--ink)}
.metrics{margin-top:8px}
.metrics ul{list-style:none;margin-top:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.sk-metric{position:relative;background:#fff;border-radius:16px;padding:12px 14px 12px 16px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:2px;overflow:hidden}
.sk-metric::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:#3fbf9f}
.sk-metric--acceptable::before{background:#8fb7d8}
.sk-metric--needs_work::before{background:#f2b84b}
.sk-metric--poor::before{background:#e0532d}
.sk-metric__l{font-size:12px;font-weight:700;color:var(--ink-2)}
.sk-metric__v{font:700 19px var(--num);line-height:1.25}
.sk-metric__t{font-size:12.5px;color:var(--ink-2)}
.sk-metric__b{margin-top:2px;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--green-ink)}
.sk-metric--acceptable .sk-metric__b{color:#2b6cab}
.sk-metric--needs_work .sk-metric__b{color:var(--amber-ink)}
.sk-metric--poor .sk-metric__b{color:var(--danger)}
.alllist{background:#fff;border-radius:16px;box-shadow:var(--shadow-sm);padding:0 16px}
.alllist summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;font-weight:700;font-size:15px}
.alllist summary::-webkit-details-marker{display:none}
.alllist summary svg{flex:none;color:var(--ink-2);transition:transform .2s}
.alllist[open] summary svg{transform:rotate(180deg)}
.alllist ul{list-style:none;padding-bottom:10px}
.alllist li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;line-height:1.45;color:var(--ink)}
.alllist li span:last-child{flex:none;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.alllist li span.critical{color:var(--danger)}.alllist li span.high{color:var(--amber-ink)}
.again{display:flex;justify-content:flex-start}

/* banners */
.gift{display:flex;align-items:center;gap:14px;flex-wrap:wrap;max-width:1000px;margin:0 auto 18px;background:linear-gradient(160deg,#ecfaf2,#e6f4f8);border:1px solid var(--line);border-radius:20px;padding:14px 18px}
.gift .ic{flex:none;width:42px;height:42px;border-radius:13px;background:var(--grad);display:grid;place-items:center;color:#0b2620}
.gift p{flex:1;min-width:200px;font-size:14.5px;font-weight:700;line-height:1.45}
.gift-x{flex:none;width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,.7);display:grid;place-items:center;cursor:pointer}
.sk-paynote{max-width:1000px;margin:0 auto 18px;border-radius:14px;padding:12px 16px;font-size:14.5px;font-weight:700;background:#e9f6f1;color:var(--green-ink)}
.sk-paynote--warn{background:var(--amber-bg);color:var(--amber-ink)}
.tla-err{max-width:820px;margin:0 auto 40px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:#fdf1f0;border:1.5px solid rgba(179,38,30,.35);border-radius:18px;padding:14px 18px}
.tla-err p{flex:1;min-width:220px;font-size:14.5px;font-weight:700;color:var(--danger);line-height:1.45}
.tla-err div{display:flex;gap:8px;flex-wrap:wrap}

/* dialogs (js/ski-how.js SkiModal: hidden attribute, [data-modal-close], body.sk-noscroll) */
body.sk-noscroll{overflow:hidden}
.sk-modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:14px}
.sk-modal__backdrop{position:absolute;inset:0;background:rgba(13,31,27,.55);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.sk-modal__box{position:relative;width:min(880px,100%);max-height:calc(100vh - 28px);max-height:calc(100dvh - 28px);overflow:auto;border-radius:30px;background:var(--surface);color:var(--ink);box-shadow:0 30px 90px rgba(13,31,27,.4);padding:40px 40px 32px;text-align:center;animation:tlaRise .35s cubic-bezier(.2,.7,.2,1)}
.sk-modal__box:focus,.sk-modal__box:focus-visible{outline:none}
.sk-modal__close{position:absolute;top:16px;right:16px;width:42px;height:42px;border-radius:50%;border:none;background:#eef4f3;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.sk-modal__close:hover{background:#e2eceb}
.sk-modal .pay h2{margin-top:8px;font-size:clamp(26px,3.6vw,36px);letter-spacing:-.03em;line-height:1.08}
.pay-sub{margin-top:10px;font-size:16px;color:var(--ink-2)}
.plans{margin-top:26px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(270px,100%),1fr));gap:18px;text-align:left}
.plan{position:relative;display:flex;flex-direction:column;border-radius:24px;border:1.5px solid var(--line-2);padding:26px 24px 24px;background:#fff}
.plan.best{border-color:transparent;background:linear-gradient(#f4fcf8,#f1f8fc) padding-box,var(--grad) border-box;border-width:2px;box-shadow:0 14px 34px rgba(47,174,125,.16)}
.best-tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;border-radius:999px;padding:6px 14px;white-space:nowrap}
.plan h3{font-size:18.5px;letter-spacing:-.015em}
.price{margin-top:10px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.price b{font-size:44px;font-weight:700;letter-spacing:-.035em;line-height:1}
.price>span{font-size:14.5px;color:var(--ink-2);font-weight:600}
.plan .ticks{margin:18px 0 22px;max-width:none}
.plan .btn{margin-top:auto}
.pay-unavail{margin-top:18px;font-size:14px;font-weight:700;color:var(--amber-ink)}
.pay-foot{margin-top:22px;display:flex;justify-content:center;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink-2)}
.pay-foot svg{flex:none}
.pay-legal{margin:8px auto 0;max-width:560px;font-size:12px;line-height:1.5;color:var(--ink-2)}
.sk-modal__box.kf{width:auto;max-width:min(520px,100%);padding:12px 12px 16px;background:var(--dark);color:#fff;border-radius:26px}
.kf img{display:block;max-width:100%;max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px);width:auto;height:auto;margin:0 auto;border-radius:16px;background:var(--dark-2)}
.kf p{margin-top:12px;padding:0 54px 0 8px;font-size:14.5px;font-weight:700;line-height:1.4;text-align:left}
.kf .sk-modal__close{top:20px;right:20px;background:rgba(13,31,27,.6);color:#fff}
.kf .sk-modal__close:hover{background:rgba(13,31,27,.85)}
.sk-modal__box.checkout{width:min(620px,100%);padding:30px 22px 22px;text-align:left}
.sk-modal .checkout h2{font-size:22px;letter-spacing:-.02em;line-height:1.2;padding-right:48px}
.checkout-status{margin-top:16px;display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;color:var(--ink-2)}
.checkout-err{margin-top:16px;font-size:14.5px;font-weight:700;color:var(--danger)}
.checkout-mount{margin-top:14px;min-height:480px}
.spin{flex:none;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(13,114,110,.25);border-top-color:var(--teal-ink);animation:tlaSpin .9s linear infinite}

@media (max-width:940px){
.up{grid-template-columns:1fr;gap:30px}
.dropcard{position:static}
.an{grid-template-columns:1fr}
.res{grid-template-columns:1fr;max-width:520px}
.vid{position:static;max-width:340px;margin:0 auto;width:100%}
}
@media (max-width:560px){
.stepper li .t{display:none}
.stepper li[aria-current=step] .t{display:inline}
.stepper li{padding:6px 7px}
.stepper li[aria-current=step]{padding-right:14px}
.tla section.screen{padding-top:24px}
.sp .tile img{height:78px}
.pct{font-size:68px}
.sk-modal__box{padding:34px 20px 26px;border-radius:26px}
.pv-tiles,.sk-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
.sk-cue--pic{grid-template-columns:84px minmax(0,1fr);gap:12px}
.sk-cue__kf{width:84px}
.metrics ul{grid-template-columns:1fr}
.lock{margin:150px 12px 14px;padding:26px 20px 22px}
.pickbar .btn{width:100%}
.score{padding:20px 18px}
.again .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
.tla *,.tla *::before,.tla *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
.vf-scan,.scanfig::after{display:none}
}
