/* ═══════════════════════════════════════════════════════════════════
   Bobsonm Mafia — Noir Speakeasy
   Уголь · кармин · золото. Поверх существующей вёрстки.
   ═══════════════════════════════════════════════════════════════════ */

html.mafia-ui-v3{
  --noir-gold:#d4a84b;
  --noir-gold-soft:rgba(212,168,75,.22);
  --noir-gold-line:rgba(212,168,75,.38);
  --noir-smoke:rgba(255,236,210,.04);
  --noir-velvet:rgba(20,10,12,.72);
  --noir-card:linear-gradient(165deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.03) 100%);
  --noir-shadow:0 14px 40px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.06);
  --noir-ease:cubic-bezier(0.22,1,0.36,1);
  --noir-spring:cubic-bezier(0.34,1.35,0.64,1);
  --font-display:'Cinzel',Georgia,'Times New Roman',serif;
  --font-ui:'Manrope','Segoe UI',system-ui,sans-serif;
}

/* ── Typography ── */
html.mafia-ui-v3 body{
  font-family:var(--font-ui)!important;
  letter-spacing:.01em;
  color:var(--text)!important;
}

html.mafia-ui-v3 .mafia-brand-text h1,
html.mafia-ui-v3 .header h1,
html.mafia-ui-v3 .hero h2,
html.mafia-ui-v3 .stitle,
html.mafia-ui-v3 .modal-sheet h2,
html.mafia-ui-v3 .ha-title,
html.mafia-ui-v3 .phase-banner{
  font-family:var(--font-display)!important;
}

/* ── Default atmosphere (no custom theme) ── */
html.mafia-ui-v3 body:not([data-app-theme]),
html.mafia-ui-v3 body[data-app-theme=""],
html.mafia-ui-v3 body[data-app-theme="default"]{
  background-color:#09070a!important;
  background-image:
    radial-gradient(ellipse 90% 55% at 50% -15%,rgba(196,60,60,.22),transparent 55%),
    radial-gradient(ellipse 50% 40% at 100% 20%,rgba(212,168,75,.08),transparent 50%),
    radial-gradient(ellipse 60% 50% at 0% 80%,rgba(80,20,24,.2),transparent 55%),
    radial-gradient(ellipse 100% 70% at 50% 120%,rgba(0,0,0,.85),transparent 50%),
    linear-gradient(175deg,#121014 0%,#09070a 42%,#050406 100%)!important;
  background-attachment:fixed!important;
}

html.mafia-ui-v3 body:not([data-app-theme])::before,
html.mafia-ui-v3 body[data-app-theme=""]::before,
html.mafia-ui-v3 body[data-app-theme="default"]::before{
  content:''!important;
  position:fixed!important;inset:-15%!important;z-index:0!important;pointer-events:none!important;
  background:
    radial-gradient(ellipse 45% 40% at 30% 25%,rgba(196,60,60,.12),transparent 65%),
    radial-gradient(ellipse 40% 35% at 75% 15%,rgba(212,168,75,.07),transparent 60%),
    radial-gradient(ellipse 55% 45% at 50% 90%,rgba(40,12,16,.25),transparent 70%)!important;
  animation:noirSmokeDrift 26s var(--noir-ease) infinite alternate!important;
  opacity:.95!important;
}

html.mafia-ui-v3 body:not([data-app-theme])::after,
html.mafia-ui-v3 body[data-app-theme=""]::after,
html.mafia-ui-v3 body[data-app-theme="default"]::after{
  content:''!important;
  position:fixed!important;inset:0!important;z-index:0!important;pointer-events:none!important;
  background:radial-gradient(ellipse 85% 75% at 50% 40%,transparent 30%,rgba(0,0,0,.55) 100%)!important;
  background-image:radial-gradient(ellipse 85% 75% at 50% 40%,transparent 30%,rgba(0,0,0,.55) 100%)!important;
  background-size:auto!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
  opacity:1!important;
}

@keyframes noirSmokeDrift{
  0%{transform:translate(0,0) scale(1);opacity:.85}
  50%{transform:translate(1.2%,-.6%) scale(1.03);opacity:1}
  100%{transform:translate(-.8%,.8%) scale(1.02);opacity:.9}
}

/* Override purple aurora tokens from app_ui on default */
html.mafia-ui-v3 body:not([data-app-theme]),
html.mafia-ui-v3 body[data-app-theme=""],
html.mafia-ui-v3 body[data-app-theme="default"]{
  --ui-border:rgba(212,168,75,.22)!important;
  --ui-border-soft:rgba(255,255,255,.07)!important;
  --ui-glow:0 0 48px rgba(196,60,60,.18)!important;
  --ui-glow-sm:0 0 20px rgba(196,60,60,.14)!important;
  --ui-grad:linear-gradient(135deg,#fff8e8 0%,#e8c872 45%,#c9a227 100%)!important;
  --ui-grad-accent:linear-gradient(135deg,#d94a4a 0%,#a82424 55%,#7a1818 100%)!important;
  --ui-grad-border:linear-gradient(135deg,rgba(212,168,75,.7),rgba(196,60,60,.45),rgba(212,168,75,.35))!important;
  --ui-gold:var(--noir-gold)!important;
}

/* ── Header / brand ── */
html.mafia-ui-v3 .mafia-brand-header,
html.mafia-ui-v3 .header{
  background:linear-gradient(180deg,rgba(12,8,10,.88),rgba(8,6,8,.72))!important;
  backdrop-filter:blur(18px) saturate(1.2)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.2)!important;
  border-bottom:1px solid var(--noir-gold-line)!important;
  box-shadow:0 10px 32px rgba(0,0,0,.4),inset 0 -1px 0 rgba(212,168,75,.12)!important;
}

html.mafia-ui-v3 .mafia-brand-mark{
  border-radius:12px!important;
  border:1px solid var(--noir-gold-line)!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.4),0 6px 18px rgba(196,60,60,.2),inset 0 1px 0 rgba(255,255,255,.12)!important;
  background:#0e0a0c!important;
}

html.mafia-ui-v3 .mafia-brand-text h1,
html.mafia-ui-v3 .header h1{
  font-size:1.12rem!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
  text-transform:none!important;
  background:linear-gradient(135deg,#fff8e8 0%,#e8c872 50%,#b8922e 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  filter:drop-shadow(0 2px 10px rgba(212,168,75,.25))!important;
}

html.mafia-ui-v3 .mafia-brand-tag{
  font-family:var(--font-ui)!important;
  font-size:.58rem!important;
  letter-spacing:.2em!important;
  text-transform:uppercase!important;
  color:rgba(212,168,75,.75)!important;
}

html.mafia-ui-v3 .header-badge{
  background:linear-gradient(135deg,#d94a4a,#8b1e1e)!important;
  border:1px solid rgba(212,168,75,.35)!important;
  box-shadow:0 4px 14px rgba(196,60,60,.35),inset 0 1px 0 rgba(255,255,255,.2)!important;
  letter-spacing:.08em!important;
  opacity:.92;
}

/* ── Hero ── */
html.mafia-ui-v3 .hero{
  border-radius:22px!important;
  padding:26px 18px 22px!important;
  margin-bottom:16px!important;
  border:1px solid var(--noir-gold-line)!important;
  background:
    radial-gradient(ellipse 80% 70% at 50% -20%,rgba(212,168,75,.14),transparent 55%),
    radial-gradient(ellipse 70% 60% at 100% 100%,rgba(196,60,60,.16),transparent 55%),
    linear-gradient(155deg,rgba(28,14,16,.95),rgba(10,8,10,.98))!important;
  box-shadow:var(--noir-shadow),0 0 40px rgba(196,60,60,.12)!important;
  position:relative!important;
  overflow:hidden!important;
  animation:noirHeroIn .7s var(--noir-ease) both!important;
}

html.mafia-ui-v3 .hero::before{
  content:''!important;
  position:absolute!important;inset:0!important;
  background:linear-gradient(120deg,transparent 40%,rgba(212,168,75,.06) 50%,transparent 60%)!important;
  animation:noirSheen 8s var(--noir-ease) infinite!important;
  pointer-events:none!important;
  opacity:1!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
}

html.mafia-ui-v3 .hero-e{
  font-size:2.8rem!important;
  filter:drop-shadow(0 8px 20px rgba(0,0,0,.5))!important;
  animation:noirIconFloat 5.5s var(--noir-ease) infinite!important;
}

html.mafia-ui-v3 .hero h2{
  font-size:1.35rem!important;
  font-weight:700!important;
  letter-spacing:.04em!important;
  margin:10px 0 6px!important;
  color:#f8f0e4!important;
  background:none!important;
  -webkit-text-fill-color:#f8f0e4!important;
}

html.mafia-ui-v3 .hero p{
  color:rgba(232,214,190,.72)!important;
  font-size:.84rem!important;
  max-width:28em;
  margin:0 auto;
  line-height:1.5!important;
}

@keyframes noirHeroIn{
  from{opacity:0;transform:translateY(14px) scale(.985)}
  to{opacity:1;transform:none}
}
@keyframes noirIconFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
@keyframes noirSheen{
  0%{transform:translateX(-30%)}
  100%{transform:translateX(30%)}
}

/* Stats — secondary, quieter */
html.mafia-ui-v3 .stat-grid{
  gap:8px!important;
  margin-bottom:8px!important;
}
html.mafia-ui-v3 .stat-box{
  background:rgba(255,255,255,.04)!important;
  border:1px solid rgba(212,168,75,.15)!important;
  border-radius:14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
/* Цифры — Manrope (lining/tabular), не Cinzel: у антиквы кривые фигуры */
html.mafia-ui-v3 .stat-box .n,
html.mafia-ui-v3 .prof-stat .n,
html.mafia-ui-v3 .host-timer-digits,
html.mafia-ui-v3 .seat-btn .sn,
html.mafia-ui-v3 .gsu-seat-num,
html.mafia-ui-v3 .gsu-roster-seat,
html.mafia-ui-v3 .nc-seat,
html.mafia-ui-v3 .vo-seat,
html.mafia-ui-v3 .best-move-seat-num,
html.mafia-ui-v3 .best-move-counter-pill,
html.mafia-ui-v3 .pr-score-num,
html.mafia-ui-v3 .prof-lb-rank-num,
html.mafia-ui-v3 .clans-lb-pts,
html.mafia-ui-v3 .clans-pts-num,
html.mafia-ui-v3 #clansTapPoints,
html.mafia-ui-v3 .mono-room-code,
html.mafia-ui-v3 .gp-alive-item .seat-num,
html.mafia-ui-v3 .ged-seat-pill{
  font-family:var(--font-ui)!important;
  font-variant-numeric:lining-nums tabular-nums!important;
  font-feature-settings:"lnum" 1,"tnum" 1!important;
  letter-spacing:.02em!important;
}
html.mafia-ui-v3 .stat-box .n{
  color:var(--noir-gold)!important;
  font-size:1.35rem!important;
  font-weight:800!important;
}
html.mafia-ui-v3 .stat-box .l{
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  font-size:.58rem!important;
}

/* ── Cards ── */
html.mafia-ui-v3 .card,
html.mafia-ui-v3 .player-row,
html.mafia-ui-v3 .game-row,
html.mafia-ui-v3 .my-game-card,
html.mafia-ui-v3 .ann-card,
html.mafia-ui-v3 .gsu-card,
html.mafia-ui-v3 .role-card,
html.mafia-ui-v3 .nom-card,
html.mafia-ui-v3 .host-action{
  background:var(--noir-card)!important;
  border:1px solid rgba(212,168,75,.16)!important;
  border-radius:18px!important;
  box-shadow:var(--noir-shadow)!important;
  transition:transform .22s var(--noir-spring),box-shadow .28s var(--noir-ease),border-color .22s!important;
}

html.mafia-ui-v3 .card::before,
html.mafia-ui-v3 .player-row::before,
html.mafia-ui-v3 .game-row::before,
html.mafia-ui-v3 .my-game-card::before,
html.mafia-ui-v3 .ann-card::before,
html.mafia-ui-v3 .gsu-card::before,
html.mafia-ui-v3 .role-card::before{
  background:linear-gradient(135deg,rgba(212,168,75,.55),rgba(196,60,60,.25),rgba(212,168,75,.2))!important;
  opacity:.35!important;
}

html.mafia-ui-v3 .card:active,
html.mafia-ui-v3 .player-row:active,
html.mafia-ui-v3 .game-row:active,
html.mafia-ui-v3 .host-action:active{
  transform:scale(.985)!important;
  border-color:rgba(212,168,75,.4)!important;
  box-shadow:0 8px 28px rgba(0,0,0,.5),0 0 0 1px rgba(196,60,60,.2)!important;
}

html.mafia-ui-v3 .host-action{
  background:linear-gradient(120deg,rgba(255,255,255,.06),rgba(196,60,60,.06))!important;
}

/* ── Section titles ── */
html.mafia-ui-v3 .stitle{
  font-size:.68rem!important;
  letter-spacing:.14em!important;
  color:rgba(212,168,75,.7)!important;
  margin:18px 0 10px!important;
}
html.mafia-ui-v3 .stitle::after{
  height:1px!important;
  background:linear-gradient(90deg,rgba(212,168,75,.45),transparent 85%)!important;
  opacity:1!important;
}

/* ── Buttons ── */
html.mafia-ui-v3 .btn{
  font-family:var(--font-ui)!important;
  font-weight:700!important;
  letter-spacing:.02em!important;
  border-radius:14px!important;
  transition:transform .18s var(--noir-spring),box-shadow .22s,background .22s,border-color .22s!important;
}
html.mafia-ui-v3 .btn:active{
  transform:scale(.96)!important;
}
html.mafia-ui-v3 .btn-primary{
  background:linear-gradient(160deg,#d94a4a 0%,#a01f1f 55%,#6e1414 100%)!important;
  color:#fff!important;
  border:1px solid rgba(212,168,75,.28)!important;
  box-shadow:0 8px 22px rgba(160,31,31,.4),inset 0 1px 0 rgba(255,255,255,.2)!important;
}
html.mafia-ui-v3 .btn-outline{
  background:rgba(255,255,255,.04)!important;
  border:1px solid rgba(212,168,75,.28)!important;
  color:#f2e8d8!important;
}
html.mafia-ui-v3 .btn-danger{
  background:linear-gradient(160deg,#e85d5d,#9b1c1c)!important;
  border:1px solid rgba(255,255,255,.1)!important;
}

/* ── Nav ── */
html.mafia-ui-v3 .bottom-nav{
  background:linear-gradient(180deg,rgba(16,10,12,.9),rgba(8,6,8,.94))!important;
  border:1px solid var(--noir-gold-line)!important;
  box-shadow:0 16px 48px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
  display:flex!important;
  flex-direction:row!important;
}
html.mafia-ui-v3 .nav-item.active,
html.mafia-ui-v3 .nav-item.nav-more-btn[aria-expanded="true"]{
  background:linear-gradient(160deg,#d94a4a,#8b1e1e)!important;
  color:#fff!important;
  box-shadow:0 6px 18px rgba(160,31,31,.45),inset 0 1px 0 rgba(255,255,255,.25)!important;
}
html.mafia-ui-v3 .nav-item.active::after,
html.mafia-ui-v3 .nav-item.active::before{
  display:none!important;
}
html.mafia-ui-v3 .nav-more-panel{
  background:linear-gradient(180deg,#161214,#0c0a0b)!important;
  border-top:1px solid var(--noir-gold-line)!important;
}
html.mafia-ui-v3 .nav-more-collapse{
  border-color:rgba(212,168,75,.28)!important;
  background:rgba(255,255,255,.05)!important;
  color:#f2e8d8!important;
}
html.mafia-ui-v3 .nav-more-item{
  background:rgba(255,255,255,.04)!important;
  border-color:rgba(212,168,75,.2)!important;
}
html.mafia-ui-v3 .nav-more-item.active{
  border-color:rgba(212,168,75,.45)!important;
  background:linear-gradient(160deg,rgba(217,74,74,.35),rgba(139,30,30,.28))!important;
}

html.mafia-ui-v3 .app-shell-top{
  background:linear-gradient(180deg,rgba(12,8,10,.85),rgba(8,6,8,.65))!important;
  border-bottom:1px solid rgba(212,168,75,.18)!important;
  backdrop-filter:blur(16px)!important;
}
html.mafia-ui-v3 .app-shell-top .nav-item.active{
  background:linear-gradient(160deg,#d94a4a,#8b1e1e)!important;
  color:#fff!important;
}

/* ── Pills / tabs ── */
html.mafia-ui-v3 .pill.active,
html.mafia-ui-v3 .ptab.active{
  background:linear-gradient(160deg,#d94a4a,#8b1e1e)!important;
  color:#fff!important;
  border-color:rgba(212,168,75,.3)!important;
  box-shadow:0 4px 14px rgba(160,31,31,.3)!important;
}

/* ── Seats ── */
html.mafia-ui-v3 .seat-btn{
  border:1px solid rgba(212,168,75,.22)!important;
  background:rgba(255,255,255,.04)!important;
  border-radius:12px!important;
  transition:transform .18s var(--noir-spring),border-color .2s,box-shadow .2s!important;
}
html.mafia-ui-v3 .seat-btn:not(.taken):active{
  transform:scale(.94)!important;
  border-color:rgba(212,168,75,.55)!important;
  box-shadow:0 0 0 1px rgba(196,60,60,.35)!important;
}
html.mafia-ui-v3 .seat-btn.taken{
  border-color:rgba(196,60,60,.35)!important;
  background:rgba(196,60,60,.12)!important;
}

/* ── Inputs ── */
html.mafia-ui-v3 .input,
html.mafia-ui-v3 input.input,
html.mafia-ui-v3 select.input,
html.mafia-ui-v3 textarea.input,
html.mafia-ui-v3 .search-box{
  border:1px solid rgba(212,168,75,.2)!important;
  background:rgba(0,0,0,.28)!important;
  border-radius:14px!important;
  color:var(--text)!important;
}
html.mafia-ui-v3 .search-box:focus-within,
html.mafia-ui-v3 .input:focus{
  border-color:rgba(212,168,75,.5)!important;
  box-shadow:0 0 0 3px rgba(196,60,60,.15)!important;
  outline:none!important;
}

/* ── Modals ── */
html.mafia-ui-v3 .modal-overlay{
  background:rgba(0,0,0,.72)!important;
  backdrop-filter:blur(6px)!important;
}
html.mafia-ui-v3 .modal-sheet{
  background:linear-gradient(180deg,#161214,#0c0a0b)!important;
  border:1px solid var(--noir-gold-line)!important;
  box-shadow:0 -20px 60px rgba(0,0,0,.6),0 0 0 1px rgba(196,60,60,.1)!important;
  border-radius:22px 22px 0 0!important;
}
html.mafia-ui-v3 .modal-handle{
  background:rgba(212,168,75,.35)!important;
}
html.mafia-ui-v3 .modal-sheet h2{
  letter-spacing:.04em!important;
  color:#f8f0e4!important;
}

/* ── Phase / game accents ── */
html.mafia-ui-v3 .phase-banner{
  letter-spacing:.06em!important;
  border:1px solid rgba(212,168,75,.25)!important;
}
html.mafia-ui-v3 .empty .ei{
  filter:drop-shadow(0 6px 16px rgba(0,0,0,.4));
}

/* ── Page enter (layered on ui_motion) ── */
html.mafia-ui-v3 .page.active{
  animation:noirPageIn .48s var(--noir-ease) both!important;
}
@keyframes noirPageIn{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}

/* ── Toast ── */
html.mafia-ui-v3 .toast,
html.mafia-ui-v3 .toast-container .toast{
  border:1px solid rgba(212,168,75,.25)!important;
  background:rgba(16,10,12,.94)!important;
  box-shadow:0 12px 36px rgba(0,0,0,.5)!important;
}

/* ── Net bar ── */
html.mafia-ui-v3 #netErrorBar{
  background:rgba(80,16,16,.55)!important;
  border-bottom:1px solid rgba(248,113,113,.4)!important;
}

/* ── Reduce motion ── */
html[data-a11y-motion="reduce"] .hero,
html[data-a11y-motion="reduce"] .hero-e,
html[data-a11y-motion="reduce"] .hero::before,
html[data-a11y-motion="reduce"] body:not([data-app-theme])::before,
html[data-a11y-motion="reduce"] body[data-app-theme="default"]::before,
html[data-a11y-motion="reduce"] .page.active{
  animation:none!important;
}

@media (prefers-reduced-motion:reduce){
  html.mafia-ui-v3 .hero,
  html.mafia-ui-v3 .hero-e,
  html.mafia-ui-v3 .hero::before,
  html.mafia-ui-v3 body:not([data-app-theme])::before,
  html.mafia-ui-v3 body[data-app-theme="default"]::before,
  html.mafia-ui-v3 .page.active{
    animation:none!important;
  }
}