html{-webkit-text-size-adjust:100%}
[hidden]{display:none!important}
body{min-height:100vh;line-height:1.35}
a{color:var(--hw-link)}
:focus-visible{outline:3px solid var(--hw-link);outline-offset:3px}
h1:focus{outline:none}

/* ---- top bar ---- */
.logo{color:var(--hw-ink);text-decoration:none;min-height:44px}
.logo .mark img{width:34px;height:34px;display:block}
.signout{display:flex}
.btn-quiet{min-height:44px;min-width:44px;padding:0 14px;border:0;border-radius:var(--r-pill);background:#fff;color:var(--hw-ink);
 font:800 14px/1 var(--font);box-shadow:var(--shadow);cursor:pointer}
.btn-quiet:hover{background:var(--hw-line)}

/* ---- buttons and forms ---- */
.btn-primary,.btn-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:var(--r-pill);
 font:900 16px/1 var(--font);text-decoration:none;cursor:pointer;border:0;color:var(--hw-ink)}
.btn-primary{width:100%;background:var(--hw-green);box-shadow:inset 0 -4px 0 rgba(0,0,0,.12)}
.btn-primary:hover{background:#36AC60}
.btn-secondary{background:#fff;box-shadow:inset 0 0 0 2px var(--hw-line)}
.auth-form{display:flex;flex-direction:column;gap:16px;margin-top:18px}
.field{display:flex;flex-direction:column;gap:6px;font-weight:800;font-size:15px}
.field input{min-height:48px;padding:0 14px;border-radius:14px;border:2px solid #8A8290;background:#fff;
 font:700 17px var(--font);color:var(--hw-ink);width:100%}
.field input:focus{border-color:var(--hw-link);outline:none}
.field-error,.validation-message{color:var(--hw-red-text);font-size:14px;font-weight:700}
.check{display:flex;align-items:center;gap:10px;min-height:44px;font-weight:700;cursor:pointer}
.check input{width:22px;height:22px;accent-color:var(--hw-green-text)}
.status-msg{margin-top:14px;padding:10px 14px;border-radius:14px;font-weight:800;background:#fff}
.status-msg.is-error{color:var(--hw-red-text);box-shadow:inset 0 0 0 2px var(--hw-red)}
.status-msg.is-ok{color:var(--hw-green-text);box-shadow:inset 0 0 0 2px var(--hw-green)}

/* ---- sign-in pages ---- */
.auth-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px}
.auth-card{width:100%;max-width:420px;background:#fff;border-radius:var(--r-tile);padding:28px 28px 30px;box-shadow:var(--shadow-lift)}
.auth-logo{margin-bottom:22px}
.auth-card h1{font-size:28px;font-weight:900;letter-spacing:-.3px}
.auth-card .lede{color:var(--hw-muted);font-weight:600;margin-top:6px}
.auth-card .aside{margin-top:18px;color:var(--hw-muted);font-weight:600}
.auth-card .aside a{display:inline-block;min-height:44px;line-height:44px}
.auth-foot{margin-top:18px;color:var(--hw-muted);font-weight:700;font-size:13px}
.steps{margin:16px 0 0 20px;display:flex;flex-direction:column;gap:10px;font-weight:600}
.steps kbd{font:800 15px ui-monospace,monospace;background:var(--hw-cream);padding:2px 6px;border-radius:6px;word-break:break-all}
.qr{margin-top:10px;width:200px;max-width:100%}
.qr svg{width:100%;height:auto;display:block}
.codes{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:16px 0}
.codes code{font:800 15px ui-monospace,monospace}

/* ---- simple pages ---- */
.plain-page{max-width:560px;margin:40px auto;padding:28px;background:#fff;border-radius:var(--r-card);box-shadow:var(--shadow)}
.plain-page h1{font-size:28px;font-weight:900}
.plain-page p{margin:8px 0 18px;color:var(--hw-muted);font-weight:600}
.muted{color:var(--hw-muted)}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;padding:12px 18px;background:#fff;box-shadow:var(--shadow-lift);font-weight:700;z-index:10}
#blazor-error-ui .dismiss{cursor:pointer;position:absolute;right:14px;top:10px}

@media (max-width:600px){
 .top{padding:12px 18px}
 .auth-card{padding:22px 18px 24px}
 .plain-page{margin:18px}
}