/* MailBos — minimal auth stylesheet (login screen only).
 * Served to signed-out visitors instead of style.css so the workspace's class names
 * and layout are never exposed. Contains only login-page styles. */
:root{ --bg:#f7f3ea; --card:rgba(255,255,255,.82); --ink:#151515; --muted:#6f6b64; --line:rgba(150,130,100,.25); --accent:#111827; --soft:#f1eadf; --glow1:#f9d8e8; --glow2:#d7e5ff; --glow3:#ddf7e8; }
body.dark{ --bg:#0d0f14; --card:rgba(24,27,35,.82); --ink:#f4f4f5; --muted:#a4a7b0; --line:rgba(255,255,255,.12); --accent:#f4efe6; --soft:#20242d; --glow1:#47324a; --glow2:#263653; --glow3:#213f33; }
*{box-sizing:border-box}
body{ margin:0;
  background:
    radial-gradient(circle at 15% 10%,var(--glow1),transparent 28%),
    radial-gradient(circle at 85% 15%,var(--glow2),transparent 30%),
    radial-gradient(circle at 65% 90%,var(--glow3),transparent 35%),
    var(--bg);
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.hidden{display:none!important}
h1{margin:0;font-size:36px;letter-spacing:-.055em}
h2{margin:0 0 12px;font-size:22px;letter-spacing:-.035em}
h3{letter-spacing:-.025em}
.hint{color:var(--muted)}
body.dark .hint{color:#c8ccd6}
input,textarea,select{ width:100%;border:1px solid var(--line);border-radius:18px;padding:14px 15px;font-size:14px;background:rgba(255,255,255,.55);color:var(--ink);margin:6px 0;outline:none; }
body.dark input,body.dark textarea,body.dark select{background:rgba(255,255,255,.05)}
button{ border:0;border-radius:18px;padding:13px 17px;background:#111827;color:white;font-weight:900;cursor:pointer;margin:6px 6px 6px 0;transition:.18s ease; }
button:hover{transform:translateY(-1px)}
body.dark button{background:#f4efe6;color:#111827}
button.secondary{background:#e7ded0;color:#171717}
button.ghost{background:transparent;color:var(--muted);border:1px solid var(--line)}

/* auth layout */
.authPage{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:max(40px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(40px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));position:relative;overflow:hidden}
.authGradient{position:absolute;inset:-20%;background:conic-gradient(from 180deg,#fde7ef,#e4edff,#e3f8ec,#fff1da,#fde7ef);filter:blur(80px);opacity:.5}
.authShell{position:relative;display:grid;grid-template-columns:1fr 430px;gap:50px;align-items:center;max-width:1050px;width:100%}
.authBrand h1{font-size:76px;letter-spacing:-.07em;margin:0}
.authBrand p{font-size:22px;color:var(--muted)}
.logoOrb,.miniOrb,.orb{display:inline-block;border-radius:999px;background:linear-gradient(135deg,#111827,#a78bfa,#60a5fa,#6ee7b7);box-shadow:0 18px 55px rgba(99,102,241,.35)}
.logoOrb{width:74px;height:74px;margin-bottom:20px}
.miniOrb{width:18px;height:18px;margin-right:8px;vertical-align:-3px}
.authCard,.card{ background:var(--card);backdrop-filter:blur(22px);border:1px solid var(--line);border-radius:28px;box-shadow:0 24px 70px rgba(20,14,8,.10); }
.authCard{padding:24px}
.authTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:var(--soft);padding:6px;border-radius:18px;margin-bottom:22px}
.authTabs.oneTab{grid-template-columns:1fr}
.authTabs.oneTab button{width:100%}
.authTabs button{background:transparent;color:var(--muted);margin:0}
.authTabs button.active{background:var(--card);color:var(--ink);box-shadow:0 8px 30px rgba(0,0,0,.08)}
.authForm h2{margin-top:0;font-size:28px;letter-spacing:-.04em}
.authMsg{color:#b91c1c;font-weight:700}
.authDarkToggle{margin-top:16px}
.authWebsiteHint{max-width:380px;margin-top:8px}
.authExternalBox{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:var(--soft)}
.authExternalBox span{font-weight:800;color:var(--muted)}
.authExternalBox button{width:auto;white-space:nowrap}
.login2faRecovery{margin-top:14px;border:1px solid var(--line);border-radius:20px;padding:14px;background:rgba(255,255,255,.35)}
body.dark .login2faRecovery{background:rgba(255,255,255,.055)}
.detailModal{position:fixed;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(14px);z-index:1000;display:flex;align-items:center;justify-content:center}
body.dark .detailModal{background:rgba(2,4,8,.62)}

/* dark auth variants */
body.dark .card,body.dark .authCard{background:rgba(22,26,36,.90);border-color:rgba(255,255,255,.16);box-shadow:0 24px 70px rgba(0,0,0,.24)}
body.dark .authPage{background:rgba(9,11,17,.35)}
body.dark .authGradient{opacity:.28}
body.dark .authBrand h1,body.dark .authBrand p{color:#f4f4f5!important}
body.dark .authTabs{background:rgba(255,255,255,.08)}
body.dark .authTabs button.active{background:#f4efe6;color:#111827}
body.dark .authTabs button:not(.active){color:#d7d7dc}

/* responsive */
@media(max-width:980px){.authShell{grid-template-columns:1fr}.authBrand h1{font-size:52px}}
@media(max-width:720px){.authExternalBox{align-items:flex-start;flex-direction:column}.authExternalBox button{width:100%}}