/* ═══════════════════════════════════════════════════════════════════
   MAFIA UI v3 — Ultra Premium Global Design System
   ═══════════════════════════════════════════════════════════════════ */

html.mafia-ui-v3{
  --ui-r:20px;
  --ui-r-sm:14px;
  --ui-r-xs:10px;
  --ui-glass:rgba(255,255,255,.08);
  --ui-glass-2:rgba(255,255,255,.12);
  --ui-glass-3:rgba(255,255,255,.04);
  --ui-border:color-mix(in srgb,var(--accent) 22%,rgba(255,255,255,.12));
  --ui-border-soft:rgba(255,255,255,.08);
  --ui-shadow:0 20px 60px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.04),inset 0 1px 0 rgba(255,255,255,.08);
  --ui-shadow-sm:0 8px 28px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.06);
  --ui-glow:0 0 60px color-mix(in srgb,var(--accent) 28%,transparent);
  --ui-glow-sm:0 0 24px color-mix(in srgb,var(--accent) 20%,transparent);
  --ui-grad:linear-gradient(135deg,#fff 0%,color-mix(in srgb,var(--accent) 35%,#e2e8f0) 100%);
  --ui-grad-accent:linear-gradient(135deg,color-mix(in srgb,var(--accent) 95%,#fff),color-mix(in srgb,var(--accent) 70%,#6366f1) 50%,color-mix(in srgb,var(--accent) 85%,#ec4899));
  --ui-grad-border:linear-gradient(135deg,color-mix(in srgb,var(--accent) 80%,#fff),color-mix(in srgb,#ec4899 60%,var(--accent)),color-mix(in srgb,#60a5fa 50%,var(--accent)),color-mix(in srgb,var(--accent) 80%,#fff));
  --ui-nav-h:3.85rem;
  --ui-ease:cubic-bezier(0.22,1,0.36,1);
  --ui-ease-spring:cubic-bezier(0.34,1.45,0.64,1);
  --ui-ease-silk:cubic-bezier(0.4,0,0.15,1);
  --ui-dur:0.42s;
  --ui-dur-fast:0.26s;
  --ui-gold:#e8c872;
  --ui-gold-soft:rgba(232,200,114,.18);
  --ui-champagne:linear-gradient(135deg,#fff9e8 0%,#f5d78e 38%,#c9a227 72%,#f0e6c8 100%);
}

/* ── Aurora фон (все темы) ── */
html.mafia-ui-v3 body{
  position:relative;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern" 1,"liga" 1;
  background-color:var(--bg)!important;
  background-image:
    radial-gradient(ellipse 120% 80% at 50% -20%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 55%),
    radial-gradient(ellipse 60% 50% at 100% 10%,rgba(236,72,153,.14),transparent 50%),
    radial-gradient(ellipse 55% 45% at 0% 30%,rgba(99,102,241,.16),transparent 48%),
    radial-gradient(ellipse 80% 55% at 50% 110%,rgba(4,2,12,.8),transparent 58%),
    linear-gradient(175deg,var(--bg2) 0%,var(--bg) 45%,#050508 100%)!important;
  background-attachment:fixed!important;
}
html.mafia-ui-v3 body::before{
  content:''!important;position:fixed!important;inset:-20%!important;z-index:0!important;pointer-events:none!important;
  background:
    radial-gradient(circle at 20% 30%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 42%),
    radial-gradient(circle at 80% 20%,rgba(236,72,153,.12),transparent 40%),
    radial-gradient(circle at 60% 80%,rgba(96,165,250,.1),transparent 45%)!important;
  animation:uiAuroraShift 28s var(--ui-ease-silk) infinite alternate!important;
  opacity:1!important;
}
html.mafia-ui-v3 body::after{
  content:''!important;position:fixed!important;inset:0!important;z-index:0!important;pointer-events:none!important;
  background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px)!important;
  background-size:20px 20px!important;
  mask-image:radial-gradient(ellipse 90% 80% at 50% 40%,#000 15%,transparent 75%)!important;
  opacity:.55!important;
}
@keyframes uiAuroraShift{
  0%{transform:translate(0,0) scale(1);opacity:.78}
  33%{transform:translate(1.2%,-.8%) scale(1.02);opacity:.92}
  66%{transform:translate(-.8%,1%) scale(1.015);opacity:.88}
  100%{transform:translate(.5%,-.4%) scale(1.01);opacity:.82}
}

html.mafia-ui-v3 body>.header,
html.mafia-ui-v3 body>.app-shell-top,
html.mafia-ui-v3 body>.page,
html.mafia-ui-v3 body>#netErrorBar,
html.mafia-ui-v3 body>.bottom-nav{
  position:relative;z-index:2;
}

/* ── Layout ── */
html.mafia-ui-v3 .page{
  padding:12px 14px calc(16px + env(safe-area-inset-bottom))!important;
  max-width:480px;margin-left:auto;margin-right:auto;
}

/* ── Header ── */
html.mafia-ui-v3 .mafia-brand-header,
html.mafia-ui-v3 .header{
  background:color-mix(in srgb,var(--bg) 55%,transparent)!important;
  backdrop-filter:saturate(1.6) blur(24px)!important;
  -webkit-backdrop-filter:saturate(1.6) blur(24px)!important;
  border-bottom:1px solid var(--ui-border)!important;
  box-shadow:0 12px 40px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
  padding:calc(10px + env(safe-area-inset-top)) 14px 10px!important;
}
html.mafia-ui-v3 .mafia-brand-mark{
  width:42px!important;height:42px!important;border-radius:14px!important;
  box-shadow:var(--ui-glow-sm),inset 0 1px 0 rgba(255,255,255,.2)!important;
}
html.mafia-ui-v3 .mafia-brand-text h1,
html.mafia-ui-v3 .header h1{
  font-size:1.05rem!important;font-weight:900!important;letter-spacing:.04em!important;
  background:var(--ui-grad)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  filter:drop-shadow(0 2px 12px color-mix(in srgb,var(--accent) 25%,transparent));
}
html.mafia-ui-v3 .mafia-brand-tag{
  font-size:.56rem!important;letter-spacing:.16em!important;
  color:color-mix(in srgb,var(--accent) 50%,var(--hint))!important;
}
html.mafia-ui-v3 .header-badge{
  border-radius:12px!important;padding:6px 12px!important;
  font-weight:800!important;font-size:.62rem!important;letter-spacing:.06em!important;
  background:var(--ui-grad-accent)!important;
  box-shadow:0 6px 20px color-mix(in srgb,var(--accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.25)!important;
  border:1px solid rgba(255,255,255,.15)!important;
}

/* ── Floating Nav Dock ── */
html.mafia-ui-v3 .bottom-nav{
  left:12px!important;right:12px!important;width:auto!important;
  bottom:calc(6px + env(safe-area-inset-bottom))!important;
  border-radius:22px!important;
  background:color-mix(in srgb,var(--bg2) 72%,transparent)!important;
  backdrop-filter:saturate(1.8) blur(28px)!important;
  -webkit-backdrop-filter:saturate(1.8) blur(28px)!important;
  border:1px solid var(--ui-border)!important;
  box-shadow:
    0 20px 56px rgba(0,0,0,.5),
    0 0 0 1px rgba(255,255,255,.05),
    inset 0 1px 0 rgba(255,255,255,.1),
    var(--ui-glow-sm)!important;
  padding:6px 4px!important;
}
html.mafia-ui-v3 body:not([data-app-shell]){padding-bottom:calc(var(--ui-nav-h) + env(safe-area-inset-bottom) + 10px)!important}
html.mafia-ui-v3 .nav-item{
  border-radius:16px!important;padding:6px 2px 7px!important;
  font-weight:800!important;  transition:transform var(--ui-dur-fast) var(--ui-ease-spring),box-shadow var(--ui-dur-fast) var(--ui-ease),background var(--ui-dur-fast) var(--ui-ease)!important;
}
html.mafia-ui-v3 .nav-item:not(.active):active{
  transform:scale(.94)!important;
  transition-duration:.18s!important;
}
html.mafia-ui-v3 .nav-item .ni{
  font-size:20px!important;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.35));
  transition:transform .28s cubic-bezier(.34,1.56,.64,1)!important;
}
html.mafia-ui-v3 .nav-item span:last-child{
  font-size:.52rem!important;font-weight:800!important;letter-spacing:.03em!important;margin-top:1px!important;
}
html.mafia-ui-v3 .nav-item.active{
  background:var(--ui-grad-accent)!important;
  color:#fff!important;
  box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 45%,transparent),inset 0 1px 0 rgba(255,255,255,.3)!important;
  transform:translateY(-2px)!important;
  transition:transform var(--ui-dur-fast) var(--ui-ease-spring),box-shadow var(--ui-dur) var(--ui-ease),background var(--ui-dur) var(--ui-ease)!important;
}
html.mafia-ui-v3 .nav-item.active .ni{
  transform:scale(1.1)!important;
  transition:transform var(--ui-dur) var(--ui-ease-spring)!important;filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}
html.mafia-ui-v3 .nav-item.active::after{display:none!important}
html.mafia-ui-v3 .nav-item.active::before{display:none!important}

html.mafia-ui-v3 .app-shell-top{
  background:color-mix(in srgb,var(--bg) 60%,transparent)!important;
  backdrop-filter:blur(20px)!important;border-bottom:1px solid var(--ui-border)!important;
}
html.mafia-ui-v3 .app-shell-top .nav-item.active{
  background:var(--ui-grad-accent)!important;color:#fff!important;
}

/* ── Gradient-border 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 .pool-builder-role{
  position:relative!important;
  border-radius:var(--ui-r)!important;
  border:none!important;
  background:linear-gradient(168deg,var(--ui-glass-2),var(--ui-glass-3))!important;
  box-shadow:var(--ui-shadow-sm)!important;
  margin-bottom:10px!important;
  overflow:hidden!important;
  transition:transform var(--ui-dur-fast) var(--ui-ease),box-shadow var(--ui-dur) var(--ui-ease),border-color var(--ui-dur-fast)!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{
  content:''!important;position:absolute!important;inset:0!important;border-radius:inherit!important;
  padding:1px!important;pointer-events:none!important;z-index:0!important;
  background:var(--ui-grad-border)!important;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0)!important;
  -webkit-mask-composite:xor!important;mask-composite:exclude!important;
  opacity:.55!important;
  transition:opacity var(--ui-dur) var(--ui-ease)!important;
}
html.mafia-ui-v3 .card:active,
html.mafia-ui-v3 .player-row:active,
html.mafia-ui-v3 .game-row:active{
  transform:scale(.992)!important;
  box-shadow:var(--ui-glow-sm),0 12px 36px rgba(0,0,0,.38)!important;
  transition-duration:.16s!important;
}
html.mafia-ui-v3 .card::after,
html.mafia-ui-v3 .player-row::after{
  content:''!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:50%!important;
  background:linear-gradient(180deg,rgba(255,255,255,.07),transparent)!important;
  pointer-events:none!important;border-radius:var(--ui-r) var(--ui-r) 0 0!important;z-index:0!important;
}
html.mafia-ui-v3 .card{padding:14px!important;position:relative!important;z-index:1}
html.mafia-ui-v3 .card>*{position:relative;z-index:1}
html.mafia-ui-v3 .player-row,
html.mafia-ui-v3 .game-row{padding:12px 14px!important;gap:12px!important;margin-bottom:8px!important}
html.mafia-ui-v3 .player-row:active,
html.mafia-ui-v3 .game-row:active{
  transform:scale(.992)!important;
  box-shadow:var(--ui-glow-sm)!important;
}

/* ── Hero ── */
html.mafia-ui-v3 .hero{
  border-radius:calc(var(--ui-r) + 4px)!important;
  padding:22px 18px!important;margin-bottom:14px!important;
  border:none!important;position:relative!important;overflow:hidden!important;
  background:
    radial-gradient(ellipse 90% 80% at 20% -10%,rgba(255,255,255,.12),transparent 55%),
    radial-gradient(ellipse 70% 60% at 90% 100%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 55%),
    linear-gradient(145deg,color-mix(in srgb,var(--accent) 16%,transparent),color-mix(in srgb,#ec4899 8%,transparent))!important;
  box-shadow:var(--ui-shadow),var(--ui-glow)!important;
}
html.mafia-ui-v3 .hero::before{
  content:''!important;position:absolute!important;inset:0!important;
  background:var(--ui-grad-border)!important;opacity:.25!important;
  mask-image:linear-gradient(180deg,#000,transparent 70%)!important;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%)!important;
}
html.mafia-ui-v3 .hero-e{
  font-size:2.6rem!important;position:relative!important;z-index:1!important;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.4));
  animation:uiHeroFloat 6s var(--ui-ease-silk) infinite!important;
}
@keyframes uiHeroFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-4px) scale(1.02)}}
html.mafia-ui-v3 .hero h2{
  font-size:1.22rem!important;font-weight:900!important;position:relative!important;z-index:1!important;
  background:var(--ui-grad)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;
}
html.mafia-ui-v3 .hero p{position:relative!important;z-index:1!important;font-size:.82rem!important;line-height:1.5!important;color:color-mix(in srgb,var(--text) 75%,var(--hint))!important}

/* ── Stats ── */
html.mafia-ui-v3 .stat-grid{gap:10px!important;margin-bottom:14px!important}
html.mafia-ui-v3 .stat-box{
  padding:14px 10px!important;border-radius:var(--ui-r-sm)!important;
  background:linear-gradient(165deg,color-mix(in srgb,var(--accent) 16%,var(--ui-glass)),var(--ui-glass-3))!important;
  border:1px solid var(--ui-border)!important;box-shadow:var(--ui-shadow-sm)!important;
  position:relative!important;overflow:hidden!important;
}
html.mafia-ui-v3 .stat-box::before{
  content:''!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:3px!important;
  background:var(--ui-grad-accent)!important;opacity:.85!important;
}
html.mafia-ui-v3 .stat-box .n{
  font-size:1.45rem!important;font-weight:900!important;
  background:var(--ui-grad)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;
}
html.mafia-ui-v3 .stat-box .l{font-size:.56rem!important;letter-spacing:.12em!important;font-weight:800!important;text-transform:uppercase!important}

/* ── Section titles ── */
html.mafia-ui-v3 .stitle,
html.mafia-ui-v3 .mafia-lx-section-title{
  font-size:.64rem!important;font-weight:900!important;letter-spacing:.16em!important;
  color:color-mix(in srgb,var(--accent) 65%,var(--hint))!important;
  margin:18px 0 10px!important;
  padding:6px 12px!important;border-radius:999px!important;
  background:color-mix(in srgb,var(--accent) 8%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--accent) 15%,transparent)!important;
  display:inline-flex!important;width:auto!important;max-width:100%!important;
}
html.mafia-ui-v3 .stitle::after{display:none!important}

/* ── Buttons ── */
html.mafia-ui-v3 .btn{
  border-radius:var(--ui-r-sm)!important;font-weight:800!important;min-height:42px!important;
  letter-spacing:.02em!important;font-size:.84rem!important;
  transition:transform var(--ui-dur-fast) var(--ui-ease-spring),box-shadow var(--ui-dur) var(--ui-ease),background var(--ui-dur) var(--ui-ease),border-color var(--ui-dur-fast)!important;
  position:relative;overflow:hidden;
}
html.mafia-ui-v3 .btn-primary::after{
  content:''!important;position:absolute!important;inset:0!important;pointer-events:none!important;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.22) 48%,transparent 66%)!important;
  transform:translateX(-120%)!important;
  transition:transform .65s var(--ui-ease)!important;
}
html.mafia-ui-v3 .btn-primary:active::after{transform:translateX(120%)!important}
html.mafia-ui-v3 .btn-sm{min-height:36px!important;border-radius:var(--ui-r-xs)!important;font-size:.76rem!important}
html.mafia-ui-v3 .btn-primary{
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 88%,#fff),color-mix(in srgb,var(--accent) 72%,#7c3aed) 42%,color-mix(in srgb,var(--accent) 80%,#db2777))!important;
  border:1px solid rgba(255,255,255,.22)!important;
  box-shadow:0 8px 28px color-mix(in srgb,var(--accent) 38%,transparent),inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(0,0,0,.12)!important;
  color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.18)!important;
}
html.mafia-ui-v3 .btn-primary:active{transform:scale(.97)!important;box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 30%,transparent)!important}
html.mafia-ui-v3 .btn-outline{
  background:color-mix(in srgb,var(--ui-glass) 75%,transparent)!important;
  border:1px solid var(--ui-border)!important;backdrop-filter:blur(14px) saturate(1.2)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.2)!important;
}
html.mafia-ui-v3 .btn-outline:active{transform:scale(.98)!important;background:color-mix(in srgb,var(--ui-glass-2) 90%,transparent)!important}
html.mafia-ui-v3 .btn-danger{
  background:linear-gradient(145deg,#fb7185,#e11d48)!important;
  box-shadow:0 10px 28px rgba(225,29,72,.35)!important;border:none!important;
}

/* ── Inputs ── */
html.mafia-ui-v3 .input,
html.mafia-ui-v3 .search-box input,
html.mafia-ui-v3 textarea.input,
html.mafia-ui-v3 select.input{
  border-radius:var(--ui-r-sm)!important;padding:12px 14px!important;font-size:.88rem!important;
  background:color-mix(in srgb,var(--bg) 45%,var(--ui-glass))!important;
  border:1.5px solid var(--ui-border-soft)!important;
  box-shadow:inset 0 2px 8px rgba(0,0,0,.16)!important;
  transition:border-color var(--ui-dur-fast) var(--ui-ease),box-shadow var(--ui-dur) var(--ui-ease),background var(--ui-dur-fast)!important;
}
html.mafia-ui-v3 .input:focus,
html.mafia-ui-v3 .search-box input:focus{
  border-color:color-mix(in srgb,var(--accent) 55%,var(--ui-gold))!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent),0 0 20px color-mix(in srgb,var(--ui-gold) 12%,transparent),inset 0 1px 4px rgba(0,0,0,.08)!important;
}

/* ── Pills / tabs ── */
html.mafia-ui-v3 .pills{gap:10px!important}
html.mafia-ui-v3 .pill,
html.mafia-ui-v3 .ptab{
  font-weight:800!important;padding:9px 16px!important;border-radius:999px!important;
  border:1.5px solid var(--ui-border-soft)!important;
  background:color-mix(in srgb,var(--ui-glass) 70%,transparent)!important;
  transition:transform var(--ui-dur-fast) var(--ui-ease-spring),box-shadow var(--ui-dur) var(--ui-ease),background var(--ui-dur) var(--ui-ease),border-color var(--ui-dur-fast)!important;
}
html.mafia-ui-v3 .pill.active,
html.mafia-ui-v3 .ptab.active{
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 90%,#fff),color-mix(in srgb,var(--accent) 70%,#6366f1))!important;border-color:transparent!important;
  box-shadow:0 6px 20px color-mix(in srgb,var(--accent) 35%,transparent),inset 0 1px 0 rgba(255,255,255,.25)!important;
  color:#fff!important;transform:translateY(-1px)!important;
}
html.mafia-ui-v3 .ptabs{
  border-radius:999px!important;padding:6px!important;
  background:color-mix(in srgb,var(--bg) 50%,var(--ui-glass))!important;
  border:1.5px solid var(--ui-border)!important;
  box-shadow:inset 0 3px 10px rgba(0,0,0,.2)!important;
}

/* ── Players / LB ── */
html.mafia-ui-v3 .pr-rank{
  width:34px!important;height:34px!important;font-weight:900!important;
  box-shadow:0 6px 16px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.25)!important;
}
html.mafia-ui-v3 .pr-rank.r1{background:linear-gradient(145deg,#fef08a,#fbbf24,#b45309)!important;color:#1a1208!important}
html.mafia-ui-v3 .pr-rank.r2{background:linear-gradient(145deg,#f8fafc,#94a3b8,#475569)!important;color:#0f172a!important}
html.mafia-ui-v3 .pr-rank.r3{background:linear-gradient(145deg,#fdba74,#f97316,#9a3412)!important}
html.mafia-ui-v3 .pr-av,
html.mafia-ui-v3 .pr-av-ph{
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent),0 6px 16px rgba(0,0,0,.3)!important;
}
html.mafia-ui-v3 .pr-name{font-weight:900!important;font-size:.92rem!important}
html.mafia-ui-v3 .pr-score-wrap.pr-score--1{
  box-shadow:0 8px 32px rgba(255,185,60,.28),inset 0 1px 0 rgba(255,255,255,.2)!important;
}

/* ── Phases ── */
html.mafia-ui-v3 .phase-banner{
  border-radius:var(--ui-r)!important;padding:16px 18px!important;
  font-weight:900!important;letter-spacing:.06em!important;font-size:.8rem!important;
  text-transform:uppercase!important;
}
html.mafia-ui-v3 .phase-night{
  background:linear-gradient(135deg,rgba(67,56,202,.9),rgba(30,27,75,.95))!important;
  border:1px solid rgba(129,140,248,.4)!important;box-shadow:0 12px 40px rgba(99,102,241,.3)!important;
}
html.mafia-ui-v3 .phase-day{
  background:linear-gradient(135deg,rgba(180,83,9,.85),rgba(69,26,3,.95))!important;
  border:1px solid rgba(251,191,36,.4)!important;box-shadow:0 12px 40px rgba(251,191,36,.2)!important;
}

/* ── Game banner ── */
html.mafia-ui-v3 #gameBanner:not(.hidden) .card,
html.mafia-ui-v3 #gameBanner:not(.hidden)>div{
  border-radius:var(--ui-r)!important;
  box-shadow:var(--ui-shadow),var(--ui-glow)!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 14%,var(--ui-glass)),var(--ui-glass-3))!important;
}

/* ── Modals ── */
html.mafia-ui-v3 .modal-overlay.open{
  background:rgba(2,3,10,.78)!important;backdrop-filter:blur(22px) saturate(1.3)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.3)!important;
  animation:uiModalFadeIn .32s var(--ui-ease) both!important;
}
@keyframes uiModalFadeIn{from{opacity:0}to{opacity:1}}
html.mafia-ui-v3 .modal-sheet{
  border-radius:24px 24px 0 0!important;
  border:1px solid var(--ui-border)!important;
  box-shadow:0 -20px 64px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg2) 94%,#fff 2%),var(--bg))!important;
  animation:uiSheetSlide .4s var(--ui-ease) both!important;
}
@keyframes uiSheetSlide{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* ── Empty / toast ── */
html.mafia-ui-v3 .empty{
  padding:36px 22px!important;border-radius:var(--ui-r)!important;
  background:linear-gradient(165deg,var(--ui-glass),transparent)!important;
  border:2px dashed color-mix(in srgb,var(--accent) 25%,var(--border))!important;
}
html.mafia-ui-v3 .empty .ei{font-size:2.8rem!important;animation:uiHeroFloat 4s ease-in-out infinite!important}
html.mafia-ui-v3 .toast{
  border-radius:16px!important;padding:14px 16px!important;
  box-shadow:0 12px 40px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.1)!important;
  backdrop-filter:blur(20px) saturate(1.25)!important;
  -webkit-backdrop-filter:blur(20px) saturate(1.25)!important;
  border:1px solid rgba(255,255,255,.1)!important;
  animation:uiToastIn .38s var(--ui-ease-spring) both!important;
}
@keyframes uiToastIn{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}

/* ── Profile ── */
html.mafia-ui-v3 .prof-av{
  width:76px!important;height:76px!important;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 35%,transparent),var(--ui-glow)!important;
}
html.mafia-ui-v3 .prof-name{font-size:1.2rem!important;font-weight:900!important}
html.mafia-ui-v3 .prof-lb-rank-wrap{
  border-radius:var(--ui-r)!important;box-shadow:var(--ui-glow)!important;
  border:1px solid var(--ui-border)!important;
}
html.mafia-ui-v3 .prof-lb-rank-num{
  background:var(--ui-grad)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;
}

/* ── Chrome / play hub ── */
html.mafia-ui-v3 .mafia-lx-chrome{
  border-radius:var(--ui-r)!important;border:1px solid var(--ui-border)!important;
  box-shadow:var(--ui-shadow-sm)!important;margin-bottom:18px!important;
}
html.mafia-ui-v3 .mafia-play-hub{
  border-radius:var(--ui-r)!important;padding:14px!important;
  border:1px solid var(--ui-border)!important;box-shadow:var(--ui-shadow-sm)!important;
}
html.mafia-ui-v3 .mafia-play-hub #playSubTabs .btn{
  min-height:48px!important;border-radius:var(--ui-r-sm)!important;font-weight:900!important;
}

/* ── Casino ── */
html.mafia-ui-v3 .casino-wallet{
  border-radius:var(--ui-r)!important;padding:20px!important;
  box-shadow:var(--ui-shadow),0 0 48px rgba(251,191,36,.1)!important;
}
html.mafia-ui-v3 .casino-wallet-amount{font-size:1.65rem!important;font-weight:900!important}

/* ── Clans integration ── */
html.mafia-ui-v3 .clans-hero,
html.mafia-ui-v3 .clans-hero-v2{
  box-shadow:var(--ui-shadow),0 0 40px rgba(251,191,36,.08)!important;
}
html.mafia-ui-v3 .clans-clicker-v2,
html.mafia-ui-v3 .clans-clicker{
  box-shadow:var(--ui-shadow),0 0 48px rgba(251,191,36,.1)!important;
}

/* ── Light theme ── */
html.mafia-ui-v3 body[data-app-theme="light"]{
  background-image:
    radial-gradient(ellipse 100% 60% at 50% -10%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 55%),
    linear-gradient(175deg,#f8fafc,#f1f5f9,#e2e8f0)!important;
}
html.mafia-ui-v3 body[data-app-theme="light"] .card,
html.mafia-ui-v3 body[data-app-theme="light"] .player-row{
  background:linear-gradient(168deg,rgba(255,255,255,.95),rgba(248,250,252,.9))!important;
  box-shadow:0 6px 24px rgba(15,23,42,.08)!important;
}
html.mafia-ui-v3 body[data-app-theme="light"] .bottom-nav{
  background:color-mix(in srgb,#fff 90%,transparent)!important;
  box-shadow:0 16px 48px rgba(15,23,42,.14)!important;
}
html.mafia-ui-v3 body[data-app-theme="light"] .hero h2,
html.mafia-ui-v3 body[data-app-theme="light"] .mafia-brand-text h1{
  -webkit-text-fill-color:initial!important;color:var(--text)!important;background:none!important;
}

/* ── Reduced motion ── */
html[data-a11y-motion="reduce"] html.mafia-ui-v3 body::before,
html[data-a11y-motion="reduce"] html.mafia-ui-v3 .hero-e,
html[data-a11y-motion="reduce"] html.mafia-ui-v3 .empty .ei,
html[data-a11y-motion="reduce"] html.mafia-ui-v3 .modal-overlay.open,
html[data-a11y-motion="reduce"] html.mafia-ui-v3 .modal-sheet,
html[data-a11y-motion="reduce"] html.mafia-ui-v3 .toast{
  animation:none!important;
}

/* ═══════════════════════════════════════════════════════════════════
   Luxury polish — дорогой вид, silk transitions
   ═══════════════════════════════════════════════════════════════════ */

html.mafia-ui-v3 .mafia-brand-header,
html.mafia-ui-v3 .header{
  background:color-mix(in srgb,var(--bg) 48%,transparent)!important;
  backdrop-filter:saturate(1.5) blur(28px)!important;
  -webkit-backdrop-filter:saturate(1.5) blur(28px)!important;
}
html.mafia-ui-v3 .mafia-brand-mark{
  background:linear-gradient(145deg,color-mix(in srgb,var(--bg2) 80%,#1a1028),color-mix(in srgb,var(--accent) 25%,#0a0810))!important;
  border:1px solid color-mix(in srgb,var(--ui-gold) 35%,var(--ui-border))!important;
}
html.mafia-ui-v3 .mafia-brand-text h1,
html.mafia-ui-v3 .header h1{
  background:linear-gradient(135deg,#fff 0%,#f5e6c8 28%,color-mix(in srgb,var(--accent) 45%,#e2e8f0) 100%)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}
html.mafia-ui-v3 .bottom-nav{
  background:color-mix(in srgb,var(--bg2) 65%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--ui-gold) 12%,var(--ui-border))!important;
}
html.mafia-ui-v3 .stat-box .n,
html.mafia-ui-v3 .pr-score-wrap.pr-score--1 .pr-score-num{
  background:var(--ui-champagne)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}
html.mafia-ui-v3 .pr-rank.r1{
  background:linear-gradient(145deg,#fff7d6,#f5d78e,#b8860b)!important;
  box-shadow:0 4px 14px rgba(201,162,39,.35),inset 0 1px 0 rgba(255,255,255,.4)!important;
}
html.mafia-ui-v3 .page.active{
  animation:uiPageLuxuryIn var(--ui-dur) var(--ui-ease) both!important;
}
@keyframes uiPageLuxuryIn{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}
html.mafia-ui-v3 .host-timer-bar{
  border:1px solid color-mix(in srgb,var(--accent) 28%,var(--ui-gold))!important;
  box-shadow:var(--ui-shadow-sm),0 0 24px color-mix(in srgb,var(--accent) 12%,transparent)!important;
}
html.mafia-ui-v3 .host-timer-digits{
  background:var(--ui-champagne)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  filter:drop-shadow(0 2px 8px rgba(201,162,39,.2));
}

/* ═══════════════════════════════════════════════════════════════════
   v6 — Silk Luxury: velvet depth, micro-shine, buttery motion
   ═══════════════════════════════════════════════════════════════════ */

html.mafia-ui-v3{
  --ui-ease-lux:cubic-bezier(0.16,1,0.3,1);
  --ui-ease-silk:cubic-bezier(0.25,0.46,0.45,0.94);
  --ui-ease-bounce:cubic-bezier(0.34,1.25,0.64,1);
  --ui-dur:0.52s;
  --ui-dur-fast:0.32s;
  --ui-velvet:linear-gradient(168deg,rgba(255,255,255,.11) 0%,rgba(255,255,255,.04) 38%,rgba(255,255,255,.01) 100%);
  --ui-velvet-deep:linear-gradient(175deg,rgba(18,14,28,.92) 0%,rgba(8,6,14,.97) 100%);
  --ui-gold-line:linear-gradient(90deg,transparent,color-mix(in srgb,var(--ui-gold) 70%,#fff),transparent);
  --ui-shadow-lux:
    0 1px 0 rgba(255,255,255,.08) inset,
    0 24px 64px rgba(0,0,0,.42),
    0 8px 24px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,255,255,.04);
}

/* Тонкая зернистость — «киношная» глубина */
html.mafia-ui-v3 body::after{
  background-image:
    url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E"),
    radial-gradient(rgba(255,255,255,.035) 1px,transparent 1px)!important;
  background-size:180px 180px,20px 20px!important;
  opacity:.42!important;
  mix-blend-mode:overlay!important;
}

html.mafia-ui-v3 body{
  background-image:
    radial-gradient(ellipse 130% 90% at 50% -25%,color-mix(in srgb,var(--accent) 22%,transparent),transparent 58%),
    radial-gradient(ellipse 55% 42% at 100% 8%,rgba(236,72,153,.1),transparent 52%),
    radial-gradient(ellipse 50% 40% at 0% 28%,rgba(99,102,241,.12),transparent 50%),
    radial-gradient(ellipse 90% 60% at 50% 115%,rgba(2,1,8,.85),transparent 62%),
    linear-gradient(178deg,var(--bg2) 0%,var(--bg) 42%,#030308 100%)!important;
}

/* Карточки — бархат + мягкий блик */
html.mafia-ui-v3 .card,
html.mafia-ui-v3 .player-row,
html.mafia-ui-v3 .game-row,
html.mafia-ui-v3 .my-game-card{
  background:
    var(--ui-velvet),
    linear-gradient(168deg,var(--ui-glass-2),var(--ui-glass-3))!important;
  box-shadow:var(--ui-shadow-lux)!important;
  transition:
    transform var(--ui-dur-fast) var(--ui-ease-bounce),
    box-shadow var(--ui-dur) var(--ui-ease-lux),
    filter var(--ui-dur) var(--ui-ease-silk)!important;
}
html.mafia-ui-v3 .card::after,
html.mafia-ui-v3 .player-row::after{
  background:linear-gradient(180deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.02) 40%,transparent 100%)!important;
  animation:uiCardSheen 8s var(--ui-ease-silk) infinite!important;
}
@keyframes uiCardSheen{
  0%,100%{opacity:.55}
  50%{opacity:.85}
}

/* Кнопки — шёлковый блеск при нажатии */
html.mafia-ui-v3 .btn{
  transition:
    transform var(--ui-dur-fast) var(--ui-ease-bounce),
    box-shadow var(--ui-dur) var(--ui-ease-lux),
    background var(--ui-dur) var(--ui-ease-silk),
    filter var(--ui-dur-fast) var(--ui-ease-silk)!important;
}
html.mafia-ui-v3 .btn-primary{
  background:linear-gradient(
    148deg,
    color-mix(in srgb,var(--accent) 92%,#fff) 0%,
    color-mix(in srgb,var(--accent) 78%,#7c3aed) 38%,
    color-mix(in srgb,var(--accent) 82%,#db2777) 72%,
    color-mix(in srgb,var(--accent) 88%,#6366f1) 100%
  )!important;
  box-shadow:
    0 10px 32px color-mix(in srgb,var(--accent) 32%,transparent),
    0 2px 0 rgba(255,255,255,.18) inset,
    0 -2px 0 rgba(0,0,0,.12) inset!important;
}
html.mafia-ui-v3 .btn-primary:active{
  transform:scale(.975)!important;
  filter:brightness(1.04)!important;
  transition-duration:.14s!important;
}

/* Навигация — плавающий док с золотой кромкой */
html.mafia-ui-v3 .bottom-nav{
  backdrop-filter:saturate(1.9) blur(32px)!important;
  -webkit-backdrop-filter:saturate(1.9) blur(32px)!important;
  box-shadow:
    0 24px 64px rgba(0,0,0,.52),
    0 0 0 1px rgba(255,255,255,.06),
    0 0 48px color-mix(in srgb,var(--accent) 8%,transparent),
    inset 0 1px 0 rgba(255,255,255,.12)!important;
  transition:box-shadow var(--ui-dur) var(--ui-ease-lux),transform var(--ui-dur-fast) var(--ui-ease-silk)!important;
}
html.mafia-ui-v3 .nav-item.active{
  transform:translateY(-3px)!important;
  transition:transform var(--ui-dur-fast) var(--ui-ease-bounce),box-shadow var(--ui-dur) var(--ui-ease-lux)!important;
}

/* Страницы — без blur, только silk fade */
html.mafia-ui-v3 .page.active{
  animation:uiPageSilkIn var(--ui-dur) var(--ui-ease-lux) both!important;
}
@keyframes uiPageSilkIn{
  from{opacity:0;transform:translateY(14px) scale(.992)}
  to{opacity:1;transform:none}
}

/* Модалки — мягче */
html.mafia-ui-v3 .modal-overlay.open{
  animation:uiModalSilkIn .38s var(--ui-ease-lux) both!important;
}
@keyframes uiModalSilkIn{from{opacity:0;backdrop-filter:blur(0)}to{opacity:1}}
html.mafia-ui-v3 .modal-sheet{
  animation:uiSheetSilkUp .48s var(--ui-ease-lux) both!important;
}
@keyframes uiSheetSilkUp{
  from{opacity:0;transform:translateY(32px) scale(.985)}
  to{opacity:1;transform:none}
}

/* Hero — золотая линия снизу */
html.mafia-ui-v3 .hero::after{
  content:''!important;position:absolute!important;bottom:0!important;left:8%!important;right:8%!important;height:1px!important;
  background:var(--ui-gold-line)!important;opacity:.55!important;z-index:1!important;
}

/* Stat boxes — tabular nums */
html.mafia-ui-v3 .stat-box .n,
html.mafia-ui-v3 .pr-score-num{
  font-variant-numeric:tabular-nums!important;
  letter-spacing:-.02em!important;
}

/* Toast — silk spring */
html.mafia-ui-v3 .toast{
  animation:uiToastSilk .44s var(--ui-ease-bounce) both!important;
  border:1px solid color-mix(in srgb,var(--ui-gold) 18%,rgba(255,255,255,.1))!important;
}
@keyframes uiToastSilk{
  from{opacity:0;transform:translateY(16px) scale(.94)}
  60%{transform:translateY(-2px) scale(1.01)}
  to{opacity:1;transform:none}
}

/* Phase banners — richer glow */
html.mafia-ui-v3 .phase-night{
  box-shadow:0 16px 48px rgba(99,102,241,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
html.mafia-ui-v3 .phase-day{
  box-shadow:0 16px 48px rgba(251,191,36,.18),inset 0 1px 0 rgba(255,255,255,.1)!important;
}

/* Inputs — silk focus ring */
html.mafia-ui-v3 .input:focus,
html.mafia-ui-v3 .search-box input:focus{
  transition:box-shadow .32s var(--ui-ease-lux),border-color .24s var(--ui-ease-silk)!important;
}

html[data-a11y-motion="reduce"] html.mafia-ui-v3 .card::after,
html[data-a11y-motion="reduce"] html.mafia-ui-v3 .page.active{
  animation:none!important;
}

/* ── Итоги партии ── */
html.mafia-ui-v3 .game-end-digest{text-align:left}
html.mafia-ui-v3 .game-end-winner{
  font-size:1.05rem;font-weight:900;text-align:center;margin-bottom:6px;
  background:var(--ui-champagne)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}
html.mafia-ui-v3 .game-end-meta{
  text-align:center;font-size:.68rem;color:var(--hint);margin-bottom:14px;
}
html.mafia-ui-v3 .game-end-section-title{
  font-size:.62rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;
  color:color-mix(in srgb,var(--accent) 60%,var(--hint));margin:14px 0 8px;
}
html.mafia-ui-v3 .game-end-roster{display:flex;flex-direction:column;gap:8px;max-height:42vh;overflow-y:auto;padding-right:2px}
html.mafia-ui-v3 .game-end-player{
  padding:10px 12px;border-radius:14px;
  background:linear-gradient(165deg,var(--ui-glass-2),var(--ui-glass-3));
  border:1px solid var(--ui-border-soft);
  box-shadow:var(--ui-shadow-sm);
}
html.mafia-ui-v3 .game-end-player--dead{opacity:.82}
html.mafia-ui-v3 .game-end-player-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
html.mafia-ui-v3 .game-end-seat{
  font-size:.62rem;font-weight:800;color:var(--hint);min-width:1.6rem;
}
html.mafia-ui-v3 .game-end-name{flex:1;font-weight:800;font-size:.88rem}
html.mafia-ui-v3 .game-end-role{font-size:.72rem;color:color-mix(in srgb,var(--text) 80%,var(--hint));margin-bottom:4px}
html.mafia-ui-v3 .game-end-actions{
  margin:6px 0 0;padding-left:1.1rem;font-size:.68rem;line-height:1.45;color:var(--hint);
}
html.mafia-ui-v3 .game-end-actions li{margin:2px 0}
html.mafia-ui-v3 .game-end-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
html.mafia-ui-v3 .game-end-chips span{
  font-size:.58rem;font-weight:800;padding:3px 8px;border-radius:999px;
  background:color-mix(in srgb,var(--accent) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);
}
html.mafia-ui-v3 .game-end-bm{font-size:.74rem;line-height:1.5}
html.mafia-ui-v3 .game-end-bm-row{padding:6px 0;border-bottom:1px solid var(--ui-border-soft)}
html.mafia-ui-v3 .game-end-bm-row--ok{color:#fde68a}
html.mafia-ui-v3 .game-end-highlights{
  margin:0;padding-left:0;list-style:none;font-size:.72rem;line-height:1.45;
}
html.mafia-ui-v3 .game-end-highlights li{
  padding:6px 8px;margin:4px 0;border-radius:10px;
  background:color-mix(in srgb,var(--ui-gold) 8%,transparent);
  border:1px solid color-mix(in srgb,var(--ui-gold) 15%,transparent);
}
html.mafia-ui-v3 .game-end-pre{
  white-space:pre-wrap;font-size:.72rem;line-height:1.45;
  background:var(--ui-glass-3);padding:10px;border-radius:12px;
  border:1px solid var(--ui-border-soft);max-height:28vh;overflow:auto;margin:0;
}
html.mafia-ui-v3 .game-end-raw{margin-top:12px;font-size:.72rem}
html.mafia-ui-v3 .game-end-raw summary{cursor:pointer;color:var(--hint);font-weight:700;margin-bottom:6px}
