/* ShowingTime onboarding — the approved design's own stylesheet (LM-ONBOARDING-8).
   Verbatim except for two mechanical changes: asset URLs point at the /lm mount,
   and every selector is scoped under .lm-st so the design cannot leak into the
   rest of the app. Nothing was restyled. */
.lm-st body{background:var(--cloud);margin:0}
.lm-st .stsplit{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);min-height:100vh}
.lm-st .stmain{overflow:hidden}
.lm-st .stmain .wrap{max-width:none;padding:clamp(26px,3.4vw,52px) clamp(20px,3vw,40px) 64px}
.lm-st .stmain .cols{grid-template-columns:minmax(0,1fr)}
.lm-st .stmain .lede, .lm-st .stmain .ta-steps{margin-left:0;text-align:left;max-width:none}
.lm-st .stpanel{position:relative;background:var(--navy);color:var(--ink-on-navy);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(30px,4vw,60px);position:sticky;top:0;height:100vh}
.lm-st .stpanel .ph{position:absolute;inset:0;overflow:hidden}
.lm-st .stpanel .ph iframe{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:auto;height:auto;aspect-ratio:16/9;min-width:100%;min-height:100%;max-width:none;max-height:none;border:0;opacity:.6;pointer-events:none}
.lm-st .stpanel .ph img{width:100%;height:100%;object-fit:cover;opacity:.6;display:block}
.lm-st .stpanel .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,13,37,.4),rgba(0,13,37,.88))}
.lm-st .stpanel .in{position:relative;z-index:2}
.lm-st .stpanel h3{font-family:var(--font-head);font-weight:800;letter-spacing:-.03em;font-size:clamp(23px,2.3vw,31px);color:#fff;max-width:20ch;margin:0}
.lm-st .stpanel p{margin-top:15px;font-size:14.5px;line-height:1.6;color:var(--ink-on-navy-2);max-width:42ch}
.lm-st .sthandled{position:absolute;top:0;left:0;right:0;bottom:44%;z-index:1;pointer-events:none}
.lm-st .sthc{position:absolute;display:flex;align-items:center;gap:11px;background:rgba(255,255,255,.97);border-radius:14px;padding:11px 15px 11px 12px;box-shadow:0 18px 44px rgba(0,8,26,.34);width:max-content;max-width:min(300px,72%);opacity:0;transform:translateY(10px);animation:sthIn .6s cubic-bezier(.22,1,.36,1) forwards}
.lm-st .sthc:nth-child(1){animation-delay:.15s}
.lm-st .sthc:nth-child(2){animation-delay:.5s}
.lm-st .sthc:nth-child(3){animation-delay:.85s}
.lm-st .sthc .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none;background:rgba(0,182,126,.12);color:var(--green-d)}
.lm-st .sthc.bl .ic{background:var(--blue-t);color:var(--blue)}
.lm-st .sthc b{display:block;font-family:var(--font-head);font-weight:800;font-size:13px;letter-spacing:-.015em;color:var(--ink);white-space:nowrap}
.lm-st .sthc em{font-style:normal;display:block;margin-top:2px;font-size:11.5px;color:var(--muted);white-space:nowrap}
@keyframes sthIn{
to{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){
.lm-st .sthc{animation:none;opacity:1;transform:none}
}
@media(max-width:1000px){
.lm-st .stsplit{grid-template-columns:minmax(0,1fr)}
.lm-st .stpanel{position:relative;height:auto;min-height:260px;order:-1;padding:clamp(22px,4vw,40px)}
.lm-st .sthandled{position:relative;inset:auto;display:flex;flex-wrap:wrap;gap:8px;padding:0 0 18px}
.lm-st .sthc{position:static!important;box-shadow:var(--shadow-sm);padding:9px 13px 9px 10px;max-width:none}
.lm-st .sthc em{display:none}
}
.lm-st .wrap{max-width:1100px;margin:0 auto;padding:48px 40px 90px}
.lm-st .ta-steps{max-width:520px;margin:0 auto 34px}
.lm-st .lede{text-align:center;max-width:640px;margin:0 auto 32px}
.lm-st .lede h1{font-size:32px}
.lm-st .lede p{font-size:15px;color:var(--muted);margin-top:12px;text-wrap:pretty}
.lm-st .cols{display:grid;grid-template-columns:1.32fr .95fr;gap:24px;align-items:start}
.lm-st .pane{background:#fff;border:1px solid var(--hair);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);padding:28px 30px}
.lm-st .pane>h2{font-size:19px}
.lm-st .pane .hint{font-size:13.5px;color:var(--muted);margin-top:8px;text-wrap:pretty}
.lm-st .sec{border-top:1px solid var(--hair-2);margin-top:24px;padding-top:22px}
.lm-st .sec-h{display:flex;align-items:center;gap:12px}
.lm-st .sec-h .n{width:24px;height:24px;border-radius:999px;background:var(--cloud);color:var(--muted);font-family:var(--font-head);font-weight:800;font-size:12px;display:grid;place-items:center;flex-shrink:0}
.lm-st .sec-h h3{font-size:15.5px}
.lm-st .sec-h .st{margin-left:auto}
.lm-st .sec.on .sec-h .n{background:var(--blue);color:#fff}
.lm-st .sec.done .sec-h .n{background:var(--green);color:#fff}
.lm-st .sec.locked{opacity:.5}
.lm-st .sec.locked .sec-b{display:none}
.lm-st .sec-b{padding-top:16px}
.lm-st .q{font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:10px}
.lm-st .seg{display:flex;gap:10px;flex-wrap:wrap}
.lm-st .seg button{flex:1;min-width:180px;text-align:left;font:inherit;padding:13px 16px;border-radius:var(--r);border:1px solid var(--hair);background:#fff;cursor:pointer;transition:.15s}
.lm-st .seg button b{display:block;font-size:13.5px;font-weight:700;color:var(--ink)}
.lm-st .seg button span{font-size:12px;color:var(--muted)}
.lm-st .seg button:hover{border-color:var(--blue-t2)}
.lm-st .seg button.on{border-color:var(--blue);background:var(--blue-t);box-shadow:0 0 0 1px var(--blue)}
.lm-st .seg button.on b{color:var(--blue)}
.lm-st .subhint{font-size:12.5px;color:var(--muted);margin-top:10px}
.lm-st .how{background:var(--bg);border:1px solid var(--hair-2);border-radius:var(--r);padding:18px 20px;margin-top:18px}
.lm-st .how .cap{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);margin-bottom:12px}
.lm-st .how ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;counter-reset:s}
.lm-st .how li{display:flex;gap:12px;font-size:13.5px;color:var(--ink-2);line-height:1.5;counter-increment:s}
.lm-st .how li::before{content:counter(s);width:21px;height:21px;border-radius:999px;background:var(--blue-t);color:var(--blue);font-family:var(--font-head);font-weight:800;font-size:11.5px;display:grid;place-items:center;flex-shrink:0;margin-top:1px}
.lm-st .how li b{color:var(--ink);font-weight:700}
.lm-st .how li .numchip{font-variant-numeric:tabular-nums;color:var(--blue);background:var(--blue-t);border-radius:6px;padding:1px 7px;white-space:nowrap}
.lm-st .warn{display:none;gap:13px;align-items:flex-start;background:var(--warn-t);border:1px solid rgba(184,121,12,.22);border-radius:var(--r);padding:15px 17px;margin-top:16px}
.lm-st .warn.on{display:flex}
.lm-st .warn .wi{width:28px;height:28px;border-radius:9px;background:#fff;color:var(--warn);display:grid;place-items:center;flex-shrink:0}
.lm-st .warn .wi svg{width:15px;height:15px}
.lm-st .warn b{display:block;font-size:13.5px;color:#7A5006}
.lm-st .warn p{font-size:12.5px;color:#7A5006;margin-top:4px;line-height:1.55}
.lm-st .fl{display:flex;flex-direction:column;gap:8px}
.lm-st .fl label{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
.lm-st .fl input{font-size:13.5px;padding:14px 16px;border-radius:var(--r)}
.lm-st .fl input.bad{border-color:var(--err);box-shadow:0 0 0 3px var(--err-t)}
.lm-st .fl .msg{font-size:12.5px;color:var(--muted)}
.lm-st .fl .msg.err{color:var(--err)}
.lm-st .row{display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}
.lm-st .ta-btn[disabled]{opacity:.42;pointer-events:none;box-shadow:none}
.lm-st .linkish{background:none;border:none;font:inherit;font-size:13px;font-weight:600;color:var(--blue);cursor:pointer;padding:0;text-align:left}
.lm-st .linkish:hover{color:var(--blue-d)}
.lm-st .checks{display:none;background:var(--bg);border:1px solid var(--hair-2);border-radius:var(--r);padding:16px 18px;margin-top:16px}
.lm-st .checks.on{display:block}
.lm-st .checks .cap{font-size:12.5px;font-weight:700;color:var(--ink-2);display:flex;align-items:center;gap:9px;margin-bottom:12px}
.lm-st .spin{width:15px;height:15px;border-radius:999px;border:2px solid var(--cloud-2);border-top-color:var(--blue);animation:sp .7s linear infinite;flex-shrink:0}
@keyframes sp{
to{transform:rotate(360deg)}
}
.lm-st .ck-l{display:flex;flex-direction:column;gap:9px}
.lm-st .ck-i{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--faint);transition:color .2s}
.lm-st .ck-i .b{width:17px;height:17px;border-radius:999px;border:1.5px solid var(--cloud-2);display:grid;place-items:center;flex-shrink:0;color:transparent}
.lm-st .ck-i .b svg{width:10px;height:10px}
.lm-st .ck-i.pass{color:var(--ink-2)}
.lm-st .ck-i.pass .b{background:var(--green);border-color:var(--green);color:#fff}
.lm-st .ck-i.fail{color:var(--err)}
.lm-st .ck-i.fail .b{background:var(--err);border-color:var(--err);color:#fff}
.lm-st .ok{display:none;gap:14px;align-items:flex-start;background:var(--green-t);border:1px solid rgba(0,182,126,.22);border-radius:var(--r);padding:16px 18px;margin-top:16px}
.lm-st .ok.on{display:flex}
.lm-st .ok .tick{width:32px;height:32px;border-radius:999px;background:var(--green);color:#fff;display:grid;place-items:center;flex-shrink:0}
.lm-st .ok .tick svg{width:17px;height:17px}
.lm-st .ok b{font-size:14px;display:block}
.lm-st .ok>div>span{font-size:12.5px;color:var(--ink-2)}
.lm-st .caps{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}
.lm-st .caps .cap-i{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid rgba(0,182,126,.28);color:var(--green-d);border-radius:var(--r-pill);font-size:11.5px;font-weight:700;padding:4px 11px 4px 8px}
.lm-st .caps .cap-i svg{width:12px;height:12px}
.lm-st .num{display:flex;align-items:center;gap:16px;background:var(--grad-soft);border:1px solid rgba(0,86,246,.14);border-radius:var(--r);padding:16px 18px}
.lm-st .num .l{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--slate)}
.lm-st .num .v{font-family:var(--font-head);font-weight:800;font-size:23px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;margin-top:3px}
.lm-st .num .ta-btn{margin-left:auto}
.lm-st .confirm{display:flex;align-items:center;gap:11px;margin-top:16px;font-size:13.5px;color:var(--ink-2);cursor:pointer;user-select:none}
.lm-st .confirm input{width:18px;height:18px;accent-color:var(--blue);cursor:pointer}
.lm-st .pending{display:none;align-items:center;gap:10px;font-size:13px;color:var(--muted);margin-top:14px}
.lm-st .pending.on{display:flex}
.lm-st .side{display:flex;flex-direction:column;gap:16px}
.lm-st .why{background:var(--navy);color:var(--ink-on-navy);border-radius:var(--r-lg);padding:26px 26px 28px;position:relative;overflow:hidden}
.lm-st .why::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--grad)}
.lm-st .why h3{font-size:17px;color:#fff;line-height:1.3}
.lm-st .why ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:15px}
.lm-st .why li{display:flex;gap:12px;font-size:13px;line-height:1.5;color:var(--ink-on-navy-2)}
.lm-st .why li b{color:#fff;font-weight:700;display:block;margin-bottom:2px;font-size:13.5px}
.lm-st .why li .ti{width:26px;height:26px;border-radius:8px;background:rgba(82,223,175,.14);color:var(--mint);display:grid;place-items:center;flex-shrink:0}
.lm-st .why li .ti svg{width:14px;height:14px}
.lm-st .locked-c{display:flex;gap:13px;align-items:flex-start;background:#fff;border:1px solid var(--hair);border-radius:var(--r-md);padding:18px 20px;box-shadow:var(--shadow-sm)}
.lm-st .locked-c .ta-ic{width:36px;height:36px;border-radius:10px}
.lm-st .locked-c .ta-ic svg{width:17px;height:17px}
.lm-st .locked-c b{font-size:13.5px;display:block}
.lm-st .locked-c p{font-size:12.5px;color:var(--muted);margin-top:4px;line-height:1.55}
.lm-st .faq{background:#fff;border:1px solid var(--hair);border-radius:var(--r-md);box-shadow:var(--shadow-sm);overflow:hidden}
.lm-st .faq details{border-bottom:1px solid var(--hair-2)}
.lm-st .faq summary{list-style:none;cursor:pointer;padding:15px 20px;font-size:13.5px;font-weight:700;display:flex;align-items:center;gap:10px}
.lm-st .faq summary::-webkit-details-marker{display:none}
.lm-st .faq summary::after{content:"";margin-left:auto;width:7px;height:7px;border-right:2px solid var(--faint);border-bottom:2px solid var(--faint);transform:rotate(45deg) translateY(-2px);transition:transform .18s}
.lm-st .faq details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.lm-st .faq p{padding:0 20px 16px;font-size:13px;color:var(--muted);line-height:1.6}
.lm-st .faq .ask{padding:15px 20px;border-top:1px solid var(--hair-2);display:block;width:100%}
.lm-st #toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,220%);z-index:300;transition:transform .24s}
.lm-st #toast.on{transform:translate(-50%,0)}
@media(max-width:900px){
.lm-st .cols{grid-template-columns:1fr}
.lm-st .wrap{padding:28px 18px 80px}
}

/* The poster fallback (LM-VISUAL-RESTORE follow-up).
   The source styles `.ph iframe` and `.ph img` but never `.ph video`, because
   there the <video> is always swapped for an iframe on load and never persists.
   Our panel keeps the <video poster> as the pre-hydration fallback — and as the
   PERMANENT state on sign-in and reset, whose source panels carry an empty
   data-vimeo. Without a rule it renders at intrinsic size instead of filling,
   so the panel reads as an empty dark box. Same treatment as `.ph img`. */
.lm-st .ph video,
.lm-st .stpanel .ph video,
.lm-st .story .ph video {
  width: 100%; height: 100%; object-fit: cover; opacity: .6; display: block;
}