/* Signed-out home in the estate's A1 Framed Simple-view system: a light page with thin rails down both sides of
 * the content column, + marks where section rules meet the rails, a dotted hero ground, a framed product window
 * behind a segmented control, a cell band, ruled grids, a ledger, questions and a flat closing band.
 * The app's own tokens: blue #2f6bff, Inter, the 6c greys. base.css and pro.css load first, unchanged. */
body.lp{
  --lp-bg:#fbfbfc;--rule:#e3e5e9;--hair:#f0f1f3;--dim:#4d525b;--faint:#6b7079;--plus:#a9adb5;--dot:#d3d6dc;
  --lp-railx:max(16px,calc(50% - 580px));
  display:block;height:auto;min-height:100%;overflow:visible;overflow-x:clip;position:relative;background:var(--lp-bg);font-size:15.5px;line-height:1.6}
html:has(body.lp){height:auto}
.lp a{color:inherit;text-decoration:none}
.lp > header,.lp > main,.lp > footer{position:relative;z-index:1}
.lp > .lp-rails{position:absolute;inset:0;pointer-events:none;z-index:0}
.lp-rails::before,.lp-rails::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--rule)}
.lp-rails::before{left:var(--lp-railx)}.lp-rails::after{right:var(--lp-railx)}
.lp :focus-visible{outline:2px solid var(--free);outline-offset:3px}
.lp-rule{position:relative;z-index:2;height:0;border-top:1px solid var(--rule)}
.lp-rule::before,.lp-rule::after{content:"";position:absolute;top:-6px;width:11px;height:11px;
  background:linear-gradient(var(--plus),var(--plus)) center/11px 1px no-repeat,linear-gradient(var(--plus),var(--plus)) center/1px 11px no-repeat}
.lp-rule::before{left:calc(var(--lp-railx) - 5px)}.lp-rule::after{right:calc(var(--lp-railx) - 5px)}
.lp-w{max-width:1160px;margin:0 auto;padding-inline:clamp(16px,4vw,40px);position:relative}

/* header */
.lp-nav{border-bottom:1px solid var(--rule);background:var(--lp-bg)}
.lp-nav-in{display:flex;align-items:center;gap:36px;height:60px}
.lp-brand{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:17px;letter-spacing:-.02em;color:var(--ink);white-space:nowrap}
.lp-brand img{display:block;flex:none}
.lp-links{display:flex;gap:26px;font-size:14.5px;font-weight:500;color:var(--dim)}
.lp-links a{padding:8px 0;transition:color .14s;white-space:nowrap}
.lp-links a:hover{color:var(--ink)}
.lp-ctas{margin-left:auto;display:flex;align-items:center;gap:20px}
.lp-txt{font-size:14.5px;font-weight:500;color:var(--dim);white-space:nowrap}
.lp-txt:hover{color:var(--ink)}
.lp-btn{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 13px;border-radius:8px;font-size:14px;font-weight:500;white-space:nowrap;transition:background-color .16s}
.lp .lp-btn-ink{background:var(--ink);color:#fff}.lp-btn-ink:hover{background:#33363d}
.lp-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:9px;background:var(--free);color:#fff!important;font-size:15px;font-weight:600;white-space:nowrap;transition:background-color .16s,transform .16s var(--spring)}
.lp-primary:hover{background:var(--free-hover)}.lp-primary:active{transform:scale(.98)}
.lp-primary-lg{height:46px;padding:0 20px}
.lp-arrow{display:inline-flex;padding:8px 0;font-size:14.5px;font-weight:500;color:var(--ink);text-decoration:underline!important;text-decoration-color:#c3c7cf!important;text-underline-offset:4px}
.lp-arrow:hover{text-decoration-color:var(--free)!important}

/* hero */
.lp-hero{position:relative;text-align:center;padding:88px 0 0;overflow:hidden}
.lp-hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:18px 18px;
  -webkit-mask-image:radial-gradient(60% 45% at 50% 22%,#000 20%,transparent 75%);mask-image:radial-gradient(60% 45% at 50% 22%,#000 20%,transparent 75%)}
.lp-hero>.lp-w>h1{max-width:20ch;margin:0 auto;font-size:clamp(40px,5.2vw,64px);font-weight:500;line-height:1.04;letter-spacing:-.035em;text-wrap:balance;white-space:normal;overflow:visible}
.lp-lead{max-width:50ch;margin:24px auto 0;font-size:19px;line-height:1.5;color:#3a3d44}
.lp-cmd{display:flex;align-items:center;gap:6px;width:min(100%,560px);margin:32px auto 0;padding:6px;background:#fff;border:1px solid var(--rule);border-radius:13px;
  box-shadow:0 1px 2px rgba(15,17,20,.06),0 8px 24px -16px rgba(15,17,20,.25);text-align:left}
.lp-cmd-link{flex:1;min-width:0;padding:0 12px;font-size:16px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-cmd-host{color:var(--faint);font-weight:500}
.lp-facts{display:flex;flex-wrap:wrap;justify-content:center;margin-top:14px;font-size:13.5px;color:var(--dim)}
.lp-facts span+span::before{content:"·";margin:0 10px;color:var(--faint)}
.lp-facts b{font-weight:600;color:var(--ink)}

/* the product window */
.lp-stage{margin-top:56px;padding:18px 18px 0;border-radius:16px 16px 0 0;background:#f1f2f4;border:1px solid var(--rule);border-bottom:0;text-align:left}
.lp-ptabs{display:flex;width:max-content;max-width:100%;flex-wrap:wrap;gap:2px;margin:0 auto 16px;padding:3px;border:1px solid var(--rule);border-radius:10px;background:#fff}
.lp-ptabs button{border:0;background:none;display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:7px;font-size:14px;font-weight:500;color:var(--dim);white-space:nowrap;transition:color .14s,background-color .14s}
.lp-ptabs button:hover{color:var(--ink)}
.lp-ptabs button[aria-selected=true]{background:var(--ink);color:#fff}
.lp-win{background:#fff;border:1px solid var(--rule);border-radius:10px 10px 0 0;border-bottom:0;overflow:hidden}
.lp-win-top{display:flex;align-items:center;justify-content:space-between;gap:12px;height:42px;padding:0 14px;border-bottom:1px solid var(--rule);background:#f6f7f9;font-size:12.5px;color:var(--faint)}
.lp-urlbar{display:flex;align-items:center;height:26px;min-width:0;padding:0 10px;border:1px solid var(--rule);border-radius:7px;background:var(--lp-bg);font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-app{display:grid;grid-template-columns:200px minmax(0,1fr);height:800px}
.lp-side{display:grid;align-content:start;gap:1px;padding:14px 10px;border-right:1px solid var(--rule);background:#fafbfc;font-size:13px;color:var(--dim)}
.lp-side-h{padding:12px 8px 6px;font-size:11.5px;font-weight:500;color:var(--faint)}
.lp-side-h:first-child{padding-top:2px}
.lp-side-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px;border-radius:7px}
.lp-side-row>span:first-child{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.lp-n{color:var(--faint);font-size:12px;white-space:nowrap}
.lp-check{width:14px;height:14px;border-radius:4px;box-shadow:inset 0 0 0 1.5px #c9ccd3;flex:none;position:relative}
.lp-check.is-on{background:var(--free);box-shadow:none}
.lp-check.is-on::after{content:"";position:absolute;left:4.5px;top:2px;width:4px;height:7px;border:solid #fff;border-width:0 1.8px 1.8px 0;transform:rotate(45deg)}
.lp-pane{position:relative;display:flex;flex-direction:column;min-width:0;--pad:20px;--bar:68px;overflow:hidden}
.lp-pane .cal-wrap{padding-bottom:72px}
.lp-pane .cal{min-width:0}
.lp-pane h1{font-size:17px}
/* The sample window's title is a <p>: the page keeps one h1. Same type as the app header's h1 (pro.css, app.css .head-l h1). */
.lp-pane .lp-title{margin:0;font-size:17px;font-weight:600;letter-spacing:-.015em;line-height:1.6;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lp-dock{position:absolute;animation:none;bottom:14px;z-index:4}
.lp-dock button{white-space:nowrap}
.lp-dock .link.is-ring{box-shadow:0 0 0 3px rgba(47,107,255,.55)}
.lp-contacts{display:flex;align-items:center;gap:14px;font-size:13px;color:var(--muted);margin-right:12px}
.lp-contacts span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.lp-contacts svg{flex:none;color:#a2a6ae}
.lp-pane .set{cursor:default}
.lp-pane .sub,.lp-pane .signin{white-space:nowrap;flex-wrap:nowrap}
.lp-caption{margin:0;padding:20px 0;font-size:13px;color:var(--faint)}

/* cell band */
.lp-band{background:var(--lp-bg)}
.lp-cells{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));border-inline:1px solid var(--rule);background:#fff}
.lp-cells>*{display:flex;align-items:center;justify-content:center;gap:12px;padding:22px 16px;border-left:1px solid var(--rule)}
.lp-cells>div:first-child{border-left:0;justify-content:flex-start;display:flex;align-items:center;font-size:14px;line-height:1.5;color:var(--dim);padding-inline:18px}
.lp-cells svg{flex:none}
.lp-cells span{display:grid;font-size:15.5px;font-weight:600;letter-spacing:-.01em;line-height:1.3}
.lp-cells small{font-size:12.5px;font-weight:400;letter-spacing:0;color:var(--faint)}

/* sections */
.lp-sec{padding:96px 0 0;scroll-margin-top:24px}
.lp main h2{font-size:clamp(30px,3.2vw,40px);font-weight:500;line-height:1.1;letter-spacing:-.03em;text-wrap:balance}
.lp-head-split{display:grid;grid-template-columns:1.2fr 1fr;gap:16px 64px;align-items:end;padding-bottom:40px}
.lp-head-split p,.lp-sub{font-size:16.5px;line-height:1.6;color:var(--dim)}
.lp-head-split p{justify-self:end}
.lp-kicker{font-size:15px;font-weight:600;color:var(--free)}
.lp-after{margin-top:18px;font-size:14px;color:var(--dim)}
.lp-method{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:#fff}
.lp-method-2{grid-template-columns:1fr 1.25fr}
.lp-method article{padding:24px;min-width:0}
.lp-method article+article{border-left:1px solid var(--rule)}
.lp-method header{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.lp-method h3{font-size:17px;font-weight:600;letter-spacing:-.01em}
.lp-method header span{font-size:13px;color:var(--faint);white-space:nowrap}
.lp-method article>p{margin-top:6px;font-size:14px;color:var(--dim)}
.lp-method ul{list-style:none;margin-top:14px}
.lp-method li{padding:9px 0;border-top:1px solid var(--hair);font-size:13.5px;line-height:1.55}
.lp-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.lp-split h2{margin-top:10px}
.lp-split .lp-sub{margin-top:14px}
.lp-ledger,.lp-perms{border:1px solid var(--rule);border-radius:10px;overflow:hidden;background:#fff;font-size:14px}
.lp-ledger>*{display:grid;grid-template-columns:130px minmax(0,1fr);gap:16px;align-items:center;padding:14px 16px;border-top:1px solid var(--rule)}
.lp-ledger>*>span:first-child{display:inline-flex;align-items:center;gap:10px;font-weight:500}
.lp-ledger>*>span:last-child{color:var(--dim)}
.lp-ledger .sw{width:22px;height:16px;border-radius:5px;vertical-align:0}
.lp-ledger-h,.lp-perms-h{border-top:0!important;padding-block:10px!important;background:#fafbfc;color:var(--faint)!important;font-size:12px}
.lp-ledger-h span,.lp-perms-h span{font-weight:400!important;color:var(--faint)!important}
.lp-perms{margin-top:14px}
.lp-perms>*{display:grid;grid-template-columns:90px 1fr 1fr;gap:14px;padding:11px 14px;border-top:1px solid var(--rule);font-size:13.5px}
.lp-perms>*>span:not(:first-child){color:var(--dim)}
.lp-perms>*>span:first-child{font-weight:500}
.lp-faq2{display:grid;grid-template-columns:1fr 1.5fr;gap:48px;align-items:start}
.lp-faq2 .lp-sub{margin-top:12px}
.lp-faq{border-top:1px solid var(--rule)}
.lp-disc{border-bottom:1px solid var(--rule)}
.lp-disc>button{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;min-height:60px;padding:18px 0;border:0;background:none;text-align:left;font-size:17px;font-weight:500;line-height:1.45;color:var(--ink)}
.lp-sign{flex:none;width:14px;color:var(--dim);font-size:20px;line-height:1;text-align:center;transition:color .14s,transform .24s var(--ease)}
.lp-disc>button:hover .lp-sign{color:var(--free)}
.lp-disc>button[aria-expanded=true] .lp-sign{transform:rotate(45deg)}
.lp-reveal{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .24s var(--ease),opacity .24s ease}
.lp-reveal.is-open{grid-template-rows:1fr;opacity:1}
.lp-reveal>div{min-height:0;overflow:hidden}
.lp-answer{padding:0 0 20px;color:var(--dim);font-size:15.5px;line-height:1.65}
.lp-finale{margin-top:112px;background:#f1f2f4}
.lp-finale>.lp-w{display:grid;grid-template-columns:1.4fr 1fr;gap:20px 48px;align-items:center;padding-block:72px}
.lp-finale p{margin-top:12px;max-width:58ch;font-size:16px;color:var(--dim)}
.lp-finale-act{display:flex;align-items:center;justify-content:flex-end;gap:22px;flex-wrap:wrap}

/* footer */
.lp-foot{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:24px;padding:56px 0 28px;font-size:13.5px}
.lp-foot h5{margin:0 0 12px;font-size:13.5px;font-weight:600;color:var(--ink)}
.lp-foot nav a{display:block;padding:3px 0;color:var(--dim)}
.lp-foot nav a:hover,.lp-legal a:hover{color:var(--ink)}
.lp-foot-about{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.lp-foot-about p{max-width:38ch;color:var(--dim)}
.lp-legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:20px 0 32px;border-top:1px solid var(--rule);font-size:13px;color:var(--faint)}
.lp-legal a{color:var(--faint)}

@media (max-width:980px){
  .lp-links{display:none}
  .lp-head-split,.lp-split,.lp-faq2,.lp-finale>.lp-w,.lp-method,.lp-method-2{grid-template-columns:1fr}
  .lp-head-split p{justify-self:start}
  .lp-method article+article{border-left:0;border-top:1px solid var(--rule)}
  .lp-cells{grid-template-columns:1fr 1fr}
  .lp-cells>*{border-top:1px solid var(--rule)}
  .lp-finale-act{justify-content:flex-start}
  .lp-app{grid-template-columns:1fr}
  .lp-side{display:none}
  .lp-pane .cal-wrap{overflow-x:auto}
  .lp-pane .cal{min-width:640px}
}
@media (max-width:640px){
  .lp-hero{padding-top:56px}
  .lp-cmd{flex-direction:column;align-items:stretch}
  .lp-cmd-link{padding:8px 10px}
  .lp-dock .dock-label,.lp-dock .sep,.lp-dock #lp-copy{display:none}
  .lp-foot{grid-template-columns:1fr 1fr}
  .lp-foot-about{grid-column:1/-1}
  .lp-contacts{display:none}
  /* Phone width: Install app leaves the header so Sign in and Get your link fit beside the brand */
  .lp-ctas{gap:14px}
  .lp-ctas .lp-install{display:none}
}

/* "What visitors see": the public page, so the owner's sidebar goes away */
.lp-app.is-visitor{grid-template-columns:1fr}
.lp-app.is-visitor .lp-side{display:none}
.lp-app.is-visitor .lp-pane{animation:lp-visit .3s var(--ease) both}
@keyframes lp-visit{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}

/* Supported calendars, with their own marks */
.lp-vendors{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.lp-vendors-l{font-size:12px;color:var(--muted);margin-right:4px}
.lp-vendor{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid #e6e8ec;border-radius:999px;background:#fff;font-size:13px;font-weight:500;color:var(--ink);box-shadow:0 1px 2px rgba(15,17,20,.04)}
.lp-vendor svg{flex:none}

/* The preview is a picture of the app, not a live app: no clicks, no hover, no inner scroll. The tabs above still switch views. */
.lp-win .lp-app{pointer-events:none;user-select:none}
.lp-win .lp-app .cell,.lp-win .lp-app button,.lp-win .lp-app a{cursor:default}
.lp-pane .cal-wrap,.lp-pane .cal-wrap .cal{overflow:hidden}
.lp-pane .cal-wrap{scrollbar-width:none}
.lp-pane .cal-wrap::-webkit-scrollbar{display:none}
.lp-vendor img{flex:none;display:block;object-fit:contain}

/* "Connect calendars" tab: the Settings dialog (settings.js, the .st rules in app.css) open on Calendars, over the
 * owner page in the app's own scrim. It is a picture: the switches and menus do nothing. */
.lp-st{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:16px;background:rgba(246,248,252,.35);backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15)}
.lp-st[hidden]{display:none}
.lp-st .modal{transform:none;opacity:1;transition:none}
.lp-st .modal.st{height:min(740px,100%)}
.lp-st .st-scroll{overflow:hidden}
.lp-st .sec-h h2{line-height:normal;text-wrap:wrap}
@media (max-width:640px){.lp-st{padding:0}}
.menu.is-frozen{pointer-events:none;user-select:none}

/* The real owner page has no sidebar, so the preview shows none */
.lp-app{grid-template-columns:1fr}
.lp-app .lp-side{display:none}
.lp-cell img{flex:none;display:block}
.lp-contacts svg{display:block;transform:translateY(1px)}
.lp-install{border:0;background:none;padding:0;font:inherit;font-size:14.5px;font-weight:500;color:var(--dim);cursor:pointer}.lp-install:hover{color:var(--ink)}

/* The story sections between the hero and Questions: the scenes, then the integrations section. */
/* Story kit: the demo film's panels (white ground, 18px panels, 19px headers with a brand icon, Mon to Fri weeks, the
 * app's blue #2f6bff) as page components. Loads after base.css, pro.css, app.css and landing.css; uses their tokens. */
.sk-fit{position:relative;width:100%;min-width:0;overflow:hidden;contain:inline-size}
.sk-cv{position:relative;font-family:var(--font);color:#111318}
.sk-cv *{box-sizing:border-box}
.sk-cv>*,.sk-panel>*,.sk-win>*,.sk-read>*,.sk-shot>*,.sk-res>*{position:absolute}
.sk-panel{border-radius:18px;background:#fff;box-shadow:0 1px 2px rgba(17,19,24,.06),0 0 0 1px #e6e8ee,0 18px 40px -28px rgba(17,19,24,.35);transition:opacity .25s}
.sk-panel.is-dim{opacity:.42!important}
.sk-panel.is-oc{box-shadow:0 1px 2px rgba(17,19,24,.06),0 0 0 1px #d9e3ff,0 18px 40px -26px rgba(47,107,255,.45)}
.sk-ph{left:22px;top:18px;display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;letter-spacing:-.01em;white-space:nowrap}
.sk-ph img{width:26px;height:26px;display:block}
.sk-ok{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:#e9f7ef;color:#1d7a46;font-size:12.5px;font-weight:600;margin-left:6px}
.sk-dh{display:flex;justify-content:center;align-items:baseline;gap:5px;font-size:12px;font-weight:600;color:#5c6270;white-space:nowrap}
.sk-dh b{font-size:12px;color:#111318}
.sk-col{border-radius:8px;background:#fafafa;box-shadow:inset 0 0 0 1px #eceef3}
.sk-hl{font-size:11px;color:#686e7a}
.sk-ev{border-radius:6px;overflow:hidden;padding:3px 6px 0 7px;background:#e8f0fe;box-shadow:inset 0 0 0 1px #a8c7fa}
.sk-ev b{display:block;font-size:10.5px;font-weight:600;line-height:13px;color:#1d2230;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-ev.g-work{background:#e8f0fe;box-shadow:inset 0 0 0 1px #a8c7fa}
.sk-ev.g-personal{background:#e6f4ea;box-shadow:inset 0 0 0 1px #a8dab5}
.sk-ev.teams{background:#e8ebfa;box-shadow:inset 0 0 0 1px #b9bcef}
.sk-ev.icloud{background:#fdeedd;box-shadow:inset 0 0 0 1px #f5c08a}
.sk-ev.busy,.sk-ev.is-plain{background:#c9ced8;box-shadow:inset 0 0 0 1px #c9ced8}
.sk-ev.is-plain{transition:background-color .2s}
.sk-ev.is-new{background:var(--free-hover);box-shadow:none;overflow:visible;z-index:3}
.sk-ev.is-new b{color:#fff}
.sk-pulse{position:absolute;inset:0;border-radius:8px;box-shadow:0 0 0 3px rgba(47,107,255,.5);opacity:0;pointer-events:none}
.sk-fly{z-index:4;padding:0}
.sk-fly .sk-t{position:relative;padding:5px 11px 0;white-space:nowrap;overflow:hidden}
.sk-fly .sk-t b{font-size:13.5px;line-height:16px}
.sk-fly .sk-t small{display:block;font-size:11.5px;line-height:15px;color:#5c6270}
.sk-grey{position:absolute;inset:0;background:#c9ced8;opacity:0}
.sk-arrow{height:16px;background:linear-gradient(#c9ced8,#c9ced8) 0 7px/calc(100% - 10px) 2px no-repeat}
.sk-arrow::after{content:"";position:absolute;right:0;top:2px;width:10px;height:12px;background:#c9ced8;clip-path:polygon(0 0,100% 50%,0 100%)}
.sk-sweep{border-radius:8px;background:rgba(47,107,255,.08);box-shadow:inset 0 0 0 1.5px rgba(47,107,255,.5);opacity:0;z-index:2}
.sk-flip .sk-face{border-radius:18px;background:#fff;transition:opacity .28s}
.sk-flip .sk-face>*{position:absolute}
.sk-timer{right:20px;top:18px;display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 12px;border-radius:999px;background:#f3f4f7;font-size:14px;font-weight:600;color:#3a3f4b;font-variant-numeric:tabular-nums}
.sk-timer::before{content:"";width:12px;height:12px;border-radius:50%;box-shadow:inset 0 0 0 1.6px #3a3f4b}
.sk-compose{position:absolute}
.sk-to{font-size:13.5px;color:#6b7180;padding-bottom:10px;border-bottom:1px solid #eceef3;margin-bottom:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-txt{font-size:19px;line-height:1.45;color:#1d2230;white-space:pre-wrap}
.sk-txt.is-lg{font-size:24px}
.sk-txt u{color:var(--free);text-decoration-thickness:1.5px;text-underline-offset:3px}
.sk-caret{display:inline-block;width:2px;height:1.1em;background:var(--free);vertical-align:-3px;margin-left:1px;animation:sk-blink 1s steps(1) infinite}
@keyframes sk-blink{50%{opacity:0}}
.sk-win{background:#fff}
.sk-bar{display:flex;align-items:center;gap:7px;padding:0 16px;border-bottom:1px solid #eceef3;background:#f7f8fa;border-radius:18px 18px 0 0}
.sk-bar>i{width:11px;height:11px;border-radius:50%;background:#e2e4e9}
.sk-url{margin-left:14px;height:24px;display:inline-flex;align-items:center;padding:0 10px;border-radius:7px;background:#fff;box-shadow:inset 0 0 0 1px #e6e8ee;font:12px ui-monospace,SFMono-Regular,Menlo,monospace;color:#4d525b}
.sk-inbox{border-right:1px solid #eceef3}
.sk-row{position:absolute;padding:10px 12px;border-radius:10px;display:flex;flex-direction:column;gap:3px;font-size:13px;color:#5c6270}
.sk-row-top{display:flex;justify-content:space-between;gap:8px}
.sk-row b{font-weight:600;color:#111318;font-size:14px}
.sk-row em{font-style:normal;font-size:12px;color:#686e7a}
.sk-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-row.is-new b::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--free);margin-right:7px;vertical-align:1px}
.sk-row.is-sel{background:#eef3ff}
.sk-who{display:flex;align-items:center;gap:12px}
.sk-who b{display:block;font-size:16px}.sk-who small{font-size:13px;color:#6b7180}
.sk-who em{margin-left:auto;align-self:flex-start;font-style:normal;font-size:12.5px;color:#686e7a}
.sk-av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:600;font-size:15px;flex:none}
.sk-av-sam{background:#2f8f6b}
.sk-subj{margin:22px 0 10px;font-size:17px;font-weight:600;color:#1d2230}
.sk-body{font-size:21px;line-height:1.5;color:#2a2f3a}
.sk-sign{margin-top:16px;font-size:15px;line-height:1.5;color:#5c6270;white-space:pre-line}
.sk-msg>*{position:relative}
.sk-cursor{left:0;top:0;width:22px;height:22px;z-index:20;pointer-events:none;opacity:0}
.sk-cursor svg{position:relative;fill:#111318;stroke:#fff;stroke-width:1.4;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25));transition:transform .12s}
.sk-cursor.is-down svg{transform:translate(1px,1px)}
.sk-ring{position:absolute;border-radius:50%;background:rgba(47,107,255,.28);opacity:0}
.sk-btn{display:inline-flex;align-items:center;justify-content:center;height:34px;padding:0 14px;border-radius:9px;background:#fff;box-shadow:inset 0 0 0 1px #dfe2e8;font-size:13.5px;font-weight:600;color:#111318;white-space:nowrap;transition:transform .12s,background-color .12s}
.sk-btn.is-dark{background:#15171a;color:#fff;box-shadow:none}
.sk-btn.is-blue{background:var(--free);color:#fff;box-shadow:none}
.sk-btn.is-wide{display:flex;width:100%}
.sk-btn.is-press{transform:translateY(1px);filter:brightness(.92)}
.sk-nav{display:flex;flex-direction:column;gap:2px;padding:20px 12px;border-right:1px solid #eceef3}
.sk-nav span{padding:8px 12px;border-radius:8px;font-size:14px;color:#4d525b}
.sk-nav span.is-on{background:#f1f2f4;color:#111318;font-weight:600}
.sk-set>*{position:relative}
.sk-set h4{font-size:20px;font-weight:600;letter-spacing:-.01em}
.sk-note{margin-top:6px;font-size:14px;color:#6b7180}
.sk-setrow{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:18px;padding:18px 20px;border-radius:14px;box-shadow:inset 0 0 0 1px #e6e8ee}
.sk-setrow b{display:block;font-size:15px}.sk-setrow span:not(.sk-btn){display:block;margin-top:3px;font-size:13.5px;line-height:1.45;color:#6b7180}
.sk-setrow.is-faint{opacity:.55}
.sk-shade{background:rgba(21,23,26,.28);opacity:0;z-index:8;border-radius:18px}
.sk-shade.is-blur{background:rgba(251,251,252,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.sk-picker{z-index:9;padding:22px;border-radius:14px;background:#fff;box-shadow:0 24px 60px -20px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06);opacity:0}
.sk-picker>*{position:relative}
.sk-pk-t{display:block;font-size:16px;font-weight:600}
.sk-pk-tabs{display:flex;gap:26px;margin-top:16px;border-bottom:1px solid #eceef3;font-size:13.5px;color:#6b7180}
.sk-pk-tabs span{padding:0 0 10px}
.sk-pk-tabs .is-on{color:#1a5cd8;font-weight:600;box-shadow:inset 0 -2px #1a5cd8}
.sk-pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}
.sk-pk-th{padding:8px;border-radius:10px;box-shadow:inset 0 0 0 1px #e6e8ee;font-size:11.5px;color:#4d525b;transition:box-shadow .15s,background-color .15s}
.sk-pk-th span{display:block;margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sk-pk-th.is-sel{box-shadow:inset 0 0 0 2px #1a5cd8;background:#f2f6ff}
.sk-pk-pic{position:relative;height:96px;border-radius:6px;background:#f7f8fa;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:16px 8px 8px;align-content:start}
.sk-pk-pic i{height:14px;border-radius:3px;background:#dfe3ea}
.sk-pk-pic.is-teams{background:#f4f4fb}.sk-pk-pic.is-teams i{background:#d4d8f4}
.sk-pk-pic.is-teams i:nth-child(3n){height:26px}
.sk-pk-pic.is-google i{background:#cfe0fb}.sk-pk-pic.is-google i:nth-child(2n){background:#cfeedd;height:22px}
.sk-pk-pic.is-mail{grid-template-columns:1fr}.sk-pk-pic.is-mail i{height:6px}
.sk-pk-act{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.sk-read{opacity:0}
.sk-shot{border-radius:14px;background:#fbfbfc;box-shadow:inset 0 0 0 1px #e6e8ee}
.sk-shot .sk-ph{font-size:15px}
.sk-shot .sk-ph img{width:22px;height:22px}
.sk-lock{right:14px;top:16px;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:#15171a;color:#fff;font-size:12px;font-weight:600}
.sk-scan{height:3px;border-radius:2px;background:var(--free);box-shadow:0 0 18px 6px rgba(47,107,255,.35);opacity:0;z-index:5}
.sk-res{border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px #d9e3ff;opacity:0}
.sk-res-h{left:16px;top:14px;right:16px;display:flex;justify-content:space-between;align-items:baseline}
.sk-res-h b{font-size:15px}.sk-res-h span{font-size:12.5px;color:#6b7180}
.sk-field{display:flex;flex-direction:column;gap:4px}
.sk-field small{font-size:12px;color:#6b7180}
.sk-field span{height:34px;display:flex;align-items:center;padding:0 10px;border-radius:8px;box-shadow:inset 0 0 0 1px #dfe2e8;font-size:13.5px}
.sk-dock{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 14px;border-radius:16px;background:rgba(21,23,26,.94);color:#c9ccd3;font-size:13px;font-weight:500;box-shadow:0 12px 32px -8px rgba(0,0,0,.35)}
.sk-pill{height:30px;display:inline-flex;align-items:center;padding:0 12px;border-radius:9px;background:#2c2f36;color:#fff}
.sk-sep{width:1px;height:20px;background:#33363d}
.sk-link{margin-left:auto;display:flex;align-items:center;gap:10px;height:40px;padding:0 5px 0 14px;border-radius:11px;background:#fff;color:#111318}
.sk-link b{font-size:14px;letter-spacing:-.01em}
.sk-cp{display:grid;place-items:center;min-width:66px;height:30px;border-radius:8px;background:#15171a;color:#fff;font-size:12px;font-weight:600}
.sk-link.is-done{box-shadow:0 0 0 3px rgba(47,107,255,.5)}
.sk-sent{font-size:13.5px;font-weight:600;color:#1d7a46;opacity:0}
.sk-head{display:flex;align-items:center;gap:12px}
.sk-head b{display:block;font-size:17px;letter-spacing:-.01em}.sk-head small{font-size:12.5px;color:#686e7a}
.sk-avs{display:flex}.sk-avs .sk-av{width:32px;height:32px;font-size:13px}
.sk-av-maya{background:#15171a}.sk-av-sam2{background:var(--free);margin-left:-8px;box-shadow:0 0 0 2px #fff}
.sk-cell{border-radius:7px;overflow:hidden}
.sk-cell span{display:block;padding:5px 8px;font-size:11.5px;font-weight:600;color:#fff;white-space:nowrap}
.sk-cell.is-free{background:var(--free);transition:box-shadow .15s,background-color .15s}
.sk-cell.is-free.is-hover{background:var(--free-hover);box-shadow:0 6px 16px -6px rgba(47,107,255,.6)}
.sk-cell.is-solo{background:repeating-linear-gradient(135deg,#f6f8fc 0 5px,#e2e8f5 5px 6px)}
.sk-cell.is-pick{background:var(--free-hover);box-shadow:0 0 0 2px #fff,0 0 0 4px #15171a;opacity:0;z-index:3}
.sk-menu{z-index:6;padding:8px;border-radius:14px;background:rgba(255,255,255,.98);box-shadow:0 0 0 1px rgba(15,17,20,.06),0 16px 40px -12px rgba(15,17,20,.3);opacity:0}
.sk-menu>*{position:relative}
.sk-mh{padding:6px 8px;display:flex;flex-direction:column;gap:1px}.sk-mh b{font-size:13px}.sk-mh span{font-size:12px;color:#686e7a}
.sk-mi{padding:8px;font-size:13px;border-radius:8px}
.sk-menu hr{border:0;height:1px;background:#eef0f3;margin:2px 6px 6px}
.sk-as{padding:0 8px;font-size:12.5px}.sk-as span{color:#686e7a}
.sk-mnote{padding:4px 8px 10px;font-size:12px;line-height:1.45;color:#6b7180}
.sk-done{z-index:9;padding:24px 26px;border-radius:18px;background:#fff;text-align:center;box-shadow:0 30px 60px -24px rgba(15,17,20,.4),0 0 0 1px rgba(15,17,20,.05);opacity:0}
.sk-done>*{position:relative;display:block}
.sk-done-art{display:flex!important;justify-content:center;gap:6px;width:160px;margin:0 auto 18px;padding:12px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px #eceef3,0 8px 22px -12px rgba(47,107,255,.5)}
.sk-done-art span{display:grid;gap:3px}
.sk-done-art i{width:20px;height:8px;border-radius:3px;background:#eef0f4}
.sk-done-art i.is-on{background:var(--free)}
.sk-done b{font-size:18px}
.sk-done strong{margin-top:6px;font-size:14px;font-weight:600}
.sk-done p{margin:8px 0 16px;font-size:13px;line-height:1.5;color:#6b7180}

/* the chapter card from the film: the mark and one centred line */
.sk-chapter{display:grid;justify-items:center;gap:18px;text-align:center}
.sk-chapter img{width:44px;height:44px}

/* Teams tile loop (integrations): titles drop away and grey bars stay, CSS only */
.sk-mini{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:5px;height:118px;padding:8px;border-radius:10px;background:#f7f7fc;box-shadow:inset 0 0 0 1px #e4e6f5;overflow:hidden}
.sk-mini span{position:relative}
.sk-mini i{position:absolute;left:0;right:0;border-radius:4px;background:#e1e4f8;box-shadow:inset 0 0 0 1px #b9bcef;animation:sk-greyed 5s ease-in-out infinite}
.sk-mini i::after{content:"";position:absolute;left:4px;right:6px;top:4px;height:3px;border-radius:2px;background:#7b7fc7;animation:sk-title 5s ease-in-out infinite}
.sk-mini::after{content:"";position:absolute;left:8px;right:8px;top:8px;height:2px;background:var(--free);box-shadow:0 0 12px 4px rgba(47,107,255,.35);animation:sk-scan 5s ease-in-out infinite}
@keyframes sk-scan{0%{transform:translateY(0);opacity:0}5%{opacity:1}40%{transform:translateY(100px);opacity:1}45%,100%{transform:translateY(100px);opacity:0}}
@keyframes sk-title{0%,42%{opacity:1}55%,92%{opacity:0}100%{opacity:1}}
@keyframes sk-greyed{0%,45%{background:#e1e4f8;box-shadow:inset 0 0 0 1px #b9bcef}55%,90%{background:#c9ced8;box-shadow:inset 0 0 0 1px #c9ced8}100%{background:#e1e4f8;box-shadow:inset 0 0 0 1px #b9bcef}}

/* reveal for static blocks */
[data-reveal]{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
[data-reveal].sr-in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none}
  .sk-mini i,.sk-mini i::after,.sk-mini::after,.sk-caret{animation:none!important}
  .sk-mini i{background:#c9ced8;box-shadow:inset 0 0 0 1px #c9ced8}.sk-mini i::after,.sk-mini::after{opacity:0}
}

/* The scenes, then the integrations section. */
.sd{padding:96px 0 24px}
.sd .sk-chapter .lp-sub{margin:0 auto}
.sd-open{padding-bottom:40px}
.sd-act{display:flex;justify-content:center;align-items:center;gap:10px;margin:72px 0 28px;font-size:22px;font-weight:600;letter-spacing:-.015em;color:var(--dim)}
.sd-act.is-oc{color:var(--ink)}
.sd-act::before,.sd-act::after{content:"";flex:1;height:1px;background:var(--rule)}
.sd-shot{margin:0 0 56px;display:grid;justify-items:center}
.sd-frame{position:relative;width:100%;padding:14px;border-radius:20px;background:#f3f4f6;border:1px solid var(--rule)}
.sd-shot.is-teams .sd-frame{background:#eef3ff;border-color:#c5d5fd}
.sd-shot figcaption{display:grid;justify-items:center;gap:10px;margin-top:12px;position:relative;z-index:2;text-align:center}
.sd-shot figcaption b{display:inline-flex;align-items:center;min-height:44px;padding:10px 22px;border-radius:12px;background:#15171a;color:#fff;font-size:17px;font-weight:500;letter-spacing:-.005em;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.sd-shot figcaption span{font-size:15px;line-height:1.55;color:var(--dim)}
.sd-replay{position:absolute;right:24px;top:24px;z-index:3;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid var(--rule);border-radius:999px;background:#fff;font-size:12.5px;font-weight:600;color:var(--dim);opacity:0;transition:opacity .2s,color .2s}
.sd-replay:focus-visible, .sd-replay.is-on {opacity:1;}
@media (hover: hover) and (pointer: fine) {.sd-frame:hover .sd-replay {opacity:1;}}
.sd-replay:hover{color:var(--ink)}
.sd-card{margin:96px 0 40px;padding:56px 24px;border-radius:20px}
.sd-card.is-teams{background:#f4f7ff;border:1px solid #c5d5fd}

@media (max-width:640px){.sd-shot figcaption b{font-size:15px}}

/* integrations: sources wired into OpenCal; the Teams wire is the blue one */
.sb-int{padding-top:96px}
.sb-hub{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(120px,.6fr) minmax(0,.9fr);align-items:center}
.sb-src{list-style:none;display:grid;gap:8px;position:relative;z-index:1}
.sb-src li{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:12px;background:#fff;border:1px solid var(--rule)}
.sb-src li img,.sb-ic{flex:none;margin-top:1px}
.sb-src b{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600}
.sb-src small{display:block;margin-top:2px;font-size:13.5px;line-height:1.5;color:var(--dim)}
.sb-src em{font-style:normal;display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;background:var(--free-hover);color:#fff;font-size:11.5px;font-weight:600}
.sb-src li.is-teams{background:#f4f7ff;border-color:#c5d5fd}
.sb-ic{display:grid;place-items:center;width:24px;height:24px;color:var(--ink)}
.sb-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.sb-wires path{fill:none;stroke:#d6d9df;stroke-width:1.5}
.sb-wires path.is-teams{stroke:var(--free);stroke-width:2.5}
.sb-wires circle{fill:#aeb4bf}
.sb-wires circle.is-teams{fill:var(--free)}
.sb-core{grid-column:3;display:grid;justify-items:start;gap:14px;position:relative;z-index:1;padding-left:8px}
.sb-node{display:grid;justify-items:center;gap:6px;width:200px;padding:22px 16px;border-radius:18px;background:#fff;border:1px solid #d9e3ff;box-shadow:0 18px 40px -26px rgba(47,107,255,.5);text-align:center}
.sb-node b{font-size:17px}.sb-node span{font-size:13px;color:var(--faint)}
.sb-out{display:inline-flex;align-items:center;height:36px;padding:0 14px;border-radius:10px;background:var(--ink);color:#fff;font-size:14px;font-weight:600}
.sb-note,.sb-app{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.5;color:var(--dim)}
.sb-note{color:var(--ink);font-weight:500}
.sb-note span{color:var(--free);display:inline-grid;margin-top:2px}.sb-app span{display:inline-grid;margin-top:1px}
@media (max-width:980px){
  .sb-line{padding-left:56px}.sb-rail{left:15px}.sb-meta{left:-56px;width:32px}.sb-meta b{display:none}.sb-act::before{left:-46px}
  .sb-facts{grid-template-columns:1fr}
  .sb-hub{grid-template-columns:1fr;gap:20px}.sb-wires{display:none}.sb-core{grid-column:1;padding-left:0}
}

/* Example events: every event with a label is at least one label line tall, so a short event (Gym, 8 to 9am, which
 * sits before the 9am start of the week view) never draws as a thin bar with its title cut off. */
.sk-ev:has(>b){min-height:18px}

/* Icons: Phosphor Regular and real brand logos only. The browser extension row stacks the Chrome and Edge logos in the
 * icon column; the arrow between scene panels is Phosphor arrow-right in place of the CSS-drawn arrow. */
.sb-logos{display:grid;gap:6px;flex:none;margin-top:1px}
.sb-logos img{display:block}
.sk-arrow{display:grid;place-items:center;background:none;color:#aeb4bf}
.sk-arrow::after{content:none}
/* Non-brand icons beside brand logos are Microsoft Fluent Emoji 3D PNGs (MIT, fluent/LICENSE): link for .ics feeds,
 * a lock for the Teams note, a desktop computer for the installed app. */
.sb-3d{display:block;flex:none;margin-top:1px}
.sb-note img,.sb-app img{display:block;flex:none;margin-top:2px}

/* Scene 8: the booking in each person's OpenCal Bookings popover. The band before scene 9 (optional calendar setting). */
.sk-ocbar{display:flex;justify-content:flex-end}
.sk-ocbk{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;color:#3a3d44}
.sk-occount{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#2f6bff;color:#fff;font-style:normal;font-size:11.5px;font-weight:600}
.sk-ocpop{padding:12px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px rgba(15,17,20,.06),0 16px 40px -12px rgba(15,17,20,.28)}
.sk-ocpop-h{font-size:13.5px;font-weight:600;color:#111318;margin:0 0 10px}
.sk-ocrow{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid #eceef3;border-radius:12px}
.sk-ocrow-w{display:grid;gap:2px;flex:1;min-width:0}
.sk-ocrow-w strong{font-size:14.5px;font-weight:600;color:#111318}
.sk-ocrow-w span{font-size:12.5px;color:#6b7180}
.sk-ocrow-w em{font-style:normal;font-size:13px;color:#3a3d44}
.sk-ocwhere{flex:none;font-size:12px;color:#6b7180}
.sd-card.is-sync{background:#f4f7ff;border:1px solid #c5d5fd}
.sd-card-logos{display:flex;justify-content:center;gap:10px}

/* Scenes are pictures: clicks pass through them, so the Replay button above always receives its click. */
.sd-frame .sk-fit{pointer-events:none}
.sk-pk-pic{overflow:hidden}.sk-pk-pic.is-mail{gap:3px}.sk-pk-pic.is-mail i{height:4px}