/* ============================================================================
   HINGE SONUÇ EKRANI — "AKIŞTAKİ PROFİLİN" TEMASI  (06.09.2026, v2)
   Çizici: js/hinge-report.js. Bumble ile aynı yükleme düzeni (index.php),
   üstüne yazma katmanı olduğu için !important var.

   TASARIM: Hinge'in kendi düzeni. Krem-lavanta zemin, foto kartları köşeli
   yuvarlak, prompt kartları beyaz + serif cevap, Hinge bildirimi (kalp + yorum
   balonu) beğeninin düştüğü öğenin üstünde. Tinder pembesi / Bumble balı yok.
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&display=swap');

.scroll-area:has(.hinge-x),
#result-screen .scroll-area:has(.hinge-x) { background: #f4f2f9 !important; }

/* Bekleme ekranı (loading-hinge sınıfı scripts.js'ten) */
#loading-screen.loading-hinge { background: linear-gradient(180deg, rgba(20, 12, 40, .98) 0%, rgba(8, 6, 22, .98) 100%); }
#loading-screen.loading-hinge .loading-icon-pulse { background: linear-gradient(135deg, #6d3df5 0%, #ff5d8f 100%); box-shadow: 0 0 40px rgba(120, 70, 240, .45); animation: hinge-pulse-glow 2s ease-in-out infinite; }
#loading-screen.loading-hinge .loading-icon-pulse i { color: #fff; }
@keyframes hinge-pulse-glow { 0%,100% { transform: scale(1); box-shadow: 0 0 40px rgba(120,70,240,.45); } 50% { transform: scale(1.05); box-shadow: 0 0 60px rgba(255,93,143,.5); } }
#loading-screen.loading-hinge .loading-progress-fill { background: linear-gradient(90deg, #6d3df5 0%, #b23ce8 50%, #ff5d8f 100%); background-size: 200% 100%; }
#loading-screen.loading-hinge .loading-progress-info #loading-percent { color: #c9b3ff; }
#loading-screen.loading-hinge .loading-fact-card { background: rgba(120, 70, 240, .10); border: 1px solid rgba(160, 120, 255, .28); }
#loading-screen.loading-hinge .step-icon { background: rgba(120, 70, 240, .12); border: 2px solid rgba(160, 120, 255, .32); }
#loading-screen.loading-hinge .step-icon i { color: #c9b3ff; }
#loading-screen.loading-hinge .loading-step.active .step-icon { background: rgba(120, 70, 240, .25); border-color: #a78bfa; box-shadow: 0 0 20px rgba(120, 70, 240, .35); }
#loading-screen.loading-hinge .loading-step.completed .step-icon { background: #6d3df5; border-color: #6d3df5; }
#loading-screen.loading-hinge .loading-step.completed .step-icon i { color: #fff; }

.hinge-x {
  --paper:#f4f2f9; --card:#fff; --sunken:#efecf7;
  --line:#e6e2f1; --line-2:#d6d0ea;
  --ink:#17122e; --ink-2:#5b5677; --ink-3:#8e89a8;
  --coal:#171230;
  --vio:#6d3df5; --vio-soft:#efeafe; --rose:#ff4d7d; --rose-soft:#ffe9f0;
  --grad:linear-gradient(96deg,#5b2be0,#a63bf0 52%,#ff5d8f);
  --bad:#c0303f; --bad-bg:#fdf1f2; --warn:#b76e00; --warn-bg:#fff6e5; --good:#0f8f6e; --good-bg:#e8f8f2;
  --sh-1:0 1px 2px rgba(40,25,90,.05);
  --sh-2:0 1px 2px rgba(40,25,90,.04), 0 10px 24px -10px rgba(40,25,90,.16);
  --sh-3:0 2px 4px rgba(40,25,90,.05), 0 22px 44px -16px rgba(40,25,90,.22);
  --ease:cubic-bezier(.22,1,.36,1);
  --serif:'Fraunces','Iowan Old Style','Georgia',serif;
  max-width:500px !important; margin:0 auto !important; padding:4px 16px 34px !important;
  background:var(--paper) !important; color:var(--ink) !important;
  font-size:14px !important; line-height:1.55 !important; font-variant-numeric:tabular-nums;
}
.hinge-x *{ box-sizing:border-box; }
.hinge-x .hx-peek{ filter:blur(4px); user-select:none; }

/* --------------------------------------------------------------- baş + hüküm */
.hinge-x .hf-head{ display:flex; align-items:center; gap:10px; padding:10px 2px 8px; }
.hinge-x .hf-logo{ width:34px; height:34px; border-radius:11px; background:var(--grad); color:#fff; display:grid; place-items:center; font-size:15px; flex:none; }
.hinge-x .hf-title{ font-size:16px; font-weight:800; letter-spacing:-.02em; line-height:1.1; }
.hinge-x .hf-title small{ display:block; font-size:11px; font-weight:600; color:var(--ink-3); margin-top:3px; letter-spacing:.02em; }
.hinge-x .hf-badge{ margin-left:auto; font-size:11px; font-weight:700; padding:6px 10px; border-radius:999px; white-space:nowrap; }
.hinge-x .hf-badge.free{ background:var(--card); color:var(--ink-2); border:1px solid var(--line-2); }
.hinge-x .hf-badge.premium{ background:var(--coal); color:#fff; }
.hinge-x .hf-verdict{ margin:6px 2px 14px; font-family:var(--serif); font-size:19px; line-height:1.3; color:var(--ink); }

/* --------------------------------------------------------------- akış kartları */
.hinge-x .hf-feed{ display:flex; flex-direction:column; gap:14px; }
.hinge-x .hf-card{ position:relative; }
.hinge-x .hf-photo-wrap{ position:relative; border-radius:22px; overflow:hidden; aspect-ratio:4/5; background:var(--sunken); box-shadow:var(--sh-2); cursor:pointer; }
.hinge-x .hf-photo-wrap img{ width:100%; height:100%; object-fit:cover; display:block; }
.hinge-x .hf-slot{ position:absolute; top:12px; left:12px; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:5px 9px; border-radius:999px; background:rgba(23,18,46,.72); color:#fff; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.hinge-x .hf-skip, .hinge-x .hf-ok, .hinge-x .hf-lead-tag{ position:absolute; right:12px; bottom:12px; font-size:11px; font-weight:800; padding:6px 10px; border-radius:999px; display:inline-flex; align-items:center; gap:6px; }
.hinge-x .hf-skip{ background:rgba(255,255,255,.92); color:var(--bad); }
.hinge-x .hf-ok{ background:rgba(255,255,255,.92); color:var(--good); }
.hinge-x .hf-skip.in, .hinge-x .hf-ok.in{ position:static; margin-top:10px; background:var(--sunken); }
.hinge-x .hf-skip.in{ color:var(--bad); background:var(--bad-bg); } .hinge-x .hf-ok.in{ color:var(--good); background:var(--good-bg); }
.hinge-x .hf-lead-tag{ right:auto; left:12px; background:var(--grad); color:#fff; }
.hinge-x .hf-photo.locked img{ filter:blur(10px) saturate(.7); transform:scale(1.08); }
.hinge-x .hf-lockbig{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; color:#fff; background:linear-gradient(180deg,rgba(23,18,46,.1),rgba(23,18,46,.5)); font-size:20px; }
.hinge-x .hf-lockbig b{ font-size:30px; font-weight:800; letter-spacing:-.03em; }
.hinge-x .hf-lockbig small{ font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; opacity:.9; }
.hinge-x .hf-photo-foot{ display:flex; align-items:center; gap:8px; margin:9px 4px 0; }
.hinge-x .hf-sc{ font-size:15px; font-weight:800; letter-spacing:-.02em; }
.hinge-x .hf-sc small{ font-size:10px; font-weight:600; color:var(--ink-3); margin-left:1px; }
.hinge-x .hf-ch{ font-size:10.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:4px 8px; border-radius:999px; background:var(--sunken); color:var(--ink-2); }
.hinge-x .hf-ch.high{ background:var(--good-bg); color:var(--good); } .hinge-x .hf-ch.low{ background:var(--bad-bg); color:var(--bad); } .hinge-x .hf-ch.medium{ background:var(--warn-bg); color:var(--warn); }
.hinge-x .hf-ch.locked-lbl{ text-transform:none; letter-spacing:0; font-weight:700; }
.hinge-x .hf-why{ margin:6px 4px 0; font-size:13px; line-height:1.5; color:var(--ink-2); }
.hinge-x .hf-why.locked{ cursor:pointer; }
.hinge-x .hf-why.locked i{ color:var(--vio); font-size:11px; }
.hinge-x .hf-fix{ margin:8px 0 0; padding:10px 12px; border-radius:14px; background:linear-gradient(135deg,#f4effe,#fff0f5); border:1px solid #e5d9fb; font-size:13px; line-height:1.5; color:var(--ink); position:relative; }
.hinge-x .hf-fix b{ display:block; font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--vio); margin-bottom:3px; }
.hinge-x .hf-fix.locked{ cursor:pointer; }

/* Prompt kartı (Hinge biçimi) */
.hinge-x .hf-pcard{ background:var(--card); border-radius:22px; padding:16px 18px 16px; box-shadow:var(--sh-2); position:relative; }
.hinge-x .hf-pq{ font-size:11.5px; font-weight:700; color:var(--ink-3); text-transform:uppercase; letter-spacing:.05em; line-height:1.3; }
.hinge-x .hf-pa{ font-family:var(--serif); font-size:21px; line-height:1.28; margin-top:8px; color:var(--ink); letter-spacing:-.01em; }
.hinge-x .hf-pcard.after{ background:linear-gradient(135deg,#f6f1ff,#fff0f5); border:1px solid #e5d9fb; box-shadow:none; }
.hinge-x .hf-after{ margin-top:10px; position:relative; border-radius:22px; }
.hinge-x .hf-after-lbl{ font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--vio); margin:0 4px 6px; display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.hinge-x .hf-after-lbl em{ font-style:normal; text-transform:none; letter-spacing:0; color:var(--ink-2); font-weight:600; }
.hinge-x .hf-after.locked{ cursor:pointer; }
.hinge-x .hf-after.locked .hf-pa, .hinge-x .hf-after.locked .hf-bubble .txt{ filter:blur(6px); user-select:none; }
.hinge-x .hf-after-lk{ position:absolute; left:0; right:0; top:34px; bottom:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; text-align:center; padding:10px 20px; pointer-events:none; }
.hinge-x .hf-after-lk b{ font-size:14px; font-weight:800; color:var(--ink); background:rgba(255,255,255,.85); padding:4px 10px; border-radius:999px; }
.hinge-x .hf-after-lk small{ font-size:11px; color:var(--vio); font-weight:700; }
.hinge-x .hf-after-lk i{ font-size:16px; color:var(--vio); }

/* --------------------------------------------------------------- Hinge bildirimi */
.hinge-x .hf-notif{ margin:-14px 10px 0; position:relative; z-index:2; background:var(--card); border-radius:18px; padding:12px 14px 12px; box-shadow:var(--sh-3); border:1px solid var(--line); transform:translateY(8px) scale(.98); opacity:0; transition:transform .6s var(--ease), opacity .6s var(--ease); }
.hinge-x .hf-notif.pop{ transform:none; opacity:1; }
.hinge-x .hf-card.magnet .hf-photo-wrap{ box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--rose), var(--sh-3); }
.hinge-x .hf-card.magnet .hf-pcard:not(.after){ box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--rose), var(--sh-3); }
.hinge-x .hf-notif-top{ display:flex; align-items:center; gap:8px; }
.hinge-x .hf-heart{ width:28px; height:28px; border-radius:50%; background:var(--rose); color:#fff; display:grid; place-items:center; font-size:12px; animation:hfBeat 1.6s ease-in-out infinite; }
@keyframes hfBeat{ 0%,100%{ transform:scale(1);} 20%{ transform:scale(1.18);} 40%{ transform:scale(1);} }
.hinge-x .hf-notif-t{ font-size:13.5px; font-weight:800; }
.hinge-x .hf-notif-now{ margin-left:auto; font-size:11px; color:var(--ink-3); font-weight:600; }
.hinge-x .hf-notif-sub{ font-size:11px; color:var(--ink-3); margin-top:7px; }
.hinge-x .hf-bubble{ position:relative; margin-top:9px; background:var(--vio-soft); border:1px solid #ddd2fb; color:var(--ink); border-radius:16px 16px 16px 4px; padding:9px 12px; font-size:13.5px; line-height:1.45; }
.hinge-x .hf-bubble.small{ margin-top:8px; font-size:13px; }
.hinge-x .hf-bubble.locked{ cursor:pointer; }
.hinge-x .hf-bubble.locked .txt{ filter:blur(6px); user-select:none; display:block; }
.hinge-x .hf-bubble .lk{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:6px; font-size:12px; font-weight:800; color:var(--vio); }
.hinge-x .hf-bubble.them{ background:var(--sunken); border-color:var(--line-2); }
.hinge-x .hf-bubble.me{ background:var(--coal); color:#fff; border-color:var(--coal); border-radius:16px 16px 4px 16px; margin-left:26px; }
.hinge-x .hf-bubble .txt.blur{ filter:blur(6px); user-select:none; display:block; }

/* --------------------------------------------------------------- bölümler */
.hinge-x .hf-sec{ margin-top:22px; }
.hinge-x .hf-sec-h{ display:flex; align-items:center; gap:8px; font-size:15px; font-weight:800; letter-spacing:-.02em; padding:0 2px 10px; }
.hinge-x .hf-sec-h i{ color:var(--vio); font-size:13px; }
.hinge-x .hf-sec-h small{ margin-left:auto; font-size:11px; font-weight:600; color:var(--ink-3); }
.hinge-x .hf-sub-h{ font-size:12px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-3); margin:16px 2px 8px; }

.hinge-x .hf-drawer{ position:relative; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:14px 14px 12px; box-shadow:var(--sh-2); display:flex; flex-direction:column; }
.hinge-x .hf-drawer .hf-bubble{ margin-top:8px; }
.hinge-x .hf-drawer .hf-bubble:first-child{ margin-top:0; }
.hinge-x .hf-drawer.locked{ cursor:pointer; }
.hinge-x .hf-drawer-lk{ margin-top:10px; padding-top:10px; border-top:1px solid var(--line); display:flex; flex-direction:column; align-items:center; text-align:center; gap:2px; }
.hinge-x .hf-drawer-lk i{ color:var(--vio); }
.hinge-x .hf-drawer-lk b{ font-size:13.5px; font-weight:800; }
.hinge-x .hf-drawer-lk small{ font-size:11.5px; color:var(--ink-3); line-height:1.4; }

.hinge-x .hf-today{ display:flex; gap:12px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:12px; box-shadow:var(--sh-2); }
.hinge-x .hf-today img{ width:58px; height:74px; border-radius:12px; object-fit:cover; flex:none; }
.hinge-x .hf-today .tx{ font-size:13px; line-height:1.45; color:var(--ink-2); min-width:0; }
.hinge-x .hf-today .tx b{ display:block; font-size:14px; color:var(--ink); margin-bottom:2px; }
.hinge-x .hf-today.ok .tx b{ color:var(--good); } .hinge-x .hf-today.no .tx b{ color:var(--warn); }
.hinge-x .hf-today .tx small{ display:block; margin-top:4px; font-size:12px; color:var(--vio); font-weight:700; }

.hinge-x .hf-rows{ display:flex; flex-direction:column; gap:8px; }
.hinge-x .hf-row{ position:relative; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:11px 13px; display:flex; gap:11px; align-items:flex-start; box-shadow:var(--sh-1); }
.hinge-x .hf-row .ic{ width:32px; height:32px; border-radius:10px; display:grid; place-items:center; flex:none; font-size:13px; background:var(--vio-soft); color:var(--vio); }
.hinge-x .hf-row .tx{ flex:1; min-width:0; font-size:13px; line-height:1.5; color:var(--ink-2); }
.hinge-x .hf-row .tx b{ display:block; color:var(--ink); margin-bottom:2px; }
.hinge-x .hf-row.locked{ cursor:pointer; }
.hinge-x .hf-row .lk{ font-size:11px; color:var(--vio); }

.hinge-x .hf-score{ display:flex; gap:14px; align-items:center; background:var(--coal); color:#fff; border-radius:20px; padding:14px; }
.hinge-x .hf-ring{ position:relative; width:74px; height:74px; flex:none; }
.hinge-x .hf-ring svg{ width:74px; height:74px; transform:rotate(-90deg); }
.hinge-x .hf-ring circle{ fill:none; stroke-width:8; }
.hinge-x .hf-ring .bg{ stroke:rgba(255,255,255,.12); }
.hinge-x .hf-ring .fg{ stroke:url(#hxGrad); stroke-linecap:round; stroke-dasharray:276; stroke-dashoffset:276; transition:stroke-dashoffset 1.3s var(--ease); }
.hinge-x .hf-ring .n{ position:absolute; inset:0; display:grid; place-items:center; font-size:22px; font-weight:800; letter-spacing:-.03em; }
.hinge-x .hf-score .tx{ font-size:13px; line-height:1.5; color:rgba(255,255,255,.82); min-width:0; }
.hinge-x .hf-score .tx b{ display:block; color:#fff; font-size:13.5px; margin-bottom:3px; }
.hinge-x .hf-sumlock{ display:inline-flex; align-items:center; gap:5px; padding:1px 8px; border-radius:999px; background:rgba(255,255,255,.12); color:#ffb0c8; font-size:12px; font-weight:700; cursor:pointer; }

.hinge-x .hf-list{ background:var(--card); border:1px solid var(--line); border-radius:18px; padding:2px 12px; box-shadow:var(--sh-1); }
.hinge-x .hf-li{ display:flex; gap:10px; padding:10px 0; border-top:1px solid var(--line); align-items:flex-start; }
.hinge-x .hf-li:first-child{ border-top:0; }
.hinge-x .hf-li .n{ width:22px; height:22px; border-radius:7px; font-size:11px; font-weight:800; display:grid; place-items:center; flex:none; background:var(--sunken); color:var(--ink-2); }
.hinge-x .hf-li.crit .n{ background:var(--bad-bg); color:var(--bad); }
.hinge-x .hf-li .tx{ flex:1; min-width:0; font-size:13px; line-height:1.5; }
.hinge-x .hf-li .tx small{ display:block; font-size:12px; color:var(--ink-3); margin-top:2px; }
.hinge-x .hf-li .tx small i{ color:var(--vio); }
.hinge-x .hf-li.peek{ cursor:pointer; color:var(--ink-2); }
.hinge-x .hf-li .lk{ font-size:11px; color:var(--vio); }
.hinge-x .hf-list-cta{ padding:10px 0 8px; font-size:12px; font-weight:800; color:var(--vio); display:flex; align-items:center; gap:6px; cursor:pointer; border-top:1px solid var(--line); }

/* --------------------------------------------------------------- CTA */
.hinge-x .hf-cta{ margin-top:18px; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:14px; box-shadow:var(--sh-2); }
.hinge-x .hf-cta-h{ display:flex; align-items:center; gap:8px; font-size:13px; font-weight:800; }
.hinge-x .hf-cta-h i{ color:var(--vio); }
.hinge-x .hf-cta-h b{ margin-left:auto; background:var(--coal); color:#fff; font-size:11px; padding:2px 9px; border-radius:999px; }
.hinge-x .hf-cta ul{ margin:10px 0 12px; padding:0 0 0 18px; font-size:13px; color:var(--ink-2); line-height:1.6; }
.hinge-x .hx-cta-btn{ width:100%; border:0; border-radius:16px; padding:15px 16px; background:var(--grad); color:#fff; font-size:15px; font-weight:800; cursor:pointer; box-shadow:0 12px 30px -12px rgba(120,60,240,.7); font-family:inherit; display:flex; align-items:center; justify-content:center; gap:8px; }
.hinge-x .hx-cta-note{ text-align:center; font-size:11.5px; color:var(--ink-3); margin-top:8px; }
.hinge-x .hx-copy{ margin-top:10px; display:inline-flex; align-items:center; gap:6px; border:0; background:var(--coal); color:#fff; font-size:12px; font-weight:700; padding:8px 12px; border-radius:10px; cursor:pointer; font-family:inherit; }
.hinge-x .hx-copy.ok{ background:var(--good); }
.hinge-x .hx-share{ display:flex; gap:8px; }
.hinge-x .hx-share button{ flex:1; border:1px solid var(--line-2); background:var(--card); border-radius:14px; padding:12px; font-size:13px; font-weight:700; color:var(--ink); cursor:pointer; font-family:inherit; display:flex; align-items:center; justify-content:center; gap:8px; }

/* Sabit alt buton (Tinder/Bumble sınıflarını paylaşır) */
.hx-sticky .tr-sticky-btn { pointer-events: auto; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 16px 20px; border: 0; border-radius: 22px; color: #fff; font-family: var(--rs-font, 'Poppins', system-ui, sans-serif); font-size: 16px; font-weight: 600; cursor: pointer; box-shadow: 0 12px 26px -12px rgba(109,61,245,.9); background:linear-gradient(96deg,#5b2be0,#a63bf0 52%,#ff5d8f) !important; }
.hx-sticky .tr-sticky-btn span { white-space: normal; line-height: 1.2; text-align: center; }
.hx-sticky .tr-sticky-btn i { font-size: 14px; }
.hx-sticky .tr-sticky-note { text-align: center; font-size: 11px; margin-top: 6px; letter-spacing: .2px; pointer-events: none; color: #6b6885; font-weight: 500; }
.hx-sticky .tr-cta-prog { max-width: 430px; margin: 0 auto 8px; pointer-events: none; }
.hx-sticky .tr-cta-prog-bar { height: 4px; border-radius: 99px; overflow: hidden; background: repeating-linear-gradient(135deg, rgba(120,110,160,.22) 0 6px, rgba(120,110,160,.10) 6px 12px); }
.hx-sticky .tr-cta-prog-bar > i { display: block; height: 100%; border-radius: 99px; background:linear-gradient(90deg,#6d3df5,#ff5d8f) !important; }
.hx-sticky .tr-cta-prog-txt { text-align: center; font-size: 11px; font-weight: 600; color: #6b6885; margin-top: 6px; }
#result-screen .scroll-area > .hx-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; padding: 16px 16px calc(14px + env(safe-area-inset-bottom)); background: linear-gradient(180deg, rgba(244,242,249,0) 0%, rgba(244,242,249,.96) 28%, #f4f2f9 100%); will-change: transform; transform: translateZ(0); }
#result-screen .scroll-area:has(.hx-sticky) .hinge-x { padding-bottom: 150px !important; }
@media (max-width: 430px) { .hx-sticky .tr-sticky-btn { font-size: 15px; padding: 14px 16px; gap: 8px; } }

/* --------------------------------------------------------------- foto modalı */
.hx-modal{ position:fixed; inset:0; z-index:999999; display:none; align-items:flex-end; justify-content:center; background:rgba(23,18,46,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.hx-modal.on{ display:flex; }
.hx-modal-in{ width:min(500px,100%); max-height:88vh; overflow:auto; background:#fff; border-radius:22px 22px 0 0; padding:14px 16px 24px; color:#17122e; font-size:14px; line-height:1.55; box-shadow:0 -10px 40px rgba(0,0,0,.25); }
@media (min-width:600px){ .hx-modal{ align-items:center; } .hx-modal-in{ border-radius:22px; } }
.hx-modal-in .hx-m-top{ display:flex; align-items:center; gap:10px; }
.hx-modal-in .hx-m-top .t{ font-weight:800; font-size:15px; flex:1; }
.hx-modal-in .hx-m-x{ border:0; background:#f0edf8; width:32px; height:32px; border-radius:10px; font-size:16px; cursor:pointer; }
.hx-modal-in .hx-m-img{ width:100%; aspect-ratio:3/4; max-height:44vh; object-fit:cover; border-radius:16px; margin-top:10px; background:#f0edf8; }
.hx-modal-in .hx-m-row{ display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.hx-modal-in .hx-pill{ font-size:10.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:4px 8px; border-radius:999px; background:#efecf7; color:#5b5677; }
.hx-modal-in .hx-pill.keep{ background:#e8f8f2; color:#0f8f6e; } .hx-modal-in .hx-pill.rewrite{ background:#fff6e5; color:#b76e00; } .hx-modal-in .hx-pill.swap{ background:#fdf1f2; color:#c0303f; }
.hx-modal-in .hx-m-blk{ margin-top:12px; }
.hx-modal-in .hx-m-blk b{ display:block; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#8e89a8; margin-bottom:4px; }
.hx-modal-in .hx-m-blk ul{ margin:0; padding-left:18px; color:#5b5677; }
.hx-modal-in .hx-m-fix{ margin-top:12px; padding:11px 12px; border-radius:14px; background:linear-gradient(135deg,#f4effe,#fff0f5); border:1px solid #e5d9fb; }
.hx-modal-in .hx-m-fix b{ display:block; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#6d3df5; margin-bottom:4px; }

/* --------------------------------------------------------------- belirme + performans */
.hinge-x .hx-rv{ opacity:0; transform:translateY(8px); animation:hxIn .55s var(--ease) forwards; }
.hinge-x .hf-feed .hx-rv:nth-child(2){ animation-delay:.06s } .hinge-x .hf-feed .hx-rv:nth-child(3){ animation-delay:.12s } .hinge-x .hf-feed .hx-rv:nth-child(n+4){ animation-delay:.18s }
@keyframes hxIn{ to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .hinge-x .hx-rv{ animation:none; opacity:1; transform:none; } .hinge-x .hf-heart{ animation:none; } }
#result-screen .scroll-area{ -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.hinge-x .hf-photo.locked img, .hinge-x .hf-after.locked .hf-pa, .hinge-x .hf-bubble .txt.blur, .hinge-x .hf-bubble.locked .txt, .hinge-x .hx-peek{ will-change:filter; transform:translateZ(0); backface-visibility:hidden; }
.hinge-x .hf-photo.locked img{ transform:translateZ(0) scale(1.08); }
@media (max-width:380px){ .hinge-x{ padding:4px 12px 34px !important; } .hinge-x .hf-pa{ font-size:19px; } .hinge-x .hf-verdict{ font-size:17px; } }