.h5-.h5-page{
  --peace-blue:#5b8fdc;
  --peace-cyan:#8ed6cf;
  --care-pink:#f07ca3;
  --care-cream:#fff8ef;
  --glass:rgba(255,255,255,.82);
  background:
    radial-gradient(circle at 12% 6%, rgba(240,124,163,.22), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(142,214,207,.24), transparent 30%),
    linear-gradient(180deg,#fffaf5 0%,#f6fbff 44%,#f7f8fb 100%);
}
.top-bar{
  background:rgba(255,255,255,.86)!important;
  border-bottom:0.5px solid rgba(255,255,255,.7);
}
.logo-icon{
  background:linear-gradient(135deg,#7bd6c4,#43c887);
  color:#fff;
}
.logo-text{color:#213044}
.tab-bar{background:transparent}
.tab-item{
  min-height:27px;
  padding:7px 17px;
  border-color:rgba(226,232,240,.68)!important;
}
.tab-item.active{
  background:linear-gradient(135deg,#5b8fdc,#7bd6c4);
  box-shadow:0 7px 16px rgba(91,143,220,.24);
}
.mode-hero-switch{
  gap:9px;
  margin-top:11px;
}
.mode-hero-card{
  min-height:136px;
  border-radius:17px;
  border:0.5px solid rgba(255,255,255,.62);
}
.mode-hero-card.active::after{
  content:'';
  position:absolute;
  inset:5px;
  border:1px solid rgba(255,255,255,.62);
  border-radius:14px;
  pointer-events:none;
}
.mode-hero-title{font-size:17px}
.mode-hero-desc{font-size:11px}
.overview-focus-card{
  border-radius:17px;
  background:
    radial-gradient(circle at 92% 16%, rgba(240,124,163,.18), transparent 24%),
    linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,248,239,.92));
  border:0.5px solid rgba(255,255,255,.72);
  box-shadow:0 12px 27px rgba(137,91,110,.12);
}
.overview-focus-title{
  font-size:26px;
  letter-spacing:-0.5px;
}
.overview-focus-eyebrow,.overview-focus-label{
  color:#8b7280;
}
.overview-risk-tag.safe{background:#eaf8ef;color:#2aa56f}
.overview-risk-tag.risk{background:#fff2df;color:#bb6b00}
.overview-action-card{
  min-height:75px;
  border-radius:14px;
  background:var(--glass);
  backdrop-filter:blur(9px);
}
.overview-action-card.primary{
  background:linear-gradient(135deg,#f07ca3,#f5a46f);
  box-shadow:0 9px 18px rgba(240,124,163,.24);
}
.overview-action-title{font-size:16px}
.care-message-card,.device-radar-card,.care-task-card{
  border-radius:16px;
  backdrop-filter:blur(9px);
}
.care-message-card{
  background:
    radial-gradient(circle at 90% 4%, rgba(240,124,163,.2), transparent 26%),
    linear-gradient(135deg,#fff,#fff6ee);
}
.device-radar-card{
  background:
    radial-gradient(circle at 88% 8%, rgba(126,214,196,.22), transparent 28%),
    linear-gradient(135deg,#f9fcff,#f1fff8);
}
.care-task-card{
  background:
    radial-gradient(circle at 8% 0%, rgba(255,216,153,.2), transparent 28%),
    linear-gradient(135deg,#fffdf8,#f7fbff);
}
.device-radar-grid view,.overview-focus-item{
  border-radius:11px;
  background:rgba(255,255,255,.74);
}
.status-grid.secondary-grid,.charts-row,.bottom-stats-row,.device-status-row{
  display:grid;
}
.device-status-row{display:flex}
.anomaly-section{display:block}
.alert-settings-section{display:none}
.overview-secondary-card{
  border-radius:13px;
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(7px);
}
.guardian-hero{
  border-radius:16px;
  background:
    radial-gradient(circle at 88% 10%, rgba(126,214,196,.24), transparent 26%),
    linear-gradient(135deg,#f7fbff,#fff8ef);
}
.guardian-stat-card,.guardian-action-card,.guardian-guide,.guardian-list-section{
  border-radius:14px;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(7px);
}