:root{
  --bg:#f4f7fb;
  --bg-soft:#eef3f9;
  --panel:#ffffff;
  --panel-2:#f8fafc;
  --card:#ffffff;
  --border:#dbe4f0;
  --border-strong:#c8d5e6;
  --text:#172033;
  --text-soft:#5d6b82;
  --accent:#3857ff;
  --accent-2:#6d5efc;
  --success:#16a34a;
  --warning:#d97706;
  --danger:#dc2626;
  --shadow:0 18px 44px rgba(23, 32, 51, .08);
  --shadow-soft:0 10px 24px rgba(23, 32, 51, .06);
  --sidebar-bg:#f8fbff;
  --sidebar-border:#dce6f2;
  --input-bg:#ffffff;
  --hover:#eef4ff;
}

html[data-theme="dark"]{
  --bg:#0b1020;
  --bg-soft:#0f172a;
  --panel:#111827;
  --panel-2:#0f172a;
  --card:#121a2b;
  --border:rgba(255,255,255,.09);
  --border-strong:rgba(255,255,255,.14);
  --text:#ecf1ff;
  --text-soft:#8da1c4;
  --accent:#8b5cf6;
  --accent-2:#4f46e5;
  --success:#22c55e;
  --warning:#f59e0b;
  --danger:#ef4444;
  --shadow:0 20px 60px rgba(0,0,0,.30);
  --shadow-soft:0 10px 24px rgba(0,0,0,.24);
  --sidebar-bg:rgba(10,13,20,.88);
  --sidebar-border:rgba(255,255,255,.08);
  --input-bg:#0d1526;
  --hover:#11192d;
}

*{box-sizing:border-box}
html{background:var(--bg)}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at top left, rgba(56,87,255,.08), transparent 22%),
    radial-gradient(circle at bottom right, rgba(109,94,252,.08), transparent 20%),
    linear-gradient(180deg,var(--bg-soft),var(--bg));
  color:var(--text);
}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit}

.login-page{min-height:100vh}
.theme-floating{position:fixed;top:20px;right:20px;z-index:20}
.theme-toggle{
  display:inline-flex;align-items:center;gap:10px;
  padding:11px 14px;border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.75);
  color:var(--text);
  box-shadow:var(--shadow-soft);
  cursor:pointer;
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}
html[data-theme="dark"] .theme-toggle{background:rgba(17,24,39,.85)}
.theme-toggle:hover{transform:translateY(-1px);border-color:var(--border-strong)}
.theme-toggle-icon{font-size:14px;line-height:1}

.login-shell{
  min-height:100vh;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:32px;
  align-items:center;
  padding:48px;
}
.login-hero{padding:28px 24px 28px 12px}
.login-hero-badge,
.status-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.72);
  color:var(--text-soft);
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
}
html[data-theme="dark"] .login-hero-badge,
html[data-theme="dark"] .status-pill{background:rgba(17,24,39,.72)}
.login-hero h1{
  margin:18px 0 16px;
  font-size:clamp(38px,5vw,62px);
  line-height:1.04;
  letter-spacing:-.04em;
  max-width:760px;
}
.login-hero p{
  max-width:680px;
  font-size:18px;
  line-height:1.65;
  color:var(--text-soft);
  margin:0;
}
.login-feature-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:32px;
}
.login-feature-card{
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.72);
  border:1px solid var(--border);
  box-shadow:var(--shadow-soft);
  min-height:142px;
}
html[data-theme="dark"] .login-feature-card{background:rgba(18,26,43,.92)}
.login-feature-card strong{
  display:block;
  margin-bottom:10px;
  font-size:15px;
}
.login-feature-card span{
  color:var(--text-soft);
  line-height:1.6;
  font-size:14px;
}

.login-panel{display:flex;justify-content:center}
.login-card{
  width:100%;
  max-width:520px;
  background:rgba(255,255,255,.86);
  border:1px solid var(--border);
  border-radius:30px;
  padding:28px;
  box-shadow:var(--shadow);
  backdrop-filter:blur(20px);
}
html[data-theme="dark"] .login-card{background:rgba(17,24,39,.82)}
.login-card-premium{position:relative;overflow:hidden}
.login-card-premium::before{
  content:"";
  position:absolute;inset:-120px auto auto -90px;
  width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle, rgba(56,87,255,.16), transparent 68%);
  pointer-events:none;
}
html[data-theme="dark"] .login-card-premium::before{
  background:radial-gradient(circle, rgba(139,92,246,.18), transparent 68%);
}
.brand-header,
.brand-row,
.brand-lockup{display:flex;align-items:center}
.brand-header{justify-content:space-between;gap:18px;margin-bottom:24px}
.brand-row{margin-bottom:12px}
.brand-lockup{gap:14px}
.brand-badge{
  width:48px;height:48px;border-radius:16px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;
  display:grid;place-items:center;
  font-weight:800;
  box-shadow:0 10px 24px rgba(56,87,255,.24);
  flex:0 0 auto;
}
.brand-title{font-size:20px;font-weight:800;letter-spacing:-.02em}
.brand-sub{font-size:13px;color:var(--text-soft)}
.login-copy h2{margin:0 0 8px;font-size:32px;letter-spacing:-.03em}
.login-copy p{margin:0 0 24px;color:var(--text-soft);line-height:1.6}
.login-footnote{margin-top:18px;color:var(--text-soft);font-size:13px;line-height:1.6}

.field-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.password-wrap{position:relative}
.password-wrap .form-control{padding-right:108px}
.password-toggle{
  position:absolute;top:50%;right:10px;transform:translateY(-50%);
  border:1px solid var(--border);
  background:var(--panel-2);
  color:var(--text-soft);
  border-radius:999px;
  padding:7px 10px;
  font-size:12px;
  cursor:pointer;
}

.form-control{
  width:100%;
  padding:13px 14px;
  background:var(--input-bg);
  border:1px solid var(--border);
  border-radius:14px;
  color:var(--text);
  outline:none;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.form-control:focus{
  border-color:rgba(56,87,255,.38);
  box-shadow:0 0 0 4px rgba(56,87,255,.12);
}
html[data-theme="dark"] .form-control:focus{
  border-color:rgba(139,92,246,.42);
  box-shadow:0 0 0 4px rgba(139,92,246,.14);
}
.form-label{display:block;font-size:13px;font-weight:700;color:var(--text);margin-bottom:6px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-stack > * + *{margin-top:14px}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 16px;border-radius:14px;border:1px solid var(--border);
  background:var(--panel-2);color:var(--text);cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-soft)}
.btn-lg{padding:14px 18px;font-weight:700}
.btn-primary{
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;border:none;
}
.btn-secondary{background:var(--panel-2)}
.btn-danger{background:rgba(220,38,38,.1);color:var(--danger);border-color:rgba(220,38,38,.18)}

.alert{
  padding:12px 14px;border-radius:14px;
  border:1px solid rgba(220,38,38,.20);
  background:rgba(220,38,38,.07);
  color:var(--danger)
}

.app-shell{
  display:grid;
  grid-template-columns:292px 1fr;
  min-height:100vh;
}
.sidebar{
  padding:20px 18px 18px;
  border-right:1px solid var(--sidebar-border);
  background:var(--sidebar-bg);
  backdrop-filter:blur(16px);
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
}
.nav{display:flex;flex-direction:column;gap:6px;margin-top:20px}
.nav a{
  display:flex;align-items:center;
  min-height:46px;
  padding:12px 14px;
  border-radius:14px;
  color:var(--text-soft);
  border:1px solid transparent;
  background:transparent;
  font-weight:600;
  transition:background .14s ease, color .14s ease, border-color .14s ease;
}
.nav a:hover{
  color:var(--text);
  background:var(--hover);
  border-color:var(--border);
}
.nav a.active{
  color:var(--text);
  background:var(--hover);
  border-color:var(--border-strong);
  box-shadow:inset 0 0 0 1px rgba(56,87,255,.06);
}
.sidebar-footer{margin-top:auto;padding-top:18px}
.account-chip{
  display:flex;align-items:center;gap:12px;
  padding:12px;
  border-radius:18px;
  background:rgba(255,255,255,.55);
  border:1px solid var(--border);
  margin-bottom:12px;
}
html[data-theme="dark"] .account-chip{background:rgba(18,26,43,.72)}
.account-avatar{
  width:40px;height:40px;border-radius:14px;
  display:grid;place-items:center;
  font-weight:800;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;
}
.account-title{
  max-width:180px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:13px;
  font-weight:700;
}
.account-sub{font-size:12px;color:var(--text-soft)}
.logout{
  display:block;
  text-align:center;
  padding:12px 14px;
  border-radius:14px;
  background:var(--panel-2);
  border:1px solid var(--border);
  color:var(--text);
}

.main{padding:24px 28px 32px}
.topbar{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:20px;
  margin-bottom:24px;
}
.topbar-actions{display:flex;align-items:center;gap:12px}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.18em;color:var(--text-soft)}
.page-title{margin:6px 0 0;font-size:34px;letter-spacing:-.04em}
.profile-chip{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;
  background:rgba(255,255,255,.62);
  border:1px solid var(--border);
  border-radius:999px;
  box-shadow:var(--shadow-soft);
}
html[data-theme="dark"] .profile-chip{background:rgba(15,23,42,.88)}
.dot{
  width:10px;height:10px;border-radius:50%;
  background:var(--success);
  box-shadow:0 0 0 4px rgba(34,197,94,.12)
}

.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{
  background:rgba(255,255,255,.78);
  border:1px solid var(--border);
  border-radius:22px;
  padding:18px;
  box-shadow:var(--shadow-soft)
}
html[data-theme="dark"] .card{background:rgba(18,26,43,.92)}
.kpi-value{font-size:34px;font-weight:800;margin-top:8px;letter-spacing:-.03em}
.muted{color:var(--text-soft)}
.small{font-size:12px}
.section{margin-top:18px}
.section-title{font-size:20px;margin:0 0 14px}
.table-wrap{overflow:auto}
.table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.table th,.table td{
  padding:14px 12px;
  border-bottom:1px solid var(--border);
  text-align:left;
  font-size:14px;
  vertical-align:top
}
.table th{
  color:var(--text-soft);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.table tr:hover td{background:rgba(56,87,255,.035)}
html[data-theme="dark"] .table tr:hover td{background:rgba(139,92,246,.035)}

.badge{
  display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;
  font-size:12px;border:1px solid var(--border);background:var(--panel-2)
}
.badge.success{background:rgba(22,163,74,.1);color:var(--success)}
.badge.warn{background:rgba(217,119,6,.12);color:var(--warning)}
.badge.danger{background:rgba(220,38,38,.12);color:var(--danger)}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}
textarea.form-control{min-height:110px;resize:vertical}
select.form-control{appearance:none}
.help{font-size:12px;color:var(--text-soft);margin-top:6px}
hr.sep{border:none;border-top:1px solid var(--border);margin:18px 0}
.day-grid{display:grid;grid-template-columns:160px repeat(4,1fr);gap:10px;align-items:center}
.day-row{padding:12px;border-radius:16px;background:var(--panel-2);border:1px solid var(--border)}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.filters{display:flex;gap:10px;flex-wrap:wrap}

@media (max-width:1280px){
  .login-shell{grid-template-columns:1fr;gap:12px;padding:32px 24px}
  .login-hero{padding:6px 0 0}
  .login-feature-list{grid-template-columns:1fr}
}
@media (max-width:1100px){
  .kpi-grid,.grid-3,.grid-2,.form-row{grid-template-columns:1fr 1fr}
  .app-shell{grid-template-columns:1fr}
  .sidebar{
    position:relative;
    height:auto;
    border-right:none;
    border-bottom:1px solid var(--sidebar-border)
  }
}
@media (max-width:720px){
  .kpi-grid,.grid-3,.grid-2,.form-row{grid-template-columns:1fr}
  .main{padding:18px}
  .page-title{font-size:28px}
  .topbar{flex-direction:column;align-items:flex-start}
  .topbar-actions{width:100%;justify-content:space-between}
  .login-shell{padding:18px 16px 24px}
  .login-hero h1{font-size:36px}
  .login-card{padding:22px}
}



/* --- Stats page recovered --- */
.chart-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}
.chart-card{background:rgba(255,255,255,.78);border:1px solid var(--border);border-radius:22px;padding:18px;box-shadow:var(--shadow-soft)}
html[data-theme="dark"] .chart-card{background:rgba(18,26,43,.92)}
.sparkline{display:flex;align-items:flex-end;gap:10px;min-height:220px;padding-top:18px}
.spark-col{flex:1;min-width:28px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px}
.spark-bar-wrap{width:100%;height:170px;display:flex;align-items:flex-end}
.spark-bar{width:100%;border-radius:14px 14px 8px 8px;background:linear-gradient(180deg,var(--accent),var(--accent-2));box-shadow:0 10px 18px rgba(56,87,255,.16);min-height:4px}
.spark-label{font-size:11px;color:var(--text-soft);text-align:center}
.spark-value{font-size:11px;color:var(--text-soft)}
.donut-wrap{display:grid;grid-template-columns:240px 1fr;gap:16px;align-items:center}
.donut{width:220px;height:220px;border-radius:50%;margin:auto;position:relative;border:1px solid var(--border);background:conic-gradient(var(--accent) 0 33%, #14b8a6 33% 66%, #22c55e 66% 100%)}
.donut::after{content:"";position:absolute;inset:24px;border-radius:50%;background:var(--panel);border:1px solid var(--border)}
.donut-center{position:absolute;inset:0;display:grid;place-items:center;z-index:1;text-align:center}
.donut-center strong{display:block;font-size:28px;letter-spacing:-.03em}
.legend{display:grid;gap:10px}
.legend-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;background:var(--panel-2);border:1px solid var(--border)}
.legend-left{display:flex;align-items:center;gap:10px}
.legend-dot{width:12px;height:12px;border-radius:50%}
.legend-dot.chat{background:var(--accent)}
.legend-dot.call{background:#14b8a6}
.legend-dot.video{background:#22c55e}
.rank-list{display:grid;gap:10px}
.rank-item{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:var(--panel-2);border:1px solid var(--border)}
.rank-num{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:800}
.rank-meta strong{display:block}
.rank-meta span{font-size:12px;color:var(--text-soft)}
.rank-value{font-weight:800}
.heatmap{display:grid;grid-template-columns:60px repeat(24,minmax(18px,1fr));gap:6px;align-items:center}
.heatmap-head,.heatmap-day{font-size:11px;color:var(--text-soft)}
.heatmap-cell{aspect-ratio:1/1;border-radius:6px;background:var(--panel-2);border:1px solid var(--border)}
.heat-1{background:rgba(139,92,246,.18)}
.heat-2{background:rgba(139,92,246,.32)}
.heat-3{background:rgba(139,92,246,.50)}
.heat-4{background:rgba(20,184,166,.62)}
.heat-5{background:rgba(34,197,94,.82)}
.mini-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mini-kpi{padding:14px;border-radius:16px;background:var(--panel-2);border:1px solid var(--border)}
.mini-kpi .label{font-size:12px;color:var(--text-soft)}
.mini-kpi .value{font-size:22px;font-weight:800;margin-top:6px}

@media (max-width: 1100px){
  .chart-grid{grid-template-columns:1fr}
  .donut-wrap{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .heatmap{grid-template-columns:50px repeat(24,minmax(14px,1fr));gap:4px}
  .sparkline{gap:6px;min-height:180px}
}


/* --- Premium statistics upgrade --- */
.chart-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}
.chart-card{background:rgba(255,255,255,.78);border:1px solid var(--border);border-radius:22px;padding:18px;box-shadow:var(--shadow-soft)}
html[data-theme="dark"] .chart-card{background:rgba(18,26,43,.92)}
.sparkline{display:flex;align-items:flex-end;gap:10px;min-height:240px;padding-top:18px}
.spark-col{flex:1;min-width:28px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px}
.spark-bar-wrap{width:100%;height:176px;display:flex;align-items:flex-end}
.spark-bar{width:100%;border-radius:14px 14px 8px 8px;background:linear-gradient(180deg,var(--accent),var(--accent-2));box-shadow:0 10px 18px rgba(56,87,255,.16);min-height:4px}
.spark-label{font-size:11px;color:var(--text-soft);text-align:center}
.spark-value{font-size:11px;color:var(--text-soft);white-space:nowrap}
.donut-wrap{display:grid;grid-template-columns:240px 1fr;gap:16px;align-items:center}
.donut{width:220px;height:220px;border-radius:50%;margin:auto;position:relative;border:1px solid var(--border)}
.donut::after{content:"";position:absolute;inset:24px;border-radius:50%;background:var(--panel);border:1px solid var(--border)}
.donut-center{position:absolute;inset:0;display:grid;place-items:center;z-index:1;text-align:center}
.donut-center strong{display:block;font-size:28px;letter-spacing:-.03em}
.legend{display:grid;gap:10px}
.legend-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:14px;background:var(--panel-2);border:1px solid var(--border)}
.legend-left{display:flex;align-items:center;gap:10px}
.legend-dot{width:12px;height:12px;border-radius:50%}
.legend-dot.chat{background:var(--accent)}
.legend-dot.call{background:#14b8a6}
.legend-dot.video{background:#22c55e}
.rank-list{display:grid;gap:10px}
.rank-item{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:var(--panel-2);border:1px solid var(--border)}
.rank-num{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;font-weight:800}
.rank-meta strong{display:block}
.rank-meta span{font-size:12px;color:var(--text-soft)}
.rank-value{font-weight:800}
.heatmap{display:grid;grid-template-columns:60px repeat(24,minmax(18px,1fr));gap:6px;align-items:center;overflow:auto}
.heatmap-head,.heatmap-day{font-size:11px;color:var(--text-soft)}
.heatmap-cell{aspect-ratio:1/1;border-radius:6px;background:var(--panel-2);border:1px solid var(--border);min-width:18px}
.heat-1{background:rgba(139,92,246,.18)}
.heat-2{background:rgba(139,92,246,.32)}
.heat-3{background:rgba(139,92,246,.50)}
.heat-4{background:rgba(20,184,166,.62)}
.heat-5{background:rgba(34,197,94,.82)}
.mini-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mini-kpi{padding:14px;border-radius:16px;background:var(--panel-2);border:1px solid var(--border)}
.mini-kpi .label{font-size:12px;color:var(--text-soft)}
.mini-kpi .value{font-size:22px;font-weight:800;margin-top:6px}
@media (max-width: 1100px){
  .chart-grid{grid-template-columns:1fr}
  .donut-wrap{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .heatmap{grid-template-columns:50px repeat(24,minmax(14px,1fr));gap:4px}
  .sparkline{gap:6px;min-height:180px}
  .mini-kpis{grid-template-columns:1fr}
}


/* --- Premium dashboard refresh --- */
.hero-dashboard{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:18px;
  align-items:stretch;
}
.hero-copy,
.hero-stat-card{
  border:1px solid var(--border);
  border-radius:28px;
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow-soft);
  padding:24px;
}
html[data-theme="dark"] .hero-copy,
html[data-theme="dark"] .hero-stat-card{background:rgba(18,26,43,.92)}
.hero-copy{
  position:relative;
  overflow:hidden;
}
.hero-copy::before{
  content:"";
  position:absolute;
  inset:auto -120px -120px auto;
  width:260px;
  height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(56,87,255,.14), transparent 68%);
  pointer-events:none;
}
html[data-theme="dark"] .hero-copy::before{
  background:radial-gradient(circle, rgba(139,92,246,.18), transparent 68%);
}
.hero-badge{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--panel-2);
  color:var(--text-soft);
  font-size:12px;
  font-weight:700;
}
.hero-copy h2{
  margin:14px 0 10px;
  font-size:42px;
  line-height:1.04;
  letter-spacing:-.04em;
}
.hero-copy p{
  margin:0;
  max-width:720px;
  color:var(--text-soft);
  font-size:16px;
  line-height:1.7;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}
.hero-stat-label{
  color:var(--text-soft);
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.hero-stat-value{
  margin-top:10px;
  font-size:44px;
  line-height:1;
  font-weight:800;
  letter-spacing:-.05em;
}
.hero-stat-sub{
  margin-top:10px;
  color:var(--text-soft);
  line-height:1.6;
}
.hero-metrics{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:22px;
}
.hero-metrics > div{
  padding:14px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
}
.metric-mini-label{
  display:block;
  font-size:12px;
  color:var(--text-soft);
  margin-bottom:8px;
}

.dashboard-kpis{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:14px;
}
.dashboard-kpi{
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.78);
  border:1px solid var(--border);
  box-shadow:var(--shadow-soft);
}
html[data-theme="dark"] .dashboard-kpi{background:rgba(18,26,43,.92)}
.dashboard-kpi-label{
  color:var(--text-soft);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:700;
}
.dashboard-kpi-value{
  margin-top:12px;
  font-size:34px;
  font-weight:800;
  letter-spacing:-.04em;
}
.dashboard-kpi-foot{
  margin-top:8px;
  color:var(--text-soft);
  font-size:13px;
}

.dashboard-main-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:16px;
}
.dashboard-side-stack{
  display:grid;
  gap:16px;
}
.dash-bars{
  display:flex;
  align-items:flex-end;
  gap:12px;
  min-height:300px;
  padding-top:20px;
}
.dash-bar-col{
  flex:1;
  min-width:38px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}
.dash-bar-wrap{
  width:100%;
  height:220px;
  display:flex;
  align-items:flex-end;
}
.dash-bar{
  width:100%;
  border-radius:18px 18px 10px 10px;
  background:linear-gradient(180deg,var(--accent),var(--accent-2));
  box-shadow:0 14px 24px rgba(56,87,255,.16);
  min-height:6px;
}
.dash-bar-value{
  font-size:11px;
  color:var(--text-soft);
  white-space:nowrap;
}
.dash-bar-label{
  font-size:12px;
  color:var(--text-soft);
}
.quick-actions-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.quick-action{
  display:block;
  padding:16px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
  transition:transform .14s ease, border-color .14s ease, background .14s ease;
}
.quick-action:hover{
  transform:translateY(-1px);
  border-color:var(--border-strong);
  background:var(--hover);
}
.quick-action strong{
  display:block;
  margin-bottom:8px;
}
.quick-action span{
  color:var(--text-soft);
  font-size:13px;
  line-height:1.55;
}
.dashboard-lower-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.alert-list,
.activity-list{
  display:grid;
  gap:12px;
}
.alert-row,
.activity-row{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:14px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
}
.alert-row-dot,
.activity-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  margin-top:5px;
  flex:0 0 auto;
}
.alert-row.warn .alert-row-dot{background:var(--warning)}
.alert-row.success .alert-row-dot{background:var(--success)}
.alert-row.info .alert-row-dot{background:var(--accent)}
.alert-row-content strong{display:block;margin-bottom:6px}
.alert-row-content span{color:var(--text-soft);line-height:1.6}
.activity-dot{background:var(--accent)}
.activity-row strong{display:block;margin-bottom:4px}

@media (max-width: 1280px){
  .dashboard-kpis{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 1100px){
  .hero-dashboard,
  .dashboard-main-grid,
  .dashboard-lower-grid{grid-template-columns:1fr}
  .dashboard-kpis{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 720px){
  .hero-copy h2{font-size:34px}
  .dashboard-kpis,
  .hero-metrics,
  .quick-actions-grid{grid-template-columns:1fr}
  .dash-bars{gap:8px;min-height:240px}
  .dash-bar-wrap{height:180px}
}


/* --- Hosts / Profiles / Multimedia premium refresh --- */
.entity-hero{display:grid;grid-template-columns:1.08fr .92fr;gap:18px;align-items:stretch}
.entity-hero-copy,.entity-hero-actions{border:1px solid var(--border);border-radius:28px;background:rgba(255,255,255,.78);box-shadow:var(--shadow-soft);padding:24px}
html[data-theme="dark"] .entity-hero-copy,html[data-theme="dark"] .entity-hero-actions{background:rgba(18,26,43,.92)}
.entity-hero-copy h2{margin:14px 0 10px;font-size:40px;line-height:1.05;letter-spacing:-.04em}
.entity-hero-copy p{margin:0;color:var(--text-soft);line-height:1.7;font-size:16px}
.entity-hero-actions{display:flex;flex-wrap:wrap;align-content:center;gap:10px}
.entity-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.entity-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:16px}
.table-identity{display:flex;align-items:center;gap:12px}
.identity-avatar{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff}
.side-checklist{display:grid;gap:12px}
.side-action{display:block;padding:16px;border-radius:18px;background:var(--panel-2);border:1px solid var(--border);transition:transform .14s ease,border-color .14s ease,background .14s ease}
.side-action:hover{transform:translateY(-1px);border-color:var(--border-strong);background:var(--hover)}
.side-action strong{display:block;margin-bottom:8px}
.side-action span{color:var(--text-soft);font-size:13px;line-height:1.55}
.checklist-card{padding:18px;border-radius:20px;background:var(--panel-2);border:1px solid var(--border)}
.clean-list{margin:12px 0 0;padding-left:18px;color:var(--text-soft);line-height:1.8}
.profile-card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.profile-card{overflow:hidden;border-radius:24px;border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow-soft)}
.profile-cover{height:160px;background:linear-gradient(135deg, rgba(56,87,255,.18), rgba(109,94,252,.10)),radial-gradient(circle at top left, rgba(56,87,255,.22), transparent 40%),radial-gradient(circle at bottom right, rgba(20,184,166,.14), transparent 38%),var(--panel-2);border-bottom:1px solid var(--border)}
.profile-card-body{padding:16px}
.panel-head.compact{margin-bottom:10px}
.profile-title{margin:0;font-size:18px;letter-spacing:-.02em}
.profile-meta-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:14px 0 16px}
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.media-card{overflow:hidden;border-radius:24px;border:1px solid var(--border);background:var(--panel);box-shadow:var(--shadow-soft)}
.media-thumb{height:180px;display:grid;place-items:center;border-bottom:1px solid var(--border);background:linear-gradient(135deg, rgba(56,87,255,.10), rgba(109,94,252,.08)),var(--panel-2);color:var(--text-soft);font-weight:700;letter-spacing:.04em}
.media-thumb.video{background:linear-gradient(135deg, rgba(20,184,166,.18), rgba(56,87,255,.10)),var(--panel-2)}
.media-body{padding:16px}
@media (max-width: 1100px){
  .entity-hero,.entity-grid{grid-template-columns:1fr}
  .entity-summary-grid,.profile-card-grid,.media-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 720px){
  .entity-summary-grid,.profile-card-grid,.profile-meta-grid,.media-grid{grid-template-columns:1fr}
  .entity-hero-copy h2{font-size:34px}
}


/* --- Final product polish --- */
.nav-group + .nav-group{margin-top:14px}
.nav-section-title{
  margin:14px 0 8px;
  padding:0 8px;
  color:var(--text-soft);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:800;
}
.nav a{
  gap:12px;
}
.nav-icon{
  width:18px;
  text-align:center;
  opacity:.8;
  font-size:13px;
  flex:0 0 18px;
}
.nav a.active .nav-icon,
.nav a:hover .nav-icon{
  opacity:1;
}
.topbar-subtitle{
  margin-top:8px;
  color:var(--text-soft);
  line-height:1.6;
  font-size:14px;
}
.sidebar-help-card{
  padding:14px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
  margin-bottom:12px;
}
.sidebar-help-card strong{
  display:block;
  margin-bottom:6px;
  font-size:13px;
}
.sidebar-help-card span{
  color:var(--text-soft);
  line-height:1.55;
  font-size:12px;
}
.empty-state{
  padding:34px 22px;
  border-radius:22px;
  border:1px dashed var(--border-strong);
  background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35));
  text-align:center;
}
html[data-theme="dark"] .empty-state{
  background:linear-gradient(180deg, rgba(18,26,43,.84), rgba(18,26,43,.68));
}
.empty-state-icon{
  width:56px;
  height:56px;
  margin:0 auto 14px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
  font-size:22px;
}
.empty-state h3{
  margin:0 0 8px;
  letter-spacing:-.02em;
}
.empty-state p{
  margin:0;
  color:var(--text-soft);
  line-height:1.65;
}
.skeleton{
  position:relative;
  overflow:hidden;
  background:var(--panel-2);
  border:1px solid var(--border);
  border-radius:16px;
}
.skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  animation:shimmer 1.8s infinite;
}
html[data-theme="dark"] .skeleton::after{
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);
}
@keyframes shimmer{
  100%{transform:translateX(100%)}
}
.table td, .table th{
  white-space:nowrap;
}
.table td .muted.small{
  white-space:normal;
}
.badge{
  font-weight:700;
  letter-spacing:.01em;
}
.status-inline{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.status-inline::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:currentColor;
  opacity:.7;
}
.page-note{
  margin-top:10px;
  color:var(--text-soft);
  line-height:1.6;
}
@media (max-width: 1100px){
  .nav-section-title{
    margin-top:10px;
  }
}


/* --- Host Profile IA integration --- */
.alert-success{border:1px solid rgba(22,163,74,.20);background:rgba(22,163,74,.08);color:var(--success)}
.checkbox-stack{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.check-tile{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:12px 14px;border-radius:14px;background:var(--panel-2);border:1px solid var(--border);color:var(--text)}
.check-tile input{width:16px;height:16px}
.hostprofile-invalid .form-control,.hostprofile-invalid select.form-control,.hostprofile-invalid textarea.form-control{border-color:rgba(220,38,38,.45);box-shadow:0 0 0 4px rgba(220,38,38,.08)}
.hostprofile-error{display:block;margin-top:6px;color:var(--danger);font-size:12px}
.profile-preview-text{line-height:1.6}


/* --- Master-detail premium layout --- */
.master-detail-grid{
  display:grid;
  grid-template-columns:minmax(360px, .88fr) minmax(520px, 1.12fr);
  gap:18px;
  align-items:start;
}
.master-panel,
.detail-panel{
  border:1px solid var(--border);
  border-radius:28px;
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow-soft);
  padding:18px;
}
html[data-theme="dark"] .master-panel,
html[data-theme="dark"] .detail-panel{background:rgba(18,26,43,.92)}
.master-panel{
  position:sticky;
  top:24px;
}
.entity-list{
  display:grid;
  gap:12px;
}
.entity-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px;
  border-radius:20px;
  border:1px solid var(--border);
  background:var(--panel-2);
  transition:transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}
.entity-row:hover{
  transform:translateY(-1px);
  border-color:var(--border-strong);
  background:var(--hover);
}
.entity-row.active{
  border-color:var(--border-strong);
  background:var(--hover);
  box-shadow:inset 0 0 0 1px rgba(56,87,255,.08);
}
.entity-row-main{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.entity-row-main strong{
  display:block;
}
.entity-row-main .muted.small{
  white-space:normal;
}
.entity-row-meta{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  text-align:right;
}
.entity-inline-meta{
  color:var(--text-soft);
  font-size:12px;
  line-height:1.4;
}
.detail-panel .panel-head{
  margin-bottom:16px;
}
.detail-card{
  padding:16px;
  border-radius:22px;
  background:var(--panel-2);
  border:1px solid var(--border);
}
.detail-card + .detail-card{
  margin-top:14px;
}
.detail-card-title{
  margin-bottom:12px;
  font-size:13px;
  color:var(--text-soft);
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.entity-list-cards .entity-row{
  align-items:stretch;
  padding:0;
  overflow:hidden;
}
.profile-cover-mini{
  width:120px;
  min-height:120px;
  flex:0 0 120px;
  border-right:1px solid var(--border);
  border-bottom:none;
}
.entity-card-body{
  padding:14px;
  flex:1;
}
.entity-inline-cluster{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}
.entity-inline-cluster .entity-inline-meta{
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.7);
  border:1px solid var(--border);
}
html[data-theme="dark"] .entity-inline-cluster .entity-inline-meta{
  background:rgba(17,24,39,.72);
}
@media (max-width: 1200px){
  .master-detail-grid{
    grid-template-columns:1fr;
  }
  .master-panel{
    position:relative;
    top:auto;
  }
}
@media (max-width: 720px){
  .entity-row{
    flex-direction:column;
    align-items:flex-start;
  }
  .entity-row-meta{
    align-items:flex-start;
    text-align:left;
  }
  .entity-list-cards .entity-row{
    padding:0;
  }
  .profile-cover-mini{
    width:100%;
    min-height:140px;
    border-right:none;
    border-bottom:1px solid var(--border);
  }
}


/* --- Multimedia + Availability master-detail + public preview --- */
.preview-card .muted.small{white-space:normal}
.media-thumb-mini{
  width:120px;
  min-height:120px;
  flex:0 0 120px;
  border-right:1px solid var(--border);
  border-bottom:none;
}
.preview-stage{
  min-height:180px;
  border-radius:22px;
  border:1px solid var(--border);
  background:linear-gradient(135deg, rgba(56,87,255,.10), rgba(109,94,252,.08)), var(--panel-2);
  display:grid;
  place-items:center;
  margin-bottom:12px;
  color:var(--text-soft);
  font-weight:700;
}
.preview-stage.video{
  background:linear-gradient(135deg, rgba(20,184,166,.18), rgba(56,87,255,.10)), var(--panel-2);
}
.availability-week{
  display:grid;
  gap:12px;
}
.availability-day-row{
  display:grid;
  grid-template-columns:140px 1fr auto;
  gap:12px;
  align-items:center;
  padding:12px 14px;
  border-radius:18px;
  background:var(--panel);
  border:1px solid var(--border);
}
.availability-day-name{
  font-weight:700;
}
.availability-slot{
  color:var(--text);
}
.availability-channels{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.override-list{
  display:grid;
  gap:12px;
}
.override-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border-radius:18px;
  background:var(--panel);
  border:1px solid var(--border);
}
.profile-public-preview{
  overflow:hidden;
  border-radius:24px;
  border:1px solid var(--border);
  background:var(--panel);
}
.profile-public-cover{
  height:160px;
  background:
    linear-gradient(135deg, rgba(56,87,255,.18), rgba(109,94,252,.10)),
    radial-gradient(circle at top left, rgba(56,87,255,.22), transparent 40%),
    radial-gradient(circle at bottom right, rgba(20,184,166,.14), transparent 38%),
    var(--panel-2);
  border-bottom:1px solid var(--border);
}
.profile-public-body{
  padding:16px;
}
@media (max-width: 720px){
  .media-thumb-mini{
    width:100%;
    min-height:140px;
    border-right:none;
    border-bottom:1px solid var(--border);
  }
  .availability-day-row{
    grid-template-columns:1fr;
    align-items:flex-start;
  }
  .availability-channels{
    justify-content:flex-start;
  }
  .override-row{
    flex-direction:column;
    align-items:flex-start;
  }
}


/* --- Real media pipeline integration --- */
.crop-guide-wrap{
  position:relative;
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
}
.crop-guide-label{
  position:absolute;
  top:12px;
  left:12px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--border);
  font-size:12px;
  color:var(--text-soft);
}
html[data-theme="dark"] .crop-guide-label{
  background:rgba(17,24,39,.88);
}
.crop-guide-box{
  width:min(72%, 240px);
  aspect-ratio:3 / 4;
  border:2px dashed rgba(56,87,255,.55);
  border-radius:18px;
  box-shadow:0 0 0 999px rgba(15,23,42,.06);
}
.media-thumb-mini span{
  backdrop-filter:blur(6px);
  background:rgba(255,255,255,.78);
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
}


/* --- My account premium refresh --- */
.account-hero{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:18px;
}
.account-hero-main,
.account-hero-side{
  border:1px solid var(--border);
  border-radius:28px;
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow-soft);
  padding:24px;
}
html[data-theme="dark"] .account-hero-main,
html[data-theme="dark"] .account-hero-side{background:rgba(18,26,43,.92)}
.account-identity{
  display:flex;
  align-items:center;
  gap:16px;
}
.account-identity-avatar{
  width:72px;
  height:72px;
  border-radius:22px;
  display:grid;
  place-items:center;
  font-size:28px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  box-shadow:0 16px 28px rgba(56,87,255,.22);
  flex:0 0 auto;
}
.account-hero-main h2{
  margin:10px 0 8px;
  font-size:38px;
  line-height:1.05;
  letter-spacing:-.04em;
}
.account-hero-sub{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  color:var(--text-soft);
  font-size:14px;
}
.account-chip-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
.account-hero-copy{
  margin:16px 0 0;
  color:var(--text-soft);
  line-height:1.7;
  font-size:16px;
}
.account-hero-side{
  display:grid;
  gap:12px;
  align-content:center;
}
.account-hero-metric{
  padding:16px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
}
.account-hero-metric span{
  display:block;
  color:var(--text-soft);
  font-size:12px;
  margin-bottom:8px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:700;
}
.account-hero-metric strong{
  font-size:26px;
  letter-spacing:-.03em;
}

.account-kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.account-kpi-card{
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.78);
  border:1px solid var(--border);
  box-shadow:var(--shadow-soft);
}
html[data-theme="dark"] .account-kpi-card{background:rgba(18,26,43,.92)}
.account-kpi-label{
  color:var(--text-soft);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:700;
}
.account-kpi-value{
  margin-top:12px;
  font-size:30px;
  font-weight:800;
  letter-spacing:-.04em;
}
.account-kpi-value.smaller{
  font-size:22px;
}
.account-kpi-foot{
  margin-top:8px;
  color:var(--text-soft);
  font-size:13px;
}

.account-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:18px;
  align-items:start;
}
.account-main-panel,
.account-side-panel{
  display:grid;
  gap:16px;
}
.account-summary-list{
  display:grid;
  gap:10px;
}
.account-summary-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-radius:16px;
  background:var(--panel);
  border:1px solid var(--border);
}
.account-summary-row span{
  color:var(--text-soft);
}
.account-progress{
  display:grid;
  gap:10px;
}
.account-progress-bar{
  height:12px;
  border-radius:999px;
  background:var(--panel);
  border:1px solid var(--border);
  overflow:hidden;
}
.account-progress-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
}
.account-security-card{
  display:grid;
  gap:8px;
  padding:16px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
}
.account-security-card span{
  color:var(--text-soft);
  line-height:1.6;
  font-size:13px;
}

@media (max-width: 1100px){
  .account-hero,
  .account-grid{grid-template-columns:1fr}
  .account-kpi-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 720px){
  .account-hero-main h2{font-size:32px}
  .account-kpi-grid{grid-template-columns:1fr}
  .account-identity{align-items:flex-start}
}


/* corrections batch */
.preview-media-strip{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.preview-media-thumb{width:64px;height:86px;border-radius:12px;border:1px solid var(--border);background:var(--panel-2);background-size:cover;background-position:center}
.preview-media-thumb.video::after{content:"▶";display:grid;place-items:center;width:100%;height:100%;background:rgba(15,23,42,.18);color:#fff;font-weight:800}
.chat-thread{display:grid;gap:12px;max-height:70vh;overflow:auto;padding:8px;border:1px solid var(--border);border-radius:18px;background:var(--panel-2)}
.chat-bubble-row{display:flex}
.chat-bubble-row.user{justify-content:flex-start}
.chat-bubble-row.host{justify-content:flex-end}
.chat-bubble{max-width:78%;padding:12px 14px;border-radius:18px;border:1px solid var(--border);background:#fff}
html[data-theme="dark"] .chat-bubble{background:rgba(17,24,39,.92)}
.chat-bubble-row.host .chat-bubble{background:var(--hover)}
.chat-meta{font-size:11px;color:var(--text-soft);margin-bottom:6px}
.chat-text{line-height:1.6;white-space:pre-wrap}


/* --- Batch 2 fixes --- */
.stats-filters .stats-date{max-width:170px}
.preview-media-strip{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}
.preview-media-thumb{
  width:78px;
  height:104px;
  border-radius:16px;
  border:1px solid var(--border);
  background:var(--panel-2);
  display:grid;
  place-items:end center;
  overflow:hidden;
}
.preview-media-thumb span{
  background:rgba(255,255,255,.78);
  border:1px solid var(--border);
  border-radius:999px;
  padding:4px 8px;
  margin:8px;
  font-size:11px;
}
.chat-shell{
  display:grid;
  gap:12px;
  max-height:70vh;
  overflow:auto;
  padding:8px;
}
.chat-bubble-row{
  display:flex;
}
.chat-bubble-row.user{justify-content:flex-start}
.chat-bubble-row.host{justify-content:flex-end}
.chat-bubble{
  max-width:78%;
  border-radius:18px;
  padding:12px 14px;
  background:var(--panel-2);
  border:1px solid var(--border);
  box-shadow:var(--shadow-soft);
}
.chat-bubble-row.host .chat-bubble{
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;
  border:none;
}
.chat-bubble-meta{
  font-size:11px;
  color:var(--text-soft);
  margin-bottom:6px;
}
.chat-bubble-row.host .chat-bubble-meta{color:rgba(255,255,255,.86)}
.chat-bubble-text{
  line-height:1.7;
  white-space:normal;
}
.pagination-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-top:14px;
}
@media (max-width:720px){
  .pagination-row{flex-direction:column}
  .chat-bubble{max-width:100%}
}


/* --- Batch 3 Multimedia + Stability --- */
.media-preview img,
.media-preview video {
  max-width: 100%;
  border-radius: 12px;
}

.cropper-container {
  position: relative;
  overflow: hidden;
}

.cropper-container canvas {
  max-width: 100% !important;
}

.media-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(120px,1fr));
  gap: 12px;
}

.media-item {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--panel);
}


/* --- Batch 4 final pro --- */
.media-gallery-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:14px;
}
.media-gallery-card{
  border:1px solid var(--border);
  border-radius:22px;
  overflow:hidden;
  background:var(--panel);
  box-shadow:var(--shadow-soft);
}
.media-gallery-card.active{
  border-color:var(--border-strong);
  box-shadow:inset 0 0 0 1px rgba(56,87,255,.08), var(--shadow-soft);
}
.media-gallery-thumb{
  height:180px;
  display:grid;
  place-items:end center;
  background:var(--panel-2);
}
.media-gallery-thumb span{
  margin:10px;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.82);
  border:1px solid var(--border);
  font-size:11px;
}
.media-gallery-body{
  padding:14px;
}
.availability-state-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin-bottom:16px;
}
.availability-state-card{
  padding:16px;
  border-radius:18px;
  background:var(--panel-2);
  border:1px solid var(--border);
}
.availability-state-card.online{
  background:rgba(22,163,74,.09);
  border-color:rgba(22,163,74,.18);
}
.availability-state-card span{
  display:block;
  color:var(--text-soft);
  font-size:12px;
  margin-bottom:8px;
}
.availability-state-card strong{
  font-size:24px;
  letter-spacing:-.03em;
}
.manual-connection-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
@media (max-width:1100px){
  .availability-state-grid{grid-template-columns:repeat(2,1fr)}
  .manual-connection-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  .availability-state-grid{grid-template-columns:1fr}
}


/* --- Final multimedia visibility fixes --- */
#managerQuickPreview .preview-stage{
  min-height:260px;
}
#serverMediaGallery{
  margin-top:4px;
}


/* --- Multimedia hotfix main --- */
.manager-quick-preview .preview-stage{
  min-height:280px;
}
.quick-preview-empty{
  min-height:280px;
}
.media-gallery-grid{
  margin-top:8px;
}
.media-gallery-card{
  display:block;
}

/* --- Dating hosts filters / editor polish --- */
.block-panel-head{display:block}
.host-filter-stack{display:grid;gap:14px;margin-bottom:14px}
.compact-2{grid-template-columns:1fr 1fr}
.host-segmented-filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.host-segmented-btn{
  border:1px solid var(--border);
  background:var(--panel-2);
  color:var(--text);
  border-radius:999px;
  min-height:44px;
  padding:0 16px;
  font-weight:700;
  cursor:pointer;
}
.host-segmented-btn.active{background:rgba(56,87,255,.12);border-color:rgba(56,87,255,.28);color:var(--primary)}
.btn-inline-reset{min-height:44px}
.entity-row-host{align-items:flex-start}
.entity-row-main-host{align-items:flex-start}
.entity-row-meta-host{min-width:220px}
.entity-host-copy{display:grid;gap:2px}
.host-status-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.host-profile-counter-grid{display:grid;grid-template-columns:repeat(3,minmax(58px,1fr));gap:8px;width:100%}
.host-profile-counter{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  min-height:58px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--panel-2);
  padding:8px;
}
.host-profile-counter strong{font-size:18px;line-height:1}
.host-profile-counter small{color:var(--text-soft);font-size:11px}
.age-pill{
  min-height:48px;
  display:flex;
  align-items:center;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(22,163,74,.08);
  color:var(--success);
  font-weight:700;
}
.age-pill.minor{background:rgba(220,38,38,.1);border-color:rgba(220,38,38,.28);color:var(--danger)}
.form-control-danger{border-color:rgba(220,38,38,.45);box-shadow:0 0 0 4px rgba(220,38,38,.08)}
.checkbox-stack-vertical{align-items:flex-start;justify-content:flex-end}

@media (max-width:1100px){
  .compact-2{grid-template-columns:1fr}
  .entity-row-host{flex-direction:column}
  .entity-row-meta-host{width:100%;align-items:flex-start;text-align:left}
  .host-status-line{justify-content:flex-start}
}
