/* Product film (tools/r26/components.mjs film(), site/r26/film.js).
   A fixed 1200 x 720 screen, scaled to the available width, with the scene tabs below it. */
.r-film{width:1200px;max-width:100%;margin:0 auto;color:#131417;line-height:1.4;font-variant-numeric:tabular-nums}
.r-film [hidden]{display:none!important}
.fm-fit{--fm-s:1;position:relative;width:100%;aspect-ratio:1200/720;container-type:inline-size}
@supports (width:calc(tan(atan2(1px,1px)) * 1px)){.fm-fit{--fm-s:tan(atan2(100cqw,1200px))}}
.fm-screen{position:absolute;left:0;top:0;margin:0;width:1200px;height:720px;transform-origin:0 0;transform:scale(var(--fm-s));border-radius:14px;overflow:hidden;background:#f4f5f8;box-shadow:0 0 0 1px rgba(19,20,23,.08),0 40px 90px rgba(19,20,23,.22),0 4px 12px rgba(19,20,23,.10)}
.fm-scene{position:absolute;inset:0}

/* app nav */
.fm-nav{position:absolute;left:0;top:0;right:0;height:56px;background:#fff;border-bottom:1px solid #dfe3ec;display:flex;align-items:center;gap:24px;padding:0 20px;z-index:2;box-sizing:border-box}
.fm-brand{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;letter-spacing:-0.02em;margin-right:6px}
.fm-logo{width:24px;height:24px;border-radius:6px;background:#1f5f4a;color:#fff;font-size:13px;display:flex;align-items:center;justify-content:center}
.fm-navi{font-size:13.5px;font-weight:600;color:#5c626c}
.fm-search{width:220px;height:36px;border:1px solid #dfe3ec;border-radius:10px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;font-size:13px;color:#6b717b;box-sizing:border-box}
.fm-lasso-pill{height:36px;padding:0 14px;border-radius:999px;display:flex;align-items:center;font-size:13.5px;font-weight:700;border:1px solid #dfe3ec;box-sizing:border-box}
.fm-letra-pill{height:36px;padding:0 14px;border-radius:999px;border:1px solid #dfe3ec;display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;box-sizing:border-box}
.fm-letra{position:relative;display:inline-block;font-style:italic;font-weight:800;letter-spacing:-0.06em}
.fm-ldot{position:absolute;width:.22em;height:.22em;border-radius:50%;right:-.3em;bottom:.1em;background:#fff}
.fm-navdot{background:#2450e8;transition:background-color 300ms ease}
.fm-needs{background:#fff252;color:#131417;border-radius:999px;padding:2px 8px;font-size:11.5px;font-weight:800}

/* stage pieces */
.fm-card{position:absolute;background:#fff;border:1px solid #dfe3ec;border-radius:12px;box-sizing:border-box}
.fm-h{position:absolute;left:28px;top:78px;font-size:40px;font-weight:800;letter-spacing:-0.05em}
.fm-chead{display:flex;align-items:center;justify-content:space-between;padding:0 20px;font-weight:700;border-bottom:1px solid #eef0f4}
.fm-qrow{height:58px;display:grid;grid-template-columns:1fr 260px 70px;gap:16px;align-items:center;padding:0 20px;border-top:1px solid #eef0f4}
.fm-qbar{height:6px;border-radius:3px;background:#eef0f4;overflow:hidden}
.fm-orow{height:54px;display:grid;grid-template-columns:140px 1fr 120px 120px;align-items:center;padding:0 20px;font-size:13.5px}
.fm-axis{position:absolute;text-align:center;font-size:11.5px;color:#6b717b}
.fm-pt{position:absolute;width:14px;height:14px}
.fm-ptd{display:block;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid #2450e8;box-sizing:border-box}
.fm-ptv{position:absolute;width:60px;text-align:center;font-size:13px;font-weight:800}
.fm-ahead{height:44px;display:grid;grid-template-columns:130px 1fr 130px;gap:18px;align-items:center;padding:0 20px;font-size:11.5px;font-weight:800;letter-spacing:.06em;color:#6b717b;border-bottom:1px solid #eef0f4}
.fm-arow{height:96px;display:grid;grid-template-columns:130px 1fr 130px;gap:18px;align-items:center;padding:0 20px;border-bottom:1px solid #eef0f4}
.fm-tag{justify-self:start;border-radius:8px;padding:4px 9px;font-size:12.5px;font-weight:800;white-space:nowrap;background:#131417;color:#fff}
.fm-tag.out{background:none;color:#131417;border:1.5px solid #131417}
.fm-ast{justify-self:end;font-size:13px;font-weight:700;color:#6b717b}
.fm-hl{background-image:linear-gradient(#fff252,#fff252);background-repeat:no-repeat;background-position:0 0;background-size:0 100%;color:#131417;padding:0 4px;border-radius:3px;transition:background-size 700ms cubic-bezier(.65,0,.35,1),color 300ms ease}

/* overlays */
.fm-ease{transition:opacity 420ms cubic-bezier(.16,1,.3,1),transform 520ms cubic-bezier(.16,1,.3,1)}
.fm-scrim{position:absolute;z-index:3;pointer-events:none;border-radius:12px;box-shadow:0 0 0 2400px rgba(19,20,23,.34);opacity:0;transition:opacity 400ms ease}
.fm-ring{position:absolute;z-index:4;box-sizing:border-box;border:3px solid #fff252;border-radius:14px;box-shadow:0 0 0 1px rgba(19,20,23,.5),inset 0 0 0 1px rgba(19,20,23,.25);pointer-events:none;transition:left 520ms cubic-bezier(.23,1,.32,1),top 520ms cubic-bezier(.23,1,.32,1),width 520ms cubic-bezier(.23,1,.32,1),height 520ms cubic-bezier(.23,1,.32,1),opacity 300ms ease}
.fm-ringn{position:absolute;right:-12px;top:-12px;width:24px;height:24px;border-radius:50%;background:#131417;color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px #fff252}
.fm-conn{position:absolute;left:0;top:0;pointer-events:none;z-index:4;transition:opacity 300ms ease}
.fm-ink{position:absolute;z-index:6;left:368px;top:250px;width:232px;background:#131417;color:#fff;border-radius:12px;padding:14px 16px;box-shadow:0 20px 44px rgba(19,20,23,.4);box-sizing:border-box}
.fm-lasso{position:absolute;left:24px;top:140px;pointer-events:none;z-index:5}
.fm-lasso path{transition:stroke-dashoffset 2000ms linear}
.fm-lcard{position:absolute;z-index:7;left:316px;top:170px;width:360px;background:#1d3fd9;color:#fff;border-radius:18px;padding:16px 18px 18px;box-shadow:0 2px 6px rgba(8,22,90,.2),0 30px 70px rgba(29,63,217,.4);box-sizing:border-box}
.fm-chip{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:999px;font-size:12.5px;font-weight:700;background:#fff;color:#131417}
.fm-lans{margin-top:12px;font-size:15px;line-height:1.45;font-weight:600}
.fm-lfollow{margin-top:12px}
.fm-lfollow span{display:block;padding:10px 12px;border-radius:10px;background:#2b4de6;font-size:13.5px;font-weight:700}

/* Letra panel */
.fm-panel{position:absolute;z-index:5;left:820px;top:68px;width:364px;height:640px;border-radius:22px;background:#1d3fd9;color:#fff;overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 6px rgba(8,22,90,.2),0 30px 70px rgba(29,63,217,.35)}
.fm-panel::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.fm-phead{position:relative;height:52px;display:flex;align-items:center;padding:0 18px}
.fm-pdot{background:#fff}
.fm-orb{position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 55%,rgba(255,255,255,.2) 70%,#fff 99%,transparent 100%);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));animation:fm-spin 1.1s linear infinite}
.fm-pbody{position:relative}
.fm-q{position:relative;margin:0 16px 0 auto;width:fit-content;max-width:280px;padding:10px 14px;border-radius:12px;background:#2b4de6;box-shadow:inset 0 1px 0 rgba(255,255,255,.14);font-size:14px;font-weight:600}
.fm-think{position:relative;padding:18px 18px 0;display:flex;flex-direction:column;gap:10px}
.fm-sk{display:block;height:14px;border-radius:7px;background:linear-gradient(90deg,rgba(255,255,255,.14) 0,rgba(255,255,255,.32) 50%,rgba(255,255,255,.14) 100%);background-size:600px 100%;animation:fm-shim 1.4s linear infinite}
.fm-ptitle{position:relative;padding:14px 18px 0;font-size:25px;line-height:1.12;font-weight:800;letter-spacing:-0.035em;transition:opacity 400ms ease}
.fm-pcards{position:relative;padding:14px 12px 0;display:flex;flex-direction:column;gap:8px}
.fm-pc{border-radius:14px;padding:13px 14px;display:grid;grid-template-columns:24px 1fr;gap:10px;font-size:14px;line-height:1.42;background:#2b4de6;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.12);transition:background-color 300ms ease,color 300ms ease,opacity 400ms cubic-bezier(.16,1,.3,1),transform 500ms cubic-bezier(.16,1,.3,1)}
.fm-pn{width:24px;height:24px;border-radius:50%;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18);color:#fff}
.fm-prop{position:relative;margin:10px 12px 0;background:#fff;color:#131417;border-radius:14px;padding:14px 14px 12px;transition:opacity 420ms cubic-bezier(.16,1,.3,1),transform 520ms cubic-bezier(.16,1,.3,1)}
.fm-prop-k{display:flex;justify-content:space-between;font-size:12px;font-weight:700;color:#4a4f58}
.fm-prop-k span{color:#2450e8}
.fm-prop-t{margin-top:4px;font-size:16px;font-weight:800;letter-spacing:-0.015em}
.fm-prop-s{margin-top:4px;font-size:13px;line-height:1.45;color:#4a4f58}
.fm-prop-row{margin-top:12px;display:flex;align-items:center;gap:10px}
.fm-prop-st{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700}
.fm-prop-dot{display:inline-block;width:9px;height:9px;border-radius:50%}
.fm-prop-act{margin-left:auto;display:flex;gap:12px;align-items:center}
.fm-prop-open{display:flex;gap:12px;align-items:center}
.fm-notnow{font-size:13px;font-weight:650;color:#4a4f58}
.fm-approve{height:34px;padding:0 16px;border-radius:999px;background:#fff252;font-size:13px;font-weight:800;display:inline-flex;align-items:center;transition:transform 120ms ease}
.fm-prop-done{font-size:12.5px;color:#4a4f58}
.fm-prop-done b{color:#131417;text-decoration:underline}
.fm-input{position:absolute;left:14px;right:14px;bottom:14px;height:50px;border-radius:14px;background:#1533c2;display:flex;align-items:center;padding:0 8px 0 16px;font-size:14px;color:#dbe3ff}
.fm-caret{display:inline-block;width:1.5px;height:16px;background:#fff;vertical-align:-3px;margin-left:1px}
.fm-send{width:36px;height:36px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center}
.fm-cur{position:absolute;z-index:9;pointer-events:none;transition:left 700ms cubic-bezier(.45,0,.25,1),top 700ms cubic-bezier(.45,0,.25,1),transform 120ms ease,opacity 300ms ease}
.fm-sample{position:absolute;left:12px;bottom:10px;z-index:8;font-size:11.5px;font-weight:700;color:#4a4f58;background:rgba(255,255,255,.92);border:1px solid #dfe3ec;border-radius:6px;padding:3px 8px}

/* scene tabs */
.fm-tabs{margin-top:16px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) 44px;gap:24px;align-items:start}
.fm-tab{text-align:left;font-size:14.5px;font-weight:700;letter-spacing:-0.01em;color:#5c626c;padding:6px 0 0}
.fm-tab[aria-pressed="true"]{color:#131417}
.fm-track{display:block;height:2px;margin-top:10px;background:#dfe3ec;border-radius:2px;overflow:hidden}
.fm-fill{display:block;height:100%;width:0;background:#2450e8}
.fm-toggle{grid-column:5;width:36px;height:36px;border-radius:50%;border:1px solid #dfe3ec;display:flex;align-items:center;justify-content:center;background:#fff}
.r-film.dark .fm-tab{color:rgba(255,255,255,.86)}
.r-film.dark .fm-tab[aria-pressed="true"]{color:#fff}
.r-film.dark .fm-fill{background:#fff252}

@keyframes fm-spin{to{transform:rotate(360deg)}}
@keyframes fm-shim{0%{background-position:-300px 0}100%{background-position:300px 0}}
@keyframes fm-nod{0%,100%{transform:translateY(0)}35%{transform:translateY(-2px)}}
@media (max-width:1000px){.fm-tabs{gap:14px}.fm-tab{font-size:13.5px}}
@media (prefers-reduced-motion: reduce){.r-film *{transition:none!important;animation:none!important}}

/* phone: poster and caption */
.r-film-narrow img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:0 20px 50px rgba(8,22,90,.25)}
.r-film-narrow p{margin:10px 0 0;font-size:13px;color:#4a4f58}
.r-film-narrow.dark p{color:rgba(255,255,255,.86)}