:root {
  --bg: #f4f6f8;
  --card: #ffffff;
  --text: #16202a;
  --muted: #68727d;
  --line: #dde3e8;
  --brand: #8b1e2d;
  --brand-dark: #681521;
  --soft: #f8f1f2;
  --ok: #176b45;
  --ok-bg: #edf8f3;
  --warn: #8a5a00;
  --warn-bg: #fff8e7;
  --error: #a12727;
  --error-bg: #fff0f0;
  --shadow: 0 8px 28px rgba(27, 39, 51, .07);
  font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); line-height: 1.55; }
button, input, select { font: inherit; }
.shell { width: min(1460px, calc(100% - 40px)); margin: 0 auto; }
.site-header { background: #fff; border-bottom: 1px solid var(--line); }
.header-inner { min-height: 190px; display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 36px 0; }
.eyebrow { margin: 0 0 7px; letter-spacing: .12em; font-weight: 800; font-size: .76rem; color: var(--brand); }
h1 { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.08; letter-spacing: -.04em; margin: 0; max-width: 820px; }
.lead { max-width: 760px; margin: 14px 0 0; color: var(--muted); font-size: 1.06rem; }
.law-chip { max-width: 340px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); background: #fafbfc; font-size: .84rem; }
.page-grid { display: grid; grid-template-columns: minmax(0, 1fr) 315px; gap: 24px; padding: 28px 0 60px; }
.main-column { min-width: 0; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); padding: 26px; margin-bottom: 22px; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 22px; }
.section-heading > div:first-child { display: flex; align-items: center; gap: 10px; }
.section-heading h2 { margin: 0; font-size: 1.3rem; letter-spacing: -.015em; }
.section-heading > p { margin: 2px 0 0; color: var(--muted); font-size: .9rem; max-width: 480px; text-align: right; }
.step { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: var(--soft); color: var(--brand); font-size: .78rem; font-weight: 800; }
.form-grid { display: grid; gap: 16px; }
.form-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.field > span { font-size: .88rem; font-weight: 700; }
.field small { color: var(--muted); font-size: .76rem; }
input, select { width: 100%; border: 1px solid #cfd7df; border-radius: 10px; background: #fff; min-height: 44px; padding: 9px 11px; color: var(--text); outline: none; }
input:focus, select:focus { border-color: #a44c58; box-shadow: 0 0 0 3px rgba(139, 30, 45, .10); }
input[readonly] { background: #f2f4f6; color: #48515a; font-weight: 700; }
.readonly-field { padding: 11px; margin: -11px; border-radius: 13px; background: #fafbfc; }
.advanced { margin-top: 22px; border-top: 1px dashed var(--line); padding-top: 18px; }
.advanced summary { cursor: pointer; color: var(--brand); font-weight: 750; }
.advanced-body { padding-top: 18px; }
.check-field { display: flex; align-items: flex-start; gap: 9px; padding-top: 28px; font-size: .82rem; color: #48515a; }
.check-field input { width: 18px; min-height: 18px; margin-top: 2px; }
.info-box { background: #f6f8fa; border-left: 3px solid #8e9aa5; padding: 12px 14px; border-radius: 0 9px 9px 0; color: #4f5963; font-size: .86rem; margin-bottom: 15px; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
.history-table { width: 100%; min-width: 1120px; border-collapse: collapse; }
.history-table th { background: #f6f8fa; color: #5b6570; text-align: left; font-size: .76rem; padding: 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.history-table td { padding: 9px; border-bottom: 1px solid #edf0f2; vertical-align: top; }
.history-table tr:last-child td { border-bottom: 0; }
.history-table input, .history-table select { min-height: 40px; padding: 7px 8px; font-size: .84rem; border-radius: 8px; }
.history-table th:nth-child(1), .history-table th:nth-child(2) { width: 135px; }
.history-table th:nth-child(3) { width: 230px; }
.history-table th:nth-child(4) { width: 125px; }
.history-table th:nth-child(5) { width: 160px; }
.value-unit { display: block; margin-top: 3px; color: var(--muted); font-size: .7rem; }
.table-note { color: var(--muted); font-size: .78rem; margin: 10px 2px 0; }
.button { border: 0; border-radius: 10px; padding: 11px 16px; font-weight: 750; cursor: pointer; transition: .15s ease; }
.button:hover { transform: translateY(-1px); }
.button.primary { background: var(--brand); color: #fff; padding-inline: 28px; }
.button.primary:hover { background: var(--brand-dark); }
.button.secondary { color: var(--brand); background: var(--soft); border: 1px solid #ead4d7; }
.button.dark { background: #202832; color: #fff; }
.button:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.icon-button { width: 34px; height: 34px; border: 0; border-radius: 8px; background: #f5f6f7; color: #78828c; cursor: pointer; font-size: 1.35rem; }
.icon-button:hover { background: #ffecec; color: var(--error); }
.ai-card { border-color: #d7dce3; }
.ai-badge { font-size: .76rem; font-weight: 800; padding: 7px 10px; border-radius: 999px; background: #202832; color: #fff; }
.upload-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; }
.dropzone { display: flex; min-height: 118px; border: 1.5px dashed #aeb7c0; border-radius: 14px; align-items: center; justify-content: center; text-align: center; flex-direction: column; gap: 4px; background: #fafbfc; cursor: pointer; }
.dropzone:hover { border-color: var(--brand); background: #fffafa; }
.dropzone span { color: var(--muted); font-size: .8rem; }
.dropzone input { display: none; }
.upload-actions { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 10px; }
.upload-actions p { margin: 0; color: var(--muted); font-size: .82rem; }
#importStatus { margin-top: 14px; }
.action-bar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px; margin: 0 0 22px; border-radius: 16px; background: #202832; color: #fff; }
.action-bar > div { display: flex; flex-direction: column; }
.action-bar span { color: #bac2ca; font-size: .82rem; }
.result-card { min-height: 180px; }
.empty-result { min-height: 125px; display: grid; place-content: center; text-align: center; color: var(--muted); }
.empty-result strong { color: #39434d; }
.alert { border-radius: 11px; padding: 12px 14px; margin-bottom: 16px; font-size: .88rem; }
.alert.success { background: var(--ok-bg); color: var(--ok); border: 1px solid #cde9dc; }
.alert.warning { background: var(--warn-bg); color: var(--warn); border: 1px solid #f1dfb4; }
.alert.error { background: var(--error-bg); color: var(--error); border: 1px solid #f0caca; }
.alert ul { margin: 6px 0 0 18px; padding: 0; }
.result-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.metric { padding: 16px; border: 1px solid var(--line); border-radius: 12px; min-height: 106px; display: flex; flex-direction: column; justify-content: space-between; }
.metric span { color: var(--muted); font-size: .76rem; }
.metric strong { font-size: 1.18rem; }
.metric.primary { grid-column: span 2; background: #202832; color: #fff; border-color: #202832; }
.metric.primary span, .metric.primary small { color: #c6ced5; }
.metric.primary strong { font-size: clamp(1.5rem, 3vw, 2.25rem); }
.explain { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 16px; }
.explain h3 { margin: 0 0 8px; font-size: 1rem; }
.explain p, .explain li { font-size: .85rem; color: #4f5963; }
.explain ul { padding-left: 20px; }
.calc-table { width: 100%; border-collapse: collapse; font-size: .8rem; margin-top: 12px; }
.calc-table th, .calc-table td { border-bottom: 1px solid var(--line); padding: 7px; text-align: left; }
.calc-table th { color: var(--muted); }
.compact-card { padding: 21px; }
.compact-card h3 { margin: 0 0 14px; }
.sticky-card { position: sticky; top: 18px; }
.principles { margin: 0; padding-left: 20px; }
.principles li { margin: 0 0 11px; font-size: .82rem; color: #505a64; }
.security-note { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.security-note strong { color: var(--brand); }
.security-note p { margin: 5px 0 0; font-size: .78rem; color: var(--muted); }
.footer { padding: 0 0 40px; color: var(--muted); font-size: .78rem; text-align: center; }

@media (max-width: 1100px) {
  .page-grid { grid-template-columns: 1fr; }
  .side-column { order: -1; }
  .sticky-card { position: static; }
  .form-grid.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .shell { width: min(100% - 22px, 1460px); }
  .header-inner { min-height: auto; flex-direction: column; align-items: flex-start; padding: 28px 0; }
  .law-chip { max-width: none; }
  .card { padding: 17px; border-radius: 14px; }
  .section-heading { flex-direction: column; gap: 10px; }
  .section-heading > p { text-align: left; }
  .form-grid.four, .form-grid.three, .upload-grid { grid-template-columns: 1fr; }
  .check-field { padding-top: 6px; }
  .action-bar { align-items: stretch; flex-direction: column; }
  .result-grid { grid-template-columns: 1fr 1fr; }
  .metric.primary { grid-column: 1 / -1; }
}
@media (max-width: 460px) {
  .result-grid { grid-template-columns: 1fr; }
  .metric.primary { grid-column: auto; }
}

/* v2.1 — phụ cấp, dự báo quá trình đóng và import nhiều ảnh */
.history-table { min-width: 1480px; }
.history-table th:nth-child(6) { width: 250px; }
.history-table th:nth-child(7) { width: 220px; }
.allowance-cell { min-width: 250px; }
.allowance-details { border: 1px solid #e4e8ec; border-radius: 9px; background: #fafbfc; padding: 7px 9px; }
.allowance-details summary { cursor: pointer; font-size: .78rem; font-weight: 750; color: #4c5660; }
.allowance-details[open] summary { margin-bottom: 8px; }
.allowance-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.allowance-fields label { display: flex; flex-direction: column; gap: 4px; color: var(--muted); font-size: .7rem; }
.allowance-fields input { min-width: 0; }
.allowance-none { margin: 8px 0 2px; color: var(--muted); font-size: .73rem; }

.forecast-panel { margin-top: 18px; border: 1px solid #dce2e7; border-radius: 13px; background: #fafbfc; padding: 15px; }
.forecast-toggle { display: flex; align-items: flex-start; gap: 10px; font-weight: 750; cursor: pointer; }
.forecast-toggle input { width: 18px; min-height: 18px; margin-top: 1px; }
.forecast-toggle span { flex: 1; }
.forecast-config { margin-top: 14px; padding-top: 14px; border-top: 1px dashed #ccd3da; }
.forecast-config > p { margin: 0 0 12px; color: var(--muted); font-size: .8rem; }
.forecast-preview { margin-top: 12px; border-radius: 9px; background: #fff; border: 1px solid var(--line); padding: 10px 12px; color: #4c5660; font-size: .79rem; }
.forecast-preview:empty { display: none; }

.selected-files { margin: 9px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.selected-file { max-width: 100%; padding: 5px 8px; border-radius: 8px; background: #eef1f4; color: #4b5661; font-size: .72rem; overflow-wrap: anywhere; }
.provisional-summary { margin-top: 18px; padding: 12px 14px; border: 1px solid #f1dfb4; border-radius: 11px; background: var(--warn-bg); color: var(--warn); font-size: .84rem; }

[hidden] { display: none !important; }

@media (max-width: 760px) {
  .allowance-fields { grid-template-columns: 1fr; }
}
.selected-files > span { max-width: 100%; padding: 5px 8px; border-radius: 8px; background: #eef1f4; color: #4b5661; font-size: .72rem; overflow-wrap: anywhere; }

.entry-method-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin: 18px 0 10px; }
.entry-method-heading > div { display: flex; flex-direction: column; gap: 3px; }
.entry-method-heading strong { font-size: .95rem; }
.entry-method-heading span { color: var(--muted); font-size: .8rem; }
.file-import-block { margin-top: 22px; padding-top: 2px; border-top: 1px solid var(--line); }
.data-requirements { margin: 10px 0 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fafbfc; font-size: .82rem; color: #48515a; }
.data-requirements > strong { display: block; margin-bottom: 8px; color: #1f2933; }
.requirements-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.requirements-grid ul { margin: 0; padding-left: 19px; }
.requirements-grid li { margin: 6px 0; line-height: 1.45; }
.data-requirements p { margin: 10px 0 0; padding-top: 10px; border-top: 1px dashed var(--line); line-height: 1.5; }
@media (max-width: 760px) { .requirements-grid { grid-template-columns: 1fr; gap: 0; } }

/* v2.4: chỉ hiển thị bảng đối chiếu khi dữ liệu import còn chưa rõ */
.import-review { margin-top: 16px; border: 1px solid var(--line); border-radius: 14px; padding: 16px; background: #fff; }
.import-review-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.import-review-heading > div:first-child { display: flex; flex-direction: column; gap: 4px; }
.import-review-heading span { color: var(--muted); font-size: .8rem; }
.person-review { flex: 0 0 auto; font-size: .78rem; color: #4f5963; background: #f7f8fa; border-radius: 9px; padding: 8px 10px; }
.import-review-wrap { margin-top: 8px; }
.import-review-table { width: 100%; border-collapse: collapse; min-width: 900px; font-size: .78rem; }
.import-review-table th, .import-review-table td { border-bottom: 1px solid var(--line); padding: 9px 8px; vertical-align: top; text-align: left; }
.import-review-table th { color: var(--muted); background: #fafbfc; font-size: .73rem; }
.import-review-table th:nth-child(1) { width: 42px; }
.import-review-table th:nth-child(2) { width: 150px; }
.import-review-table th:nth-child(3) { width: 180px; }
.review-fields { display: flex; flex-wrap: wrap; gap: 5px; }
.review-pill { display: inline-flex; border-radius: 999px; padding: 3px 7px; background: #f0f3f5; color: #46515b; line-height: 1.25; }
.review-pill.ok { background: var(--ok-bg); color: var(--ok); }
.review-pill.missing { background: var(--error-bg); color: var(--error); }
.review-status { display: inline-flex; border-radius: 999px; padding: 4px 8px; font-weight: 750; white-space: nowrap; }
.review-status.ok { background: var(--ok-bg); color: var(--ok); }
.review-status.missing { background: var(--warn-bg); color: var(--warn); }
.import-review-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
#importReviewWarnings .alert { margin: 12px 0 0; }
.forecast-inference { margin-bottom: 12px; padding: 11px 13px; border: 1px solid #d8e0e7; background: #f8fafb; border-radius: 10px; color: #46515b; font-size: .8rem; line-height: 1.5; }
.forecast-inference strong { color: #202832; }
.forecast-inference ul { margin: 6px 0 0 18px; padding: 0; }

@media (max-width: 760px) {
  .import-review-heading { flex-direction: column; }
  .person-review { width: 100%; }
}

/* v2.4: trạng thái đọc hồ sơ rõ ràng, tránh cảm giác bị treo */
.import-progress { margin-top: 14px; padding: 14px 16px; border: 1px solid #d7e1e8; border-radius: 12px; background: #f8fbfd; }
.import-progress-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.import-progress-title-wrap { display: flex; gap: 11px; align-items: flex-start; min-width: 0; }
.import-progress-title-wrap > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.import-progress-title-wrap strong { color: #1f2933; font-size: .9rem; }
.import-progress-title-wrap span:not(.import-spinner) { color: var(--muted); font-size: .8rem; line-height: 1.4; }
.import-spinner { flex: 0 0 18px; width: 18px; height: 18px; margin-top: 2px; border: 2px solid #c9d5de; border-top-color: #384b5a; border-radius: 50%; animation: import-spin .8s linear infinite; }
.import-elapsed { flex: 0 0 auto; padding: 4px 8px; border-radius: 999px; background: #eef3f6; color: #56636f; font-size: .72rem; font-variant-numeric: tabular-nums; }
.import-progress-bar { position: relative; overflow: hidden; height: 6px; margin: 12px 0 9px; border-radius: 999px; background: #e6edf2; }
.import-progress-bar span { position: absolute; inset: 0 auto 0 -36%; width: 36%; border-radius: inherit; background: #647887; animation: import-progress 1.5s ease-in-out infinite; }
.import-progress p { margin: 0; color: #5b6670; font-size: .76rem; line-height: 1.45; }
@keyframes import-spin { to { transform: rotate(360deg); } }
@keyframes import-progress { 0% { left: -36%; } 55% { left: 64%; } 100% { left: 100%; } }
@media (prefers-reduced-motion: reduce) {
  .import-spinner, .import-progress-bar span { animation-duration: 3s; }
}
@media (max-width: 640px) {
  .import-progress-head { flex-direction: column; gap: 8px; }
  .import-elapsed { align-self: flex-start; }
}

/* v3 commercial account UI */
.header-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px;min-width:260px}.account-strip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.button.small{padding:8px 11px;font-size:13px}.account-button{border:1px solid var(--border,#d8dee8);background:#fff;border-radius:12px;padding:7px 11px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:2px;max-width:290px}.account-button span{font-weight:700}.account-button small{font-size:11px;color:#64748b}.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.52);z-index:1000;padding:16px;overflow:auto;display:grid;place-items:start center;box-sizing:border-box}.modal-backdrop[hidden]{display:none}.modal-card{position:relative;width:min(520px,100%);max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box;background:#fff;border-radius:18px;padding:26px;box-shadow:0 24px 80px rgba(15,23,42,.24);margin:auto 0}.wide-modal{width:min(960px,100%)}.modal-close{position:absolute;right:14px;top:12px;border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#475569}.auth-card h2,.modal-card h2{margin-top:0}.auth-section{display:grid;gap:12px}.auth-divider{display:flex;align-items:center;gap:10px;color:#64748b;margin:16px 0}.auth-divider:before,.auth-divider:after{content:"";height:1px;background:#e2e8f0;flex:1}.button-row{display:flex;gap:8px;flex-wrap:wrap}.google-button{width:100%;background:#fff;border:1px solid #cbd5e1;color:#0f172a}.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}.plan-card{border:1px solid #e2e8f0;border-radius:15px;padding:18px;background:#fff}.plan-card h4{margin:0 0 8px}.plan-card>strong{font-size:24px}.plan-card ul{padding-left:18px;color:#475569;min-height:84px}.modal-heading-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.account-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.account-list{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}.account-list-row{display:flex;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid #edf2f7;font-size:14px}.account-list-row:last-child{border-bottom:0}.account-list-row span{display:flex;flex-direction:column;gap:2px}.account-list-row small{color:#64748b}.modal-footer{display:flex;justify-content:flex-end;margin-top:20px}.result-actions{display:flex;align-items:center;gap:12px;justify-content:flex-end;margin-top:16px;padding-top:16px;border-top:1px solid #e2e8f0}.result-actions span{font-size:13px;color:#475569}

@media (max-width:900px){.header-actions{align-items:flex-start;min-width:0}.account-strip{justify-content:flex-start}.plan-grid{grid-template-columns:1fr}.account-columns{grid-template-columns:1fr}.modal-heading-row{flex-direction:column}}

/* v3 admin */
.admin-header-inner{min-height:150px}.admin-shell{padding:28px 0 60px}.admin-gate{text-align:center}.admin-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}.admin-metric{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:4px}.admin-metric span,.admin-metric small{color:var(--muted);font-size:.78rem}.admin-metric strong{font-size:1.65rem;letter-spacing:-.03em}.admin-table{width:100%;border-collapse:collapse;min-width:960px;font-size:.82rem}.admin-table th,.admin-table td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.admin-table th{background:#f6f8fa;color:#5b6570;font-size:.74rem}.admin-table td>small,.admin-table td>b+small{display:block;color:var(--muted);margin-top:2px}.admin-table input[type=number]{min-width:78px;min-height:36px;padding:6px 8px}.admin-table input[type=checkbox]{width:18px;min-height:18px}.admin-toolbar{display:flex;justify-content:flex-end;margin-bottom:10px}.admin-pill{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eef1f4;font-weight:700;font-size:.72rem}.admin-pill.ok{background:var(--ok-bg);color:var(--ok)}.admin-pill.warn{background:var(--warn-bg);color:var(--warn)}.credit-controls{display:flex;gap:5px;align-items:center}.credit-controls input{width:64px}.admin-plan-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end}.admin-span-2{grid-column:span 2}.admin-table-gap{margin-top:18px}.muted-copy{color:var(--muted)}
@media(max-width:1000px){.admin-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-plan-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.admin-metrics,.admin-plan-form{grid-template-columns:1fr}.admin-span-2{grid-column:auto}.admin-header-inner{min-height:auto}.credit-controls{min-width:330px}}
.policy-page{padding:36px 0 70px}.policy-page>a{display:inline-block;margin-bottom:18px;color:var(--brand);font-weight:700;text-decoration:none}.policy-page .card{max-width:900px}.policy-page h1{font-size:2.2rem}.policy-page h2{margin-top:26px;font-size:1.12rem}.footer a{color:inherit}


/* v3.1 account/auth additions */
.wallet-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:8px 0 22px}.wallet-summary article{border:1px solid var(--line,#dfe5eb);border-radius:14px;padding:14px;background:#fff}.wallet-summary span,.wallet-summary small{display:block;color:var(--muted,#667085)}.wallet-summary strong{display:block;font-size:1.7rem;margin:5px 0}.auth-success-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.auth-success-card{width:min(620px,100%);text-align:center}.auth-success-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 16px;background:#eaf8ef;font-size:32px}.auth-success-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:20px}.setup-warning{margin-bottom:18px}@media(max-width:700px){.wallet-summary{grid-template-columns:1fr}}

/* v3.5 payOS / VietQR payment */
.payment-card{width:min(1040px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:28px 32px 24px;background:#fff;box-sizing:border-box}
.payment-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px;padding-right:28px}
.payment-heading h2{margin:2px 0 4px;font-size:1.55rem}.payment-heading .eyebrow{margin:0}
.payment-status{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:.78rem;font-weight:800;white-space:nowrap}
.payment-status.pending{background:var(--warn-bg);color:var(--warn)}
.payment-status.paid{background:var(--ok-bg);color:var(--ok)}
.payment-status.cancelled{background:var(--error-bg);color:var(--error)}
.payment-instruction{display:flex;align-items:center;justify-content:center;gap:13px;margin:2px 0 24px;padding:11px 16px;border-radius:12px;background:#fff;color:#111827;font-size:.9rem}
.payment-instruction p{margin:0}.payment-instruction-icon{display:grid;place-items:center;flex:0 0 32px;color:#111827}
.payment-transfer-grid{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:42px;align-items:start;min-width:0}
.payment-qr-panel{display:flex;flex-direction:column;align-items:center;text-align:center;padding:6px 12px 0}
.vietqr-brand{display:flex;align-items:center;gap:5px;margin:0 0 10px;font-weight:900;font-size:1.25rem;letter-spacing:-.04em}
.vietqr-brand span{color:#dc2626}.vietqr-brand b{padding:0 5px;border-radius:3px;background:#facc15;color:#0f766e;font-size:1rem;letter-spacing:0}
.payment-qr-frame{width:min(310px,100%);aspect-ratio:1/1;display:grid;place-items:center;background:#fff}
.payment-qr-frame img{display:block;width:100%;height:100%;object-fit:contain;border:0}
.payment-qr-fallback{width:100%;height:100%;border:1px dashed #cbd5e1;border-radius:14px;background:#f8fafc;padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#475569}
.payment-qr-fallback[hidden]{display:none}.payment-qr-fallback strong{color:#111827}.payment-qr-fallback span{font-size:.82rem;line-height:1.45}
.payment-qr-footer{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:9px;font-weight:800;color:#147a78}.payment-qr-footer span{font-style:italic;color:#2f5ea8}.payment-qr-footer i{height:22px;width:1px;background:#94a3b8}.payment-qr-panel>small{margin-top:8px;color:var(--muted);font-size:.76rem}
.payment-bank-panel{display:flex;flex-direction:column;gap:13px;padding-top:8px;min-width:0}
.payment-bank-heading{display:flex;align-items:center;gap:12px;padding:2px 0 8px}.payment-bank-heading>div{display:flex;flex-direction:column;gap:2px}.payment-bank-heading span,.payment-info-row span{color:#667085;font-size:.82rem}.payment-bank-heading strong{font-size:1rem;line-height:1.35}
.payment-bank-badge{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:#0f8f87;color:#fff!important;font-size:.65rem!important;font-weight:900;letter-spacing:-.02em}
.payment-info-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 0 2px}.payment-info-row>div{display:flex;flex-direction:column;gap:2px;min-width:0}.payment-info-row strong{font-size:1rem;word-break:break-word;color:#050505}.payment-info-row.no-copy{justify-content:flex-start}
.payment-copy{flex:0 0 auto;border:0;border-radius:8px;background:#eaf7f2;color:#34564d;padding:7px 11px;font-size:.75rem;font-weight:750;cursor:pointer}.payment-copy:hover{background:#dff1e9}
.payment-transfer-note{margin:40px 0 0;padding:0;color:#111827;font-size:.84rem;line-height:1.55}.payment-order-ref{margin:0;color:#667085;font-size:.76rem}.payment-order-ref strong{color:#334155}
.payment-actions{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-top:22px;padding-top:18px;border-top:1px solid #eef2f6}.payment-actions>div{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right}.payment-actions span{font-size:.76rem;color:#667085}.payment-actions a{font-size:.8rem;color:var(--brand);font-weight:750;text-decoration:none}.payment-actions a:hover{text-decoration:underline}
#paymentMessage .alert{margin:16px 0 0}
.payos-admin-box{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 14px;padding:13px 14px;border:1px solid var(--line);border-radius:12px;background:#f8fafc}
.payos-admin-box p{margin:4px 0;color:var(--muted);font-size:.8rem}.payos-admin-box code{font-size:.75rem;word-break:break-all}.ok-text{color:var(--ok)!important}.warn-text{color:var(--warn)!important}
@media(max-width:820px){.payment-card{padding:24px 20px}.payment-transfer-grid{grid-template-columns:1fr;gap:24px}.payment-qr-panel{padding:0}.payment-qr-frame{width:min(330px,100%)}.payment-transfer-note{margin-top:16px}.payment-heading,.payos-admin-box{flex-direction:column}.payos-admin-box .button{width:100%}.payment-actions{flex-direction:column;align-items:stretch}.payment-actions>div{align-items:flex-start;text-align:left}.payment-actions .button{width:100%}}
@media(max-width:520px){.payment-card{padding:22px 16px}.payment-heading{padding-right:20px}.payment-instruction{align-items:flex-start;padding-inline:4px}.payment-bank-panel{gap:15px}.payment-info-row{align-items:flex-end}.payment-copy{padding:7px 9px}.payment-bank-heading strong{font-size:.93rem}}


/* v3.6 payment containment + history lookup */
.payment-waiting{display:flex;align-items:center;gap:12px;margin-top:20px;padding:13px 15px;border-radius:13px;border:1px solid #f1d39a;background:#fff8e8;color:#7a4d00}
.payment-waiting>div{display:flex;flex-direction:column;gap:2px}.payment-waiting strong{font-size:.9rem}.payment-waiting small{font-size:.78rem;line-height:1.45;color:#7c6540}
.payment-waiting.paid{border-color:#b9e3c7;background:#eefaf2;color:#166534}.payment-waiting.paid small{color:#47735a}
.payment-waiting.cancelled{border-color:#efc0c0;background:#fff1f1;color:#9f1d2a}.payment-waiting.cancelled small{color:#8b4d54}
.payment-waiting-spinner{width:18px;height:18px;flex:0 0 18px;border:2px solid rgba(122,77,0,.22);border-top-color:#a16207;border-radius:50%;animation:paymentSpin .85s linear infinite}
.payment-waiting-check,.payment-waiting-stop{width:24px;height:24px;display:grid;place-items:center;flex:0 0 24px;border-radius:50%;font-weight:900;background:#dcfce7;color:#166534}.payment-waiting-stop{background:#fee2e2;color:#991b1b}
@keyframes paymentSpin{to{transform:rotate(360deg)}}
.account-section-title{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}.account-section-title h3{margin-bottom:6px}.account-section-title small{max-width:260px;text-align:right;color:var(--muted,#667085);font-size:.73rem;line-height:1.35}
.history-list-row{align-items:center}.history-list-row>span{min-width:0}.history-list-row>span>strong{font-size:.88rem}.history-list-row .button{flex:0 0 auto}
.history-detail-panel{margin-top:22px;padding:18px;border:1px solid #dfe5eb;border-radius:16px;background:#f8fafc}.history-detail-panel[hidden]{display:none}
.history-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.history-detail-head h3{margin:2px 0 4px}.history-detail-head .eyebrow{margin:0}.history-detail-head p{margin:0}
.history-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}.history-result-grid .metric{min-height:98px;padding:14px}.history-result-grid .metric strong{font-size:1.12rem}
.history-info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 18px}.history-info-grid>div{padding:11px 12px;border-radius:11px;background:#fff;border:1px solid #e4e9ef}.history-info-grid span,.history-info-grid strong{display:block}.history-info-grid span{font-size:.73rem;color:#667085;margin-bottom:4px}.history-info-grid strong{font-size:.84rem;line-height:1.35}
.history-periods-wrap{margin-top:14px}.history-periods-wrap h4{margin:0 0 9px}.history-detail-table{width:100%;border-collapse:collapse;font-size:.78rem;background:#fff}.history-detail-table th,.history-detail-table td{padding:9px 10px;border-bottom:1px solid #edf2f7;text-align:left;vertical-align:top}.history-detail-table th{background:#f2f5f8;white-space:nowrap}.history-detail-table td:nth-child(1){width:42px;text-align:center}.history-detail-table td:nth-child(2){white-space:nowrap}.history-disclaimer{font-size:.76rem;line-height:1.5;color:#667085;margin:14px 0 0}.history-detail-actions{display:flex;justify-content:flex-end;margin-top:12px}.danger-outline{border-color:#e6b6b6!important;color:#a11b2b!important;background:#fff!important}.danger-outline:hover{background:#fff1f1!important}
@media(max-width:900px){.history-result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.history-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.account-section-title{align-items:flex-start;flex-direction:column}.account-section-title small{text-align:left}}
@media(max-width:620px){.modal-backdrop{padding:8px}.modal-card,.payment-card{max-height:calc(100dvh - 16px);border-radius:14px}.history-result-grid,.history-info-grid{grid-template-columns:1fr}.history-detail-head{flex-direction:column}.history-detail-head .button{width:100%}.history-list-row{align-items:flex-start;flex-direction:column}.history-list-row .button{width:100%}}

/* v3.7 multi-benefit tabs + admin delete/cancel */
.benefit-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 18px;padding:6px;border:1px solid var(--line);border-radius:16px;background:#f5f7f9;box-shadow:var(--shadow)}
.benefit-tab{border:0;border-radius:11px;background:transparent;padding:12px 10px;font-weight:800;color:#59636e;cursor:pointer;transition:.18s ease}.benefit-tab:hover{background:#fff}.benefit-tab.active{background:#fff;color:#17212b;box-shadow:0 3px 12px rgba(15,23,42,.08)}
.benefit-panel[hidden]{display:none}.inline-link-button{border:0;padding:0;background:transparent;color:var(--brand);font:inherit;font-weight:800;text-decoration:underline;cursor:pointer}.compact-action{margin-top:18px}.salary-six-block{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:14px;background:#fafbfc}.salary-six-block h3{margin:0 0 10px;font-size:.95rem}.salary-six-block p{margin-top:-2px}.is-muted{opacity:.58;pointer-events:none}
.admin-action-row{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.button.danger{background:#fff1f1;border:1px solid #efc0c0;color:#9f1d2a}.button.danger:hover{background:#fee2e2}.button.danger.small{padding:8px 10px}
@media(max-width:820px){.benefit-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.benefit-tabs{grid-template-columns:1fr}.benefit-tab{text-align:left}.admin-action-row{min-width:190px}}

/* v3.8 · auth provider diagnostics, account scroll frames, admin paging */
.auth-provider-hint{margin-top:8px;padding:9px 11px;border:1px solid #f2d38a;background:#fff8e6;border-radius:10px;color:#7a5410;font-size:.78rem;line-height:1.45}
.auth-provider-hint[hidden]{display:none}
.google-button:disabled{opacity:.58;cursor:not-allowed;background:#f8fafc;color:#64748b}
.account-scroll-list{overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;background:#fff}
.history-scroll-list{max-height:305px}
.order-scroll-list{max-height:305px}
.account-scroll-list .account-list-row{min-height:58px;box-sizing:border-box}
.admin-toolbar-search{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.admin-search-group{display:flex;align-items:center;gap:8px;flex:1 1 620px;min-width:0}
.admin-search-group input[type=search]{flex:1;min-width:220px;min-height:38px;border:1px solid var(--line);border-radius:10px;padding:8px 11px;background:#fff}
.admin-pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}
.admin-page-actions{display:flex;gap:8px}
.admin-page-summary{font-weight:600}
@media(max-width:720px){.admin-search-group{flex:1 1 100%;flex-wrap:wrap}.admin-search-group input[type=search]{width:100%;flex-basis:100%}.admin-pagination{align-items:flex-start;flex-direction:column}.history-scroll-list,.order-scroll-list{max-height:305px}}

/* v3.9 · polished public UI ------------------------------------------------ */
:root{
  --bg:#f5f8f9;
  --card:#ffffff;
  --text:#17232c;
  --muted:#667681;
  --line:#dce6e8;
  --brand:#0f766e;
  --brand-dark:#0a5a55;
  --brand-ink:#164e63;
  --soft:#edf7f5;
  --soft-blue:#eef6fb;
  --ok:#18704b;
  --ok-bg:#edf9f3;
  --warn:#8a5a00;
  --warn-bg:#fff8e8;
  --error:#a62936;
  --error-bg:#fff1f2;
  --shadow:0 10px 34px rgba(23,45,52,.065);
  --shadow-lg:0 24px 70px rgba(15,40,48,.14);
}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 8% 0%,rgba(15,118,110,.055),transparent 28rem),
    linear-gradient(180deg,#f8fbfb 0,#f5f8f9 42rem,#f4f7f8 100%);
  color:var(--text);
  font-feature-settings:"tnum" 1,"ss01" 1;
}
.shell{width:min(1320px,calc(100% - 40px))}
.site-header{
  background:rgba(255,255,255,.94);
  border-bottom:1px solid rgba(207,222,225,.9);
  backdrop-filter:blur(12px);
}
.header-inner{min-height:154px;padding:28px 0;gap:28px}
.header-inner>div:first-child{min-width:0}
.eyebrow{color:var(--brand);font-size:.72rem;letter-spacing:.14em}
h1{font-size:clamp(2rem,3.6vw,3.05rem);max-width:760px;color:#10242d}
.lead{margin-top:12px;max-width:720px;font-size:1rem;line-height:1.65;color:#5f707a}
.hero-points{display:flex;gap:8px;flex-wrap:wrap;margin-top:17px}
.hero-points span{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #d9e8e7;border-radius:999px;background:#f7fbfa;color:#42615f;font-size:.76rem;font-weight:700}
.hero-points span::before{content:"✓";display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#dff3ee;color:#0f766e;font-size:.64rem}
.header-actions{min-width:245px;gap:9px}
.law-chip{max-width:300px;padding:10px 12px;border-color:#dbe6e8;border-radius:11px;background:#f8fbfb;font-size:.76rem;line-height:1.45}
.account-button{border-color:#d8e4e5;border-radius:14px;padding:8px 12px;box-shadow:0 2px 9px rgba(23,45,52,.03)}

.page-grid{grid-template-columns:minmax(0,1fr) 286px;gap:22px;padding:24px 0 64px}
.card{border-color:#dfe8ea;border-radius:20px;box-shadow:var(--shadow);padding:25px;margin-bottom:18px}
.section-heading{margin-bottom:20px;align-items:center}
.section-heading h2{font-size:1.22rem;color:#172b34}
.section-heading>p{max-width:420px;color:#71818b;font-size:.82rem;line-height:1.45}
.step{width:31px;height:31px;border-radius:10px;background:#e7f5f2;color:#0f766e;font-size:.72rem}

/* benefit navigation */
.benefit-tabs{
  position:sticky;top:10px;z-index:40;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;margin:0 0 18px;padding:6px;
  border:1px solid rgba(213,226,228,.95);border-radius:18px;
  background:rgba(248,251,251,.94);backdrop-filter:blur(16px);
  box-shadow:0 10px 30px rgba(25,51,58,.07)
}
.benefit-tab{display:flex;align-items:center;gap:10px;min-height:58px;padding:9px 11px;border-radius:13px;text-align:left;color:#5c6b73}
.benefit-tab>span:last-child{display:flex;flex-direction:column;gap:1px;min-width:0}
.benefit-tab strong{font-size:.84rem;color:inherit;white-space:nowrap}
.benefit-tab small{font-size:.68rem;font-weight:600;color:#87949b;white-space:nowrap}
.benefit-tab-no{display:grid;place-items:center;flex:0 0 29px;width:29px;height:29px;border-radius:9px;background:#eaf0f1;color:#66777e;font-size:.68rem;font-weight:850}
.benefit-tab:hover{background:#fff;color:#29434b}
.benefit-tab.active{background:#fff;color:#0b625c;box-shadow:0 5px 17px rgba(26,68,72,.09)}
.benefit-tab.active .benefit-tab-no{background:#dff3ee;color:#0f766e}
.benefit-tab.active small{color:#64847f}

/* forms */
.field{gap:6px}.field>span{font-size:.82rem;color:#32454e}.field small{font-size:.72rem;line-height:1.35}
input,select{min-height:46px;border-color:#cedbdd;border-radius:11px;padding:9px 12px;background:#fff;transition:border-color .15s,box-shadow .15s,background .15s}
input:hover,select:hover{border-color:#b8cccf}
input:focus,select:focus{border-color:#4c9a93;box-shadow:0 0 0 3px rgba(15,118,110,.10)}
input[readonly]{background:#f3f7f7;color:#466069}
.readonly-field{background:#f8fbfb;border:1px solid #edf2f3;padding:10px;margin:-10px;border-radius:14px}
.check-field{border-radius:12px;color:#4c5e66}
.advanced{margin-top:20px;padding-top:16px;border-top:1px solid #e7eeee}
.advanced summary{display:inline-flex;align-items:center;gap:7px;color:#166b65;font-size:.84rem}
.advanced summary::before{content:"＋";font-size:.9rem}
.advanced[open] summary::before{content:"−"}

.method-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;padding:12px 14px;border:1px solid #deebea;border-radius:13px;background:#f7fbfa;color:#52656d;font-size:.82rem}
.method-intro strong{color:#214943}.method-intro span{text-align:right}
.entry-method-heading{margin:20px 0 10px}
.entry-method-heading>div{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.entry-method-heading strong{font-size:.9rem;color:#243b44}.entry-method-heading span{font-size:.76rem;color:#7a8990}
.table-wrap{border-color:#dfe8ea;border-radius:14px;background:#fff}
.history-table th{background:#f5f9f9;color:#607179;padding:10px 9px}
.history-table td{border-bottom-color:#eef3f4}.history-table tbody tr:hover{background:#fbfdfd}
.table-note{font-size:.75rem}
.helper-details{margin:10px 0 0;border:1px solid #e4ecee;border-radius:12px;background:#fbfdfd;overflow:hidden}
.helper-details summary{cursor:pointer;padding:10px 13px;font-size:.78rem;font-weight:750;color:#49626a;list-style:none}
.helper-details summary::-webkit-details-marker{display:none}.helper-details summary::after{content:"＋";float:right;color:#789098}
.helper-details[open] summary::after{content:"−"}.helper-details>p{margin:0;padding:0 13px 12px;color:#60727a;font-size:.77rem}
.file-guidance{margin:0 0 14px;background:#f8fbfb}
.helper-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:0 12px 12px}
.helper-grid p{margin:0;padding:10px;border:1px solid #e6eeee;border-radius:10px;background:#fff}.helper-grid strong,.helper-grid span{display:block}.helper-grid strong{font-size:.76rem;color:#2d4a51}.helper-grid span{margin-top:3px;font-size:.72rem;color:#73838a;line-height:1.4}

.file-import-block{margin-top:18px;padding:17px;border:1px solid #e0eaeb;border-radius:16px;background:#fbfdfd}
.upload-grid{grid-template-columns:1.3fr .7fr;gap:14px}
.dropzone{min-height:112px;border-color:#a9c9c5;border-radius:14px;background:#f7fbfa;color:#234f4a;position:relative}
.dropzone::before{content:"↑";display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#e2f2ef;color:#0f766e;font-size:1.15rem;font-weight:800;margin-bottom:3px}
.dropzone:hover{border-color:#58a49c;background:#f2faf8}
.dropzone strong{font-size:.86rem}.dropzone span{font-size:.72rem;max-width:520px}
.upload-actions{padding:4px}.upload-actions .button{width:100%}.upload-actions p{font-size:.75rem;line-height:1.5}
.import-progress{background:#f6fbfa;border-color:#d6e8e5}
.import-review{border-radius:14px}
.forecast-panel{margin-top:17px;border-radius:15px}
.forecast-toggle{padding:14px}.forecast-toggle strong{font-size:.88rem}.forecast-toggle small{font-size:.74rem}
.compact-info{margin-bottom:18px}
.salary-six-block{background:#fbfdfd;border-color:#e1eaeb}

.button{border-radius:11px;padding:10px 15px;box-shadow:none}
.button:hover{transform:translateY(-1px)}
.button.primary{background:linear-gradient(135deg,#0f766e,#116a78);color:#fff;box-shadow:0 7px 17px rgba(15,118,110,.16)}
.button.primary:hover{background:linear-gradient(135deg,#0b645e,#0e5968)}
.button.secondary{background:#f3f9f8;border-color:#d3e7e3;color:#0f6b64}
.button.dark{background:#183844}
.action-bar{padding:17px 20px;border-radius:16px;background:linear-gradient(135deg,#153e46,#174e56);box-shadow:0 12px 28px rgba(19,62,70,.13)}
.action-bar>div{gap:2px}.action-bar strong{font-size:.9rem}.action-bar span{color:#c5d9dc;font-size:.76rem}
.action-bar .button.primary{background:#fff;color:#0c625c;box-shadow:none}
.action-bar .button.primary:hover{background:#edf8f6}

.result-card{border-top:3px solid #cbe7e3}.empty-result{min-height:118px}.empty-result strong{color:#35505a}
.metric{border-color:#e0e9eb;background:#fff;border-radius:14px}.metric.primary{background:linear-gradient(135deg,#153e46,#0f766e);border-color:transparent}
.explain{border-top-color:#e6edef}.explain p,.explain li{color:#566971}

/* sidebar */
.quick-guide-card{padding:20px;background:linear-gradient(180deg,#fff,#fbfdfd)}
.sidebar-kicker{font-size:.66rem;letter-spacing:.12em;font-weight:850;color:#0f766e}.quick-guide-card h3{margin:5px 0 15px;font-size:1.05rem}
.quick-guide-list{display:grid;gap:12px}.quick-guide-list>div{display:flex;gap:10px;align-items:flex-start}.quick-guide-list b{display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;border-radius:9px;background:#e5f4f1;color:#0f766e;font-size:.72rem}.quick-guide-list span{display:flex;flex-direction:column;gap:1px}.quick-guide-list strong{font-size:.8rem;color:#2e474f}.quick-guide-list small{font-size:.71rem;line-height:1.4;color:#76868d}
.privacy-mini{margin-top:17px;padding:12px;border-radius:12px;background:#eef7fb;border:1px solid #dcebf1}.privacy-mini strong,.privacy-mini span{display:block}.privacy-mini strong{font-size:.76rem;color:#315565}.privacy-mini span{margin-top:2px;font-size:.71rem;color:#6c8089}
.legal-details{margin-top:14px;padding-top:13px;border-top:1px solid #e6eeee}.legal-details summary{cursor:pointer;font-size:.76rem;font-weight:750;color:#546971}.legal-details p{margin:9px 0 0;font-size:.7rem;line-height:1.5;color:#7b898f}

/* modals */
.modal-backdrop{background:rgba(15,35,42,.48);backdrop-filter:blur(5px);padding:18px}
.modal-card{border:1px solid rgba(220,231,233,.9);border-radius:22px;box-shadow:var(--shadow-lg);padding:27px}
.modal-card h2{color:#172e36;letter-spacing:-.02em}.modal-intro{margin:-5px 0 18px;color:#708087;font-size:.84rem}.terms-note{display:block;margin-top:14px;color:#849198;line-height:1.5}.terms-note a{color:#486c70}
.modal-close{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;right:12px;top:12px;color:#74848b}.modal-close:hover{background:#f1f6f6;color:#23434b}
.auth-card{width:min(500px,100%)}.auth-section{gap:11px}.auth-divider{margin:14px 0}.google-button{border-color:#d5e0e2;border-radius:11px}
.plan-grid{gap:12px}.plan-card{border-color:#dfe8ea;border-radius:16px;padding:18px;transition:.16s ease}.plan-card:hover{border-color:#b9d8d4;box-shadow:0 12px 25px rgba(20,70,72,.07);transform:translateY(-2px)}.plan-card>strong{color:#0f625d}
.wallet-summary article{border-color:#e0e9eb;background:#fbfdfd}.wallet-summary strong{color:#174e56}
.account-list{border-color:#e1e9eb;border-radius:14px;background:#fff}.account-list-row{border-bottom-color:#edf2f3}.account-list-row:hover{background:#f8fbfb}
.account-section-title h3{font-size:.92rem;margin-bottom:8px}.history-detail-panel{background:#f8fbfb;border-color:#dde9ea}

/* payment */
.payment-card{border-radius:24px}.payment-heading{border-bottom-color:#e8eeee}.payment-status.pending{background:#fff8e7;color:#8a5a00}.payment-instruction{background:#f4faf9;border-color:#dcebe8}.payment-waiting{border-radius:14px}.payment-copy{background:#e9f6f2;color:#295c55}.payment-copy:hover{background:#dff1ec}

.footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:4px 0 34px;text-align:left;border-top:1px solid #e1e9eb;padding-top:20px}.footer nav{display:flex;gap:16px}.footer a{text-decoration:none;color:#5c747a}.footer a:hover{color:#0f766e}

/* admin visual system */
.admin-header .header-inner{min-height:130px}.admin-shell{padding-top:22px}.admin-metric{border-color:#dfe8ea;border-radius:18px;box-shadow:var(--shadow)}.admin-metric strong{color:#174e56}
.admin-toolbar-search{gap:12px}.admin-search-group input{border-radius:11px}.admin-table th{background:#f4f8f8;color:#60727a}.admin-table tbody tr:hover{background:#fbfdfd}.admin-pagination button{border-radius:9px}
.payos-admin-box{background:#f7fbfa;border-color:#dce9e7;border-radius:14px}.admin-plan-form{padding:4px 0}

/* responsive */
@media(max-width:1100px){
  .page-grid{grid-template-columns:1fr}.side-column{order:initial}.sticky-card{position:static}.quick-guide-card{display:none}
}
@media(max-width:820px){
  .shell{width:min(100% - 24px,1320px)}
  .header-inner{padding:23px 0;gap:20px}.header-actions{width:100%;align-items:flex-start}.law-chip{display:none}
  .benefit-tabs{display:flex;overflow-x:auto;scrollbar-width:none;top:6px;padding:5px}.benefit-tabs::-webkit-scrollbar{display:none}.benefit-tab{flex:0 0 165px;min-height:54px}.benefit-tab small{display:none}
  .card{padding:18px;border-radius:17px}.section-heading{align-items:flex-start}.method-intro{flex-direction:column;align-items:flex-start;gap:3px}.method-intro span{text-align:left}
  .helper-grid{grid-template-columns:1fr}.file-import-block{padding:14px}.upload-grid{grid-template-columns:1fr}.upload-actions .button{width:auto}
  .footer{flex-direction:column;align-items:flex-start}.footer nav{flex-wrap:wrap}
}
@media(max-width:620px){
  body{background:#f7f9fa}.shell{width:min(100% - 16px,1320px)}
  h1{font-size:2rem}.lead{font-size:.9rem}.hero-points{gap:6px}.hero-points span{font-size:.69rem;padding:6px 8px}
  .page-grid{padding-top:12px}.benefit-tabs{margin-left:-1px;margin-right:-1px;border-radius:14px}.benefit-tab{flex-basis:145px;padding:8px}.benefit-tab-no{width:27px;height:27px;flex-basis:27px}.benefit-tab strong{font-size:.78rem}
  .card{padding:15px;margin-bottom:12px}.section-heading{margin-bottom:16px}.section-heading>p{font-size:.76rem}.step{width:28px;height:28px}
  .form-grid.four,.form-grid.three{gap:12px}.readonly-field{margin:-5px;padding:8px}
  .action-bar{padding:14px;border-radius:14px}.action-bar .button.primary{width:100%}
  .modal-backdrop{padding:7px}.modal-card{padding:21px 16px;border-radius:17px}.wide-modal{width:100%}.plan-grid{grid-template-columns:1fr}.wallet-summary{gap:8px}.account-columns{gap:12px}
  .payment-card{padding:20px 14px}.payment-transfer-grid{gap:18px}.payment-qr-frame{width:min(290px,100%)}
}

/* v3.10 · Admin table filters */
.admin-filter-panel{margin:0 0 16px;padding:14px;border:1px solid #dbe8e8;border-radius:14px;background:#f8fbfb}
.admin-filter-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.admin-filter-head strong{display:block;color:#173b43;font-size:.9rem}
.admin-filter-head span{display:block;margin-top:3px;color:var(--muted);font-size:.76rem;line-height:1.45}
.admin-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.admin-filter-grid .field{gap:5px}
.admin-filter-grid .field>span{font-size:.72rem;font-weight:700;color:#536a70}
.admin-filter-grid input,.admin-filter-grid select{min-height:39px;padding:8px 10px;border-radius:10px;background:#fff}
.admin-filter-span-2{grid-column:span 2}
.admin-filter-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid #e3eded}
@media(max-width:1050px){.admin-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.admin-filter-panel{padding:12px}.admin-filter-grid{grid-template-columns:1fr}.admin-filter-span-2{grid-column:auto}.admin-filter-actions{justify-content:stretch}.admin-filter-actions .button{flex:1 1 120px}}

/* v3.11 - eligibility gates */
.eligibility-section,.eligibility-guide{margin:18px 0;padding:18px;border:1px solid #d9e7e8;border-radius:16px;background:#f8fbfb}
.section-subheading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.section-subheading h3{margin:0;font-size:1rem;color:#173c43}.section-subheading p{margin:0;max-width:600px;font-size:.82rem;color:#60757a}
.eligibility-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.eligibility-checks.grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.check-field.eligibility-check{padding:13px 14px;border:1px solid #dce7e9;background:#fff;align-items:flex-start}
.check-field.eligibility-check span{display:flex;flex-direction:column;gap:3px}.check-field.eligibility-check strong{font-size:.86rem;color:#173c43}.check-field.eligibility-check small{font-size:.76rem;line-height:1.45;color:#6a7a7e}
.eligibility-guide-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.eligibility-guide-list>div{padding:13px 14px;border:1px solid #dce7e9;border-radius:12px;background:#fff;display:flex;flex-direction:column;gap:5px}.eligibility-guide-list strong{font-size:.86rem;color:#173c43}.eligibility-guide-list span{font-size:.78rem;line-height:1.5;color:#60757a}
@media(max-width:760px){.eligibility-checks,.eligibility-checks.grid-two,.eligibility-guide-list{grid-template-columns:1fr}.section-subheading{display:block}.section-subheading p{margin-top:5px}}