:root{color-scheme:light;--bg: #f0f2f5;--surface: #ffffff;--surface-alt: #fafafa;--text: #222222;--kpi-bg: #ffffff;--kpi-label: #666666;--border: #eeeeee;--input-border: #cccccc;--input-bg: #ffffff;--error: #cc0000;--primary: #3b5998;--primary-text: #ffffff;--shadow: rgba(0, 0, 0, .1);--shadow-soft: rgba(0, 0, 0, .08)}[data-theme=dark]{color-scheme:dark;--bg: #121417;--surface: #1c2026;--surface-alt: #242a32;--text: #e6e8eb;--kpi-bg: #1c2026;--kpi-label: #a8b0ba;--border: #2f3640;--input-border: #4a5360;--input-bg: #14181d;--error: #ff8a8a;--primary: #3b5998;--primary-text: #ffffff;--shadow: rgba(0, 0, 0, .5);--shadow-soft: rgba(0, 0, 0, .4)}body{font-family:Arial,sans-serif;margin:0;background:var(--bg);color:var(--text)}.login-box{max-width:320px;margin:100px auto;background:var(--surface);padding:30px;border-radius:6px;box-shadow:0 2px 8px var(--shadow)}.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(--input-border);border-radius:4px;background:var(--input-bg);color:var(--text)}.login-box button{width:100%;padding:10px;background:var(--primary);color:var(--primary-text);border:0;border-radius:4px;cursor:pointer}.error{color:var(--error)}.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}.dashboard .error{margin:12px 0}.kpis{display:flex;gap:16px;margin:20px 0}.kpi{flex:1;background:var(--kpi-bg);padding:20px;border-radius:6px;text-align:center;box-shadow:0 1px 4px var(--shadow-soft)}.kpi-value{font-size:26px;font-weight:700}.kpi-label{color:var(--kpi-label);font-size:13px;margin-top:6px}.txns{width:100%;border-collapse:collapse;background:var(--surface);border-radius:6px;overflow:hidden;box-shadow:0 1px 4px var(--shadow-soft)}.txns th,.txns td{padding:10px;text-align:left;border-bottom:1px solid var(--border)}.txns th{background:var(--surface-alt)}.theme-toggle{position:fixed;bottom:16px;right:16px;padding:8px 12px;background:var(--surface);color:var(--text);border:1px solid var(--input-border);border-radius:4px;cursor:pointer}