:root{
            --ink:#1a0810; --plum:#2a0e1c; --card:#3a1526;
            --gold:#c9a84c; --cream:#f5ece0; --muted:#b89a8a;
            --green:#6fbf8f; --rose:#e0738a;
            --head1:#4a1c33; --head2:#32121f;
            --serif:'Playfair Display', Georgia, serif;
            --sans:system-ui, -apple-system, 'Segoe UI', sans-serif;
        }
        *{box-sizing:border-box}
        body{
            margin:0; min-height:100vh; font-family:var(--sans); color:var(--cream);
            background:radial-gradient(1200px 600px at 70% -10%, #46182f 0%, var(--plum) 45%, var(--ink) 100%);
        }
        a{color:var(--gold)}
        .wrap{width:min(1280px,98vw); margin:0 auto; padding:20px 0 60px}
        .card{background:var(--card); border:1px solid rgba(201,168,76,.28); border-radius:14px; box-shadow:0 6px 24px rgba(0,0,0,.35)}
        .serif{font-family:var(--serif)}
        .muted{color:var(--muted)} .gold{color:var(--gold)} .green{color:var(--green)}
        .rose{color:var(--rose)} .cream{color:var(--cream)}

        .kicker{font-size:12px; letter-spacing:4px; color:var(--gold); text-transform:uppercase}
        .title{font-family:var(--serif); font-size:24px; color:var(--cream)}

        input,select,textarea{
            width:100%; padding:10px 12px; background:rgba(0,0,0,.25);
            border:1px solid rgba(245,236,224,.18); border-radius:8px;
            color:var(--cream); font-size:14px; font-family:var(--sans); outline:none;
        }
        input[type=month]{width:auto; padding:8px 10px}
        label.fld{display:block}
        label.fld>span{display:block; font-size:11px; color:var(--muted); margin-bottom:5px}

        .btn-gold{padding:11px 18px; background:var(--gold); color:var(--ink); border:none;
            border-radius:8px; font-weight:700; font-size:14px; cursor:pointer; font-family:var(--sans)}
        .btn-ghost{padding:8px 14px; background:transparent; color:var(--gold);
            border:1px solid var(--gold); border-radius:8px; font-weight:600; font-size:13px;
            cursor:pointer; font-family:var(--sans); text-decoration:none; display:inline-block}
        .btn-ghost.active{background:var(--gold); color:var(--ink)}
        .btn-ghost.green{border-color:var(--green); color:var(--green)}

        .row{display:flex; align-items:center; gap:14px; flex-wrap:wrap}
        .between{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px}

        .stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px}
        .stat{padding:14px 16px}
        .stat .lbl{font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:1px}
        .stat .val{font-size:22px; font-weight:700}

        .form-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px}
        .full{grid-column:1 / -1}

        table.list{width:100%; border-collapse:collapse; font-size:13px}
        table.list th{text-align:left; padding:10px 12px; color:var(--gold); font-weight:600; font-size:12px; white-space:nowrap; background:rgba(201,168,76,.10)}
        table.list td{padding:10px 12px; color:var(--cream); vertical-align:top; white-space:nowrap; border-top:1px solid rgba(245,236,224,.08)}

        .flash{padding:12px; border-radius:10px; margin-bottom:14px; font-size:13px; border:1px solid}
        .flash.ok{border-color:var(--green); color:var(--green)}
        .flash.err{border-color:var(--rose); color:var(--rose)}

        .x{color:var(--rose); cursor:pointer}
        .tabs{display:flex; gap:8px; margin-bottom:16px; flex-wrap:wrap}

        /* grid */
        .grid-wrap{padding:0; overflow:auto; max-height:72vh}
        table.grid{border-collapse:collapse; font-size:12px}
        table.grid th{text-align:center; padding:6px 8px; color:var(--gold); font-weight:600; font-size:12px;
            border-right:1px solid rgba(245,236,224,.08); border-bottom:1px solid rgba(201,168,76,.3); white-space:nowrap}
        table.grid th.sub{font-size:10px; color:var(--muted); font-weight:500; background:var(--head2)}
        table.grid td{padding:2px; border-right:1px solid rgba(245,236,224,.06);
            border-bottom:1px solid rgba(245,236,224,.06); text-align:center}
        .sticky-l{position:sticky; left:0; z-index:2; background:var(--head2)}
        th.sticky-l{z-index:3}
        .head1{background:var(--head1)} .head2{background:var(--head2)}
        .cell-mode{width:62px; padding:4px; background:rgba(0,0,0,.25); border:1px solid rgba(245,236,224,.12);
            border-radius:4px; color:var(--cream); font-size:11px; text-transform:uppercase}
        .cell-num{width:54px; padding:4px; background:rgba(0,0,0,.25); border:1px solid rgba(245,236,224,.12);
            border-radius:4px; color:var(--cream); font-size:11px; text-align:right}
        .tot-row td{background:rgba(201,168,76,.10)}
        .saving{position:fixed; right:16px; bottom:16px; background:var(--card); border:1px solid var(--gold);
            color:var(--gold); padding:8px 14px; border-radius:8px; font-size:12px; opacity:0; transition:opacity .2s; z-index:50}
        .saving.show{opacity:1}
        .saving.err{border-color:var(--rose); color:var(--rose)}