/* A page that is one centered card on the grey window, no sidebar: /setup (runs before there is a "you" to show a sidebar for) and /login (nothing behind it is reachable yet). The page sets . */ body.card-page { align-items: center; justify-content: center; } .setup-card { width: 380px; max-width: calc(100vw - 32px); background: var(--sb-surface); border: 1.5px solid var(--sb-border); border-radius: var(--sb-radius-window); box-shadow: var(--sb-shadow-window); padding: 32px 30px 28px; } .setup-logo { width: 44px; height: 44px; border-radius: 12px; margin-bottom: 18px; } .setup-title { font-size: 19px; font-weight: 700; letter-spacing: -.01em; margin-bottom: 6px; } .setup-sub { font-size: 13px; color: var(--sb-text-muted); margin-bottom: 24px; line-height: 1.5; } .field { margin-bottom: 18px; } .field-label { display: block; font-size: 12px; font-weight: 600; color: var(--sb-text-tertiary); margin-bottom: 6px; } .field-input { width: 100%; padding: 9px 12px; border: 1px solid var(--sb-border); border-radius: var(--sb-radius-sm); background: var(--sb-surface); color: var(--sb-text); font-size: 14px; font-family: var(--sb-font); outline: none; transition: border-color .15s, box-shadow .15s; } .field-input:focus { border-color: var(--sb-accent); box-shadow: 0 0 0 3px var(--sb-accent-bg); } .field-input::placeholder { color: var(--sb-text-muted); } .field-hint { font-size: 11.5px; color: var(--sb-text-muted); margin-top: 5px; } .setup-save { width: 100%; padding: 10px; border: none; border-radius: var(--sb-radius-sm); background: var(--sb-accent); color: #fff; font-family: var(--sb-font); font-size: 14px; font-weight: 600; cursor: pointer; transition: background .15s, opacity .15s; margin-top: 4px; } .setup-save:hover { background: var(--sb-accent-light); } .setup-save:disabled { opacity: .6; cursor: default; } .setup-msg { font-size: 12.5px; margin-top: 12px; display: none; } .setup-msg.err { display: block; color: var(--sb-red); } .setup-msg.ok { display: block; color: var(--sb-green); }