:root {
      --bg: #f1f5f9;
      --card: #ffffff;
      --border: #e2e8f0;
      --text: #0f172a;
      --muted: #64748b;
      --muted2: #94a3b8;
      --blue: #2563eb;
      --blue2: #dbeafe;
      --green: #059669;
      --green2: #d1fae5;
      --amber: #d97706;
      --amber2: #fef3c7;
      --rose: #e11d48;
      --rose2: #ffe4e6;
      --dark: #0f172a;
      --shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
      --radius: 20px;
    }
    * { box-sizing: border-box; }
    body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; color: var(--text); background: var(--bg); }
    button, input, textarea, select { font-family: inherit; }
    button { cursor: pointer; }
    .hidden { display: none !important; }
    .login-page {
      min-height: 100vh;
      padding: 24px;
      background: radial-gradient(circle at top left, #dbeafe, transparent 36%), linear-gradient(135deg, #f8fafc, #eef2ff);
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .login-shell {
      max-width: 1160px;
      width: 100%;
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      min-height: 640px;
      border-radius: 32px;
      overflow: hidden;
      background: rgba(255,255,255,0.82);
      border: 1px solid rgba(255,255,255,0.75);
      box-shadow: 0 28px 80px rgba(15,23,42,.22);
      backdrop-filter: blur(16px);
    }
    .login-hero { position: relative; padding: 48px; background: #020617; color: white; overflow: hidden; }
    .login-hero:before {
      content: ""; position: absolute; inset: 0; opacity: .34;
      background: radial-gradient(circle at 20% 20%, #60a5fa, transparent 28%), radial-gradient(circle at 78% 12%, #22c55e, transparent 25%), radial-gradient(circle at 50% 85%, #a78bfa, transparent 30%);
    }
    .login-hero-inner { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
    .tag { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.1); color: #dbeafe; font-size: 14px; }
    .login-hero h1 { font-size: 42px; line-height: 1.15; margin: 34px 0 16px; letter-spacing: -.02em; }
    .login-hero p { max-width: 560px; color: #cbd5e1; line-height: 1.8; margin: 0; }
    .hero-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
    .hero-item { border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.1); border-radius: 18px; padding: 18px; }
    .hero-item b { display: block; margin-top: 10px; font-weight: 600; font-size: 14px; }
    .login-form { padding: 48px; display: flex; flex-direction: column; justify-content: center; }
    .login-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; }
    .login-head h2 { margin: 0; font-size: 28px; }
    .login-head p { margin: 7px 0 0; color: var(--muted); }
    .iconbox { width: 50px; height: 50px; border-radius: 18px; background: var(--blue); color: white; display: grid; place-items: center; font-size: 24px; }
    .btn { border: 0; border-radius: 16px; padding: 12px 16px; font-size: 14px; font-weight: 700; background: #f8fafc; color: #334155; display: inline-flex; align-items: center; justify-content: center; gap: 7px; transition: .15s ease; }
    .btn:hover { transform: translateY(-1px); }
    .btn-primary { background: var(--blue); color: white; box-shadow: 0 12px 24px rgba(37, 99, 235, .22); }
    .btn-dark { background: var(--dark); color: white; }
    .btn-line { background: white; border: 1px solid var(--border); color: #334155; box-shadow: none; }
    .btn-wide { width: 100%; padding: 14px 18px; }
    .divider { margin: 24px 0; color: var(--muted2); font-size: 14px; display: flex; align-items: center; gap: 12px; }
    .divider:before, .divider:after { content: ""; flex: 1; height: 1px; background: var(--border); }
    .field { margin-bottom: 14px; }
    .field label { display: block; font-size: 14px; color: #475569; font-weight: 600; margin-bottom: 8px; }
    .input, .textarea { width: 100%; border: 1px solid var(--border); border-radius: 16px; background: white; padding: 12px 14px; outline: none; color: var(--text); font-size: 14px; }
    .input:focus, .textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(37,99,235,.09); }
    .login-note { margin-top: 20px; background: #f8fafc; color: var(--muted); padding: 16px; border-radius: 18px; line-height: 1.65; font-size: 14px; }
    .code-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
    .app { display: flex; min-height: 100vh; }
    .sidebar { width: 280px; flex: 0 0 280px; background: white; border-right: 1px solid var(--border); padding: 22px; position: sticky; top: 0; height: 100vh; overflow: auto; }
    .brand { display: flex; gap: 12px; align-items: center; margin-bottom: 28px; }
    .brand-logo { width: 48px; height: 48px; border-radius: 18px; background: var(--blue); color: white; display: grid; place-items: center; font-size: 24px; }
    .brand h1 { font-size: 17px; line-height: 1.35; margin: 0; }
    .brand p { font-size: 12px; margin: 4px 0 0; color: var(--muted); }
    .nav { display: grid; gap: 6px; }
    .nav button { width: 100%; border: 0; background: white; color: #475569; text-align: left; border-radius: 16px; padding: 12px 14px; font-weight: 700; display: flex; align-items: center; gap: 12px; }
    .nav button.active { background: var(--blue); color: white; box-shadow: 0 10px 22px rgba(37,99,235,.18); }
    .main { flex: 1; min-width: 0; }
    .topbar { position: sticky; top: 0; z-index: 10; background: rgba(255,255,255,.92); border-bottom: 1px solid var(--border); backdrop-filter: blur(14px); padding: 16px 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .top-left { display: flex; align-items: center; gap: 14px; }
    .menu-btn { display: none; }
    .topbar h2 { margin: 0; font-size: 24px; }
    .topbar p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
    .top-actions { display: flex; align-items: center; gap: 8px; }
    .role-switch { display: flex; background: #f8fafc; border: 1px solid var(--border); border-radius: 16px; padding: 4px; }
    .role-switch button { border: 0; background: transparent; border-radius: 12px; padding: 8px 12px; color: #475569; font-weight: 700; }
    .role-switch button.active { background: var(--dark); color: white; }
    .content { padding: 28px; }
    .content-grid.mobile-on { display: grid; grid-template-columns: minmax(0,1fr) 420px; gap: 24px; align-items: start; }
    .grid { display: grid; gap: 16px; }
    .grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
    .grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .grid-main { grid-template-columns: 1.15fr .85fr; }
    .grid-half { grid-template-columns: .95fr 1.05fr; }
    .card { background: white; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px; }
    .card + .card, .block-space { margin-top: 18px; }
    .card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
    .card-title { display: flex; gap: 12px; align-items: center; }
    .card-icon { min-width: 36px; height: 36px; border-radius: 13px; background: #f1f5f9; display: grid; place-items: center; font-size: 18px; }
    .card h3 { margin: 0; font-size: 17px; }
    .card p.desc { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
    .metric { background: white; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px; display: flex; justify-content: space-between; gap: 10px; align-items: center; }
    .metric .label { color: var(--muted); font-size: 14px; }
    .metric .value { margin-top: 8px; font-size: 28px; font-weight: 850; }
    .metric .sub { margin-top: 4px; color: var(--muted2); font-size: 12px; }
    .metric .micon { width: 48px; height: 48px; border-radius: 18px; background: var(--blue2); color: var(--blue); display: grid; place-items: center; font-size: 22px; }
    .item { border: 1px solid #e8eef6; border-radius: 18px; padding: 15px; background: white; }
    .item.soft { background: #f8fafc; border-color: #f8fafc; }
    .list { display: grid; gap: 12px; }
    .list-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px; border-radius: 18px; background: #f8fafc; }
    .num { width: 32px; height: 32px; border-radius: 50%; background: white; display: grid; place-items: center; color: var(--blue); font-weight: 800; }
    .badge { display: inline-flex; align-items: center; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; border: 1px solid var(--border); white-space: nowrap; }
    .badge-ok { color: var(--green); border-color: #a7f3d0; background: #ecfdf5; }
    .badge-wait { color: var(--amber); border-color: #fde68a; background: #fffbeb; }
    .badge-bad { color: var(--rose); border-color: #fecdd3; background: #fff1f2; }
    .badge-gray { color: #475569; border-color: var(--border); background: #f8fafc; }
    .progress { height: 8px; background: #e2e8f0; border-radius: 999px; overflow: hidden; }
    .progress > i { display: block; height: 100%; background: var(--blue); border-radius: 999px; }
    .table-wrap { overflow: auto; border: 1px solid var(--border); border-radius: 18px; }
    table { border-collapse: collapse; width: 100%; min-width: 760px; font-size: 14px; }
    th { background: #f8fafc; color: var(--muted); font-weight: 700; text-align: left; padding: 13px 14px; }
    td { padding: 13px 14px; border-top: 1px solid #f1f5f9; }
    .mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 12px; }
    .toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
    .search { position: relative; min-width: min(100%, 360px); }
    .search span { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--muted2); }
    .search .input { padding-left: 38px; }
    .chips { display: flex; gap: 8px; flex-wrap: wrap; }
    .chip { border: 1px solid var(--border); background: white; border-radius: 13px; padding: 8px 12px; font-weight: 700; color: #475569; }
    .chip.active { background: var(--dark); color: white; border-color: var(--dark); }
    .seat-grid { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 12px; }
    .seat { border-radius: 18px; text-align: center; padding: 16px 8px; border: 1px solid; }
    .seat.used { background: #eff6ff; border-color: #bfdbfe; color: #1d4ed8; }
    .seat.free { background: #ecfdf5; border-color: #a7f3d0; color: #047857; }
    .seat b { display: block; }
    .seat span { display: block; margin-top: 8px; font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .notice { border-radius: 18px; border: 1px solid #bfdbfe; background: #eff6ff; color: #1e40af; padding: 15px; line-height: 1.7; font-size: 14px; }
    .form-grid { display: grid; gap: 12px; }
    .form-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .phone { width: 100%; max-width: 390px; margin: 0 auto; border: 8px solid #020617; border-radius: 34px; overflow: hidden; background: #f1f5f9; box-shadow: 0 18px 60px rgba(15,23,42,.3); }
    .phone-top { background: #020617; color: white; text-align: center; padding: 10px; font-size: 12px; }
    .phone-body { background: white; padding: 16px; }
    .phone-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
    .phone-title small { color: var(--muted); }
    .phone-title b { display: block; margin-top: 4px; }
    .phone-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .phone-card { border-radius: 18px; padding: 16px; color: white; background: var(--blue); }
    .phone-card.dark { background: var(--dark); }
    .phone-shortcuts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; text-align: center; font-size: 12px; margin-top: 14px; }
    .phone-shortcuts div { background: #f8fafc; border-radius: 16px; padding: 12px 6px; }
    .phone-nav { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; background: white; padding: 12px; color: var(--muted); font-size: 12px; }
    .phone-nav .active { color: var(--blue); font-weight: 800; }
    .mobile-card { display: none; }
    .mobile-overlay { display: none; }
    .mobile-overlay.active { display: block; position: fixed; inset: 0; background: rgba(15,23,42,.35); z-index: 30; }
    .mobile-sidebar { display: none; position: fixed; inset: 0 auto 0 0; width: 292px; background: white; z-index: 31; padding: 22px; overflow:auto; box-shadow: 10px 0 40px rgba(15,23,42,.2); }
    .mobile-sidebar.active { display: block; }
    @media (max-width: 1200px) {
      .grid-4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
      .grid-main, .grid-half, .content-grid.mobile-on { grid-template-columns: 1fr; }
      .phone { max-width: 430px; }
    }
    @media (max-width: 980px) {
      .login-shell { grid-template-columns: 1fr; max-width: 560px; }
      .login-hero { display: none; }
      .sidebar { display: none; }
      .menu-btn { display: inline-flex; }
      .topbar { padding: 14px 16px; }
      .topbar h2 { font-size: 20px; }
      .topbar p { display: none; }
      .content { padding: 16px; }
      .role-switch { display: none; }
      .grid-3, .grid-2 { grid-template-columns: 1fr; }
      .seat-grid { grid-template-columns: repeat(4, 1fr); }
      .table-wrap { display: none; }
      .mobile-card { display: block; }
      .top-actions .btn span.optional { display:none; }
    }
    @media (max-width: 620px) {
      .login-page { padding: 12px; }
      .login-form { padding: 28px 18px; }
      .login-head h2 { font-size: 24px; }
      .code-row { grid-template-columns: 1fr; }
      .grid-4 { grid-template-columns: 1fr; }
      .toolbar { align-items: stretch; }
      .search { min-width: 100%; }
      .chips { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
      .seat-grid { grid-template-columns: repeat(3, 1fr); }
      .card { padding: 16px; }
      .card-head { flex-direction: column; }
      .top-actions { gap: 6px; }
      .btn { padding: 10px 12px; }
      .phone { border-radius: 28px; border-width: 6px; }
    }
.nav a { width: 100%; border: 0; background: white; color: #475569; text-align: left; border-radius: 16px; padding: 12px 14px; font-weight: 700; display: flex; align-items: center; gap: 12px; text-decoration: none; }
.nav a.active { background: var(--blue); color: white; box-shadow: 0 10px 22px rgba(37,99,235,.18); }
.nav button { display:none; }
.action-link { text-decoration:none; }
.page-tip { border:1px dashed #bfdbfe; background:#eff6ff; color:#1e40af; padding:14px 16px; border-radius:18px; line-height:1.7; font-size:14px; margin-bottom:18px; }
.stat-mini { color: var(--muted); font-size:12px; margin-top:5px; }
.form-grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.timeline { display:grid; gap:12px; }
.timeline-row { display:grid; grid-template-columns: 120px 1fr auto; gap:12px; align-items:center; padding:14px; border-radius:18px; background:#f8fafc; }
.file-row { display:grid; grid-template-columns: 1fr 120px 130px 110px; gap:12px; align-items:center; padding:14px; border-radius:18px; background:#f8fafc; }
@media (max-width: 980px) {
  .nav a { padding: 12px 14px; }
  .timeline-row, .file-row { grid-template-columns: 1fr; }
}


.user-chip { display:inline-flex; align-items:center; padding:8px 12px; border-radius:999px; background:#f8fafc; border:1px solid var(--border); color:#475569; font-size:13px; font-weight:800; }
.form-message { margin-top:14px; padding:12px 14px; border-radius:14px; font-size:14px; line-height:1.6; }
.form-message.ok { background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; }
.form-message.bad { background:#fff1f2; color:#be123c; border:1px solid #fecdd3; }
.btn[disabled] { opacity:.65; cursor:not-allowed; }
.btn-danger { background:#fff1f2; color:#be123c; border:1px solid #fecdd3; }
.btn-green { background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; }
.op-row { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.modal-mask { position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:80; display:flex; align-items:center; justify-content:center; padding:20px; }
.modal-card { width:min(100%,520px); max-height:92vh; overflow:auto; background:white; border:1px solid var(--border); border-radius:24px; box-shadow:0 24px 80px rgba(15,23,42,.25); padding:20px; }
.modal-card.wide { width:min(100%,920px); }
.modal-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.modal-head h3 { margin:0; }
.icon-btn { border:0; background:#f1f5f9; border-radius:12px; width:36px; height:36px; font-size:22px; line-height:1; }
.form-span-2 { grid-column:1 / -1; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:4px; }
textarea.input { min-height:90px; resize:vertical; }
select.input { appearance:auto; }
.admin-only.hidden { display:none !important; }
@media (max-width: 980px) {
  .modal-mask { align-items:flex-end; padding:0; }
  .modal-card, .modal-card.wide { width:100%; max-height:90vh; border-radius:24px 24px 0 0; }
  .form-2 { grid-template-columns:1fr; }
}

/* Graduation materials */
.grad-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.status-steps { display:grid; gap:10px; }
.step { display:flex; gap:12px; align-items:flex-start; padding:12px; border-radius:16px; background:white; border:1px solid var(--border); }
.step span { width:28px; height:28px; border-radius:999px; display:grid; place-items:center; background:#f1f5f9; color:#64748b; font-weight:850; }
.step.done span { background:var(--green); color:white; }
.step.current span { background:var(--amber); color:white; }
.step.bad span { background:var(--rose); color:white; }
.step b { display:block; }
.step p { margin:4px 0 0; color:var(--muted); font-size:12px; line-height:1.55; }
.material-list { display:grid; gap:10px; }
.material-row { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; padding:14px; border-radius:18px; background:#f8fafc; border:1px solid #eef2f7; }
.preview-card { width:min(100%,1100px); }
.preview-frame { width:100%; height:min(72vh,760px); border:1px solid var(--border); border-radius:18px; background:#f8fafc; }
@media (max-width: 980px) {
  .grad-detail-grid, .material-row { grid-template-columns:1fr; }
  .preview-frame { height:70vh; }
}

.dict-disabled{opacity:.62;background:rgba(148,163,184,.08)}
.dict-disabled input,.dict-disabled select{color:var(--muted)}


.multi-select{position:relative}
.multi-select-button{width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left;min-height:42px;background:#fff}
.multi-select-menu{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 6px);max-height:260px;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 16px 36px rgba(15,23,42,.16);padding:8px}
.multi-option{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;cursor:pointer;font-size:14px}
.multi-option:hover{background:var(--soft)}
.multi-option input{width:16px;height:16px}
.empty-state{padding:34px 18px;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:18px;background:rgba(248,250,252,.7)}
.lock-tip{padding:10px 12px;border-radius:12px;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;font-size:13px}


/* Room and workstation management */
.room-selected{border-color:#93c5fd;background:#eff6ff}
.seat-grid-dynamic{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));align-items:stretch}
.ws-seat{position:relative;min-height:132px;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;overflow:hidden}
.ws-seat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:#cbd5e1}
.ws-seat.free{background:#ecfdf5;border-color:#a7f3d0;color:#047857}
.ws-seat.occupied{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.ws-seat.warning{background:#fff7ed;border-color:#fed7aa;color:#c2410c;box-shadow:0 0 0 3px rgba(217,119,6,.08)}
.ws-seat.disabled,.ws-seat.reserved{background:#f8fafc;border-color:#e2e8f0;color:#64748b}
.ws-seat.grade-0:before{background:#64748b}.ws-seat.grade-1:before{background:#2563eb}.ws-seat.grade-2:before{background:#059669}.ws-seat.grade-3:before{background:#d97706}.ws-seat.grade-4:before{background:#7c3aed}.ws-seat.grade-5:before{background:#dc2626}.ws-seat.grade-6:before{background:#0891b2}.ws-seat.grade-7:before{background:#be185d}.ws-seat.grade-8:before{background:#4f46e5}.ws-seat.grade-9:before{background:#16a34a}
.ws-seat small{display:block}.ws-seat em{font-style:normal;font-size:12px;color:#64748b}.seat-ops{margin-top:auto;justify-content:center}.seat-ops .btn{padding:7px 9px;border-radius:10px;font-size:12px}
.seat-legend{display:flex;gap:12px;align-items:center;flex-wrap:wrap;color:#64748b;font-size:13px;margin-bottom:12px}.seat-dot{width:14px;height:14px;border-radius:4px;display:inline-block;border:1px solid #e2e8f0}.seat-dot.free{background:#ecfdf5;border-color:#a7f3d0}.seat-dot.occupied{background:#eff6ff;border-color:#bfdbfe}.seat-dot.warning{background:#fff7ed;border-color:#fed7aa}.seat-dot.disabled{background:#f8fafc}.seat-dot.grade{background:linear-gradient(90deg,#2563eb,#059669,#d97706,#7c3aed)}
.grade-chip{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:800;color:white;background:#64748b}.grade-chip.grade-0{background:#64748b}.grade-chip.grade-1{background:#2563eb}.grade-chip.grade-2{background:#059669}.grade-chip.grade-3{background:#d97706}.grade-chip.grade-4{background:#7c3aed}.grade-chip.grade-5{background:#dc2626}.grade-chip.grade-6{background:#0891b2}.grade-chip.grade-7{background:#be185d}.grade-chip.grade-8{background:#4f46e5}.grade-chip.grade-9{background:#16a34a}
.policy-row{display:grid;grid-template-columns:1fr 130px 120px 1fr auto;gap:8px;align-items:center;background:#f8fafc;border:1px solid var(--border);border-radius:16px;padding:10px}
@media(max-width:980px){.policy-row{grid-template-columns:1fr}.seat-grid-dynamic{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Fixes for room/workstation and dictionary management visual states */
.room-card{cursor:pointer;transition:.15s ease;border-color:#e8eef6}
.room-card:hover{transform:translateY(-1px);border-color:#bfdbfe;box-shadow:0 10px 26px rgba(15,23,42,.08)}
.room-selected{border-color:#60a5fa!important;background:#eff6ff!important;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
.room-card .progress{background:#e2e8f0}
.room-card .progress>i{background:linear-gradient(90deg,var(--blue),#22c55e)}
.ws-seat .seat-ops{min-height:34px}
.ws-seat .btn{white-space:nowrap}
.dict-table table{min-width:920px}
.dict-table th:nth-child(4),.dict-table td:nth-child(4){width:112px;min-width:112px;text-align:center}
.dict-enabled-select{min-width:88px;width:88px!important;border-radius:999px!important;padding:8px 12px!important;font-weight:850;text-align:center;text-align-last:center;border-width:1px!important}
.dict-enabled-select.is-on{background:#ecfdf5!important;color:#047857!important;border-color:#a7f3d0!important}
.dict-enabled-select.is-off{background:#fff1f2!important;color:#be123c!important;border-color:#fecdd3!important}
.dict-disabled{opacity:.88;background:#fff1f2!important}
.dict-disabled input:not([data-k="item_code"]),.dict-disabled select:not(.dict-enabled-select){color:#64748b;background:#f8fafc}
@media(max-width:980px){.dict-table table{min-width:860px}.dict-enabled-select{width:96px!important}}

/* seat module compact overrides */
 .seat-grid-dynamic{grid-template-columns:repeat(auto-fill,124px);grid-auto-rows:126px;align-items:start;justify-content:start;gap:12px}
.ws-seat{position:relative;width:124px;height:126px;min-height:126px;display:flex;flex-direction:column;justify-content:flex-start;gap:4px;overflow:hidden;padding:14px 10px 8px 14px;cursor:pointer}
.ws-seat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:#cbd5e1}
.ws-seat.free{background:#ecfdf5;border-color:#a7f3d0;color:#047857}
.ws-seat.occupied{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.ws-seat.warning{background:#fff7ed;border-color:#fed7aa;color:#c2410c;box-shadow:0 0 0 3px rgba(217,119,6,.08)}
.ws-seat.disabled,.ws-seat.reserved{background:#f8fafc;border-color:#e2e8f0;color:#64748b}
.ws-seat.seat-selected{outline:3px solid rgba(37,99,235,.22);border-color:#2563eb;box-shadow:0 12px 30px rgba(37,99,235,.14)}
.ws-seat.grade-0:before{background:#64748b}.ws-seat.grade-1:before{background:#2563eb}.ws-seat.grade-2:before{background:#059669}.ws-seat.grade-3:before{background:#d97706}.ws-seat.grade-4:before{background:#7c3aed}.ws-seat.grade-5:before{background:#dc2626}.ws-seat.grade-6:before{background:#0891b2}.ws-seat.grade-7:before{background:#be185d}.ws-seat.grade-8:before{background:#4f46e5}.ws-seat.grade-9:before{background:#16a34a}
.ws-seat b{font-size:16px;line-height:1.1}.ws-seat span{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ws-seat small{display:block;line-height:1}.ws-seat em{font-style:normal;font-size:12px;color:#64748b}.seat-pending{color:#d97706;font-weight:800}.seat-ops{margin-top:auto;justify-content:center;gap:4px;min-height:28px;max-height:42px;overflow:hidden}.seat-ops .btn{padding:5px 7px;border-radius:9px;font-size:12px;line-height:1.1}
.seat-dot{display:inline-block;width:12px;height:12px;border-radius:4px;margin:0 5px 0 12px;vertical-align:-1px;border:1px solid #cbd5e1}.seat-dot.free{background:#ecfdf5}.seat-dot.occupied{background:#eff6ff}.seat-dot.warning{background:#fff7ed}.seat-dot.disabled{background:#f8fafc}.seat-dot.grade{background:linear-gradient(90deg,#2563eb,#059669,#d97706,#7c3aed)}
.grade-chip{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;font-size:12px;font-weight:800;color:white;background:#64748b}.grade-chip.grade-0{background:#64748b}.grade-chip.grade-1{background:#2563eb}.grade-chip.grade-2{background:#059669}.grade-chip.grade-3{background:#d97706}.grade-chip.grade-4{background:#7c3aed}.grade-chip.grade-5{background:#dc2626}.grade-chip.grade-6{background:#0891b2}.grade-chip.grade-7{background:#be185d}.grade-chip.grade-8{background:#4f46e5}.grade-chip.grade-9{background:#16a34a}
.policy-row{display:grid;grid-template-columns:1fr 130px 1fr auto;gap:8px;align-items:center;background:#f8fafc;border:1px solid var(--border);border-radius:16px;padding:10px}.policy-row-allow{grid-template-columns:1fr 150px 1fr auto}
.student-combo{position:relative}.combo-results{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 4px);max-height:260px;overflow:auto;background:white;border:1px solid var(--border);border-radius:14px;box-shadow:0 18px 40px rgba(15,23,42,.16);padding:6px}.combo-item{display:flex;flex-direction:column;gap:3px;padding:9px 10px;border-radius:10px;cursor:pointer}.combo-item:hover{background:#eff6ff}.combo-item span,.combo-empty{font-size:12px;color:#64748b}.combo-empty{padding:10px}.section-subtitle{font-size:14px;margin:14px 0 8px;color:#0f172a}
@media(max-width:980px){.policy-row,.policy-row-allow{grid-template-columns:1fr}.seat-grid-dynamic{grid-template-columns:repeat(2,124px)}}

/* 2026-05-18 navigation polish: keep menu aligned and prevent non-admin menu flicker before session loads */
.nav a { min-height: 44px; line-height: 1.2; }
.nav a span { flex: 0 0 24px; width: 24px; text-align: center; display: inline-flex; align-items: center; justify-content: center; }
body:not(.role-admin) .nav a[href="schedule.html"],
body:not(.role-admin) .nav a[href="leave.html"],
body:not(.role-admin) .nav a[href="internship.html"],
body:not(.role-admin) .nav a[href="weekly.html"],
body:not(.role-admin) .nav a[href="project.html"],
body:not(.role-admin) .nav a[href="message.html"],
body:not(.role-admin) .nav a[href="settings.html"] { display: none !important; }
body.role-admin .nav a { display: flex; }

/* 权限菜单加载前先隐藏，避免学生/导师瞬间看到无权限菜单 */
body:not(.nav-ready) .nav a { visibility: hidden; }
body.nav-ready .nav a { visibility: visible; }
.nav a { min-height: 46px; line-height: 1.2; }
.nav a span { width: 22px; flex: 0 0 22px; text-align: center; }
.form-span-3 { grid-column: 1 / -1; }
.danger { color: #e11d48; }

/* 通用分页控件 */
.pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:13px}
.pager .input{width:82px;padding:8px 10px;font-size:13px}
.pager button{min-width:72px}
.pager .pager-info{padding:0 4px;white-space:nowrap}


/* 通用上传进度 */
.upload-progress{margin-top:10px;padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:#f8fafc;color:#475569;font-size:13px}
.upload-progress.hidden{display:none!important}
.upload-progress-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;font-weight:800;color:#334155}
.upload-progress-bar{height:10px;border-radius:999px;background:#e2e8f0;overflow:hidden}
.upload-progress-fill{display:block;height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,var(--blue),#22c55e);transition:width .18s ease}
.upload-progress-desc{margin-top:6px;color:#64748b;font-size:12px;word-break:break-all}
.upload-progress.is-error{background:#fff1f2;border-color:#fecdd3;color:#be123c}
.upload-progress.is-done{background:#ecfdf5;border-color:#a7f3d0;color:#047857}