.auth-page{display:grid;place-items:center;min-height:100vh;padding:44px 24px 28px}.auth-page::before{content:"MRHO // SECURE DNS SYSTEM";position:fixed;top:18px;left:20px;color:#666;font-size:10px;letter-spacing:.16em}.auth-page main{margin:0}.auth-card{position:relative;width:min(450px,100%);padding:31px;background:rgba(10,10,10,.98);border:1px solid #555;border-radius:2px;box-shadow:9px 9px 0 #000}.auth-card::after{content:"";position:absolute;width:8px;height:8px;right:12px;top:12px;background:var(--green)}.auth-card.wide{width:min(780px,100%)}.auth-card .logo{padding:0 0 25px}.auth-card h1{margin:0 0 9px}.auth-card>p{margin-bottom:23px}.auth-card .button{width:100%;margin-top:12px}.auth-card h2{margin-top:18px}.setup-card{width:min(940px,100%)}.setup-section{display:grid;grid-template-columns:48px 1fr;gap:18px;padding:25px 0;border-top:1px dashed #3a3a3a}.setup-section:first-of-type{border-top:0}.step{display:grid;place-items:center;width:40px;height:40px;color:#050505;background:var(--text);border:1px solid var(--text);border-radius:1px;font-weight:900;box-shadow:4px 4px 0 #303030}.step-content{min-width:0}.step-content h2,.step-content h3{margin:0 0 8px}.step-content>p{margin:0 0 18px}.optional{display:inline-block;padding:3px 7px;color:#aaa;border:1px solid #484848;border-radius:1px;font-size:10px;font-weight:600;text-transform:uppercase;vertical-align:middle}.security-note{margin-top:12px;padding:13px 14px;color:#aaa;background:#0e0e0e;border:1px solid #3d3d3d;border-left:4px solid var(--green);border-radius:0;font-size:11px;line-height:1.5}.step-content small{display:block;margin-top:10px;color:#888}@media(max-width:650px){.auth-page{display:block;min-height:100dvh;padding:38px 10px 20px}.auth-page::before{top:10px;left:12px;font-size:8px}.auth-card{width:100%;padding:20px 15px;box-shadow:5px 5px 0 #000}.auth-card .logo{padding-bottom:20px}.auth-card .logo div{display:block;font-size:inherit}.auth-card h1{font-size:21px}.auth-card>p{font-size:12px}.setup-section{grid-template-columns:1fr;gap:13px;padding:22px 0}.step{width:34px;height:34px}.grid.two{grid-template-columns:1fr}.auth-card input,.auth-card select,.auth-card textarea{font-size:16px;min-height:46px}.auth-card .button{min-height:48px}.security-note{font-size:11px;overflow-wrap:anywhere}}@media(max-width:380px){.auth-card{padding-inline:12px}.setup-section{padding-block:18px}}@media(prefers-color-scheme:light){.auth-page::before{color:#777771}.auth-card{background:rgba(255,255,255,.98);border-color:#888882;box-shadow:9px 9px 0 #c9c9c3}.setup-section{border-top-color:#c9c9c3}.step{color:#fff;background:#111;border-color:#111;box-shadow:4px 4px 0 #c8c8c2}.optional{color:#555550;border-color:#aaa9a3}.security-note{color:#41413c;background:#f2f2ee;border-color:#bcbcb6;border-left-color:var(--green)}.step-content small{color:#62625d}}@media(prefers-color-scheme:light) and (max-width:650px){.auth-card{box-shadow:5px 5px 0 #c9c9c3}}
/* Shared black / cyan visual language for login and setup. */
/* Login inputs must never inherit the small label font, including landscape/tablets. */
.auth-page.login-page .auth-card input {
  font-size:17px;
  line-height:1.4;
  min-height:48px;
}
.auth-page.login-page { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.auth-page { color-scheme: dark; background: #000; color: #e6edf5; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.5; }
.auth-page::before { content: "MRHO / DNS"; color: #9aa8b8; letter-spacing: .18em; }
.auth-page .auth-card { background: #151c25; border: 1px solid #293340; border-radius: 12px; box-shadow: none; padding: 32px; }
.auth-page .auth-card::after { background: #00baf2; border-radius: 50%; }
.auth-page .logo-mark { background: #092c3b; color: #00baf2; border: 1px solid #293340; border-radius: 10px; box-shadow: none; }
.auth-page .logo strong { letter-spacing: .06em; font-size: 13px; }
.auth-page .logo small, .auth-page p, .auth-page .step-content small { color: #9aa8b8; }
.auth-page h1 { text-transform: none; font-size: 27px; letter-spacing: -.035em; font-weight: 650; }
.auth-page h2 { font-size: 17px; letter-spacing: -.015em; }
.auth-page label { color: #e6edf5; }
.auth-page input, .auth-page select, .auth-page textarea { background: #0b1016; color: #e6edf5; border: 1px solid #293340; border-radius: 8px; padding: 12px; }
.auth-page input:focus, .auth-page select:focus, .auth-page textarea:focus { border-color: #00baf2; outline: 2px solid #00baf2; outline-offset: 2px; }
.auth-page .button { background: #00baf2; color: #001b26; border: 1px solid #00baf2; border-radius: 8px; text-transform: none; font-size: 14px; min-height: 44px; }
.auth-page .button:hover { background: #39cfff; border-color: #39cfff; }
.auth-page .setup-section { border-top: 1px solid #293340; }
.auth-page .step { color: #00baf2; background: #092c3b; border: 1px solid #293340; border-radius: 9px; box-shadow: none; }
.auth-page .optional { color: #9aa8b8; border-color: #293340; border-radius: 5px; }
.auth-page .security-note { color: #9aa8b8; background: #0b1016; border: 1px solid #293340; border-left: 3px solid #00baf2; border-radius: 8px; }
@media (max-width:650px) {
  .auth-page { padding: 42px 12px 24px; }
  .auth-page .auth-card { padding: 22px 18px; }
  .auth-page h1 { font-size: 23px; }
  .auth-page .setup-section { padding: 20px 0; }
}