:root{--accent:#7a4a2e;--accent-deep:#5e3820;--accent-light:#f5ede2;--grey:#6b5d52;--ink:#2b211b;--danger:#a13327;--danger-bg:#fbe9e7;--success:#2e7d32;--success-bg:#e6f4ea;--pending:#8a5300;--pending-bg:#fff4e5;--free:#3949ab;--free-bg:#e8eaf6;--divider:#e8ddc9;--hairline:#e5e5e5;--field-border:#ccc;--chip-border:#ddd;--ease-standard:cubic-bezier(.4, 0, .2, 1);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{color:var(--ink);background:#faf6f0;margin:0}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{background:var(--accent);color:#fff;z-index:100;transition:top .15s var(--ease-standard);border-radius:8px;padding:10px 16px;position:absolute;top:-48px;left:8px}.skip-link:focus{top:8px}.page{max-width:960px;margin:0 auto;padding:32px 24px}.centered-page{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.card{border:1px solid var(--divider);background:#fff;border-radius:12px;flex-direction:column;gap:14px;max-width:420px;padding:24px;display:flex}.page .card{max-width:480px}h1{color:var(--accent);margin:0 0 4px}.muted{color:var(--grey);font-size:.9em}label{flex-direction:column;gap:6px;font-size:.9em;font-weight:600;display:flex}input,select{font:inherit;border:1px solid var(--field-border);min-height:44px;transition:border-color .15s var(--ease-standard), outline-color .15s var(--ease-standard);border-radius:8px;padding:10px 12px}input:focus-visible,select:focus-visible{border-color:var(--accent);outline:2px solid color-mix(in srgb, var(--accent) 25%, transparent);outline-offset:1px}.button{cursor:pointer;text-align:center;min-height:44px;transition:background-color .15s var(--ease-standard);border:none;border-radius:8px;justify-content:center;align-items:center;padding:10px 16px;font-weight:600;text-decoration:none;display:inline-flex}.button.primary{background:var(--accent);color:#fff}.button.primary:hover{background:var(--accent-deep)}.button.ghost{background:var(--accent-light);color:var(--accent)}.button.ghost:hover{background:color-mix(in srgb, var(--accent-light) 80%, var(--accent) 20%)}.button.danger{background:var(--danger-bg);color:var(--danger)}button.primary,button.ghost,button.danger{border:none}button:disabled{opacity:.6;cursor:not-allowed}button:focus-visible{outline:2px solid var(--accent-deep);outline-offset:2px}.error{color:var(--danger);font-size:.9em}.success{color:var(--success);font-size:.9em}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.topbar-actions{flex-wrap:wrap;gap:10px;display:flex}.filters{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.chip{border:1px solid var(--chip-border);cursor:pointer;min-height:44px;transition:background-color .15s var(--ease-standard), color .15s var(--ease-standard), border-color .15s var(--ease-standard);background:#fff;border-radius:999px;padding:6px 14px;font-size:.85em}.chip-active{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}.table-wrap{border-radius:12px;overflow-x:auto}.table{border-collapse:collapse;background:#fff;border-radius:12px;width:100%;min-width:640px;overflow:hidden}.table th,.table td{text-align:left;border-bottom:1px solid var(--hairline);padding:10px 14px;font-size:.9em}.table th{background:var(--accent);color:#fff}.badge{border-radius:999px;padding:2px 8px;font-size:.8em;font-weight:600}.badge-paid{background:var(--success-bg);color:var(--success)}.badge-pending{background:var(--pending-bg);color:var(--pending)}.badge-free{background:var(--free-bg);color:var(--free)}.actions-row{flex-wrap:wrap;gap:10px;margin-top:8px;display:flex}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:24px;display:grid}.stat-card{border:1px solid var(--hairline);background:#fff;border-radius:12px;flex-direction:column;gap:2px;padding:16px;display:flex}.stat-value{color:var(--accent);font-size:2em;font-weight:700;line-height:1.1}.stat-label{font-weight:600}@media (width<=640px){.table thead{display:none}.table,.table tbody,.table tr,.table td{width:100%;display:block}.table-wrap{overflow-x:visible}.table{min-width:0}.table tr{border-bottom:1px solid var(--hairline);padding:12px 14px}.table td{border-bottom:none;padding:4px 0}.table td[data-label]:before{content:attr(data-label);color:var(--grey);margin-bottom:2px;font-size:.75em;font-weight:600;display:block}}
