:root{color-scheme:light;--ink:#233a32;--muted:#6d7c73;--green:#235b42;--green-deep:#194330;--light:#eef3e9;--line:#e4e9df;--paper:rgba(255,255,254,.93);--shadow:0 12px 45px rgba(41,65,47,.08);font-family:'DM Sans',system-ui,Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#eef3e9 url('./italia-atlas.svg') center top / cover fixed;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #a4c59c;outline-offset:2px}button:disabled{cursor:default;opacity:.5}.app-shell{margin:0 auto;max-width:1500px;min-height:100vh;padding:0 36px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid rgba(75,111,89,.16);padding:29px 0 27px}.identity{display:flex;align-items:center;gap:17px}.logo{display:grid;place-items:center;width:59px;height:59px;border-radius:17px;background:var(--green);color:white;box-shadow:0 10px 20px rgba(35,91,66,.19);flex-shrink:0}.overline,.eyebrow,.section-eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:#658373}.overline{display:flex;align-items:center;gap:9px}.flag{display:flex;height:12px;width:24px;border-radius:2px;overflow:hidden;border:1px solid #d8dbd5}.flag i{flex:1}.flag i:first-child{background:#18825b}.flag i:nth-child(2){background:#fff}.flag i:nth-child(3){background:#c84243}.identity h1{font-family:Georgia,'Playfair Display',serif;font-size:27px;line-height:1.2;letter-spacing:-.7px;margin:6px 0 1px}.subtitle{color:var(--muted);font-size:12px;margin:0}.top-actions{display:flex;align-items:center;gap:18px}.local-pill{border:1px solid #cdded0;background:#e9f1e7a8;padding:9px 12px;font-size:12px;color:#47755e;border-radius:100px;white-space:nowrap}.tiny-dot{display:inline-block;height:6px;width:6px;margin-right:7px;border-radius:100%;background:#5a9e6b;vertical-align:middle}.button{border:1px solid transparent;border-radius:10px;padding:12px 19px;font-weight:800;font-size:13px;white-space:nowrap;transition:transform .2s,background .2s}.button:hover{transform:translateY(-1px)}.button-primary{background:var(--green);color:#fff;box-shadow:0 6px 16px rgba(29,86,55,.15)}.button-primary:hover{background:var(--green-deep)}.add-icon{font-size:19px;line-height:0;margin-right:6px;vertical-align:middle}.button-quiet{color:#496456;background:#eff3eb;border-color:#e3e9de}.button-outline{background:#fff;border-color:#c5d7c8;color:var(--green)}.intro{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:42px 40px;margin-top:24px;border-radius:18px;background:linear-gradient(94deg,rgba(255,255,250,.95) 0%,rgba(248,251,243,.92) 59%,rgba(244,250,235,.55) 100%);box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.85);position:relative;overflow:hidden;min-height:207px}.intro:after{content:"";position:absolute;right:20%;width:250px;height:250px;border-radius:50%;border:1px solid #d0ddcc88;pointer-events:none}.intro h2{font-size:clamp(30px,3.25vw,45px);line-height:1.14;letter-spacing:-1.5px;font-family:Georgia,'Playfair Display',serif;margin:11px 0 12px;font-weight:700}.intro em{color:#538767;font-style:italic}.intro p{font-size:13px;line-height:1.65;color:#63766a;max-width:590px;margin:0}.intro-stamp{height:128px;width:128px;min-width:128px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed #7b9f84;border-radius:50%;transform:rotate(11deg);color:#648e74;opacity:.75;font-size:9px;letter-spacing:2px;font-weight:800;gap:3px;position:relative;z-index:1}.toolbar{display:flex;align-items:end;justify-content:space-between;gap:16px;padding:36px 0 19px}.toolbar h2{margin:7px 0 0;font-family:Georgia,'Playfair Display',serif;font-size:28px;letter-spacing:-.5px}.picker-actions{display:flex;gap:10px;align-items:center}.date-nav{display:flex;align-items:center;background:#fff;border:1px solid #dbe6da;box-shadow:0 2px 8px #18432c09;border-radius:9px;overflow:hidden}.date-nav span{font-weight:800;min-width:157px;text-align:center;font-size:13px}.date-nav button,.year-controls button{color:var(--green);border:0;background:transparent;font-size:25px;padding:5px 13px;line-height:1.4}.date-nav button:hover,.year-controls button:hover{background:#e9f1e8}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.stat{display:flex;align-items:center;gap:18px;border:1px solid #e6ebe3;border-radius:13px;padding:21px 23px;background:var(--paper);box-shadow:var(--shadow);min-height:120px}.stat-icon{width:48px;height:48px;min-width:48px;display:grid;place-items:center;border-radius:12px;font-size:25px;font-weight:800}.stat-icon.green{background:#e5f0e5;color:#378059}.stat-icon.orange{background:#fcf0dc;color:#d88c28}.stat-icon.blue{background:#e2f1ef;color:#33847c}.stat-label{font-size:12px;font-weight:600;color:#78867e;display:block}.stat-value{display:block;font-size:clamp(23px,2.4vw,34px);font-weight:800;letter-spacing:-1.2px;margin:3px 0}.stat-description{display:block;color:#8a998f;font-size:11px}.main-grid{display:grid;grid-template-columns:minmax(0,1.11fr) minmax(0,1fr);gap:17px;margin-top:18px;align-items:start}.panel{background:var(--paper);border:1px solid #e6e9e1;border-radius:14px;box-shadow:var(--shadow);min-width:0}.scheduled-panel,.year-panel{min-height:380px}.panel-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:25px 25px 19px;border-bottom:1px solid var(--line)}.panel-heading h3{font-family:Georgia,'Playfair Display',serif;font-size:21px;letter-spacing:-.45px;margin:5px 0 0}.count-badge{border-radius:100px;background:#eef3ea;padding:8px 11px;font-size:11px;color:#66796d;white-space:nowrap}.due-list{padding:4px 23px 20px}.due-row{display:grid;grid-template-columns:45px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid #eef0ea}.due-row:last-child{border-bottom:0}.due-icon{background:#edf4ed;color:#4b8664;height:43px;width:43px;display:grid;place-items:center;font-size:20px;border-radius:11px}.due-icon[data-category="Nutsvoorzieningen"]{color:#4b93a1;background:#e9f4f5}.due-icon[data-category="Belastingen"]{color:#b58b46;background:#f9f0df}.due-icon[data-category="Verzekeringen"]{color:#7775ac;background:#f0eef9}.due-icon[data-category="Abonnementen"]{color:#ae7a6a;background:#f8eee9}.due-name{font-weight:800;font-size:13px;line-height:1.3}.due-meta{margin-top:4px;color:#8b998f;font-size:11px}.due-amount{font-weight:800;font-size:15px;white-space:nowrap}.due-check{border:1px solid #cddfcf;border-radius:7px;font-size:11px;color:var(--green);padding:8px 9px;background:white;min-width:69px;font-weight:800}.due-check.is-paid{color:#fff;background:#438966;border-color:#438966}.due-row.paid .due-name{text-decoration:line-through;color:#8da097}.status-overdue{color:#b85d40;font-weight:800}.status-today{color:#ac7734;font-weight:800}.empty{padding:40px 22px 44px;text-align:center}.empty-mark{font-size:30px;background:#eef6e9;border-radius:50%;display:grid;place-items:center;width:62px;height:62px;margin:auto auto 14px;color:var(--green)}.empty strong{display:block;font-size:15px}.empty p{font-size:12px;line-height:1.6;color:#75877b;max-width:300px;margin:8px auto 18px}.year-controls{display:flex;gap:3px}.year-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding:20px 22px}.month-tile{padding:13px 12px;text-align:left;min-height:80px;border-radius:10px;border:1px solid #e4e9e2;background:#fafbf8;display:flex;flex-direction:column;gap:6px;transition:.18s}.month-tile:hover{background:#eff5ed;border-color:#acc9b1}.month-tile.selected{background:#e5f0e5;border:2px solid #4c8960;padding:12px 11px}.month-tile .name{font-size:11px;font-weight:800;color:#6c8777}.month-tile strong{font-size:15px;white-space:nowrap;letter-spacing:-.5px}.month-tile small{font-size:10px;color:#9aaa9e}.month-tile .sub-label{color:#b27940}.year-total{margin:0 22px 23px;padding:15px 17px;border-radius:10px;background:#e9f2e8;display:flex;align-items:center;justify-content:space-between;gap:10px}.year-total small{display:block;color:#60846d;font-size:10px;margin-bottom:4px}.year-total strong{display:block;color:#235940;font-size:21px;letter-spacing:-.5px}.year-total>span{font-size:11px;color:#75947e;text-align:right}.manage-panel{margin:20px 0 0}.panel-subtitle{margin:7px 0 0;color:#8b988e;font-size:12px}.heading-wrap{flex-wrap:wrap}.manage-list{padding:0 25px 12px}.manage-row{display:flex;align-items:center;gap:14px;border-bottom:1px solid #edf0eb;padding:15px 0}.manage-row:last-child{border-bottom:0}.manage-icon{width:35px;height:35px;border-radius:10px;display:grid;place-items:center;background:#edf3ec;color:#5c8d6a;font-size:19px;flex-shrink:0}.manage-detail{flex:1;min-width:0}.manage-detail strong{display:block;font-size:13px}.manage-detail small{display:block;font-size:11px;color:#8d9a91;margin-top:4px}.manage-cost{font-weight:800;font-size:13px;white-space:nowrap}.manage-actions{display:flex;gap:4px}.action-btn{border:0;background:transparent;color:#577664;padding:7px 9px;border-radius:8px;font-size:12px;font-weight:800}.action-btn:hover{background:#edf4ee}.action-btn.danger{color:#b66c63}.action-btn.danger:hover{background:#f9eeee}.manage-blank{padding:30px 10px;font-size:12px;color:#829184;text-align:center}footer{padding:24px 0 26px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:11px;color:#6c8171}footer strong{color:#346b4a}.footer-actions{display:flex;gap:18px}.text-button{background:none;border:0;color:#2c6d4d;font-size:12px;font-weight:800;padding:7px 0}.text-button:hover{text-decoration:underline}.safety-note{width:100%;margin:0;color:#697b70;font-size:11px;line-height:1.4}dialog{border:0;border-radius:20px;box-shadow:0 26px 100px #142b2680;width:min(94vw,520px);padding:0;color:var(--ink);max-height:calc(100vh - 30px);overflow-y:auto}dialog::backdrop{background:rgba(16,39,28,.58);backdrop-filter:blur(3px)}.dialog-top{display:flex;align-items:start;justify-content:space-between;padding:26px 28px 21px;background:#f1f6ee;border-bottom:1px solid #e3ebdf}.dialog-top h2{font-family:Georgia,'Playfair Display',serif;font-size:26px;margin:6px 0}.dialog-top p{font-size:12px;margin:0;color:#788a7b}.close-button{border:0;background:transparent;font-size:27px;color:#6d8172;padding:0 3px;line-height:1}.form-content{padding:26px 28px 22px;display:grid;gap:19px}.form-content label{font-size:12px;font-weight:800;display:flex;flex-direction:column;gap:8px;color:#42594b}.form-content label span{color:#b85e56}.form-content input,.form-content select{width:100%;border:1px solid #dce6db;border-radius:9px;padding:12px;background:#fff;font-size:14px;color:var(--ink);outline:0;min-height:47px}.form-content input:focus,.form-content select:focus{border-color:#5d9d6e;box-shadow:0 0 0 3px #7ab28929}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.hint{background:#edf4ec;border-left:3px solid #65a16f;font-size:11px;color:#6e8172;line-height:1.55;padding:11px 13px;border-radius:0 8px 8px 0}.form-error{background:#fdf0ee;color:#ad5345;padding:10px;border-radius:7px;margin:0;font-size:12px}.dialog-actions{padding:18px 28px 24px;display:flex;justify-content:end;gap:11px;border-top:1px solid #edf0e9}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#1c4936;color:#fff;border-radius:10px;padding:12px 19px;font-size:12px;font-weight:700;box-shadow:0 10px 35px #25433250;z-index:20;max-width:90vw;text-align:center}
@media(max-width:1040px){.app-shell{padding:0 22px}.main-grid{grid-template-columns:1fr}.scheduled-panel,.year-panel{min-height:0}.year-overview{grid-template-columns:repeat(4,minmax(0,1fr))}.intro{padding:30px 32px}.local-pill{display:none}}
@media(max-width:640px){.app-shell{padding:0 13px}.topbar{padding:16px 0;align-items:start;gap:9px}.logo{width:43px;height:43px;border-radius:12px}.logo svg{width:24px}.identity{gap:10px}.overline{font-size:8px;letter-spacing:1px}.identity h1{font-size:22px;margin-top:4px}.subtitle{font-size:10px}.top-actions{align-self:center}.top-actions .button{padding:10px 11px;font-size:0}.top-actions .button .add-icon{font-size:23px;margin:0}.intro{margin-top:14px;padding:24px 20px;min-height:174px;border-radius:14px}.intro .eyebrow{font-size:9px;letter-spacing:1.2px}.intro h2{font-size:28px;letter-spacing:-1px;margin:9px 0}.intro p{font-size:12px}.intro-stamp{display:none}.toolbar{padding:26px 0 13px;align-items:start;flex-wrap:wrap}.toolbar h2{font-size:24px}.picker-actions{width:100%;justify-content:space-between}.date-nav{flex:1;justify-content:space-between}.date-nav span{min-width:100px}.stats-grid{gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.stat{min-height:105px;gap:10px;padding:13px 12px}.stat:last-child{grid-column:1/-1;min-height:88px}.stat-icon{width:35px;height:35px;min-width:35px;font-size:19px;border-radius:10px}.stat-label{font-size:10px}.stat-value{font-size:22px;white-space:nowrap;letter-spacing:-.8px}.stat-description{font-size:9px}.main-grid{gap:13px;margin-top:13px}.panel-heading{padding:20px 16px 17px}.panel-heading h3{font-size:19px}.section-eyebrow{font-size:9px;letter-spacing:1.4px}.count-badge{font-size:10px}.due-list{padding:3px 15px 12px}.due-row{grid-template-columns:34px minmax(0,1fr) auto;gap:9px;position:relative;padding:15px 0 18px}.due-icon{width:33px;height:33px;font-size:17px}.due-name{font-size:12px}.due-meta{font-size:10px}.due-amount{font-size:13px}.due-check{grid-column:2/4;justify-self:end;min-width:75px}.year-overview{grid-template-columns:repeat(3,minmax(0,1fr));padding:15px;gap:7px}.month-tile{padding:11px 9px;min-height:76px}.month-tile.selected{padding:10px 8px}.month-tile strong{font-size:13px}.year-total{margin:0 15px 18px}.manage-panel{margin-top:13px}.manage-list{padding:0 16px 10px}.manage-row{gap:8px;flex-wrap:wrap}.manage-icon{width:29px;height:29px}.manage-cost{font-size:12px}.manage-actions{width:100%;justify-content:end}.manage-actions .action-btn{padding:6px 8px}.panel-subtitle{line-height:1.4}.dialog-top{padding:21px 19px 16px}.form-content{padding:20px 19px;gap:16px}.form-grid{grid-template-columns:1fr}.dialog-actions{padding:16px 19px 20px}.dialog-actions .button{padding:12px}.footer-actions{gap:15px}footer{padding:18px 4px 30px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
