body{background:#f6f1e8}
#root{min-height:100vh}
.shell{display:grid;grid-template-columns:260px 1fr;min-height:100vh}
.side{background:linear-gradient(180deg,#3b1019,#240a10);color:#e9d9b8;padding:26px 16px;position:sticky;top:0;height:100vh;overflow:auto}
.side .logo{color:#f6e8c8;margin:0 8px 22px}.side .couple{margin:0 8px 22px;padding:14px;border:1px solid rgba(217,187,126,.35);border-radius:14px;font:600 20px 'Cormorant Garamond';text-align:center;color:#f6e8c8}
.side .couple small{display:block;font:12px 'Be Vietnam Pro';color:var(--gold2);margin-top:4px;letter-spacing:.06em}
.side a.m{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;color:#d9c7a3;text-decoration:none;font-size:14.5px;margin-bottom:2px;cursor:pointer}
.side a.m:hover{background:rgba(255,255,255,.07)}.side a.m.on{background:rgba(217,187,126,.16);color:#fff;box-shadow:inset 3px 0 0 var(--gold2)}
.side .sp{height:1px;background:rgba(217,187,126,.2);margin:14px 8px}
.main{padding:34px clamp(18px,3vw,46px) 70px;max-width:1280px;width:100%}
.top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:26px}
.top h1{font-size:42px;color:var(--wine)}.top p{margin:4px 0 0;color:var(--muted)}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:0 8px 28px -22px rgba(80,50,30,.5)}
.card h3{font-size:24px;margin-bottom:12px;color:var(--wine)}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.kpi b{display:block;font:600 38px 'Be Vietnam Pro',sans-serif;color:var(--wine);line-height:1}.kpi span{font-size:13px;color:var(--muted)}
.countdown{background:linear-gradient(135deg,#6d1f2e,#3b1019);color:#f6e8c8;border:0}.countdown b{font:600 72px 'Cormorant Garamond';color:#f9ecd0}.countdown span{color:var(--gold2);display:block}.countdown b{display:block;line-height:1.05;margin:2px 0}
.bar{height:8px;background:#eadfcb;border-radius:9px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));border-radius:9px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.sp-b{justify-content:space-between}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:18px}.tabs button{border:1px solid var(--line);background:#fff;padding:8px 16px;border-radius:999px;cursor:pointer;font:500 13.5px 'Be Vietnam Pro';color:var(--muted)}.tabs button.on{background:var(--wine);color:#fff;border-color:var(--wine)}
.task{display:flex;gap:14px;padding:13px 4px;border-bottom:1px dashed var(--line);align-items:flex-start}
.task:last-child{border:0}.task.done .tt{text-decoration:line-through;color:#aa9d8f}
.chk{width:22px;height:22px;border-radius:7px;border:2px solid var(--gold);flex:none;margin-top:2px;cursor:pointer;display:grid;place-items:center;color:#fff;font-size:13px}.done .chk{background:var(--gold)}
.tt{font-weight:500}.td{font-size:13px;color:var(--muted)}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:11.5px;background:#f2e6cd;color:#7a5a1d;margin-right:6px}.pill.red{background:#f6d9dc;color:#8c2230}.pill.green{background:#dcebdc;color:#2b6a35}.pill.blue{background:#dde6f3;color:#274b7a}.pill.gray{background:#eee;color:#666}
table.t{width:100%;border-collapse:collapse;font-size:14px}.t th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:10px 8px;border-bottom:1px solid var(--line)}.t td{padding:10px 8px;border-bottom:1px solid #f0e8d9;vertical-align:middle}
.t input,.t select{padding:7px 9px;font-size:13.5px;border-radius:8px}
.dc{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:6px;transition:.25s}.dc:hover{border-color:var(--gold2);box-shadow:var(--shadow)}
.dc h4{margin:0;font:600 22px 'Cormorant Garamond';color:var(--wine)}.dc small{color:var(--muted)}
.modal{position:fixed;inset:0;background:rgba(30,10,15,.55);display:grid;place-items:center;z-index:90;padding:16px;backdrop-filter:blur(3px)}
.mbox{background:var(--paper);border-radius:22px;max-width:760px;width:100%;max-height:92vh;overflow:auto;padding:28px;position:relative}.mbox h2{font-size:34px;color:var(--wine);margin-bottom:10px}
.x{position:absolute;right:18px;top:14px;border:0;background:none;font-size:26px;cursor:pointer;color:var(--muted)}
.stars{color:var(--gold);letter-spacing:2px;cursor:pointer;font-size:20px}
.score{font:600 44px 'Cormorant Garamond';color:var(--wine)}
.step-card{border-left:3px solid var(--gold2);padding:6px 0 6px 18px;margin-bottom:20px}.step-card h4{font:600 24px 'Cormorant Garamond';margin:0;color:var(--wine)}
.empty{text-align:center;color:var(--muted);padding:34px}
.mobtop{display:none}
@media(max-width:900px){.shell{grid-template-columns:1fr}.side{position:fixed;left:-280px;width:270px;z-index:80;transition:.3s}.side.open{left:0}.mobtop{display:flex;position:sticky;top:0;background:#3b1019;color:#f6e8c8;padding:12px 16px;z-index:70;justify-content:space-between;align-items:center}.grid2,.grid3,.grid4{grid-template-columns:1fr}.top h1{font-size:34px}.t{display:block;overflow-x:auto}}

.card.next{border:0;background:linear-gradient(135deg,#fff8ea,#f7e7c8);padding:28px}.card.next .nx{display:flex;gap:18px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.card.rew{background:linear-gradient(135deg,#fffdf7,#f6efe0)}
.main{font-size:17px}.btn{min-height:44px}.t td,.t th{padding:12px 8px}
@media(max-width:900px){.card.next .btn{width:100%;justify-content:center}}
.side .logo{margin:0 8px 18px;gap:9px}.side .logo img{height:22px}.side .logo .wd{font-size:19px;padding-left:9px}
.task .chk{position:relative}.task .chk:after{content:"";position:absolute;inset:-12px}@media(max-width:700px){.task .chk{width:28px;height:28px;font-size:16px;margin-top:0}.task .btn.sm{min-width:44px;min-height:44px}}
@media(max-width:480px){.btn.sm{min-height:44px;padding-top:10px;padding-bottom:10px}select,input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]){min-height:44px}}
@media(max-width:480px){.mbox .x,.modal .x,button.x{min-width:44px;min-height:44px;font-size:24px;line-height:1}.tabs button,.tabs a{min-height:44px}label:has(>input[type=checkbox]),label:has(>input[type=radio]){min-height:44px;display:inline-flex;align-items:center;gap:8px}input[type=checkbox],input[type=radio]{min-width:22px;min-height:22px}}
/* ngân sách: cảnh báo + thanh tiến độ + bảng gọn trên mobile */
.bg-alerts{display:grid;gap:6px;margin-top:16px}.bg-al{padding:9px 12px;border-radius:10px;font-size:13.5px;border-left:4px solid}.bg-al.red{background:#fbe4e6;color:#8c2230;border-color:#c0394a}.bg-al.orange{background:#fdecd6;color:#8a4b08;border-color:#e08a1e}
.bg-bar.orange i{background:#e08a1e}.bg-bar.red i{background:#c0394a}.bgt tr.bg-over input[data-f=actual]{border-color:#c0394a;color:#8c2230}.bgt tr.bg-due input[data-f=due_date]{border-color:#e08a1e}.bg-note{font-size:11.5px;margin-top:2px}.bg-note.red{color:#8c2230}.bg-note.orange{color:#8a4b08}
.bgt input{min-width:0;width:100%}
@media(max-width:700px){.bgt,.bgt tbody{display:block}.bgt tr:first-child{display:none}.bgt tr{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;padding:12px 0;border-bottom:1px dashed var(--line);position:relative}.bgt td{display:block;padding:0;min-width:0}.bgt td:first-child{grid-column:1/-1;padding-right:44px}.bgt td[data-l]:not(:first-child):before{content:attr(data-l);display:block;font-size:11px;color:var(--muted);margin-bottom:2px}.bgt td:last-child{position:absolute;top:8px;right:0}.bgt td[data-l=\"Nhà cung cấp\"]{grid-column:1/-1}}
/* checklist: lọc theo mốc lễ + thao tác nhanh */
.tabs.moc{margin-top:-6px}.tabs.moc button small{opacity:.7;margin-left:2px}
.task .qa{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.task .qa .btn.sm{padding:5px 11px;font-size:12.5px}.task .qa .btn.on{background:#f2e6cd;border-color:var(--gold)}
@media(max-width:700px){.task .qa .btn.sm{min-height:40px;flex:1 1 auto}}