/* Блок входа в шапке и окно входа — общие для всех страниц сайта (токены — tokens.css) */

.acc-box { display: inline-flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.acc-box:empty { display: none; }
.acc-quota { color: var(--text-secondary); font-size: 12.5px; font-variant-numeric: tabular-nums; }
.acc-user {
    font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--text);
    padding: 4px 10px; border-radius: var(--radius-full); background: rgb(255 255 255 / 6%);
    border: 1px solid var(--glass-border);
}
.acc-link {
    color: var(--color-link); font-size: 13px; font-weight: 600; text-decoration: none;
    border-bottom: 1px dotted rgb(124 199 222 / 45%);
}
.acc-link:hover { color: #b6e6f5; border-bottom-color: #b6e6f5; }
.acc-logout { padding: 6px 14px; font-size: 13px; }

.acc-dialog {
    width: min(360px, calc(100vw - 32px));
    padding: var(--space-5) var(--space-6);
    color: var(--text);
    background: var(--glass-bg-strong);
    border: 1px solid var(--glass-border-strong);
    border-radius: var(--radius-xl);
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    box-shadow: var(--glass-shadow);
}
.acc-dialog::backdrop { background: rgb(0 0 0 / 45%); backdrop-filter: blur(3px); }
.acc-form { display: grid; gap: var(--space-3); margin: 0; }
.acc-form h2 { margin: 0 0 var(--space-1); font-size: 18px; font-weight: 700; }
.acc-form label { display: grid; gap: 6px; font-size: 12.5px; color: var(--text-secondary); }
.acc-form input, .field-input {
    font: inherit; font-size: 14px; color: var(--text);
    padding: 9px 12px; border-radius: var(--radius-sm);
    background: rgb(0 0 0 / 28%); border: 1px solid var(--glass-border-strong);
    outline: none; transition: border-color var(--duration-base) var(--ease-out);
}
.acc-form input:focus, .field-input:focus { border-color: rgb(var(--color-accent-rgb) / 60%); }
.acc-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-1); }
.acc-error { margin: 0; color: var(--team2); font-size: 13px; }
.acc-hint { margin: 0; color: var(--text-dim); font-size: 12px; }
.acc-hint:empty { display: none; }
.acc-register { padding: 6px 14px; font-size: 13px; }

/* «Вход / Регистрация»: подложка переезжает под выбранную кнопку, как у переключателей главной */
.acc-seg {
    position: relative; display: grid; grid-template-columns: 1fr 1fr; padding: 3px; margin-bottom: var(--space-1);
    border-radius: var(--radius-full); background: rgb(0 0 0 / 22%); border: 1px solid var(--glass-border);
    box-shadow: inset 0 1px 3px rgb(0 0 0 / 32%);
}
.acc-seg[hidden] { display: none; }
.acc-seg-thumb {
    position: absolute; top: 3px; bottom: 3px; left: 3px; width: 0; border-radius: var(--radius-full);
    background: rgb(var(--color-accent-rgb) / 18%); box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%); pointer-events: none;
    transition: left var(--duration-med) var(--ease-spring), width var(--duration-med) var(--ease-spring);
}
.acc-seg.instant .acc-seg-thumb { transition: none; }
.acc-seg button {
    position: relative; z-index: 1; padding: 6px 12px; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
    color: var(--text-secondary); background: transparent; border: none; box-shadow: none; border-radius: var(--radius-full);
    transition: color var(--duration-base) var(--ease-out);
}
.acc-seg button:hover { color: var(--text); background: transparent; }
.acc-seg button.active { color: var(--color-accent); }
/* второе поле пароля раскрывается по высоте */
.acc-more {
    display: grid; grid-template-rows: 0fr; opacity: 0; margin-top: calc(-1 * var(--space-3));
    transition: grid-template-rows var(--duration-med) var(--ease-out), opacity var(--duration-med) var(--ease-out),
        margin-top var(--duration-med) var(--ease-out);
}
.acc-more > div { overflow: hidden; min-height: 0; }
.acc-form.register .acc-more { grid-template-rows: 1fr; opacity: 1; margin-top: 0; }
.acc-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }