/* Creator sign-up (#1425): canvas page 24, row "Creator onboarding" (#1420), CO1–CO4 and a simple draft page.
   The green is the creator page's trial palette (logo green), only on these pages until the app palette is decided. */
.creators{--co-ink:#13213B;--co-muted:#4E5B73;--co-faint:#6B7689;--co-hint:#8B96A8;--co-line:#E6E6E9;--co-line-2:#EFEFF1;--co-field:#CDD2DA;
 --co-grey:#E9EBEE;--co-soft:#F6F6F7;--co-green:#0D402C;--co-cream:#FEFAEA;--co-green-soft:#E8F0EC;--co-green-tint:#F3FAF6;--co-ok:#2E9E6A;--co-ok-text:#1F7A50;
 color:var(--co-ink);font-family:'Plus Jakarta Sans',-apple-system,system-ui,sans-serif;margin:0}
body.creators:not(.in-trip){background:#FFFFFF;display:block}
.creators #co{display:block;padding:0;width:100%;max-width:none}
/* Onboarding screens scroll inside themselves, never the page, so iOS Chrome's address bar never hides and then
   covers the next screen's top (Bowen, Nov 3). The sample trip page (tp-open) scrolls the window. */
html.co-fixed,html.co-fixed body{height:100%;min-height:0;overflow:hidden;overscroll-behavior:none}
html.co-fixed .co-screen{height:100vh;height:100dvh;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.co-toast[hidden]{display:none}
.creators *{box-sizing:border-box}
.co-loading{padding:40px 16px;color:var(--co-muted)}
.co-screen{width:100%;min-width:0;max-width:480px;margin:0 auto;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;position:relative;overflow-x:hidden}
.co-body{flex:1;padding:12px 16px 24px;display:flex;flex-direction:column;gap:16px;animation:co-up .25s ease-out 1}
.co-top{display:flex;align-items:center;gap:8px;padding:calc(4px + env(safe-area-inset-top,0px)) 16px 0 6px}
.co-back{width:44px;height:44px;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer;color:var(--co-ink)}
.co-progress{flex:1;height:4px;border-radius:2px;background:var(--co-grey);position:relative;overflow:hidden}
.co-progress span{position:absolute;inset:0 auto 0 0;background:var(--co-green);transition:width .3s}
.co-stepof{font-size:12px;font-weight:700;color:var(--co-faint)}
.co-bar{position:sticky;bottom:0;background:#FFFFFF;border-top:1px solid var(--co-line-2);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:6px}
.co-primary{min-height:48px;border:0;border-radius:8px;background:var(--co-green);color:var(--co-cream);font:inherit;font-size:16px;font-weight:700;cursor:pointer;width:100%}
.co-primary:disabled{background:var(--co-grey);color:var(--co-hint);cursor:default}
.co-note{font-size:12px;color:var(--co-faint);text-align:center;margin:0}
.co-h1{margin:0;font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1.15}
.co-sub{margin:0;font-size:15px;line-height:1.45;color:var(--co-muted)}
.co-head{display:flex;flex-direction:column;gap:6px}
.co-fine{margin:0;font-size:13px;line-height:1.45;color:var(--co-faint)}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--co-green);outline-offset:2px}
@keyframes co-up{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
@keyframes co-fall{0%{transform:translateY(-40px) rotate(0);opacity:1}100%{transform:translateY(560px) rotate(540deg);opacity:0}}
@keyframes co-pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
@keyframes co-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.creators *{animation-duration:.01s!important;animation-delay:0s!important;transition:none!important}}

/* CO1 · Welcome */
.co-welcome{padding:calc(20px + env(safe-area-inset-top,0px)) 16px 24px;gap:18px}
.co-wordmark{height:20px;align-self:flex-start;display:block}
.co-deck{position:relative;height:270px;margin:0 -16px;overflow:hidden;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.co-deck.dragging{cursor:grabbing}
.co-trip{position:absolute;left:50%;top:14px;width:160px;height:220px;margin-left:-80px;transform-origin:50% 810px;animation:co-fan .95s cubic-bezier(.2,.85,.25,1) backwards;pointer-events:none}
.co-trip-body{position:relative;width:160px;height:220px;border-radius:14px;overflow:hidden;box-shadow:0 10px 24px rgba(19,33,59,.22)}
.co-trip-body img{width:100%;height:100%;object-fit:cover;display:block;-webkit-user-drag:none}
.co-trip-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(19,33,59,.18) 0%,rgba(19,33,59,0) 28%,rgba(19,33,59,0) 50%,rgba(19,33,59,.82) 100%)}
.co-trip-days{position:absolute;left:8px;top:8px;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--co-ink);font-size:11px;font-weight:800}
.co-trip-text{position:absolute;left:10px;right:10px;bottom:10px;display:flex;flex-direction:column;gap:2px;color:#FFFFFF}
.co-trip-text b{font-size:15px;line-height:1.2;letter-spacing:-.01em}
.co-trip-text span{font-size:11px;color:#E9EBEE}
@keyframes co-fan{from{transform:rotate(var(--s0))}}
.co-hero{margin:0;font-size:30px;line-height:1.1;font-weight:800;letter-spacing:-.03em}
.co-lede{margin:0;font-size:15px;line-height:1.5;color:var(--co-muted)}
.co-perks{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;list-style:none}
.co-perks li{display:flex;gap:12px;align-items:flex-start}
.co-perk-icon{width:36px;height:36px;flex-shrink:0;border-radius:10px;background:var(--co-green-soft);display:grid;place-items:center}
.co-perks b{display:block;font-size:15px}
.co-perks span span{display:block;font-size:14px;line-height:1.4;color:var(--co-muted)}

/* CO2 · Claim your page */
.co-photo{align-self:flex-start;border:0;background:none;padding:0;font:inherit;color:var(--co-ink);cursor:pointer;display:flex;align-items:center;gap:14px;text-align:left}
.co-photo-ring{width:72px;height:72px;flex-shrink:0;border-radius:50%;border:2px dashed #B4BCCB;background:var(--co-soft);display:grid;place-items:center;overflow:hidden}
.co-photo-ring.has{border:0}
.co-photo-ring img{width:100%;height:100%;object-fit:cover;display:block}
.co-photo b{font-size:15px}
.co-field{display:flex;flex-direction:column;gap:6px}
.co-label{font-size:13px;font-weight:600;color:var(--co-muted);display:flex;justify-content:space-between}
.co-input{height:50px;border:1px solid var(--co-field);border-radius:8px;padding:0 12px;font:inherit;font-size:16px;color:var(--co-ink);background:#FFFFFF;outline:none;width:100%}
.co-input:focus{border:2px solid var(--co-green);padding:0 11px}
.co-link{height:50px;border:2px solid var(--co-green);border-radius:8px;padding:0 12px;display:flex;align-items:center;font-size:16px}
.co-link span{color:var(--co-faint)}
.co-link input{flex:1;min-width:0;border:0;outline:none;font:inherit;font-weight:700;color:var(--co-ink);background:none;padding:0}
.co-avail{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:700;white-space:normal;overflow-wrap:anywhere}
.co-avail:empty{display:none}
.co-avail.ok{color:var(--co-ok-text)}
.co-avail.no{color:#9A3B2B}

/* CO3 · Where do you post + verify sheet */
.co-list{border:1px solid var(--co-line);border-radius:12px;overflow:hidden}
.co-row{display:flex;align-items:center;gap:12px;padding:12px;border-bottom:1px solid var(--co-line-2);width:100%;background:none;border-left:0;border-right:0;border-top:0;font:inherit;color:var(--co-ink);text-align:left}
.co-list>.co-row:last-child,.co-list>details:last-child .co-row{border-bottom:0}
button.co-row{cursor:pointer}
.co-mark{width:40px;height:40px;flex-shrink:0;border-radius:10px;color:#FFFFFF;display:grid;place-items:center;font-size:16px;font-weight:800}
.co-mark.plain{background:#F1F2F4}
.co-row-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.co-row-text b{font-size:15px}
.co-row-text span{font-size:13px;color:var(--co-faint)}
.co-row-text span.ok{color:var(--co-ok-text)}
.co-verify{height:34px;padding:0 12px;border-radius:8px;border:0;background:var(--co-green);color:var(--co-cream);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.co-verify.done{background:var(--co-green-soft);color:var(--co-ok-text);cursor:default}
.co-chev{flex-shrink:0;transition:transform .2s}
.co-other[open] .co-chev{transform:rotate(90deg)}
.co-other summary{list-style:none}
.co-other summary::-webkit-details-marker{display:none}
.co-other-form{padding:0 12px 12px;display:flex;flex-direction:column;gap:8px}
.co-other-form .co-input{height:44px;font-size:15px}
.co-small-btn{height:40px;border:0;border-radius:8px;background:var(--co-grey);color:var(--co-ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.co-scrim{position:fixed;inset:0;background:rgba(19,33,59,.38);z-index:20}
.co-sheet{max-height:90dvh;overflow-y:auto;position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:100%;max-width:480px;z-index:21;background:#FFFFFF;border-radius:20px 20px 0 0;padding:10px 20px calc(22px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px;animation:co-up .22s ease-out 1}
.co-grab{align-self:center;width:36px;height:5px;border-radius:3px;background:var(--co-line)}
.co-sheet-head{display:flex;align-items:center;justify-content:space-between}
.co-sheet-head b{font-size:22px;letter-spacing:-.02em}
.co-x{width:32px;height:32px;border:0;border-radius:50%;background:#F1F2F4;display:grid;place-items:center;cursor:pointer}
.co-after{display:contents}.co-after[hidden]{display:none}
.co-steps{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.co-steps li{display:flex;gap:10px;align-items:center;font-size:14px}
.co-steps li>span:first-child{width:24px;height:24px;flex-shrink:0;border-radius:50%;background:var(--co-green-soft);color:var(--co-green);display:grid;place-items:center;font-size:12px;font-weight:800}
.co-steps li>span:nth-child(2){flex:1}
.co-copy{height:32px;padding:0 10px;border-radius:8px;border:1px solid var(--co-field);background:#FFFFFF;font:inherit;font-size:13px;font-weight:700;color:var(--co-ink);cursor:pointer}
.co-textlink{align-self:center;border:0;background:none;padding:0;font:inherit;font-size:13px;font-weight:700;color:var(--co-muted);cursor:pointer;text-decoration:underline}
.co-wait{padding:20px 0 8px;display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--co-muted)}
.co-spinner{width:32px;height:32px;border-radius:50%;border:3px solid var(--co-grey);border-top-color:var(--co-green);animation:co-spin .8s linear infinite}
.co-done{padding:8px 0;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.co-done svg{animation:co-pop .4s ease-out 1}
.co-done b{font-size:18px}
.co-done span{font-size:14px;line-height:1.45;color:var(--co-muted)}

/* CO4 · Your plan */
.co-plan{padding:40px 20px 24px;align-items:center;text-align:center;gap:14px}
.co-plan-icon{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;animation:co-pop .5s ease-out 1}
.co-plan-icon.free{background:var(--co-ok)}
.co-plan-icon.trial{background:#F1F2F4}
.co-plan .co-h1{font-size:28px}
.co-plan .co-sub{line-height:1.5}
.co-plan-rows{width:100%;margin-top:6px;padding:14px;border-radius:12px;background:var(--co-soft);display:flex;flex-direction:column;gap:8px;text-align:left}
.co-plan-rows div{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.co-plan-rows dt{color:var(--co-muted)}
.co-plan-rows dd{margin:0;font-weight:700}
.co-plan .co-fine{font-size:12px;color:var(--co-hint)}
.co-confetti{position:absolute;left:0;right:0;top:0;height:560px;overflow:hidden;pointer-events:none;z-index:2}
.co-confetti span{position:absolute;top:0;left:var(--x);width:var(--w);height:var(--h);border-radius:2px;background:var(--c);opacity:0;animation:co-fall var(--d) ease-in var(--delay) 1 both}

/* Draft page */
.co-draft{gap:14px}
.co-pill{align-self:flex-start;display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}
.co-pill.draft{background:#FFF4D6;color:#7A5600}
.co-pill.ok{background:var(--co-green-soft);color:var(--co-ok-text)}
.co-me{display:flex;align-items:center;gap:14px}
.co-avatar{width:64px;height:64px;flex-shrink:0;border-radius:50%;background:linear-gradient(135deg,#FF8A65 0%,#FFC48A 100%);display:grid;place-items:center;font-size:26px;font-weight:800;overflow:hidden}
.co-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.co-me-text b{font-size:24px;letter-spacing:-.03em;display:block;color:var(--co-ink)}
.co-me-text span{font-size:14px;color:var(--co-muted)}
.co-chips{display:flex;flex-wrap:wrap;gap:6px}
.co-card{padding:16px;border-radius:14px;border:1px solid var(--co-line);display:flex;flex-direction:column;gap:6px}
.co-card b{font-size:18px;letter-spacing:-.02em}
.co-card p{margin:0;font-size:14px;line-height:1.45;color:var(--co-muted)}
.co-edit{align-self:flex-start;font-size:14px;font-weight:700;color:var(--co-ink)}

/* Toast: the page 11 pill (T0, #737), 12 px above the bottom bar */
.co-toast{position:fixed;left:16px;right:16px;bottom:calc(86px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;justify-content:center;pointer-events:none}
.co-toast-pill{max-width:358px;min-height:44px;padding:0 18px 0 12px;border-radius:999px;background:#FFFFFF;border:1px solid var(--co-line);box-shadow:0 10px 28px rgba(19,33,59,.16);display:flex;align-items:center;gap:10px;white-space:nowrap;animation:co-up .2s ease-out 1}
.co-toast-dot{fill:var(--co-ok)}
.co-toast.error .co-toast-dot{fill:#D64545}
.co-toast-text{overflow:hidden;text-overflow:ellipsis;font-size:15px;font-weight:600;color:var(--co-ink)}
.co-mark:has(img){overflow:hidden}.co-mark.youtube,.co-mark.pinterest{border:1px solid #E4E7EC}.co-mark img{width:100%;height:100%;display:block}

/* Sample trip page (#1434): canvas page 24 TP2. Ratings (Bowen, Nov 3): emoji pill at the photo's bottom left. */
body.creators.tp-open .co-toast{bottom:calc(132px + env(safe-area-inset-bottom,0px))}
.tp{background:#FFFFFF;overflow-x:clip} /* clip, not hidden: hidden would stop the bottom bar from sticking */
.tp-scroll{flex:1;padding-bottom:24px}
.tp-cover{position:relative;height:420px;overflow:hidden;background:#13213B;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.tp-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s;-webkit-user-drag:none}
.tp-slide.on{opacity:1}
.tp-cover-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(19,33,59,.35) 0%,rgba(19,33,59,0) 25%,rgba(19,33,59,0) 45%,rgba(19,33,59,.85) 100%);pointer-events:none}
.tp-round{position:absolute;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center;cursor:pointer;color:var(--co-ink)}
.tp-back{left:12px;top:calc(12px + env(safe-area-inset-top,0px))}
.tp-share{right:12px;top:calc(12px + env(safe-area-inset-top,0px))}
.tp-cover-text{position:absolute;left:16px;right:16px;bottom:30px;display:flex;flex-direction:column;gap:6px;color:#FFFFFF;pointer-events:none}
.tp-kicker{font-size:12px;font-weight:800;letter-spacing:.06em;opacity:.9}
.tp-cover-text h1{margin:0;font-size:28px;line-height:1.1;letter-spacing:-.03em;font-weight:800}
.tp-by{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.tp-avatar{width:24px;height:24px;border-radius:50%;background:var(--co-cream);color:var(--co-green);display:grid;place-items:center;font-size:12px;font-weight:800}
.tp-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:5px}
.tp-dot{width:6px;height:6px;padding:0;border:0;border-radius:3px;background:rgba(255,255,255,.5);overflow:hidden;cursor:pointer;transition:width .25s;position:relative}
.tp-dot.on{width:26px}
.tp-dot span{position:absolute;inset:0 auto 0 0;width:0;background:#FFFFFF}
.tp-glance{padding:14px 16px 0;display:flex;flex-wrap:wrap;gap:6px}
.tp-chip{display:flex;align-items:center;gap:5px;padding:6px 10px;border-radius:10px;background:var(--co-soft);font-size:13px}
.tp-chip span{color:var(--co-faint)}
.tp-note{margin:14px 16px 0;padding:14px;border-radius:12px;border:1px solid var(--co-line);font-size:15px;line-height:1.5}
.tp-section{padding:22px 16px 0;display:flex;flex-direction:column;gap:10px}
.tp-section h2{margin:0;font-size:18px;font-weight:800}
.tp-h2row{display:flex;align-items:baseline;justify-content:space-between}
.tp-h2row span{font-size:13px;color:var(--co-faint)}
.tp-stays{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 4px;scroll-padding:0 16px;scrollbar-width:none}
.tp-stays::-webkit-scrollbar{display:none}
.tp-stay{flex:0 0 100%;scroll-snap-align:start;border-radius:14px;border:1px solid var(--co-line);overflow:hidden;display:flex;flex-direction:column}
.tp-stays.many .tp-stay{flex-basis:300px}
.tp-stay-photo,.tp-place-photo{position:relative;display:block;width:100%;padding:0;border:0;cursor:pointer;background:var(--co-soft)}
.tp-stay-photo{height:150px}
.tp-place-photo{height:130px}
.tp-stay-photo img,.tp-place-photo img{width:100%;height:100%;object-fit:cover;display:block}
.tp-nights{position:absolute;left:8px;top:8px;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.94);color:var(--co-ink);font-size:12px;font-weight:800}
.tp-stay-body{flex:1;padding:12px;display:flex;flex-direction:column;gap:6px}
.tp-name-row{display:flex;align-items:flex-start;gap:8px}
.tp-stay-name{flex:1;font-size:17px}
.tp-sub{font-size:13px;color:var(--co-muted)}
.tp-words{flex:1;margin:0;font-size:14px;line-height:1.45}
.tp-stay-foot{margin-top:4px;display:flex;align-items:center;gap:8px}
.tp-area{flex:1;font-size:13px;color:var(--co-muted)}
.tp-area b{color:var(--co-ink);font-size:15px}
.tp-icon{flex-shrink:0;width:32px;height:32px;border:1px solid var(--co-field);border-radius:8px;background:#FFFFFF;display:grid;place-items:center;cursor:pointer;color:var(--co-ink);padding:0}
.tp-icon.big{width:38px;height:38px}
.tp-green{flex-shrink:0;white-space:nowrap;height:38px;padding:0 14px;border:0;border-radius:8px;background:var(--co-green);color:var(--co-cream);font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.tp-day{padding-top:24px;gap:10px}
.tp-day-title{display:flex;align-items:center;gap:8px}
.tp-day-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.tp-item{display:flex;gap:12px;padding:4px 0} /* the time on the left, the card on the right (canvas TP2) */
.tp-when{width:62px;flex-shrink:0;padding-top:4px;font-size:12px;font-weight:700;color:var(--co-muted)}
.tp-place{flex:1;min-width:0;border-radius:12px;border:1px solid var(--co-line);overflow:hidden}
.tp-rate{position:absolute;left:8px;bottom:8px;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:800;box-shadow:0 2px 8px rgba(19,33,59,.18)}
.tp-rate.fav{background:var(--co-green);color:var(--co-cream)}
.tp-rate.liked{background:rgba(255,255,255,.94);color:var(--co-ok-text)}
.tp-rate.ok{background:rgba(241,242,244,.94);color:var(--co-muted)}
.tp-rate.skip{background:#9A3B2B;color:#FFFFFF}
.tp-place-body{padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.tp-place-name{flex:1;min-width:0;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:15px}
.tp-place-name span{font-size:12px;font-weight:800;color:var(--co-muted)}
.tp-tip{margin:0;font-size:13px;line-height:1.45}
.tp-book{align-self:flex-start;display:flex;align-items:center;gap:5px;padding:3px 8px;border-radius:8px;background:#FFF4D6;color:#7A5600;font-size:12px;font-weight:700}
.tp-walk{display:flex;align-items:center;gap:8px;padding-left:18px;font-size:12px;color:var(--co-faint)}
.tp-before{list-style:none;margin:0;padding:12px;border-radius:12px;background:var(--co-soft);display:flex;flex-direction:column;gap:10px} /* one card, as on TP2 */
.tp-before li{display:flex;flex-direction:column;gap:2px}
.tp-check{display:flex;align-items:flex-start;gap:10px;width:100%;padding:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer}
.tp-box{width:20px;height:20px;box-sizing:border-box;flex-shrink:0;margin-top:1px;border-radius:6px;border:2px solid #B4BCCB;background:#FFFFFF;display:grid;place-items:center;color:transparent;transition:background .15s,border-color .15s}
.tp-box svg{width:12px;height:12px}
.tp-check[aria-checked="true"] .tp-box{background:var(--co-green);border-color:var(--co-green);color:var(--co-cream)}
.tp-check-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.tp-check-text b{font-size:14px;transition:color .15s}
.tp-check-text span{font-size:12px;line-height:1.45;color:var(--co-muted)}
.tp-check[aria-checked="true"] .tp-check-text b{color:var(--co-faint);text-decoration:line-through}
.tp-before .tp-link{margin-left:30px}
.tp-link{align-self:flex-start;margin-top:2px;padding:0;border:0;background:none;color:var(--co-ok-text);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.tp-sample{margin:22px 16px 0;font-size:12px;line-height:1.45;color:var(--co-hint);text-align:center}
.tp-bar{position:sticky;bottom:0;z-index:5;background:#FFFFFF;border-top:1px solid var(--co-line-2);padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:8px}
.tp-bar-row{display:grid;grid-template-columns:1fr 1fr 38px;gap:8px}
.tp-grey{min-height:38px;border:0;border-radius:8px;background:var(--co-grey);color:var(--co-ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;padding:0}
.tp-plan{display:flex;align-items:center;justify-content:center;gap:8px}

/* CO2b–e · Create your account (#1436): email first in green, then Google and Apple as white outlined buttons. */
.co-account{gap:14px}
.co-auth{display:flex;flex-direction:column;gap:10px}
.co-bar .co-auth,.co-bar:has(.co-white,.co-have){gap:10px}
.co-white{min-height:50px;border:1px solid var(--co-field);border-radius:8px;background:#FFFFFF;color:var(--co-ink);font:inherit;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;width:100%}
.co-center{text-align:center}
.co-center a{color:inherit}
.co-have{align-self:center;border:0;background:none;padding:6px;font:inherit;font-size:14px;color:var(--co-muted);cursor:pointer}
.co-have b{color:var(--co-ok-text)}
.co-pw{position:relative;display:block}
.co-pw .co-input{padding-right:64px}
.co-show{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:none;padding:8px;font:inherit;font-size:14px;font-weight:700;color:var(--co-ok-text);cursor:pointer}
.co-code{height:56px;text-align:center;font-size:24px;font-weight:800;letter-spacing:.4em}

/* #1442 · CO2 Set up your page: Fill in from a verified account; the link is locked (it is in the bio) */
.co-fill{border:1px solid var(--co-line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:12px;background:#F8FAF9}
.co-fill-head{display:flex;gap:12px;align-items:flex-start}
.co-fill-head>span:last-child{display:flex;flex-direction:column;gap:2px}
.co-fill-head b{font-size:15px}
.co-fill-head>span:last-child>span{font-size:13px;line-height:1.4;color:var(--co-muted)}
.co-fill-icon{width:36px;height:36px;flex-shrink:0;border-radius:10px;background:var(--co-green-soft);display:grid;place-items:center}
.co-pick{display:flex;flex-direction:column;gap:8px}
.co-pick button{min-height:56px;border:1px solid var(--co-field);border-radius:10px;background:#FFFFFF;padding:8px 12px;font:inherit;color:var(--co-ink);cursor:pointer;display:flex;align-items:center;gap:12px;text-align:left}
.co-pick button[aria-checked="true"]{border:2px solid var(--co-green);padding:7px 11px}
.co-pick .co-mark{width:32px;height:32px;border-radius:8px;font-size:14px}
.co-pick .co-row-text b{font-size:14px}
.co-pick .co-row-text span{font-size:12px;color:var(--co-muted)}
.co-radio{width:20px;height:20px;flex-shrink:0;border-radius:50%;border:2px solid #B4BCCB}
.co-pick button[aria-checked="true"] .co-radio{border:6px solid var(--co-green)}
.co-fill .co-primary{min-height:46px;font-size:15px}
.co-filled{margin:0;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--co-muted)}
.co-filled>span{flex:1;min-width:0}
.co-filled b{color:var(--co-ink)}
.co-filled .co-textlink{min-height:44px;padding:0 4px;color:var(--co-ok-text);text-decoration:none;font-size:14px}
.co-link.locked{border:0;background:var(--co-soft);height:auto;min-height:50px;padding:8px 12px;gap:10px;color:var(--co-faint)}
.co-link-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.co-link-text>span{color:var(--co-ink)}
.co-link-text>span>span{color:var(--co-faint)}
.co-link-text small{font-size:12px;font-weight:600;color:var(--co-ok-text)}
.co-link .co-copy{flex-shrink:0;margin-left:8px}
.co-link.locked b{flex:1;color:var(--co-ink)}
.co-sheet .co-link{padding-right:6px}
.co-problem{margin:0;padding:10px 12px;border-radius:8px;background:#FBEDEA;color:#9A3B2B;font-size:14px;line-height:1.4}
.co-sheet .co-link.locked{gap:0;background:var(--co-soft)}
.co-primary.co-with-icon{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px}

/* Creator sign-up on a laptop (#1462): canvas page 24, COD1–COD4 (#1420). From 900 px: the form on the left, what
   followers see on the right; the step's button under the form; the verify sheet as a centred dialog. Below 900 px
   nothing here applies, so the phone layout is unchanged. */
.co-top-logo,.co-back-wide,.co-wide,.co-preview,.co-signin-top,.co-open{display:none}
.co-check-row{display:contents}
.co-photo.over .co-photo-ring{border-color:var(--co-green);background:var(--co-green-soft)}
@keyframes co-dialog{from{transform:translate(-50%,calc(-50% + 14px));opacity:0}to{transform:translate(-50%,-50%);opacity:1}}
@media (min-width:900px){
 .creators{--co-gut:clamp(40px,9.7vw,140px)}
 .co-screen{max-width:none}
 .co-wide{display:inline}
 .co-h1{font-size:36px;line-height:1.1}
 .co-sub{font-size:16px;line-height:1.5}
 .co-toast{bottom:24px}

 /* The steps: top row across, form left, preview right */
 .co-steps-screen{display:grid;grid-template-columns:minmax(0,53fr) minmax(0,47fr);grid-template-rows:72px auto 1fr;grid-template-areas:"top top" "body aside" "bar aside"}
 .co-steps-screen>.co-top{grid-area:top;padding:0 40px;gap:12px}
 .co-top-logo{display:block;height:22px;margin-right:auto}
 .co-top .co-back{display:none}
 .co-top .co-stepof{order:1;font-size:13px}
 .co-top .co-progress{order:2;flex:0 0 160px}
 .co-steps-screen>.co-body,.co-steps-screen>.co-bar{justify-self:start;width:min(460px,calc(100% - var(--co-gut) - 40px));margin-left:var(--co-gut)}
 .co-steps-screen>.co-body{grid-area:body;padding:36px 0 0;gap:18px}
 .co-back-wide{display:flex;align-items:center;gap:4px;align-self:flex-start;margin:0 0 -4px -8px;height:36px;padding:0 8px;border:0;border-radius:8px;background:none;font:inherit;font-size:14px;font-weight:700;color:var(--co-muted);cursor:pointer}
 .co-back-wide svg{width:16px;height:16px}
 .co-back-wide:hover{background:var(--co-soft)}
 .co-steps-screen>.co-bar{grid-area:bar;align-self:start;position:static;border:0;background:none;padding:6px 0 48px}
 .co-bar-one{flex-direction:row;align-items:center;gap:14px}
 .co-bar-one .co-primary{width:auto;min-height:50px;padding:0 28px}
 .co-bar-one .co-note{font-size:13px;text-align:left}
 .co-account .co-head{margin-bottom:10px}
 .co-steps-screen>.co-bar .co-center{text-align:left}
 .co-steps-screen>.co-bar .co-have{align-self:flex-start;margin-left:-6px}
 .co-steps-screen .co-confetti{top:72px;left:0;right:auto;width:53%;height:auto;bottom:0}

 /* Set up your page: the photo row carries a drop hint */
 .co-photo{gap:16px}
 .co-photo-ring{width:64px;height:64px}
 .co-drop-hint{font-size:13px;color:var(--co-faint);font-weight:400}

 /* Your plan: left-aligned like the other steps */
 .co-plan{align-items:flex-start;text-align:left;gap:14px}
 .co-plan-icon{width:72px;height:72px}
 .co-plan-icon svg{width:36px;height:36px}
 .co-plan .co-h1{font-size:36px}
 .co-plan-rows{padding:16px;gap:10px}
 .co-plan-rows div{font-size:15px}
 .co-plan .co-fine{font-size:13px;color:var(--co-faint)}

 /* What followers see: a phone-width page that fills in as they go */
 .co-preview{grid-area:aside;display:flex;flex-direction:column;align-items:center;gap:14px;background:#F4F6F5;border-left:1px solid var(--co-line);padding:36px 24px 48px}
 .co-pv-label{margin:0;display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}
 .co-pv-label b{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--co-muted)}
 .co-pv-label span{font-size:13px;color:var(--co-faint)}
 .co-pv-phone{width:340px;max-width:100%;height:640px;border-radius:28px;background:#FFFFFF;border:1px solid var(--co-line);box-shadow:0 18px 44px rgba(19,33,59,.12);overflow:hidden;display:flex;flex-direction:column}
 .co-pv-url{margin:12px 12px 0;height:30px;border-radius:15px;background:#F1F2F4;display:flex;align-items:center;justify-content:center;font-size:13px}
 .co-pv-url span{color:var(--co-faint)}
 .co-pv-url b.co-pv-empty{color:var(--co-hint);font-weight:600}
 .co-pv-body{padding:18px 16px 0;display:flex;flex-direction:column;gap:12px}
 .co-pv-logo{height:16px;align-self:flex-start;display:block}
 .co-pv-me{display:flex;align-items:center;gap:12px}
 .co-pv-avatar{width:56px;height:56px;flex-shrink:0;border-radius:50%;background:#EEF0F2;display:grid;place-items:center;font-size:22px;font-weight:800;overflow:hidden}
 .co-pv-avatar.initial{background:linear-gradient(135deg,#FF8A65 0%,#FFC48A 100%);animation:co-pop .4s ease-out 1}
 .co-pv-avatar.photo{animation:co-pop .4s ease-out 1}
 .co-pv-avatar img{width:100%;height:100%;object-fit:cover;display:block}
 .co-pv-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
 .co-pv-text b{font-size:21px;letter-spacing:-.02em;overflow-wrap:anywhere}
 .co-pv-text span{font-size:13px;color:var(--co-muted)}
 .co-preview:not(.filled) .co-pv-text b,.co-preview:not(.filled) .co-pv-text span{display:block;border-radius:7px;background:#EEF0F2;color:transparent}
 .co-preview:not(.filled) .co-pv-text b{height:14px;width:62%}
 .co-preview:not(.filled) .co-pv-text span{height:10px;width:84%}
 .co-pv-chips{display:flex;flex-wrap:wrap;gap:6px;min-height:22px}
 .co-pv-chips span{display:flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;background:var(--co-green-soft);color:var(--co-ok-text);font-size:11px;font-weight:700}
 .co-pv-btns{display:grid;grid-template-columns:1fr 1fr;gap:6px}
 .co-pv-btns span,.co-pv-btn{height:32px;border-radius:8px;background:var(--co-grey);display:grid;place-items:center;font-size:13px;font-weight:700;color:var(--co-hint)}
 .co-pv-btns span:first-child{background:#D5DBD8;color:var(--co-cream)}
 .co-preview.filled .co-pv-btns span,.co-preview.filled .co-pv-btn{color:var(--co-ink)}
 .co-preview.filled .co-pv-btns span:first-child{background:var(--co-green);color:var(--co-cream)}
 .co-pv-h{font-size:15px;margin-top:6px}
 .co-pv-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .co-pv-tiles span{height:108px;border-radius:12px;background:#F1F2F4}
 .co-pv-fine{font-size:12px;color:var(--co-hint);text-align:center}

 /* Welcome: words left, the arc of trip cards right */
 .co-welcome-screen{display:grid;grid-template-columns:minmax(0,640fr) minmax(0,800fr);grid-template-rows:72px auto auto auto 1fr;grid-template-areas:"logo signin" "head deck" "bar deck" "perks deck" ". deck"}
 .co-welcome{display:contents}
 .co-welcome .co-wordmark{grid-area:logo;align-self:center;margin-left:40px;height:22px}
 .co-signin-top{display:block;grid-area:signin;align-self:center;justify-self:end;margin-right:32px;border:0;background:none;padding:8px;font:inherit;font-size:15px;color:var(--co-muted);cursor:pointer}
 .co-signin-top b{color:var(--co-ok-text)}
 .co-welcome .co-head{grid-area:head;padding:clamp(32px,9vh,92px) 40px 0 var(--co-gut);gap:14px}
 .co-hero{font-size:clamp(44px,4vw,56px);line-height:1.04;letter-spacing:-.035em}
 .co-lede{font-size:18px;max-width:460px}
 .co-welcome-screen>.co-bar{grid-area:bar;position:static;border:0;background:none;padding:28px 0 0 var(--co-gut)}
 .co-welcome-screen .co-primary{width:auto;min-height:54px;padding:0 30px;font-size:17px}
 .co-welcome .co-perks{grid-area:perks;padding:40px 40px 48px var(--co-gut);gap:16px}
 .co-perk-icon{width:40px;height:40px}
 .co-perks b{font-size:16px}
 .co-perks span span{font-size:15px}
 .co-welcome .co-deck{grid-area:deck;margin:0;height:auto;min-height:600px}
 .co-trip{top:130px;width:230px;height:316px;margin-left:-115px;transform-origin:50% 1316px}
 .co-trip-body{width:230px;height:316px;border-radius:18px;box-shadow:0 16px 36px rgba(19,33,59,.22)}
 .co-trip-days{left:10px;top:10px;padding:4px 10px;font-size:12px}
 .co-trip-text{left:14px;right:14px;bottom:14px;gap:3px}
 .co-trip-text b{font-size:20px}
 .co-trip-text span{font-size:13px}

 /* Verify: a centred dialog */
 .co-sheet{top:50%;bottom:auto;transform:translate(-50%,-50%);border-radius:16px;padding:22px 24px 24px;box-shadow:0 24px 60px rgba(19,33,59,.28);animation:co-dialog .22s ease-out 1}
 .co-grab{display:none}
 .co-check-row{display:flex;gap:10px}
 .co-check-row .co-primary{flex:1;width:auto}
 .co-open{display:flex;width:auto;min-height:48px;padding:0 16px;font-size:15px;text-decoration:none;white-space:nowrap;gap:6px}
}
/* #1458 · The page as its owner (canvas page 24, CO5n to CO5n-h): the CP4 layout with the owner's actions, My trips
   (two columns, up to 4), Where I've been, My wishlist; a trip is the TP2 page with the owner's edits. */
.ow .co-body{padding-bottom:0}
.ow-home{gap:12px;padding-top:8px}
.ow-brand{display:flex;align-items:center;justify-content:space-between}
.ow-brand img{height:20px;display:block}
.ow-iconbtn{width:44px;height:44px;margin-right:-10px;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer;color:var(--co-ink)}
.ow-me{display:flex;align-items:center;gap:14px}
.ow-avatar{width:64px;height:64px;flex-shrink:0;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#FF8A65 0%,#FFC48A 100%);display:grid;place-items:center;font-size:26px;font-weight:800}
.ow-avatar img{width:100%;height:100%;object-fit:cover}
.ow-me-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.ow-me-text h1{margin:0;font-size:26px;line-height:1.1;font-weight:800;letter-spacing:-.03em}
.ow-me-text span{font-size:15px;color:var(--co-muted)}
.ow-counts{font-size:14px;color:var(--co-muted)}
.ow-counts b{color:var(--co-ink)}
.ow-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ow-btn{min-height:38px;border:0;border-radius:8px;background:var(--co-grey);color:var(--co-ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.ow-btn.green{background:var(--co-green);color:var(--co-cream)}
.ow-btn.wide{width:100%;min-height:48px;font-size:16px}
.ow-btn.danger{min-height:48px;background:#B3261E;color:#FFFFFF;font-size:16px}
.ow-bubble{margin-top:4px;border:0;border-radius:14px;background:var(--co-green-soft);padding:14px;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer;display:flex;align-items:center;gap:12px;width:100%}
.ow-bubble>span{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.ow-bubble b{font-size:15px}
.ow-bubble>span>span{font-size:13px;color:#35614C}
.ow-section{padding:26px 16px 0;display:flex;flex-direction:column;gap:10px}
.ow-section h2{margin:0;font-size:20px;font-weight:800;letter-spacing:-.02em}
.ow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
.ow-all{padding:8px 16px 0}
.ow-card{min-width:0;border:0;padding:0;background:none;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:6px;animation:co-up .3s ease-out 1}
.ow-card>b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ow-card>span:last-child{font-size:13px;color:var(--co-muted)}
.ow-card-photo{position:relative;display:grid;place-items:center;height:128px;border-radius:12px;overflow:hidden;background:var(--co-soft)}
.ow-card-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ow-dashed{border:1.5px dashed #B4BCCB;background:var(--co-soft)}
.ow-plus{width:44px;height:44px;border-radius:50%;background:var(--co-green);color:var(--co-cream);display:grid;place-items:center}
.ow-plus.small{width:32px;height:32px}
.ow-pill{position:absolute;left:8px;top:8px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:700;background:#FFF4D6;color:#7A5600}
.ow-pill.published{background:#FFFFFF;color:var(--co-ok-text)}
.ow-ghost{cursor:default;gap:8px;animation:ow-pulse 1.4s ease-in-out infinite}
.ow-ghost .ow-card-photo{background:#F1F2F4;font-size:13px;font-weight:700;color:var(--co-faint)}
.ow-line{height:12px;width:60%;border-radius:6px;background:#F1F2F4}
.ow-line.short{height:10px;width:40%}
@keyframes ow-pulse{0%,100%{opacity:.35}50%{opacity:1}}
.ow-seeall{margin-top:2px;min-height:44px;border:0;border-radius:8px;background:#F1F2F4;font:inherit;font-size:15px;font-weight:700;color:var(--co-ink);cursor:pointer}
.ow-finding{display:flex;align-items:center;gap:8px;font-size:13px;line-height:1.4;color:var(--co-muted)}
.ow-finding .co-spinner{width:14px;height:14px;border-width:2px;flex-shrink:0}
.ow-cities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.ow-city{position:relative;height:110px;border-radius:12px;overflow:hidden;display:block;color:#FFFFFF}
.ow-city img{width:100%;height:100%;object-fit:cover;display:block}
.ow-city-shade{position:absolute;inset:0;background:rgba(19,33,59,.3)}
.ow-city-text{position:absolute;left:10px;bottom:8px;display:flex;flex-direction:column}
.ow-city-text b{font-size:17px}
.ow-city-text span{font-size:12px}
button.ow-city{font:inherit;color:var(--co-ink);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px}
button.ow-city b{font-size:15px}
.ow-hint{font-size:13px;line-height:1.45;color:var(--co-muted)}
.ow-wishes{display:flex;gap:12px;overflow-x:auto;margin:0 -16px;padding:0 16px;scrollbar-width:none}
.ow-wish{flex-shrink:0;width:240px;border:0;padding:0;background:none;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:8px}
.ow-wish-photo{width:240px;height:144px;border-radius:12px;display:grid;place-items:center}
.ow-wish>b{font-size:16px}
.ow-wish>span:last-child{font-size:14px;color:var(--co-muted)}
.ow-foot{height:32px}
.ow-top{display:flex;align-items:center;gap:8px;padding:4px 16px 0 6px}
.ow-top b{font-size:15px}
.ow-tasks{display:flex;flex-direction:column}
.ow-task{display:flex;align-items:center;gap:12px;padding:14px 0;border:0;border-bottom:1px solid var(--co-line-2);background:none;font:inherit;color:var(--co-ink);text-align:left;width:100%}
button.ow-task{cursor:pointer}
.ow-ring{width:24px;height:24px;flex-shrink:0;border-radius:50%;border:2px solid var(--co-field);display:grid;place-items:center}
.ow-ring.done{border:0;background:var(--co-ok)}
.ow-task-text{flex:1;display:flex;flex-direction:column;gap:1px}
.ow-task-text b{font-size:15px}
.ow-task-text span{font-size:13px;color:var(--co-muted)}
/* #1525: no AI agent to set up; Ripley plans like the creator from their trips and posts. */
.ow-ripley{margin-top:16px;display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:12px;background:#F6F6F7}
.ow-ripley img{flex-shrink:0;width:32px;height:32px}
.ow-ripley>span{display:flex;flex-direction:column;gap:2px}
.ow-ripley b{font-size:15px}
.ow-ripley>span>span{font-size:13px;line-height:1.45;color:var(--co-muted)}
.ow-add{gap:12px;padding-top:8px}
.ow-option{border:1px solid var(--co-field);border-radius:14px;background:#FFFFFF;padding:14px;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer;display:flex;align-items:center;gap:12px}
.ow-option:disabled{cursor:default;opacity:.55}
.ow-option>span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.ow-option b{font-size:16px}
.ow-option>span:last-child>span{font-size:13px;line-height:1.4;color:var(--co-muted)}
.ow-option-icon{width:40px;height:40px;flex-shrink:0;border-radius:10px;background:#F1F2F4;display:grid;place-items:center}
.ow-option-icon.green{background:var(--co-green-soft)}
.ow-fine{margin:0;font-size:12px;line-height:1.5;color:var(--co-faint)}
/* The trip, as its owner */
body.creators.ow-trip-open .co-toast{bottom:calc(132px + env(safe-area-inset-bottom,0px))}
.ow-tp .tp-cover{height:340px}
.ow-cover:not(:has(img)) .tp-cover-shade{background:linear-gradient(180deg,rgba(19,33,59,.2) 0%,rgba(19,33,59,.6) 100%)}
.ow-tp .tp-cover-text{pointer-events:auto}
.ow-draft{align-self:flex-start;padding:4px 10px;border-radius:999px;background:#FFF4D6;color:#7A5600;font-size:12px;font-weight:700}
.ow-title{display:flex;align-items:center;gap:8px;border:0;background:none;padding:0;font:inherit;color:#FFFFFF;text-align:left;cursor:pointer}
.ow-chip{border:0;font:inherit;color:var(--co-ink);cursor:pointer}
.ow-chip svg{color:#8B96A8;margin-left:1px}
.ow-chip.ask{background:#FFF4D6}
.ow-chip.ask b,.ow-chip.ask svg{color:#7A5600}
.ow-note{display:flex;gap:10px;align-items:flex-start;width:calc(100% - 32px);background:#FFFFFF;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer}
.ow-note span{flex:1}
.ow-note svg{flex-shrink:0;margin-top:3px;color:#6B7689}
.ow-h2{display:flex;flex-direction:column;gap:2px}
.ow-h2>span{font-size:13px;line-height:1.45;color:var(--co-muted)}
.ow-stays .tp-stay{flex-basis:290px}
.tp-stays.ow-stays{scroll-snap-type:none}
.ow-grad{display:block;width:100%;height:100%}
.ow-add-stay{flex:0 0 200px;min-height:250px;border-radius:14px;border:1.5px dashed #B4BCCB;background:var(--co-soft);font:inherit;color:var(--co-ink);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;text-align:center}
.ow-add-stay.only{flex-basis:100%}
.ow-add-stay>span:last-child{font-size:13px;line-height:1.4;color:var(--co-muted)}
.ow-pad{padding:22px 16px 0}
p.ow-pad{margin:0}
.ow-rate{border:0;font:inherit;font-size:12px;font-weight:800;cursor:pointer}
.ow-rate.guess{background:#FFFFFF;color:var(--co-muted);outline:1.5px dashed #B4BCCB;outline-offset:-1.5px}
.ow-place-name{flex-direction:column;align-items:flex-start;gap:1px}
.ow-place-name small{font-size:12px;color:var(--co-faint)}
.ow-tip{border:0;background:none;padding:0;font:inherit;font-size:13px;line-height:1.45;color:var(--co-ink);text-align:left;cursor:pointer}
.ow-link{align-self:flex-start;min-height:32px;border:0;background:none;padding:0;font:inherit;font-size:14px;font-weight:700;color:var(--co-ok-text);cursor:pointer}
.ow-add-place{margin-left:74px;min-height:48px;border-radius:12px;border:1.5px dashed #B4BCCB;background:var(--co-soft);font:inherit;font-size:14px;font-weight:700;color:var(--co-ink);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.ow-add-day{width:100%;min-height:48px;border-radius:8px;border:1px solid var(--co-field);background:#FFFFFF;font:inherit;font-size:15px;font-weight:700;color:var(--co-ink);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.ow-before{border-radius:12px;background:var(--co-soft);padding:12px;display:flex;flex-direction:column;gap:12px}
.ow-before-row{display:flex;gap:10px;align-items:flex-start}
.ow-before-row>span{flex:1;display:flex;flex-direction:column;gap:1px}
.ow-before-row b{font-size:14px}
.ow-before-row>span>span{font-size:12px;line-height:1.45;color:var(--co-muted)}
.tp-icon.small{width:28px;height:28px}
.ow-delete{display:flex;justify-content:center}
.ow-delete button{min-height:44px;border:0;background:none;padding:0 8px;font:inherit;font-size:15px;font-weight:700;color:#B3261E;cursor:pointer}
.ow-barnote{margin:0;font-size:12px;color:var(--co-faint);text-align:center}
/* At a glance form and the sheets */
.ow-form{gap:22px}
.ow-field{display:flex;flex-direction:column;gap:8px}
.ow-field>b,.ow-field>span>b{font-size:15px}
.ow-field>span:first-child:not(.ow-stepper){display:flex;flex-direction:column;gap:2px}
.ow-stepper{display:flex;align-items:center;gap:16px}
.ow-stepper button{width:40px;height:40px;border-radius:50%;border:1px solid var(--co-field);background:#FFFFFF;font:inherit;font-size:20px;cursor:pointer;color:var(--co-ink)}
.ow-stepper b{min-width:64px;text-align:center;font-size:18px}
.ow-stepper b.ask{color:#7A5600}
.ow-ask{font-size:13px;line-height:1.45;color:#7A5600}
.ow-selects{display:grid;grid-template-columns:2fr 1fr;gap:8px}
.ow-pills{display:flex;flex-wrap:wrap;gap:8px}
.ow-segs{display:grid;gap:8px}
.ow-segs.three{grid-template-columns:repeat(3,1fr)}
.ow-segs.four{grid-template-columns:repeat(4,1fr)}
.ow-seg{height:40px;border-radius:8px;border:1px solid var(--co-field);background:#FFFFFF;font:inherit;font-size:14px;font-weight:700;color:var(--co-ink);cursor:pointer}
.ow-seg.pill{height:36px;padding:0 14px;border-radius:999px;font-weight:600}
.ow-seg.on{border:2px solid var(--co-green);background:var(--co-green-soft)}
.ow-sheet-form{display:flex;flex-direction:column;gap:12px}
.ow-textarea{height:auto;min-height:120px;padding:12px;resize:vertical;line-height:1.45}
.ow-search{height:48px;border:2px solid var(--co-green);border-radius:8px;padding:0 12px;display:flex;align-items:center;gap:8px}
.ow-search-input,.ow-search-input:focus,.ow-search-input:focus-visible{flex:1;min-width:0;height:auto;padding:0;border:0;outline:0;box-shadow:none;font:inherit;font-size:16px;color:var(--co-ink);background:none}
.ow-results{display:flex;flex-direction:column;min-height:40px}
.ow-result{display:flex;align-items:center;gap:12px;padding:10px 0;border:0;border-bottom:1px solid var(--co-line-2);background:none;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer;width:100%}
.ow-result>span:last-child{display:flex;flex-direction:column;gap:1px}
.ow-result b{font-size:15px}
.ow-result>span:last-child>span{font-size:13px;color:var(--co-muted)}
.ow-result[aria-checked="true"] .co-radio{border:7px solid var(--co-green)}
.ow-nights{display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:600}
/* On a laptop the owner page keeps the phone width for now (the laptop layout, COD5, is its own item). */
/* My stats (#1463): canvas page 24, CO5n-s and CO5n-s0 */
.ow-btn.full{grid-column:1/-1}
.st{gap:22px;padding-top:6px}
.st-range{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;border-radius:10px;background:#F1F2F4}
.st-range button{min-height:36px;border:0;border-radius:8px;background:none;font:inherit;font-size:14px;font-weight:700;color:var(--co-muted);cursor:pointer}
.st-range button.on{background:#FFFFFF;color:var(--co-ink);box-shadow:0 1px 3px rgba(19,33,59,.14)}
.st-section{display:flex;flex-direction:column;gap:10px}
.st-h2{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.st-h2 h2{margin:0;font-size:20px;font-weight:800;letter-spacing:-.02em}
.st-h2 small{font-size:12px;color:var(--co-faint);text-align:right}
.st-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.st-tile{border:1px solid var(--co-line);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.st-tile>span{font-size:13px;font-weight:700;color:var(--co-muted)}
.st-tile b{font-size:26px;letter-spacing:-.03em}
.st-tile small{font-size:12px;font-weight:700;color:var(--co-faint)}
.st-tile small.up{color:var(--co-ok-text)}
.st-tile.zero b{color:#8B96A8}
.st-card{border-radius:14px;background:var(--co-green-soft);padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.st-card-text{display:flex;flex-direction:column;gap:4px}
.st-card-text b{font-size:15px}
.st-card-text span{font-size:14px;line-height:1.45;color:#35614C}
.st-example{border-radius:12px;background:#FFFFFF;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.st-example>span{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:14px;color:var(--co-muted)}
.st-example b{font-size:20px;letter-spacing:-.02em;color:var(--co-ok-text);white-space:nowrap}
.st-example small{font-size:12px;color:var(--co-faint)}
.st-act{min-height:44px;border:0;border-radius:8px;background:#FFFFFF;color:var(--co-ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px}
.st-act.primary{background:var(--co-green);color:var(--co-cream)}
.st-steps{display:flex;flex-direction:column;gap:10px}
.st-step{display:flex;flex-direction:column;gap:4px}
.st-step>span{display:flex;justify-content:space-between;gap:8px;font-size:14px}
.st-step>span>span{color:var(--co-muted)}
.st-bar{height:10px;border-radius:5px;background:#F1F2F4;overflow:hidden;display:block}
.st-bar span{display:block;height:100%;border-radius:5px;background:var(--co-green)}
.st-bar.soft{height:8px}.st-bar.soft span{background:#4E8A6C}
.st-note{margin:0;border-radius:12px;background:var(--co-green-soft);padding:12px 14px;display:flex;gap:10px;align-items:flex-start;color:var(--co-green);font-size:14px;line-height:1.45}
.st-note svg{flex-shrink:0;margin-top:1px}.st-note span{color:#35614C}.st-note b{color:var(--co-green)}
.st-earned{border:1px solid var(--co-line);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:14px}
.st-money{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.st-money>span{display:flex;flex-direction:column;gap:2px}
.st-money>span>span{font-size:13px;font-weight:700;color:var(--co-muted)}
.st-money b{font-size:28px;letter-spacing:-.03em}
.st-money small{font-size:12px;color:var(--co-faint)}
.st .ok{color:var(--co-ok-text)}
.st-fine{margin:0;font-size:12px;line-height:1.45;color:var(--co-faint)}
.st-payout{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:1px solid var(--co-line-2);color:var(--co-faint)}
.st-payout>span{flex:1;display:flex;flex-direction:column;gap:2px}
.st-payout b{font-size:15px;color:var(--co-ink)}.st-payout span span{font-size:13px;color:var(--co-muted)}
.st-list{display:flex;flex-direction:column}
.st-booking{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--co-line-2)}
.st-booking>span:first-child{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.st-booking b{font-size:15px}
.st-booking>span:first-child>b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-booking>span:first-child>span{font-size:13px;color:var(--co-muted)}
.st-booking small{font-size:12px;color:var(--co-faint)}
.st-amount{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.st-amount span{padding:2px 8px;border-radius:999px;font-size:12px;font-weight:700}
.st-amount.pending span{background:#FFF1D6;color:#7A4B00}
.st-amount.confirmed b{color:var(--co-ok-text)}.st-amount.confirmed span{background:#E3F1E9;color:#1F5E3F}
.st-amount.cancelled b{color:var(--co-faint);text-decoration:line-through}.st-amount.cancelled span{background:#F1F2F4;color:var(--co-muted)}
.st-trip{display:flex;align-items:center;gap:12px;padding:8px 0;border:0;background:none;font:inherit;color:var(--co-ink);text-align:left;cursor:pointer;width:100%}
.st-trip img,.st-trip-photo{width:52px;height:52px;border-radius:10px;object-fit:cover;flex-shrink:0;background:#F1F2F4}
.st-trip>span:not(.st-trip-photo){flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.st-trip>span>span{font-size:13px;color:var(--co-muted)}
@media (min-width:900px){.co-screen.ow,.co-screen.ow-tp{max-width:480px}}

/* Verify with a code (#1486, canvas page 24 CO3–CO3d) */
.co-row-text span.wait{color:#7A5600}
.co-verify.waiting{background:#FFF4D6;color:#7A5600;cursor:default}
/* The state pills are spans, not buttons: centre their words with the line height, and never let a long handle squeeze them (#1500). */
span.co-verify{display:inline-block;box-sizing:border-box;line-height:34px;white-space:nowrap}
.co-verify{flex-shrink:0}
/* The account line stays on one line; a long handle ends in an ellipsis. */
.co-list .co-row-text>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.co-at{height:48px;box-sizing:border-box;border:1px solid var(--co-field);border-radius:8px;display:flex;align-items:center;overflow:hidden;background:#FFFFFF}
.co-at:focus-within{border-color:var(--co-green);box-shadow:0 0 0 1px var(--co-green)}
.co-at>span{align-self:stretch;display:grid;place-items:center;padding:0 4px 0 12px;font-size:16px;color:var(--co-faint)}
.co-at input{flex:1;min-width:0;height:100%;border:0;padding:0 12px 0 0;font:inherit;font-size:16px;color:var(--co-ink);outline:none;background:transparent}
.co-vcode{border:1px dashed var(--co-field);border-radius:10px;background:var(--co-soft);padding:10px 12px 10px 14px;display:flex;align-items:center;gap:10px}
.co-vcode-text{flex:1;display:flex;flex-direction:column;gap:2px}
.co-vcode-text>span{font-size:12px;font-weight:600;color:var(--co-muted)}
.co-vcode-text b{font-size:22px;letter-spacing:.08em}
.co-verify-btns{display:flex;flex-direction:column;gap:10px}
.co-verify-btns a.co-white{text-decoration:none}
.co-swap{align-self:center;min-height:44px;border:0;background:none;padding:0 8px;font:inherit;font-size:14px;color:var(--co-muted);cursor:pointer}
.co-swap b{color:var(--co-ok-text)}
.co-wait-icon{width:84px;height:84px;border-radius:50%;background:#FFF4D6;display:grid;place-items:center}
.co-wait-icon.small{width:56px;height:56px}
.co-waiting{align-items:center;text-align:center}
.co-waiting .co-list{width:100%;text-align:left}

/* Signed in (#1496, canvas page 24 CO2s): their initial at the top right; a small card with Sign out */
.co-me{width:44px;height:44px;margin-right:-6px;flex-shrink:0;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer}
.co-me-face{width:32px;height:32px;border-radius:50%;background:var(--co-green-soft);color:var(--co-green);font-size:14px;font-weight:800;display:grid;place-items:center;overflow:hidden}
.co-me-face img{width:100%;height:100%;object-fit:cover;display:block}
.co-me-face.big{width:40px;height:40px;font-size:16px;flex-shrink:0}
.co-me.open .co-me-face,.co-me:focus-visible .co-me-face{box-shadow:0 0 0 2px var(--co-green)}
.co-me-menu{position:fixed;z-index:30;width:264px;box-sizing:border-box;background:#FFFFFF;border:1px solid var(--co-line);border-radius:14px;box-shadow:0 12px 32px rgba(19,33,59,.16);overflow:hidden;animation:co-up .16s ease-out 1;font-family:'Plus Jakarta Sans',-apple-system,system-ui,sans-serif;color:var(--co-ink)}
.co-me-who{padding:14px 16px 12px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--co-line-2)}
.co-me-who>span:last-child{min-width:0;display:flex;flex-direction:column;gap:2px}
.co-me-who>span:last-child>span{font-size:12px;color:var(--co-faint)}
.co-me-who b{font-size:15px;overflow-wrap:anywhere}
.co-me-menu button{width:100%;min-height:48px;border:0;background:none;padding:0 16px;font:inherit;font-size:15px;font-weight:600;color:var(--co-ink);display:flex;align-items:center;gap:12px;cursor:pointer;text-align:left}
.co-me-menu button:hover,.co-me-menu button:focus-visible{background:var(--co-soft);outline:none}
.co-me-menu p{margin:0;padding:0 16px 14px 46px;font-size:12px;line-height:1.45;color:var(--co-faint)}
@media (min-width:900px){.co-top .co-me{order:3;margin-right:-8px}}

/* Settings for my page (#1534, canvas page 24 CO5n-t): grouped rows like the app's Settings */
.co-screen.ow-set{background:var(--co-soft)}
.ow-set .ow-top{background:#FFFFFF;padding-bottom:4px}
.ow-set-body{padding:12px 16px 0;display:flex;flex-direction:column}
.ow-set-body h2{margin:0;padding:0 16px 6px;font-size:13px;font-weight:600;color:var(--co-faint)}
.ow-set-group{background:#FFFFFF;border-radius:16px;overflow:hidden;margin-bottom:20px}
.ow-set-row{width:100%;min-height:48px;box-sizing:border-box;display:flex;align-items:center;gap:14px;padding:0 14px 0 16px;border:0;background:none;font:inherit;color:var(--co-ink);text-align:left;text-decoration:none}
button.ow-set-row,a.ow-set-row{cursor:pointer}
.ow-set-row>svg{flex-shrink:0}
.ow-set-main{flex:1;min-width:0;align-self:stretch;display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--co-line-2)}
.ow-set-row:last-child .ow-set-main{border-bottom:0}
.ow-set-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.ow-set-text span{font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ow-set-text small{font-size:13px;color:var(--co-faint)}
.ow-set-val{font-size:14px;color:var(--co-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60%}
.ow-set-val.ok{color:var(--co-ok-text);font-weight:700}
.ow-set-val.wait{color:#7A5600;font-weight:700}
.ow-set-out{min-height:48px;border:0;border-radius:16px;background:#FFFFFF;font:inherit;font-size:16px;font-weight:600;color:#B03030;cursor:pointer}
/* Verify Instagram (#1530, canvas page 24 IG1–IG7): three options in one card shape, the notes above them, and the
   code screens (account, Confirm, then the code). */
.co-options{display:flex;flex-direction:column;gap:10px}
.co-option{border:1px solid var(--co-line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px}
.co-option-top{display:flex;align-items:center;justify-content:space-between;min-height:22px}
.co-option-top b{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--co-faint)}
.co-rec{padding:3px 10px;border-radius:999px;background:var(--co-green-soft);color:var(--co-ok-text);font-size:12px;font-weight:700}
.co-option-row{display:flex;align-items:center;gap:12px}
.co-option-row .co-row-text b{font-size:16px}
.co-option-row .co-row-text span{line-height:1.4;color:var(--co-muted)}
.co-option .co-option-btn{min-height:44px;font-size:15px}
.co-notice{border-radius:12px;padding:12px 14px;display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45}
.co-notice svg{flex-shrink:0;margin-top:1px}
.co-notice.warn{background:#FFF4D6;color:#5C4100}
.co-notice.bad{background:#FBEDEA;color:#7A2424}
.co-notice a,.co-inline-link{color:inherit;font-weight:700;text-decoration:underline}
.co-inline-link{border:0;background:none;padding:0;font:inherit;cursor:pointer}
.co-confirm-row{display:flex;gap:8px;align-items:stretch}
.co-confirm-row .co-at{flex:1;min-width:0}
.co-at.locked{background:var(--co-green-tint)}
.co-confirm{width:auto;flex-shrink:0;min-width:92px;min-height:48px;height:48px;padding:0 16px;font-size:15px}
.co-vcode.masked b{color:var(--co-hint)}
.co-copy:disabled{color:var(--co-hint);cursor:default}
.co-bar-two{flex-direction:row;gap:8px}
.co-bar-two>*{flex:1 1 0;min-height:48px;font-size:15px}
.co-bar-two a.co-white{text-decoration:none;gap:6px}
.co-bar-two a.co-white.off{color:var(--co-hint);cursor:default}
.co-toast.has-act .co-toast-pill{pointer-events:auto;padding-right:6px}
.co-toast-act{min-height:44px;padding:0 12px;margin-left:2px;border:0;border-left:1px solid var(--co-line);border-radius:0;background:none;font:inherit;font-size:15px;font-weight:700;color:#C4452A;cursor:pointer}
.co-toast-act[hidden]{display:none}
/* #1539 · The page as followers see it (canvas page 24, CP4 and CP4e/TP2): the owner page's layout without its edits. */
.fp .ow-brand a{display:block}
.fp-owner{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--co-soft);color:var(--co-ink)}
.fp-owner>span{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.fp-owner b{font-size:14px}
.fp-owner>span>span{font-size:12px;line-height:1.4;color:var(--co-muted)}
.fp-owner a{font-size:14px;font-weight:700;color:var(--co-ok-text);text-decoration:none;padding:8px 0 8px 8px}
a.ow-card{text-decoration:none}
.fp-foot{padding:32px 16px calc(24px + env(safe-area-inset-bottom,0px));display:flex;justify-content:center;gap:8px;font-size:13px;color:var(--co-faint)}
.fp .ow-home{flex:0 0 auto}.fp-foot{margin-top:auto}
.fp-foot a{color:var(--co-muted);text-decoration:none}
.fp-missing{margin-top:40px}
.fp-home{display:flex;align-items:center;justify-content:center;text-decoration:none;margin-top:8px}