:root{--bg:#f3f5f2;--bg-elevated:#fff;--ink:#1a2218;--ink-muted:#5c6758;--line:#d7ddd2;--accent:#1f6b4a;--accent-soft:#e5f2eb;--warn:#9a5b12;--warn-soft:#f8eedf;--danger:#9b2c2c;--danger-soft:#f8e8e8;--ok:#1f6b4a;--ok-soft:#e5f2eb;--shadow:0 1px 0 #1a22180a, 0 8px 24px #1a22180f;--radius:14px;--font:"IBM Plex Sans", system-ui, sans-serif;--display:"IBM Plex Serif", Georgia, serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{font-family:var(--font);color:var(--ink);background:radial-gradient(circle at top left, #e8efe4 0%, transparent 40%), radial-gradient(circle at top right, #e4ebe8 0%, transparent 35%), var(--bg);margin:0}button,input{font:inherit}a{color:var(--accent)}.app{max-width:1180px;margin:0 auto;padding:28px 20px 64px}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:28px;display:flex}.brand{gap:4px;display:grid}.brand h1{font-family:var(--display);letter-spacing:-.02em;margin:0;font-size:clamp(1.8rem,3vw,2.4rem)}.brand p{color:var(--ink-muted);margin:0;font-size:.95rem}.top-actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.period{background:var(--bg-elevated);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:8px;padding:6px;display:flex}.sync-report{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px;padding:14px 18px}.sync-report ul{gap:8px;margin:10px 0 0;padding-left:0;list-style:none;display:grid}.sync-report li{color:var(--ink-muted);font-size:.92rem}.period button{cursor:pointer;width:36px;height:36px;color:var(--ink);background:0 0;border:0;border-radius:999px}.period button:hover{background:var(--accent-soft)}.period strong{text-align:center;text-transform:capitalize;min-width:130px}.summary{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:28px;display:grid}.summary-item{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px}.summary-item span{color:var(--ink-muted);margin-bottom:6px;font-size:.85rem;display:block}.summary-item strong{font-size:1.6rem}.summary-item.warn strong{color:var(--warn)}.summary-item.danger strong{color:var(--danger)}.summary-item.ok strong{color:var(--ok)}.sections{gap:28px;display:grid}.section h2{margin:0 0 6px;font-size:1.15rem}.section>p{color:var(--ink-muted);margin:0 0 14px;font-size:.92rem}.table-wrap{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;padding:14px 16px}th{text-transform:uppercase;letter-spacing:.04em;color:var(--ink-muted);background:#f8faf6;font-size:.78rem}tr:last-child td{border-bottom:0}.platform-name{font-weight:600}.meta{color:var(--ink-muted);margin-top:2px;font-size:.85rem}.amount-stack{gap:8px;display:grid}.tip-amount{gap:2px;display:grid}.tip-label{color:var(--ink-muted);text-transform:uppercase;letter-spacing:.03em;align-items:center;gap:6px;font-size:.78rem;display:inline-flex}.tip{border:1px solid var(--line);width:16px;height:16px;color:var(--ink-muted);cursor:help;background:#f4f7f2;border-radius:999px;justify-content:center;align-items:center;font-size:.68rem;font-weight:700;text-decoration:none;display:inline-flex;position:relative}.tip:hover,.tip:focus{border-color:var(--accent);color:var(--accent);outline:none}.tip:hover:after,.tip:focus:after{content:attr(title);color:#fff;letter-spacing:0;text-transform:none;width:max-content;max-width:240px;box-shadow:var(--shadow);z-index:5;pointer-events:none;background:#1a2218;border-radius:8px;padding:8px 10px;font-size:.75rem;font-weight:500;line-height:1.35;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.tip:hover:before,.tip:focus:before{content:"";z-index:5;border:6px solid #0000;border-top-color:#1a2218;position:absolute;bottom:calc(100% + 2px);left:50%;transform:translate(-50%)}.badge{border-radius:999px;align-items:center;padding:4px 10px;font-size:.78rem;font-weight:600;display:inline-flex}.badge.pending{background:var(--warn-soft);color:var(--warn)}.badge.paid{background:var(--ok-soft);color:var(--ok)}.badge.low{background:var(--danger-soft);color:var(--danger)}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.skipped{color:#555;background:#ececec}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.btn{border:1px solid var(--line);color:var(--ink);cursor:pointer;background:#fff;border-radius:999px;padding:8px 14px;font-weight:500}.btn:hover{background:#f4f7f2}.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn.primary:hover{filter:brightness(1.05)}.btn.ghost{background:0 0}.inline-form{align-items:center;gap:6px;display:flex}.inline-form input{border:1px solid var(--line);background:#fff;border-radius:10px;width:96px;padding:8px 10px}.section input[type=number],.section input[type=date]{border:1px solid var(--line);background:#fff;border-radius:10px;max-width:160px;padding:8px 10px}.muted{color:var(--ink-muted);font-size:.85rem}.state-box{text-align:center;color:var(--ink-muted);padding:48px 20px}.error{color:var(--danger)}.login-page{place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);width:min(100%,400px);box-shadow:var(--shadow);gap:14px;padding:28px 24px;display:grid}.login-brand h1{font-family:var(--display);letter-spacing:-.02em;margin:0 0 6px;font-size:1.7rem}.login-brand p{color:var(--ink-muted);margin:0 0 8px;font-size:.95rem}.login-card label{color:var(--ink-muted);gap:6px;font-size:.9rem;display:grid}.login-card input{border:1px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:10px;padding:10px 12px}.login-card .btn{width:100%;margin-top:4px}.login-error{color:var(--danger);background:var(--danger-soft);border-radius:10px;padding:10px 12px;font-size:.9rem}@media (width<=900px){.summary{grid-template-columns:repeat(2,minmax(0,1fr))}table,thead,tbody,th,td,tr{display:block}thead{display:none}tr{border-bottom:1px solid var(--line);padding:14px 16px}td{border:0;padding:4px 0}}