@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg0:#020617;
  --bg1:#0f172a;
  --bg2:#1e293b;
  --panel:rgba(15, 23, 42, .62);
  --panel2:rgba(30, 41, 59, .72);
  --stroke:rgba(255,255,255,.08);
  --stroke2:rgba(255,255,255,.12);
  --text:rgba(255,255,255,.92);
  --muted:rgba(255,255,255,.62);
  --muted2:rgba(255,255,255,.42);
  --shadow: 0 18px 55px rgba(0,0,0,.55);
  --shadow2: 0 10px 28px rgba(0,0,0,.45);
  --radius: 22px;
  --radius2: 16px;
  --accent:#06b6d4;
  --accent2:#10b981;
  --ok:#22c55e;
  --warn:#f59e0b;
  --bad:#ef4444;
  --focus: 0 0 0 3px rgba(6,182,212,.22);
  --glass: blur(18px);
  --sideW: 92px;
  --topH: 78px;
  --cardPad: 22px;
}

html,body{ height:100%; }
body.neo{
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color: var(--text);
  background:
          radial-gradient(1200px 600px at 20% 10%, rgba(6,182,212,.12), transparent 60%),
          radial-gradient(1000px 500px at 80% 30%, rgba(16,185,129,.12), transparent 60%),
          radial-gradient(900px 500px at 70% 90%, rgba(34,197,94,.06), transparent 60%),
          linear-gradient(180deg, var(--bg0), var(--bg2));
  overflow-x:hidden;
}

html:not(.dark) body.neo{
  --panel: rgba(255,255,255,.72);
  --panel2: rgba(255,255,255,.78);
  --stroke: rgba(0,0,0,.10);
  --stroke2: rgba(0,0,0,.14);
  --text: rgba(15,18,34,.92);
  --muted: rgba(15,18,34,.62);
  --muted2: rgba(15,18,34,.42);
  background:
          radial-gradient(1200px 600px at 20% 10%, rgba(6,182,212,.12), transparent 60%),
          radial-gradient(1000px 500px at 80% 30%, rgba(16,185,129,.10), transparent 60%),
          linear-gradient(180deg, #f0f9ff, #e0f2fe);
}

body.neo::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.22;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

@keyframes neoFadeInUp{ from{ opacity:0; transform: translateY(10px);} to{ opacity:1; transform: translateY(0);} }
.animate-fade-in{ animation: neoFadeInUp .45s ease-out both; }
.hide-scrollbar::-webkit-scrollbar{ display:none; }
.hide-scrollbar{ -ms-overflow-style:none; scrollbar-width:none; }
.font-display{ font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial; }

#page-content{
  min-height:100vh;
}
#page-content .neo-content{
  padding-left: calc(var(--sideW) + 22px);
  padding-top: calc(var(--topH) + 40px);
  padding-right: 22px;
}

.neo-main{ max-width: 80rem; margin: 0 auto; }
.neo-footer{ max-width: 80rem; margin: 0 auto; }
.neo-pagehead{ max-width: 80rem; }

@media (max-width: 1023px){
  #page-content .neo-content{ padding-left: 18px; }
}
@media (max-width: 640px){
  #page-content .neo-content{ padding-right: 14px; padding-left: 14px; padding-top: calc(var(--topH) + 14px); }
}

.glass-panel{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  background-color: var(--panel);
  border: 1px solid var(--stroke);
  border-radius: var(--radius);
  box-shadow: var(--shadow2);
  backdrop-filter: var(--glass);
  -webkit-backdrop-filter: var(--glass);
}

.neo-cardhead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 14px;
  margin-bottom: 16px;
}
.neo-title{
  font-size: 15px;
  font-weight: 750;
  letter-spacing: .01em;
  color: var(--text);
}
.neo-sub{
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
}
.neo-meta{ display:flex; align-items:center; gap: 8px; flex-wrap:wrap; justify-content:flex-end; }
.neo-chip{
  height: 26px;
  display:inline-flex;
  align-items:center;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.86);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .04em;
}
.neo-chip--soft{ background: rgba(255,255,255,.04); color: rgba(255,255,255,.72); }

.dash-pill{
  display:inline-flex;
  align-items:center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(6,182,212,.16);
  border: 1px solid rgba(6,182,212,.30);
  color: rgba(255,255,255,.92);
  font-weight: 800;
  font-size: 12px;
}
.dash-muted{ color: var(--muted); font-size: 12px; }

.dash-wrap{ padding: 2px 0 26px; }
.dash-grid{
  display:grid;
  grid-template-columns: 1fr 360px;
  gap: 18px;
  align-items:start;
  max-width: 80rem;
  margin: 0 auto;
}
.dash-main{ display:flex; flex-direction:column; gap: 18px; }
.dash-side{ display:flex; flex-direction:column; gap: 18px; }

.dash-hero{ padding: var(--cardPad); display:grid; grid-template-columns: 1.1fr .9fr; gap: 18px; overflow:hidden; position:relative; }
.dash-hero::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
          radial-gradient(520px 260px at 18% 0%, rgba(6,182,212,.18), transparent 60%),
          radial-gradient(520px 260px at 78% 24%, rgba(16,185,129,.18), transparent 60%);
  pointer-events:none;
  opacity:.9;
}
.dash-hero > *{ position:relative; z-index: 1; }
.dash-kicker{ font-size: 12px; color: rgba(255,255,255,.62); font-weight: 700; letter-spacing:.06em; text-transform: uppercase; }
.dash-hero-title{ margin-top: 6px; font-size: 34px; line-height: 1.05; font-weight: 850; letter-spacing:-.02em; }
.dash-hero-sub{ margin-top: 10px; font-size: 13px; color: rgba(255,255,255,.66); max-width: 520px; }
.dash-metrics{ margin-top: 18px; display:flex; gap: 16px; flex-wrap:wrap; }
.dash-metric{ min-width: 180px; padding-left: 12px; border-left: 2px solid rgba(6,182,212,.55); }
.dash-metric-k{ font-size: 11px; color: rgba(255,255,255,.55); font-weight: 800; letter-spacing:.10em; text-transform: uppercase; }
.dash-metric-v{ margin-top: 6px; display:flex; align-items:baseline; gap: 10px; }
.dash-metric-num{ font-size: 26px; font-weight: 900; letter-spacing:-.01em; }
.dash-metric-sym{ font-size: 12px; color: rgba(255,255,255,.62); font-weight: 700; }
.dash-hero-actions{ margin-top: 18px; display:flex; gap: 10px; flex-wrap:wrap; }
.neo-btn{ height: 46px; padding: 0 14px; display:inline-flex; align-items:center; gap: 10px; font-weight: 800; font-size: 13px; letter-spacing:.01em; }
.neo-btn[disabled]{ opacity:.7; cursor:not-allowed; }
.dash-btn-ic svg{ width: 18px; height: 18px; }

.dash-hero-art{ display:flex; justify-content:flex-end; align-items:center; }
.dash-hero-media,
.dash-hero-illus{ width: 100%; max-width: 360px; aspect-ratio: 16/9; border-radius: 22px; overflow:hidden; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04); box-shadow: 0 18px 55px rgba(0,0,0,.38); }
.dash-hero-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.dash-hero-illus svg{ width:100%; height:100%; display:block; }

.dash-block{ padding: var(--cardPad); }
.dash-devicegrid{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.dash-device{
  position:relative;
  padding: 14px 14px 12px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  transition: transform .18s ease, background-color .18s ease, border-color .18s ease;
  overflow:hidden;
}
.dash-device:hover{ transform: translateY(-1px); background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
.dash-device.is-accent{ background: rgba(6,182,212,.18); border-color: rgba(6,182,212,.22); }
.dash-device.is-accent:hover{ background: rgba(6,182,212,.22); border-color: rgba(6,182,212,.30); }
.dash-device-ic{ width: 42px; height: 42px; border-radius: 16px; border:1px solid rgba(255,255,255,.10); background: rgba(0,0,0,.12); display:flex; align-items:center; justify-content:center; color: rgba(255,255,255,.86); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.dash-device-ic svg{ width: 20px; height:20px; }
.dash-device-name{ margin-top: 10px; font-weight: 850; font-size: 13px; }
.dash-device-sub{ margin-top: 2px; color: rgba(255,255,255,.58); font-size: 11px; }
.dash-device-toggle{ position:absolute; top: 12px; right: 12px; }
.neo-switch{ display:inline-flex; width: 36px; height: 20px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.06); position:relative; }
.neo-switch::after{ content:""; position:absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 99px; background: rgba(255,255,255,.70); box-shadow: 0 6px 12px rgba(0,0,0,.28); transition: transform .18s ease, background-color .18s ease; }
.neo-switch.is-on{ background: rgba(6,182,212,.22); border-color: rgba(6,182,212,.28); }
.neo-switch.is-on::after{ transform: translateX(16px); background: rgba(255,255,255,.92); }

.dash-lower{ display:grid; grid-template-columns: 360px 1fr; gap: 18px; }
.dash-gauge{ padding: var(--cardPad); position:relative; overflow:hidden; }
.gauge{ margin-top: 4px; position:relative; width: 100%; max-width: 360px; aspect-ratio: 1/1; margin-left:auto; margin-right:auto; }
.gauge-ring{
  position:absolute; inset: 10px;
  border-radius: 999px;
  background:
          radial-gradient(circle at 50% 50%, rgba(255,255,255,.06), rgba(255,255,255,0) 55%),
          conic-gradient(from 210deg, rgba(6,182,212,.95), rgba(16,185,129,.85), rgba(6,182,212,.95));
  mask: radial-gradient(circle, transparent 54%, #000 55%);
  opacity:.92;
  filter: drop-shadow(0 18px 28px rgba(0,0,0,.35));
}
.gauge::before{
  content:"";
  position:absolute; inset: 22px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.gauge-needle{ position:absolute; left: 50%; top: 50%; width: 44%; height: 2px; background: rgba(255,255,255,.86); transform-origin: 0% 50%; transform: rotate(-120deg); border-radius: 99px; box-shadow: 0 0 0 3px rgba(6,182,212,.18), 0 10px 18px rgba(0,0,0,.35); }
.gauge-needle::after{ content:""; position:absolute; right:-6px; top:-4px; width: 10px; height: 10px; border-radius: 99px; background: rgba(255,255,255,.92); box-shadow: 0 0 22px rgba(6,182,212,.32); }
.gauge-center{ position:absolute; inset: 0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.gauge-val{ font-size: 40px; font-weight: 950; letter-spacing:-.02em; }
.gauge-sub{ margin-top: 2px; font-size: 12px; color: rgba(255,255,255,.62); font-weight: 700; }

.dash-apps{ padding: var(--cardPad); }
.dash-apps-list{ display:flex; flex-direction:column; gap: 10px; }
.dash-app{
  display:flex; align-items:center; gap: 12px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  transition: transform .18s ease, background-color .18s ease, border-color .18s ease;
}
.dash-app:hover{ transform: translateY(-1px); background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
.dash-app-ava{ width: 44px; height: 44px; border-radius: 16px; overflow:hidden; border: 1px solid rgba(255,255,255,.10); background: rgba(0,0,0,.14); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); flex: 0 0 auto; }
.dash-app-ava img{ width:100%; height:100%; object-fit:cover; display:block; }
.dash-app-fallback{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-weight: 900; color: rgba(255,255,255,.70); }
.dash-app-name{ flex: 1; min-width: 0; font-weight: 850; font-size: 13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dash-app-arrow{ width: 34px; height: 34px; border-radius: 14px; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04); display:flex; align-items:center; justify-content:center; color: rgba(255,255,255,.70); }
.dash-app-arrow svg{ width: 16px; height: 16px; }
.dash-empty{ padding: 18px; text-align:center; color: rgba(255,255,255,.62); }

.dash-rightblock{ padding: var(--cardPad); }
.dash-mini-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.dash-mini{
  position:relative;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  min-height: 86px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.dash-mini:hover{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); }
.dash-mini-title{ font-weight: 900; font-size: 13px; }
.dash-mini-sub{ color: rgba(255,255,255,.62); font-size: 11px; margin-top: 2px; }
.dash-mini.is-blue{ background: rgba(6,182,212,.20); border-color: rgba(6,182,212,.22); }
.dash-mini.is-warm{ background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.18); }
.dash-mini.is-green{ background: rgba(34,197,94,.12); border-color: rgba(34,197,94,.18); }

.neo-toggle{ position:absolute; top: 12px; right: 12px; }
.neo-toggle input{ position:absolute; opacity:0; pointer-events:none; }
.neo-toggle-ui{
  width: 40px; height: 22px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  display:block;
  position:relative;
}
.neo-toggle-ui::after{
  content:"";
  position:absolute;
  top: 2px; left: 2px;
  width: 18px; height: 18px;
  border-radius: 99px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 8px 14px rgba(0,0,0,.32);
  transition: transform .18s ease;
}
.neo-toggle input:checked + .neo-toggle-ui{ background: rgba(6,182,212,.22); border-color: rgba(6,182,212,.28); }
.neo-toggle input:checked + .neo-toggle-ui::after{ transform: translateX(18px); background: rgba(255,255,255,.92); }

.dash-members{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-bottom: 14px; }
.dash-member{ text-align:center; padding: 10px 8px; border-radius: 18px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); }
.dash-member.is-me{ background: rgba(6,182,212,.10); border-color: rgba(6,182,212,.18); }
.dash-ava{ width: 38px; height: 38px; border-radius: 999px; margin: 0 auto 8px; display:flex; align-items:center; justify-content:center; font-weight: 900; color: #fff; background: linear-gradient(140deg, rgba(6,182,212,.90), rgba(16,185,129,.90)); border: 1px solid rgba(255,255,255,.16); }
.dash-ava.is-blue{ background: linear-gradient(140deg, rgba(6,182,212,.95), rgba(6,182,212,.55)); }
.dash-ava.is-violet{ background: linear-gradient(140deg, rgba(16,185,129,.95), rgba(16,185,129,.55)); }
.dash-ava.is-warm{ background: linear-gradient(140deg, rgba(245,158,11,.95), rgba(245,158,11,.55)); }
.dash-member-name{ font-weight: 900; font-size: 12px; }
.dash-member-sub{ margin-top: 2px; font-size: 10px; color: rgba(255,255,255,.62); }

/* --- FIX: REWARDS GRID --- */
.dash-rewards{
  display:grid;
  /* На десктопе в боковой панели используем 3 колонки, чтобы числа влезали */
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.dash-day{
  padding: 8px 4px; /* Уменьшены боковые отступы */
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  text-align:center;
  /* Предотвращаем переполнение */
  overflow: hidden;
}
.dash-day .d{
  font-size: 10px;
  font-weight: 900;
  color: rgba(255,255,255,.58);
  letter-spacing:.06em;
  text-transform: uppercase;
}
.dash-day .r{
  margin-top: 4px;
  font-weight: 950;
  font-size: 11px; /* Чуть уменьшен шрифт для длинных чисел */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dash-day.done{ background: rgba(34,197,94,.10); border-color: rgba(34,197,94,.16); }
.dash-day.current{ background: linear-gradient(140deg, rgba(6,182,212,.90), rgba(16,185,129,.80)); border-color: rgba(255,255,255,.14); }
.dash-day.current .d,.dash-day.current .r{ color: rgba(255,255,255,.95); }

.dash-chart .dash-spark{ margin-top: 6px; }
.dash-spark svg{ display:block; }
.dash-spark-meta{ margin-top: 10px; display:flex; justify-content:space-between; align-items:center; }
.dash-spark-k{ font-size: 11px; color: rgba(255,255,255,.58); font-weight: 800; letter-spacing:.08em; text-transform: uppercase; }
.dash-spark-v{ font-size: 14px; font-weight: 950; }

@media (max-width: 1280px){
  .dash-grid{ grid-template-columns: 1fr 340px; }
  .dash-lower{ grid-template-columns: 340px 1fr; }
}
@media (max-width: 1023px){
  .dash-grid{ grid-template-columns: 1fr; }
  .dash-hero{ grid-template-columns: 1fr; }
  .dash-hero-art{ justify-content:flex-start; }
  .dash-devicegrid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .dash-lower{ grid-template-columns: 1fr; }
  .gauge{ max-width: 320px; }
  .dash-members{ grid-template-columns: repeat(4, minmax(0,1fr)); }

  /* Когда сайдбар переходит вниз и становится широким, можно вернуть 7 колонок */
  .dash-rewards{ grid-template-columns: repeat(7, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .dash-hero-title{ font-size: 30px; }
  .dash-metric{ min-width: 0; }
  .dash-devicegrid{ grid-template-columns: 1fr; }
  .dash-mini-grid{ grid-template-columns: 1fr; }
  .dash-members{ grid-template-columns: repeat(2, minmax(0,1fr)); }

  /* На мобильных снова 3 колонки для компактности */
  .dash-rewards{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}

.text-gradient-style,
.text-gradient-primary{
  background-image: linear-gradient(120deg, #ffffff 0%, rgba(255,255,255,.75) 55%, rgba(255,255,255,.55) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.btn-style,
.neo-btn{
  border-radius: 16px;
  border:1px solid var(--stroke);
  background: rgba(255,255,255,.06);
  color: var(--text);
  box-shadow: 0 10px 28px rgba(0,0,0,.35);
  backdrop-filter: blur(14px);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.btn-style::before,
.btn-style::after,
.neo-btn::before,
.neo-btn::after{
  display: none !important;
}

.btn-tab-style::before,
.btn-tab-style::after{
  display: none !important;
}

.btn-tab-style{
  background: rgba(6,182,212,.12) !important;
  border: 1px solid rgba(6,182,212,.25) !important;
  box-shadow: 0 0 16px rgba(6,182,212,.15) !important;
}

.btn-tab-style:hover{
  background: rgba(6,182,212,.16) !important;
  border-color: rgba(6,182,212,.30) !important;
}

.btn-style-secondary{
  border-radius: 16px;
  border:1px solid var(--stroke);
  background: rgba(255,255,255,.04);
  color: var(--text);
  backdrop-filter: blur(14px);
  transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.btn-style-secondary:hover{ background: rgba(255,255,255,.07); box-shadow: 0 12px 30px rgba(0,0,0,.35); transform: translateY(-1px); }
.btn-style:hover,
.neo-btn:hover{ transform: translateY(-1px); box-shadow: 0 16px 36px rgba(0,0,0,.45); background: rgba(255,255,255,.08); }
.btn-style:active,
.neo-btn:active{ transform: translateY(0); }
.neo-btn--primary{ background: linear-gradient(120deg, rgba(6,182,212,.95), rgba(16,185,129,.9)); border-color: rgba(255,255,255,.14); }
.neo-btn--primary:hover{ background: linear-gradient(120deg, rgba(6,182,212,1), rgba(16,185,129,.98)); }

input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="search"],textarea,select{
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  color: var(--text) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
input::placeholder,textarea::placeholder{ color: rgba(255,255,255,.35); }
input:focus,textarea:focus,select:focus{ outline:none !important; box-shadow: var(--focus) !important; border-color: rgba(6,182,212,.35) !important; }

.toastify{ border-radius: 14px !important; border: 1px solid rgba(255,255,255,.10) !important; backdrop-filter: blur(14px); }

.preloader{
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(2,6,23,.75);
  backdrop-filter: blur(14px);
}
.preloader.hidden{ display:none; }
.loader-circle{
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 3px solid rgba(255,255,255,.12);
  border-top-color: rgba(6,182,212,.95);
  animation: neoSpin .9s linear infinite;
  box-shadow: 0 0 30px rgba(6,182,212,.25);
}
@keyframes neoSpin{ to{ transform: rotate(360deg); } }

.neo-guest-tools{ position:absolute; top: 18px; right: 18px; z-index:60; }
.neo-guest-tools-inner{
  display:flex; align-items:center; gap:10px;
  padding: 8px 10px;
  border-radius: 16px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.05);
  backdrop-filter: var(--glass);
}
.neo-divider{ width:1px; height:18px; background: rgba(255,255,255,.12); }
.neo-auth-card{ max-width: 440px; }

.neo-sidebar{
  position: fixed;
  top: 18px;
  left: 18px;
  bottom: 18px;
  width: var(--sideW);
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(15, 23, 42, .70);
  backdrop-filter: blur(18px);
  box-shadow: 0 26px 70px rgba(0,0,0,.55);
  z-index: 80;
  display:flex;
  flex-direction:column;
  padding: 14px 10px;
}
.neo-sidebar-top{ display:flex; align-items:center; justify-content:center; position:relative; }
.neo-sidebar-close{
  display:none;
  position:absolute; right:-4px; top:-4px;
  width:38px; height:38px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);
}
.neo-sidebar-close svg{ width:18px; height:18px; margin:auto; }

.neo-logo{
  width: 52px; height: 52px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(140deg, rgba(6,182,212,.95), rgba(16,185,129,.95));
  box-shadow: 0 14px 40px rgba(0,0,0,.40);
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.16);
}
.neo-logo-img{ width: 100%; height: 100%; object-fit: cover; }
.neo-logo-fallback{ font-weight: 800; letter-spacing: .02em; color: #fff; }

.neo-menu{ margin-top: 18px; display:flex; flex-direction:column; gap: 10px; padding: 8px 6px; }
.neo-navitem{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  gap: 10px;
  height: 48px;
  border-radius: 16px;
  border: 1px solid transparent;
  color: rgba(255,255,255,.72);
  background: transparent;
  transition: background-color .16s ease, border-color .16s ease, transform .16s ease;
}
.neo-navitem::before{
  content:"";
  position:absolute;
  left: -10px;
  top: 50%;
  width: 4px;
  height: 26px;
  border-radius: 999px;
  transform: translateY(-50%);
  background: transparent;
  box-shadow: none;
}
.neo-navitem:hover{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.08); transform: translateY(-1px); }
.neo-navitem.is-active{ background: rgba(6,182,212,.16); border-color: rgba(6,182,212,.26); color: rgba(255,255,255,.92); }
.neo-navitem.is-active::before{
  background: rgba(6,182,212,.95);
  box-shadow: 0 0 0 4px rgba(6,182,212,.16);
}
.neo-ic svg{ width: 20px; height: 20px; }
.neo-navtext{ display:none; font-weight:600; font-size: 13px; }

.neo-sidebar-bottom{ margin-top:auto; padding: 10px 6px 2px; }
.neo-side-tools{ display:flex; flex-direction:column; gap: 10px; align-items:center; }

.neo-topbar{
  position: fixed;
  top: 18px;
  right: 18px;
  left: auto;
  width: auto;
  height: var(--topH);
  z-index: 70;
}
.neo-topbar-inner{
  height: 100%;
  display:flex;
  align-items:center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(15, 23, 42, .60);
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
}

.neo-burger{
  display:none;
  width: 42px; height: 42px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);
}
.neo-burger svg{ width: 20px; height:20px; margin:auto; }

.neo-actions{ display:flex; align-items:center; gap: 10px; margin-left: auto; }
.neo-iconbtn{
  width: 42px; height: 42px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);
  display:flex; align-items:center; justify-content:center;
  position:relative;
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease;
}
.neo-iconbtn svg{ width: 20px; height: 20px; }
.neo-iconbtn:hover{ transform: translateY(-1px); background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.14); }
.neo-iconbtn--soft{ background: rgba(255,255,255,.04); }
.neo-dot{
  position:absolute;
  top: 10px; right: 10px;
  width: 8px; height: 8px;
  border-radius: 99px;
  background: rgba(6,182,212,.95);
  box-shadow: 0 0 0 3px rgba(6,182,212,.18);
}

.neo-user{ margin-left: 4px; }
.neo-userbtn{
  display:flex;
  align-items:center;
  gap: 10px;
  height: 42px;
  padding: 0 12px 0 10px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color: rgba(255,255,255,.88);
}
.neo-userbtn:hover{ background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.14); }
.neo-userava{
  width: 28px; height: 28px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(140deg, rgba(6,182,212,.85), rgba(16,185,129,.85));
  color: #fff;
  font-weight: 700;
  font-size: 12px;
  border: 1px solid rgba(255,255,255,.16);
}
.neo-username{ max-width: 160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size: 13px; font-weight: 600; }
.neo-chev{ width: 14px; height: 14px; opacity: .7; transition: transform .18s ease; }

.neo-dd{
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(15,23,42,.78);
  backdrop-filter: blur(18px);
  box-shadow: 0 22px 60px rgba(0,0,0,.55);
}
.neo-dd-head{ padding: 10px 14px 12px; border-bottom: 1px solid rgba(255,255,255,.08); }
.neo-dd-kicker{ font-size: 11px; color: rgba(255,255,255,.55); }
.neo-dd-main{ font-size: 13px; font-weight: 600; color: rgba(255,255,255,.9); overflow:hidden; text-overflow:ellipsis; }
.neo-dd-item{ display:block; padding: 10px 14px; font-size: 13px; color: rgba(255,255,255,.82); }
.neo-dd-item:hover{ background: rgba(255,255,255,.06); }
.neo-dd-item--danger{ color: rgba(239,68,68,.95); }
.neo-dd-item--danger:hover{ background: rgba(239,68,68,.10); }

.neo-locale{ padding: 0 10px; width: auto; gap: 8px; }
.neo-dd-item{ text-decoration:none; }

.neo-overlay{ display:none; position:fixed; inset:0; background: rgba(0,0,0,.55); z-index: 75; }

@media (max-width: 1023px){
  .neo-topbar{ left: 18px; right: 18px; width: auto; }
  .neo-topbar-inner{ width: 100%; justify-content: space-between; }
  .neo-burger{ display:inline-flex; }
  .neo-sidebar{
    transform: translateX(-115%);
    transition: transform .22s ease;
  }
  .neo-sidebar.open{ transform: translateX(0); }
  .neo-sidebar-close{ display:inline-flex; align-items:center; justify-content:center; }
  .neo-overlay{ display:block; }
}

@media (max-width: 640px){
  .neo-topbar-inner{ padding: 12px; gap: 10px; }
  .neo-iconbtn{ width: 40px; height: 40px; }
  .neo-userbtn{ padding-right: 10px; }
  .neo-username{ display:none; }
}

.custom-pagination nav[role="navigation"] .relative.inline-flex{
  background-color: transparent !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.65) !important;
}
.custom-pagination nav[role="navigation"] span[aria-current="page"] > span{
  background-color: rgba(255,255,255,0.10) !important;
  color: rgba(255,255,255,0.95) !important;
  border-color: rgba(255,255,255,0.18) !important;
  font-weight: 700 !important;
}
.custom-pagination nav[role="navigation"] a:hover{
  background-color: rgba(255,255,255,0.08) !important;
  color: rgba(255,255,255,0.95) !important;
}
.custom-pagination nav[role="navigation"] svg{ color: rgba(255,255,255,0.55) !important; }
html:not(.dark) .custom-pagination nav[role="navigation"] .relative.inline-flex{
  border-color: rgba(0,0,0,0.10) !important;
  color: rgba(0,0,0,0.65) !important;
}
html:not(.dark) .custom-pagination nav[role="navigation"] span[aria-current="page"] > span{
  background-color: rgba(0,0,0,0.05) !important;
  color: rgba(0,0,0,0.85) !important;
  border-color: rgba(0,0,0,0.10) !important;
}

hr{ border-color: rgba(255,255,255,.08) !important; }

.dark .text-gray-900{ color: rgba(255,255,255,.92) !important; }
.dark .text-gray-800{ color: rgba(255,255,255,.90) !important; }
.dark .text-gray-700{ color: rgba(255,255,255,.84) !important; }
.dark .text-gray-600{ color: rgba(255,255,255,.74) !important; }
.dark .text-gray-500{ color: rgba(255,255,255,.62) !important; }
.dark .text-gray-400{ color: rgba(255,255,255,.48) !important; }

.allow-dropdown{ overflow: visible !important; }