/* ═══ v6: Semt modu — lobi ekleri + oyun ekranı + telefon düzeni ═══
   Lobi iskeleti menu-lobby.css'ten gelir (#screen-semt dahil). Önceki hâl: git tag semt-v1. */

#screen-semt {
  --sm-surface: rgba(12, 12, 14, .86);
  --sm-line: rgba(255,255,255,.09);
  --sm-line-2: rgba(255,255,255,.16);
  --sm-dim: rgba(245,245,244,.62);
  --sm-faint: rgba(245,245,244,.42);
  --sm-paper: #f4f1ea;
  --sm-ease: cubic-bezier(.22,1,.36,1);
  --sm-glass:
    linear-gradient(var(--sm-surface), var(--sm-surface)) padding-box,
    linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.05) 45%, rgba(255,255,255,.09)) border-box;
  font-family: 'Inter', system-ui, sans-serif;
}
@keyframes sm-in { from { opacity: 0; transform: translateY(8px) scale(.985); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }

/* ════════ LOBİ: Semt'e özgü parçalar ════════ */
#screen-semt #semt-crest {
  border-radius: 14px !important; border: 1px solid var(--sm-line-2) !important; background: #050505 !important; color: #fff !important;
  box-shadow: 0 16px 40px -12px rgba(255,255,255,.14); font-family: 'Inter', sans-serif;
}
#screen-semt .boss-pick { gap: 8px !important; }
#screen-semt .boss-card {
  border-radius: 14px !important; border: 1px solid var(--sm-line-2) !important; background: #050505 !important; color: #fff !important;
  transition: border-color .25s, background .25s, transform .35s var(--sm-ease) !important;
}
#screen-semt .boss-card:hover { border-color: rgba(255,255,255,.35) !important; transform: translateY(-1px); }
#screen-semt .boss-card b { font-family: 'Inter', sans-serif; font-weight: 600; }
#screen-semt .boss-card small { color: var(--sm-faint) !important; }
#screen-semt .boss-card svg.lucide { color: #fff; }
#screen-semt .boss-card.on { background: #fff !important; color: #000 !important; border-color: #fff !important; }
#screen-semt .boss-card.on small { color: rgba(0,0,0,.55) !important; }
#screen-semt .boss-card.on svg.lucide { color: #000; }
#screen-semt .semt.is-lobby .empire-card input:not([type=color]) {
  height: 42px; border-radius: 10px !important; border: 1px solid var(--sm-line-2) !important; background: #050505 !important; color: #fff !important;
}
#screen-semt .semt.is-lobby .empire-card .btn,
#screen-semt .semt.is-lobby .empire-card button:not(.boss-card):not(.sw) {
  border-radius: 10px; font-family: 'Inter', sans-serif; text-transform: none; letter-spacing: 0;
}
#screen-semt .semt-tips { margin-top: 10px; }
#screen-semt .semt-tips summary { color: var(--sm-dim); font-size: 13px; cursor: pointer; text-transform: none; letter-spacing: 0; }
#screen-semt .semt-tips .chat-log { background: #050505 !important; color: var(--sm-dim) !important; border: 1px solid var(--sm-line) !important; border-radius: 12px; }
#screen-semt .sc-empty { color: var(--sm-faint) !important; font-size: 13px; }
#screen-semt .semt-svg .cell { transition: fill .5s var(--sm-ease), stroke .3s; }

/* ════════ OYUN EKRANI ════════ */
#screen-semt .semt.is-play { background: radial-gradient(ellipse at 50% 40%, #0b0e14 0%, #040507 70%) !important; }
#screen-semt .semt-map { background: transparent !important; }

/* üst çubuk */
#screen-semt .hud-top {
  background: rgba(8,8,10,.72) !important; border-bottom: 1px solid var(--sm-line) !important;
  backdrop-filter: blur(16px) saturate(1.2); -webkit-backdrop-filter: blur(16px) saturate(1.2);
}
#screen-semt .hud-brand .phase-badge { border-radius: 999px !important; border-color: var(--sm-line-2) !important; background: rgba(255,255,255,.05) !important; font-family: 'Inter', sans-serif; font-weight: 600; }
#screen-semt .hud-top .res { border-radius: 12px !important; border: 1px solid var(--sm-line) !important; background: rgba(255,255,255,.035) !important; padding: 0 10px !important; }
#screen-semt .hud-top .res.danger { border-color: rgba(239,68,68,.45) !important; background: rgba(239,68,68,.1) !important; }
#screen-semt .hud-top .res.night { border-color: rgba(147,197,253,.35) !important; background: rgba(59,130,246,.08) !important; }
#screen-semt .hud-actions { border-radius: 14px; border: 1px solid var(--sm-line); background: rgba(255,255,255,.035); padding: 3px; }
#screen-semt .hud-actions .icon-btn { border-radius: 10px !important; border: 0 !important; transition: background .2s; }
#screen-semt .hud-actions .icon-btn:hover { background: rgba(255,255,255,.1) !important; }
#screen-semt .hud-actions .icon-btn.danger:hover { background: rgba(239,68,68,.16) !important; color: #fca5a5 !important; }

/* çeteler listesi */
#screen-semt .semt-gangs {
  border-radius: 18px !important; border: 1px solid transparent !important; background: var(--sm-glass) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 24px 60px -24px rgba(0,0,0,.85); padding: 10px !important;
}
#screen-semt .semt-gangs .g-head b { font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: -.01em; text-transform: none; font-size: 14px; }
#screen-semt .semt-gangs .g-row { border-radius: 12px !important; transition: background .2s; }
#screen-semt .semt-gangs .g-row.me { background: rgba(255,255,255,.07) !important; border: 1px solid var(--sm-line-2) !important; }
#screen-semt .semt-gangs .g-bar { border-radius: 3px; overflow: hidden; }
#screen-semt .semt-gangs .g-bar i { border-radius: 3px; transition: width .6s var(--sm-ease); }

/* yan kart */
#screen-semt #semt-side.sel-card {
  border-radius: 20px !important; border: 1px solid transparent !important; background: var(--sm-glass) !important;
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: 0 30px 80px -24px rgba(0,0,0,.9) !important;
  animation: sm-in .35s var(--sm-ease) both;
}
#screen-semt #semt-side .semt-tabs { border-radius: 12px; padding: 3px; gap: 2px !important; background: rgba(255,255,255,.04); border: 1px solid var(--sm-line); }
#screen-semt #semt-side .semt-tabs .utab { border-radius: 9px !important; border: 0 !important; font-family: 'Inter', sans-serif; font-weight: 600; text-transform: none; letter-spacing: 0; }
#screen-semt #semt-side .semt-tabs .utab.on { background: #fff !important; color: #000 !important; }
#screen-semt #semt-side h3 { font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: -.02em; }
#screen-semt #semt-side .btn { border-radius: 12px !important; font-family: 'Inter', sans-serif; text-transform: none; letter-spacing: 0; }
#screen-semt #semt-side .btn-primary { background: #fff !important; color: #000 !important; border-color: #fff !important; }
#screen-semt #semt-side .btn-primary:disabled { background: rgba(255,255,255,.08) !important; color: var(--sm-faint) !important; border-color: transparent !important; }
#screen-semt #semt-side input[type=range] { accent-color: #fff; }
#screen-semt #semt-side .dcard, #screen-semt #semt-side .intel, #screen-semt #semt-side .route-note { border-radius: 12px !important; }

/* sohbet */
#screen-semt .semt-chat {
  border-radius: 18px !important; border: 1px solid transparent !important; background: var(--sm-glass) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); overflow: hidden; box-shadow: 0 24px 60px -24px rgba(0,0,0,.85);
}
#screen-semt .semt-chat .sc-bar b { font-family: 'Inter', sans-serif; font-weight: 600; text-transform: none; letter-spacing: 0; }
#screen-semt .semt-chat-form input { border-radius: 10px !important; border: 1px solid var(--sm-line-2) !important; background: rgba(0,0,0,.5) !important; font-family: 'Inter', sans-serif; }
#screen-semt .semt-chat-form .send-btn { border-radius: 10px !important; background: #fff !important; color: #000 !important; }
#screen-semt .sc-msg { animation: sm-in .3s var(--sm-ease) both; }

/* olay bandı, ipucu, motor şeridi, elendin bandı */
#screen-semt .semt-event {
  border-radius: 14px !important; border: 1px solid var(--sm-line-2) !important;
  background: rgba(12,12,14,.92) !important; backdrop-filter: blur(12px); box-shadow: 0 18px 50px -18px rgba(0,0,0,.85);
  animation: sm-in .4s var(--sm-ease) both;
}
#screen-semt .semt-tip { border-radius: 999px; padding: 6px 12px; background: rgba(12,12,14,.7); border: 1px solid var(--sm-line); font-family: 'Inter', sans-serif; letter-spacing: .02em; }
#screen-semt .motor-chip { border-radius: 12px !important; border: 1px solid var(--sm-line-2) !important; background: rgba(12,12,14,.88) !important; backdrop-filter: blur(10px); }
#screen-semt .semt-out { border-radius: 14px !important; }

/* geçiş kararı penceresi */
#screen-semt .semt-gate { backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
#screen-semt .semt-gate .sg-card {
  border-radius: 22px !important; border: 1px solid transparent !important; background: var(--sm-glass) !important;
  box-shadow: 0 40px 120px -30px rgba(0,0,0,.95) !important; animation: sm-in .35s var(--sm-ease) both;
}
#screen-semt .sg-card h3 { font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: -.02em; }
#screen-semt .sg-acts .btn, #screen-semt .sg-toll .btn { border-radius: 12px !important; font-family: 'Inter', sans-serif; text-transform: none; letter-spacing: 0; }
#screen-semt .sg-toll input { border-radius: 10px !important; }

/* maç sonu */
#screen-semt .end-veil { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
#screen-semt .end-card.semt-end {
  border-radius: 24px !important; border: 1px solid transparent !important; background: var(--sm-glass) !important; color: #f5f5f4 !important;
  animation: sm-in .5s var(--sm-ease) both;
}
#screen-semt .semt-end h2 { font-family: 'Inter', sans-serif; font-weight: 700; letter-spacing: -.03em; }
#screen-semt .end-rank li { border-radius: 10px; }

/* ════════ TELEFON (≤760px) ════════ */
@media (max-width: 760px) {
  #screen-semt .semt.is-play .hud-top {
    height: auto !important; max-height: none !important; flex-wrap: wrap !important; gap: 6px 8px !important; padding: 6px 8px 8px !important;
  }
  #screen-semt .hud-brand { order: 1; }
  #screen-semt .hud-actions { order: 2; margin-left: auto !important; }
  #screen-semt .hud-top .res-chips {
    order: 3; flex: 1 0 100% !important; display: flex !important; flex-wrap: nowrap !important; gap: 6px !important;
    overflow-x: auto; scrollbar-width: none; justify-content: flex-start !important;
    -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent);
  }
  #screen-semt .hud-top .res-chips::-webkit-scrollbar { display: none; }
  #screen-semt .hud-top .res { flex: none !important; height: 34px; }
  #screen-semt .semt-tip { display: none; }
  #screen-semt .semt-gangs { top: 104px !important; left: 8px !important; width: min(220px, 56vw) !important; max-height: 30vh; overflow: auto; }
  #screen-semt #semt-side.sel-card {
    left: 8px !important; right: 8px !important; width: auto !important; top: auto !important; bottom: 8px !important;
    max-height: 40vh !important; overflow: auto; z-index: 30 !important;
  }
  #screen-semt .semt-chat {
    left: 8px !important; right: auto !important; width: min(280px, calc(100vw - 16px)) !important;
    bottom: calc(40vh + 16px) !important; top: auto !important; z-index: 29 !important;
  }
  #screen-semt .semt-chat:not(.closed) { height: 30vh !important; }
  #screen-semt .motor-strip { bottom: calc(40vh + 16px) !important; left: auto !important; right: 8px !important; max-width: 55vw; flex-wrap: wrap; }
  #screen-semt .semt-event { left: 8px !important; right: 8px !important; width: auto !important; top: 104px !important; transform: none !important; }
  #screen-semt .semt-gate .sg-card { width: calc(100vw - 24px) !important; max-height: 80vh; overflow: auto; }
}

@media (prefers-reduced-motion: reduce) {
  #screen-semt * { animation: none !important; }
}