/* ===== 登录 ===== */
.login-screen{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;background:var(--navy)}
.login-hero{padding:7vh 5vw;display:flex;flex-direction:column;justify-content:center;color:#dbe7fb;
  background:radial-gradient(1200px 600px at 15% -10%,#1c3a63 0%,#0e1a2a 55%)}
.login-hero-brand{display:flex;align-items:center;gap:16px;margin-bottom:42px}
.logo-lg{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,#5ea1ff,#1f5fef);
  display:grid;place-items:center;font-weight:800;color:#fff;font-size:19px;box-shadow:0 10px 30px rgba(35,103,232,.4)}
.hero-title{font-size:26px;font-weight:750;color:#fff;letter-spacing:.3px}
.hero-sub{color:#90a6c6;margin-top:6px;font-size:14px}
.hero-points{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.hero-points li{padding-left:30px;position:relative;color:#c4d3ea;font-size:14px}
.hero-points li::before{content:"✓";position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;
  background:rgba(94,161,255,.18);color:#7fb0ff;display:grid;place-items:center;font-size:12px}
.login-card{align-self:center;justify-self:center;width:380px;max-width:86%;background:#fff;border-radius:18px;
  padding:38px 34px;box-shadow:var(--shadow-lg)}
.login-card h2{margin:0 0 4px;font-size:22px}
.login-card .muted{margin:0 0 24px;font-size:12.5px}
.field-label{font-size:11.5px;color:var(--muted);font-weight:600;margin:14px 0 6px}
.login-hint{margin-top:16px;text-align:center;font-size:11.5px;color:var(--faint)}
.login-hint code{background:var(--surface-3);padding:2px 7px;border-radius:6px;font-family:var(--mono)}

/* ===== 应用骨架 ===== */
.app{display:flex;min-height:100vh}
.sidebar{width:var(--sidebar-w);background:var(--navy);color:#cdd9ea;display:flex;flex-direction:column;
  position:fixed;inset:0 auto 0 0;z-index:40}
.brand{height:var(--topbar-h);display:flex;align-items:center;gap:11px;padding:0 20px;border-bottom:1px solid var(--navy-line)}
.logo{width:32px;height:32px;border-radius:9px;background:linear-gradient(135deg,#5ea1ff,#1f5fef);
  display:grid;place-items:center;color:#fff;font-weight:800;font-size:13px;flex:none}
.brand-text b{font-size:14px;color:#fff;display:block;line-height:1.3}
.brand-text span{font-size:9.5px;color:#7488a6;letter-spacing:.4px}
.nav{flex:1;overflow-y:auto;padding:14px 11px 20px}
.nav-group{color:#69809e;font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;
  padding:14px 11px 7px}
.nav-item{height:38px;display:flex;align-items:center;gap:11px;padding:0 11px;border-radius:9px;
  color:#b9c6da;font-size:13px;margin:2px 0;cursor:pointer;white-space:nowrap;position:relative}
.nav-item:hover{background:rgba(255,255,255,.05);color:#fff}
.nav-item.active{background:linear-gradient(90deg,#2a62b8,#1f467f);color:#fff;box-shadow:inset 3px 0 0 #69a5ff}
.nav-ico{width:18px;text-align:center;font-size:14px;flex:none;opacity:.92}
.nav-item .nav-badge{margin-left:auto;background:rgba(255,255,255,.12);border-radius:99px;font-size:10px;padding:1px 7px}
.sidebar-bottom{padding:12px 14px 16px;border-top:1px solid var(--navy-line)}
.user{display:flex;align-items:center;gap:10px}
.avatar{width:32px;height:32px;border-radius:50%;background:#cfe0ff;color:#274270;display:grid;place-items:center;
  font-weight:700;font-size:12px;flex:none}
.user-meta{flex:1;min-width:0}
.user-name{font-size:12px;color:#fff;line-height:1.3}
.user-meta small{color:#7488a6;font-size:10px}
.ghost-sm{background:transparent;color:#8296b3;border:0;width:30px;height:30px;border-radius:8px}
.ghost-sm:hover{background:rgba(255,255,255,.08);color:#fff}

.main{margin-left:var(--sidebar-w);flex:1;min-width:0;display:flex;flex-direction:column;min-height:100vh}
.topbar{height:var(--topbar-h);background:rgba(255,255,255,.92);backdrop-filter:blur(12px);
  display:flex;align-items:center;gap:16px;padding:0 22px;border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:30}
.crumb{font-size:12px;color:var(--muted);font-weight:600;min-width:170px}
.crumb b{color:var(--ink);font-weight:700}
.top-search{flex:1;max-width:560px;position:relative;margin:0 auto}
.top-search input{padding-left:34px;height:36px;background:var(--surface-2)}
.top-search::before{content:"⌕";position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint);font-size:16px}
.kbd-hint{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--faint);
  border:1px solid var(--line-strong);border-radius:5px;padding:1px 6px;background:#fff}
.top-actions{display:flex;align-items:center;gap:9px;margin-left:auto}
.icon-btn{height:36px;min-width:36px;padding:0 8px;border:1px solid var(--line);border-radius:9px;background:#fff;
  color:#5c6b7f;font-size:14px;display:inline-flex;align-items:center;justify-content:center}
.icon-btn:hover{border-color:var(--blue);color:var(--blue)}
.view{padding:24px 26px 60px;max-width:1720px;width:100%;margin:0 auto}

/* 页头 */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}
.page-head h1{margin:0;font-size:22px;letter-spacing:.2px}
.page-head p{margin:5px 0 0;color:var(--muted);font-size:12.5px}
.page-actions{display:flex;gap:9px;align-items:center;flex:none}

/* 窄屏兜底：防止顶栏横向溢出（桌面宽屏不受影响） */
html,body{overflow-x:hidden}
@media (max-width:1180px){
  .crumb{display:none}
  .topbar{gap:10px;padding:0 14px}
  .top-search{min-width:0;max-width:none}
  .top-actions{gap:7px}
  #quickUpload{padding:0 12px;font-size:12.5px}
  .view{padding:18px 16px 60px}
}
