/* Generated from the Planz design system (claude.ai/artifact/X4KkoB5W7mR4mXdXCiLMZi). Edit the system, not this file. */
@font-face{font-family:"Host Grotesk";src:url(fonts/HostGrotesk-Regular.ttf) format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(fonts/HostGrotesk-Medium.ttf) format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(fonts/HostGrotesk-SemiBold.ttf) format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:"Host Grotesk";src:url(fonts/HostGrotesk-Bold.ttf) format("truetype");font-weight:700;font-display:swap}
:root{--paper:#FFFBEA;--surface:#FFFFFF;--sunk:#F4EEDB;--ink:#170A40;--ink-2:#4A4466;--ink-3:#5F5980;--line:#E8E1CC;--line-strong:#8A8398;--blue:#4B1FD6;--blue-press:#4B1FD6;--blue-deep:#3A14B0;--blue-soft:#EDE8FD;--blue-on-ink:#B3A3FF;--lime:#FFE27A;--lime-press:#FFD84D;--lime-ink:#5C4700;--green:#03C977;--green-ink:#0A7A46;--sand:#FCE9D2;--danger:#E5443B;--danger-ink:#C9352D;--danger-on-ink:#FF9C95;--on-ink:#FFFBEA;--on-ink-2:#C4BEDD;--ink-raised:#241657;--ink-line:#7A6FB0;--focus:#4B1FD6;--focus-on-ink:#B3A3FF;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:144px;--radius-xs:10px;--radius-sm:14px;--radius-md:22px;--radius-lg:32px;--radius-pill:999px;--shadow-card:0 1px 2px rgba(23,10,64,0.05), 0 0 0 1px rgba(23,10,64,0.06);--shadow-float:0 40px 80px -32px rgba(23,10,64,0.35), 0 0 0 1px rgba(23,10,64,0.06);--font-sans:"Host Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;}
/* Planz components. Plain CSS over the tokens (tokens.css). Every class is pz-prefixed.
   Shape rule: interactive things are pills; UI cards radius-md; feature panels radius-lg; icon tiles radius-xs. */

.pz{font-family:var(--font-sans);color:var(--ink);-webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 0}
.pz *,.pz *::before,.pz *::after{box-sizing:border-box}
.pz-ic{width:1.25em;height:1.25em;fill:currentColor;flex:none;display:block}
.pz :focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* ---------- Button ---------- */
.pz-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:52px;padding:0 var(--space-5);border:0;border-radius:var(--radius-pill);background:var(--blue-press);color:#fff;font:500 16px/1 var(--font-sans);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .2s cubic-bezier(.2,.8,.2,1),transform .12s ease}
.pz-btn:hover{background:var(--blue-deep)}
.pz-btn:active{transform:scale(.98)}
.pz-btn .pz-ic{width:18px;height:18px;transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.pz-btn:hover .pz-ic{transform:translateX(2px)}
.pz-btn--quiet{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.pz-btn--quiet:hover{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-strong)}
.pz-btn--lime{background:var(--lime);color:var(--ink)}
.pz-btn--lime:hover{background:var(--lime-press)}
.pz-btn--sm{height:40px;padding:0 var(--space-4);font-size:15px}

/* ---------- Status pill ---------- */
.pz-status{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:var(--radius-pill);font:600 12px/1 var(--font-sans);letter-spacing:.01em;white-space:nowrap}
.pz-status .pz-ic{width:14px;height:14px}
.pz-status--forming{background:var(--blue-soft);color:var(--blue-press)}
.pz-status--locked{background:var(--lime);color:var(--lime-ink)}
.pz-status--open{background:var(--sunk);color:var(--ink-2)}

/* ---------- Activity chip ---------- */
.pz-chip{display:inline-flex;align-items:center;gap:var(--space-2);height:40px;padding:0 var(--space-4) 0 var(--space-3);border-radius:var(--radius-pill);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);font:500 15px/1 var(--font-sans);color:var(--ink)}
.pz-chip .pz-ic{width:18px;height:18px;color:var(--blue-press)}
.pz-chip.is-on{background:var(--blue-soft);box-shadow:inset 0 0 0 1.5px var(--blue-press);color:var(--blue-press)}

/* ---------- Avatar ---------- */
.pz-av{--s:36px;width:var(--s);height:var(--s);border-radius:50%;display:grid;place-items:center;flex:none;background:var(--lime);color:var(--ink);font:600 calc(var(--s)*.4)/1 var(--font-sans);letter-spacing:-.02em}
.pz-av--blue{background:var(--blue-soft)}
.pz-av--sand{background:var(--sand)}
.pz-av--ink{background:var(--ink);color:var(--on-ink)}
.pz-avs{display:flex}
.pz-avs .pz-av{box-shadow:0 0 0 2px var(--surface)}
.pz-avs .pz-av+.pz-av{margin-left:-8px}

/* ---------- Seats: the number a nudge needs ---------- */
.pz-seats{display:flex;align-items:center;gap:var(--space-3)}
.pz-seats ol{display:flex;gap:6px;margin:0;padding:0;list-style:none}
.pz-seat{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:600 13px/1 var(--font-sans);background:var(--blue-soft);color:var(--ink)}
.pz-seat--open{background:transparent;box-shadow:inset 0 0 0 1.5px var(--line-strong);color:var(--ink-3)}
.pz-seats--locked .pz-seat{background:var(--lime)}
.pz-seats b{font:600 15px/1 var(--font-sans);font-variant-numeric:tabular-nums}
.pz-seats span{font:500 14px/1.2 var(--font-sans);color:var(--ink-2)}

/* ---------- Chat thread: the group chat that never lands ---------- */
.pz-chat{width:100%;max-width:380px;border-radius:var(--radius-lg);background:var(--sunk);overflow:hidden;box-shadow:var(--shadow-card)}
.pz-chat__top{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-4) var(--space-3);background:var(--surface)}
.pz-chat__top div>b{display:block;font:600 16px/1.2 var(--font-sans)}
.pz-chat__top div>span{display:block;font:500 13px/1.3 var(--font-sans);color:var(--ink-3)}
.pz-chat__unread{margin-left:auto;min-width:28px;height:24px;padding:0 8px;border-radius:var(--radius-pill);background:var(--ink);color:var(--on-ink);font:600 12px/24px var(--font-sans);text-align:center;font-variant-numeric:tabular-nums}
.pz-chat__thread{display:flex;flex-direction:column;gap:6px;padding:var(--space-4)}
.pz-msg{align-self:flex-start;max-width:82%;padding:9px 13px;border-radius:var(--radius-md);border-bottom-left-radius:6px;background:var(--surface);font:400 15px/1.35 var(--font-sans);color:var(--ink)}
.pz-msg b{display:block;font:600 12px/1.3 var(--font-sans);color:var(--ink-3);margin-bottom:2px}
.pz-msg--me{align-self:flex-end;background:var(--ink);color:var(--on-ink);border-radius:var(--radius-md);border-bottom-right-radius:6px}
.pz-msg--typing{display:flex;gap:4px;padding:13px 14px}
.pz-msg--typing i{width:7px;height:7px;border-radius:50%;background:var(--ink-3);opacity:.5}

/* ---------- Nudge card: forming ---------- */
.pz-card{width:100%;max-width:380px;border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-card);padding:var(--space-5)}
.pz-card__head{display:flex;align-items:center;gap:var(--space-3)}
.pz-tile{width:44px;height:44px;border-radius:var(--radius-xs);display:grid;place-items:center;background:var(--blue-soft);color:var(--blue-press);flex:none}
.pz-tile .pz-ic{width:22px;height:22px}
.pz-card__head .pz-status{margin-left:auto}
.pz-card h4{margin:0;font:600 18px/1.2 var(--font-sans);letter-spacing:-.015em}
.pz-card__meta{margin:2px 0 0;font:500 14px/1.3 var(--font-sans);color:var(--ink-3)}
.pz-card__body{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--line)}
.pz-card__note{margin:var(--space-3) 0 0;font:400 14px/1.4 var(--font-sans);color:var(--ink-2)}

/* ---------- Plan card: locked ---------- */
.pz-plan{width:100%;max-width:380px;border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-card);overflow:hidden}
.pz-plan__band{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-5);background:var(--lime)}
.pz-plan__band h4{margin:0;font:600 20px/1.15 var(--font-sans);letter-spacing:-.02em;color:var(--ink)}
.pz-plan__band>span{display:inline-flex;align-items:center;gap:6px;font:600 13px/1 var(--font-sans);color:var(--lime-ink)}
.pz-plan__band .pz-ic{width:16px;height:16px}
.pz-plan dl{margin:0;padding:var(--space-2) var(--space-5)}
.pz-plan__row{display:grid;grid-template-columns:36px 1fr;gap:var(--space-3);align-items:center;padding:var(--space-3) 0}
.pz-plan__row+.pz-plan__row{border-top:1px solid var(--line)}
.pz-plan__row .pz-tile{width:36px;height:36px;background:var(--sunk);color:var(--ink-2)}
.pz-plan__row .pz-tile .pz-ic{width:18px;height:18px}
.pz-plan dt{font:600 11px/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.pz-plan dd{margin:4px 0 0;font:500 15px/1.3 var(--font-sans);color:var(--ink)}
.pz-plan__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--space-5) var(--space-5)}
.pz-plan__foot .pz-btn{height:44px;padding:0 var(--space-4);font-size:15px}

/* ---------- Circle card ---------- */
.pz-circle{width:100%;max-width:380px;border-radius:var(--radius-md);background:var(--surface);box-shadow:var(--shadow-card);padding:var(--space-5);display:grid;gap:var(--space-4)}
.pz-circle__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}
.pz-circle h4{margin:0;font:600 18px/1.2 var(--font-sans);letter-spacing:-.015em}
.pz-circle__head p{margin:2px 0 0;font:500 14px/1.3 var(--font-sans);color:var(--ink-3)}
.pz-circle__next{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-sm);background:var(--sunk)}
.pz-circle__next div>b{display:block;font:600 14px/1.3 var(--font-sans)}
.pz-circle__next div>span{display:block;font:500 13px/1.3 var(--font-sans);color:var(--ink-2)}
.pz-circle__next .pz-tile{width:40px;height:40px;background:var(--surface)}

/* ---------- Device: flat, front-on, no 3D ---------- */
.pz-device{width:300px;aspect-ratio:9/19.5;padding:10px;border-radius:48px;background:var(--ink);box-shadow:var(--shadow-float)}
.pz-device__screen{position:relative;height:100%;border-radius:38px;background:var(--paper);overflow:hidden;display:flex;flex-direction:column}
.pz-device__bar{display:flex;justify-content:space-between;align-items:center;padding:16px 26px 0;font:600 14px/1 var(--font-sans);color:var(--ink)}
.pz-device__island{position:absolute;top:11px;left:50%;width:84px;height:24px;margin-left:-42px;border-radius:var(--radius-pill);background:var(--ink)}
.pz-device__body{flex:1;min-height:0;padding:var(--space-5) var(--space-3) var(--space-3);display:flex;flex-direction:column;gap:var(--space-3)}
.pz-device__body>*{zoom:.84}
.pz-device__body h5{margin:0 var(--space-2);font:600 24px/1.1 var(--font-sans);letter-spacing:-.02em}

/* ---------- Nav ---------- */
.pz-nav{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);height:68px;padding:0 var(--space-5);background:color-mix(in srgb,var(--paper) 82%,transparent);backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);border-bottom:1px solid var(--line)}
.pz-logo{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none}
.pz-logo svg{display:block}
.pz-nav__links{display:flex;align-items:center;gap:var(--space-5)}
.pz-nav__links a:not(.pz-btn){font:500 15px/1 var(--font-sans);color:var(--ink-2);text-decoration:none}
.pz-nav__links a:not(.pz-btn):hover{color:var(--ink)}

/* ---------- Waitlist ---------- */
.pz-join{max-width:480px;display:grid;gap:var(--space-2);color:var(--on-ink)}
.pz-join label{font:500 14px/1 var(--font-sans);color:var(--on-ink-2)}
.pz-join__row{display:flex;gap:var(--space-2)}
.pz-join input{flex:1;min-width:0;height:56px;padding:0 var(--space-5);border:0;border-radius:var(--radius-pill);background:var(--ink-raised);box-shadow:inset 0 0 0 1.5px var(--ink-line);color:var(--on-ink);font:400 16px/1 var(--font-sans)}
.pz-join input::placeholder{color:var(--on-ink-2)}
.pz-join input:focus-visible{outline:3px solid var(--focus-on-ink);outline-offset:2px}
.pz-join .pz-btn{height:56px}
.pz-join__hint{min-height:20px;font:500 14px/1.4 var(--font-sans);color:var(--on-ink-2)}
.pz-join--error input{box-shadow:inset 0 0 0 1.5px var(--danger-on-ink)}
.pz-join--error .pz-join__hint{color:var(--danger-on-ink)}
.pz-join__done{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);background:var(--lime);color:var(--ink);font:500 15px/1.4 var(--font-sans)}
.pz-join__done .pz-ic{width:22px;height:22px;color:var(--lime-ink)}

/* ---------- FAQ ---------- */
.pz-faq{max-width:720px}
.pz-faq details{border-top:1px solid var(--line)}
.pz-faq details:last-child{border-bottom:1px solid var(--line)}
.pz-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);padding:var(--space-5) 0;font:600 19px/1.3 var(--font-sans);letter-spacing:-.01em;color:var(--ink)}
.pz-faq summary::-webkit-details-marker{display:none}
.pz-faq summary .pz-ic{width:20px;height:20px;color:var(--ink-3);transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.pz-faq details[open] summary .pz-ic{transform:rotate(45deg)}
.pz-faq details p{margin:0;padding:0 0 var(--space-5);max-width:60ch;font:400 17px/1.55 var(--font-sans);color:var(--ink-2)}

/* consent bar (track.js) */
.pz-consent{position:fixed;z-index:50;left:var(--space-4);right:var(--space-4);bottom:calc(var(--space-4) + env(safe-area-inset-bottom,0px));max-width:560px;margin-inline:auto;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-4);padding:var(--space-4) var(--space-5);border-radius:var(--radius-lg);background:var(--surface);color:var(--ink);box-shadow:var(--shadow-float)}
.pz-consent p{flex:1 1 260px;margin:0;font:400 14px/1.45 var(--font-sans);color:var(--ink-2)}
.pz-consent div{display:flex;gap:var(--space-2)}

@media (prefers-reduced-motion:reduce){.pz *{transition:none!important;animation:none!important}}