/* Общая страница входа (legacy/prod/Login.html) — «Вход на борт» в дизайне
   attention.self, как вход в админку (web/admin-login.html). Страницу не
   правим: надпись-логотип, заголовок и слоган — через CSS. Подключается в
   конце <body> (app/api/web.py); тумблер темы — в углу (web/brand/theme.js). */
@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@300;400;600;700&family=Space+Mono:wght@400;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* Переменные страницы — на токены; её --bg перебивает токен, фон — по теме. */
:root:root{--cd:var(--surface);--bd:var(--border-strong);--tx:var(--text);--mu:var(--text-muted);--dm:var(--text-dim)}
:root:root[data-theme="cosmos-dark"]{--bg:#06080f}
:root:root[data-theme="cosmos-light"]{--bg:#f6f4ee}

:root body{font-family:"Exo 2",system-ui,sans-serif;gap:22px;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(1.5px 1.5px at 12% 22%,var(--text-dim),transparent 60%),
  radial-gradient(1px 1px at 34% 64%,var(--text-dim),transparent 60%),radial-gradient(1.5px 1.5px at 58% 14%,var(--text-dim),transparent 60%),
  radial-gradient(1px 1px at 78% 78%,var(--text-dim),transparent 60%),radial-gradient(1px 1px at 90% 36%,var(--text-dim),transparent 60%);
  background-size:220px 220px}
:root[data-theme="cosmos-light"] body{background-image:none}
#wrap{width:100%;max-width:360px}
/* «MentorShip» → надпись attention.self и слоган */
#wrap .logo{font-size:0;height:84px;margin:0 0 18px!important;
  background:url(/web/brand/wordmark-dark.svg) center top/auto 58px no-repeat}
:root[data-theme="cosmos-light"] #wrap .logo{background-image:url(/web/brand/wordmark-light.svg)}
#wrap .logo span{display:none}
#wrap .logo::after{content:"Attention is all you need — чтобы получить оффер";display:block;padding-top:66px;
  font-size:13px;font-weight:400;letter-spacing:0;color:var(--text-muted)}
#wrap .box{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:28px 26px;box-shadow:var(--shadow-pop)}
#wrap .box p{font-size:0;margin-bottom:16px}
#wrap .box p::after{content:"Вход на борт";font-family:"Space Mono","JetBrains Mono",monospace;font-size:15px;color:var(--accent-text)}
#wrap label{font-size:11px;font-weight:600;letter-spacing:1px;color:var(--info);margin-bottom:6px}
#wrap input{height:40px;padding:0 12px;background:var(--field);border:1px solid var(--border-strong);border-radius:9px;
  color:var(--text);font-family:"Exo 2",system-ui,sans-serif;font-size:14px}
#wrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
#wrap button{height:42px;background:var(--accent);color:var(--on-accent);border-radius:9px;
  font-family:"Space Mono","JetBrains Mono",monospace;font-weight:700;transition:transform .12s}
#wrap button:hover{background:var(--accent);transform:translateY(-1px)}
#wrap .err{color:var(--danger)}
#wrap .hint{font-size:12px;color:var(--text-dim)}
.boot{color:var(--text-muted)}
.sp{border-color:var(--border);border-top-color:var(--accent)}