:root { color-scheme: light; --brand:#4B1E3F; --ink:#352f35; --muted:#756b73; }
* { box-sizing:border-box; }
body { margin:0; background:#faf8f5; color:var(--ink); font:16px/1.5 system-ui,sans-serif; }
.home { max-width:1120px; margin:0 auto; padding:56px 24px 72px; display:grid; grid-template-columns: .85fr 1.15fr; gap:48px; align-items:start; }
.intro { padding-top:34px; } .eyebrow { font-size:11px; letter-spacing:1.7px; color:var(--brand); font-weight:650; margin:0 0 16px; }
h1 { font:600 clamp(48px,6vw,76px)/1.08 "Cormorant Garamond",Georgia,serif; color:var(--brand); margin:0 0 24px; }
.lead { font-size:22px; line-height:1.5; max-width:360px; margin:0 0 24px; }
.intro-note { max-width:330px; color:var(--muted); font-size:14px; line-height:1.8; }
.card { background:#fff; border:1px solid #e8e0e5; border-radius:18px; padding:32px; box-shadow:0 10px 35px #4b1e3f05; min-width:0; }
.card-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:28px; }
h2 { font-size:21px; letter-spacing:-.4px; margin:0; font-weight:600; }.card-heading span { white-space:nowrap; color:var(--brand); font-size:11px; background:#f7f0f5; padding:5px 10px; border-radius:20px; }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:20px 16px; }
.field { display:flex; flex-direction:column; gap:8px; min-width:0; }
label { font-size:13px; font-weight:600; } small { font-size:11px; color:var(--muted); font-weight:400; } label small { margin-left:4px; }
input,select { width:100%; min-width:0; font:inherit; background:#fff; color:var(--ink); border:1px solid #d8cfd6; border-radius:8px; padding:12px; min-height:48px; }
input::placeholder { color:#8b8189; font-size:14px; }
input:focus,select:focus { outline:2px solid var(--brand); outline-offset:2px; }
.hint { font-size:12px; color:var(--muted); margin:0; line-height:1.6; } #time-note { margin:14px 0 24px; }
.place-field { position:relative; } #place-options { position:absolute; z-index:2; top:78px; margin:0; padding:4px; list-style:none; width:100%; max-height:250px; overflow:auto; background:#fff; border:1px solid #d8cfd6; border-radius:8px; box-shadow:0 10px 24px #352f3520; }
[role=option] { padding:12px; cursor:pointer; font-size:14px; border-radius:5px; } [role=option][aria-selected=true],[role=option]:hover { background:#f5edf2; color:var(--brand); }
.attribution { font-size:10px; color:var(--muted); margin:8px 0 24px; } a { color:inherit; }
button { cursor:pointer; font:600 14px system-ui,sans-serif; border-radius:8px; min-height:48px; padding:13px 18px; }
.checkout-link { display:inline-block; font:600 14px system-ui,sans-serif; border-radius:8px; min-height:48px; padding:13px 18px; text-decoration:none; }
.primary { background:var(--brand); color:white; border:1px solid var(--brand); }.primary:hover { background:#632951; }.primary:disabled { opacity:.65; cursor:wait; }
button:focus-visible,a:focus-visible { outline:2px solid var(--brand); outline-offset:3px; }
#calculate { width:100%; display:flex; justify-content:space-between; align-items:center; }.form-foot { font-size:11px; color:var(--muted); text-align:center; margin:14px 0 0; }
.notice { background:#f7f0f5; border-left:3px solid var(--brand); padding:12px; font-size:13px; margin:12px 0; }.error { color:#a12438; font-size:13px; margin:12px 0; }
.result { grid-column:1/-1; }.result dl { display:flex; gap:24px; flex-wrap:wrap; }.result dt { font-size:12px; color:var(--muted); }.result dd { margin:4px 0; font-weight:600; }#bodygraph { width:100%; max-width:750px; height:auto; display:block; margin:20px auto 0; }
dialog { width:min(460px,calc(100% - 32px)); border:1px solid #e8e0e5; border-radius:18px; padding:28px; color:var(--ink); }dialog::backdrop { background:#21131dcc; }.dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }#close-auth { background:none; border:0; padding:0; min-width:44px; font-size:28px; }dialog p { font-size:14px; color:var(--muted); }dialog .field { margin-top:18px; }.auth-actions { display:flex; gap:10px; margin-top:20px; }.auth-actions button { flex:1; }.secondary { border:1px solid #d8cfd6; background:#fff; color:var(--brand); }
[hidden] { display:none !important; }
@media(max-width:760px) { .home { display:block; padding:28px 16px 48px; }.intro { padding:0 4px; }.eyebrow { margin-bottom:10px; }h1 { margin-bottom:14px; }.lead { font-size:18px; max-width:none; margin-bottom:14px; }.intro-note { max-width:none; margin-bottom:26px; }.card { padding:24px 20px; }.result { margin-top:24px; } }
@media(max-width:420px) { .grid { grid-template-columns:1fr; gap:16px; }.card { padding:20px 16px; }.card-heading { gap:6px; }h2 { font-size:19px; } }

#find-matches { margin-top:24px; max-width:100%; }
#free-match h3 { overflow-wrap:anywhere; }
#basic-invitation { margin-top:28px; border-top:1px solid #e8e0e5; padding-top:20px; }
#basic-upgrade:disabled { cursor:not-allowed; }
#basic-status { margin-top:10px; }
/* Translation-length resilience; keep the approved sizes and colors. */
html[lang="tr"] h1 { overflow-wrap:anywhere; hyphens:auto; }
@media(max-width:340px) { .card-heading { flex-wrap:wrap; } }
#bodygraph { direction:ltr; }
html[dir="rtl"] .notice { border-left:0; border-right:3px solid var(--brand); }
.basic-matches { padding-inline-start:24px; }
.basic-matches > li { padding:20px 0; border-bottom:1px solid #e8e0e5; }
.basic-matches > li > a { font-weight:600; font-size:18px; overflow-wrap:anywhere; }
#member-content > h2 { margin-top:24px; }
#member-content > button { margin-top:24px; max-width:100%; }
.celebrity-bodygraph { display:block; width:100%; max-width:750px; height:auto; margin:24px auto; direction:ltr; }
#pro-form { display:grid; gap:20px; margin-top:24px; }
#pro-form fieldset { min-width:0; border:1px solid #e8e0e5; border-radius:8px; padding:12px; }
#pro-form legend, #pro-form summary { font-weight:600; }
#pro-form summary { cursor:pointer; padding:12px 0; }
.pro-checks { display:grid; grid-template-columns:repeat(auto-fit,minmax(85px,1fr)); gap:8px; }
.pro-checks label { display:flex; align-items:center; gap:6px; }
.pro-checks input { width:18px; min-height:18px; height:18px; flex:0 0 auto; }
.pro-planet { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.pro-matches { padding-inline-start:20px; }
.pro-matches li { padding:16px 0; border-bottom:1px solid #e8e0e5; }
.pro-matches a { font-weight:600; overflow-wrap:anywhere; }
.pro-pagination { display:flex; flex-wrap:wrap; gap:12px; }
#pro-results { margin-top:24px; }