/* Оформление СТРАНИЦЫ ВХОДА — единственный стиль, который сайт отдаёт
   постороннему (674patch).

   ⚠️⚠️ ЗАЧЕМ ОТДЕЛЬНЫЙ ФАЙЛ. Раньше странице входа отдавали общий app.css —
   а это 79 КБ: все названия разделов, устройство интерфейса и подробные
   комментарии о том, что и почему в сервисе сделано. Посторонний скачивал его
   одной ссылкой, не входя. Теперь app.css закрыт входом (nginx: auth_request),
   а невошедшему достаётся только этот файл — форма входа и ничего больше.

   ⚠️ Правила здесь — КОПИЯ соответствующих правил app.css, а не ссылка на них.
   Меняете вид формы входа — правьте ОБА файла: у вошедшего страницу рисует
   app.css (в кабинете те же .auth-form/.cabinet-form), у невошедшего — этот. */
:root{
    /* шрифт сайта — тот же, что core/site-font.css (1942patch): app.css и он закрыты входом */
    --site-font:ui-rounded,"SF Pro Rounded",-apple-system,system-ui,sans-serif;
    --white:#fff;
    --black:#151515;
    --gray-1:#fbfbfb;
    --gray-2:#f6f6f6;
    --gray-5:#9a9a9a;
    --gray-6:#5a5a5a;
    --gray-7:#333333;
    --video-card-shadow:0 0 9px rgba(0,0,0,.055),0 1px 5px rgba(0,0,0,.085);
    --speed:.24s;
}
*{box-sizing:border-box;max-width:100%}
[hidden]{display:none!important}
html{width:100%;height:100%;background:var(--white);-webkit-text-size-adjust:100%}
body{
    width:100%;
    margin:0;
    background:var(--white);
    color:var(--gray-7);
    font-family:var(--site-font);
    font-size:15px;
    line-height:1.42;
}
input,textarea,select,button{font:inherit}
button{
    border:0;
    background:var(--gray-2);
    color:var(--gray-7);
    cursor:pointer;
    border-radius:14px;
    min-height:38px;
    padding:8px 12px;
    transition:background var(--speed),color var(--speed),box-shadow var(--speed);
}
button:focus,button:focus-visible{outline:0;box-shadow:none}
.auth-page{
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:22px;
    background:var(--gray-1);
}
.auth-card{
    display:grid;
    gap:16px;
    width:min(410px,100%);
    background:var(--white);
    border-radius:22px;
    box-shadow:var(--video-card-shadow);
    padding:24px;
}
.auth-card h1{
    margin:0;
    color:var(--black);
    font-size:24px;
    line-height:30px;
}
.auth-form{
    display:grid;
    gap:10px;
}
.auth-form label{
    display:grid;
    gap:5px;
    color:var(--gray-6);
    font-size:12px;
    line-height:16px;
}
.auth-form input{
    width:100%;
    min-height:38px;
    border:0;
    border-radius:12px;
    background:var(--gray-2);
    color:var(--gray-7);
    padding:8px 10px;
    outline:0;
}
.auth-form input:focus{
    background:var(--white);
    box-shadow:var(--video-card-shadow);
}
/* 1855patch: неверное поле регистрации — подпись и пояснение красным, введённое цело */
.auth-form label.is-bad > span:first-child,
.auth-field-note{color:#a32020}
.auth-form label.is-bad input{background:#fbeaea;box-shadow:inset 0 0 0 1px rgba(163,32,32,.45)}
/* Глазок «показать пароль» (password-eye.js) */
.pass-eye-wrap{position:relative;display:block;width:100%}
.pass-eye-wrap input{padding-right:40px}
button.pass-eye{
    position:absolute;
    top:50%;
    right:5px;
    width:28px;
    height:28px;
    min-height:28px;
    margin-top:-14px;
    display:grid;
    place-items:center;
    padding:0;
    border-radius:50%;
    background:transparent;
    color:var(--gray-5);
}
button.pass-eye:hover,button.pass-eye:focus-visible{background:transparent;color:var(--gray-6)}
button.pass-eye.is-on{color:var(--gray-6)}
button.pass-eye svg{display:block;height:18px}
/* Подсказка о надёжности пароля (password-strength.js) */
.password-hint{
    display:block;
    margin-top:4px;
    font-size:12px;
    line-height:16px;
    color:var(--gray-5);
}
.password-hint.is-weak{color:#a32020}
.password-hint.is-ok{color:#268044}
.auth-message{
    width:100%;
    border-radius:14px;
    padding:10px 12px;
    background:var(--gray-2);
    color:var(--gray-7);
    font-size:13px;
    line-height:18px;
}
.auth-message.is-error{color:#a32020}
.auth-message.is-ok{color:#268044}
@media(max-width:760px){
    .auth-card{padding:18px;border-radius:18px}
    .auth-card h1{font-size:22px;line-height:28px}
}
/* ⭐ Переключатель «Работа ↔ Дом» (api/site-side.php): форма входа СОСЕДНЕГО сайта
   в адресе владельца — дорога назад тихой строкой под карточкой. Ссылку кладёт
   assets/js/core/site-side-boot.js; без переключателя её нет вовсе. */
.auth-side-back{
    display:flex;align-items:center;justify-content:center;min-height:38px;margin-top:6px;
    border-radius:12px;color:inherit;opacity:.62;font-size:14px;text-decoration:none
}
.auth-side-back:hover{opacity:.9;background:rgba(0,0,0,.04)}
.auth-side-back:active{opacity:1;background:rgba(0,0,0,.07)}
/* ⭐ 26.09.2026: УЮТНЫЙ ОБЛИК семейного сайта (api/auth/site-config.php → site.json
   `"theme":"cozy"`). Владелец: «чтобы тема была такой чтобы хотелось туда заходить» —
   а заходят через эту форму. Здесь только её краски; остальной сайт красят
   core/site-cozy*.css, которые постороннему не отдаются (nginx). Палитра та же:
   лён с мягким светом, кремовая карточка, терракотовая кнопка «Войти».
   ⚠️ Ни рамок, ни теней: «рамки нигде не нужны… пускай отличается только цветом». */
html[data-site-theme="cozy"]{
    background:
        radial-gradient(900px 620px at 8% -10%,rgba(239,204,181,.32),rgba(239,204,181,0) 62%),
        radial-gradient(800px 560px at 104% 110%,rgba(234,200,197,.28),rgba(234,200,197,0) 62%),
        #e8d9ca;
    background-repeat:no-repeat;
    background-color:#e8d9ca
}
html[data-site-theme="cozy"] body{background:transparent;color:#604839}
:where([data-site-theme="cozy"]) .auth-page{background:transparent}
:where([data-site-theme="cozy"]) .auth-card{background:#f5eade;border-radius:26px;box-shadow:none}
:where([data-site-theme="cozy"]) .auth-card .auth-title{color:#604839}
:where([data-site-theme="cozy"]) .auth-form label{color:#654b39}
:where([data-site-theme="cozy"]) .auth-form input{background:#e9d7c5;color:#604839}
:where([data-site-theme="cozy"]) .auth-form input:focus{background:#dfc7b2;box-shadow:none}
:where([data-site-theme="cozy"]) .auth-form>button[type="submit"]{background:#b77e65;color:#f5eade;font-weight:600}
:where([data-site-theme="cozy"]) .auth-form>button[type="submit"]:hover{background:#c26d46}
:where([data-site-theme="cozy"]) button.pass-eye{color:#68503c}
:where([data-site-theme="cozy"]) .auth-message{background:#e9d7c5;color:#604839}
