/* Přihlášení: stejný styl jako zbytek Domu (tmavé pozadí se září, sklo, velké písmo, tvOS fokus). Rozměry se řídí kratší stranou okna, takže totéž sedí na TV, iPadu na šířku i na výšku a na telefonu. */
.login { --u: clamp(13px, 1.9vmin, 26px); width: min(92vw, 28em); font-size: var(--u); padding: 2.6em 2.4em 2.2em; border-radius: 2em; position: relative; z-index: 2; text-align: center; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 3em 6em rgba(0,0,0,.55); }
.login .appicon { width: 8em; height: 8em; border-radius: 22.5%; display: block; margin: -5.4em auto 1.1em; box-shadow: 0 1.4em 2.6em rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.14), 0 0 5em rgba(56,189,248,.28); }
.login .brand { display: block; margin: 0; font-size: 3.4em; font-weight: 800; letter-spacing: -.02em; line-height: 1.05; }
.login .sub { margin: .35em 0 1.6em; font-size: 1.05em; font-weight: 600; color: var(--t-dim); }
.login form { text-align: left; }
.login .user { display: flex; align-items: center; justify-content: space-between; gap: .8em; margin: 0 0 1.1em; padding: 0 .2em; font-size: .85em; color: var(--t-faint); }
.login .user label { font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: .85em; }
.login .user input { width: 7em; height: 2em; text-align: right; background: transparent; border: 0; box-shadow: none; color: var(--t-dim); font: inherit; border-radius: .5em; padding: 0 .4em; }
.login .user input:focus { background: rgba(255,255,255,.08); outline: 0; color: #fff; }
.login .field { display: block; margin: 0 0 .45em .3em; font-size: .85em; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--t-dim); }
.login input[type=password], .login input[type=text]#totp { display: block; width: 100%; height: 3.2em; margin: 0 0 1.2em; border-radius: 1em; border: 0; padding: 0 1.1em; font: inherit; font-size: 1.25em; color: #fff; background: rgba(255,255,255,.09); box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.login #totp { letter-spacing: .35em; font-variant-numeric: tabular-nums; }
.login input:focus-visible, .login input[type=password]:focus, .login #totp:focus { outline: 0; background: rgba(255,255,255,.15); transform: scale(1.03); box-shadow: inset 0 0 0 2px rgba(255,255,255,.9), 0 1em 2em rgba(0,0,0,.5); }
.login .btn { width: 100%; height: 3.4em; margin-top: .4em; font-size: 1.15em; border-radius: 1em; transition: transform .18s ease, box-shadow .18s ease; }
.login .btn:focus-visible, .login .btn:hover { outline: 0; transform: scale(1.04); box-shadow: 0 1em 2em rgba(0,0,0,.5), 0 0 0 .18em rgba(255,255,255,.55); }
.login .msg { color: var(--rose); min-height: 1.6em; margin: 1em 0 0; font-size: .95em; text-align: center; }
@media (max-height: 560px) { .login { padding-top: 2em; } .login .appicon { width: 5em; height: 5em; margin-top: -3.4em; } }
.login-page .glow { background: #0e7490; opacity: .2; }
.login-page .glow.b { background: #4338ca; opacity: .16; }