.safe-top { padding-top: env(safe-area-inset-top); }
.safe-bottom { padding-bottom: max(env(safe-area-inset-bottom), 6px); }
.tab { display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 0 4px; -webkit-tap-highlight-color: transparent; }
.tab .ico { font-size:20px; filter: grayscale(1); opacity:.7; }
.tab.active { color:#7a1f1f; }
.tab.active .ico { filter:none; opacity:1; }
.tab .add { width:46px; height:46px; margin-top:-18px; border-radius:9999px; background:#7a1f1f; color:#f5e6d3; font-size:28px; line-height:44px; text-align:center; box-shadow:0 6px 14px rgba(122,31,31,.35); border:3px solid #fbf7ef; }
.card { background:#fff; border:1px solid #eee4d3; border-radius:16px; }
.t-gio { --c:#7a1f1f; --bg:#fbeeee; } .t-cuoi { --c:#b4235a; --bg:#fdeef4; } .t-sinhnhat { --c:#b45309; --bg:#fff4e5; }
.t-kyniem { --c:#1d4ed8; --bg:#eef3ff; } .t-le { --c:#8a6d12; --bg:#fbf5e1; } .t-khac { --c:#44403c; --bg:#f3f1ee; }
.chip { color:var(--c); background:var(--bg); }
.bar { border-left:4px solid var(--c); }
.dot { background:var(--c); }
.inp { width:100%; border:1px solid #e3d8c4; background:#fff; border-radius:12px; padding:10px 12px; font-size:16px; }
.inp:focus { outline:2px solid #c39a2c; outline-offset:0; border-color:transparent; }
.lbl { display:block; font-size:13px; font-weight:600; color:#57534e; margin-bottom:4px; }
.seg { display:flex; background:#f1eadc; border-radius:12px; padding:3px; }
.seg button { flex:1; padding:8px 4px; border-radius:9px; font-size:14px; font-weight:600; color:#78716c; }
.seg button.on { background:#fff; color:#7a1f1f; box-shadow:0 1px 3px rgba(0,0,0,.1); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; border-radius:12px; padding:11px 16px; font-weight:600; }
.btn-p { background:#7a1f1f; color:#fbf3ea; } .btn-g { background:#f1eadc; color:#5c1716; } .btn-d { background:#fee2e2; color:#991b1b; }
.cal-cell { aspect-ratio: 1 / 1.15; }
.num { font-variant-numeric: tabular-nums; }
.inp-s { border:1px solid #e3d8c4; background:#fff; border-radius:8px; padding:5px 7px; font-size:14px; min-width:0; }
.inp-s:focus { outline:2px solid #c39a2c; border-color:transparent; }
.row-warn { background:#fffbeb; } .row-err { background:#fef2f2; } .row-dup { background:#f5f5f4; color:#a8a29e; }
.dropzone.over { border-color:#c39a2c; background:#fbf5e1; }
.imp-table th { font-size:12px; text-align:left; font-weight:600; color:#78716c; padding:8px 6px; background:#fbf7ef; }
.imp-table td { padding:6px; vertical-align:top; border-top:1px solid #eee4d3; }