:root { color-scheme: light; --ad-blue:#1f55c5; --ad-blue-dark:#132f68; --ad-teal:#087f76; --ad-ink:#17233d; --ad-muted:#657187; --ad-line:#dbe2ec; --ad-soft:#f4f7fb; --ad-white:#fff; --ad-success:#087052; --ad-warning:#855d0a; --ad-danger:#a12e2e; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: var(--ad-soft); color: var(--ad-ink); font: 15.5px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
.ad-container { width: min(1200px, calc(100% - 36px)); margin-inline: auto; }
.ad-topbar { position: sticky; top: 0; z-index: 30; border-bottom: 1px solid var(--ad-line); background: rgba(255,255,255,.96); backdrop-filter: blur(12px); }
.ad-topbar__inner { min-height: 70px; display: flex; align-items: center; gap: 22px; }
.ad-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ad-blue-dark); text-decoration: none; }
.ad-brand img { width: 40px; height: 40px; object-fit: contain; }
.ad-brand span { display: grid; line-height: 1.12; }
.ad-brand small { color: var(--ad-muted); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.ad-nav { display: flex; align-items: center; gap: 4px; margin-left: 22px; }
.ad-nav a { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border-radius: 10px; color: #46536a; font-weight: 720; text-decoration: none; }
.ad-nav a:hover, .ad-nav a[aria-current="page"] { background: #eaf1ff; color: var(--ad-blue); }
.ad-account { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.ad-account__name { display: grid; line-height: 1.2; text-align: right; }
.ad-account__name small { color: var(--ad-muted); }
.ad-icon-button { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--ad-line); border-radius: 10px; background: #fff; color: var(--ad-blue-dark); cursor: pointer; }
.ad-main { padding: 40px 0 72px; }
.ad-page-head { display: flex; justify-content: space-between; gap: 28px; align-items: end; margin-bottom: 28px; }
.ad-page-head__title { max-width: 780px; }
.ad-page-head h1 { margin: 6px 0 6px; font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.04em; line-height: 1.08; }
.ad-page-head p { margin: 0; color: var(--ad-muted); }
.ad-eyebrow { color: var(--ad-teal); font-size: .76rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.ad-button { min-height: 43px; display: inline-flex; justify-content: center; align-items: center; gap: 7px; padding: 9px 15px; border: 1px solid var(--ad-blue); border-radius: 10px; background: var(--ad-blue); color: #fff; font-weight: 780; text-decoration: none; cursor: pointer; }
.ad-button:hover { background: var(--ad-blue-dark); border-color: var(--ad-blue-dark); }
.ad-button--secondary { background: #fff; border-color: #bbc7d7; color: var(--ad-blue-dark); }
.ad-button--danger { background: #fff; border-color: #e0b7b7; color: var(--ad-danger); }
.ad-button--small { min-height: 36px; padding: 7px 11px; font-size: .88rem; }
.ad-button--wide { width: 100%; }
.ad-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ad-metric { position: relative; overflow: hidden; padding: 22px; border: 1px solid var(--ad-line); border-radius: 18px; background: #fff; text-decoration: none; }
.ad-metric::after { content: ""; position: absolute; width: 72px; height: 72px; right: -20px; bottom: -28px; border-radius: 50%; background: #eaf1ff; }
.ad-metric__top { display: flex; justify-content: space-between; gap: 12px; color: var(--ad-muted); }
.ad-metric__icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #edf3ff; color: var(--ad-blue); }
.ad-metric strong { display: block; margin-top: 10px; color: var(--ad-blue-dark); font-size: 2.25rem; line-height: 1; }
a.ad-metric:hover { border-color: #9db4d8; box-shadow: 0 12px 30px rgba(23,35,61,.08); }
.ad-dashboard { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; margin-top: 20px; }
.ad-card { padding: 24px; border: 1px solid var(--ad-line); border-radius: 18px; background: #fff; box-shadow: 0 8px 26px rgba(23,35,61,.04); }
.ad-card__head { display: flex; justify-content: space-between; align-items: start; gap: 18px; margin-bottom: 18px; }
.ad-card__head h2, .ad-card h2 { margin: 0; font-size: 1.25rem; }
.ad-card__head p { margin: 4px 0 0; color: var(--ad-muted); }
.ad-list { display: grid; }
.ad-list-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 15px 0; border-top: 1px solid #e9edf3; text-decoration: none; }
.ad-list-row:first-child { border-top: 0; padding-top: 0; }
.ad-list-row:last-child { padding-bottom: 0; }
a.ad-list-row:hover strong { color: var(--ad-blue); }
.ad-list-row span, .ad-muted { color: var(--ad-muted); }
.ad-empty { padding: 34px 18px; color: var(--ad-muted); text-align: center; }
.ad-badge { display: inline-flex; align-items: center; gap: 5px; width: fit-content; padding: 5px 9px; border-radius: 999px; background: #e8f7f1; color: var(--ad-success); font-size: .78rem; font-weight: 850; }
.ad-badge--warning { background: #fff4dd; color: var(--ad-warning); }
.ad-badge--danger { background: #fff0f0; color: var(--ad-danger); }
.ad-badge--info { background: #eaf1ff; color: var(--ad-blue); }
.ad-toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; padding: 14px; border: 1px solid var(--ad-line); border-radius: 15px; background: #fff; }
.ad-search { min-width: 260px; flex: 1; position: relative; }
.ad-search i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--ad-muted); }
.ad-search input { width: 100%; min-height: 43px; padding: 9px 12px 9px 39px; border: 1px solid #bcc7d6; border-radius: 10px; }
.ad-toolbar select { min-height: 43px; padding: 8px 36px 8px 11px; border: 1px solid #bcc7d6; border-radius: 10px; background: #fff; }
.ad-tenant-list { display: grid; gap: 13px; }
.ad-tenant { display: grid; grid-template-columns: minmax(230px, 1.7fr) minmax(200px, 1.2fr) 160px auto; gap: 18px; align-items: center; padding: 20px; border: 1px solid var(--ad-line); border-radius: 16px; background: #fff; }
.ad-tenant__name strong { display: block; font-size: 1.05rem; }
.ad-tenant small { color: var(--ad-muted); }
.ad-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.ad-detail-grid--wide { grid-template-columns: 1.25fr .75fr; }
.ad-definition { display: grid; grid-template-columns: 175px 1fr; gap: 11px 18px; margin: 0; }
.ad-definition dt { color: var(--ad-muted); }
.ad-definition dd { margin: 0; font-weight: 650; overflow-wrap: anywhere; }
.ad-section { margin-top: 22px; }
.ad-section__title { margin: 0 0 14px; font-size: 1.25rem; }
.ad-form { display: grid; gap: 20px; }
.ad-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ad-field { display: grid; gap: 6px; }
.ad-field--wide { grid-column: 1 / -1; }
.ad-field label { font-weight: 750; }
.ad-field input, .ad-field select, .ad-field textarea { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #bcc7d6; border-radius: 10px; background: #fff; color: var(--ad-ink); }
.ad-field textarea { min-height: 145px; resize: vertical; }
.ad-field input:focus, .ad-field select:focus, .ad-field textarea:focus { outline: 3px solid rgba(31,85,197,.14); border-color: var(--ad-blue); }
.ad-field small { color: var(--ad-muted); }
.ad-switch { display: flex; align-items: flex-start; gap: 11px; padding: 13px; border: 1px solid var(--ad-line); border-radius: 11px; background: var(--ad-soft); }
.ad-switch input { width: 20px; height: 20px; margin-top: 2px; }
.ad-switch span { display: grid; }
.ad-switch small { color: var(--ad-muted); }
.ad-alert { margin-bottom: 20px; padding: 13px 15px; border: 1px solid; border-radius: 11px; }
.ad-alert--success { border-color: #b9e1d3; background: #eaf8f2; color: var(--ad-success); }
.ad-alert--error { border-color: #ecc1c1; background: #fff0f0; color: var(--ad-danger); }
.ad-alert--warning { border-color: #ecd6a8; background: #fff7e8; color: var(--ad-warning); }
.ad-errors { margin: 0; padding-left: 20px; }
.ad-credential { background: linear-gradient(135deg, var(--ad-blue-dark), #155d83); color: #fff; }
.ad-credential p { color: #dbe8f5; }
.ad-copy { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 12px; }
.ad-copy input { min-width: 0; padding: 10px 12px; border: 1px solid rgba(255,255,255,.45); border-radius: 9px; background: rgba(255,255,255,.12); color: #fff; font: 700 .94rem ui-monospace, Consolas, monospace; }
.ad-admin-row { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 16px; padding: 14px 0; border-top: 1px solid #e8edf3; }
.ad-admin-row:first-of-type { border-top: 0; }
.ad-lead { display: grid; grid-template-columns: minmax(220px, 1.4fr) minmax(190px, 1fr) 150px 150px auto; gap: 16px; align-items: center; padding: 18px 20px; border: 1px solid var(--ad-line); border-radius: 15px; background: #fff; }
.ad-lead + .ad-lead { margin-top: 11px; }
.ad-lead strong { display: block; }
.ad-lead a { color: var(--ad-blue); font-weight: 780; }
.ad-status-note { padding: 14px; border-left: 4px solid var(--ad-teal); border-radius: 0 10px 10px 0; background: #eff8f6; color: #285d58; }
.ad-auth { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, .82fr) minmax(520px, 1.18fr); background: #fff; }
.ad-auth__form { display: grid; place-items: center; padding: 45px; }
.ad-auth__card { width: min(440px, 100%); }
.ad-auth__back { width: fit-content; min-height: 46px; display: inline-flex; gap: 10px; align-items: center; padding: 6px 13px 6px 7px; border: 1px solid var(--ad-line); border-radius: 13px; background: #fff; color: var(--ad-muted); text-decoration: none; box-shadow: 0 7px 20px rgba(23,35,61,.05); transition: border-color .18s, color .18s, transform .18s, box-shadow .18s; }
.ad-auth__back:hover { transform: translateX(-2px); border-color: #9eb3d4; color: var(--ad-blue-dark); box-shadow: 0 9px 24px rgba(23,35,61,.09); }
.ad-auth__back-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: #eaf1ff; color: var(--ad-blue); font-size: 1rem; }
.ad-auth__back > span:last-child { display: grid; line-height: 1.1; }
.ad-auth__back small { color: var(--ad-muted); font-size: .66rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.ad-auth__back strong { margin-top: 3px; color: inherit; font-size: .9rem; }
.ad-auth__brand { display: flex; width: fit-content; margin: 30px 0 28px; gap: 14px; }
.ad-auth__brand-mark { width: 64px; height: 64px; display: grid !important; place-items: center; flex: 0 0 auto; border-radius: 18px; background: linear-gradient(145deg, #edf4ff, #e6f7f4); box-shadow: inset 0 0 0 1px #d3e0ef; }
.ad-auth__brand-mark img { width: 52px; height: 52px; }
.ad-auth__brand > span:last-child { align-content: center; }
.ad-auth__brand strong { color: var(--ad-blue-dark); font-size: 1.55rem; letter-spacing: -.025em; }
.ad-auth__brand small { margin-top: 3px; color: var(--ad-teal); font-size: .68rem; }
.ad-auth__card h1 { margin: 0 0 8px; font-size: 2.25rem; letter-spacing: -.04em; }
.ad-auth__card > p { margin: 0; color: var(--ad-muted); }
.ad-auth__card form { display: grid; gap: 17px; margin-top: 27px; }
.ad-auth__visual { position: relative; overflow: hidden; display: grid; place-items: center; padding: 60px; background: linear-gradient(145deg, var(--ad-blue-dark), #135484 60%, var(--ad-teal)); color: #fff; }
.ad-auth__visual::before, .ad-auth__visual::after { content:""; position:absolute; border: 80px solid rgba(255,255,255,.05); border-radius:50%; }
.ad-auth__visual::before { width: 440px; height: 440px; right: -200px; top: -190px; }
.ad-auth__visual::after { width: 350px; height: 350px; left: -180px; bottom: -190px; }
.ad-auth__message { position: relative; max-width: 590px; }
.ad-auth__visual-brand { display: inline-flex; align-items: center; gap: 14px; }
.ad-auth__visual-brand img { width: 64px; height: 64px; object-fit: contain; filter: brightness(0) invert(1); opacity: .96; }
.ad-auth__visual-brand span { display: grid; line-height: 1.12; }
.ad-auth__visual-brand strong { font-size: 1.55rem; }
.ad-auth__visual-brand small { margin-top: 4px; color: #c8ddec; font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.ad-auth__message h2 { margin: 35px 0 14px; font-size: clamp(2.2rem, 5vw, 4rem); letter-spacing: -.045em; line-height: 1.05; }
.ad-auth__message p { color: #dae7f5; font-size: 1.08rem; }
.ad-auth__points { display: grid; gap: 12px; margin-top: 30px; }
.ad-auth__points span { display: flex; gap: 10px; align-items: center; }
.ad-input-wrap { display: flex; }
.ad-input-wrap input { min-width: 0; flex: 1; border-radius: 10px 0 0 10px; }
.ad-input-wrap button { width: 48px; border: 1px solid #bcc7d6; border-left: 0; border-radius: 0 10px 10px 0; background: #fff; color: var(--ad-blue-dark); cursor: pointer; }
.ad-strength { color: var(--ad-muted); font-size: .85rem; }
.ad-strength[data-level="3"], .ad-strength[data-level="4"] { color: var(--ad-warning); }
.ad-strength[data-level="5"] { color: var(--ad-success); font-weight: 750; }
@media (max-width: 1020px) {
    .ad-nav { margin-left: 0; }
    .ad-nav a span { display: none; }
    .ad-metrics { grid-template-columns: repeat(2, 1fr); }
    .ad-tenant { grid-template-columns: 1.4fr 1fr auto; }
    .ad-tenant > div:nth-child(3) { display: none; }
    .ad-lead { grid-template-columns: 1.3fr 1fr 130px auto; }
    .ad-lead > div:nth-child(4) { display: none; }
}
@media (max-width: 780px) {
    .ad-account__name { display: none; }
    .ad-dashboard, .ad-detail-grid, .ad-detail-grid--wide { grid-template-columns: 1fr; }
    .ad-page-head { align-items: start; flex-direction: column; }
    .ad-auth { grid-template-columns: 1fr; }
    .ad-auth__visual { display: none; }
    .ad-auth__form { padding: 36px 22px; }
    .ad-tenant, .ad-lead { grid-template-columns: 1fr; }
    .ad-tenant > div:nth-child(3), .ad-lead > div:nth-child(4) { display: block; }
    .ad-admin-row { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .ad-container { width: min(100% - 24px, 1200px); }
    .ad-brand small, .ad-nav a:nth-child(3) { display: none; }
    .ad-nav { margin-left: auto; }
    .ad-account { margin-left: 0; }
    .ad-metrics, .ad-fields { grid-template-columns: 1fr; }
    .ad-field--wide { grid-column: auto; }
    .ad-definition { grid-template-columns: 1fr; gap: 3px; }
    .ad-definition dd { margin-bottom: 9px; }
    .ad-card { padding: 20px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }