.login-page { min-height:100vh; display:grid; place-items:center; padding:18px; background:radial-gradient(circle at 18% 10%,rgba(20,93,232,.14),transparent 34%),var(--pearl); }
.login-card { width:min(420px,100%); padding:30px; border:1px solid var(--line); border-radius:20px; background:rgba(255,254,250,.96); box-shadow:0 28px 80px rgba(7,28,66,.14); }
.login-brand { display:flex; align-items:center; gap:12px; margin-bottom:28px; }
.login-brand i { width:38px; height:38px; border-radius:12px; background:var(--blue); box-shadow:inset 0 0 0 9px rgba(255,255,255,.8); }
.login-brand strong,.login-brand span { display:block; }
.login-brand strong { font-size:17px; }
.login-brand span { color:var(--muted); font-size:9px; letter-spacing:.13em; text-transform:uppercase; }
.login-card h1 { margin:0 0 7px; font-size:30px; letter-spacing:-.045em; }
.login-sub { margin:0 0 22px; color:var(--muted); font-size:12px; }
.login-card label { display:grid; gap:6px; margin-top:13px; color:var(--muted); font-size:10px; }
.login-card input,.login-card select { width:100%; min-height:44px; padding:9px 11px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#fff; outline:none; }
.login-card input:focus,.login-card select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(20,93,232,.1); }
.login-card button { width:100%; min-height:44px; margin-top:20px; border:0; border-radius:10px; color:#fff; background:var(--blue); cursor:pointer; font-weight:600; }
.login-card button:disabled { opacity:.6; cursor:wait; }
.login-error { min-height:18px; margin-top:10px; color:var(--red); font-size:11px; }
.access-topbar { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:64px; padding:0 clamp(16px,4vw,54px); border-bottom:1px solid var(--line); background:rgba(255,254,250,.94); backdrop-filter:blur(16px); }
.access-brand { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; }
.access-brand i { width:28px; height:28px; border-radius:9px; background:var(--blue); box-shadow:inset 0 0 0 7px rgba(255,255,255,.78); }
.access-brand strong { display:block; font-size:14px; }
.access-brand small { display:block; color:var(--muted); font-size:9px; text-transform:uppercase; letter-spacing:.12em; }
.access-topbar nav { display:flex; align-items:center; gap:8px; }
.access-topbar a:not(.access-brand),.access-topbar button,.access-button { min-height:36px; padding:0 13px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--white); cursor:pointer; font:500 11px Onest,sans-serif; text-decoration:none; }
.access-main { width:min(1180px,calc(100% - 28px)); margin:0 auto; padding:36px 0 72px; }
.access-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:24px; }
.access-head p { margin:0 0 8px; color:var(--blue); font-size:10px; font-weight:600; letter-spacing:.15em; text-transform:uppercase; }
.access-head h1 { margin:0; font-size:clamp(30px,4vw,50px); letter-spacing:-.055em; line-height:1; }
.access-head span { display:block; max-width:680px; margin-top:10px; color:var(--muted); font-size:12px; }
.access-button.is-primary { border-color:var(--blue); color:#fff; background:var(--blue); }
.users-card { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--white); box-shadow:var(--shadow); }
.users-table { width:100%; border-collapse:collapse; }
.users-table th,.users-table td { padding:13px 15px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
.users-table th { color:var(--muted); background:#f7f8f6; font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
.users-table tr:last-child td { border-bottom:0; }
.user-name strong { display:block; }
.role-badge { display:inline-flex; padding:4px 8px; border-radius:999px; color:var(--blue-deep); background:var(--ice); font-size:9px; font-weight:600; text-transform:uppercase; }
.role-badge.is-admin { color:#7a4b00; background:#fff0cc; }
.access-summary { max-width:480px; color:var(--muted); font-size:11px; }
.row-actions { display:flex; justify-content:flex-end; gap:6px; }
.row-actions button { padding:6px 9px; border:1px solid var(--line); border-radius:8px; background:#fff; cursor:pointer; font-size:10px; }
.row-actions button.is-danger { color:var(--red); }
.access-empty { padding:48px; color:var(--muted); text-align:center; }
.access-modal-backdrop { position:fixed; inset:0; z-index:500; display:grid; place-items:center; padding:16px; background:rgba(7,28,66,.54); }
.access-modal { width:min(620px,100%); max-height:calc(100vh - 32px); overflow:auto; padding:24px; border-radius:18px; background:var(--white); box-shadow:0 28px 80px rgba(7,28,66,.3); }
.access-modal h2 { margin:0 0 20px; font-size:24px; letter-spacing:-.035em; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.form-field { display:grid; gap:6px; color:var(--muted); font-size:10px; }
.form-field.is-wide { grid-column:1/-1; }
.form-field input,.form-field select { width:100%; min-height:40px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:#fff; outline:none; }
.form-field input:focus,.form-field select:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(20,93,232,.1); }
.permissions { display:grid; gap:7px; margin-top:18px; }
.permissions[hidden] { display:none; }
.permissions > strong { margin-bottom:2px; font-size:12px; }
.permission-full { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:2px 8px; padding:11px 12px; border:1px solid rgba(20,93,232,.28); border-radius:10px; color:var(--blue-deep); background:var(--ice); font-size:12px; font-weight:650; cursor:pointer; }
.permission-full input { grid-row:1/3; margin:0; accent-color:var(--blue); }
.permission-full small { color:var(--muted); font-size:9px; font-weight:400; }
.permission { padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fafbf9; }
.permission__head { display:flex; align-items:center; gap:8px; margin:0; color:var(--ink); font-size:12px; font-weight:600; }
.permission__head input { margin:0; accent-color:var(--blue); }
.permission__subs { display:flex; flex-wrap:wrap; gap:8px 16px; margin:8px 0 0 24px; }
.permission__subs label { display:flex; align-items:center; gap:5px; color:var(--muted); font-size:10px; }
.permission__subs input { margin:0; accent-color:var(--blue); }
.plan-access { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin:9px 0 0 24px; }
.plan-access label { padding:9px; border:1px solid var(--line); border-radius:9px; color:var(--muted); font-size:10px; cursor:pointer; }
.plan-access input { margin:0 6px 0 0; accent-color:var(--blue); }
.form-error { min-height:18px; margin-top:12px; color:var(--red); font-size:11px; }
.modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:8px; }
@media(max-width:760px){.access-head{align-items:flex-start;flex-direction:column}.users-card{overflow-x:auto}.users-table{min-width:760px}.form-grid,.plan-access{grid-template-columns:1fr}}

.api-settings { margin-bottom:30px; padding:24px; border:1px solid var(--line); border-radius:18px; background:var(--white); box-shadow:0 12px 38px rgba(18,48,91,.06); }
.api-settings__head,.users-section__head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:18px; }
.api-settings__head p,.users-section__head p,.modal-kicker { margin:0 0 5px; color:var(--blue); font-size:9px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.api-settings__head h2,.users-section__head h2 { margin:0; font-size:20px; letter-spacing:-.03em; }
.api-settings__head div > span,.users-section__head div > span { display:block; max-width:720px; margin-top:6px; color:var(--muted); font-size:11px; }
.api-settings__secure { flex:none; padding:6px 9px; border-radius:999px; color:#187448; background:#e8f7ef; font-size:9px; font-weight:600; }
.api-accounts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.api-account { display:grid; gap:15px; min-width:0; padding:18px; border:1px solid var(--line); border-radius:14px; background:#fbfcff; }
.api-account.is-warning { border-color:#e8c878; background:#fffaf0; }
.api-account.is-critical { border-color:#e8aaa3; background:#fff6f5; }
.api-account.is-missing { border-style:dashed; background:#fafafa; }
.api-account__top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.api-account__mark { display:grid; place-items:center; width:34px; height:34px; border-radius:9px; color:#fff; background:linear-gradient(135deg,#7a32ff,#ef3aa9); font-size:10px; font-weight:700; }
.api-account.is-ozon .api-account__mark { background:linear-gradient(135deg,#1266f1,#39a7ff); }
.api-status { display:flex; align-items:center; gap:6px; color:var(--muted); font-size:9px; font-weight:600; }
.api-status i { width:7px; height:7px; border-radius:50%; background:#a9b1bf; box-shadow:0 0 0 3px rgba(169,177,191,.14); }
.api-account.is-ok .api-status i { background:#25a965; box-shadow:0 0 0 3px rgba(37,169,101,.14); }
.api-account.is-warning .api-status i { background:#d69d20; box-shadow:0 0 0 3px rgba(214,157,32,.14); }
.api-account.is-critical .api-status i { background:#d64d43; box-shadow:0 0 0 3px rgba(214,77,67,.14); }
.api-account p { margin:0 0 2px; color:var(--muted); font-size:9px; }
.api-account h3 { margin:0; font-size:24px; letter-spacing:-.04em; }
.api-account dl { display:grid; gap:8px; margin:0; }
.api-account dl div { display:grid; grid-template-columns:105px 1fr; gap:12px; }
.api-account dt { color:var(--muted); font-size:9px; }
.api-account dd { min-width:0; margin:0; color:var(--ink); font-size:10px; font-weight:500; overflow-wrap:anywhere; }
.api-account > button { justify-self:start; }
.api-settings__note { margin:14px 0 0; padding-top:13px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; line-height:1.5; }
.users-section__head { margin-top:34px; }
.api-token-modal__lead,.api-token-modal__check { margin:-8px 0 18px; color:var(--muted); font-size:10px; line-height:1.55; }
.api-token-modal__check { margin:12px 0 0; }
.api-token-modal .modal-kicker { margin-bottom:6px; }
.access-button:disabled { cursor:wait; opacity:.62; }

@media(max-width:760px){
  .api-settings{padding:17px}.api-settings__head,.users-section__head{align-items:flex-start;flex-direction:column}.api-accounts{grid-template-columns:1fr}.api-settings__secure{align-self:flex-start}.api-account dl div{grid-template-columns:95px 1fr}
}