body { background: #f7f8fa; }
.section { padding-top: 1.5rem; }
.card { height: 100%; }
.clickable { cursor: pointer; }
.clickable:hover { box-shadow: 0 2px 12px rgba(0,0,0,.12); }
.trend-up { color: #23d160; font-weight: 600; }
.trend-down { color: #ff3860; font-weight: 600; }
.trend-flat { color: #7a7a7a; }
.sev-error { border-left: 4px solid #ff3860; }
.sev-warning { border-left: 4px solid #ffdd57; }
.sev-notice { border-left: 4px solid #3298dc; }
.sev-good { border-left: 4px solid #23d160; }
.score-ring { font-size: 2.2rem; font-weight: 700; }
.spark { display: block; }
#toast { position: fixed; bottom: 1rem; right: 1rem; z-index: 60; }
#toast .notification { margin-bottom: .5rem; box-shadow: 0 2px 12px rgba(0,0,0,.2); }
.tabs.is-boxed { margin-bottom: 1.25rem; }
td .tag { margin: 0; }

/* --- Login/Setup-Screen --- */
body.auth-mode { background: #30343f; background-image: linear-gradient(141deg, #171d25 0%, #30343f 71%, #383a51 100%); background-attachment: fixed; }
body.auth-mode .section { min-height: 100vh; display: flex; align-items: center; }
.auth-card { max-width: 400px; width: 100%; margin: 0 auto; padding: 2.5rem 2.25rem; border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0,0,0,.45); }
.auth-logo { display: block; width: 160px; max-width: 60%; margin: 0 auto 1.25rem; }
.auth-kicker { text-align: center; letter-spacing: .18em; text-transform: uppercase; font-size: .7rem; color: #9aa0aa; margin-bottom: 1.5rem; }
.auth-title { text-align: center; font-weight: 700; color: #30343f; margin-bottom: .35rem; }
.auth-hint { text-align: center; color: #7a828c; font-size: .85rem; margin-bottom: 1.5rem; }
.auth-card .input { border-radius: 8px; }
.auth-card .button.is-primary { background: #30343f; border-color: #30343f; border-radius: 8px; font-weight: 600; }
.auth-card .button.is-primary:hover { background: #3d4250; border-color: #3d4250; }
.auth-foot { text-align: center; color: #b5b9c0; font-size: .72rem; margin-top: 1.4rem; }
