/* Linkodium IMG: окно входа и регистрации (assets/js/auth-modal.js, порт keys.linkodium.com 12.11.2026). Индиго #6366f1 (семейство crm/ftp/smtp),
   кнопка-пилюля), размеры — как окно входа Linkodium CRM: карточка 420 px, 6 ячеек кода 48×56.
   Токены свои (.am): файл подключается и на страницах сайта (style.css), и на странице /login/ (кабинетная оболочка). */
.am {
    --am-ink: #121a2e; --am-text: #454e66; --am-muted: #66708a; --am-line: #e3e8f2; --am-tint: #f3f6fc;
    --am-accent: #6366f1; --am-accent-hover: #4f46e5; --am-accent-tint: #eef2ff; --am-warn: #d98a0b; --am-warn-tint: #fdf3dd;
    --am-font: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    font-family: var(--am-font);
}
html.am-open { overflow: hidden; }
.am:not(.am--page) { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.am__back { position: absolute; inset: 0; background: rgba(14, 21, 40, .55); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.am__card {
    position: relative; width: 100%; max-width: 420px; max-height: calc(100vh - 32px); overflow: auto; box-sizing: border-box;
    background: #fff; color: var(--am-text); border-radius: 22px; border: 1px solid var(--am-line);
    box-shadow: 0 24px 60px -24px rgba(13, 21, 38, .28), 0 8px 20px -12px rgba(13, 21, 38, .12);
    padding: 30px 30px 24px; font-size: 16px; line-height: 1.5;
}
.am__card *, .am__card *::before, .am__card *::after { box-sizing: border-box; }
@media (prefers-reduced-motion: no-preference) {
    .am:not(.am--page) .am__card { animation: am-in .18s ease-out; }
    @keyframes am-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
}
/* Страница /login/: та же карточка в потоке страницы. */
.am--page { width: 100%; display: flex; justify-content: center; }
.am--page .am__card { max-height: none; }
.am__x { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--am-muted); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.am__x:hover, .am__x:focus-visible { background: var(--am-tint); color: var(--am-ink); }
.am__logo { display: flex; align-items: center; gap: 10px; color: var(--am-ink); font-size: 19px; font-weight: 800; letter-spacing: -.015em; margin-bottom: 18px; }
.am__logo small { font-size: 13px; font-weight: 600; color: var(--am-muted); letter-spacing: 0; }
.am__card h2 { margin: 0 0 6px; color: var(--am-ink); font-size: 26px; line-height: 1.25; font-weight: 800; letter-spacing: -.015em; }
.am__sub { margin: 0 0 18px; color: var(--am-muted); font-size: 15px; line-height: 1.5; }
.am__sub b { color: var(--am-ink); word-break: break-all; }
.am__form { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.am__label { font-size: 14px; font-weight: 700; color: var(--am-ink); }
.am__input {
    width: 100%; font: inherit; font-size: 17px; padding: 13px 16px; border-radius: 14px; border: 1.5px solid var(--am-line);
    background: #fff; color: var(--am-ink); outline: none;
}
.am__input:focus { border-color: var(--am-accent); box-shadow: 0 0 0 4px var(--am-accent-tint); }
.am__go {
    width: 100%; display: inline-flex; align-items: center; justify-content: center; padding: 14px 24px; border: 0; border-radius: 999px;
    background: var(--am-accent); color: #fff; font: inherit; font-size: 16px; font-weight: 700; line-height: 24px; cursor: pointer;
    transition: background-color .2s, box-shadow .2s;
}
.am__go:hover, .am__go:focus-visible { background: var(--am-accent-hover); box-shadow: 0 10px 24px -10px rgba(99, 102, 241, .7); }
.am__go.is-busy, .am__go:disabled { opacity: .7; cursor: progress; }
.am__cells { display: grid; grid-template-columns: repeat(6, minmax(0, 48px)); justify-content: space-between; gap: 8px; }
.am__cell {
    width: 100%; min-width: 0; height: 56px; text-align: center; font: inherit; font-size: 24px; font-weight: 800; color: var(--am-ink);
    border-radius: 12px; border: 1.5px solid var(--am-line); background: #fff; outline: none; padding: 0; caret-color: var(--am-accent);
}
.am__cell:focus { border-color: var(--am-accent); box-shadow: 0 0 0 4px var(--am-accent-tint); }
.am__cell.is-filled { border-color: var(--am-accent); background: var(--am-tint); }
.am__cell:disabled { opacity: .6; }
.am__check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.45; color: var(--am-text); padding: 10px 12px; border-radius: 12px; border: 1.5px solid transparent; cursor: pointer; }
.am__check input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--am-accent); flex: none; }
.am__check a { color: var(--am-accent); }
.am__check.is-need { border-color: var(--am-warn); background: var(--am-warn-tint); }
.am__err { color: #b42318; font-size: 14px; line-height: 1.45; }
.am__row { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.am__link { border: 0; background: none; padding: 10px 0; font: inherit; font-size: 14px; color: var(--am-accent); cursor: pointer; }
.am__link:disabled { color: var(--am-muted); cursor: default; }
/* Страница /login/: фон и подвал как у прежней страницы входа (app.css body.auth). */
body.am-login { background: #f3f6fc; }
@media (max-width: 440px) {
    .am:not(.am--page) { padding: 10px; align-items: flex-end; }
    .am__card { padding: 24px 16px 18px; border-radius: 20px; }
    .am__card h2 { font-size: 23px; }
    .am__cells { gap: 6px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .am__cell { height: 50px; font-size: 22px; }
}