/* Measured Timeleft geometry; Clockout content and isolated review route. */
@font-face{font-family:FixelText;src:url('assets/fonts/FixelText-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:FixelText;src:url('assets/fonts/FixelText-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:FixelText;src:url('assets/fonts/FixelText-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{color-scheme:dark;--canvas:#160e14;--ink:#fffaf7;--muted:#c0afb9;--soft:#291b24;--line:#3c2b36;--plum:#160e14;--plum-raised:#21131c;--berry:#291b24;--pink:#ff2d8f;--pink-2:#e81476;--body:FixelText,Arial,sans-serif;--display:'Feature Deck',Georgia,'Times New Roman',serif}
body.social-funnel{font-family:var(--body);background:var(--canvas);color:var(--ink)}
.social-funnel .app-shell{height:var(--app-height,100svh);width:min(450px,100vw);border-radius:0;box-shadow:none}
.social-funnel .topbar{height:calc(52px + var(--safe-top));padding:0 24px;grid-template-columns:32px 1fr 32px}
.social-funnel .back{font:300 36px/1 Arial,sans-serif;width:32px;height:36px;border-radius:0;background:transparent}
.social-funnel .brand{font-family:FixelText,Arial,sans-serif;font-size:25px;letter-spacing:-1px;line-height:1}
.social-funnel .stage-title{font:600 16px/1.3 var(--body)}
.social-funnel .screen{padding:calc(68px + var(--safe-top)) 24px max(48px,var(--safe-bottom));transition:opacity 160ms ease-out;transform:none;overscroll-behavior:contain}
.social-funnel .screen h2{font:400 24px/1.35 var(--display);letter-spacing:-.045em;text-align:center;margin:0}
.social-funnel .social-subtitle,.social-funnel .screen-intro{font:400 14px/1.3 var(--body);margin:16px 0 0;color:var(--muted)}
.social-funnel .primary{background:#fffaf7;color:#21131c;font:400 16px/1.3 var(--body);min-height:49px;padding:14px 20px;border-radius:60px;box-shadow:none;transition:background-color 100ms ease,opacity 100ms ease}
@media (hover: hover) and (pointer: fine) {.social-funnel .primary:hover{background:#e81476}}
.social-funnel .primary:active{background:#0c070b}
.social-funnel .primary:disabled{background:#291b24;color:#a994a2}
.social-funnel .social-choices{margin:32px 0 24px;gap:8px}
.social-funnel .social-choices button{background:#21131c;color:#fffaf7;border:1px solid #291b24;box-shadow:none;padding:18px 28px;min-height:70px;border-radius:20px;font:600 16px/1.15 var(--body);gap:12px;transition:background-color 100ms ease-in-out,border-color 100ms ease-in-out}
@media (hover: hover) and (pointer: fine) {.social-funnel .social-choices button:hover{background:#291b24;border-color:#291b24}}
.social-funnel .social-choices button[aria-pressed=true]{background:#291b24;border-color:#fffaf7;box-shadow:none}
.social-funnel .social-choices button:disabled{opacity:.45}
.answer-icon{font-size:22px;width:28px}
[data-social-question=goal] .choice-check{border-color:#806878;border-radius:4px;width:20px;height:20px}
[data-social-question=goal] [aria-pressed=true] .choice-check{background:#fffaf7;color:white;border-color:#fffaf7}
.social-funnel [data-social-question=interests]{gap:8px}
.social-funnel [data-social-question=interests] button{font:400 14px/1.3 var(--body);border-radius:50px;min-height:42px;padding:10px 13px;gap:6px}
.social-funnel .social-welcome{padding-top:calc(60px + var(--safe-top));text-align:center}
.social-funnel .social-welcome h2{font:400 24px/1.35 var(--display);max-width:none;letter-spacing:-.045em}
.welcome-description{font:400 14px/1.3 var(--body);max-width:none;margin:16px 0 20px;color:#c0afb9}
.quiz-duration{font:600 14px/1.3 var(--body);color:#fffaf7;background:linear-gradient(110deg,#ffb9db,#ff2d8f);padding:7px 12px;margin:0 auto 20px}
.age-grid{gap:8px}.age-grid button{background:#21131c;border-color:#291b24;border-radius:16px;padding:4px 4px 0;transition:background-color 100ms ease}
.age-grid button[aria-pressed=true]{background:#291b24;border-color:#291b24}
@media (hover: hover) and (pointer: fine) {.age-grid button:hover{background:#291b24;border-color:#291b24}}
.age-grid img{aspect-ratio:1.55;filter:none;border-radius:12px}
.age-grid span{font:600 18px/1.15 var(--body);color:#fffaf7;padding:12px 4px}
.welcome-note{font:400 11px/1.5 var(--body);margin-top:24px;color:#fffaf7}
.social-funnel a,.social-funnel .legal a,.social-funnel .support-note a{color:#fffaf7}
.social-funnel input,.social-funnel select,.social-funnel .single-form input,.social-funnel .single-form select{background:#21131c;color:#fffaf7;border:1px solid #3c2b36;border-radius:12px;height:54px;font:400 16px/1.3 var(--body);box-shadow:0 1px 3px #00000008}
.social-funnel input::placeholder{color:#a994a2}
.social-funnel .single-form{margin-top:32px}
.social-funnel label,.social-funnel .single-form label{font:400 14px/1.4 var(--body);letter-spacing:0;text-transform:none;color:#fffaf7}
.social-funnel .text-action,.social-funnel .skip-action{color:#c0afb9}
.social-funnel button:focus-visible,.social-funnel a:focus-visible,.social-funnel input:focus-visible,.social-funnel select:focus-visible{outline:2px solid #ff2d8f;outline-offset:3px}
.social-funnel .field-error,.social-funnel .checkout-feedback{color:#ff9cb5}
.social-funnel .step-label{color:#ff8fc2;font:600 12px/1.4 var(--body);text-align:center}
.social-funnel .support-note{background:#291b24;color:#c0afb9}.social-funnel .support-note strong{color:#fffaf7}
.social-funnel .status-choice label span{background:#21131c;color:#fffaf7;border-color:#3c2b36}
.social-funnel .status-choice input:checked+span{background:#291b24;border-color:#fffaf7;color:#fffaf7}
.social-funnel .city-suggestions{background:#21131c;border-color:#3c2b36;box-shadow:0 6px 18px #0000000d}
.social-funnel .city-suggestions button{background:#21131c;color:#fffaf7}
.social-funnel .city-suggestions button.is-active{background:#291b24}
@media (hover: hover) and (pointer: fine) {.social-funnel .city-suggestions button:hover{background:#291b24}}
.social-funnel .source-intro{padding-top:52px;gap:18px}
.social-funnel .source-intro h2{font:400 32px/1.2 var(--display)}
.intro-visual{height:190px}.intro-visual img{filter:none;mask-image:linear-gradient(#0c070b 25%,transparent)}
.intro-review-badge>span:last-child{color:#c0afb9}.social-globe{width:120px;height:120px}
.story-text{font:400 16px/1.4 var(--body);color:#c0afb9}
.social-funnel .source-connection h2 em{color:#ff2d8f;font-style:normal}
.connection-chart{background:#21131c;border-radius:20px}.chart-grid{stroke:#321522}.chart-guide{stroke:#806878}
.chart-start-label,.chart-end-label{background:#321522;color:#ffb9db}.connection-chart text{fill:#c0afb9}.chart-end{stroke:#21131c}
.social-funnel .photo-story{color:white;background-image:linear-gradient(180deg,#0005,#0007),url('assets/clockout/stock-dinner.webp')}
.social-funnel .has-photo-story .brand,.social-funnel .has-photo-story .back{color:white}
.social-funnel .has-photo-story:has(.source-intro.is-active) .brand,.social-funnel .has-photo-story:has(.source-intro.is-active) .back{color:#fffaf7}
.social-funnel .photo-story h2{color:#fffaf7;font:400 40px/1.12 var(--display);letter-spacing:-.045em}
.social-funnel .photo-story h2 em{color:#ffb9db;background:linear-gradient(100deg,#ff2d8f,#ffb9db);background-clip:text;-webkit-text-fill-color:transparent}
.social-funnel .source-city-proof{padding-top:calc(122px + var(--safe-top));min-height:100%;gap:0}
.source-city-proof .story-text{font:400 18px/1.3 var(--body);color:#fffaf7;margin:30px auto 62px}
.source-city-proof .review-carousel{margin-inline:-14px;padding-inline:14px;gap:8px}
.source-city-proof .review-carousel figure{flex-basis:92%;min-height:175px}
.source-city-proof .carousel-dots{margin:14px 0 30px}
.social-funnel .source-understood h2{margin:32px 0 12px}.social-funnel .source-understood .story-text{color:white}
.social-funnel .photo-story .primary{background:#160e14;color:#fffaf7;margin-top:auto}
.social-funnel .member-review{background:#21131c;border:1px solid #3c2b36;color:#fffaf7;border-radius:16px;padding:16px}
.social-funnel .member-review figcaption{color:#fffaf7;font:600 15px/1.4 var(--body);gap:8px;margin-bottom:14px}
.review-avatar{background:#321522;color:#c0afb9}.review-stars{color:#ff2d8f;font-size:15px;letter-spacing:1px}
.social-funnel .member-review blockquote{color:#fffaf7;font:400 14px/1.5 var(--body)}
.social-funnel .member-review a.review-source{color:#c0afb9;font-size:9px}.carousel-dots i{background:#806878}.carousel-dots i.active{background:#fffaf7;width:6px}
.analysis-task>div:first-child{color:#c0afb9}.analysis-task strong{color:#fffaf7}.analysis-track{background:#3c2b36}.analysis-track>span{background:#ff2d8f}
.social-funnel .reference-paywall{padding-top:0;padding-bottom:140px}
.reference-paywall .paywall-cover{height:96px;opacity:.7;mask-image:linear-gradient(#0007,transparent)}
.social-funnel .reference-paywall #paywall-headline{font:400 32px/1.12 var(--display);letter-spacing:-.045em;margin:4px 0 0}
.social-funnel .reference-paywall #paywall-headline strong{font-weight:700}
.social-funnel .reference-paywall>.social-subtitle{font:400 14px/1.5 var(--body);margin:20px 0 16px}
.reference-paywall .pricing-preview-label{display:none}
.reference-paywall .membership-plans{gap:6px}
.reference-paywall .membership-plan{position:relative;background:#21131c;border:1px solid #3c2b36;border-radius:20px;min-height:88px;padding:12px;gap:12px;box-shadow:none;color:#fffaf7;overflow:hidden}
.reference-paywall .membership-plan[aria-checked=true]{border-color:#ff2d8f;background:#21131c;box-shadow:none}
.reference-paywall .membership-plan[data-plan=year]{padding-top:35px;min-height:108px}
.reference-paywall .membership-plan[data-plan=year]::before{content:'Recommended';position:absolute;left:0;right:0;top:0;height:25px;display:grid;place-items:center;background:#ff2d8f;color:#fffaf7;font:600 12px/1 var(--body)}
.reference-paywall .recommendation{display:none}.reference-paywall .plan-radio{width:23px;height:23px;border:1px solid #806878;background:#21131c}
.reference-paywall [aria-checked=true] .plan-radio{border-color:#ff2d8f;background:#ff2d8f;box-shadow:inset 0 0 0 3px #21131c}
.plan-name strong{font:400 15px/1.3 var(--body)}.reference-paywall .plan-details{gap:7px}
.reference-paywall .plan-details .plan-billing{font:400 10px/1.4 var(--body);color:#c0afb9}
.plan-rate strong{font:700 27px/1 var(--body);letter-spacing:-1px}.plan-rate small{font:400 10px/1 var(--body);color:#c0afb9}
.reference-paywall .plan-rationale{font:400 10px/1.4 var(--body);margin-top:10px}
.social-funnel .reference-paywall .social-terms{font:400 11px/1.5 var(--body);margin-top:12px;color:#c0afb9}
.social-funnel .reference-paywall h3{font:700 22px/1.3 var(--body);letter-spacing:-.03em}
.benefits-card{background:#21131c;border-radius:20px;padding:24px 16px}.paywall-includes article>span{color:#fffaf7}
.social-funnel .paywall-includes h4{font:600 16px/1.4 var(--body);color:#fffaf7}.paywall-includes article p{color:#c0afb9}
.membership-note{background:#321522}.membership-note p{color:#c0afb9}
.payment-preview{border:1px solid #3c2b36;background:#21131c;border-radius:20px;padding:20px;margin-bottom:20px}
.social-funnel .payment-preview h3{font-size:18px}.secure-membership{border-bottom:1px solid #3c2b36}
.social-funnel .checkout-dock{padding:16px 24px max(24px,var(--safe-bottom));background:linear-gradient(transparent,#160e14 18%);border:0}
.social-funnel .dock-offer{font:400 10px/1.4 var(--body);color:#c0afb9;margin-top:8px}
.social-funnel .app-shell.has-long-paywall .back{background:#160e14cc;color:#fffaf7;border-radius:50%}
.social-funnel .success h2{font-family:var(--display)}
@media(max-width:360px){.social-funnel .screen{padding-inline:20px}.social-funnel .screen h2,.social-funnel .social-welcome h2{font-size:24px}.social-funnel .social-choices button{padding-inline:18px}.social-funnel .photo-story h2{font-size:34px}.source-city-proof .story-text{margin-bottom:36px}.social-funnel .reference-paywall #paywall-headline{font-size:30px}.plan-rate strong{font-size:24px}.reference-paywall .membership-plan{gap:8px}.social-funnel .checkout-dock{padding-inline:20px}}
@media(prefers-reduced-motion:reduce){.social-funnel .screen,.social-funnel button{transition:none!important}.social-funnel .chart-curve{animation:none!important;stroke-dashoffset:0}}
.social-funnel .success-screen{background:var(--canvas);text-align:center;align-items:center}
.social-funnel .success-screen .check{margin:8px auto 24px;background:#291b24;color:#fffaf7;box-shadow:none}
.social-funnel .complete.success-screen>.success-intro{color:#c0afb9;text-align:center;font:400 14px/1.5 var(--body)}
.success-handoff{background:#21131c;border-radius:20px;text-align:left;padding:12px}
.success-handoff>div{background:transparent}.success-handoff>div>span{background:#321522;color:#fffaf7}
.success-handoff small b{color:#fffaf7}.social-funnel .app-store-action{background:#fffaf7;color:white;box-shadow:none;border-radius:60px}
.social-funnel .membership-action{background:#21131c;color:#fffaf7;border:1px solid #3c2b36}
/* Keep the city action outside the suggestion list's hit area. */
.social-funnel [data-screen=city] [data-form=city]{flex:1;display:flex;flex-direction:column;gap:12px}
.social-funnel [data-screen=city] [type=submit]{margin-top:auto;flex-shrink:0}
.social-funnel [data-screen=city] .city-suggestions{max-height:220px;overflow-y:auto}
.social-funnel [data-screen=city] .text-action{margin:0}

/* Clockout brand palette; reference typography and geometry stay unchanged. */
.social-funnel .primary{background:#ff2d8f;color:#160e14}
@media (hover: hover) and (pointer: fine) {.social-funnel .primary:hover{background:#ff5ba6}}
.social-funnel .primary:active{background:#e81476}
.social-funnel .primary:disabled{background:#291b24;color:#a994a2}
.social-funnel .social-choices button[aria-pressed=true],.social-funnel .status-choice input:checked+span{border-color:#ff2d8f;background:#321522}
[data-social-question=goal] [aria-pressed=true] .choice-check{background:#ff2d8f;color:#160e14;border-color:#ff2d8f}
.quiz-duration{color:#160e14}
.social-funnel .photo-story h2{color:#fffaf7}
.social-funnel .photo-story .primary{background:#ff2d8f;color:#160e14}
.reference-paywall .membership-plan[data-plan=year]::before{color:#160e14}
.reference-paywall .membership-plan[aria-checked=true]{background:#321522}
.social-funnel .app-store-action{background:#fffaf7;color:#160e14}
