:root{
      --teal:#86C2A6;    /* links/focus/success */
      --pink:#F6C2CB;    /* primary soft */
      --coral:#FF7A6E;   /* CTA pop */
      --lav:#EDE2F6;     /* lilac tint */
      --ink:#2B2B2F;     /* body text */
      --bg-grad: linear-gradient(180deg, #fff 0%, #fff7f9 40%, #f6fafe 100%);
    }
    html, body { color: var(--ink); }
    body {
      font-family: Poppins, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
      background: var(--bg-grad);
    }
    .font-serif { font-family: Lora, Georgia, serif; }

    /* Header */
    header.navbar-sticky { position:sticky; top:0; z-index:1030; backdrop-filter: saturate(180%) blur(8px); background:rgba(255,255,255,.85); border-bottom:1px solid #ffe3ea; }

    /* Chips / pills / buttons */
    .chip { display:inline-flex; align-items:center; gap:.4rem; border:1px solid rgba(26,179,148,.18); background: rgba(26,179,148,.10); color:#0f766e; border-radius:999px; padding:.25rem .65rem; font-size:.875rem; }
    .badge-soft { background: rgba(134,194,166,.12); color: var(--teal); border:1px solid rgba(134,194,166,.30); }
    .btn-romantic { background: var(--pink); color:#fff; border:none; border-radius:999px; padding:.68rem 1.05rem; font-weight:700; box-shadow:0 8px 24px rgba(26,179,148,.10); }
    .btn-romantic:hover { background: var(--teal); color:#fff; box-shadow:0 12px 30px rgba(26,179,148,.25); }
    .btn-outline-teal { border:1.5px solid var(--teal); color: var(--teal); border-radius:999px; padding:.68rem 1.05rem; background:transparent; font-weight:700; }
    .btn-outline-teal:hover { background: rgba(26,179,148,.08); color: var(--teal); }

    /* Card */
    .card-romance { border:1px solid rgba(0,0,0,.06); background:#fff; border-radius:1.25rem; box-shadow:0 8px 32px rgba(17,24,39,.06); }
    .card-romance:hover { transform: translateY(-2px); transition: .15s ease; box-shadow:0 14px 44px rgba(17,24,39,.10); }
    .browse-card { cursor: pointer; }
    .browse-card:focus-within { box-shadow:0 0 0 .2rem rgba(134,194,166,.28), 0 14px 44px rgba(17,24,39,.10); }
    .browse-card .open-hint { color:#6f7d88; font-size:.78rem; }

    /* Photo box */
    .photo-box { position: relative; border-radius: 1rem; overflow: hidden; background: radial-gradient(120px 120px at 50% 40%, rgba(246,194,203,.55), rgba(134,194,166,.35)), var(--lav); box-shadow: inset 0 0 0 1px rgba(0,0,0,.04); }
    .photo-box .blur-pill { width: 110px; height: 110px; border-radius: 50%; background: linear-gradient(135deg, var(--pink), var(--teal)); filter: blur(10px); }
    .photo-box img.photo { width:100%; height:100%; object-fit:cover; display:block; }
    .photo-overlay { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:linear-gradient(180deg, rgba(255,255,255,.0), rgba(0,0,0,.20)); color:#fff; font-weight:700; letter-spacing:.2px; opacity:0; transition: .15s ease; }
    .photo-private .photo-overlay { opacity:1; }

    /* Filters bar */
    .filters { position: sticky; top: 72px; z-index: 20; background: rgba(255,255,255,.85); backdrop-filter: blur(8px); border:1px solid rgba(0,0,0,.06); border-radius: 14px; padding: .8rem; }

    .romance-link { color: var(--teal); text-decoration: none; }
    .romance-link:hover { text-decoration: underline; }

    .shape-pink { position:absolute; width:18rem; height:18rem; border-radius:50%; background: var(--pink); filter: blur(60px); opacity:.22; z-index:0; }
    .shape-teal { position:absolute; width:20rem; height:20rem; border-radius:50%; background: var(--teal); filter: blur(70px); opacity:.18; z-index:0; }

    .canvas-actions .btn { border-radius:999px; }
    .canvas-nav{
      margin-top:.95rem;
      display:grid;
      grid-template-columns: 1fr auto 1fr;
      align-items:center;
      gap:.55rem;
    }
    .canvas-nav .btn-step{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.4rem;
      min-width:108px;
      border-radius:999px;
      font-weight:700;
      padding:.55rem .85rem;
    }
    .canvas-nav .btn-step[disabled]{
      opacity:.45;
      cursor:not-allowed;
    }
    .canvas-nav .progress-copy{
      text-align:center;
      font-size:.9rem;
      color:#6f7d88;
      line-height:1.2;
    }
    .canvas-nav .progress-copy strong{ color:#2b2b2f; font-size:1rem; }

    #profileCanvas.offcanvas-end{
      border-left: 0;
      box-shadow: -14px 0 36px rgba(17,24,39,.16);
    }

    @media (max-width: 767.98px){
      .filters{
        position: static;
        top: auto;
        z-index: auto;
      }
    }

    /* Theme link colors */
    a{ color: var(--ink); text-decoration: none; }
    a:hover{ color: var(--teal); text-decoration: underline; }