:root{--color-bg: #f0f2f5;--color-surface: #ffffff;--color-text: #222222;--color-text-muted: #666666;--color-border: #cccccc;--color-border-subtle: #eeeeee;--color-error: #cc0000;--color-primary: #3b5998;--color-primary-text: #ffffff;--color-th-bg: #fafafa;--shadow-card: 0 2px 8px rgba(0, 0, 0, .1);--shadow-panel: 0 1px 4px rgba(0, 0, 0, .08)}@media (prefers-color-scheme: dark){:root{--color-bg: #121212;--color-surface: #1e1e1e;--color-text: #e8e8e8;--color-text-muted: #a8a8a8;--color-border: #555555;--color-border-subtle: #333333;--color-error: #ff8080;--color-primary: #4a69b0;--color-primary-text: #ffffff;--color-th-bg: #262626;--shadow-card: 0 2px 8px rgba(0, 0, 0, .6);--shadow-panel: 0 1px 4px rgba(0, 0, 0, .5)}}body{font-family:Arial,sans-serif;margin:0;background:var(--color-bg);color:var(--color-text)}.login-box{max-width:320px;margin:100px auto;background:var(--color-surface);padding:30px;border-radius:6px;box-shadow:var(--shadow-card)}.login-box h1{margin-top:0}.login-box input{display:block;width:100%;box-sizing:border-box;margin-bottom:12px;padding:10px;border:1px solid var(--color-border);border-radius:4px}.login-box button{width:100%;padding:10px;background:var(--color-primary);color:var(--color-primary-text);border:0;border-radius:4px;cursor:pointer}.error{color:var(--color-error)}.hint{color:var(--color-text-muted);font-size:12px;text-align:center}.dashboard{max-width:900px;margin:20px auto;padding:0 16px}.dashboard header{display:flex;justify-content:space-between;align-items:center}.dashboard header button{margin-left:8px;padding:6px 12px;cursor:pointer}.kpis{display:flex;gap:16px;margin:20px 0}.kpi{flex:1;background:var(--color-surface);padding:20px;border-radius:6px;text-align:center;box-shadow:var(--shadow-panel)}.kpi-value{font-size:26px;font-weight:700}.kpi-label{color:var(--color-text-muted);font-size:13px;margin-top:6px}.txns{width:100%;border-collapse:collapse;background:var(--color-surface);border-radius:6px;overflow:hidden;box-shadow:var(--shadow-panel)}.txns th,.txns td{padding:10px;text-align:left;border-bottom:1px solid var(--color-border-subtle)}.txns th{background:var(--color-th-bg)}
