/* Self-hosted, subset copies of what the design loads from Google Fonts. See fonts/README.md. */
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:500 800;font-stretch:100%;font-display:swap;src:url(fonts/bricolage-latin.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/figtree-latin.woff2) format('woff2')}
@font-face{font-family:'Caveat';font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/caveat-latin.woff2) format('woff2')}
html,body{margin:0;background:#EEF3FC}
.skip{position:fixed;left:16px;top:-80px;z-index:100;padding:12px 18px;border-radius:12px;background:#14213D;color:#fff;font:700 16px/1 'Figtree',system-ui,sans-serif;text-decoration:none}
.skip:focus{top:16px}
.skip:focus-visible{outline:3px solid #315DCA;outline-offset:2px}
/* Variables the motion script changes every frame live on the one element that reads them and don't
   inherit, so a frame restyles a handful of elements instead of the whole tablet. */
@property --rx{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --ry{syntax:'<angle>';inherits:false;initial-value:0deg}
@property --tx{syntax:'<number>';inherits:false;initial-value:0}
@property --fy{syntax:'<length>';inherits:false;initial-value:0px}
@property --fs{syntax:'<number>';inherits:false;initial-value:1}
@property --fa{syntax:'<number>';inherits:false;initial-value:.16}
@property --mx{syntax:'<length>';inherits:false;initial-value:0px}
@property --my{syntax:'<length>';inherits:false;initial-value:0px}
@property --q{syntax:'<number>';inherits:false;initial-value:0}
@property --px{syntax:'<number>';inherits:false;initial-value:0}
@property --bsy{syntax:'<number>';inherits:false;initial-value:0}
/* Without JavaScript every FAQ answer and step description is open, since nothing can open them. The marker is
   set inline in <head>, before the first paint, so they never render open and then collapse. */
html:not(.js) .lp .qa-a,html:not(.js) .lp .step .more{grid-template-rows:1fr}
html:not(.js) .lp .qa-a>div,html:not(.js) .lp .step .more>span{visibility:visible}
/* The first-check screen keeps its box before it loads (it was as wide as its caption, then grew: a layout
   shift on phones and tablets). Same final size as before: the column, up to the design's 560 px. */
.lp .proof2{width:100%}
/* Keyboard focus: the cobalt ring is invisible on the cobalt waitlist panel and faint on the night panels, so it
   turns butter there; in-page link targets take focus without a ring; focus and anchor jumps stop below the
   fixed header. Nothing here shows until someone uses a keyboard. */
.lp .lens :focus-visible,.lp .cta-panel :focus-visible,.lp .foot :focus-visible{outline-color:var(--butter)}
.lp .totop:focus-visible{outline-offset:0;box-shadow:0 0 0 6px var(--ink)}
.lp [tabindex="-1"]:focus{outline:0}
html{scroll-padding-top:96px}
.lp .copy a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.lp .copy a:hover{color:#fff;text-decoration-thickness:2px}
/* Waitlist: Turnstile's slot (empty unless it needs a tap), errors, and the confirm / leave panel. */
.lp [hidden]{display:none!important}
.lp .wl-ts{width:100%}
.lp .wl-ts:empty{display:none}
.lp .wl-err{margin:0;color:var(--butter);font:600 16px/1.4 var(--ui);text-align:center}
.lp .wl.done .wl-ts,.lp .wl.done .wl-err{display:none}
.lp .wl-link{display:flex;flex-direction:column;align-items:center;gap:20px;margin-top:28px}
.lp .wl-msg{margin:0;color:#fff;font:700 18px/1.3 var(--ui);text-align:center}

/* Slate Notes · landing site · V3 "Campus Dock" (Blue & Butter) · Bricolage Grotesque + Figtree · math in Latin Modern Math
   v2: photoreal tablet + pencil, pencil-stroke background, tilting sketch cards, verdict explorer, site pages */
@property --p{syntax:'<angle>';inherits:false;initial-value:0deg}
.lp{
--bg:#EEF3FC;--paper:#FFFFFF;--soft:#F2F6FC;--soft2:#E3EAF7;--line:#DCE4F2;--line2:#BFCCE4;
--ink:#14213D;--ink2:#465575;--ink3:#5A6987;--night:#0C162B;
--cobalt:#315DCA;--cobalt-soft:#DCE7FF;--cobalt-text:#2447A8;--pen:#1D2F8A;
--butter:#FFD84D;--butter2:#E5B92A;
--ok:#1F7A4D;--ok-soft:#DDF3E7;--ok-ink:#16623D;--warn:#C2410C;--warn-soft:#FFE6D5;--warn-ink:#9A3412;--unk:#5E6678;--unk-soft:#E6E9F0;--unk-ink:#454D5F;
--chalk:#FFD84D;--chalk2:#E5B92A;--chalk-eye:#0C162B;--accent:#315DCA;--gr:#2B3550;
--display:'Bricolage Grotesque','Figtree',system-ui,-apple-system,sans-serif;
--ui:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
--hand:'Caveat','Bradley Hand',cursive;
--math:'Slate LM Math','Latin Modern Math','CMU Serif',serif;
--sh1:0 1px 2px rgba(20,33,61,.06),0 2px 8px rgba(20,33,61,.05);
--sh2:0 8px 24px rgba(36,71,168,.14),0 1px 3px rgba(20,33,61,.08);
--sh3:0 24px 64px rgba(20,33,61,.26),0 3px 10px rgba(36,71,168,.12);
--ease:cubic-bezier(.3,1.2,.4,1);--out:cubic-bezier(.2,.7,.2,1);
--gutter:clamp(20px,4vw,56px);--wrap:1200px;
background:var(--bg);color:var(--ink);font:500 18px/1.55 var(--ui);
-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;position:relative}
.lp *,.lp *::before,.lp *::after{box-sizing:border-box}
.lp img,.lp svg{display:block;max-width:100%}
.lp a{color:inherit;text-decoration:none}
.lp button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit}
.lp h1,.lp h2,.lp h3,.lp h4,.lp p,.lp ul,.lp ol{margin:0;padding:0}
.lp ul,.lp ol{list-style:none}
.lp :focus-visible{outline:3px solid var(--cobalt);outline-offset:3px;border-radius:12px}
.lp .tl{color:var(--cobalt-text);font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.lp .tl:hover{text-decoration-thickness:2.5px}
.lp .tl.on-dark{color:#fff}
.lp .sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lp .wrap{width:100%;max-width:var(--wrap);margin:0 auto}
.lp .sec{padding:clamp(56px,6vw,88px) var(--gutter)}
.lp main,.lp .foot{position:relative;z-index:1}
.lp .m{font-family:var(--math);font-weight:400}
.lp .m i{font-style:italic}
/* natural handwriting, as on the notebook page in the tablet: Caveat in pen ink; the integral sign is drawn because the font has none */
.lp .hw{font-family:var(--hand);font-weight:500;color:var(--pen)}
.lp .hw i{font-style:normal}
.lp .hw sup{font-size:.62em}
.lp .hw .int{display:inline-block;width:.4em;height:1.3em;vertical-align:-.34em;margin:0 .1em 0 .04em;overflow:visible;fill:none;stroke:currentColor;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}
.lp sup,.lp sub{font-size:.68em;line-height:0;position:relative;vertical-align:baseline}
.lp sup{top:-.52em}.lp sub{top:.28em}

.lp{--g-ok:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M22.68 11.3 L22.61 10.6 L22.49 9.91 L22.34 9.23 L22.13 8.56 L21.89 7.91 L21.6 7.27 L21.27 6.65 L20.9 6.06 L20.49 5.49 L20.04 4.94 L19.57 4.43 L19.06 3.96 L18.51 3.51 L17.94 3.1 L17.35 2.73 L16.73 2.4 L16.09 2.11 L15.44 1.87 L14.77 1.66 L14.09 1.51 L13.4 1.39 L12.7 1.32 L12 1.3 L11.3 1.32 L10.6 1.39 L9.91 1.51 L9.23 1.66 L8.56 1.87 L7.91 2.11 L7.27 2.4 L6.65 2.73 L6.06 3.1 L5.49 3.51 L4.94 3.96 L4.43 4.43 L3.96 4.94 L3.51 5.49 L3.1 6.06 L2.73 6.65 L2.4 7.27 L2.11 7.91 L1.87 8.56 L1.66 9.23 L1.51 9.91 L1.39 10.6 L1.32 11.3 L1.3 12 L1.32 12.7 L1.39 13.4 L1.51 14.09 L1.66 14.77 L1.87 15.44 L2.11 16.09 L2.4 16.73 L2.73 17.35 L3.1 17.94 L3.51 18.51 L3.96 19.06 L4.43 19.57 L4.94 20.04 L5.49 20.49 L6.06 20.9 L6.65 21.27 L7.27 21.6 L7.91 21.89 L8.56 22.13 L9.23 22.34 L9.91 22.49 L10.6 22.61 L11.3 22.68 L12 22.7 L12.7 22.68 L13.4 22.61 L14.09 22.49 L14.77 22.34 L15.44 22.13 L16.09 21.89 L16.73 21.6 L17.35 21.27 L17.94 20.9 L18.51 20.49 L19.06 20.04 L19.57 19.57 L20.04 19.06 L20.49 18.51 L20.9 17.94 L21.27 17.35 L21.6 16.73 L21.89 16.09 L22.13 15.44 L22.34 14.77 L22.49 14.09 L22.61 13.4 L22.68 12.7 L22.7 12ZM9.57 16.74 L6.12 13.35 L5.99 13.13 L5.92 12.98 L5.86 12.73 L5.86 12.39 L5.92 12.14 L5.98 11.98 L6.06 11.84 L6.22 11.64 L6.42 11.47 L6.57 11.39 L6.89 11.28 L7.14 11.25 L7.31 11.26 L7.64 11.35 L7.86 11.46 L8 11.57 L10.32 13.85 L16.06 7.85 L16.25 7.69 L16.48 7.56 L16.72 7.48 L16.97 7.45 L17.31 7.49 L17.63 7.61 L17.84 7.75 L18.01 7.94 L18.19 8.23 L18.25 8.39 L18.3 8.64 L18.28 8.98 L18.18 9.3 L18 9.59 L11.29 16.6 L11.09 16.77 L10.87 16.89 L10.54 16.99 L10.2 16.99 L9.87 16.91Z'/%3E%3C/svg%3E");--g-warn:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M13.78 1.89 L13.35 1.58 L12.87 1.36 L12.35 1.24 L12 1.22 L11.65 1.24 L11.13 1.36 L10.81 1.5 L10.36 1.78 L10.09 2.01 L1.89 10.22 L1.67 10.5 L1.42 10.97 L1.31 11.3 L1.22 11.82 L1.24 12.35 L1.31 12.7 L1.42 13.03 L1.67 13.5 L2.01 13.91 L10.22 22.11 L10.65 22.42 L10.97 22.58 L11.3 22.69 L11.82 22.78 L12.35 22.76 L12.7 22.69 L13.03 22.58 L13.5 22.33 L13.91 21.99 L22.11 13.78 L22.42 13.35 L22.58 13.03 L22.69 12.7 L22.78 12.18 L22.76 11.65 L22.64 11.13 L22.42 10.65 L22.11 10.22ZM10.7 12.7 L10.7 6.1 L10.72 5.85 L10.8 5.6 L10.92 5.38 L11.08 5.18 L11.28 5.02 L11.5 4.9 L11.75 4.82 L12 4.8 L12.25 4.82 L12.5 4.9 L12.65 4.97 L12.79 5.07 L12.98 5.24 L13.17 5.53 L13.23 5.68 L13.29 5.93 L13.3 12.7 L13.28 12.95 L13.23 13.12 L13.13 13.35 L12.98 13.56 L12.79 13.73 L12.65 13.83 L12.42 13.93 L12.17 13.99 L11.91 14 L11.66 13.96 L11.43 13.87 L11.21 13.73 L11.08 13.62 L10.92 13.42 L10.8 13.2 L10.72 12.95ZM13.55 17.35 L13.52 17.65 L13.43 17.94 L13.29 18.21 L13.1 18.45 L12.86 18.64 L12.59 18.78 L12.3 18.87 L12 18.9 L11.7 18.87 L11.41 18.78 L11.14 18.64 L10.9 18.45 L10.71 18.21 L10.57 17.94 L10.48 17.65 L10.45 17.35 L10.48 17.05 L10.57 16.76 L10.71 16.49 L10.9 16.25 L11.14 16.06 L11.41 15.92 L11.7 15.83 L12 15.8 L12.3 15.83 L12.59 15.92 L12.86 16.06 L13.1 16.25 L13.29 16.49 L13.43 16.76 L13.52 17.05Z'/%3E%3C/svg%3E");--g-unk:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M9.47 3.62 L10.27 3.42 L11.1 3.3 L10.86 1.31 L9.89 1.46 L9.2 1.62 L8.27 1.92 L7.64 2.17 L8.43 4.01 L8.95 3.8ZM5.81 5.81 L6.42 5.26 L6.87 4.91 L5.67 3.31 L4.9 3.93 L4.39 4.41 L3.93 4.9 L3.31 5.67 L4.91 6.87 L5.26 6.42ZM3.55 9.74 L3.8 8.95 L4.01 8.43 L2.17 7.64 L1.92 8.27 L1.62 9.2 L1.46 9.89 L1.31 10.86 L3.3 11.1 L3.37 10.54ZM3.55 14.26 L3.37 13.46 L3.3 12.9 L1.31 13.14 L1.4 13.81 L1.61 14.77 L1.82 15.44 L2.17 16.36 L4.01 15.57 L3.8 15.05ZM13.3 17.1 L13.21 16.85 L13.07 16.63 L12.89 16.44 L12.68 16.28 L12.43 16.17 L12.18 16.11 L11.91 16.1 L11.65 16.15 L11.4 16.24 L11.18 16.38 L10.99 16.56 L10.83 16.77 L10.72 17.02 L10.66 17.27 L10.65 17.54 L10.7 17.8 L10.79 18.05 L10.93 18.27 L11.11 18.46 L11.32 18.62 L11.57 18.73 L11.82 18.79 L12.09 18.8 L12.35 18.75 L12.6 18.66 L12.82 18.52 L13.01 18.34 L13.17 18.12 L13.28 17.88 L13.34 17.63 L13.35 17.36ZM5.81 18.19 L5.26 17.58 L4.91 17.13 L3.31 18.33 L3.73 18.86 L4.39 19.59 L4.9 20.07 L5.67 20.69 L6.87 19.09 L6.42 18.74ZM9.74 20.45 L8.95 20.2 L8.43 19.99 L7.64 21.83 L8.56 22.18 L9.23 22.39 L9.89 22.54 L10.86 22.69 L11.1 20.7 L10.54 20.63ZM14 3.48 L14.79 3.71 L15.57 4.01 L16.36 2.17 L15.44 1.82 L14.77 1.61 L13.81 1.4 L13.14 1.31 L12.9 3.3 L13.46 3.37ZM18.19 5.81 L18.74 6.42 L19.09 6.87 L20.69 5.67 L20.27 5.14 L19.61 4.41 L19.1 3.93 L18.33 3.31 L17.13 4.91 L17.58 5.26ZM20.45 9.74 L20.63 10.54 L20.7 11.1 L22.69 10.86 L22.54 9.89 L22.38 9.2 L22.08 8.27 L21.83 7.64 L19.99 8.43 L20.2 8.95ZM10.82 8.54 L11.03 8.29 L11.29 8.11 L11.44 8.05 L11.8 7.96 L12.21 7.96 L12.59 8.04 L12.75 8.11 L13.03 8.28 L13.23 8.49 L13.31 8.6 L13.41 8.84 L13.45 9.09 L13.44 9.21 L13.38 9.36 L13.21 9.58 L13.07 9.72 L12.43 10.28 L12.13 10.57 L11.86 10.87 L11.66 11.13 L11.39 11.57 L11.21 11.95 L11.01 12.58 L10.93 13.06 L10.9 13.66 L10.94 13.95 L11.05 14.21 L11.13 14.33 L11.28 14.48 L11.52 14.64 L11.73 14.72 L11.87 14.74 L12.01 14.75 L12.23 14.73 L12.43 14.66 L12.62 14.56 L12.83 14.37 L12.96 14.19 L13.05 13.99 L13.08 13.85 L13.12 13.31 L13.17 13.03 L13.24 12.8 L13.33 12.6 L13.44 12.42 L13.73 12.08 L14.79 11.11 L15.07 10.79 L15.3 10.45 L15.5 10.01 L15.61 9.56 L15.65 9.03 L15.62 8.67 L15.55 8.32 L15.36 7.79 L15.21 7.48 L14.97 7.14 L14.7 6.83 L14.44 6.59 L14 6.28 L13.68 6.12 L13.29 5.96 L12.88 5.84 L12.5 5.78 L11.94 5.75 L11.55 5.78 L11.11 5.85 L10.68 5.98 L10.34 6.13 L9.9 6.39 L9.55 6.66 L9.29 6.93 L8.94 7.39 L8.75 7.73 L8.58 8.15 L8.45 8.6 L8.38 9 L8.35 9.49 L8.36 9.71 L8.44 9.98 L8.54 10.17 L8.68 10.34 L8.85 10.47 L9.04 10.57 L9.25 10.63 L9.46 10.65 L9.68 10.63 L9.88 10.56 L10.07 10.46 L10.19 10.37 L10.33 10.21 L10.47 9.96 L10.54 9.68 L10.56 9.3 L10.6 9.07 L10.66 8.87ZM20.45 14.26 L20.2 15.05 L19.99 15.57 L21.83 16.36 L22.18 15.44 L22.39 14.77 L22.54 14.11 L22.69 13.14 L20.7 12.9 L20.63 13.46ZM18.19 18.19 L17.58 18.74 L17.13 19.09 L18.33 20.69 L19.1 20.07 L19.59 19.61 L20.07 19.1 L20.69 18.33 L19.09 17.13 L18.74 17.58ZM14.26 20.45 L13.46 20.63 L12.9 20.7 L13.14 22.69 L14.11 22.54 L14.77 22.39 L15.44 22.18 L16.36 21.83 L15.57 19.99 L15.05 20.2Z'/%3E%3C/svg%3E")}

/* verdict glyphs + chips (same marks as the app) */
.lp .gl{display:inline-block;width:1em;height:1em;flex:none;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.lp .gl.ok{--m:var(--g-ok);color:var(--ok)}.lp .gl.warn{--m:var(--g-warn);color:var(--warn)}.lp .gl.unk{--m:var(--g-unk);color:var(--unk)}
.lp .vw{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 11px 0 7px;border-radius:999px;font:700 12.5px/1 var(--ui);white-space:nowrap;text-transform:lowercase}
.lp .vw::before{content:"";width:15px;height:15px;flex:none;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.lp .vw.ok{--m:var(--g-ok);background:var(--ok-soft);color:var(--ok-ink)}
.lp .vw.warn{--m:var(--g-warn);background:var(--warn-soft);color:var(--warn-ink)}
.lp .vw.unk{--m:var(--g-unk);background:var(--unk-soft);color:var(--unk-ink)}

/* ---------- Chalk mascot (from the app kit) ---------- */
.lp .mascot{display:inline-block;flex:none;line-height:0}
.lp .mascot svg{width:100%;height:auto;display:block}
.lp .mascot .cb{fill:var(--chalk)}
.lp .mascot .cs{fill:var(--ink);opacity:.1}
.lp .mascot .arm{fill:none;stroke:var(--chalk2);stroke-width:14;stroke-linecap:round}
.lp .mascot .eye{fill:var(--chalk-eye)}
.lp .mascot .ey{fill:none;stroke:var(--chalk-eye);stroke-width:9;stroke-linecap:round}
.lp .mascot .e-i,.lp .mascot .e-h,.lp .mascot .e-s,.lp .mascot .e-x,.lp .mascot .e-t,.lp .mascot .al-dn,.lp .mascot .al-up,.lp .mascot .ar-dn,.lp .mascot .ar-up,.lp .mascot .ar-hold,.lp .mascot .prop-mag,.lp .mascot .prop-tick,.lp .mascot .prop-spark{display:none}
.lp .mascot.m-idle .e-i,.lp .mascot.m-wave .e-i{display:inline}
.lp .mascot.m-happy .e-h,.lp .mascot.m-cheer .e-h{display:inline}
.lp .mascot.m-idle .al-dn,.lp .mascot.m-idle .ar-dn,.lp .mascot.m-happy .al-dn,.lp .mascot.m-happy .ar-dn{display:inline}
.lp .mascot.m-wave .al-dn{display:inline}
.lp .mascot.m-wave .ar-up,.lp .mascot.m-cheer .ar-up,.lp .mascot.m-cheer .al-up{display:inline}
.lp .mascot.m-cheer .prop-spark{display:inline}
.lp .mascot .prop-spark path{fill:none;stroke:var(--butter2);stroke-width:7;stroke-linecap:round}
.lp .mascot .eye{transform-box:fill-box;transform-origin:center}

/* ---------- Buttons ---------- */
.lp .btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:999px;
background:var(--butter);color:var(--ink);font:700 16px/1 var(--ui);letter-spacing:-.005em;white-space:nowrap;cursor:pointer;
transition:filter .15s,box-shadow .2s}
.lp .btn:hover{filter:brightness(1.03)}
.lp .btn:active{filter:brightness(.96)}
.lp .btn-sm{min-height:44px;padding:0 18px;font-size:15px}
.lp .btn-magnet{width:180px;height:56px;min-height:56px;padding:0;border-radius:28px;font-size:17px;
box-shadow:0 6px 16px rgba(229,185,42,.35);transform:translate3d(var(--mx,0px),var(--my,0px),0);will-change:transform;z-index:2}
.lp .btn-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 6px;font:700 16px/1 var(--ui);color:var(--ink);border-radius:12px}
.lp .btn-link svg{width:18px;height:18px;transition:transform .25s var(--ease)}
.lp .btn-link:hover svg{transform:translateY(3px)}
.lp .btn-ghost{background:#fff;box-shadow:inset 0 0 0 1.5px var(--line2)}

/* ---------- Header: floating pill ---------- */
.lp .lp-hdr{position:fixed;top:14px;left:0;right:0;z-index:60;display:flex;justify-content:center;padding:0 12px;pointer-events:none}
.lp .lp-pill{pointer-events:auto;display:flex;align-items:center;gap:4px;height:60px;padding:8px 8px 8px 20px;max-width:100%;
background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:999px;box-shadow:var(--sh2);transition:box-shadow .3s,transform .3s}
.lp.sc .lp-pill{box-shadow:0 12px 32px rgba(36,71,168,.2),0 1px 3px rgba(20,33,61,.1)}
.lp .lp-logo{display:flex;align-items:center;min-height:44px;margin-right:12px;border-radius:12px}
.lp .lp-logo img{height:28px;width:auto}
.lp .lp-nav{display:flex;gap:2px;margin-right:6px}
.lp .lp-nav a{display:flex;align-items:center;min-height:44px;padding:0 14px;border-radius:999px;font:600 15px/1 var(--ui);color:var(--ink2);transition:background .2s,color .2s}
.lp .lp-nav a:hover{background:var(--soft);color:var(--ink)}
.lp .lp-nav a.on{background:var(--cobalt-soft);color:var(--cobalt-text)}

/* ---------- Background: drifting paper grid, soft light, pencil sketches that draw and erase, small marks that drift ---------- */
.lp .bgfx{position:absolute;left:0;right:0;top:0;bottom:0;overflow:hidden;pointer-events:none;z-index:0;--px:0;--sy:0}
.lp .bg-grid{position:absolute;left:-40px;right:-40px;top:-40px;height:980px;opacity:.55;
background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:40px 40px;
-webkit-mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.65) 38%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.65) 38%,transparent 100%)}
.lp .bg-grid.b{top:auto;bottom:0;height:900px;opacity:.4;-webkit-mask-image:linear-gradient(to top,#000 0%,rgba(0,0,0,.5) 40%,transparent 100%);mask-image:linear-gradient(to top,#000 0%,rgba(0,0,0,.5) 40%,transparent 100%)}
.lp .aur{position:absolute;width:min(920px,86vw);aspect-ratio:1;border-radius:50%;opacity:.9;will-change:transform}
.lp .aur.a1{left:-14%;top:-3%;background:radial-gradient(closest-side,rgba(120,160,255,.34),rgba(120,160,255,0))}
.lp .aur.a2{right:-16%;top:5%;background:radial-gradient(closest-side,rgba(255,216,77,.30),rgba(255,216,77,0))}
.lp .aur.a3{left:-10%;top:47%;background:radial-gradient(closest-side,rgba(150,185,255,.26),rgba(150,185,255,0))}
.lp .aur.a4{right:-14%;top:74%;background:radial-gradient(closest-side,rgba(255,216,77,.22),rgba(255,216,77,0))}
.lp .aur.a5{right:-12%;top:30%;width:min(760px,70vw);background:radial-gradient(closest-side,rgba(130,170,255,.26),rgba(130,170,255,0))}
.lp .aur.a6{left:-12%;top:89%;width:min(760px,70vw);background:radial-gradient(closest-side,rgba(255,216,77,.20),rgba(255,216,77,0))}

/* pencil sketches: each path is drawn twice (a firm pass and a faint ghost pass) so the line looks hand-made */
.lp .dd{position:absolute;overflow:visible;
transform:translate3d(calc(var(--px,0)*var(--z,.5)*1px),calc(var(--bsy,0)*var(--z,.5)*-.07px),0);will-change:transform}
.lp .dd path,.lp .dd circle{fill:none;stroke:var(--gr);stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;opacity:.5}
.lp .dd .g{opacity:.26;stroke-width:1.2;transform:translate(1.5px,-1.2px)}
.lp .dd .c-pen{stroke:var(--cobalt)}
.lp .dd .c-hl{stroke:var(--butter2);stroke-width:6;opacity:.85}
.lp .dd .c-ok{stroke:var(--ok)}.lp .dd .c-wn{stroke:var(--warn)}
.lp .dd .dot{fill:var(--cobalt);stroke:none;opacity:.7}
.lp .dd .dsh{stroke-dasharray:3 6}
@media (prefers-reduced-motion:no-preference){
.lp.js .dd path:not(.dsh){stroke-dasharray:1;stroke-dashoffset:1}
.lp.js .dd.on path:not(.dsh){animation:lp-draw var(--dur,10s) cubic-bezier(.4,0,.2,1) infinite;animation-delay:calc(var(--dl,0s) + var(--k,0)*.5s)}
.lp.js .dd .dot{opacity:0}
.lp.js .dd.on .dot{animation:lp-dot var(--dur,10s) ease infinite;animation-delay:calc(var(--dl,0s) + var(--k,3)*.5s)}
.lp .aur{animation:lp-drift 26s ease-in-out infinite alternate}
.lp .aur.a2{animation-duration:31s;animation-delay:-9s}.lp .aur.a3{animation-duration:34s;animation-delay:-14s}.lp .aur.a4{animation-duration:29s;animation-delay:-4s}
.lp .aur.a5{animation-duration:37s;animation-delay:-20s}.lp .aur.a6{animation-duration:32s;animation-delay:-11s}
.lp .bg-grid{animation:lp-grid 40s linear infinite}
}
@keyframes lp-draw{0%{stroke-dashoffset:1}16%,72%{stroke-dashoffset:0}88%{stroke-dashoffset:-1}100%{stroke-dashoffset:-1}}
@keyframes lp-dot{0%,14%{opacity:0;transform:scale(.4)}22%,72%{opacity:.7;transform:scale(1)}88%,100%{opacity:0;transform:scale(.4)}}
@keyframes lp-drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(60px,40px,0) scale(1.08)}}
@keyframes lp-grid{to{transform:translate3d(40px,40px,0)}}
.lp .dd .dot{transform-box:fill-box;transform-origin:center}
/* things that keep moving on a sketch: electrons, a dot on a wave (keyframes are generated, see motion.py) and rising bubbles */
.lp .dd .el{fill:var(--cobalt);stroke:none;opacity:.85}
.lp .dd .el.o{fill:var(--butter2)}
.lp .dd .bub{fill:none;stroke:var(--cobalt);stroke-width:1.6;opacity:.55}
@media (prefers-reduced-motion:no-preference){
.lp.js .dd.on .bub{animation:lp-bub 4.6s ease-in infinite}
.lp.js .dd.on .bub.b2{animation-duration:5.4s;animation-delay:-1.8s}.lp.js .dd.on .bub.b3{animation-duration:3.8s;animation-delay:-2.9s}
}
@keyframes lp-bub{0%{translate:0 0;opacity:0;scale:.6}15%{opacity:.7}85%{opacity:.4}100%{translate:3px -46px;opacity:0;scale:1.15}}
.lp .bub{transform-box:fill-box;transform-origin:center}
/* small marks that drift and turn slowly, scattered down the page */
.lp .fx{position:absolute;display:block;opacity:var(--o,.5);pointer-events:none}
.lp .fx svg{width:100%;height:100%;fill:none;stroke:var(--c,var(--gr));stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (prefers-reduced-motion:no-preference){
.lp .fx{animation:lp-fxbob var(--t,12s) ease-in-out var(--d,0s) infinite alternate}
}
@keyframes lp-fxbob{from{translate:0 0;rotate:0deg}to{translate:var(--dx,6px) var(--dy,-18px);rotate:var(--r,14deg)}}

@media (max-width:1280px){.lp .dd{opacity:.55}}
@media (max-width:900px){.lp .dd{display:none}.lp i.fx:nth-of-type(n+9){display:none}}

/* ---------- Hero text ---------- */
.lp .hero{position:relative;padding:clamp(112px,9vw,132px) var(--gutter) 0;text-align:center}
.lp .hero-in{position:relative;max-width:1040px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.lp .eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);
font:700 14px/1 var(--ui);color:var(--ink2);box-shadow:var(--sh1)}
.lp .eyebrow .dot{position:relative;width:10px;height:10px;border-radius:50%;background:var(--butter);box-shadow:0 0 0 3px rgba(255,216,77,.35)}
.lp .eyebrow .dot::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--butter2);opacity:0}
.lp .h1{font:800 clamp(42px,6.2vw,90px)/1 var(--display);letter-spacing:-.035em;margin-top:22px;max-width:14em;text-wrap:balance}
.lp .h1 .ln{display:block}
.lp .nw{display:inline-block}
.lp .lead{font:500 clamp(17px,1.55vw,21px)/1.55 var(--ui);color:var(--ink2);max-width:35em;margin-top:22px;text-wrap:pretty}
.lp .cta-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 22px;margin-top:30px}
.lp .micro{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 24px;margin-top:18px;font:600 14.5px/1.3 var(--ui);color:var(--ink3)}
.lp .micro li{display:inline-flex;align-items:center;gap:8px}
.lp .micro svg{width:16px;height:16px;color:var(--cobalt)}
@media (prefers-reduced-motion:no-preference){
.lp .hero-in>*{animation:lp-rise .85s var(--out) both}
.lp .hero-in>.eyebrow{animation-delay:.04s}.lp .hero-in>.h1{animation-delay:.12s}.lp .hero-in>.lead{animation-delay:.22s}
.lp .hero-in>.cta-row{animation-delay:.3s}.lp .hero-in>.micro{animation-delay:.38s}
.lp .stage{animation:lp-rise 1.1s var(--out) .42s both}
.lp .eyebrow .dot::after{animation:lp-ping 2.8s ease-out 1s infinite}
.lp .btn-magnet::after,.lp .btn.shine::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.55),rgba(255,255,255,0));transform:skewX(-18deg);animation:lp-shine 6s ease-in-out 2s infinite;pointer-events:none}
}
/* Join the waitlist button: a short jiggle each time the page comes back to the very top (fx.js adds .jig) */
@media (prefers-reduced-motion:no-preference){.lp .btn-magnet.jig{animation:lp-jig .85s cubic-bezier(.3,.7,.4,1)}}
@keyframes lp-jig{0%{rotate:0deg;scale:1}14%{rotate:-4.2deg;scale:1.07}30%{rotate:3.4deg;scale:1.05}46%{rotate:-2.5deg;scale:1.035}62%{rotate:1.6deg;scale:1.018}78%{rotate:-.8deg;scale:1.006}100%{rotate:0deg;scale:1}}
@keyframes lp-rise{from{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:none}}
@keyframes lp-ping{0%{transform:scale(.7);opacity:.8}70%,100%{transform:scale(2.3);opacity:0}}
@keyframes lp-shine{0%,62%{translate:0 0}100%{translate:475% 0}}

/* ---------- Stage: tablet + pencil ---------- */
.lp .stage{--spb:clamp(40px,4.5vw,64px);position:relative;max-width:1080px;margin:clamp(0px,1vw,12px) auto 0;padding:clamp(34px,6.4vw,92px) 0 var(--spb)}
.lp .stage::before{content:"";position:absolute;left:-10%;right:-10%;top:6%;bottom:-8%;pointer-events:none;background:radial-gradient(50% 46% at 50% 54%,rgba(110,150,255,.30),rgba(110,150,255,0) 74%)}
.lp .dv-wrap{position:relative;container-type:inline-size;width:100%;max-width:1040px;margin:0 auto;z-index:2;
--sx:962;--sy:-56;--sa:180deg;--lz:-1.05cqw;--pl:56cqw}
.lp .fl{transform:translate3d(0,var(--fy,0px),0);will-change:transform}
.lp .ground{position:absolute;left:9%;right:9%;bottom:-3.2cqw;height:4.4cqw;border-radius:50%;z-index:0;
background:radial-gradient(closest-side,rgba(20,33,61,calc(var(--fa,.16)*3.1)),rgba(20,33,61,calc(var(--fa,.16)*1.2)) 55%,rgba(20,33,61,0));transform:scale(var(--fs,1))}
.lp .dv-float{position:relative;z-index:1;aspect-ratio:100/71.65}
.lp .dv-tilt{position:absolute;inset:0;transform-style:preserve-3d;
transform:perspective(210cqw) rotateX(calc(var(--bx,-4.5deg) + var(--rx,0deg))) rotateY(calc(var(--by,7deg) + var(--ry,0deg)))}

/* aluminium body: 10 slices give the edge real thickness when the tablet tilts */
.lp .dv-sl{position:absolute;inset:0;border-radius:4.3cqw;transform:translateZ(calc(var(--i)*-.21cqw));
background:linear-gradient(112deg,#868c9b 0%,#5b6070 14%,#383c48 38%,#23252d 64%,#121318 100%)}
.lp .dv-bk{position:absolute;inset:0;border-radius:4.3cqw;background:#06070a;transform:translateZ(-2.3cqw);
box-shadow:0 5cqw 8cqw -3cqw rgba(20,33,61,.5),0 1.4cqw 3cqw rgba(20,33,61,.28)}
/* buttons on the edges: two volume keys on the top edge, the top button on the left edge */
.lp .dv-bt{position:absolute;border-radius:.55cqw;transform:translateZ(-1.05cqw);box-shadow:0 0 .22cqw rgba(0,0,0,.6)}
.lp .dv-bt.vb1,.lp .dv-bt.vb2{top:-.36cqw;width:4.5cqw;height:1.3cqw;background:linear-gradient(180deg,#8d93a2 0%,#5d6270 34%,#343843 78%,#20222a 100%)}
.lp .dv-bt.vb1{left:10.4cqw}.lp .dv-bt.vb2{left:16cqw}
.lp .dv-bt.pw{left:-.36cqw;top:7.4cqw;width:1.3cqw;height:5.6cqw;background:linear-gradient(90deg,#8d93a2 0%,#5d6270 34%,#343843 78%,#20222a 100%)}

/* front: metal rim, black glass, display, camera, reflections */
.lp .dv-face{position:absolute;inset:0;border-radius:4.3cqw;transform:translateZ(.03cqw);
background:linear-gradient(118deg,#9ba1b0 0%,#6b717f 12%,#3a3e4a 36%,#24262e 62%,#121318 100%);
box-shadow:inset 0 0 0 .05cqw rgba(255,255,255,.18)}
.lp .dv-glass{position:absolute;inset:.3cqw;border-radius:4cqw;background:radial-gradient(130% 120% at 30% 0%,#0b0c11 0%,#030305 56%,#010102 100%);
box-shadow:inset 0 .1cqw 0 rgba(255,255,255,.14),inset 0 0 0 .07cqw rgba(255,255,255,.05)}
.lp .dv-scr{position:absolute;left:3cqw;top:3cqw;width:94cqw;height:65.65cqw;border-radius:2.15cqw;overflow:hidden;background:#DCE6F7;--u:.078727cqw;
box-shadow:0 0 0 .1cqw #000,0 0 2.6cqw rgba(110,150,255,.18)}
.lp .dv-pg{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
.lp .dv-cam{position:absolute;left:50%;top:1.5cqw;width:0;height:0}
.lp .dv-cam i{position:absolute;display:block;transform:translate(-50%,-50%)}
.lp .dv-cam .c1{left:-3.9cqw;top:0;width:2.5cqw;height:.64cqw;border-radius:.32cqw;background:linear-gradient(#14171f,#07080c);box-shadow:inset 0 .06cqw 0 rgba(255,255,255,.1)}
.lp .dv-cam .c2{left:0;top:0;width:.8cqw;height:.8cqw;border-radius:50%;background:radial-gradient(circle at 34% 30%,#8497ff 0 7%,#2a3270 20%,#0b0d20 58%,#04050a 100%);box-shadow:0 0 0 .13cqw #1d2029,0 0 0 .23cqw #07080c}
.lp .dv-cam .c3{left:2cqw;top:0;width:.34cqw;height:.34cqw;border-radius:50%;background:#10121a;box-shadow:inset 0 0 0 .05cqw #2a2e3b}
.lp .dv-cam .c4{left:3cqw;top:0;width:.26cqw;height:.26cqw;border-radius:50%;background:#0d0f16;box-shadow:inset 0 0 0 .04cqw #232734}
.lp .dv-gl{position:absolute;left:.3cqw;top:.3cqw;right:.3cqw;bottom:.3cqw;border-radius:4cqw;overflow:hidden;pointer-events:none;
background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,0) 20%),linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,0) 14%)}
.lp .dv-gl i{position:absolute;left:-30%;top:-25%;width:80%;height:150%;transform:translateX(calc(var(--tx,0)*18%)) skewX(-9deg);
background:linear-gradient(100deg,rgba(255,255,255,0) 28%,rgba(255,255,255,.085) 46%,rgba(255,255,255,.02) 58%,rgba(255,255,255,0) 68%)}
@media (prefers-reduced-motion:no-preference){.lp .dv-gl i{animation:lp-sheen 15s ease-in-out 3s infinite}}
@keyframes lp-sheen{0%,58%{translate:-20% 0}100%{translate:150% 0}}

/* what the app shows on the screen: the lasso, the Check sheet and its marks (design space 1194 x 834). All of it is still. */
.lp .dv-lasso{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible}
.lp .dv-lasso .lf{fill:rgba(49,93,202,.09);stroke:none}
.lp .dv-lasso .ld{fill:none;stroke:var(--accent);stroke-width:2.6;stroke-dasharray:8 6;stroke-linecap:round;stroke-linejoin:round}
.lp .dv-sheet{position:absolute;left:calc(var(--u)*100);top:calc(var(--u)*330);width:calc(var(--u)*994);height:calc(var(--u)*504)}
.lp .dv-mk{position:absolute;width:calc(var(--u)*30);height:calc(var(--u)*30);left:calc(var(--u)*850);background:var(--ok);-webkit-mask:var(--g-ok) center/contain no-repeat;mask:var(--g-ok) center/contain no-repeat}
.lp .dv-mk.m1{top:calc(var(--u)*83)}
.lp .dv-mk.m2{top:calc(var(--u)*165)}
.lp .dv-mk.m3{top:calc(var(--u)*247);background:var(--warn);-webkit-mask-image:var(--g-warn);mask-image:var(--g-warn)}
.lp .dv-mk.m4{top:calc(var(--u)*329);background:var(--unk);-webkit-mask-image:var(--g-unk);mask-image:var(--g-unk)}
.lp .dv-band{position:absolute;left:calc(var(--u)*836);width:calc(var(--u)*6);height:calc(var(--u)*58);border-radius:calc(var(--u)*3)}
.lp .dv-band.wn{top:calc(var(--u)*233);background:var(--warn)}
.lp .dv-band.un{top:calc(var(--u)*315);background:repeating-linear-gradient(to bottom,var(--unk) 0 calc(var(--u)*7),transparent calc(var(--u)*7) calc(var(--u)*13))}

/* the Pencil: white, matte, tapered nose. It rests on the top edge of the tablet, pointing left, and stays there.
   --sx / --sy place its tip in screen units (design space 1194 x 834), --sa turns it, --lz sets how far it sits in front of or behind the glass. */
.lp .dv-up{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none;--u:.078727cqw}
.lp .sty-pos{position:absolute;left:calc(3cqw + var(--sx)*var(--u));top:calc(3cqw + var(--sy)*var(--u));width:0;height:0}
.lp .sty-pos.bd{transform:translateZ(var(--lz))}
.lp .sty{position:absolute;left:0;top:calc(var(--pl)*-.02946);width:var(--pl);height:calc(var(--pl)*.0589);transform-origin:0 50%;transform:rotate(var(--sa))}
.lp .sty svg{width:100%;height:100%;overflow:visible}

/* floating chip + Chalk badge (#096) */
.lp .chip{position:absolute;z-index:4;left:-2.8cqw;top:10cqw;display:flex;align-items:center;gap:10px;padding:10px 18px 10px 12px;border-radius:999px;background:#fff;
box-shadow:0 8px 20px rgba(20,33,61,.18),0 0 0 1px var(--line);font:700 15px/1 var(--ui);color:var(--ink);text-align:left}
.lp .chip .gl{font-size:26px;color:var(--ok)}
.lp .badge{position:absolute;z-index:4;right:-5cqw;bottom:7cqw;width:clamp(78px,11.2cqw,118px)}

/* 3D marker strokes behind the tablet */
.lp .dv-tubes{position:absolute;left:-14cqw;top:-16cqw;width:128cqw;height:104cqw;transform:translateZ(-6cqw);overflow:visible;pointer-events:none}
.lp .tb path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.lp .tb .s{stroke:rgba(20,33,61,.22);filter:url(#lp-blur)}
.lp .tb.y .s{stroke-width:30;transform:translate(12px,30px)}.lp .tb.p .s{stroke-width:20;transform:translate(10px,26px)}.lp .tb.g .s{stroke-width:5;transform:translate(8px,20px)}
.lp .tb.y .h{transform:translate(-4px,-6px)}.lp .tb.p .h{transform:translate(-3px,-5px)}
@media (prefers-reduced-motion:no-preference){.lp .dv-tubes{animation:lp-sway 9s ease-in-out infinite alternate}}
@keyframes lp-sway{from{translate:0 -.5cqw;rotate:-.35deg}to{translate:0 .6cqw;rotate:.35deg}}
.lp .tb.y .b{stroke:#D9A91C;stroke-width:30}.lp .tb.y .m{stroke:var(--butter);stroke-width:25}.lp .tb.y .h{stroke:rgba(255,255,255,.7);stroke-width:5;stroke-dasharray:90 22 40 30}
.lp .tb.p .b{stroke:var(--pen);stroke-width:20}.lp .tb.p .m{stroke:var(--cobalt);stroke-width:16}.lp .tb.p .h{stroke:rgba(255,255,255,.4);stroke-width:4;stroke-dasharray:70 24 30 26}
.lp .tb.g .m{stroke:var(--gr);stroke-width:5;opacity:.7}.lp .tb.g .h{stroke:rgba(255,255,255,.5);stroke-width:1.6}
@media (prefers-reduced-motion:no-preference){
.lp.js .tb .b,.lp.js .tb .m,.lp.js .tb .s{stroke-dasharray:1;stroke-dashoffset:1;animation:lp-tube 1.5s var(--out) var(--dl,.9s) forwards}
.lp.js .tb .h{opacity:0;animation:lp-fade .6s ease calc(var(--dl,.9s) + 1s) forwards}
}
@keyframes lp-tube{to{stroke-dashoffset:0}}
@keyframes lp-fade{to{opacity:1}}

/* ---------- Section heads ---------- */
.lp .sec-head{display:flex;flex-direction:column;align-items:center;text-align:center}
.lp .label{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:0 14px;border-radius:999px;background:#fff;border:1px solid var(--line);
font:700 12.5px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--cobalt-text)}
.lp .h2{font:800 clamp(34px,4.5vw,62px)/1.02 var(--display);letter-spacing:-.035em;margin-top:20px;text-wrap:balance}
.lp .sub{font:500 clamp(17px,1.5vw,20px)/1.55 var(--ui);color:var(--ink2);max-width:34em;margin-top:18px;text-wrap:pretty}

/* ---------- Highlighter (#080) ---------- */
.lp mark.hl{background-color:transparent;color:inherit;padding:0;margin:0;
background-image:linear-gradient(var(--butter),var(--butter));background-repeat:no-repeat;background-position:0 var(--hy,.55em);
background-size:calc(var(--q,0) * 100%) .55em}
.lp .h1 mark.hl,.lp .h2 mark.hl{--hy:.53em}
.lp .note mark.hl{--hy:.55em;color:var(--ink)}

/* ---------- Reveal on scroll (fx.js adds .in) ---------- */
@media (prefers-reduced-motion:no-preference){
.lp.js .rv{opacity:0;translate:0 24px;transition:opacity .8s var(--out) var(--d,0s),translate .9s var(--out) var(--d,0s)}
.lp.js .rv.in{opacity:1;translate:0 0}
}

/* ---------- How it works ---------- */
.lp .how-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:center;margin-top:clamp(32px,4vw,48px)}
.lp .steps{display:grid;gap:10px}
.lp .step{display:grid;grid-template-columns:48px minmax(0,1fr);gap:18px;align-items:start;padding:20px 22px;border-radius:26px;border:1px solid transparent;
transition:background .25s,box-shadow .25s,border-color .25s;width:100%}
.lp .step:hover{background:rgba(255,255,255,.6)}
.lp .step .n{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--soft2);color:var(--ink2);font:800 21px/1 var(--display);transition:background .25s,color .25s}
.lp .step .t{display:block;font:800 26px/1.15 var(--display);letter-spacing:-.025em;padding-top:9px;color:var(--ink2);transition:color .25s}
.lp .step .more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease)}
.lp .step .more>span{overflow:hidden;display:block;min-height:0;visibility:hidden;transition:visibility 0s .35s}
.lp .step.on .more>span{visibility:visible;transition-delay:0s}
.lp .step .more .d{display:block;padding-top:8px;color:var(--ink2);font-size:17px;line-height:1.5}
.lp .step.on{background:#fff;border-color:var(--line);box-shadow:var(--sh2)}
.lp .step.on .n{background:var(--butter);color:var(--ink)}
@media (prefers-reduced-motion:no-preference){.lp .step.on .n{animation:lp-pop .55s var(--ease)}}
@keyframes lp-pop{0%{transform:scale(.7)}60%{transform:scale(1.14)}100%{transform:scale(1)}}
.lp .step.on .t{color:var(--ink)}
.lp .step.on .more{grid-template-rows:1fr}
/* the smaller tablet (flat, same bezel and camera as the hero tablet) */
.lp .mini{position:relative;container-type:inline-size;aspect-ratio:100/71.65;width:100%}
.lp .mini .dv-face{filter:drop-shadow(0 2.4cqw 3cqw rgba(20,33,61,.3))}
.lp .mini .scr{position:absolute;inset:0;display:grid}
.lp .mini .scr img{grid-area:1/1;width:100%;height:100%;opacity:0;transition:opacity .55s ease}
.lp .mini .scr img.on{opacity:1}

/* ---------- Math Lens: navy band + verdict explorer ---------- */
.lp .lens-wrap{padding:0 clamp(12px,2vw,28px)}
.lp .lens{position:relative;overflow:hidden;background:var(--night);color:#fff;border-radius:clamp(28px,4vw,56px);padding:clamp(36px,5vw,72px) clamp(20px,5vw,72px);max-width:1380px;margin:0 auto}
.lp .lens::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:radial-gradient(rgba(255,255,255,.14) 1.2px,transparent 1.6px);background-size:30px 30px;
-webkit-mask-image:linear-gradient(120deg,transparent 10%,#000 70%);mask-image:linear-gradient(120deg,transparent 10%,#000 70%)}
.lp .lens-ring{position:absolute;right:-200px;top:-220px;width:640px;height:640px;pointer-events:none;opacity:.9}
.lp .lens-ring circle{fill:none;stroke:rgba(255,255,255,.1);stroke-width:1.4}
.lp .lens-ring .dsh{stroke:rgba(255,216,77,.34);stroke-width:2;stroke-dasharray:2 12;stroke-linecap:round}
@media (prefers-reduced-motion:no-preference){.lp .lens-ring{animation:lp-spin 110s linear infinite}}
@keyframes lp-spin{to{transform:rotate(360deg)}}
.lp .lens-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,5vw,72px);align-items:center}
.lp .lens .label{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);color:var(--butter)}
.lp .lens .h2{margin-top:20px;font-size:clamp(34px,3.8vw,52px)}
.lp .lens .h2 .ln{display:block}
.lp .lens .h2 em{font-style:normal;color:var(--butter)}
.lp .lens .sub{color:#C8D4EC;max-width:30em;margin-top:20px}
.lp .vx{display:grid;gap:8px;margin-top:28px}
.lp .vx button{--vr:rgba(255,255,255,.4);display:grid;grid-template-columns:48px minmax(0,1fr);gap:16px;align-items:center;width:100%;padding:12px 18px 12px 12px;border-radius:24px;color:#fff;
border:1.5px solid rgba(255,255,255,.13);background:rgba(255,255,255,.04);transition:background .25s,border-color .25s}
.lp .vx button:hover{background:rgba(255,255,255,.08)}
.lp .vx button.v-ok{--vr:#5FD39B}.lp .vx button.v-warn{--vr:#FF9F6B}.lp .vx button.v-unk{--vr:#B6C0D6}
.lp .vx button[aria-pressed=true]{background:rgba(255,255,255,.1);border-color:var(--vr)}
.lp .vx .vg{width:48px;height:48px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:32px;transition:transform .4s var(--ease)}
.lp .vx button[aria-pressed=true] .vg{transform:scale(1.1)}
.lp .vx .vt{display:grid;justify-items:start;gap:6px}
.lp .vx .vd{font:500 15.5px/1.45 var(--ui);color:#C8D4EC}
.lp .lens-note{margin-top:20px;font:500 15px/1.5 var(--ui);color:#AEBDDB;max-width:30em}
.lp .rc{position:relative;background:#fff;color:var(--ink);border-radius:30px;padding:22px 22px 20px;max-width:600px;margin-left:auto;width:100%;
box-shadow:0 32px 70px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.06)}
.lp .rc-hd b{display:block;font:800 17px/1.2 var(--ui)}
.lp .rc-hd span{display:block;font:500 13px/1.4 var(--ui);color:var(--ink3);margin-top:2px}
.lp .rc-ban{display:none;align-items:center;gap:14px;margin-top:14px;padding:14px 18px 14px 14px;border-radius:22px;box-shadow:inset 0 0 0 1.5px var(--vring);background:linear-gradient(118deg,var(--vb1),var(--vb2))}
.lp .rc.s0 .b0,.lp .rc.s1 .b1,.lp .rc.s2 .b2{display:flex}
@media (prefers-reduced-motion:no-preference){.lp .rc.s0 .b0,.lp .rc.s1 .b1,.lp .rc.s2 .b2{animation:lp-in .5s var(--out)}}
@keyframes lp-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.lp .rc-ban .vi{width:54px;height:54px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:36px;flex:none}
.lp .rc-ban b{display:block;font:800 20px/1.15 var(--ui);letter-spacing:-.01em}
.lp .rc-ban p{font:500 14.5px/1.4 var(--ui);color:var(--ink2);margin-top:3px;text-wrap:pretty}
.lp .rc-ban.ok{--vb1:#EEF9F3;--vb2:#DDF3E7;--vring:rgba(31,122,77,.24)}
.lp .rc-ban.warn{--vb1:#FFF3E9;--vb2:#FFE6D5;--vring:rgba(194,65,12,.26)}
.lp .rc-ban.unk{--vb1:#F3F5F9;--vb2:#E6E9F0;--vring:rgba(94,102,120,.30)}
.lp .trk{display:flex;gap:6px;margin-top:10px}
.lp .trk i{width:40px;height:6px;border-radius:3px;background:var(--ok)}
.lp .trk i.bad{background:var(--warn)}
.lp .trk i.unk{background:repeating-linear-gradient(90deg,var(--unk) 0 4px,transparent 4px 7px)}
.lp .rail{margin-top:12px;display:grid;gap:2px}
.lp .rail li{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:start;padding:10px 12px 10px 8px;border-radius:16px;transition:background .4s}
.lp .rail .n{position:relative;font-size:30px;display:block;height:30px}
.lp .rail li:not(:last-child) .n::after{content:"";position:absolute;left:50%;top:34px;bottom:-26px;width:2px;margin-left:-1px;background:rgba(31,122,77,.42)}
.lp .rail li.bad .n::after,.lp .rail li.unk .n::after{background:repeating-linear-gradient(to bottom,rgba(94,102,120,.62) 0 4px,transparent 4px 8px)}
.lp .rail li.bad{background:linear-gradient(118deg,#FFF3EA,#FFE9DA);box-shadow:inset 0 0 0 1.5px rgba(194,65,12,.22)}
.lp .vsb{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;row-gap:3px;min-height:30px}
.lp .vsb .ex{font:500 27px/27px var(--hand);color:var(--pen)}
.lp .vsb .why{grid-column:1/-1;font:600 13px/1.3 var(--ui);color:var(--ink3)}
.lp .cul{color:var(--warn-ink);background:linear-gradient(transparent 14%,rgba(194,65,12,.2) 14% 90%,transparent 90%);border-radius:5px;padding:0 .06em}
.lp .uq{text-decoration:underline dotted var(--unk);text-decoration-thickness:2px;text-underline-offset:3px;background:rgba(118,130,147,.16);border-radius:3px;padding:0 1px;margin-right:2px}
/* in handwriting the dashed box goes around the little 2 itself, not the whole line box */
.lp .hw .uq{outline:0;padding:0;margin:0}
.lp .hw .uq sup{display:inline-block;line-height:.9;padding:0 3px;margin:0 2px 0 1px;text-decoration:underline dotted var(--unk);text-decoration-thickness:2px;text-underline-offset:2px;background:rgba(118,130,147,.16);border-radius:3px}
/* rows that are not the focus of the chosen verdict step back: only the icon and the connector fade, the words keep full contrast */
.lp .rail .n{transition:opacity .4s}
.lp .rail .ex{transition:color .4s}
.lp .rc.s0 .r2 .n,.lp .rc.s0 .r3 .n,.lp .rc.s2 .r0 .n,.lp .rc.s2 .r1 .n,.lp .rc.s2 .r2 .n{opacity:.38}
.lp .rc.s1 .r0 .n,.lp .rc.s1 .r1 .n,.lp .rc.s1 .r3 .n{opacity:.55}
.lp .rc.s0 .r2 .ex,.lp .rc.s0 .r3 .ex,.lp .rc.s1 .r0 .ex,.lp .rc.s1 .r1 .ex,.lp .rc.s1 .r3 .ex,.lp .rc.s2 .r0 .ex,.lp .rc.s2 .r1 .ex,.lp .rc.s2 .r2 .ex{color:var(--ink2)}
@media (prefers-reduced-motion:no-preference){.lp .rc.s1 .cul{animation:lp-cul .9s var(--out) both}}
@keyframes lp-cul{from{background-size:0 100%}to{background-size:100% 100%}}
.lp .rc-read{display:none;margin-top:10px;padding:12px 14px;border-radius:16px;background:var(--unk-soft)}
.lp .rc.s2 .rc-read{display:block}
.lp .rc-read b{display:block;font:800 11px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--unk-ink)}
.lp .rc-read .hw{display:block;font:500 26px/27px var(--hand);margin-top:6px;color:var(--pen)}
.lp .rc-read span:last-child{display:block;font:500 13.5px/1.4 var(--ui);color:var(--unk-ink);margin-top:4px}
.lp .rc-hints{margin-top:12px;padding-top:14px;border-top:1px solid var(--line)}
.lp .rc-hints>p{font:800 11px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.lp .rc-hints ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}
.lp .rc-hints li{display:flex;flex-direction:column;gap:7px;padding:10px 10px 11px;border-radius:14px;background:var(--soft);font:700 13px/1.25 var(--ui);color:var(--ink2)}
.lp .rc-hints li b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#fff;font:800 12px/1 var(--ui);color:var(--ink)}
.lp .rc-hints li.next{background:var(--cobalt-soft);box-shadow:inset 0 0 0 1.5px var(--cobalt);color:var(--ink)}
.lp .rc-hints li.next b{background:var(--cobalt);color:#fff}
.lp .rc-hints li.lock{background:transparent;outline:1.5px dashed var(--line2);outline-offset:-1.5px}
.lp .rc-hints li.lock b svg{width:12px;height:12px}

/* ---------- Pencil-stroke cards: tilt toward the pointer, graphite outline draws itself ---------- */
.lp .pc{--rx:0deg;--ry:0deg;--gx:50%;--gy:0%;position:relative;border-radius:var(--r,32px);transform-style:preserve-3d;
transform:perspective(1100px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.lp .pc.hot{transition:transform .12s linear}
.lp .pc>.face{position:relative;height:100%;border-radius:var(--r,32px);overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh1);transition:box-shadow .4s}
.lp .pc.hot>.face{box-shadow:0 22px 50px rgba(36,71,168,.2),0 2px 6px rgba(20,33,61,.08)}
.lp .pc>.face::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
background:radial-gradient(420px circle at var(--gx) var(--gy),rgba(255,255,255,.6),rgba(255,255,255,0) 58%)}
.lp .pc.hot>.face::after{opacity:1}
.lp .pc .sk{position:absolute;inset:-6px;border-radius:calc(var(--r,32px) + 7px) calc(var(--r,32px) + 4px) calc(var(--r,32px) + 8px) calc(var(--r,32px) + 5px);border:2px solid var(--gr);pointer-events:none;opacity:.6;--p:0deg;
-webkit-mask:conic-gradient(from -140deg,#000 var(--p),transparent 0);mask:conic-gradient(from -140deg,#000 var(--p),transparent 0);
transform:translateZ(20px) rotate(-.3deg);transition:--p 1.1s cubic-bezier(.3,.9,.3,1)}
.lp .pc .sk.b{inset:-10px;border-width:1.4px;opacity:.38;border-radius:calc(var(--r,32px) + 10px) calc(var(--r,32px) + 14px) calc(var(--r,32px) + 6px) calc(var(--r,32px) + 12px);transform:translateZ(38px) rotate(.4deg);transition-delay:.1s}
.lp .pc:hover .sk,.lp .pc:focus-within .sk{--p:360deg}
@media (prefers-reduced-motion:no-preference){
.lp.js .pc.in .sk{animation:lp-sk 2.6s cubic-bezier(.3,.9,.3,1) .4s}
.lp.js .pc.in .sk.b{animation-delay:.55s}
}
@media (prefers-reduced-motion:no-preference){
.lp.js .pc.rv{transition:opacity .8s var(--out) var(--d,0s),translate .9s var(--out) var(--d,0s),transform .8s cubic-bezier(.2,.8,.2,1)}
.lp.js .pc.rv.hot{transition:opacity .8s var(--out) var(--d,0s),translate .9s var(--out) var(--d,0s),transform .12s linear}
}
@keyframes lp-sk{0%{--p:0deg}42%{--p:360deg;opacity:.6}100%{--p:360deg;opacity:0}}
@media (hover:none){.lp .pc{transform:none}}

/* ---------- Bento ---------- */
.lp .bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:26px;margin-top:clamp(36px,5vw,60px)}
.lp .tile{--tp:clamp(22px,2.6vw,34px);--r:clamp(26px,3vw,38px)}
.lp .tile>.face{display:flex;flex-direction:column;gap:22px;padding:var(--tp)}
.lp .tile .tag{display:inline-flex;align-items:center;gap:8px;font:700 13px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--cobalt-text)}
.lp .tile .tag i{width:9px;height:9px;border-radius:50%;background:var(--butter);box-shadow:0 0 0 3px rgba(255,216,77,.4)}
.lp .tile h3{font:800 clamp(28px,3vw,40px)/1.05 var(--display);letter-spacing:-.03em;margin-top:14px;text-wrap:balance}
.lp .tile p{color:var(--ink2);font-size:17.5px;line-height:1.55;margin-top:14px;max-width:32em;text-wrap:pretty}
.lp .tile .shot{border-radius:24px;overflow:hidden;background:var(--soft);border:1px solid var(--line)}
.lp .tile .shot img{width:100%;height:auto}
.lp .tile .shot.peek{display:grid;align-items:start;margin-bottom:calc(-1 * var(--tp));border-bottom:0;border-radius:24px 24px 0 0}
.lp .t-chalk .shot.peek,.lp .t-graph .shot.peek{height:360px}
.lp .t-chalk{grid-column:span 6}.lp .t-chalk>.face{background:#FFF6CC;border-color:#F4E3A0}
.lp .t-graph{grid-column:span 6}
.lp .t-study{grid-column:span 12}
.lp .t-study>.face{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,4vw,56px);align-items:center;background:var(--cobalt-soft);border-color:#C5D6F7}
.lp .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.lp .chips li{padding:9px 14px;border-radius:999px;background:#fff;font:700 14px/1 var(--ui);color:var(--cobalt-text);box-shadow:var(--sh1)}

/* ---------- Note + trust ---------- */
.lp .nt-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,4vw,56px);align-items:center;margin-top:clamp(28px,4vw,48px)}
.lp .note{--r:32px}
.lp .note>.face{box-shadow:var(--sh2)}
.lp .note-bar{display:flex;align-items:center;gap:10px;height:54px;padding:0 24px;background:var(--soft);border-bottom:1px solid var(--line);font:700 14.5px/1 var(--ui);color:var(--ink2)}
.lp .note-bar i{width:11px;height:11px;border-radius:50%;background:var(--butter)}
.lp .note-body{padding:clamp(22px,3vw,36px)}
.lp .note-body p{font:500 clamp(18px,1.55vw,21px)/1.55 var(--ui);color:var(--ink2);letter-spacing:-.005em}
.lp .note-body p+p{margin-top:.8em}
.lp .sign{display:flex;align-items:center;gap:14px;margin-top:24px}
.lp .sign .mascot{width:64px}
.lp .sign b{display:block;font:600 30px/1 var(--hand);color:var(--pen)}
.lp .sign span{display:block;font:600 14px/1.3 var(--ui);color:var(--ink3);margin-top:4px}
.lp .proof2{position:relative;margin:0}
.lp .proof2 .pc{--r:32px}
.lp .proof2 .face{box-shadow:var(--sh3)}
.lp .proof2 img{width:100%;height:auto}
.lp .proof2 figcaption{margin-top:18px;font:600 14.5px/1.45 var(--ui);color:var(--ink3);text-align:center}

/* ---------- FAQ ---------- */
.lp .faq{max-width:820px;margin:clamp(28px,4vw,44px) auto 0;display:grid;gap:10px}
.lp .qa{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--sh1);transition:box-shadow .25s,transform .3s var(--ease)}
.lp .qa:hover{transform:translateY(-2px)}
.lp .qa.open{box-shadow:var(--sh2)}
.lp .qa-q{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;min-height:64px;padding:14px 26px;border-radius:26px;font:700 clamp(18px,1.7vw,21px)/1.3 var(--display);letter-spacing:-.015em}
.lp .qa-q .pm{position:relative;width:32px;height:32px;flex:none;border-radius:50%;background:var(--soft2);transition:background .25s,transform .35s var(--ease)}
.lp .qa-q .pm::before,.lp .qa-q .pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2.4px;margin:-1.2px 0 0 -6px;border-radius:2px;background:var(--ink)}
.lp .qa-q .pm::after{transform:rotate(90deg);transition:transform .35s var(--ease)}
.lp .qa.open .pm{background:var(--butter);transform:rotate(180deg)}
.lp .qa.open .pm::after{transform:rotate(0)}
.lp .qa-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease)}
.lp .qa-a>div{overflow:hidden;min-height:0;visibility:hidden;transition:visibility 0s .35s}
.lp .qa.open .qa-a>div{visibility:visible;transition-delay:0s}
.lp .qa.open .qa-a{grid-template-rows:1fr}
.lp .qa-a p{padding:0 26px 24px;color:var(--ink2);font-size:17.5px;line-height:1.6;max-width:38em}

/* ---------- Final CTA ---------- */
.lp .cta-sec{padding-top:0}
.lp .cta-panel{position:relative;overflow:visible;max-width:1200px;margin:0 auto;padding:clamp(40px,5.5vw,72px) clamp(20px,5vw,64px);border-radius:clamp(30px,4vw,56px);background:var(--cobalt);color:#fff;text-align:center;
display:flex;flex-direction:column;align-items:center}
.lp .cta-panel::before{content:"";position:absolute;inset:0;border-radius:inherit;background-image:radial-gradient(rgba(255,255,255,.22) 1.3px,transparent 1.6px);background-size:28px 28px;opacity:.5;pointer-events:none;
-webkit-mask-image:linear-gradient(to bottom,#000,transparent 80%);mask-image:linear-gradient(to bottom,#000,transparent 80%)}
.lp .cta-panel>*{position:relative}
.lp .cta-panel .h2{margin-top:0;color:#fff}
.lp .cta-panel .sub{color:#E8F0FF;margin-top:16px}
.lp .cir{position:relative;display:inline-block;white-space:nowrap;padding:0 .1em;margin:0 .02em}
.lp .cir svg{position:absolute;left:-12%;top:-20%;width:124%;height:140%;overflow:visible;pointer-events:none}
.lp .cir path{fill:none;stroke:var(--butter);stroke-width:3.4;stroke-linecap:round;vector-effect:non-scaling-stroke}
@media (prefers-reduced-motion:no-preference){
.lp.js .cir svg{clip-path:inset(0 100% 0 0);transition:clip-path 1.1s cubic-bezier(.5,0,.2,1) .5s}
.lp.js .rv.in .cir svg{clip-path:inset(0 0 0 0)}
}
.lp .wl{display:flex;flex-direction:column;align-items:center;gap:20px;margin-top:28px;width:100%;max-width:440px}
.lp .wl input{width:100%;height:60px;padding:0 26px;border-radius:999px;border:2px solid transparent;background:#fff;color:var(--ink);font:600 17px/1 var(--ui);outline:0;box-shadow:0 8px 24px rgba(20,33,61,.18)}
.lp .wl input::placeholder{color:var(--ink3);opacity:1}
.lp .wl input:focus-visible{border-color:var(--butter);box-shadow:0 0 0 4px rgba(255,216,77,.45)}
.lp .wl-ok{font:700 18px/1.3 var(--ui);color:#fff;display:none;align-items:center;gap:10px}
.lp .wl.done .wl-ok{display:inline-flex}
.lp .wl.done input,.lp .wl.done .btn-magnet{display:none}
.lp .fine{margin-top:22px;font:500 14.5px/1.4 var(--ui);color:#E8F0FF}
.lp .cta-chalk{position:absolute;right:clamp(24px,8vw,120px);top:-58px;width:clamp(84px,9vw,124px)}

/* ---------- Footer ---------- */
.lp .foot{background:var(--night);color:#fff;border-radius:clamp(28px,4vw,56px) clamp(28px,4vw,56px) 0 0;padding:clamp(44px,5vw,72px) var(--gutter) 0;overflow:hidden}
.lp .foot-in{max-width:var(--wrap);margin:0 auto}
.lp .foot-top{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px}
.lp .foot-brand img{height:44px;width:auto}
.lp .foot-brand p{margin-top:16px;color:#B8C6E4;font:500 16px/1.5 var(--ui);max-width:22em}
.lp .foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.lp .foot-cols .fh{font:700 13px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--butter)}
.lp .foot-cols a{display:flex;align-items:center;min-height:34px;margin-top:2px;color:#DCE6F7;font:600 16px/1.3 var(--ui)}
.lp .foot-cols a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.lp .foot-p{margin-top:12px;color:#DCE6F7;font:500 15.5px/1.5 var(--ui);max-width:16em}
/* the big name: warm light keeps flowing through the letters and a soft glow breathes behind them (runs while the footer is on screen) */
.lp .wm{position:relative;margin-top:clamp(28px,4vw,56px)}
.lp .wm-glow{position:absolute;left:8%;top:-14%;width:84%;height:132%;border-radius:50%;pointer-events:none;opacity:.7;
background:radial-gradient(closest-side,rgba(255,168,72,.38),rgba(255,138,56,.14) 58%,rgba(255,138,56,0))}
.lp .wordmark{position:relative;font:800 clamp(48px,15.6vw,224px)/.86 var(--display);letter-spacing:-.045em;text-align:center;white-space:nowrap;user-select:none;
color:#FBE3B2;background-image:linear-gradient(100deg,#FFF0CC 0%,#FFD98C 17%,#FFC468 33%,#FFAE74 50%,#FFC468 67%,#FFD98C 83%,#FFF0CC 100%);background-size:200% 100%;
-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media (prefers-reduced-motion:no-preference){
.lp.js .wm.on .wordmark{animation:lp-warm 11s linear infinite}
.lp.js .wm.on .wm-glow{animation:lp-breathe 6s ease-in-out infinite,lp-glowx 17s ease-in-out infinite alternate}
}
@keyframes lp-warm{to{background-position:200% 0}}
@keyframes lp-breathe{0%,100%{opacity:.5;scale:.93}50%{opacity:.95;scale:1.05}}
@keyframes lp-glowx{from{translate:-7% 0}to{translate:7% 0}}
.lp .copy{padding:22px 0 26px;color:#9FB0D2;font:500 14px/1.5 var(--ui);text-align:center}
.lp .copy span{display:block}

/* ---------- Back to top (#093) ---------- */
.lp .totop{position:fixed;right:clamp(16px,2.4vw,32px);bottom:clamp(16px,2.4vw,32px);z-index:55;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;opacity:0;visibility:hidden;
background:var(--night);box-shadow:0 8px 20px rgba(12,22,43,.34)}
.lp .totop svg{width:44px;height:44px}
.lp .totop:focus-visible{outline-color:var(--butter)}

/* ---------- Site pages: privacy, terms, support, accessibility, 404 ---------- */
.lp .doc-hero{position:relative;max-width:var(--wrap);margin:0 auto;padding:clamp(118px,10vw,148px) var(--gutter) 6px}
.lp .doc-hero .h1{font-size:clamp(38px,5vw,68px);margin-top:18px;max-width:15em}
.lp .doc-hero .lead{margin-top:18px;max-width:38em}
.lp .doc-meta{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;margin-top:22px}
.lp .doc-meta .vw{height:30px;font-size:13px}
.lp .doc-meta .t{font:600 14.5px/1.3 var(--ui);color:var(--ink3)}
.lp .draftbar{display:flex;gap:14px;align-items:flex-start;margin-top:26px;padding:16px 20px;border-radius:22px;background:#fff;border:1.5px dashed var(--line2);max-width:52em}
.lp .draftbar .gl{font-size:24px;margin-top:1px}
.lp .draftbar p{font:500 15.5px/1.55 var(--ui);color:var(--ink2)}
.lp .draftbar p b{color:var(--ink)}
.lp .draftbar .vw{vertical-align:middle;height:24px;margin:0 2px;position:relative;top:-1px}
.lp .doc-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(32px,5vw,72px);max-width:var(--wrap);margin:0 auto;padding:30px var(--gutter) clamp(64px,7vw,104px)}
.lp .doc-toc{position:sticky;top:104px;align-self:start}
.lp .doc-toc h2{font:800 12px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin:0 12px 10px}
.lp .doc-toc nav{display:grid;gap:2px}
.lp .doc-toc a{display:flex;align-items:center;min-height:40px;padding:0 12px;border-radius:12px;font:600 15px/1.25 var(--ui);color:var(--ink2);transition:background .2s,color .2s}
.lp .doc-toc a:hover{background:#fff;color:var(--ink)}
.lp .doc-toc a.on{background:var(--cobalt-soft);color:var(--cobalt-text)}
.lp .doc-body{display:grid;gap:clamp(18px,2.2vw,28px);min-width:0}
.lp .dc{--r:30px;scroll-margin-top:100px}
.lp .dc>.face{padding:clamp(22px,3vw,38px)}
.lp .dc h2{font:800 clamp(26px,2.6vw,34px)/1.1 var(--display);letter-spacing:-.03em}
.lp .dc h3,.lp .dc h2.sh{font:800 19px/1.25 var(--display);letter-spacing:-.015em;margin-top:24px}
.lp .dc p{color:var(--ink2);font-size:17px;line-height:1.65;margin-top:12px;max-width:44em;text-wrap:pretty}
.lp .dc p a,.lp .dc li a{color:var(--cobalt-text);text-decoration:underline;text-underline-offset:3px}
.lp .dc ul.ck,.lp .dc ul.q{margin-top:14px;display:grid;gap:10px}
.lp .dc ul.ck li,.lp .dc ul.q li{position:relative;padding-left:34px;color:var(--ink2);font-size:17px;line-height:1.55}
.lp .dc ul.ck li::before,.lp .dc ul.q li::before{content:"";position:absolute;left:0;top:.14em;width:22px;height:22px;background:var(--ok);-webkit-mask:var(--g-ok) center/contain no-repeat;mask:var(--g-ok) center/contain no-repeat}
.lp .dc ul.q li::before{background:var(--unk);-webkit-mask-image:var(--g-unk);mask-image:var(--g-unk)}
.lp .dc li b{color:var(--ink)}
.lp .dc.short>.face{background:#FFF6CC;border-color:#F4E3A0}
.lp .dc.short ul.ck li::before{background:var(--ink)}
.lp .dt{margin-top:18px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}
.lp .dt .r{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.35fr) minmax(0,.85fr)}
.lp .dt .r>*{padding:14px 18px;font:500 15.5px/1.45 var(--ui);color:var(--ink2);border-top:1px solid var(--line)}
.lp .dt .r:first-child>*{border-top:0}
.lp .dt .r.h>*{background:var(--soft);font:800 12px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);padding:12px 18px}
.lp .dt .r>b{font:700 15.5px/1.4 var(--ui);color:var(--ink)}
.lp .todo{margin-top:16px;display:grid;gap:10px}
.lp .todo li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:12px;align-items:start;padding:14px 16px;border-radius:18px;background:var(--soft);outline:1.5px dashed var(--line2);outline-offset:-1.5px;font:500 16px/1.5 var(--ui);color:var(--ink2)}
.lp .todo li .gl{font-size:24px;margin-top:1px}
.lp .todo li b{color:var(--ink)}
.lp .support-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.lp .support-grid .dc>.face{height:100%}
.lp .support-grid .ic{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:var(--cobalt-soft);color:var(--cobalt-text);font:800 22px/1 var(--display)}
.lp .support-grid h3,.lp .support-grid h2.sh{margin-top:16px}
.lp .support-grid a.more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font:700 15px/1 var(--ui);color:var(--cobalt-text);min-height:44px}
.lp .nf{position:relative;max-width:var(--wrap);margin:0 auto;padding:clamp(130px,12vw,180px) var(--gutter) clamp(60px,8vw,110px);display:flex;flex-direction:column;align-items:center;text-align:center}
.lp .nf .big{position:relative;font:800 clamp(120px,22vw,300px)/.9 var(--display);letter-spacing:-.06em;color:var(--ink)}
.lp .nf .big .zr{position:relative;display:inline-block}
.lp .nf .big .zr svg{position:absolute;left:-6%;top:-6%;width:112%;height:112%;overflow:visible}
.lp .nf .big .zr path{fill:none;stroke:var(--butter);stroke-width:8;stroke-linecap:round;vector-effect:non-scaling-stroke}
.lp .nf .mascot{position:absolute;right:6%;top:24%;width:clamp(70px,9vw,120px)}
.lp .nf h1{font:800 clamp(30px,3.6vw,48px)/1.08 var(--display);letter-spacing:-.03em;margin-top:6px}
.lp .nf p{margin-top:14px;color:var(--ink2);max-width:30em}
.lp .nf .cta-row{margin-top:26px}
.lp .nf .links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:22px}
.lp .nf .links a{display:inline-flex;align-items:center;min-height:44px;font:700 15.5px/1 var(--ui);color:var(--cobalt-text);text-decoration:underline;text-underline-offset:4px}
.lp .doc-grid.single{grid-template-columns:minmax(0,1fr)}
.lp .support-grid .dc.wide{grid-column:1/-1}
.lp .dt .r>span:last-child::before{content:none}
.lp .doc-hero .label{margin-bottom:0}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
.lp .lp-nav a{padding:0 11px;font-size:14.5px}
.lp .lens-grid{grid-template-columns:1fr}
.lp .rc{margin:0 auto}
.lp .t-study>.face{grid-template-columns:1fr}
.lp .nt-grid{grid-template-columns:1fr}
.lp .proof2{max-width:560px;margin:0 auto}
.lp .how-grid{grid-template-columns:1fr}
.lp .foot-top{grid-template-columns:1fr}
.lp .doc-grid{grid-template-columns:1fr}
.lp .doc-toc{position:static}
.lp .doc-toc nav{display:flex;flex-wrap:wrap;gap:6px}
.lp .doc-toc h2{margin-left:2px}
.lp .chip{left:-1cqw;top:auto;bottom:calc(100% - 7cqw)}.lp .badge{right:-1cqw}
}
@media (max-width:760px){
.lp .t-chalk,.lp .t-graph{grid-column:span 12}
.lp .lp-nav{display:none}
.lp .lp-pill{padding-left:16px;gap:10px}
.lp .lp-logo{margin-right:6px}
.lp .hero{padding-top:112px}
.lp .stage{padding-top:clamp(30px,9vw,56px)}
.lp .chip{top:auto;bottom:calc(100% - 6cqw);left:-1cqw;padding:7px 12px 7px 8px;font-size:12.5px;gap:7px}
.lp .chip .gl{font-size:20px}
.lp .badge{width:21cqw;bottom:4cqw;right:-2cqw}
.lp .ground{bottom:-2.4cqw}
.lp .step{padding:16px 16px;grid-template-columns:42px minmax(0,1fr);gap:14px}
.lp .step .n{width:42px;height:42px;font-size:18px}
.lp .step .t{font-size:22px;padding-top:6px}
.lp .vx button{padding:10px 14px 10px 10px;gap:12px;grid-template-columns:42px minmax(0,1fr)}
.lp .vx .vg{width:42px;height:42px;font-size:28px}
.lp .rc{padding:18px 16px 16px;border-radius:24px}
.lp .rc-ban{padding:12px 14px 12px 12px;gap:12px}
.lp .rc-ban .vi{width:46px;height:46px;font-size:30px}
.lp .rc-ban b{font-size:18px}
.lp .vsb{grid-template-columns:1fr}
.lp .vsb .vw{justify-self:start}
.lp .vsb .ex{font-size:24px;line-height:24px}
.lp .rc-hints ol{grid-template-columns:repeat(2,minmax(0,1fr))}
.lp .tile .shot{border-radius:18px}
.lp .tile .shot.peek{height:auto!important;border-radius:18px 18px 0 0}
.lp .qa-q{padding:14px 18px;min-height:64px}
.lp .qa-a p{padding:0 18px 20px;font-size:16.5px}
.lp .wl input{height:56px}
.lp .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
.lp .support-grid{grid-template-columns:1fr}
.lp .dt .r{grid-template-columns:1fr}
.lp .dt .r.h{display:none}
.lp .dt .r>*{padding:10px 16px}
.lp .dt .r>b{padding-top:14px;border-top:1px solid var(--line)}
.lp .dt .r:first-of-type>b{border-top:0}
.lp .dt .r>span{border-top:0;padding-top:2px}
.lp .dt .r>span:last-child{padding-bottom:14px}
.lp .dt .r>span:last-child::before{content:attr(data-l);display:block;font:800 11px/1 var(--ui);letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);margin-bottom:5px}
.lp .todo li{grid-template-columns:24px minmax(0,1fr)}
.lp .todo li .vw{grid-column:2;justify-self:start}
.lp .nf .mascot{position:static;margin-bottom:8px}
}
@media (prefers-reduced-motion:reduce){
.lp *,.lp *::before,.lp *::after{animation:none!important;transition-duration:.01ms!important}
}

/* generated: moving dots on the background sketches */
@keyframes lp-e1{0%{translate:106px 60px}4.17%{translate:104.43px 64.4px}8.33%{translate:99.84px 68.5px}12.5%{translate:92.53px 72.02px}16.67%{translate:83px 74.72px}20.83%{translate:71.91px 76.42px}25%{translate:60px 77px}29.17%{translate:48.09px 76.42px}33.33%{translate:37px 74.72px}37.5%{translate:27.47px 72.02px}41.67%{translate:20.16px 68.5px}45.83%{translate:15.57px 64.4px}50%{translate:14px 60px}54.17%{translate:15.57px 55.6px}58.33%{translate:20.16px 51.5px}62.5%{translate:27.47px 47.98px}66.67%{translate:37px 45.28px}70.83%{translate:48.09px 43.58px}75%{translate:60px 43px}79.17%{translate:71.91px 43.58px}83.33%{translate:83px 45.28px}87.5%{translate:92.53px 47.98px}91.67%{translate:99.84px 51.5px}95.83%{translate:104.43px 55.6px}100%{translate:106px 60px}}
@keyframes lp-e2{0%{translate:83px 99.84px}4.17%{translate:78.41px 100.68px}8.33%{translate:72.56px 98.75px}12.5%{translate:65.85px 94.18px}16.67%{translate:58.75px 87.28px}20.83%{translate:51.73px 78.52px}25%{translate:45.28px 68.5px}29.17%{translate:39.83px 57.9px}33.33%{translate:35.75px 47.44px}37.5%{translate:33.33px 37.84px}41.67%{translate:32.72px 29.75px}45.83%{translate:33.97px 23.72px}50%{translate:37px 20.16px}54.17%{translate:41.59px 19.32px}58.33%{translate:47.44px 21.25px}62.5%{translate:54.15px 25.82px}66.67%{translate:61.25px 32.72px}70.83%{translate:68.27px 41.48px}75%{translate:74.72px 51.5px}79.17%{translate:80.17px 62.1px}83.33%{translate:84.25px 72.56px}87.5%{translate:86.67px 82.16px}91.67%{translate:87.28px 90.25px}95.83%{translate:86.03px 96.28px}100%{translate:83px 99.84px}}
@keyframes lp-e3{0%{translate:37px 99.84px}4.17%{translate:33.97px 96.28px}8.33%{translate:32.72px 90.25px}12.5%{translate:33.33px 82.16px}16.67%{translate:35.75px 72.56px}20.83%{translate:39.83px 62.1px}25%{translate:45.28px 51.5px}29.17%{translate:51.73px 41.48px}33.33%{translate:58.75px 32.72px}37.5%{translate:65.85px 25.82px}41.67%{translate:72.56px 21.25px}45.83%{translate:78.41px 19.32px}50%{translate:83px 20.16px}54.17%{translate:86.03px 23.72px}58.33%{translate:87.28px 29.75px}62.5%{translate:86.67px 37.84px}66.67%{translate:84.25px 47.44px}70.83%{translate:80.17px 57.9px}75%{translate:74.72px 68.5px}79.17%{translate:68.27px 78.52px}83.33%{translate:61.25px 87.28px}87.5%{translate:54.15px 94.18px}91.67%{translate:47.44px 98.75px}95.83%{translate:41.59px 100.68px}100%{translate:37px 99.84px}}
@keyframes lp-wv{0%{translate:16px 54px;opacity:0}5%{translate:20.8px 43.28px;opacity:0.6}10%{translate:25.6px 34.2px;opacity:0.9}15%{translate:30.4px 28.13px;opacity:0.9}20%{translate:35.2px 26px;opacity:0.9}25%{translate:40px 28.13px;opacity:0.9}30%{translate:44.8px 34.2px;opacity:0.9}35%{translate:49.6px 43.28px;opacity:0.9}40%{translate:54.4px 54px;opacity:0.9}45%{translate:59.2px 64.72px;opacity:0.9}50%{translate:64px 73.8px;opacity:0.9}55%{translate:68.8px 79.87px;opacity:0.9}60%{translate:73.6px 82px;opacity:0.9}65%{translate:78.4px 79.87px;opacity:0.9}70%{translate:83.2px 73.8px;opacity:0.9}75%{translate:88px 64.72px;opacity:0.9}80%{translate:92.8px 54px;opacity:0.9}85%{translate:97.6px 43.28px;opacity:0.9}90%{translate:102.4px 34.2px;opacity:0.9}95%{translate:107.2px 28.13px;opacity:0.6}100%{translate:112px 26px;opacity:0}}
.lp .dd .el.e1{translate:106px 60px}.lp .dd .el.e2{translate:83px 99.84px}.lp .dd .el.e3{translate:37px 99.84px}.lp .dd .el.wv{translate:16px 54px;opacity:0}
@media (prefers-reduced-motion:no-preference){.lp.js .dd.on .el.e1{animation:lp-e1 3.6s linear infinite}.lp.js .dd.on .el.e2{animation:lp-e2 4.7s linear -1.7s infinite}.lp.js .dd.on .el.e3{animation:lp-e3 5.9s linear -3.1s infinite}.lp.js .dd.on .el.wv{animation:lp-wv 7s linear infinite}}

@media (max-width:359px){
.lp .lens-grid{grid-template-columns:minmax(0,1fr)}
.lp .trk i{width:auto;flex:1 1 0;max-width:40px}
.lp .lp-pill{padding-left:12px;gap:6px}
.lp .lp-logo{margin-right:2px}
.lp .bento{column-gap:12px}
}
@media (max-width:319px){
.lp .lp-logo img{height:24px}
.lp .lp-pill .btn-sm{padding:0 14px}
}