:root{--bg:#f3f7fc;--surface:#fff;--border:#dbe5f1;--text:#172b45;--muted:#5d7190;--accent:#2563c9;--accent-soft:#e6effb;--ok:#5a9a72;--warn:#d49a3a;--over:#c4473f;--surface-alt:#f7fafd;--neutral-soft:#e8eef6;--ok-soft:#e7f3eb;--ok-text:#3d7a54;--warn-soft:#fdf3e1;--warn-text:#8a6420;--over-soft:#fdf1f0;--radius:10px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px}@media screen and (prefers-color-scheme:dark){:root{--bg:#0f1724;--surface:#172233;--border:#2b3b53;--text:#e2eaf5;--muted:#94a6c0;--accent:#4d86e6;--accent-soft:#1d3150;--ok:#74b98d;--warn:#e0ad55;--over:#ec7a71;--surface-alt:#1b283a;--neutral-soft:#24324a;--ok-soft:#1c3326;--ok-text:#8fd0a6;--warn-soft:#3a2f1b;--warn-text:#e6bd70;--over-soft:#3a2024;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--bg);margin:0}h1{letter-spacing:-.01em;color:var(--accent);margin:0;font-size:22px;font-weight:700}input,select,button{font:inherit;color:inherit}input,select,textarea{border:1px solid var(--border);background:var(--surface);width:100%;font:inherit;color:var(--text);border-radius:6px;padding:6px 8px;font-size:1rem}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}input.money,input.small{text-align:right;font-variant-numeric:tabular-nums}input.money{min-width:120px}input.small{width:70px}button{border:1px solid var(--border);background:var(--surface);cursor:pointer;white-space:nowrap;border-radius:6px;padding:7px 14px}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.danger{color:var(--over)}button.icon{color:var(--muted);padding:4px 8px}.app{max-width:1240px;margin:0 auto;padding:24px 16px 64px}.header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.brand{flex-direction:column;align-items:flex-start;gap:8px;min-width:0;display:flex}.brand-pill{border:1px solid var(--border);background:var(--surface);border-radius:999px;align-items:center;gap:10px;max-width:100%;padding:6px 16px 6px 6px;display:flex}.brand-pill h1{color:var(--text);white-space:nowrap;font-size:16px}.brand-logo{border-radius:8px;flex:none;width:30px;height:30px}.brand-divider{background:var(--border);flex:none;align-self:stretch;width:1px;margin:4px 2px}.owner{min-width:0;color:var(--muted);white-space:nowrap;align-items:center;gap:6px;font-size:15px;display:flex}.owner-name{text-overflow:ellipsis;overflow:hidden}.owner img{border-radius:50%;flex:none;width:26px;height:26px}.brand .muted{margin:0 0 0 6px}.actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.muted{color:var(--muted);margin:4px 0 0}.summary{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:20px;padding:20px}.setup{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));align-items:end;gap:12px;margin-bottom:20px;display:grid}label{color:var(--muted);flex-direction:column;gap:4px;font-size:12px;display:flex}label.inline{flex-direction:row;align-items:center;gap:8px}label.inline select{width:auto}.countdown{background:var(--accent-soft);color:var(--accent);border-radius:6px;align-items:baseline;gap:6px;padding:6px 12px;display:flex}.countdown strong{font-size:22px}.cards{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px;display:grid}.card{border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:4px;padding:14px;display:flex}.card-label{color:var(--muted);font-size:12px}.card-value{font-variant-numeric:tabular-nums;font-size:20px}.card-hint{color:var(--muted);font-size:12px}.card.ok .card-value{color:var(--ok)}.card.over{border-color:var(--over);background:var(--over-soft)}.card.over .card-value{color:var(--over)}.overall{align-items:center;gap:12px;display:flex}.overall span:first-child{color:var(--muted);white-space:nowrap}.overall .progress{flex:1}.progress{background:var(--neutral-soft);border-radius:9px;min-width:100px;height:18px;position:relative;overflow:hidden}.progress-fill{height:100%;transition:width .2s}.progress-fill.ok{background:var(--ok)}.progress-fill.warn{background:var(--warn)}.progress-fill.over{background:var(--over)}.progress-label{color:var(--text);place-items:center;font-size:11px;font-weight:600;display:grid;position:absolute;inset:0}.tabs{z-index:5;border-bottom:1px solid var(--border);background:var(--bg);gap:4px;margin-bottom:16px;display:flex;position:sticky;top:0;overflow-x:auto}.tab-short{display:none}.tabs button{color:var(--muted);background:0 0;border:none;border-bottom:2px solid #0000;border-radius:0}.tabs button.active{border-bottom-color:var(--accent);color:var(--accent);font-weight:600}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.toolbar .muted{margin:0}.notice{background:var(--warn-soft);color:var(--warn-text);border-radius:6px;padding:10px 14px}.notice.over{background:var(--over-soft);color:var(--over)}.notice.banner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.notice.banner .actions{align-items:center;gap:6px;display:flex}.reassign{flex-wrap:wrap;align-items:center;gap:8px;padding-top:8px;display:flex}.reassign select{width:auto;min-width:180px}.toast{z-index:10;border-radius:var(--radius);background:var(--text);max-width:calc(100% - 32px);color:var(--bg);align-items:center;gap:12px;padding:10px 10px 10px 16px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #00000040}.toast button.link,.toast button.icon{color:inherit}.toast button.link{font-weight:600}.empty{text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:var(--radius);background:var(--surface);padding:40px 16px}.table-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--border);text-align:left;vertical-align:middle;padding:8px 10px}th{color:var(--muted);white-space:nowrap;background:var(--surface-alt);font-size:12px;font-weight:600}td.num,th.num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}td input:not(.small):not(.money):not([type=checkbox]),td select{min-width:140px}tbody td.row-title{min-width:230px}.name-stack{flex-direction:column;gap:2px;display:flex}.name-stack input.notes{color:var(--muted);background:0 0;border-color:#0000;padding:2px 8px;font-size:12px}.name-stack input.notes:hover{border-color:var(--border)}td.strong{font-weight:600}.over-text{color:var(--over);font-weight:600}tfoot td{background:var(--surface-alt);border-bottom:none;font-weight:600}.badge{white-space:nowrap;border-radius:999px;padding:2px 8px;font-size:12px;display:inline-block}.badge.belum{background:var(--neutral-soft);color:var(--muted)}.badge.dp{background:var(--warn-soft);color:var(--warn-text)}.badge.lunas{background:var(--ok-soft);color:var(--ok-text)}.badge.lebih{background:var(--over-soft);color:var(--over);font-weight:600}.filters{flex-wrap:wrap;gap:12px;display:flex}.stack{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.stack.start{align-items:flex-start}input.search{width:220px}button.link{color:var(--accent);text-underline-offset:2px;background:0 0;border:none;padding:0;font-size:12px;text-decoration:underline}.contact{align-items:center;gap:4px;display:flex}.contact-link{border:1px solid var(--border);width:30px;height:30px;color:var(--accent);border-radius:6px;flex-shrink:0;place-items:center;font-weight:600;text-decoration:none;display:grid}.contact-link:hover{border-color:var(--accent);background:var(--accent-soft)}.row-buttons{align-items:center;gap:4px;display:flex}.detail-toggle{padding:4px 10px;font-size:12px}.detail-toggle.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}tr.open td{border-bottom-color:#0000}tr.detail-row td.detail-cell{background:var(--surface-alt);padding:4px 16px 16px}.detail{grid-template-columns:minmax(0,2fr) minmax(220px,1fr);gap:20px;display:grid}.detail h4{margin:8px 0;font-size:13px}.payments{margin:0;padding:0;list-style:none}.payments li{grid-template-columns:auto minmax(120px,1fr) 140px 150px 90px auto;align-items:center;gap:8px;padding:4px 0;display:grid}.payments li.paid .payment-label{color:var(--muted)}.payments input[type=date]{min-width:0}.payments-foot{flex-wrap:wrap;align-items:center;gap:12px;margin-top:8px;font-size:12px;display:flex}.payments-foot button{padding:4px 10px;font-size:12px}.detail-notes{margin-top:8px}.detail-notes textarea{resize:vertical}label.check{white-space:nowrap;cursor:pointer;flex-direction:row;align-items:center;gap:4px;font-size:11px}input[type=checkbox]{width:auto;min-width:0;accent-color:var(--accent);margin:0}.sub{color:var(--muted);white-space:nowrap;font-size:11px}input:disabled{background:var(--surface-alt);color:var(--muted)}td input[type=date]{min-width:140px}.due-tag{white-space:nowrap;background:var(--neutral-soft);color:var(--muted);border-radius:4px;padding:1px 6px;font-size:11px;display:inline-block}.due-tag.warn{background:var(--warn-soft);color:var(--warn-text);font-weight:600}.due-tag.over{background:var(--over-soft);color:var(--over);font-weight:600}.due-list{border-top:1px solid var(--border);margin-top:16px;padding-top:14px}.due-list h2,.stage-head h3{margin:0;font-size:13px;font-weight:600}.due-list ul,.tasks{margin:8px 0 0;padding:0;list-style:none}.due-list li{border-bottom:1px dashed var(--border);grid-template-columns:1fr auto auto 130px;align-items:center;gap:12px;padding:6px 0;display:grid}.due-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.due-date{color:var(--muted);font-size:12px}.due-amount{text-align:right;font-variant-numeric:tabular-nums}.checklist-progress{margin-bottom:16px}.stages{gap:12px;display:grid}.stage{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px}.stage-head{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.stage-head .muted{margin:0;font-size:12px}.add-task{margin-left:auto;font-size:12px}.stage-empty{font-size:12px}.stage-lock{color:var(--warn-text);margin:6px 0 0;font-size:12px}.tasks input[type=checkbox]:disabled{cursor:not-allowed}.tasks li{align-items:center;gap:8px;padding:4px 0;display:flex}.tasks .task-title{border-color:#0000;flex:1}.tasks .task-title:hover{border-color:var(--border)}.tasks select{width:auto;color:var(--muted);font-size:12px}.tasks .task-title.fixed{cursor:default;padding:6px 9px;font-weight:600}.tasks li.done .task-title{color:var(--muted);text-decoration:line-through}.print-only{display:none}.footer{border-top:1px solid var(--border);text-align:center;color:var(--muted);margin-top:48px;padding-top:16px;font-size:13px}.footer p{margin:0}.footer .hint{margin-top:6px;font-size:12px}.support{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;align-items:center;gap:10px;max-width:480px;margin:0 auto 20px;padding:16px;display:flex}.support .hint{margin-top:0}.support-link{background:var(--accent);color:#fff;border-radius:6px;padding:8px 16px;font-weight:600;text-decoration:none}.support-link:hover{filter:brightness(1.1)}@media (width<=640px){.app{padding:16px 16px 40px}.brand-pill{gap:8px;padding-right:12px}.brand-pill h1,.owner{font-size:13px}.actions{width:100%}.actions button{flex:1}.actions button.icon{flex:none}.summary{padding:14px}.cards{grid-template-columns:1fr 1fr;gap:8px}.card{padding:10px}.card-value{font-size:16px}.toolbar>.primary{width:100%}.tabs{margin:0 -16px 16px;padding:0 16px}.tabs button{flex:1;padding:10px 4px}.tab-long{display:none}.tab-short{display:inline}input,select,textarea{font-size:16px}.filters,.filters label.inline{width:100%}.filters label.inline select,input.search{flex:1}input.search{width:100%}.table-wrap{background:0 0;border:none;overflow:visible}.table-wrap table,.table-wrap tbody,.table-wrap tfoot,.table-wrap tr,.table-wrap td{display:block}.table-wrap thead{display:none}.table-wrap tr{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px;padding:10px 12px;position:relative}.table-wrap tfoot tr{background:var(--surface-alt)}.table-wrap td{text-align:right;background:0 0;border:none;justify-content:space-between;align-items:center;gap:12px;padding:5px 0;display:flex}.table-wrap td:empty{display:none}.table-wrap td[data-label]:before{content:attr(data-label);color:var(--muted);text-align:left;flex-shrink:0;font-size:12px;font-weight:400}.table-wrap td input:not(.small),.table-wrap td select,.table-wrap td .progress{flex:1;min-width:0;max-width:65%}.table-wrap td.row-title{text-align:left;min-width:0;padding-right:40px;font-weight:600}.table-wrap td.row-title input{max-width:none;font-weight:600}.table-wrap td.row-title>.name-stack{align-items:stretch;max-width:none}.table-wrap td.row-title input.notes{font-size:16px;font-weight:400}.table-wrap td.row-actions{padding:0;position:absolute;top:10px;right:8px}.table-wrap td.row-actions button{padding:8px 12px}.table-wrap td>div{flex:1;align-items:flex-end;max-width:65%}.table-wrap td>div input:not([type=checkbox]){width:100%;max-width:none}.table-wrap td.row-actions:has(.row-buttons){padding-top:8px;position:static}.table-wrap td.row-actions .row-buttons{max-width:none}.row-buttons .detail-toggle{flex:1;padding:8px 12px}.table-wrap tr.open{border-bottom-right-radius:0;border-bottom-left-radius:0;margin-bottom:0}.table-wrap tr.detail-row{background:var(--surface-alt);border-top-left-radius:0;border-top-right-radius:0;margin-top:-1px}.table-wrap td.detail-cell{text-align:left;padding:0;display:block}.table-wrap td.detail-cell>.detail{max-width:none}tr.detail-row td.detail-cell{background:0 0;padding:0}.detail{grid-template-columns:1fr;gap:8px}.payments li{border-bottom:1px dashed var(--border);grid-template-columns:auto 1fr 1fr auto;padding:8px 0}.payments li>.payment-label{grid-column:2/4}.payments li>input.money{grid-area:2/1/auto/3}.payments li>input[type=date]{grid-area:2/3/auto/5}.payments li>.payment-tag{grid-column:1/-1}.payments li>.payment-tag:empty{display:none}.payments li>button.icon{grid-area:1/4}.payments li>input,.table-wrap .payments input{max-width:none}.due-list li{grid-template-columns:1fr auto;row-gap:2px}.due-list .due-tag{justify-self:start}.tasks li{flex-wrap:wrap}.tasks .task-title{flex-basis:calc(100% - 32px)}.tasks select{margin-left:24px}.tasks li .icon{margin-left:auto}}@media (width<=400px){.brand-pill{gap:6px;padding:4px 10px 4px 4px}.brand-pill h1,.owner{font-size:12px}.owner{gap:4px}.brand-logo{width:26px;height:26px}.owner img{width:22px;height:22px}}@media print{@page{size:A4;margin:14mm}.screen-only{display:none!important}.print-only{display:block}:root,body{background:#fff;font-size:10.5pt}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}.report h1{font-size:18pt}.report header p{margin:4px 0 0}.report h2{break-after:avoid;margin:18px 0 6px;font-size:12pt}.report table{border:1px solid var(--border)}.report th,.report td{padding:4px 8px}.report tr{break-inside:avoid}.report .nowrap{white-space:nowrap}.report-summary{margin-top:14px}.report-summary th{font-size:inherit;background:0 0}.report tr.has-sub td{border-bottom:none}.report-sub td{color:var(--muted);padding-top:0;font-size:9pt}.report-sub span+span:before{content:" · "}.report-sub .paid{color:var(--ok-text)}.report-tasks{columns:2}.report-stage{break-inside:avoid;margin-bottom:8px}.report-stage h3{margin:0 0 2px;font-size:10.5pt}.report-stage ul{margin:0;padding:0;list-style:none}.report-stage li{padding:1px 0}}
