:root{--bg:#f6f0e5;--bg2:#efe4d3;--sunken:#e8dac5;--card:#fff9f0;--raised:#fffcf7;--ivory:#fbf5ea;--halo:#f5c24a;--ink:#321d16;--ink2:#5a4035;--dim:#755e51;--dim2:#7b6254;--faint:#806656;--ghost:#c7b5a1;--line:#e6d7c5;--line2:#d7c2aa;--acc:#3c2119;--acc2:#5a3226;--on_acc:#fff9ef;--butter:#e7c96f;--citrus:#e08a3c;--ok:#557a61;--good:#6d8a67;--bad:#a4473d;--pink:#b96b6a;--rej_bg:#f3e3de;--mars:#5b7fa6;--veil:rgba(26,14,10,.78);--veil0:rgba(26,14,10,0);--veil_sm:rgba(26,14,10,.42);--pill:rgba(26,14,10,.42);--pill_on:rgba(255,249,240,.94);--ovl_ink:#ffffff;--ovl_sh:rgba(0,0,0,.45);--ovl_sh2:rgba(0,0,0,.34);--pill_act:rgba(18,10,7,.90);--grab:rgba(50,29,22,.20);--paw:#b07a3c;--honey:#ab7d24;--butter2:#f3e2b3;--veil_lt:rgba(246,240,229,0);--font:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--display:Iowan Old Style,Baskerville,'Times New Roman',serif;--mono:ui-monospace,Menlo,Consolas,monospace;--txt:#321d16;--gold:#3c2119;--surface:#fff9f0;-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;text-rendering:optimizeLegibility;font-optical-sizing:auto;color-scheme:only light}
/* ── study overrides (everything above is the product's design tokens, v1/design.py, copied literally) ── */
/* the headline is longer than "Find your soul mate's face": same type treatment, wrapped to two lines */
#mtload .mtl-copy{white-space:normal;width:max-content;max-width:calc(100vw - 32px)}
/* the pill's tap does nothing yet (page 2 is not built) */
#stick{cursor:default}
/* the product's 18+ footer, set on the loader */
.sfoot{position:fixed;left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom) + var(--tuner-h,0px));z-index:9003;text-align:center;
  font:11px/1 var(--font);letter-spacing:.04em;color:var(--card);opacity:.62;pointer-events:none;text-shadow:0 1px 8px rgba(0,0,0,.4)}
/* the ♀/♂ audience toggle — the product's .gtog (v1/chrome.py) verbatim, pinned above the 18+ line */
.gtog{position:fixed;left:50%;bottom:calc(40px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9003;
  pointer-events:auto;display:flex;align-items:center;gap:4px;border:1px solid var(--line);background:var(--sunken);
  border-radius:999px;padding:4px 7px;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.10);-webkit-tap-highlight-color:transparent}
.gtog .gt{width:27px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:999px;
  color:var(--faint);opacity:.5;transition:opacity .16s,color .16s}
.gtsym{display:block}.gtsym-f{height:16px;width:auto}.gtsym-m{height:13.5px;width:auto}
.gtog.women-active .gt-f{color:#e2739e;opacity:1;background:var(--card);box-shadow:0 0 0 1px var(--line)}
.gtog.men-active .gt-m{color:var(--mars);opacity:1;background:var(--card);box-shadow:0 0 0 1px var(--line)}
/* headline position/size (?ty/?ts override inline) */
#mtload .mtl-copy{top:33.7%;font-size:21.3px}   /* S1 2026-09-28: "y=33.7 ts=21.3 — the adjusted perfect one" */
/* ?tune=1 — the headline tuning panel */
#tune{position:fixed;left:16px;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:9004;pointer-events:auto;
  background:rgba(20,12,9,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,249,240,.25);
  border-radius:14px;padding:10px 12px;color:var(--card);font:12px/1.3 var(--font)}
#tune label{display:block;margin:0 0 6px}#tune label b{float:right;font-weight:600}
#tune input[type=range]{display:block;width:100%;margin:4px 0 0;accent-color:var(--butter)}
#tune .tr{display:flex;gap:8px;align-items:center}#tune code{flex:1;font:11px var(--mono);overflow-x:auto;white-space:nowrap}
#tune button{border:0;border-radius:8px;padding:7px 12px;font:700 13px var(--font);background:var(--butter);color:var(--ink)}
/* ── the START FLOW (replaces the brand pill; same pill: outline, serif italic, letter-spacing) ── */
#start{position:fixed;left:16px;right:16px;bottom:calc(min(calc(30vh + env(safe-area-inset-bottom)), calc(50vh - 96px)) + var(--tuner-h,0px));z-index:9002;
  display:flex;flex-direction:column;align-items:center;pointer-events:none}
#start .q,#start .em{display:flex;flex-direction:column;align-items:center;gap:12px;opacity:0;transform:translateY(8px);
  transition:opacity .35s ease,transform .35s ease;pointer-events:auto}
#start .q{opacity:1;transform:none}
#start .q[hidden],#start .em[hidden]{display:none}
#start .q.on,#start .em.on{opacity:1;transform:none}
#start .qlab{font:italic 400 13px/1 var(--display);letter-spacing:.18em;color:var(--card);opacity:.85;text-shadow:0 1px 10px rgba(0,0,0,.4)}
#start .row{display:flex;gap:8px;justify-content:center;flex-wrap:nowrap}
.pill{display:inline-flex;align-items:center;justify-content:center;gap:.42em;white-space:nowrap;line-height:1;box-sizing:border-box;
  font:italic 500 14px/1 var(--display);letter-spacing:.22em;color:var(--card);
  background:rgba(20,12,9,.28);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border:1.5px solid rgba(255,249,240,.85);border-radius:999px;padding:.58em 1.2em .6em;margin:0;cursor:pointer;
  -webkit-tap-highlight-color:transparent;transition:transform .12s ease,background .35s ease,border-color .35s ease,color .35s ease,opacity .35s ease}
.pill:active{transform:scale(.96)}
.pill:focus{outline:none}
#start .opt{padding:.58em .95em .6em;letter-spacing:.14em}
#start .opt.sel{background:rgba(255,249,240,.9);color:var(--ink);border-color:rgba(255,249,240,.95)}
#start .chip{font-size:12px;padding:.45em 1em .47em;letter-spacing:.16em;opacity:.9}
#start .chip.lock{opacity:.55;cursor:default}
#start .field{position:relative;width:min(300px,100%);cursor:text;padding:0}
#start .field input{flex:1;min-width:0;width:100%;border:0;outline:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;
  text-align:center;padding:.72em 2.4em .74em;border-radius:999px;-webkit-appearance:none;appearance:none;caret-color:var(--butter)}
#start .field input::placeholder{color:var(--card);opacity:.62}
#start .field .ck{position:absolute;right:1em;top:50%;font:600 15px/1 var(--font);font-style:normal;letter-spacing:0;
  transform:translateY(-50%) scale(.2);opacity:0;transition:transform .45s cubic-bezier(.2,.9,.3,1.4) .2s,opacity .3s ease .2s}
#start .field.sealed{background:var(--acc);border-color:var(--acc);color:var(--card);transform:scale(.98);
  box-shadow:0 6px 22px rgba(0,0,0,.35);transition:background .45s ease,border-color .45s ease,transform .45s cubic-bezier(.2,.9,.3,1.2),box-shadow .45s ease}
#start .field.sealed .ck{opacity:1;transform:translateY(-50%) scale(1)}
#start .go.gone{opacity:0;transform:scale(.9);pointer-events:none}
#start .moment{min-height:1.2em;font:italic 400 13px/1.2 var(--display);letter-spacing:.14em;color:var(--card);opacity:0;transition:opacity .5s ease;
  text-shadow:0 1px 10px rgba(0,0,0,.4)}
#start .moment.on{opacity:.8}
.shake{animation:shk .42s cubic-bezier(.36,.07,.19,.97)}
@keyframes shk{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(3px)}30%,50%,70%{transform:translateX(-6px)}40%,60%{transform:translateX(6px)}}
/* S1 2026-09-28: three smallish plain-word pills, women · both · men, minutes underneath */
#start .qlab{font:300 15px/1.2 Georgia,'Times New Roman',serif;font-style:normal;letter-spacing:.04em;opacity:.92;text-shadow:0 2px 18px rgba(0,0,0,.45)}
#start .row{gap:10px;align-items:flex-start}
#start .optc{display:flex;flex-direction:column;align-items:center;gap:7px}
#start .opt{font-size:13px;padding:.55em 1.05em .57em;letter-spacing:.16em}
#start .mins{font:300 11px/1 Georgia,'Times New Roman',serif;letter-spacing:.06em;color:var(--card);opacity:.7;text-shadow:0 1px 10px rgba(0,0,0,.45)}
/* ?tune=2 — the switch-blend panel */
#tune.t2{bottom:calc(40px + env(safe-area-inset-bottom))}
#tune .rad{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;margin:2px 0 8px}
#tune .rad label{display:inline-flex;gap:4px;align-items:center;margin:0}
#tune .rad input{accent-color:var(--butter);margin:0}
#tune.cad{bottom:calc(40px + env(safe-area-inset-bottom))}
/* tuning panels sit at the TOP so they never cover the start pills (2026-09-28) */
#tune.cad{bottom:auto;top:calc(10px + env(safe-area-inset-top))}
/* ?cells=1 — the cell tabs (bottom, above the 18+ line) */
#celltabs{position:fixed;left:10px;right:10px;bottom:calc(36px + env(safe-area-inset-bottom));z-index:9005;pointer-events:auto;
  background:rgba(20,12,9,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,249,240,.25);
  border-radius:14px;padding:8px;color:var(--card);font:12px/1.3 var(--font)}
#celltabs .ct-tabs{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:3px;margin:0 0 6px}
#celltabs .ct{border:1px solid rgba(255,249,240,.35);background:transparent;color:var(--card);border-radius:7px;padding:5px 0;font:600 12px var(--font)}
#celltabs .ct.on{background:var(--butter);color:var(--ink);border-color:var(--butter)}
#celltabs .ct.cur:not(.on){border-color:var(--butter)}
#celltabs .ct-strip{display:flex;gap:3px;align-items:center;min-height:36px;margin:0 0 6px;overflow-x:auto}
#celltabs .f{position:relative;flex:0 0 auto;width:36px;height:36px;border-radius:6px;overflow:hidden}
#celltabs .f img{width:100%;height:100%;object-fit:cover;display:block}
#celltabs .f i{position:absolute;left:1px;top:0;font:700 9px monospace;font-style:normal;background:rgba(0,0,0,.6);padding:0 2px;border-radius:3px}
#celltabs .f.land{outline:2px solid var(--butter);outline-offset:-2px}
#celltabs .nt{font-size:11px;opacity:.85}
#celltabs .tr{display:flex;gap:8px;align-items:center}#celltabs code{flex:1;font:11px var(--mono)}
#celltabs button#ctcp{border:0;border-radius:8px;padding:6px 12px;font:700 13px var(--font);background:var(--butter);color:var(--ink)}
