body { background: #f6f8fb; }
.card { border-radius: 14px; }

.header-top,
.header-nav-sticky,
.header-nav-sticky .container,
.header-bottom-nav { background: #bfe8ff !important; }

.hdr-main { font-size: 22px; font-weight: 700; color: #0f2a3d; line-height: 1.15; }
.hdr-sub { font-size: 14px; color: #1f4059; margin-top: 2px; }
.hdr-author { font-size: 14px; color: #0f2a3d; margin-top: 2px; text-align: right; }

.header-nav-sticky { z-index: 1030; }
.header-bottom-nav {
  padding: 8px 0;
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.nav-btn{
  height: 30px; min-width: 128px; border-radius: 4px;
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 0 12px; text-decoration: none; color: #fff;
  font-size: 12px; font-weight: 700;
}
.nav-btn i{ font-size: 18px; }
.nav-btn-home{ background: #111; } .nav-btn-home:hover{ background:#000; color:#fff; }
.nav-btn-sr{ background: #0b3d91; } .nav-btn-sr:hover{ background:#082f6f; color:#fff; }
.nav-btn-cab{ background: #1f8b3a; } .nav-btn-cab:hover{ background:#17692c; color:#fff; }

.drawer-grid{ display:grid; grid-template-columns: repeat(var(--cols), minmax(70px,1fr)); gap:8px; }
.drawer-cell{
  display:block; text-decoration:none; border-radius:10px; padding:8px;
  border:1px solid #dce3ee; background:#fff; color:#1c2430; min-height:62px;
}
.drawer-cell .label{ display:block; font-size:.82rem; font-weight:600; }
.drawer-cell .meta{ display:block; font-size:.72rem; opacity:.8; }
.drawer-cell.empty{ background:#fff; }
.drawer-cell.filled{ background:#e8f7ea; border-color:#b9e3c0; }
.drawer-cell.blocked{ background:#ffe7e7; border-color:#f2b3b3; color:#8b1d1d; }

.mini-input{ width:64px !important; text-align:center; }
.icon-only-btn{
  width:32px; height:30px; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
}
.thumb{
  width:48px; height:48px; object-fit:cover; border-radius:8px;
  border:1px solid #dbe3ee; background:#fff;
}

@media (max-width:576px){
  .drawer-grid { grid-template-columns: repeat(var(--cols), minmax(56px,1fr)); gap:6px; }
  .drawer-cell { padding:6px; min-height:54px; }
  .hdr-main { font-size:18px; }
  .nav-btn { min-width:110px; font-size:11px; }
}