/* The photo, decisions and navigation occupy separate grid rows. */
.sandbox-demo .sandbox-header{padding:8px 14px;border-bottom:0;gap:9px}
.sandbox-demo .sandbox-header>img{width:30px;height:30px;border-radius:9px}
.sandbox-demo .sandbox-header>button{border:0;background:#fbf0f3;min-width:36px;padding:5px;min-height:36px}
.sandbox-demo .sandbox-header small{font-size:10px;margin-top:3px}
.sandbox-demo .sandbox-content{background:linear-gradient(155deg,#fff,#fff6f8)}
.sandbox-demo .sandbox-scroll{padding:12px 16px 20px}
.sandbox-demo .sandbox-scroll>h2{font-size:27px;line-height:1.08;letter-spacing:-1px;margin:14px 0 10px}
.sandbox-demo .sandbox-scroll>p{font-size:12px;line-height:1.6;color:#87616e}
.sandbox-demo .sandbox-event{padding:0;overflow:hidden;border:1px solid #f0dce2;border-radius:22px;box-shadow:0 8px 22px #64162b09;margin:18px 0}
.sandbox-demo .sandbox-event>img{height:150px;border-radius:0;display:block}
.sandbox-demo .sandbox-event>h3{margin:14px 14px 7px;letter-spacing:-.5px;font-size:20px}
.sandbox-demo .sandbox-event>p{margin:0 14px 14px;line-height:1.7;color:#87616e;font-size:11px}
.sandbox-demo .sandbox-event>div{padding:0 12px 14px;gap:6px}
.sandbox-demo .sandbox-event button{flex:1;border-radius:12px;font-size:11px}
.sandbox-demo [data-sandbox-action=event],.sandbox-demo .sandbox-primary{background:var(--red);color:white;border:0}
.sandbox-context{display:flex;align-items:center;justify-content:space-between;padding:9px 15px 13px;font-size:10px}
.sandbox-context>span{display:flex;align-items:center;gap:6px;color:#87616e}.sandbox-context i{width:5px;height:5px;background:var(--red);border-radius:50%}
.sandbox-context>b{background:#f5e2e9;padding:5px 10px;border-radius:20px;font-weight:700}
.sandbox-demo .sandbox-card-copy h2{font-size:32px;letter-spacing:-1px;margin:7px 0;color:#fff}
.sandbox-demo .sandbox-card-copy small{font-size:10px;opacity:.85}
.sandbox-interest{display:inline-block;padding:6px 11px;background:#ffffff26;border:1px solid #ffffff40;border-radius:20px;font-size:10px;margin-top:9px}
.sandbox-demo .sandbox-decisions{padding-bottom:14px;background:#fff6f8}
.sandbox-demo .sandbox-decisions [data-sandbox-action=like]{background:var(--red);border:0;box-shadow:0 6px 15px #b3234830}
.sandbox-demo .sandbox-nav{border-color:#f3e4e9;padding:4px 8px;background:white}
.sandbox-demo .sandbox-nav button{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:9px;min-height:44px;padding:3px;color:#a08690}
.sandbox-nav button>span{font-size:19px;line-height:20px}
.sandbox-demo .sandbox-nav [aria-current=page]{color:var(--red-ink);border:0}
.sandbox-demo .sandbox-checkin-cover{position:relative;border-radius:18px;overflow:hidden;height:115px}
.sandbox-checkin-cover img{width:100%;height:100%;object-fit:cover}
.sandbox-checkin-cover span{position:absolute;inset:auto 0 0;padding:30px 12px 12px;background:linear-gradient(transparent,#310c19ce);color:white;font-size:11px;font-weight:700}
.sandbox-demo .sandbox-checkin>h2{font-size:22px;margin-top:16px}
.sandbox-checkin h3{font-size:15px;letter-spacing:-.3px;margin:20px 0 10px}
.sandbox-mode-options{display:grid;gap:8px}
.sandbox-demo .sandbox-mode-options button{display:flex;align-items:center;text-align:left;gap:12px;padding:12px;border:1px solid #ebd5de;border-radius:16px}
.sandbox-mode-options button>span{display:grid;place-items:center;width:32px;height:32px;border-radius:11px;background:#faeaf0;color:var(--red-ink);font-size:21px}
.sandbox-mode-options button>div{flex:1}.sandbox-mode-options b{display:block;font-size:13px}.sandbox-mode-options small{display:block;font-size:10px;color:#96717f;font-weight:400;margin-top:3px}
.sandbox-mode-options i{width:16px;font-style:normal}.sandbox-demo .sandbox-mode-options [aria-pressed=true]{border-color:var(--red-ink);background:var(--red-soft);box-shadow:inset 0 0 0 1px var(--red-ink)}
.sandbox-profile-preferences{margin:18px 0;padding:14px;border:1px solid #edd6df;border-radius:18px;background:#fff}.sandbox-profile-preferences h3{margin:0 0 6px}.sandbox-profile-preferences h4{margin:16px 0 8px;font-size:12px}.sandbox-profile-preferences>p{font-size:10px;line-height:1.5;color:#87616e}.sandbox-preference-chips{display:flex;flex-wrap:wrap;gap:6px}.sandbox-demo .sandbox-preference-chips button{min-height:36px;padding:7px 10px;border-radius:999px;font-size:10px}.sandbox-demo .sandbox-preference-chips button[aria-pressed=true]{background:var(--red-soft);border-color:var(--red);color:var(--red-ink);box-shadow:0 0 0 1px var(--red)}
.sandbox-demo .sandbox-private{font-size:10px;text-align:center;margin:16px 0 8px}
.sandbox-feature-icon{display:grid;place-items:center;margin:12px 0 22px;width:58px;height:58px;border-radius:20px;background:#f5dfe8;color:var(--red-ink);font-size:32px}
.sandbox-demo .sandbox-safety>button{font-size:12px;text-align:left;border-radius:14px;padding:14px}
@media(max-width:380px){.sandbox-demo .sandbox-card-copy h2{font-size:27px}.sandbox-demo .sandbox-checkin-cover{height:90px}.sandbox-demo .sandbox-mode-options button{padding:9px}}
.guided-app.sandbox-demo{display:block;width:min(720px,calc(100% - 32px));padding:0;margin:24px auto 60px;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:#fff;min-height:0}
.sandbox-device{height:780px;max-height:900px;position:relative;display:grid;grid-template-rows:66px minmax(0,1fr) 60px;overflow:hidden;background:#fff8fa;color:#64162b}
.sandbox-client-frame{position:absolute;top:0;left:0;width:100%;height:100%;border:0;background:transparent;color-scheme:light dark;transform-origin:top left}
.sandbox-header{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid #eed8de;background:white;min-width:0}
.sandbox-header>img{width:34px;height:34px;object-fit:contain}.sandbox-header>div{flex:1;min-width:0}.sandbox-header b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.sandbox-header small,.sandbox-chat-heading small{display:block;font-size:11px;color:#84636e}
.sandbox-demo button{font:inherit;font-weight:700;border:1px solid #e1c3cd;border-radius:14px;background:white;color:#64162b;padding:10px 12px;min-height:44px;cursor:pointer}
.sandbox-demo button:disabled{opacity:.4;cursor:default}.sandbox-demo button:focus-visible:not([data-fc-card] *),.sandbox-demo select:focus-visible{outline:3px solid var(--red);outline-offset:2px}.sandbox-card:focus-visible{outline:0}.sandbox-card:focus-visible h2{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.16em}
.sandbox-content{min-height:0;min-width:0;display:flex;flex-direction:column;overflow:hidden}.sandbox-controls{padding:10px 12px;flex:none}.sandbox-controls>div{display:flex;gap:6px}.sandbox-controls button{flex:1;padding:8px 4px;font-size:13px}.sandbox-controls [aria-pressed=true]{background:var(--red);color:#fff}.sandbox-controls label{display:block;font-size:11px;margin-top:7px}.sandbox-controls select{width:100%;min-height:36px;background:white;border:1px solid #e1c3cd;border-radius:10px;color:#64162b;padding:5px}
.sandbox-deck{flex:1;min-height:0;position:relative;margin:0 12px;overflow:hidden;border-radius:20px;background:transparent}
.sandbox-card{height:100%;position:relative;overflow:hidden;touch-action:pan-y;user-select:none;will-change:transform}.sandbox-card>.sandbox-portrait{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.sandbox-card-copy{position:absolute;inset:auto 0 0;padding:70px 18px 18px;background:linear-gradient(transparent,#320c1be8 45%);color:white;pointer-events:none}.sandbox-card h2{font-size:28px;line-height:1.1;margin:5px 0}.sandbox-card p{font-size:13px;margin:5px 0;color:white}.sandbox-card small{font-size:11px}
.sandbox-group{display:block;height:100%;overflow:hidden}.sandbox-group img{width:100%;height:100%;object-fit:cover;min-width:0}
.sandbox-decisions{display:flex;gap:8px;justify-content:center;padding:12px 10px 4px;flex:none;background:#fff8fa;z-index:1}.sandbox-decisions button{font-size:12px}.sandbox-decisions [data-sandbox-action=like],.sandbox-compose button{background:var(--red);color:white}
.sandbox-hint{flex:none;font-size:10px;text-align:center;line-height:1.4;color:#80616a;margin:4px 8px 8px}.sandbox-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;border-top:1px solid #e1c3cd;padding:6px;background:white;z-index:2}.sandbox-nav button{border:0;border-radius:10px;font-size:12px;padding:8px 2px}.sandbox-nav [aria-current=page]{color:var(--red-ink);background:#f9e3eb}
.sandbox-scroll{overflow:auto;min-height:0;padding:18px;overscroll-behavior:contain}.sandbox-scroll h2{font-size:24px}.sandbox-scroll>button{display:block;margin:12px 0;width:100%}.sandbox-empty{padding:28px 18px;text-align:center}.sandbox-empty h2{font-size:24px}
.sandbox-match-row{display:flex!important;width:100%;align-items:center;gap:12px;text-align:left;margin:10px 0}.sandbox-match-row>img,.sandbox-match-row>.sandbox-group{width:54px;height:60px;object-fit:cover;border-radius:12px;flex:none}.sandbox-match-row span{min-width:0}.sandbox-match-row small{display:block;font-size:11px;font-weight:400;margin-top:5px}
.sandbox-chat-heading{display:flex;align-items:center;gap:8px;padding:10px;flex:none;background:#fff}.sandbox-chat-heading>img,.sandbox-chat-heading>.sandbox-group{width:32px;height:38px;border-radius:8px;object-fit:cover;flex:none}.sandbox-chat-heading>div:not(.sandbox-group){flex:1;min-width:0}.sandbox-chat-heading small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}.sandbox-chat-heading button{padding:6px;min-width:36px}.sandbox-demo .sandbox-chat-heading [data-sandbox-action=safety]{box-sizing:border-box;flex:0 0 40px;width:40px;height:40px;min-width:40px;min-height:40px;max-height:40px;aspect-ratio:1/1;padding:0;display:grid;place-items:center;border-radius:50%;line-height:1;letter-spacing:-1px}.sandbox-messages{flex:1;min-height:0;overflow:auto;padding:12px;overscroll-behavior:contain}.sandbox-messages p{max-width:88%;width:fit-content;padding:11px 13px;border-radius:15px;background:white;color:#64162b;font-size:14px;line-height:1.45;overflow-wrap:anywhere}.sandbox-messages .mine{margin-left:auto;background:var(--red);color:white}.sandbox-compose{display:flex;gap:6px;padding:10px;flex:none;background:white}.sandbox-compose input{min-width:0;flex:1;border:1px solid #e1c3cd;border-radius:12px;padding:10px;font-size:16px}
.sandbox-event{padding:12px;background:#fff;border:1px solid #edd6df;border-radius:16px;margin:14px 0}.sandbox-event>img{width:100%;height:130px;object-fit:cover;border-radius:12px}.sandbox-event h3{font-size:18px;margin:10px 0}.sandbox-event p{font-size:12px}.sandbox-event>div{display:flex;gap:6px;flex-wrap:wrap}.sandbox-event button{font-size:12px}
.sandbox-overlay{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:var(--brand-gradient);color:white;padding:22px;overflow:auto}.sandbox-overlay>div{text-align:center;max-width:400px}.sandbox-overlay h2{font-size:30px;color:white}.sandbox-overlay button{display:block;width:100%;margin-top:12px}.sandbox-match-photo{width:160px;height:180px;object-fit:cover;border-radius:24px;margin:auto}.sandbox-overlay p{font-size:15px;line-height:1.5;color:white}
.guided-app.sandbox-demo.mobile-preview{display:block;height:auto;position:relative;width:min(390px,calc(100% - 24px));padding:0;border:9px solid #211d21;border-radius:49px;overflow:visible;background:#211d21;box-shadow:0 0 0 1px #989195,0 0 0 3px #393339,0 24px 55px #40132330}
.sandbox-demo.mobile-preview:before,.sandbox-demo.mobile-preview:after{content:'';position:absolute;background:linear-gradient(90deg,#aaa3a7,#302b30);width:3px;border-radius:2px}
.sandbox-demo.mobile-preview:before{left:auto;right:-13px;top:145px;height:58px;transform:none}.sandbox-demo.mobile-preview:after{left:-13px;right:auto;top:110px;height:78px;transform:none}
.sandbox-demo.mobile-preview .sandbox-device{height:auto;min-height:550px;max-height:none;aspect-ratio:393/852;padding-top:52px;padding-bottom:22px;grid-template-rows:56px minmax(0,1fr) 56px;border-radius:40px;overflow:hidden;background:#fff}
.sandbox-demo.mobile-preview .sandbox-device:before{content:'';position:absolute;top:12px;left:calc(50% - 46px);width:92px;height:26px;border-radius:20px;background:radial-gradient(circle at 80% 50%,#273247 0 3px,#08090b 4px);z-index:3}
.sandbox-demo.mobile-preview .sandbox-overlay{inset:52px 0 22px}
.sandbox-demo.mobile-preview .sandbox-device:after{content:'';position:absolute;bottom:8px;left:calc(50% - 48px);width:96px;height:4px;border-radius:4px;background:#211d21;z-index:6;pointer-events:none}
.sandbox-status-bar{position:absolute;inset:17px 20px auto;display:flex;justify-content:space-between;align-items:center;color:#211d21;font:700 11px system-ui;line-height:18px;pointer-events:none;z-index:3}
/* v542: iOS status bar proportions (time 17pt semibold, centred in the left ear) like the native app screenshots */
.sandbox-status-bar{font:600 14.5px -apple-system,"SF Pro Text",system-ui,sans-serif;letter-spacing:-.2px;left:14px;right:18px}.sandbox-status-bar>span:first-child{min-width:64px;text-align:center}.sandbox-status-bar svg{display:block;flex:none;width:15px;height:13px;overflow:visible;fill:currentColor}.sandbox-status-bar>span:last-child{display:flex;align-items:center;gap:4px}.sandbox-battery{display:inline-block;width:19px;height:9px;padding:1px;border:1px solid #211d21;border-radius:2px}.sandbox-battery:before{content:'';display:block;width:var(--phone-battery,92%);height:100%;background:#211d21;transition:width 5s linear}.sandbox-status-bar svg{display:block;flex:none;width:13px;height:12px;overflow:visible;fill:currentColor}
@media(max-width:380px){.sandbox-demo button{padding-inline:7px}.sandbox-card h2{font-size:24px}.sandbox-card-copy{padding-inline:12px}.sandbox-decisions{gap:5px}}
@media(max-width:780px){body .preview-switch{display:none}}
@media(prefers-reduced-motion:reduce){.sandbox-card{will-change:auto}}
.homepage-demo{max-width:1260px;scroll-margin-top:100px}
.demo-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:28px}.demo-section-heading .sub{max-width:660px}.demo-section-heading .preview-switch{flex:none;margin:0 0 26px}
.sandbox-tour-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);align-items:start;gap:48px;margin-top:28px}
.sandbox-tour-layout .sandbox-demo{margin:0 auto;width:100%;max-width:390px}.sandbox-tour-layout .sandbox-demo.mobile-preview{width:min(390px,calc(100% - 8px))}
.sandbox-guide{padding:28px 0}.sandbox-guide h3{font-size:clamp(26px,3vw,38px);line-height:1.12;margin:12px 0 28px;color:#64162b}.sandbox-guide-steps{display:grid;gap:0}.sandbox-guide-steps button{display:grid;grid-template-columns:32px 1fr;gap:5px 12px;background:transparent;color:#64162b;text-align:left;border:0;border-top:1px solid #e5cbd5;padding:18px 8px;cursor:pointer}.sandbox-guide-steps span{grid-row:1/3;color:var(--red-ink);font-size:12px;font-weight:800;padding-top:4px}.sandbox-guide-steps b{font-size:18px}.sandbox-guide-steps small{font-size:13px;line-height:1.6;color:#81616d}.sandbox-guide-steps [aria-current=step]{background:#f9e8ee;border-radius:14px}.sandbox-guide>p{font-size:12px;line-height:1.6;color:#876370;margin-top:20px}
.sandbox-guide-steps button:focus-visible{outline:3px solid var(--red);outline-offset:3px}
/* Match the real discovery client's photo card and circular decision controls. */
.sandbox-decisions{gap:20px;padding-top:12px;padding-bottom:8px}.sandbox-decisions button{width:52px;height:52px;min-width:52px;border-radius:50%;font-size:20px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px #64162b12}.sandbox-decisions [data-sandbox-action=profile]{width:44px;min-width:44px;height:44px;align-self:center;font-size:18px}.sandbox-device{background:#fff}.sandbox-decisions{background:#fff}.sandbox-card{border-radius:22px}.sandbox-controls{background:#fff}.sandbox-controls [aria-pressed=true]{background:var(--red)}.sandbox-nav [aria-current=page]{background:#fff;color:var(--red-ink);border-radius:0;border-bottom:2px solid var(--red)}
@media(max-width:900px){.sandbox-tour-layout{grid-template-columns:1fr;gap:12px}.demo-section-heading{display:block}.demo-section-heading .preview-switch{margin:20px auto}.sandbox-guide{width:100%;max-width:650px;margin:auto;padding-top:20px}.sandbox-tour-layout .sandbox-demo{max-width:650px}}
.sandbox-atlas{display:block;overflow:hidden;flex:none;transform:translateZ(0)}.sandbox-atlas>image{pointer-events:none}.sandbox-group>.sandbox-atlas{width:100%;height:100%;min-width:0}.sandbox-match-row>.sandbox-atlas{width:54px;height:60px;border-radius:12px}.sandbox-chat-heading>.sandbox-atlas{width:32px;height:38px;border-radius:8px}
.sandbox-swipe-stamp{position:absolute;top:30px;z-index:2;border:3px solid currentColor;border-radius:12px;padding:8px 13px;font-size:25px;font-weight:900;letter-spacing:.04em;background:#fffffff2;pointer-events:none;box-shadow:0 5px 18px #210b1433}.sandbox-stamp-like{left:18px;color:var(--red-ink);transform:rotate(-13deg);opacity:var(--like-opacity,0)}.sandbox-stamp-pass{right:18px;color:#343044;transform:rotate(13deg);opacity:var(--pass-opacity,0)}.sandbox-card{animation:sandboxCardEnter 220ms ease-out}.sandbox-demo .sandbox-decisions button{position:relative}@keyframes sandboxCardEnter{from{opacity:.65;transform:scale(.965)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){.sandbox-card{animation:none}}

/* Shared accent hierarchy: filled actions, tinted choices, readable secondary text. */
.sandbox-demo .sandbox-primary:hover,.sandbox-demo [data-sandbox-action=event]:hover,.sandbox-demo .sandbox-compose button:hover,.sandbox-demo .sandbox-decisions [data-sandbox-action=like]:hover{background:var(--red-hover)}
.sandbox-demo .sandbox-scroll>h2,.sandbox-demo .sandbox-header b{color:var(--red-ink)}

.sandbox-status-bar .phone-wifi-outer{transition:opacity .8s ease}.sandbox-status-bar[data-wifi-bars="2"] .phone-wifi-outer{opacity:.2}
@media(prefers-reduced-motion:reduce){.sandbox-battery:before,.sandbox-status-bar .phone-wifi-outer{transition:none}}

.business-preview>.business-preview-note{display:flex;align-items:center;justify-content:center;gap:8px;width:fit-content;max-width:100%;margin:24px auto 0;padding:10px 16px;border:1px solid #64162b12;border-radius:16px;background:#fff8fa99;color:#795866;font-size:13px;line-height:1.5;text-align:center;box-sizing:border-box}.business-preview-note>span{flex:none;font-size:16px;line-height:1}

.sandbox-status-bar [class^="phone-cell-"]{transition:opacity .9s ease}.sandbox-status-bar[data-cell-bars="3"] .phone-cell-4,.sandbox-status-bar[data-cell-bars="2"] :is(.phone-cell-3,.phone-cell-4){opacity:.2}@media(prefers-reduced-motion:reduce){.sandbox-status-bar [class^="phone-cell-"]{transition:none}}

/* v482 home indicator like the real iPhone: 134x5 pt, 8 pt above the bottom edge of a 393x852 screen, scaled with the frame */
.sandbox-demo.mobile-preview .sandbox-device:has(.sandbox-client-frame)::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% * 8 / 852);width:calc(100% * 134 / 393);height:calc(100% * 5 / 852);min-height:3px;border-radius:99px;background:#111;opacity:.85;z-index:5;pointer-events:none}
