/* WYLAKS CRM v23 — mobile / activation / admin avatar stability layer */

.crm-mobile-nav,
.crm-mobile-drawer { display: none; }

.crm-password-input-wrap { position: relative; display: block; }
.crm-password-input-wrap input,
.crm-login-field__body { position: relative; }
.crm-password-toggle {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    min-width: 44px;
    min-height: 30px;
    padding: 0 8px;
    border: 1px solid rgba(21, 29, 36, .15);
    border-radius: 5px;
    background: rgba(255,255,255,.72);
    color: #5d6872;
    font-family: "Roboto Condensed", Inter, sans-serif;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    cursor: pointer;
    z-index: 2;
}
.crm-login-field__body > .crm-password-toggle {
    right: 4px;
    top: 28px;
}
.crm-login-field__body:has(.crm-password-toggle) input { padding-right: 58px !important; }
.crm-password-input-wrap input { padding-right: 64px !important; }
.crm-password-toggle.is-visible { color: #d12620; border-color: rgba(210,38,32,.25); }

.crm-auth-live-status {
    min-height: 28px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #7b858e;
    font-size: 10px;
    font-family: "Roboto Condensed", Inter, sans-serif;
    letter-spacing: .05em;
}
.crm-auth-live-status i {
    width: 6px; height: 6px; border-radius: 50%; background: #28b97a; box-shadow: 0 0 10px rgba(40,185,122,.35);
}
.crm-auth-live-status.is-busy i { background: #ff2a1f; animation: crmV23Pulse .8s ease-in-out infinite alternate; }
.crm-auth-live-status.is-error i { background: #ff2a1f; }
@keyframes crmV23Pulse { from { opacity:.35; } to { opacity:1; } }

.crm-password-strength { display: grid; gap: 7px; margin-top: -6px; }
.crm-password-strength > div { display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; }
.crm-password-strength i { height: 3px; border-radius: 20px; background: rgba(26,34,41,.10); transition: .18s ease; }
.crm-password-strength span { color: #7d8790; font-size: 10px; }
.crm-password-strength[data-level="1"] i:nth-child(1),
.crm-password-strength[data-level="2"] i:nth-child(-n+2) { background: #e64a43; }
.crm-password-strength[data-level="3"] i:nth-child(-n+3) { background: #d99b24; }
.crm-password-strength[data-level="4"] i:nth-child(-n+4) { background: #28b97a; }
.crm-password-match { display:flex; align-items:center; gap:8px; min-height:24px; color:#8a949d; font-size:10px; }
.crm-password-match i { width:6px; height:6px; border-radius:50%; background:#aab1b7; }
.crm-password-match.is-ok { color:#258d62; }
.crm-password-match.is-ok i { background:#28b97a; }
.crm-password-match.is-bad { color:#c83a34; }
.crm-password-match.is-bad i { background:#e64a43; }
.crm-invite-form-head h2 { margin: 7px 0 8px; }
.crm-invite-identity--v23 { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(120px,.65fr); gap:8px; }
.crm-invite-identity--v23 > div { min-width:0; }
.crm-invite-identity--v23 strong { overflow-wrap:anywhere; }
.crm-invite-submit-v23 { color:#fff !important; }
.crm-invite-help-v23 { margin:0; color:#7d8790; font-size:10px; line-height:1.5; }
.crm-invite-mobile-steps { display:none; }

.crm-admin-avatar-editor {
    margin: 0 18px 2px;
    padding: 16px;
    display: grid;
    grid-template-columns: 116px minmax(0,1fr);
    gap: 18px;
    border-bottom: 1px solid rgba(255,255,255,.08);
    background: rgba(255,255,255,.014);
}
.crm-admin-avatar-editor__preview {
    width: 116px;
    aspect-ratio: 1 / 1.18;
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    background: #080d11;
    color:#fff;
    font-size:28px;
    font-weight:700;
}
.crm-admin-avatar-editor__preview img { width:100%; height:100%; display:block; object-fit:cover; object-position:center top; }
.crm-admin-avatar-editor__preview i { position:absolute; left:0; right:0; top:24%; height:1px; background:rgba(255,42,31,.55); pointer-events:none; }
.crm-admin-avatar-editor__body { min-width:0; display:grid; align-content:start; gap:12px; }
.crm-admin-avatar-editor__head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.crm-admin-avatar-editor__head strong { display:block; margin-top:4px; font-size:15px; }
.crm-admin-avatar-editor__body > p { margin:0; max-width:650px; color:#7c8790; font-size:11px; line-height:1.55; }
.crm-admin-avatar-editor__actions { display:flex; gap:8px; flex-wrap:wrap; }
.crm-admin-avatar-editor__position { display:grid; gap:7px; max-width:520px; }
.crm-admin-avatar-editor__position > div:first-child { display:flex; justify-content:space-between; gap:12px; color:#9099a2; font-size:10px; }
.crm-admin-avatar-editor__position input[type="range"] { width:100%; accent-color:#ff2a1f; }
.crm-admin-avatar-presets { display:flex; gap:6px; }
.crm-admin-avatar-presets button { min-height:28px; padding:0 9px; border:1px solid rgba(255,255,255,.10); background:transparent; color:#8f98a1; border-radius:4px; font-size:9px; cursor:pointer; }
.crm-admin-avatar-presets button:hover { color:#fff; border-color:rgba(255,42,31,.4); }
.crm-ajax-state { color:#29bd80; font-family:"Roboto Condensed", Inter, sans-serif; font-size:9px; letter-spacing:.06em; white-space:nowrap; }
.crm-ajax-state.is-busy { color:#e5aa3d; }
.crm-ajax-state.is-error { color:#ff5b50; }

@media (max-width: 900px) {
    html, body { max-width:100%; overflow-x:hidden; }
    .crm-body { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
    .crm-shell { display:block !important; width:100% !important; min-width:0 !important; }
    .crm-sidebar { display:none !important; }
    .crm-main { width:100% !important; min-width:0 !important; margin:0 !important; }
    .crm-topbar {
        position: sticky !important;
        top: 0;
        z-index: 70;
        min-height: 68px !important;
        padding: 11px 14px !important;
        border-bottom:1px solid rgba(255,255,255,.08);
        background:rgba(2,7,11,.88) !important;
        backdrop-filter: blur(16px);
    }
    .crm-topbar > div:first-child { min-width:0; }
    .crm-topbar h1 { margin-top:4px !important; font-size:22px !important; line-height:1.05 !important; }
    .crm-topbar__right { gap:7px !important; }
    .crm-topbar__right > p,
    .crm-command-trigger,
    .crm-topbar__right > form,
    .crm-profile-link > span:last-child { display:none !important; }
    .crm-profile-link { width:38px !important; min-width:38px !important; height:38px !important; padding:0 !important; display:grid !important; place-items:center !important; }
    .crm-top-avatar { width:30px !important; height:30px !important; }
    .crm-content {
        width:100% !important;
        max-width:none !important;
        padding:14px 12px 24px !important;
        margin:0 !important;
    }

    .crm-dashboard-kpis,
    .crm-dashboard-grid,
    .crm-dashboard-grid--equal,
    .crm-project-grid,
    .crm-project-grid--visual,
    .crm-project-detail-grid,
    .crm-profile-grid,
    .crm-form-grid,
    .crm-v21-form-grid,
    .crm-manage-grid,
    .crm-manage-mail-grid,
    .crm-project-form-grid,
    .crm-project-fields,
    .crm-project-site-fields,
    .crm-summary-grid,
    .crm-stat-grid,
    .crm-action-grid { grid-template-columns:1fr !important; }

    .crm-dashboard-hero { grid-template-columns:1fr !important; padding:18px !important; gap:18px !important; }
    .crm-dashboard-hero__copy h2 { font-size:clamp(25px,8vw,36px) !important; }
    .crm-dashboard-signal { min-height:170px !important; }
    .crm-dashboard-panel,
    .crm-project-panel,
    .crm-profile-card,
    .crm-manage-card,
    .crm-v21-form-card { border-radius:8px !important; }

    .crm-section-head { align-items:flex-start !important; flex-direction:column !important; gap:12px !important; }
    .crm-section-head .crm-button { width:100%; }
    .crm-project-summary { grid-template-columns:1fr !important; }
    .crm-project-summary__action { width:100%; }
    .crm-project-summary__action .crm-button { width:100%; }
    .crm-project-visual-hero { grid-template-columns:1fr !important; min-height:0 !important; }
    .crm-project-visual-hero__cover { min-height:200px !important; }
    .crm-project-visual-hero__actions { flex-wrap:wrap !important; }
    .crm-project-visual-hero__actions .crm-button { flex:1 1 150px; }

    .crm-project-site-row { padding:12px !important; }
    .crm-project-site-row__top { align-items:flex-start !important; gap:8px !important; }
    .crm-project-site-scan { width:100%; }
    .crm-project-member-grid { grid-template-columns:1fr !important; }

    .crm-table-wrap,
    .crm-dashboard-table-wrap { overflow-x:auto !important; -webkit-overflow-scrolling:touch; max-width:100%; }
    .crm-table:not(.crm-team-table-v21),
    .crm-dashboard-table { min-width:720px; }

    .crm-team-toolbar,
    .crm-team-controls { align-items:stretch !important; flex-direction:column !important; gap:10px !important; }
    .crm-team-toolbar__actions { width:100%; display:grid !important; grid-template-columns:1fr !important; }
    .crm-team-toolbar__actions .crm-button { width:100%; }
    .crm-team-metrics { width:100%; display:grid !important; grid-template-columns:repeat(3,1fr); }
    .crm-team-metrics span { min-width:0; }
    .crm-search-box { width:100% !important; }
    .crm-filter-group { width:100%; overflow-x:auto; justify-content:flex-start !important; }
    .crm-team-controls__count { align-self:flex-end; }

    .crm-team-table-v21 { min-width:0 !important; display:block; }
    .crm-team-table-v21 thead { display:none; }
    .crm-team-table-v21 tbody { display:grid; gap:8px; }
    .crm-team-table-v21 tr[data-team-row] {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:0;
        border:1px solid rgba(255,255,255,.09);
        border-radius:7px;
        overflow:hidden;
        background:rgba(4,9,13,.82);
    }
    .crm-team-table-v21 tr[data-team-row] td { display:block; min-width:0; padding:11px !important; border-bottom:1px solid rgba(255,255,255,.06) !important; }
    .crm-team-table-v21 tr[data-team-row] td:first-child { grid-column:1/-1; }
    .crm-team-table-v21 tr[data-team-row] td:nth-child(2)::before { content:"Должность"; }
    .crm-team-table-v21 tr[data-team-row] td:nth-child(3)::before { content:"Роль"; }
    .crm-team-table-v21 tr[data-team-row] td:nth-child(4)::before { content:"Статус"; }
    .crm-team-table-v21 tr[data-team-row] td:nth-child(5)::before { content:"Приглашение"; }
    .crm-team-table-v21 tr[data-team-row] td:nth-child(n+2)::before { display:block; margin-bottom:5px; color:#65717b; font:700 8px/1 "Roboto Condensed", Inter, sans-serif; letter-spacing:.08em; text-transform:uppercase; }
    .crm-team-table-v21 .crm-table__actions { grid-column:1/-1; display:flex !important; flex-wrap:wrap; gap:8px; text-align:left !important; border-bottom:0 !important; }
    .crm-team-table-v21 .crm-table__actions form { display:inline-flex; }
    .crm-person--button { width:100%; text-align:left; }

    .crm-v21-form-grid,
    .crm-form-grid--profile { padding:14px !important; }
    .crm-v21-form-foot,
    .crm-profile-actions { align-items:stretch !important; flex-direction:column !important; gap:10px !important; }
    .crm-v21-form-foot > div,
    .crm-profile-actions > div { width:100%; display:grid !important; grid-template-columns:1fr !important; gap:8px; }
    .crm-v21-form-foot .crm-button,
    .crm-profile-actions .crm-button { width:100%; }

    .crm-manage-row,
    .crm-role-card__head { align-items:flex-start !important; grid-template-columns:1fr !important; flex-direction:column !important; }
    .crm-permission-groups { grid-template-columns:1fr !important; }

    .crm-overlay { padding:12px !important; }
    .crm-command,
    .crm-confirm,
    .crm-user-popup { width:min(100%,560px) !important; max-height:calc(100dvh - 24px); overflow:auto; }

    .crm-mobile-nav {
        position:fixed;
        left:8px; right:8px; bottom:8px;
        z-index:120;
        min-height:60px;
        padding:5px;
        display:grid;
        grid-template-columns:repeat(5,minmax(0,1fr));
        gap:3px;
        border:1px solid rgba(255,255,255,.11);
        border-radius:10px;
        background:rgba(3,8,12,.94);
        backdrop-filter:blur(18px);
        box-shadow:0 12px 35px rgba(0,0,0,.42);
        padding-bottom:max(5px, env(safe-area-inset-bottom));
    }
    .crm-mobile-nav > a,
    .crm-mobile-nav > button {
        min-width:0;
        min-height:50px;
        padding:5px 2px;
        border:0;
        border-radius:6px;
        display:grid;
        justify-items:center;
        align-content:center;
        gap:4px;
        background:transparent;
        color:#7f8b95;
        text-decoration:none;
    }
    .crm-mobile-nav > a.is-active { color:#fff; background:rgba(255,42,31,.10); box-shadow:inset 0 -2px 0 #ff2a1f; }
    .crm-mobile-nav b { min-width:22px; height:22px; display:grid; place-items:center; font:700 9px/1 "Roboto Condensed", Inter, sans-serif; }
    .crm-mobile-nav span { font:700 8px/1 "Roboto Condensed", Inter, sans-serif; white-space:nowrap; }
    .crm-mobile-nav__avatar { overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:5px; }
    .crm-mobile-nav__avatar img { width:100%; height:100%; object-fit:cover; display:block; }

    .crm-mobile-drawer[hidden] { display:none !important; }
    .crm-mobile-drawer { position:fixed; inset:0; z-index:150; display:block; }
    .crm-mobile-drawer__backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; background:rgba(0,0,0,.62); backdrop-filter:blur(3px); }
    .crm-mobile-drawer__panel {
        position:absolute; left:8px; right:8px; bottom:8px;
        max-height:calc(100dvh - 28px);
        overflow:auto;
        padding:16px;
        padding-bottom:max(16px, env(safe-area-inset-bottom));
        border:1px solid rgba(255,255,255,.12);
        border-radius:12px;
        background:#050b0f;
        box-shadow:0 -18px 60px rgba(0,0,0,.55);
    }
    .crm-mobile-drawer__head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
    .crm-mobile-drawer__head strong { display:block; margin-top:4px; font-size:19px; }
    .crm-mobile-drawer__head > button { width:34px; height:34px; border:1px solid rgba(255,255,255,.10); border-radius:5px; background:transparent; color:#fff; font-size:22px; }
    .crm-mobile-drawer__user { margin-top:14px; padding:12px; display:flex; align-items:center; gap:11px; border:1px solid rgba(255,255,255,.08); border-radius:7px; }
    .crm-mobile-drawer__avatar { width:44px; height:44px; overflow:hidden; display:grid; place-items:center; border-radius:6px; border:1px solid rgba(255,42,31,.25); }
    .crm-mobile-drawer__avatar img { width:100%; height:100%; object-fit:cover; display:block; }
    .crm-mobile-drawer__user strong,.crm-mobile-drawer__user small { display:block; }
    .crm-mobile-drawer__user small { margin-top:3px; color:#78838d; font-size:10px; }
    .crm-mobile-drawer__links { margin-top:10px; display:grid; gap:5px; }
    .crm-mobile-drawer__links > a,
    .crm-mobile-drawer__links > button { min-height:48px; display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:9px; padding:0 10px; border:1px solid rgba(255,255,255,.07); border-radius:6px; background:rgba(255,255,255,.018); color:#dbe0e4; text-align:left; text-decoration:none; }
    .crm-mobile-drawer__links b,.crm-mobile-drawer__links em { font:700 9px/1 "Roboto Condensed",Inter,sans-serif; color:#ff6258; font-style:normal; }
    .crm-mobile-drawer__links span { font-size:12px; font-weight:700; }
    .crm-mobile-drawer__logout { margin-top:10px; }
    .crm-mobile-drawer__logout button { width:100%; min-height:44px; border:1px solid rgba(255,70,59,.25); border-radius:6px; background:rgba(255,42,31,.07); color:#ff887f; font-weight:700; }

    .crm-admin-avatar-editor { margin:0; grid-template-columns:92px minmax(0,1fr); gap:13px; padding:14px; }
    .crm-admin-avatar-editor__preview { width:92px; }
}

@media (max-width: 560px) {
    .crm-fixed-backdrop__node,
    .crm-fixed-backdrop__meta { display:none !important; }
    .crm-topbar { min-height:62px !important; }
    .crm-topbar .crm-eyebrow { font-size:7px !important; }
    .crm-topbar h1 { font-size:20px !important; }
    .crm-content { padding-left:10px !important; padding-right:10px !important; }
    .crm-team-metrics { grid-template-columns:1fr 1fr 1fr; }
    .crm-team-metrics span { padding:9px 6px !important; }
    .crm-team-metrics b { font-size:15px !important; }
    .crm-team-table-v21 tr[data-team-row] { grid-template-columns:1fr; }
    .crm-team-table-v21 tr[data-team-row] td:first-child,
    .crm-team-table-v21 .crm-table__actions { grid-column:auto; }
    .crm-filter-group button { flex:0 0 auto; }
    .crm-project-card__media { min-height:160px !important; }
    .crm-project-visual-hero__cover { min-height:175px !important; }
    .crm-admin-avatar-editor { grid-template-columns:1fr; }
    .crm-admin-avatar-editor__preview { width:min(150px,46vw); margin:0 auto; }
    .crm-admin-avatar-editor__head { align-items:center; }
    .crm-admin-avatar-editor__actions { display:grid; grid-template-columns:1fr 1fr; }
    .crm-admin-avatar-editor__actions .crm-button { width:100%; }
}

/* Auth / invitation mobile: intentionally scrollable, never viewport-locked */
@media (max-width: 900px) {
    body.crm-login-page,
    body.crm-invite-page {
        display:block !important;
        min-height:100dvh !important;
        height:auto !important;
        overflow-x:hidden !important;
        overflow-y:auto !important;
        overscroll-behavior-y:auto;
        -webkit-overflow-scrolling:touch;
        padding:0 !important;
    }
    .crm-login-page .crm-preloader { position:fixed !important; inset:0 !important; z-index:9999 !important; }
    .crm-login-grid,
    .crm-login-scanline { position:fixed !important; inset:0 !important; }
    .crm-login-shell,
    .crm-login-shell--invite {
        width:100% !important;
        min-height:100dvh !important;
        height:auto !important;
        max-height:none !important;
        margin:0 !important;
        display:grid !important;
        grid-template-columns:1fr !important;
        overflow:visible !important;
        border-radius:0 !important;
        border-left:0 !important;
        border-right:0 !important;
    }
    .crm-login-visual,
    .crm-login-visual--invite {
        min-height:360px !important;
        height:auto !important;
        padding:28px 22px 32px !important;
        overflow:hidden !important;
    }
    .crm-login-logo { position:relative !important; inset:auto !important; }
    .crm-login-logo img { width:168px !important; max-width:65vw; }
    .crm-login-copy { position:relative !important; inset:auto !important; margin-top:76px !important; max-width:460px !important; }
    .crm-login-copy h1 { font-size:clamp(42px,12vw,62px) !important; line-height:.98 !important; }
    .crm-login-copy p { max-width:460px !important; }
    .crm-login-signalfield,
    .crm-login-map { opacity:.46; transform:scale(.72); transform-origin:right center; right:-44px !important; }
    .crm-login-meta { position:relative !important; left:auto !important; right:auto !important; bottom:auto !important; margin-top:34px; }

    .crm-login-form-wrap,
    .crm-login-form-wrap--white,
    .crm-invite-form-wrap {
        min-height:0 !important;
        height:auto !important;
        max-height:none !important;
        overflow:visible !important;
        display:block !important;
        padding:22px 16px 38px !important;
    }
    .crm-login-white-grid { position:absolute !important; inset:0 !important; }
    .crm-login-perimeter,
    .crm-login-coordinate { display:none !important; }
    .crm-login-panel,
    .crm-login-form,
    .crm-invite-form-v23 {
        width:100% !important;
        max-width:560px !important;
        min-width:0 !important;
        margin:0 auto !important;
        position:relative !important;
        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;
    }
    .crm-login-panel { padding:22px !important; }
    .crm-login-panel__head { grid-template-columns:1fr auto !important; gap:12px !important; }
    .crm-login-panel__head h2 { font-size:30px !important; }
    .crm-login-protocol { width:100% !important; max-width:560px !important; margin:12px auto 0 !important; position:relative !important; inset:auto !important; }
    .crm-login-field { min-height:62px !important; }
    .crm-login-field__body input { font-size:14px !important; }
    .crm-button--login,
    .crm-invite-submit-v23 { min-height:50px !important; color:#fff !important; }
    .crm-invite-mobile-steps { margin-top:18px; display:flex; gap:6px; flex-wrap:wrap; }
    .crm-invite-mobile-steps span { min-height:28px; padding:0 8px; display:inline-flex; align-items:center; gap:5px; border:1px solid rgba(255,255,255,.08); border-radius:4px; color:#68747e; font:700 8px/1 "Roboto Condensed",Inter,sans-serif; }
    .crm-invite-mobile-steps span.is-ready { color:#7bdcb2; border-color:rgba(74,210,151,.16); }
    .crm-invite-mobile-steps span.is-current { color:#ff7b70; border-color:rgba(255,42,31,.22); }
    .crm-invite-identity--v23 { grid-template-columns:1fr !important; }
}

@media (max-width: 520px) {
    .crm-login-visual,
    .crm-login-visual--invite { min-height:330px !important; padding:22px 18px 24px !important; }
    .crm-login-copy { margin-top:58px !important; }
    .crm-login-copy h1 { font-size:43px !important; }
    .crm-login-copy p { font-size:13px !important; line-height:1.55 !important; }
    .crm-login-signalfield,
    .crm-login-map { opacity:.22; transform:scale(.56); right:-86px !important; }
    .crm-login-meta { display:none !important; }
    .crm-login-form-wrap,
    .crm-invite-form-wrap { padding:18px 12px 32px !important; }
    .crm-login-panel { padding:18px !important; border-radius:8px !important; }
    .crm-login-panel__code { font-size:8px !important; }
    .crm-login-panel__head h2,
    .crm-invite-form-v23 h2 { font-size:27px !important; }
    .crm-login-field { grid-template-columns:34px minmax(0,1fr) 30px !important; }
    .crm-login-field__index,
    .crm-login-field__meta { font-size:8px !important; }
    .crm-login-options { gap:8px !important; font-size:8px !important; }
    .crm-login-protocol { grid-template-columns:1fr !important; gap:6px !important; }
    .crm-login-protocol > div { min-height:42px !important; }
    .crm-invite-identity--v23 { padding:0 !important; background:transparent !important; border:0 !important; gap:6px !important; }
    .crm-invite-identity--v23 > div { padding:11px; border:1px solid rgba(25,35,42,.12); border-radius:5px; background:rgba(255,255,255,.5); }
}