.stats-grid { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 14px; margin-bottom: 24px; }
.stat-card { display: flex; align-items: center; gap: 13px; padding: 19px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-sm); transition: transform var(--transition), box-shadow var(--transition); }.stat-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(23,43,77,.08); }.stat-card > div:last-child { display: flex; flex-direction: column; }.stat-card span { color: var(--muted); font-size: .74rem; font-weight: 600; }.stat-card strong { font-size: 1.5rem; line-height: 1.25; }.stat-icon { flex: 0 0 auto; display: grid; place-items: center; width: 40px; height: 40px; color: var(--blue); background: var(--blue-soft); border-radius: 12px; font-size: 1.15rem; font-weight: 700; }.stat-completed .stat-icon { color: var(--success); background: var(--success-soft); }.stat-failed .stat-icon { color: var(--error); background: var(--error-soft); }.stat-queued .stat-icon { color: var(--warning); background: var(--warning-soft); }
.table-wrap { width: 100%; overflow-x: auto; }table { width: 100%; border-collapse: collapse; }th, td { padding: 14px 18px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: middle; }th { color: var(--muted); background: #fbfcfe; font-size: .69rem; letter-spacing: .04em; text-transform: uppercase; }td { color: #41526a; font-size: .79rem; }tbody tr { transition: background var(--transition); }tbody tr:hover { background: #f9fbfe; }tbody tr:last-child td { border-bottom: 0; }td small { display: block; color: var(--subtle); font-size: .67rem; }.task-name { display: block; max-width: 230px; overflow: hidden; color: var(--navy); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }.progress-cell { display: grid; grid-template-columns: minmax(70px, 120px) 30px; align-items: center; gap: 8px; }.row-action { display: grid; place-items: center; width: 29px; height: 29px; color: var(--blue); background: var(--blue-soft); border-radius: 8px; font-weight: 700; }.truncate-cell { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.mobile-task-list { display: none; }
.add-history-sheet { overflow: hidden; border-radius: 10px; box-shadow: none; }
.add-history-table table { min-width: 760px; }
.add-history-table th, .add-history-table td { border-right: 1px solid var(--border); }
.add-history-table th:last-child, .add-history-table td:last-child { border-right: 0; }
.add-history-table th { background: #f3f6fb; color: #41526a; }
.add-history-table th:nth-child(1) { width: 34%; }
.add-history-table th:nth-child(2) { width: 20%; }
.add-history-table th:nth-child(3) { width: 32%; }
.add-history-table th:nth-child(4) { width: 14%; }
.add-history-table .masked-value { display: inline-block; max-width: 180px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; white-space: nowrap; }
.add-history-table .truncate-cell strong, .add-history-table .truncate-cell small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.add-history-empty { min-height: 290px; }
.task-mobile-card { position: relative; margin: 12px; padding: 15px; border: 1px solid var(--border); border-radius: 12px; }.task-mobile-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }.task-mobile-head div { min-width: 0; }.task-mobile-head strong, .task-mobile-head small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.task-mobile-head small { color: var(--subtle); font-size: .62rem; }.task-mobile-meta { display: flex; justify-content: space-between; margin-top: 9px; color: var(--muted); font-size: .7rem; }.stretched-link::after { content: ""; position: absolute; inset: 0; }
.stepper { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 720px; margin: 0 auto 24px; }.stepper-item { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--subtle); font-size: .72rem; }.stepper-item:not(:last-child)::after { content: ""; position: absolute; z-index: -1; top: 16px; left: 58%; width: 84%; height: 2px; background: var(--border); }.stepper-item span { display: grid; place-items: center; width: 34px; height: 34px; background: var(--surface); border: 2px solid var(--border-strong); border-radius: 50%; font-weight: 700; }.stepper-item.is-active, .stepper-item.is-complete { color: var(--blue); }.stepper-item.is-active span, .stepper-item.is-complete span { color: white; background: var(--blue); border-color: var(--blue); }.stepper-item.is-complete:not(:last-child)::after { background: var(--blue); }
.task-form { max-width: 940px; margin: 0 auto; }.form-step { padding: 26px; }.task-login-card { position: relative; z-index: 1111; overflow: hidden; display: flex; flex-direction: column; border: 0; border-radius: 16px; box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #ffffff; }.task-login-bg { position: absolute; z-index: 2; inset: 4px; background: rgba(255,255,255,.96); backdrop-filter: blur(24px); border-radius: 12px; overflow: hidden; outline: 1px solid rgba(255,255,255,.9); }.task-login-blob { position: absolute; z-index: 1; inset: -45%; background: conic-gradient(from 0deg, transparent 0deg, transparent 58deg, #1667ff 88deg, #7c3aed 118deg, #ff2d55 148deg, transparent 184deg, transparent 360deg); filter: blur(10px); opacity: .95; animation: card-ring-spin 2.8s linear infinite; transform-origin: center; }.task-login-content { position: relative; z-index: 3; }.section-heading { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 24px; }.section-heading h3, .section-heading p { margin-bottom: 0; }.section-heading p { font-size: .82rem; }.section-number { flex: 0 0 auto; display: grid; place-items: center; width: 37px; height: 37px; color: var(--blue); background: var(--blue-soft); border-radius: 11px; font-size: .76rem; font-weight: 800; }.step-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 10px; padding-top: 20px; border-top: 1px solid var(--border); }.review-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin: 0 0 22px; }.review-grid div { padding: 13px 14px; background: var(--canvas); border: 1px solid var(--border); border-radius: 10px; }.review-grid dt { color: var(--muted); font-size: .68rem; font-weight: 700; text-transform: uppercase; }.review-grid dd { margin: 4px 0 0; overflow-wrap: anywhere; font-size: .85rem; font-weight: 600; }.authorization-box { display: flex; align-items: flex-start; gap: 11px; padding: 15px; border: 1px solid var(--border-strong); border-radius: 11px; cursor: pointer; }.authorization-box input { margin-top: 3px; }.authorization-box span { display: flex; flex-direction: column; }.authorization-box small { color: var(--muted); }.form-error-summary { max-width: 940px; margin: 16px auto 0; padding: 15px; color: var(--error); background: var(--error-soft); border: 1px solid #ffc9c4; border-radius: 11px; }.form-error-summary p { color: inherit; margin: 2px 0 0; }
.login-account-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 24px; }.login-account-title { display: flex; align-items: center; gap: 12px; min-width: 0; }.login-account-heading img { width: 38px; height: 38px; color: #1877f2; object-fit: contain; }.login-account-heading h3 { margin: 0; font-size: 1.15rem; line-height: 1.2; }
.cookie-field-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.proxy-inline-toggle { position: relative; flex: 0 0 auto; display: inline-grid; place-items: center; width: 54px; height: 32px; margin-left: auto; cursor: pointer; }
.proxy-inline-toggle input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.proxy-inline-track { position: relative; display: block; width: 54px; height: 32px; border-radius: 999px; background: #b8bec7; box-shadow: inset 0 1px 2px rgba(23,43,77,.12), 0 6px 15px rgba(23,43,77,.08); transition: background var(--transition), box-shadow var(--transition); }
.proxy-inline-track span { position: absolute; top: 6px; left: 6px; width: 20px; height: 20px; background: #fff; border-radius: 8px; box-shadow: 0 2px 7px rgba(23,43,77,.18); transition: transform var(--transition), border-radius var(--transition); }
.proxy-inline-toggle input:checked + .proxy-inline-track { background: #21cc4c; box-shadow: 0 8px 18px rgba(33,204,76,.20); }
.proxy-inline-toggle input:checked + .proxy-inline-track span { transform: translateX(22px); border-radius: 50%; }
.proxy-inline-toggle::after { content: attr(data-tooltip); position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 20; padding: 6px 9px; color: #fff; background: var(--navy); border-radius: 8px; font-size: .7rem; font-weight: 800; white-space: nowrap; opacity: 0; pointer-events: none; transform: translateY(4px); transition: opacity var(--transition), transform var(--transition); }
.proxy-inline-toggle:hover::after, .proxy-inline-toggle:focus-within::after { opacity: 1; transform: translateY(0); }
.cookie-login-field { margin-bottom: 6px; }.cookie-login-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: stretch; }.cookie-login-button { min-width: 112px; }.cookie-login-status { display: flex; align-items: center; min-height: 44px; margin-top: 4px; padding: 11px 14px; border: 1px solid var(--border); border-radius: 10px; font-size: .8rem; font-weight: 700; }.cookie-login-status.is-checking { color: var(--blue); background: var(--blue-soft); border-color: #c9dcff; }.cookie-login-status.is-success { color: var(--success); background: var(--success-soft); border-color: #b9e8cf; }.cookie-login-status.is-error { color: var(--error); background: var(--error-soft); border-color: #ffc9c4; }
.facebook-profile-card { display: flex; align-items: center; justify-content: space-between; gap: 13px; margin: 14px 0 16px; padding: 13px 14px; background: var(--canvas); border: 1px solid var(--border); border-radius: 12px; }.facebook-profile-card[hidden] { display: none; }.facebook-profile-main { display: flex; align-items: center; gap: 13px; min-width: 0; }.facebook-profile-card img { flex: 0 0 auto; width: 50px; height: 50px; object-fit: cover; border-radius: 50%; background: var(--blue-soft); }.facebook-profile-card strong { display: block; color: var(--navy); font-size: .92rem; }.facebook-profile-card p { margin: 2px 0 0; color: var(--blue); font-size: .76rem; font-weight: 700; }.facebook-logout-button { flex: 0 0 auto; min-width: 78px; padding-inline: 15px; }
.facebook-profile-status { display: inline-flex; align-items: center; gap: 7px; }.facebook-profile-status.is-ready { color: var(--success); }.facebook-profile-status.is-error { color: var(--error); }.facebook-loading-dot { width: 12px; height: 12px; border: 2px solid #bfdbfe; border-top-color: var(--blue); border-radius: 50%; animation: facebook-loading-spin .75s linear infinite; }.facebook-profile-status.is-ready .facebook-loading-dot, .facebook-profile-status.is-error .facebook-loading-dot { display: none; }@keyframes facebook-loading-spin { to { transform: rotate(360deg); } }
@keyframes card-ring-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .task-login-blob { animation: none; } }
.facebook-account-option { cursor: pointer; }.facebook-account-option.is-selected { background: #eef5ff; box-shadow: inset 3px 0 0 var(--blue); }.facebook-account-option input[type="radio"] { width: 16px; height: 16px; accent-color: var(--blue); }.facebook-card-entry { margin: 18px 0 8px; padding: 18px; border: 1px solid var(--border); border-radius: 12px; background: #fbfdff; }.facebook-card-entry[hidden] { display: none; }.facebook-card-entry-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }.facebook-card-entry-heading h4, .facebook-card-entry-heading p { margin: 0; }.facebook-card-entry-heading p { margin-top: 4px; font-size: .76rem; }.facebook-card-setup-status { display: inline-flex; align-items: center; gap: 7px; width: max-content; max-width: 100%; margin-top: 8px !important; padding: 6px 9px; border-radius: 8px; font-size: .72rem !important; font-weight: 800; }.facebook-card-setup-status.is-loading { color: var(--blue); background: var(--blue-soft); }.facebook-card-setup-status.is-ready { color: var(--success); background: var(--success-soft); }.facebook-card-setup-status.is-error { color: var(--error); background: var(--error-soft); }.facebook-card-setup-status.is-ready .facebook-loading-dot, .facebook-card-setup-status.is-error .facebook-loading-dot { display: none; }.card-info-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }.card-info-grid .field-span { grid-column: span 2; }
.search-select { position: relative; }.search-select-trigger { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; min-height: 46px; padding: 0 13px; color: var(--navy); background: var(--surface); border: 1px solid var(--border-strong); border-radius: 10px; font: inherit; font-size: .8rem; text-align: left; cursor: pointer; transition: border-color var(--transition), box-shadow var(--transition), background var(--transition); }.search-select-trigger:hover:not(:disabled), .search-select-trigger[aria-expanded="true"] { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(22,103,255,.10); }.search-select-trigger:disabled { color: var(--subtle); background: #f6f8fb; cursor: not-allowed; }.search-select-trigger span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.search-select-caret { flex: 0 0 auto; color: var(--navy); font-size: 1.05rem; line-height: 1; transition: transform var(--transition); }.search-select-trigger[aria-expanded="true"] .search-select-caret { transform: rotate(180deg); }.search-select-menu { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; right: 0; padding: 8px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 18px 44px rgba(23,43,77,.16); }.search-select-menu[hidden] { display: none; }.search-select-search { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 7px; margin-bottom: 7px; padding: 0 10px; min-height: 36px; color: var(--subtle); background: #f3f6fa; border-radius: 999px; }.search-select-search input { width: 100%; min-width: 0; color: var(--navy); background: transparent; border: 0; outline: 0; font: inherit; font-size: .78rem; }.search-select-options { max-height: 260px; overflow-y: auto; padding: 2px; scrollbar-width: thin; scrollbar-color: #c7d3e4 transparent; }.search-select-option { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 42px; padding: 9px 10px; color: var(--navy); background: transparent; border: 0; border-radius: 10px; font: inherit; font-size: .8rem; text-align: left; cursor: pointer; }.search-select-option:hover, .search-select-option[aria-selected="true"] { background: var(--blue-soft); }.search-select-option[aria-selected="true"] { color: var(--blue); font-weight: 800; }.search-select-option span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.search-select-option small { color: var(--muted); font-size: .66rem; font-weight: 800; }.search-select-empty { margin: 8px 6px 6px; padding: 10px; color: var(--muted); background: var(--canvas); border-radius: 10px; font-size: .76rem; text-align: center; }
.field-span-full { grid-column: 1 / -1; }.card-add-panel[hidden], .boost-method-panel[hidden] { display: none; }.card-add-panel { display: grid; gap: 14px; }.card-single-input { min-height: 50px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .02em; }.card-parse-status, .card-add-status, .boost-method-status { width: max-content; max-width: 100%; margin: 8px 0 0; padding: 6px 9px; border-radius: 8px; font-size: .72rem; font-weight: 800; }.card-parse-status.is-ready, .card-add-status.is-ready, .boost-method-status.is-ready { color: var(--success); background: var(--success-soft); }.card-parse-status.is-error, .card-add-status.is-error, .boost-method-status.is-error { color: var(--error); background: var(--error-soft); }.card-add-status.is-loading, .boost-method-status.is-loading { color: var(--blue); background: var(--blue-soft); }.card-add-actions, .boost-method-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: -2px; }.boost-method-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 2px; }.card-add-button { min-width: 118px; }.boost-method-run { min-height: 46px; white-space: normal; }.boost-method-panel { max-width: none; }.settings-form .search-select-trigger { min-height: 48px; padding-inline: 16px; border-radius: 12px; background: linear-gradient(180deg, #fff, #fbfdff); box-shadow: 0 1px 2px rgba(23,43,77,.04); }.settings-form .search-select-menu { border-radius: 16px; box-shadow: 0 24px 56px rgba(23,43,77,.18); }.settings-form .search-select-option { min-height: 46px; padding-inline: 12px; }
.facebook-accounts { margin: 18px 0 8px; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; }.facebook-accounts-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--border); }.facebook-accounts-heading h4, .facebook-accounts-heading p { margin: 0; }.facebook-accounts-heading p { margin-top: 3px; font-size: .72rem; }.facebook-accounts-heading > span { display: grid; place-items: center; min-width: 34px; height: 34px; padding: 0 9px; color: var(--blue); background: var(--blue-soft); border-radius: 10px; font-size: .78rem; font-weight: 800; }.facebook-accounts td:nth-child(3), .facebook-accounts td:nth-child(4) { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .73rem; }
.title-with-status { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }.title-with-status h2 { margin-bottom: 0; }.back-link { display: inline-block; margin-bottom: 12px; color: var(--muted); font-size: .78rem; font-weight: 600; }.action-row { display: flex; gap: 10px; }.detail-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 18px; margin-bottom: 18px; }.progress-panel { grid-column: 1 / -1; padding-bottom: 22px; }.progress-panel .progress-track, .progress-panel .latest-message { margin-inline: 24px; }.progress-panel .latest-message { margin-top: 12px; margin-bottom: 0; font-size: .78rem; }.detail-list { margin: 0; }.detail-list div { display: grid; grid-template-columns: 135px minmax(0, 1fr); gap: 14px; padding: 13px 22px; border-bottom: 1px solid var(--border); }.detail-list div:last-child { border-bottom: 0; }.detail-list dt { color: var(--muted); font-size: .75rem; }.detail-list dd { margin: 0; color: #344054; font-size: .78rem; font-weight: 600; }.log-panel { margin-top: 18px; }.live-indicator { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: .7rem; }.live-indicator i { width: 7px; height: 7px; background: var(--success); border-radius: 50%; }.activity-log { list-style: none; margin: 0; padding: 8px 24px 22px; }.activity-log li { display: grid; grid-template-columns: 12px 1fr; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--border); }.activity-log li:last-child { border-bottom: 0; }.activity-log p { margin: 0; color: #344054; font-size: .8rem; }.activity-log time { color: var(--subtle); font-size: .66rem; }.log-marker { width: 9px; height: 9px; margin-top: 6px; background: var(--blue); border-radius: 50%; box-shadow: 0 0 0 4px var(--blue-soft); }.log-error { background: var(--error); box-shadow: 0 0 0 4px var(--error-soft); }.log-warning { background: var(--warning); box-shadow: 0 0 0 4px var(--warning-soft); }.log-success { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.settings-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.setting-card { display: flex; align-items: flex-start; gap: 14px; padding: 22px; }.setting-card p { margin: 0; font-size: .8rem; }.setting-icon { flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; color: var(--blue); background: var(--blue-soft); border-radius: 11px; }
.settings-panel { max-width: 940px; margin: 0 auto; padding: 26px; }.gallery-settings-panel { margin-top: 18px; }.gallery-upload-form { margin-bottom: 18px; }.gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.gallery-card { overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: 0 10px 24px rgba(23,43,77,.06); }.gallery-card.is-default { border-color: #9fc2ff; box-shadow: 0 14px 32px rgba(8,102,255,.12); }.gallery-thumb { position: relative; aspect-ratio: 1 / 1; background: #f2f6fc; }.gallery-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }.gallery-thumb span { position: absolute; top: 10px; left: 10px; padding: 5px 8px; color: var(--success); background: var(--success-soft); border-radius: 999px; font-size: .68rem; font-weight: 800; }.gallery-card-body { padding: 12px; }.gallery-card-body strong, .gallery-card-body small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.gallery-card-body strong { color: var(--navy); font-size: .82rem; }.gallery-card-body small { margin-top: 3px; color: var(--muted); font-size: .7rem; }.gallery-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }.gallery-card-actions form { margin: 0; }.gallery-card-actions .button { min-height: 34px; padding: 8px 10px; font-size: .72rem; }.danger-button { color: var(--error); border-color: #ffc9c4; }.danger-button:hover { color: var(--error); background: var(--error-soft); border-color: #ffaaa2; }.three-columns { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.boost-method-status { overflow-wrap: anywhere; }
.dashboard-page { max-width: 1120px; margin: 0 auto; }
.dashboard-hero { display: flex; align-items: center; justify-content: space-between; gap: 22px; margin-bottom: 16px; padding: 24px 26px; background: linear-gradient(135deg, #ffffff 0%, #f7fbff 58%, #f2f8ff 100%); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow-sm); }
.dashboard-hero h2 { margin-bottom: 4px; font-size: clamp(1.65rem, 3vw, 2.15rem); }
.dashboard-hero p { margin-bottom: 0; font-size: .9rem; }
.dashboard-primary-action { flex: 0 0 auto; min-width: 178px; }
.client-stats-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.client-stat-card { display: flex; align-items: center; gap: 18px; min-height: 128px; padding: 22px 24px; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-sm); }
.client-stat-icon { flex: 0 0 auto; display: grid; place-items: center; width: 46px; height: 46px; color: var(--blue); background: var(--blue-soft); border-radius: 13px; font-size: 1.25rem; font-weight: 700; }
.client-stat-icon.account-icon { color: #6941c6; background: #f1ecff; }
.client-stat-card span { display: block; color: var(--muted); font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.client-stat-card strong { display: block; margin: 5px 0 6px; font-size: clamp(2rem, 4vw, 2.7rem); line-height: .95; }
.client-stat-card p { max-width: 320px; margin: 0; font-size: .8rem; }
.dashboard-guidance { display: flex; align-items: center; gap: 14px; padding: 17px 20px; border-radius: 14px; }.dashboard-guidance h3, .dashboard-guidance p { margin-bottom: 0; }.dashboard-guidance h3 { font-size: .98rem; }.dashboard-guidance p { margin-top: 3px; font-size: .8rem; }
.guidance-icon { flex: 0 0 auto; display: grid; place-items: center; width: 34px; height: 34px; color: var(--success); background: var(--success-soft); border-radius: 10px; font-weight: 800; }
.admin-nav-link { margin-top: 8px; color: #6941c6; background: #f8f5ff; }
.admin-tabs { display: flex; gap: 5px; margin: -4px 0 22px; padding: 5px; width: max-content; max-width: 100%; overflow-x: auto; background: #eaf0f8; border-radius: 11px; scrollbar-width: none; }
.admin-tabs::-webkit-scrollbar { display: none; }
.admin-tabs a { padding: 8px 15px; color: var(--muted); border-radius: 8px; font-size: .78rem; font-weight: 700; white-space: nowrap; }.admin-tabs a:hover, .admin-tabs a.is-active { color: var(--navy); background: var(--surface); box-shadow: 0 1px 4px rgba(23,43,77,.08); }
.admin-summary-grid { display: grid; grid-template-columns: repeat(6, minmax(125px, 1fr)); gap: 12px; margin-bottom: 20px; }
.admin-summary-card { padding: 18px; background: var(--surface); border: 1px solid var(--border); border-top: 3px solid var(--blue); border-radius: 12px; box-shadow: var(--shadow-sm); }.admin-summary-card span { display: block; color: var(--muted); font-size: .7rem; font-weight: 700; }.admin-summary-card strong { display: block; margin-top: 6px; font-size: 1.55rem; }.admin-summary-card.tone-green { border-top-color: var(--success); }.admin-summary-card.tone-purple { border-top-color: #6941c6; }.admin-summary-card.tone-amber { border-top-color: var(--warning); }.admin-summary-card.tone-red { border-top-color: var(--error); }
.admin-overview-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .5fr); gap: 18px; align-items: start; }
.recent-card-panel { margin-bottom: 18px; }
.admin-card-feed { padding: 8px 20px; }
.admin-card-feed article { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.admin-card-feed article:last-child { border-bottom: 0; }
.admin-card-feed div { min-width: 0; }
.admin-card-feed strong, .admin-card-feed small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-card-feed small { color: var(--muted); font-size: .7rem; }
.newest-telegram-users { margin-top: 18px; }
.admin-user-list { padding: 10px 20px; }.admin-user-list article { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 11px; padding: 12px 0; border-bottom: 1px solid var(--border); }.admin-user-list article:last-child { border-bottom: 0; }.admin-user-list div { min-width: 0; }.admin-user-list strong, .admin-user-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.admin-user-list small { color: var(--muted); font-size: .67rem; }
.role-chip, .read-only-chip { display: inline-flex; width: max-content; padding: 5px 9px; color: #475467; background: #f2f4f7; border-radius: 999px; font-size: .67rem; font-weight: 700; white-space: nowrap; }.role-chip.role-admin { color: #6941c6; background: #f1ecff; }.read-only-chip { color: var(--blue); background: var(--blue-soft); }
.security-banner { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 18px; padding: 16px 18px; color: #285a44; background: var(--success-soft); border: 1px solid #b9e8cf; border-radius: 12px; }.security-banner > span { flex: 0 0 auto; display: grid; place-items: center; width: 30px; height: 30px; background: rgba(22,138,85,.12); border-radius: 9px; font-weight: 800; }.security-banner p { margin: 2px 0 0; color: #46745f; font-size: .78rem; }
.masked-value { color: #475467; background: #f2f4f7; padding: 4px 7px; border-radius: 6px; font-size: .72rem; }
.pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; padding: 16px 20px; border-top: 1px solid var(--border); }.pagination > :last-child { justify-self: end; }.pagination > span { color: var(--muted); font-size: .75rem; }
.admin-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.nav-link.is-locked { opacity: .66; }.nav-link.is-locked .nav-label { display: flex; align-items: center; justify-content: space-between; width: 100%; }.nav-link.is-locked small { color: #6941c6; font-size: .58rem; text-transform: uppercase; letter-spacing: .04em; }
.button-locked { color: var(--muted); background: #eef1f5; border-color: var(--border); cursor: not-allowed; }
.subscription-strip { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 13px; margin-bottom: 16px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); }.subscription-strip p { margin: 2px 0 0; font-size: .76rem; }.subscription-strip > a { font-size: .76rem; font-weight: 700; }.subscription-active { border-color: #b9e8cf; background: #f4fbf7; }.subscription-inactive { border-color: #f0d9a8; background: #fffaf0; }.subscription-admin { border-color: #d8ccfa; background: #f8f5ff; }.subscription-icon { display: grid; place-items: center; width: 34px; height: 34px; color: var(--success); background: var(--success-soft); border-radius: 10px; font-weight: 800; }.subscription-inactive .subscription-icon { color: var(--warning); background: var(--warning-soft); }.subscription-admin .subscription-icon { color: #6941c6; background: #eee8ff; }
.plan-badge { display: inline-flex; width: max-content; padding: 5px 9px; border-radius: 999px; font-size: .67rem; font-weight: 700; white-space: nowrap; }.plan-active { color: var(--success); background: var(--success-soft); }.plan-none { color: var(--muted); background: #f2f4f7; }.plan-admin { color: #6941c6; background: #f1ecff; }
.user-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; margin-bottom: 18px; align-items: stretch; }.current-plan-body, .assign-plan-panel form { padding: 24px; }.current-plan-body { display: flex; flex-direction: column; align-items: flex-start; }.current-plan-body h3 { margin: 13px 0 4px; }.current-plan-body p { margin-bottom: 20px; }.plan-hero-icon { display: grid; place-items: center; width: 46px; height: 46px; color: var(--success); background: var(--success-soft); border-radius: 14px; font-size: 1.1rem; font-weight: 800; }.plan-hero-icon.inactive { color: var(--muted); background: #f2f4f7; }
.plan-choice-notes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-bottom: 18px; }.plan-choice-notes span { padding: 9px; color: var(--muted); background: var(--canvas); border: 1px solid var(--border); border-radius: 8px; font-size: .65rem; }.plan-choice-notes strong { display: block; color: var(--navy); font-size: .7rem; }.assign-plan-panel .form-hint { margin: 14px 0 0; }.compact-stats .client-stat-card { min-height: 0; padding: 20px 24px; }.compact-stats .client-stat-card strong { font-size: 2rem; }
@media (max-width: 1180px) { .stats-grid { grid-template-columns: repeat(3, 1fr); }.settings-grid { grid-template-columns: 1fr; }.admin-summary-grid { grid-template-columns: repeat(3, 1fr); }.admin-overview-grid { grid-template-columns: 1fr; } }
@media (max-width: 720px) { .stats-grid { grid-template-columns: repeat(2, 1fr); }.stat-card:first-child { grid-column: 1 / -1; }.dashboard-hero { flex-direction: column; align-items: stretch; padding: 22px; }.dashboard-primary-action { width: 100%; }.client-stats-grid, .admin-detail-grid, .user-plan-grid { grid-template-columns: 1fr; }.client-stat-card { min-height: 0; padding: 20px; }.subscription-strip { grid-template-columns: auto 1fr; }.subscription-strip > :last-child { grid-column: 2; }.desktop-task-table { display: none; }.mobile-task-list { display: block; }.panel-heading { padding: 18px; }.form-step { padding: 18px; }.review-grid { grid-template-columns: 1fr; }.detail-grid { grid-template-columns: 1fr; }.progress-panel { grid-column: auto; }.detail-list div { grid-template-columns: 1fr; gap: 4px; }.stepper-item strong { font-size: .65rem; }.step-actions .button { flex: 1; }.action-row, .action-row form, .action-row .button { width: 100%; }.admin-summary-grid { grid-template-columns: repeat(2, 1fr); }.admin-tabs { width: 100%; }.pagination { grid-template-columns: 1fr; text-align: center; }.pagination > * { justify-self: center !important; } }
@media (max-width: 560px) { .cookie-login-row { grid-template-columns: 1fr; }.cookie-login-button { width: 100%; }.card-info-grid { grid-template-columns: 1fr; }.card-info-grid .field-span { grid-column: auto; } }