/* Caesar 登录页左侧面板 —— 直接改写 dist 源码。
   配套：js/main-v9.js 里已删掉 login-decoration / brand-emblem /
   brand-aura / brand-sweep / brand-corner / embers 节点。
   回滚：dist/backups/<ts>-brand-caesar3/ 覆盖回来，或删掉 index.html 里本文件那一行。

   核心：面板做成正方形 + 图 cover 铺满 → 原图 1:1 完整显示，不裁切、无黑边。 */

/* 1) 干掉伪元素：:before 是「圆形遮罩的网格」，:after 是 120%×60% 的
      border-radius:50% 蓝色椭圆（就是那道圆弧阴影）。 */
.login-brand::before,
.login-brand::after { content: none !important; display: none !important; }
.brand-ring, .brand-glow, .deco-circle, .deco-grid,
.brand-aura, .brand-sweep, .brand-corner, .embers { display: none !important; }

/* 2) 左面板 = 正方形。宽 600 → 高 600，图片天然 1:1，cover 正好铺满 */
.login-container { min-height: 0 !important; }
.login-brand {
  position: relative !important;
  align-self: flex-start !important;   /* 不被拉伸，高度才由 aspect-ratio 决定 */
  flex: 1 1 600px !important;
  max-width: 600px !important;
  aspect-ratio: 1 / 1 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  background-color: #0d1420 !important;
  background-image:
    linear-gradient(180deg,
      rgba(10,16,26,0) 58%,
      rgba(10,16,26,.16) 73%,
      rgba(10,16,26,.42) 87%,
      rgba(10,16,26,.62) 100%),
    url("/caesar.png") !important;
  background-repeat: no-repeat, no-repeat !important;
  background-size: 100% 100%, cover !important;
  background-position: center center, center center !important;
}

/* 左面板变宽后右栏只剩 ~400，内边距收一点，表单才不会被撑高 */
.login-form-section { padding: 48px 42px !important; }

/* 3) 文字压在图上，左下角 */
.brand-content {
  position: absolute !important;
  left: 0; right: 0; bottom: 0;
  z-index: 2 !important;
  width: auto !important;
  padding: 0 clamp(38px,7.5%,70px) clamp(30px,5.5%,48px) !important;
  text-align: left !important;
}

/* 4) 标题：白字、无描边、无渐变字、无蓝光晕 */
.brand-title { display: block !important; margin: 0 0 10px !important; font-size: 0 !important; line-height: 1.2 !important; }
.brand-title .brand-line {
  display: block !important;
  font-family: inherit !important;
  font-size: 42px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke-width: 0 !important;
  -webkit-text-stroke-color: transparent !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  filter: none !important;
  animation: none !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.75) !important;
}
.brand-title .brand-sub {
  display: block !important;
  margin-top: 10px !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  letter-spacing: .12em !important;
  text-transform: none !important;
  color: rgba(255,255,255,.92) !important;
  text-shadow: 0 1px 12px rgba(0,0,0,.7) !important;
}

/* 5) 说明行：去掉卡片框，只留白字；不要图标、不要第三行 */
.brand-divider { display: none !important; }
.brand-features { display: block !important; margin: 18px 0 0 !important; gap: 0 !important; text-align: left !important; }
.feature-item {
  display: block !important;
  background: none !important; border: 0 !important; box-shadow: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  padding: 0 !important; margin: 0 0 3px !important; transform: none !important;
}
.feature-item:hover { background: none !important; border: 0 !important; box-shadow: none !important; transform: none !important; }
.feature-item .feature-icon { display: none !important; }
.feature-item:nth-child(3) { display: none !important; }
.feature-desc {
  font-size: 15px !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,.9) !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.72) !important;
}

/* 6) 窄屏：整块变成通栏正方形，文字仍压底 */
@media (max-width: 768px) {
  .login-brand {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: none !important;
    aspect-ratio: 1 / 1 !important;
    align-self: stretch !important;
  }
  .brand-content { padding: 0 30px 30px !important; }
}

/* 7) 登录按钮的 hover 白光带来自 .login-button:before（静止 left:-100%）。
      按钮原来没有裁溢出，所以静止时它露到按钮左边、压在狮子图上。
      裁掉溢出即可：静止时完全不可见，悬停时从左到右扫过。 */
.login-button { position: relative !important; overflow: hidden !important; }

/* 8) 顶部设备状态行（📱名称 / 🌐IP / 💎系统 / 🌍国家 / 💓心跳 / 👤归属 / 📝备注）刷成深色。
      这一行是 CSS 类控色、不是内联：.home-tab-topbar .topbar-val{color:#e5d5d5} 是深色主题的值，
      压在浅色底上几乎看不见。这里按浅色底统一刷黑。备注那格的内联 #64748b 也会被 !important 盖掉
      （带 !important 的样式声明优先于内联样式）。 */
.home-tab-topbar .topbar-val,
.home-tab-topbar .topbar-val.device-name,
.home-tab-topbar .topbar-val.ip-value,
.home-tab-topbar .topbar-val.heartbeat-value,
.home-tab-topbar .topbar-val.green,
.home-tab-topbar .topbar-label {
  color: #111111 !important;
}

/* 8) 字体：跟 Caesar 项目一致。凯撒那边没有本地字体文件，走 Google Fonts CDN，
      国内连不上 —— 所以 index.html 里用非阻塞方式加载，加载不到就落到系统字体，
      视觉上仍然是同一套（Inter → Segoe UI / PingFang / 微软雅黑）。 */
.login-brand,
.brand-content,
.feature-desc {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system,
               BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif !important;
}

/* 9) 去掉登录页左侧面板上浮动的圆形 LOGO 徽章（brand-emblem / brand-logo / img） */
.brand-emblem { display: none !important; }
