/* login + onboarding: én kolonne, samme uni.term-komponenter som resten af siden */
* { box-sizing: border-box; }
body.auth { margin: 0; min-height: 100vh; background: var(--bg); color: var(--ink); font: 400 15px/22px var(--font-sans); }
.auth-main { min-height: 100vh; display: grid; place-items: center; padding: var(--space-4) 16px; }
.auth-card { width: 100%; max-width: 380px; }
.auth-body { display: flex; flex-direction: column; gap: var(--space-3); }
.auth-brand { margin: 0; font: 600 22px/28px var(--font-mono); }
.auth-msg { margin: 0; min-height: 18px; font: 400 12px/18px var(--font-mono); color: var(--ink-muted); }
.auth-msg.is-bad { color: var(--danger); }
.auth-submit { justify-content: center; }
.auth-small { margin: 0; font-size: 13px; line-height: 18px; color: var(--ink-muted); }
.auth a:not(.ut-btn) { color: var(--ink); text-underline-offset: 3px; }
.auth a.ut-btn { text-decoration: none; }
.auth-body > .ut-btn:not(.auth-submit), .auth-body > a.ut-btn { align-self: flex-start; }
.auth a:focus-visible, .auth button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (hover: none) { .auth .ut-cmd, .auth .ut-btn { min-height: 44px; } }

/* ---------- onboarding + konto ---------- */
.onb { max-width: 680px; margin: 0 auto; padding: var(--space-8) 16px; display: flex; flex-direction: column; gap: var(--space-4); }
.onb-head { display: flex; flex-direction: column; gap: var(--space-2); }
.onb-lead { margin: 0; font-size: 17px; line-height: 26px; }
.onb-list { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: var(--space-2); }
.onb-list--plain { list-style: square; }
.onb-list b, .onb-steps b { font-weight: 500; }
.onb-field { display: flex; flex-direction: column; gap: var(--space-1); }
.onb-field .muted, .auth .muted { color: var(--ink-muted); text-transform: none; letter-spacing: 0; }
.onb-check { display: flex; gap: var(--space-2); align-items: flex-start; font-size: 14px; line-height: 20px; }
.onb-check input { margin-top: 3px; accent-color: var(--accent); }
.onb-tabs { display: flex; gap: var(--space-2); }
.onb-steps { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: var(--space-3); }
.onb-steps .ut-btn { text-decoration: none; }
.onb-help { margin-top: var(--space-2); font-size: 14px; line-height: 20px; }
.onb-help summary { cursor: pointer; color: var(--ink-muted); font: 400 12px/18px var(--font-mono); }
.onb-help p { margin: var(--space-2) 0; }
.onb-sub { margin: 0 0 var(--space-2); padding-left: 20px; display: flex; flex-direction: column; gap: var(--space-1); }
.onb-help code { font: 400 13px/20px var(--font-mono); }
.onb-copy { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.onb-copy code { flex: 1; min-width: 0; overflow-wrap: anywhere; font: 400 13px/20px var(--font-mono); user-select: all; }
.onb-code { display: flex; flex-direction: column; gap: var(--space-2); align-items: flex-start; border-top: 1px solid var(--line); padding-top: var(--space-3); }
.onb-code .onb-copy { align-self: stretch; }
.onb-status { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-2); font: 400 13px/20px var(--font-mono); color: var(--ink-muted); }
.onb-status li::before { content: "[ ] "; }
.onb-status li.is-done { color: var(--ink); }
.onb-status li.is-done::before { content: "[✓] "; color: var(--accent); }
.onb-dl { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: var(--space-2) var(--space-4); font-size: 14px; }
.onb-dl dt { color: var(--ink-muted); font: 400 12px/20px var(--font-mono); }
.onb-dl dd { margin: 0; }
.onb-danger { border-color: var(--danger); }
.onb-danger__btn:not(:disabled) { border-color: var(--danger); color: var(--danger); }
[hidden] { display: none !important; }

.inv-new { display: flex; gap: var(--space-2); }
.inv-new .ut-cmd { flex: 1; min-width: 0; }
.inv-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.inv-list li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); padding: var(--space-2) 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.inv-list .code { font: 400 13px/20px var(--font-mono); }
.inv-note { flex: 1; min-width: 80px; }
.inv-state { font: 400 12px/18px var(--font-mono); color: var(--ink-muted); }
.inv-state.is-free { color: var(--accent); }
@media (max-width: 480px) { .inv-new { flex-direction: column; } }
.inv-del.is-armed { color: var(--danger); border-color: var(--danger); }