:root{
  --rosen-dark-blue:#2323B2;
  --rosen-red:#B1162E;
  --rosen-night-blue:#375578;
  --rosen-cyan:#1395D9;
  --rosen-petrol:#137C77;
  --rosen-red-violet:#BF497C;
  --rosen-brand-gradient:linear-gradient(90deg, var(--rosen-cyan) 0%, var(--rosen-petrol) 34%, var(--rosen-night-blue) 70%, var(--rosen-red-violet) 100%);
  --rosen-login-gradient:linear-gradient(90deg, var(--rosen-night-blue), var(--rosen-petrol));
  --sys-bg:#f4f7fb;
  --sys-bg-2:#e9eef7;
  --sys-surface:#ffffff;
  --sys-surface-2:#f8fbff;
  --sys-surface-3:#eef4fb;
  --sys-border:rgba(55,85,120,.18);
  --sys-border-strong:rgba(55,85,120,.34);
  --sys-text:var(--rosen-dark-blue);
  --sys-text-soft:var(--rosen-night-blue);
  --sys-muted:#7d879b;
  --sys-accent:var(--rosen-dark-blue);
  --sys-accent-2:var(--rosen-red);
  --sys-accent-3:var(--rosen-cyan);
  --sys-accent-4:var(--rosen-petrol);
  --sys-accent-5:var(--rosen-red-violet);
  --sys-success:var(--rosen-petrol);
  --sys-warning:#d89a2b;
  --sys-danger:var(--rosen-red);
  --sys-shadow:0 18px 42px rgba(55,85,120,.14);
  --sys-shadow-soft:0 10px 26px rgba(55,85,120,.12);
  --sys-radius:8px;
  --sys-radius-sm:6px;
}

html,
body{
  color:var(--rosen-night-blue);
  background:
    radial-gradient(circle at 20% 20%, rgba(177,22,46,.18), transparent 35%),
    radial-gradient(circle at 80% 10%, rgba(19,149,217,.20), transparent 40%),
    linear-gradient(135deg, var(--rosen-dark-blue) 0%, var(--rosen-night-blue) 48%, #17333f 100%) !important;
}

body::before{
  background:
    linear-gradient(90deg, rgba(55,85,120,.06) 1px, transparent 1px),
    linear-gradient(180deg, rgba(55,85,120,.05) 1px, transparent 1px),
    linear-gradient(180deg, rgba(10,18,40,.55), rgba(5,10,25,.75)) !important;
  background-size:48px 48px,48px 48px,cover !important;
  filter:none !important;
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(177,22,46,.10), transparent 34%, transparent 70%, rgba(19,124,119,.10)),
    radial-gradient(circle at 18% 14%, rgba(35,35,178,.10), transparent 28%),
    radial-gradient(circle at 82% 8%, rgba(191,73,124,.08), transparent 24%);
}

.content{
  padding:22px 28px 28px !important;
}

.report-table thead th{
  color:var(--sys-text-soft) !important;
}

.glass-card,
.viewer3d-table-card,
.container-card,
.glass-panel,
.register-card,
.auth-card,
.modal-content,
.modal-card{
  border-radius:var(--sys-radius) !important;
  border:1px solid var(--sys-border) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,255,.94)) !important;
  box-shadow:var(--sys-shadow) !important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}


.stat-item,
.zone-item,
.tree-root,
.icon-btn,
.mini-btn,
.action-btn,
.open-selected-btn,
.btn-action,
.btn-new,
.tab-btn{
  border-radius:var(--sys-radius-sm) !important;
}

.stat-label,
.stat-value,
.tree-node-title,
.branch-label{
  color:var(--sys-text) !important;
}

.tree-root.active,
.zone-item.active,
.tree-leaf.active{
  border-color:rgba(47,128,237,.48) !important;
  background:linear-gradient(90deg, rgba(55,85,120,.13), rgba(19,124,119,.08)) !important;
  box-shadow:inset 3px 0 0 var(--rosen-petrol), 0 12px 24px rgba(55,85,120,.12) !important;
}

.tree-dot,
.zone-square{
  background:var(--sys-accent-2) !important;
  box-shadow:none !important;
}

.report-table,
.viewer3d-table,
.container-table{
  background:transparent !important;
}

.report-table thead th,
.viewer3d-table thead,
.container-table th{
  background:rgba(255,255,255,.055) !important;
  color:var(--sys-text-soft) !important;
  border-bottom:1px solid var(--sys-border) !important;
}

.report-table td,
.viewer3d-table tbody td,
.container-table td{
  color:var(--sys-text) !important;
  border-bottom:1px solid rgba(169,190,217,.12) !important;
}

.report-table tbody tr:hover,
.viewer3d-table tbody tr:hover,
.clickable-row:hover{
  background:rgba(47,128,237,.10) !important;
}

.viewer3d-table tbody,
.container-table tbody{
  background:transparent !important;
}

.viewer3d-search,
input,
select,
textarea{
  border-radius:var(--sys-radius-sm) !important;
  border:1px solid var(--sys-border) !important;
  background:rgba(255,255,255,.075) !important;
  color:var(--rosen-night-blue) !important;
  box-shadow:none !important;
}

.viewer3d-search input{
  border:none !important;
  background:transparent !important;
}

input::placeholder,
textarea::placeholder{
  color:var(--sys-muted) !important;
}

.action-btn,
.open-selected-btn,
.btn-action{
  color:#f8fbff !important;
  border-color:var(--rosen-red) !important;
  background:var(--rosen-red) !important;
  box-shadow:none !important;
}

.action-btn:hover,
.open-selected-btn:hover,
.btn-action:hover{
  background:var(--rosen-red-violet) !important;
  border-color:var(--rosen-red-violet) !important;
  filter:none;
  transform:translateY(-1px);
}

.leaf-link{
  color:var(--rosen-dark-blue) !important;
}

.tree-toggle,
.zone-tick-ui,
.pill{
  border-radius:var(--sys-radius-sm) !important;
  border-color:var(--sys-border) !important;
  background:rgba(255,255,255,.07) !important;
  color:var(--sys-text) !important;
}

.tree-toggle i{
  color:var(--sys-text) !important;
}

.platform-thumb{
  border-radius:var(--sys-radius-sm) !important;
  border-color:var(--sys-border) !important;
}

.auth-card label,
.register-card label{
  color:var(--sys-text-soft) !important;
}

.feature-body h3,
.register-title,
.auth-card h3{
  color:var(--rosen-night-blue) !important;
}

.register-button,
.auth-button{
  border-radius:var(--sys-radius-sm) !important;
  color:#f8fbff !important;
  border:1px solid rgba(55,85,120,.58) !important;
  background:var(--rosen-brand-gradient) !important;
  box-shadow:0 12px 24px rgba(55,85,120,.18) !important;
}

@media (max-width: 980px){
  .content{
    padding:16px !important;
  }
}