.sph-auth-page .page-header, .sph-auth-page .entry-title { display:none; }
#sph-auth, #sph-auth * { box-sizing: border-box; }
#sph-auth { --sph-teal:#167778; --sph-ink:#172526; --sph-soft:#667475; max-width:560px; margin:48px auto 60px; padding:0 18px; text-align:right; color:var(--sph-ink); font-family:inherit; }
#sph-auth [hidden] { display:none!important; }
#sph-auth .sph-auth__intro { margin-bottom:26px; text-align:center; }
#sph-auth .sph-auth__eyebrow { color:var(--sph-teal); font-size:14px; font-weight:700; }
#sph-auth h1 { margin:12px 0 10px; color:var(--sph-ink); font-family:inherit; font-size:29px; font-weight:800; line-height:1.7; }
#sph-auth .sph-auth__intro p { margin:0; color:var(--sph-soft); font-size:14px; line-height:2; }
#sph-auth .sph-auth__card { position:relative; padding:32px; border:1px solid #dfe9e9; border-radius:26px; background:radial-gradient(circle at 100% 0,rgba(63,207,208,.09),transparent 40%),#fff; box-shadow:0 16px 44px rgba(24,79,80,.07); }
#sph-auth .sph-auth__card::before { content:""; position:absolute; top:0; inset-inline:32px; height:4px; border-radius:0 0 8px 8px; background:linear-gradient(90deg,#ff6c4c,#258f90); }
#sph-auth button, #sph-auth input { font-family:inherit; }
#sph-auth button { cursor:pointer; text-transform:none; letter-spacing:normal; box-shadow:none; margin:0; }
#sph-auth button:disabled { cursor:wait; opacity:.55; }
#sph-auth .sph-auth__tabs { display:flex; padding:5px; margin-bottom:26px; gap:6px; border:1px solid #e3eded; border-radius:15px; background:#f5f9f9; }
#sph-auth [role=tab] { flex:1; min-width:0; min-height:46px; padding:10px 8px; border:0; border-radius:11px; background:transparent; color:#526568; font-size:14px; font-weight:700; line-height:1.7; }
#sph-auth [role=tab][aria-selected=true] { background:#fff; color:#0f6668; box-shadow:0 3px 10px rgba(24,79,80,.08); }
#sph-auth .sph-auth__form { display:flex; flex-direction:column; gap:14px; margin:0; }
#sph-auth label { display:block; margin:0 0 8px; font-size:14px; font-weight:700; line-height:1.8; color:var(--sph-ink); }
#sph-auth input:not([type=checkbox]) { display:block; width:100%; min-width:0; min-height:54px; margin:0; padding:12px 14px; border:1px solid #d7e5e5; border-radius:12px; background:#fbfdfd; color:var(--sph-ink); box-shadow:none; font-size:16px; line-height:1.8; }
#sph-auth input:focus { border-color:var(--sph-teal); box-shadow:0 0 0 3px rgba(22,119,120,.1); }
#sph-auth :is(input,button,a):focus-visible { outline:2px solid var(--sph-teal); outline-offset:3px; }
#sph-auth input::placeholder { color:#7b898a; opacity:1; }
#sph-auth .sph-auth__hint { margin:9px 0 0; color:var(--sph-soft); font-size:12px; line-height:2; }
#sph-auth .sph-auth__password { display:flex; align-items:center; gap:8px; border:1px solid #d7e5e5; border-radius:12px; background:#fbfdfd; padding-inline-end:8px; }
#sph-auth .sph-auth__password input { border:0; background:transparent; box-shadow:none; }
#sph-auth .sph-auth__reveal { flex:0 0 auto; min-height:44px; min-width:52px; padding:5px 8px; border:0; border-radius:8px; background:transparent; color:var(--sph-teal); font-size:12px; font-weight:700; }
#sph-auth .sph-auth__remember { display:flex; align-items:center; gap:8px; margin:0; color:#526568; font-size:13px; font-weight:500; }
#sph-auth input[type=checkbox] { width:18px; height:18px; flex:0 0 18px; margin:0; accent-color:var(--sph-teal); }
#sph-auth .sph-auth__primary { width:100%; min-height:54px; padding:13px 20px; background:linear-gradient(110deg,#167778,#0f6668); color:#fff; border:1px solid transparent; border-radius:13px; font-size:15px; font-weight:800; line-height:1.8; transition:box-shadow .18s ease,background .18s ease; }
#sph-auth .sph-auth__primary:hover { background:#0f6668; box-shadow:0 8px 20px rgba(22,119,120,.16); }
#sph-auth .sph-auth__link { min-height:44px; padding:6px 4px; color:var(--sph-teal); background:transparent; border:0; border-radius:8px; font-size:12px; line-height:1.8; text-decoration:none; }
#sph-auth .sph-auth__link:hover, #sph-auth .sph-auth__reveal:hover { color:#0f6668; background:#edf7f7; }
#sph-auth .sph-auth__actions { display:flex; justify-content:space-between; gap:10px; }
#sph-auth .sph-auth__notice { padding:12px 14px; margin-bottom:20px; background:#eef8f7; color:#165e5f; border:1px solid #cce4e4; border-radius:12px; font-size:13px; line-height:2; overflow-wrap:anywhere; }
#sph-auth .sph-auth__notice.is-error { background:#fff2ef; color:#923f2e; border-color:#ffd3c9; }
#sph-auth h2 { margin:0; color:var(--sph-ink); font-family:inherit; font-size:21px; line-height:1.7; font-weight:800; }
#sph-auth .sph-auth__code { text-align:center; letter-spacing:8px; font-size:24px!important; font-variant-numeric:tabular-nums; }
#sph-auth .sph-auth__security { margin:24px 0 0; padding-top:18px; border-top:1px solid #e6eeee; color:var(--sph-soft); font-size:11px; line-height:2; }
#sph-auth .sph-auth__support { margin:24px 0 0; text-align:center; color:#526568; font-size:13px; line-height:2.3; }
#sph-auth .sph-auth__support a { color:var(--sph-teal); font-weight:800; white-space:nowrap; text-decoration:none; }
@media(max-width:600px) { #sph-auth { margin:30px auto 40px; padding:0 12px; } #sph-auth h1 { font-size:25px; } #sph-auth .sph-auth__intro p { font-size:12px; } #sph-auth .sph-auth__card { padding:26px 20px; border-radius:22px; } #sph-auth [role=tab] { font-size:12px; } }
@media(prefers-reduced-motion:reduce) { #sph-auth * { transition:none!important; } }
