/* English Dating page: the same blush, rounded-card visual language as AIWOMA.
   Every rule is scoped to the Dating site so the Fed and all-theme pages keep their UI. */
body.dating {
  --ground:#fff4f6; --panel:#fff; --ink:#3a2230; --muted:#9a7385; --line:#f5d5df;
  --jev:#f2416b; --jev-soft:#ffe3ea; --llm:#8a63e8; --llm-soft:#eee7ff;
  --good:#1fa971; --warn:#e0344b; --track:#fbe3ea;
  --rose-grad:linear-gradient(135deg,#ff7aa2 0%,#ff5c8a 45%,#ff8a6b 100%);
  --cute:"Fredoka","Bricolage Grotesque",system-ui,sans-serif;
  --shadow:0 10px 30px -12px rgba(242,65,107,.28);
  background:
    radial-gradient(1100px 520px at 50% -140px,color-mix(in srgb,#ff8fb1 38%,transparent),transparent 70%),
    radial-gradient(600px 400px at 100% 30%,color-mix(in srgb,#ffb199 22%,transparent),transparent 70%),
    radial-gradient(600px 400px at 0% 60%,color-mix(in srgb,#c9b2ff 18%,transparent),transparent 70%),
    var(--ground);
  background-attachment:fixed;
  color:var(--ink);
  font-family:"IBM Plex Sans",system-ui,sans-serif;
}
@media (prefers-color-scheme:dark) {
  body.dating:not([data-theme="light"]) {
    --ground:#1e1219; --panel:#2a1822; --ink:#fbe9f0; --muted:#c29aae; --line:#462838;
    --jev:#ff7098; --jev-soft:#4a1e30; --llm:#b79cff; --llm-soft:#302552; --track:#3e2432;
    --shadow:0 10px 30px -14px rgba(0,0,0,.6);
  }
}
body.dating[data-theme="dark"] {
  --ground:#1e1219; --panel:#2a1822; --ink:#fbe9f0; --muted:#c29aae; --line:#462838;
  --jev:#ff7098; --jev-soft:#4a1e30; --llm:#b79cff; --llm-soft:#302552; --track:#3e2432;
  --shadow:0 10px 30px -14px rgba(0,0,0,.6);
}
.dating .wrap { max-width:980px; }
.dating header { justify-content:center; text-align:center; margin:18px 0 28px; }
.dating h1 { font:500 clamp(44px,8vw,76px)/1.05 var(--cute); letter-spacing:.02em; }
.dating h1 .dating-title { background:var(--rose-grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.dating h1 .hearts { display:block; margin-bottom:6px; font-size:.5em; animation:dating-beat 1.6s ease-in-out infinite; }
.dating h1 .hs { font:500 clamp(16px,2.4vw,21px)/1.3 "IBM Plex Sans",system-ui,sans-serif; color:var(--muted); letter-spacing:.04em; margin-top:14px; }
.dating .lede { margin:14px auto 0; max-width:50em; font-size:14.5px; }
@keyframes dating-beat { 0%,100% { transform:scale(1); } 15% { transform:scale(1.18); } 30% { transform:scale(1); } 45% { transform:scale(1.1); } }

/* The two original Dating tools remain available above AIWOMA-style view tabs. */
.dating .themes { display:flex; justify-content:center; gap:9px; margin:0 auto 15px; }
.dating .theme { display:block; flex:0 1 auto; border:1px solid var(--line); border-radius:999px; padding:8px 18px; background:var(--panel); text-align:center; box-shadow:var(--shadow); }
.dating .theme .em { display:none; }
.dating .theme .nm { font:600 15px/1.2 var(--cute); }
.dating .theme .bl { display:none; }
.dating .theme[aria-pressed="true"] { border-color:var(--jev); box-shadow:0 0 0 1px var(--jev) inset,var(--shadow); color:var(--jev); }
.dating .theme:hover { border-color:var(--jev); }
.dating .themes[hidden] { display:none; }
.dating .tabs { justify-content:center; gap:0; width:max-content; max-width:100%; margin:0 auto 24px; padding:5px; border:0; border-radius:999px; background:var(--panel); box-shadow:var(--shadow); }
.dating .tab { margin:0; border:0; border-radius:999px; padding:9px 24px; font:500 15px var(--cute); }
.dating .tab[aria-selected="true"] { background:var(--rose-grad); color:#fff; }

.dating .setup { padding:18px 18px 16px; border:1px solid var(--line); border-radius:22px; background:var(--panel); box-shadow:var(--shadow); }
.dating .label { font:600 13px "IBM Plex Sans",system-ui,sans-serif; text-transform:none; letter-spacing:.02em; color:var(--muted); }
.dating textarea { min-height:140px; border:1px solid transparent; border-radius:16px; background:var(--ground); font-size:15.5px; line-height:1.7; }
.dating textarea:focus { border-color:var(--jev); }
.dating .chip { border-color:var(--line); border-radius:999px; background:var(--panel); color:var(--ink); }
.dating .chip:hover { border-color:var(--jev); color:var(--jev); }
.dating .btn { padding:12px 26px; border-radius:999px; background:var(--rose-grad); color:#fff; box-shadow:0 8px 18px -8px rgba(242,65,107,.7); }
.dating .btn:hover:not(:disabled) { filter:brightness(1.05); transform:translateY(-1px); }
.dating .btn.ghost { border:1.5px solid var(--jev); background:var(--panel); color:var(--jev); box-shadow:none; }
.dating :is(.tab,button,textarea,input,select):focus-visible { outline-color:var(--jev); }
.dating .dropzone { position:relative; display:grid; justify-items:center; gap:4px; margin-top:12px; padding:18px 14px; border:2px dashed color-mix(in srgb,var(--jev) 55%,var(--line)); border-radius:18px; background:color-mix(in srgb,var(--jev-soft) 55%,transparent); text-align:center; cursor:pointer; }
.dating .dropzone:hover,.dating .dropzone.over { border-color:var(--jev); background:var(--jev-soft); }
.dating .dropzone:focus-within { outline:2px solid var(--jev); outline-offset:2px; }
.dating .dropzone input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.dating .dz-icon { font-size:30px; line-height:1; }
.dating .dz-main { font-size:15px; font-weight:600; }
.dating .dz-main u { color:var(--jev); text-underline-offset:3px; }
.dating .dz-sub { color:var(--muted); font-size:12.5px; }
.dating .who { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin-top:8px; font-size:13.5px; }
.dating .who .chip[aria-pressed="true"] { border-color:var(--jev); background:var(--jev); color:#fff; }
.dating .who-note { color:var(--muted); font-size:12.5px; }
.dating #replay { align-self:center; margin:2px 0 4px; padding:10px 22px; border:0; background:var(--rose-grad); color:#fff; font:600 15px var(--cute); box-shadow:0 8px 18px -8px rgba(242,65,107,.7); }
.dating #replay:disabled { opacity:.5; cursor:default; }

.dating .lane { min-height:0; position:relative; overflow:hidden; border:1px solid var(--line); border-radius:22px; box-shadow:var(--shadow); }
.dating .lane.jev,.dating .lane.llm { border-top:1px solid var(--line); }
.dating .lane::before { content:""; position:absolute; inset:0 0 auto; height:6px; }
.dating .lane.jev::before { background:linear-gradient(90deg,#ff7aa2,#f2416b); }
.dating .lane.llm::before { background:linear-gradient(90deg,#b79cff,#8a63e8); }
.dating .lane-name { font-family:var(--cute); font-weight:500; }
.dating .lane-select { border-radius:999px; border-width:1.5px; padding:6px 36px 6px 14px; box-shadow:none; font-size:18px; }
.dating .flag,.dating .end { border:1.5px solid var(--line); border-radius:20px; }
.dating .jev .flag.win,.dating .jev .end.on { border-color:var(--jev); background:var(--jev-soft); }
.dating .llm .flag.win,.dating .llm .end.on { border-color:var(--llm); background:var(--llm-soft); }
.dating .flag .flag-label,.dating .end { font-family:var(--cute); font-weight:500; }
.dating .jev .flag.win .pct { color:var(--jev); }
.dating .llm .flag.win .pct { color:var(--llm); }
.dating .flag.win .emo,.dating .end.on .emo { animation:dating-beat 1.6s ease-in-out infinite; }
.dating .meter .t { height:12px; border-radius:999px; }
.dating .jev .meter .f { background:linear-gradient(90deg,#ff9db8,#f2416b); }
.dating .llm .meter .f { background:linear-gradient(90deg,#d3c2ff,#8a63e8); }
.dating .spark .frame { fill:var(--ground); }
.dating .spark .axis { font-family:"IBM Plex Sans",system-ui,sans-serif; font-size:9.5px; }
.dating .card { border:0; border-radius:22px; background:var(--rose-grad); color:#fff; box-shadow:var(--shadow); }
.dating .card .big,.dating .card .sub { color:#fff; }
.dating .card .what { font-family:var(--cute); font-size:26px; font-weight:500; }
.dating .disclaimer { text-align:center; }
.dating .legal { margin-inline:auto; border-top:1px dashed var(--line); }
.dating .legal h2 { font:600 13px "IBM Plex Sans",system-ui,sans-serif; text-transform:none; letter-spacing:.04em; }
.dating dialog#keys { border-radius:22px; }
.dating .keys-form h2 { font-family:var(--cute); font-weight:500; }
@media (max-width:560px) {
  .dating .theme { padding:8px 12px; }
  .dating .tab { padding:8px 18px; }
  .dating .setup { padding:14px; border-radius:18px; }
  .dating #replay { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  .dating h1 .hearts,.dating .emo { animation:none!important; }
}