:root {
  color-scheme: dark;
  --ink:#0B0E14; --ink-2:#121826; --ink-3:#182033; --line:#2A3345; --line-gold:rgba(212,166,74,.35);
  --gold:#D4A64A; --gold-2:#F0C86A; --gold-ink:#241A06; --jade:#2FB47C; --jade-bg:rgba(47,180,124,.12);
  --lacquer:#B4332C; --lacquer-bg:rgba(180,51,44,.14); --amber:#E08A3C; --amber-bg:rgba(224,138,60,.14);
  --parchment:#F1EAD8; --muted:#9AA3B2; --faint:#6B7382; --r:14px; --r-sm:10px; --shadow:0 18px 50px rgba(0,0,0,.45);
}
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; }
body {
  min-width:0; color:var(--parchment); font:15px/1.55 Manrope,system-ui,sans-serif;
  background:
    radial-gradient(circle at 92% 0,rgba(224,138,60,.08),transparent 30rem),
    repeating-linear-gradient(128deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 1px,transparent 9px),var(--ink);
}
button,input,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a { color:var(--gold-2); }
img { display:block; max-width:100%; }
[hidden] { display:none !important; }
:focus-visible { outline:2px solid var(--gold-2); outline-offset:3px; }

.site-top { position:sticky; z-index:30; top:0; border-bottom:1px solid var(--line-gold); background:rgba(11,14,20,.94); backdrop-filter:blur(16px); }
.top-inner { width:min(1160px,100% - 32px); min-height:66px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.brand { display:flex; align-items:center; gap:10px; color:var(--parchment); text-decoration:none; }
.brand img { width:36px; height:36px; object-fit:contain; }
.wordmark,.display { font-family:Cinzel,Georgia,serif; font-weight:700; letter-spacing:.08em; }
.wordmark { font-size:18px; white-space:nowrap; }
.top-actions { display:flex; align-items:center; gap:11px; min-width:0; }
.bell { position:relative; width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--parchment); background:var(--ink-2); text-decoration:none; }
.bell svg { width:20px; }
.bell.shake { animation:bell-shake .55s ease; }
.badge { position:absolute; top:-3px; right:-3px; min-width:20px; height:20px; display:grid; place-items:center; padding:0 5px; border:2px solid var(--ink); border-radius:10px; background:var(--jade); color:#061c13; font-size:10px; font-weight:700; }
.account { display:flex; align-items:center; gap:8px; min-width:0; }
.avatar { width:32px; height:32px; flex:0 0 auto; border:1px solid var(--line-gold); border-radius:50%; object-fit:cover; }
.account-name { max-width:130px; overflow:hidden; color:var(--parchment); font-size:13px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.logout { min-height:44px; padding:0 8px; border:0; color:var(--muted); background:transparent; cursor:pointer; }
.trust-band { min-height:31px; display:flex; align-items:center; justify-content:center; gap:7px; padding:5px 16px; border-bottom:1px solid var(--line-gold); color:#c9b98f; background:#0d111a; font-size:11px; text-align:center; }
.trust-band img { width:16px; height:16px; object-fit:contain; }
.trust-short { display:none; }

.page { width:min(1100px,100% - 32px); margin:0 auto; padding:38px 0 64px; }
.page-narrow { width:min(680px,100% - 32px); }
.page-head { position:relative; min-height:180px; display:flex; align-items:flex-end; margin:-38px calc(50% - 50vw) 30px; padding:42px max(16px,calc((100vw - 1100px)/2)) 28px; overflow:hidden; border-bottom:1px solid var(--line-gold); background:linear-gradient(90deg,rgba(11,14,20,.94),rgba(11,14,20,.78)),url('/img/hero.jpg') center 52%/cover; }
.page-head::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,var(--ink),transparent 55%); pointer-events:none; }
.page-head-content { position:relative; z-index:1; width:100%; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.hero-stats { display:flex; flex-wrap:wrap; gap:7px; margin-top:13px; }
.stat-pill { min-height:27px; display:inline-flex; align-items:center; gap:7px; padding:3px 10px; border:1px solid var(--line-gold); border-radius:999px; color:#d7cfbd; background:rgba(11,14,20,.62); font-size:11px; font-weight:700; backdrop-filter:blur(5px); }
.stat-first::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--jade); box-shadow:0 0 8px rgba(47,180,124,.55); }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:Cinzel,Georgia,serif; }
h1 { margin-bottom:6px; font-size:clamp(28px,4vw,36px); letter-spacing:.03em; }
h2 { margin-bottom:14px; color:var(--parchment); font-size:21px; }
.eyebrow { margin:0 0 7px; color:var(--gold-2); font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.muted { color:var(--muted); }
.section { margin-top:34px; }
.section-title { display:flex; align-items:center; gap:11px; margin-bottom:15px; }
.section-title h2 { margin:0; }
.knot { width:24px; height:24px; color:var(--gold); }
.grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }

.card { position:relative; overflow:hidden; padding:20px; border:1px solid var(--line-gold); border-radius:var(--r); background:linear-gradient(145deg,rgba(24,32,51,.96),rgba(18,24,38,.96)); box-shadow:var(--shadow); }
.card::before,.card::after { content:""; position:absolute; width:10px; height:10px; pointer-events:none; }
.card::before { top:7px; left:7px; border-top:1px solid var(--gold); border-left:1px solid var(--gold); }
.card::after { right:7px; bottom:7px; border-right:1px solid var(--gold); border-bottom:1px solid var(--gold); }
.stagger { animation:fade-up .45s both; animation-delay:calc(var(--i,0) * 60ms); }
.stagger:nth-child(2) { animation-delay:60ms; }
.stagger:nth-child(3) { animation-delay:120ms; }
.stagger:nth-child(4) { animation-delay:180ms; }
.stagger:nth-child(5) { animation-delay:240ms; }
.stagger:nth-child(n+6) { animation-delay:300ms; }
.empty { padding:26px; border:1px dashed var(--line); border-radius:var(--r); color:var(--muted); text-align:center; }
.request-card { display:flex; flex-direction:column; gap:14px; min-width:0; }
.request-top { display:flex; align-items:flex-start; gap:12px; }
.request-top .avatar { width:42px; height:42px; }
.request-copy { flex:1; min-width:0; }
.request-heading { display:flex; align-items:flex-start; flex-wrap:wrap; gap:7px; }
.request-title { overflow-wrap:anywhere; margin:0 0 2px; color:var(--parchment); font-weight:700; }
.opener-chip { display:inline-flex; align-items:center; min-height:20px; padding:1px 7px; border:1px solid var(--line-gold); border-radius:999px; color:var(--gold-2); background:rgba(212,166,74,.08); font-size:9px; font-weight:700; }
.money-text { color:var(--gold-2); font:700 23px Cinzel,Georgia,serif; }
.pair { color:var(--muted); font-size:12px; }
.request-bottom { display:grid; grid-template-columns:auto 1fr auto; align-items:end; gap:10px; margin-top:auto; }
.request-bottom .btn { justify-self:end; }
.request-age { grid-column:3; justify-self:end; color:var(--faint); font-size:10px; white-space:nowrap; }
.request-bottom .btn + .request-age { grid-row:2; }
.chip { display:inline-flex; min-height:27px; align-items:center; padding:3px 9px; border:1px solid currentColor; border-radius:999px; font-size:10px; font-weight:700; }
.chip-bekliyor { color:var(--amber); background:var(--amber-bg); }
.chip-onaylandi { color:var(--jade); background:var(--jade-bg); }
.chip-reddedildi { color:#e37069; background:var(--lacquer-bg); }
.chip-bitti { color:#c4ae75; background:rgba(212,166,74,.09); }

.btn { min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:0 17px; border:1px solid transparent; border-radius:var(--r-sm); font-weight:700; text-decoration:none; cursor:pointer; transition:transform .16s ease,filter .16s ease; }
.btn:hover { transform:translateY(-1px); filter:brightness(1.06); }
.btn-primary { border-color:#f7dc95; color:var(--gold-ink); background:linear-gradient(180deg,var(--gold-2),var(--gold)); box-shadow:inset 0 1px rgba(255,255,255,.45),0 8px 25px rgba(212,166,74,.16); }
.btn-secondary { border-color:var(--line-gold); color:var(--gold-2); background:transparent; }
.btn-danger { border-color:var(--lacquer); color:#ed7a73; background:transparent; }
.btn:disabled { opacity:.46; transform:none; cursor:not-allowed; filter:none; }
.button-row { display:flex; flex-wrap:wrap; gap:9px; }
.reject-box { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }

label { display:grid; gap:7px; color:#d5d9df; font-size:13px; font-weight:700; }
input,textarea { width:100%; min-width:0; border:1px solid var(--line); border-radius:var(--r-sm); outline:0; color:var(--parchment); background:#0d121c; }
input { height:48px; padding:0 13px; }
textarea { min-height:105px; padding:12px 13px; resize:vertical; }
input:focus,textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(212,166,74,.11); }
input::placeholder,textarea::placeholder { color:var(--faint); }
.form-grid { display:grid; gap:17px; }
.form-error { min-height:21px; margin:0; color:#ed7a73; font-size:12px; }
.helper { margin:-2px 0 0; color:var(--muted); font-size:12px; }
.found { color:var(--jade); }
.not-found { color:#ed7a73; }
.role-choices { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.role-choice { min-height:96px; display:flex; align-items:center; gap:12px; padding:13px; border:1px solid var(--line); border-radius:var(--r); color:var(--parchment); background:var(--ink-2); cursor:pointer; }
.role-choice img { width:58px; height:58px; border-radius:50%; object-fit:cover; filter:saturate(.7); }
.role-choice.active { border-color:var(--gold); background:rgba(212,166,74,.1); box-shadow:inset 0 0 0 1px rgba(240,200,106,.18); }
.role-choice.active img { filter:none; }
.role-choice strong { display:block; }
.live-money { min-height:51px; display:flex; align-items:center; padding:0 14px; border:1px solid var(--line-gold); border-radius:var(--r-sm); color:var(--gold-2); background:rgba(212,166,74,.06); font:700 25px Cinzel,Georgia,serif; }
.live-money.placeholder { color:var(--faint); }
.success-card { display:grid; justify-items:center; padding:34px; text-align:center; }
.success-seal { width:72px; margin:0 auto 16px; }

.login-page { min-height:100svh; position:relative; display:flex; align-items:center; justify-content:flex-start; padding:38px max(18px,calc((100vw - 1160px)/2)); background:linear-gradient(90deg,rgba(7,9,13,.93) 0%,rgba(7,9,13,.72) 43%,rgba(7,9,13,.2) 100%),url('/img/hero.jpg') center/cover fixed; }
.login-wrap { width:min(420px,100%); }
.login-card { padding:28px; background:rgba(12,16,24,.92); backdrop-filter:blur(10px); }
.login-brand { display:grid; justify-items:center; margin-bottom:20px; text-align:center; }
.login-brand img { width:96px; height:96px; object-fit:contain; filter:drop-shadow(0 7px 24px rgba(212,166,74,.25)); }
.login-brand .wordmark { margin-top:8px; font-size:27px; }
.tagline { max-width:340px; margin:9px auto 0; color:#d6c9aa; font-size:13px; }
.tabs { display:grid; grid-template-columns:1fr 1fr; margin-bottom:20px; padding:4px; border:1px solid var(--line); border-radius:12px; background:var(--ink); }
.tab { min-height:42px; border:0; border-radius:9px; color:var(--muted); background:transparent; font-weight:700; cursor:pointer; }
.tab.active { color:var(--gold-ink); background:linear-gradient(180deg,var(--gold-2),var(--gold)); }
.tiny-trust { display:grid; gap:7px; margin:21px 0 0; padding:16px 2px 0; border-top:1px solid rgba(212,166,74,.18); color:var(--parchment); font-size:14px; }
.tiny-trust span::before { content:"✓"; margin-right:7px; color:var(--jade); font-weight:700; }

.notification-list { display:grid; gap:12px; }
.notification { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:13px; align-items:center; color:inherit; text-decoration:none; }
.notification.unread { border-left:4px solid var(--jade); }
.notification-icon { width:42px; height:42px; display:grid; place-items:center; border:1px solid var(--line-gold); border-radius:50%; color:var(--gold-2); background:#0f1520; font-size:19px; }
.notification-title { margin:0 0 2px; font-weight:700; }
.notification-copy { margin:0; color:var(--muted); font-size:12px; overflow-wrap:anywhere; }
.notification-time { color:var(--faint); font-size:10px; }

.room-page { width:min(560px,100%); margin:0 auto; padding:22px 0 35px; }
.room-shell { min-height:calc(100svh - 145px); display:grid; grid-template-rows:auto auto auto minmax(220px,1fr) auto auto; overflow:hidden; border:1px solid var(--line-gold); border-radius:24px; background:rgba(13,18,28,.96); box-shadow:var(--shadow); }
.room-head { padding:17px; border-bottom:1px solid var(--line); }
.room-people { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.room-person { min-width:0; display:grid; justify-items:center; gap:4px; color:var(--muted); font-size:9px; text-align:center; }
.room-person img { width:40px; height:40px; border:1px solid var(--line-gold); border-radius:50%; object-fit:cover; }
.room-person strong { max-width:110px; overflow:hidden; color:var(--parchment); text-overflow:ellipsis; white-space:nowrap; }
.room-arrow { color:var(--gold); }
.money-card { margin:14px 16px 0; padding:18px; border:1px solid var(--line-gold); border-radius:var(--r); background:linear-gradient(135deg,var(--jade-bg),rgba(47,180,124,.04)); text-align:center; }
.money-card .money-text { font-size:clamp(32px,8vw,40px); }
.money-state { color:#c9d7d1; font-size:12px; }
.steps-wrap { padding:21px 12px 13px; }
.steps { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.progress-line { position:absolute; z-index:0; top:31px; left:12%; right:12%; height:2px; background:var(--line); }
.progress-fill { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--gold),var(--jade)); transition:width .3s ease; }
.steps.adim-1 .progress-fill { width:33.333%; }
.steps.adim-2 .progress-fill { width:66.666%; }
.steps.adim-3 .progress-fill,.steps.adim-4 .progress-fill { width:100%; }
.step { position:relative; z-index:1; min-width:0; display:grid; justify-items:center; gap:5px; color:var(--faint); font-size:9px; text-align:center; }
.step-icon { width:64px; height:64px; padding:5px; border:2px solid var(--line); border-radius:50%; background:var(--ink-2); object-fit:contain; filter:grayscale(1); opacity:.35; }
.step.done .step-icon,.step.current .step-icon { border-color:var(--gold); filter:none; opacity:1; box-shadow:0 0 0 3px rgba(212,166,74,.11); }
.step.current .step-icon { animation:ring-pulse 1.7s ease-in-out infinite; }
.step.done,.step.current { color:var(--parchment); }
.now-line { margin:10px 0 0; color:var(--muted); text-align:center; font-size:12px; }
.now-line strong { color:var(--gold-2); }
.chat { min-height:220px; overflow-y:auto; padding:8px 14px 15px; border-top:1px solid rgba(42,51,69,.55); scrollbar-color:var(--line) transparent; }
.message { display:flex; align-items:flex-end; gap:7px; margin:9px 0; }
.message.mine { flex-direction:row-reverse; }
.chat-avatar { width:28px; height:28px; flex:0 0 auto; border-radius:50%; object-fit:cover; }
.bubble { max-width:78%; padding:8px 11px 9px; border-radius:14px 14px 14px 4px; color:#e7ebf0; background:var(--ink-3); overflow-wrap:anywhere; }
.mine .bubble { border:1px solid rgba(212,166,74,.25); border-radius:14px 14px 4px 14px; background:rgba(212,166,74,.16); }
.bubble-meta { display:flex; gap:6px; align-items:center; margin-bottom:2px; color:var(--muted); font-size:9px; }
.araci-tag { padding:0 5px; border:1px solid var(--line-gold); border-radius:999px; color:var(--gold-2); }
.bubble-text { font-size:13px; white-space:pre-wrap; }
.system-line { width:fit-content; max-width:92%; margin:9px auto; padding:4px 9px; border-radius:7px; color:var(--muted); background:rgba(154,163,178,.06); font-size:10px; font-style:italic; text-align:center; overflow-wrap:anywhere; }
.system-line.uyari { color:#f0b779; background:var(--amber-bg); }
.system-line.sorun { color:#eb8a84; background:var(--lacquer-bg); }
.composer { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; padding:10px 14px; border-top:1px solid var(--line); background:var(--ink-2); }
.composer input { height:44px; }
.composer .btn { min-height:44px; padding-inline:14px; }
.room-actions { padding:0 14px 14px; background:var(--ink-2); }
.main-action { width:100%; min-height:55px; font-size:16px; }
.problem-link { width:100%; min-height:44px; border:0; color:#c57c77; background:transparent; text-decoration:underline; cursor:pointer; }
.watching { display:block; width:max-content; margin:0 auto 8px; }

.toasts { position:fixed; z-index:60; right:18px; bottom:18px; width:min(350px,calc(100% - 36px)); display:grid; gap:10px; }
.toast { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:14px; border:1px solid var(--line-gold); border-radius:var(--r); background:#161e2d; box-shadow:var(--shadow); animation:fade-up .25s both; }
.toast strong { display:block; font-size:13px; }
.toast span { color:var(--muted); font-size:11px; }
.toast .btn { min-height:40px; padding-inline:13px; }
.dark-404 { min-height:100svh; display:grid; place-items:center; padding:24px; text-align:center; }
.dark-404 img { width:92px; margin:0 auto 17px; }

@keyframes fade-up { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@keyframes ring-pulse { 50% { box-shadow:0 0 0 8px rgba(212,166,74,.04),0 0 24px rgba(240,200,106,.34); } }
@keyframes bell-shake { 20%,60% { transform:rotate(-15deg); } 40%,80% { transform:rotate(15deg); } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition:none !important; } }
@media (max-width:820px) { .grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) {
  .top-inner { width:calc(100% - 20px); min-height:60px; gap:7px; }
  .wordmark { font-size:14px; }
  .account-name { display:none; }
  .logout { padding-inline:3px; font-size:11px; }
  .page { width:calc(100% - 24px); padding-top:25px; }
  .page-head { min-height:150px; margin-top:-25px; padding-inline:16px; background-image:linear-gradient(90deg,rgba(11,14,20,.94),rgba(11,14,20,.68)),url('/img/hero-m.jpg'); }
  .page-head-content { align-items:flex-start; flex-direction:column; }
  .grid { grid-template-columns:1fr; }
  .role-choices { grid-template-columns:1fr; }
  .login-page { align-items:center; padding-block:22px; background-image:linear-gradient(180deg,rgba(7,9,13,.75),rgba(7,9,13,.96)),url('/img/hero-m.jpg'); background-attachment:scroll; }
  .login-card { padding:22px 18px; }
  .login-brand img { width:80px; height:80px; }
  .notification { grid-template-columns:auto minmax(0,1fr); }
  .notification-time { grid-column:2; }
  .room-page { padding:0; }
  .room-shell { min-height:calc(100svh - 92px); border-inline:0; border-radius:0; }
  .step-icon { width:48px; height:48px; }
  .progress-line { top:23px; }
  .room-person strong { max-width:82px; }
}
@media (max-width:480px) {
  .trust-band { white-space:nowrap; }
  .trust-long { display:none; }
  .trust-short { display:inline; }
}
@media (max-width:370px) {
  .trust-band { font-size:9px; }
  .brand img { width:31px; height:31px; }
  .bell { width:42px; height:42px; }
  .card { padding:17px; }
  .room-head,.steps-wrap,.chat,.composer,.room-actions { padding-inline:10px; }
  .money-card { margin-inline:10px; }
}