:root {
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;
    color:#252438;
    background:#f7f8fc;
    font-size:14px;
    --primary:#6253d8;
    --muted:#7c8194;
    --border:#e9ebf2
}
* {
    box-sizing:border-box
}
body {
    margin:0
}
a {
    color:var(--primary);
    text-decoration:none
}
button,input,select {
    font:inherit
}
button,a,select {
    -webkit-tap-highlight-color:transparent
}
button {
    cursor:pointer
}
a:focus-visible,button:focus-visible,summary:focus-visible {
    outline:3px solid #b1a5f2;
    outline-offset:3px
}
h1 {
    font-size:29px;
    letter-spacing:-.7px;
    margin:0 0 10px;
    font-weight:650
}
h2 {
    font-size:16px;
    margin:0;
    font-weight:650
}
p {
    line-height:1.6
}
.muted {
    color:var(--muted)
}
.sidebar {
    width:234px;
    position:fixed;
    inset:0 auto 0 0;
    background:#fff;
    border-right:1px solid var(--border);
    padding:34px 21px;
    display:flex;
    flex-direction:column
}
.brand {
    display:flex;
    align-items:center;
    gap:11px;
    color:#141419;
    font-family:"Arial Black",Impact,Inter,sans-serif;
    font-size:29px;
    letter-spacing:-1.2px;
    font-weight:900
}
.brand-icon {
    background:#141419;
    color:white;
    width:38px;
    height:38px;
    border-radius:4px;
    display:grid;
    place-items:center;
    font-size:18px;
    letter-spacing:-1px
}
.brand-wordmark {
    white-space:nowrap;
}
.brand-suffix {
    font-size:18px;
    color:#141419;
    letter-spacing:-.5px;
    font-weight:900
}
.workspace-label {
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:1.4px;
    color:#9b9eac;
    margin:47px 12px 16px
}
nav {
    display:flex;
    flex-direction:column;
    gap:8px
}
.nav-link {
    display:flex;
    gap:14px;
    align-items:center;
    color:#777b8d;
    padding:13px 16px;
    border-radius:9px;
    font-weight:550
}
.nav-link>span {
    font-size:21px;
    width:24px
}
.nav-link.selected {
    background:#eeebfc;
    color:var(--primary)
}
.nav-link:hover {
    background:#f5f3fe
}
.sidebar-bottom {
    margin-top:auto;
    color:#7d8292;
    font-size:11px;
    padding:22px 8px 0;
    border-top:1px solid var(--border)
}
.status-dot {
    display:inline-block;
    height:6px;
    width:6px;
    border-radius:50%;
    background:#41b696;
    margin-right:7px
}
.shell {
    margin-left:234px
}
.topbar {
    min-height:88px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 38px;
    background:white;
    gap:20px
}
.breadcrumb {
    font-size:12px;
    color:#9397a7
}
.topbar-actions {
    display:flex;
    align-items:center;
    gap:14px
}
.topbar select,.topbar .select-trigger {
    border:0;
    background:transparent;
    min-height:34px;
    font-size:12px;
    color:#73798d
}
.language-switcher {
    position:relative;
    flex-shrink:0;
}
.language-icon {
    position:absolute;
    width:17px;
    height:17px;
    left:8px;
    top:50%;
    transform:translateY(-50%);
    color:#73798d;
    pointer-events:none;
    z-index:1;
}
.language-switcher .select-control {
    width:174px;
}
.language-switcher select,.language-switcher .select-trigger {
    padding-left:32px;
}
.account-menu {
    position:relative;
    flex-shrink:0;
}
.account-menu summary {
    display:flex;
    align-items:center;
    gap:10px;
    padding:4px;
    border-radius:8px;
    cursor:pointer;
    list-style:none;
}
.account-menu summary::-webkit-details-marker {
    display:none;
}
.account-menu summary:hover,.account-menu[open] summary {
    background:#f7f6fd;
}
.account-chevron {
    color:var(--muted);
}
.account-menu[open] .account-chevron {
    transform:rotate(180deg);
}
.account-dropdown {
    position:absolute;
    right:0;
    top:calc(100% + 10px);
    z-index:60;
    min-width:180px;
    padding:6px;
    background:white;
    border:1px solid var(--border);
    border-radius:10px;
    box-shadow:0 10px 28px #25243818;
}
.account-dropdown a,.account-dropdown button {
    display:block;
    width:100%;
    padding:11px 12px;
    border:0;
    border-radius:6px;
    background:transparent;
    text-align:left;
    color:inherit;
    font-size:13px;
}
.account-dropdown a:hover,.account-dropdown button:hover,.account-dropdown a[aria-current="page"] {
    background:#f0edff;
    color:var(--primary);
}
.account-dropdown form {
    margin:0;
    border-top:1px solid var(--border);
}
.avatar {
    height:34px;
    width:34px;
    border-radius:50%;
    background:#eeeafa;
    color:#6c5cbd;
    display:grid;
    place-items:center;
    font-size:15px
}
.identity {
    display:flex;
    flex-direction:column;
    gap:4px;
    font-size:12px
}
.identity small {
    font-size:10px;
    color:#9297a8
}
.text-button {
    background:none;
    border:0;
    color:#8a8fa1;
    font-size:11px;
    padding:6px
}
main {
    padding:38px;
    max-width:1800px;
    margin:auto
}
.page-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:27px
}
.page-heading p {
    margin:0
}
.page-heading .eyebrow {
    margin-bottom:12px
}
.eyebrow {
    font-size:9px;
    letter-spacing:2px;
    color:#9c9eaf;
    font-weight:650
}
.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    min-height:40px;
    padding:10px 17px;
    border:1px solid #e1e3ed;
    border-radius:7px;
    background:white;
    color:#72768b;
    font-size:12px;
    font-weight:600;
    white-space:nowrap
}
.button:hover {
    filter:brightness(.97)
}
.button.primary {
    background:var(--primary);
    color:white;
    border-color:var(--primary);
    box-shadow:0 3px 5px #6253d815
}
.button.danger {
    color:#b84b5b;
    background:#fff6f7;
    border-color:#f3dce1
}
.panel {
    background:white;
    border:1px solid var(--border);
    border-radius:12px;
    box-shadow:0 3px 7px #25243802
}
.filters {
    padding:18px 22px;
    display:flex;
    align-items:flex-end;
    gap:18px;
    margin-bottom:23px
}
.filters label {
    min-width:150px;
    flex:1
}
.filters label:first-child {
    flex:1.8
}
.filters .button {
    margin-bottom:1px
}
label {
    display:flex;
    flex-direction:column;
    gap:9px;
    font-size:11px;
    font-weight:600;
    color:#666b80
}
input,select,.select-trigger {
    width:100%;
    border:1px solid #e1e4ee;
    background:white;
    color:#41465c;
    border-radius:6px;
    min-height:40px;
    padding:9px 12px;
    outline:none;
    font-size:12px
}
input:focus,select:focus,.select-trigger:focus-visible {
    border-color:#8d7ce9;
    box-shadow:0 0 0 3px #8d7ce918
}
.select-control {
    display:block;
    position:relative;
    min-width:0;
    width:100%;
    font-weight:400;
}
.select-control.is-open {
    z-index:30;
}
.select-trigger {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    text-align:left;
    font-weight:inherit;
    line-height:20px;
}
.select-trigger::after {
    content:'';
    width:6px;
    height:6px;
    flex-shrink:0;
    border-right:1.5px solid #8b8fa4;
    border-bottom:1.5px solid #8b8fa4;
    transform:translateY(-2px) rotate(45deg);
}
.select-trigger[aria-expanded="true"] {
    border-color:#8d7ce9;
    box-shadow:0 0 0 3px #8d7ce918;
}
.select-trigger[aria-expanded="true"]::after {
    transform:translateY(2px) rotate(225deg);
}
.select-trigger:disabled {
    background:#f5f6fa;
    color:#9ca1b2;
    cursor:not-allowed;
}
.select-options {
    display:block;
    position:absolute;
    top:calc(100% + 6px);
    left:0;
    right:0;
    padding:5px;
    margin:0;
    border:1px solid #e4e1f1;
    border-radius:8px;
    background:#fff;
    box-shadow:0 10px 30px #3228541f;
    overflow-y:auto;
    overscroll-behavior:contain;
    z-index:50;
}
.select-options[hidden],.select-error[hidden] {
    display:none;
}
.opens-above .select-options {
    top:auto;
    bottom:calc(100% + 6px);
}
.select-option {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:10px 12px;
    border-radius:5px;
    font-size:12px;
    line-height:18px;
    color:#4e536b;
    cursor:pointer;
    white-space:normal;
    overflow-wrap:anywhere;
}
.select-option:hover,.select-option.is-active {
    background:#f4f2fc;
}
.select-option[aria-selected="true"] {
    color:var(--primary);
    background:#eeebfc;
    font-weight:600;
}
.select-option[aria-selected="true"]::after {
    content:'✓';
    font-size:13px;
}
.select-option[aria-disabled="true"] {
    color:#b0b4c0;
    cursor:not-allowed;
}
.select-trigger[aria-invalid="true"],input[aria-invalid="true"] {
    border-color:#ce6c7c;
}
.select-error {
    display:block;
    margin-top:7px;
    color:#b04d5b;
    font-size:11px;
}
label small {
    font-weight:400;
    font-size:11px;
    color:#9297a7;
    line-height:1.6
}
.metric-grid {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:17px;
    margin-bottom:25px
}
.metric {
    background:white;
    border:1px solid var(--border);
    border-radius:10px;
    padding:20px
}
.metric-top {
    display:flex;
    justify-content:space-between;
    gap:6px;
    align-items:center;
    font-size:11px;
    color:#808598;
    margin-bottom:18px
}
.metric-icon {
    background:#f2efff;
    color:#8879d1;
    border-radius:6px;
    display:grid;
    place-items:center;
    font-size:17px;
    width:27px;
    height:27px;
    flex-shrink:0
}
.metric strong {
    display:block;
    font-size:29px;
    letter-spacing:-1px;
    font-weight:600
}
.metric>small {
    color:#a7aaba;
    font-size:10px;
    display:block;
    margin-top:12px
}
.chart-panel {
    padding:23px 25px 15px;
    margin-bottom:25px
}
.panel-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:25px
}
.panel-heading .muted {
    font-size:11px
}
.legend {
    display:flex;
    gap:20px;
    font-size:10px;
    color:#969aaa
}
.legend span {
    display:flex;
    align-items:center;
    gap:7px
}
.legend i {
    display:inline-block;
    width:7px;
    height:7px;
    border-radius:50%
}
.legend-request {
    background:#6355db
}
.legend-open {
    background:#b2a0f5
}
.trend-chart {
    width:100%;
    max-height:300px;
    display:block
}
.trend-chart text {
    font-size:10px;
    fill:#a2a6b7
}
.chart-data {
    font-size:10px;
    color:#8d91a3;
    margin-top:10px
}
.chart-data summary {
    cursor:pointer;
    width:fit-content
}
.table-panel {
    overflow:hidden
}
.table-panel>.panel-heading {
    padding:24px 25px 0;
    margin-bottom:23px
}
.table-scroll {
    overflow-x:auto
}
table {
    width:100%;
    border-collapse:collapse;
    text-align:left;
    white-space:nowrap
}
th {
    font-size:10px;
    font-weight:550;
    color:#9599aa;
    background:#fcfcfe;
    border-top:1px solid #f2f3f8;
    border-bottom:1px solid var(--border);
    padding:15px 23px
}
td {
    padding:20px 23px;
    border-bottom:1px solid #f0f1f7;
    font-size:12px;
    color:#6f7589
}
tr:last-child td {
    border-bottom:0
}
td strong {
    color:#484c62;
    font-size:12px;
    font-weight:600
}
td small {
    display:block;
    margin-top:6px;
    font-size:10px;
    color:#a4a8b7;
    max-width:260px;
    overflow:hidden;
    text-overflow:ellipsis
}
.badge {
    font-size:10px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    border-radius:20px;
    padding:5px 10px;
    background:#f1f2f7;
    color:#9498a5
}
.badge:before {
    content:'';
    width:5px;
    height:5px;
    background:currentColor;
    border-radius:50%
}
.badge.active {
    color:#3ba27d;
    background:#ebf8f2
}
.badge.suspended {
    color:#b17c37;
    background:#fff5e7
}
.key-text {
    font-size:10px;
    display:block;
    max-width:190px;
    overflow-wrap:anywhere;
    white-space:normal;
    color:#8f88ad
}
.empty {
    text-align:center;
    padding:65px 20px;
    color:#9196a8
}
.empty strong {
    display:block;
    font-size:14px;
    color:#747a90;
    margin-top:15px
}
.empty p {
    font-size:12px
}
.empty-symbol {
    font-size:38px;
    color:#c3b9ee
}
.form-panel {
    padding:28px;
    max-width:1000px
}
.sdk-docs-content {
    min-height:420px;
}
.security-panel {
    max-width:640px;
}
.security-account {
    display:flex;
    flex-direction:column;
    gap:9px;
    margin-bottom:28px;
    padding-bottom:24px;
    border-bottom:1px solid var(--border);
    font-size:12px;
    overflow-wrap:anywhere;
}
.password-field {
    display:flex;
    flex-direction:column;
    gap:9px;
}
.password-help {
    margin:0;
    font-size:11px;
}
.form-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:25px
}
.form-grid.single {
    grid-template-columns:1fr
}
.form-footer {
    display:flex;
    justify-content:flex-end;
    gap:12px;
    grid-column:1/-1;
    border-top:1px solid var(--border);
    padding-top:24px;
    margin-top:7px
}
.full {
    grid-column:1/-1
}
.key-panel {
    margin-top:24px;
    padding:26px;
    max-width:1000px
}
.key-panel p {
    font-size:12px
}
.key-panel code {
    display:block;
    overflow-wrap:anywhere;
    background:#f7f6fc;
    padding:15px;
    margin:20px 0;
    color:#7062b5;
    font-size:12px
}
.notice,.error {
    padding:15px 20px;
    border-radius:8px;
    margin-bottom:25px;
    font-size:13px
}
.notice {
    background:#eaf8f1;
    color:#268b65;
    border:1px solid #d0efdf
}
.error {
    background:#fff0f1;
    border:1px solid #f5d6db;
    color:#b04d5b
}
.error ul {
    margin:0;
    padding-left:20px
}
.footnote {
    font-size:10px;
    color:#9dA2b4;
    margin:18px 0
}
.pagination {
    padding:18px 25px;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
    font-size:12px;
    color:#8b90a2
}
.auth-body .shell {
    margin-left:0
}
.auth-body .breadcrumb {
    visibility:hidden
}
.auth-body .topbar {
    background:transparent;
    border:0
}
.auth-card {
    max-width:425px;
    margin:45px auto;
    background:white;
    border:1px solid var(--border);
    border-radius:16px;
    padding:36px;
    box-shadow:0 15px 50px #6355db08
}
.auth-card .brand {
    margin-bottom:38px
}
.auth-card .muted {
    font-size:12px;
    margin-bottom:29px
}
.auth-card h1 {
    font-size:26px
}
.auth-link {
    display:block;
    text-align:center;
    font-size:12px;
    margin-top:25px
}
.sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0
}
@media(min-width:1600px) {
    main {
        padding:44px 50px
    }
    .metric {
        padding:25px
    }
}
@media(max-width:1200px) {
    .sidebar {
        width:195px;
        padding:30px 15px
    }
    .shell {
        margin-left:195px
    }
    main {
        padding:28px
    }
    .topbar {
        padding:18px 28px
    }
    .metric-grid {
        gap:10px
    }
    .metric {
        padding:15px
    }
    .metric-top {
        font-size:10px
    }
    .identity {
        display:none
    }
}
@media(max-width:950px) {
    .sidebar {
        position:static;
        width:100%;
        padding:18px 24px;
        flex-direction:row;
        align-items:center;
        justify-content:space-between;
        gap:20px;
        border-bottom:1px solid var(--border)
    }
    .workspace-label,.sidebar-bottom {
        display:none
    }
    .sidebar nav {
        flex-direction:row;
        gap:4px
    }
    .nav-link {
        padding:9px 12px;
        font-size:12px;
        gap:5px
    }
    .nav-link>span {
        font-size:17px;
        width:20px
    }
    .shell {
        margin-left:0
    }
    .metric-grid {
        grid-template-columns:repeat(3,1fr)
    }
    .filters {
        flex-wrap:wrap
    }
    .filters label {
        min-width:130px
    }
    .topbar {
        min-height:65px
    }
    .metric-top {
        font-size:11px
    }
}
@media(max-width:600px) {
    main {
        padding:22px 16px
    }
    .sidebar {
        padding:16px;
        flex-wrap:wrap;
        gap:18px
    }
    .sidebar nav {
        width:100%;
        justify-content:space-between
    }
    .nav-link {
        padding:9px
    }
    .nav-link>span {
        display:none
    }
    .brand {
        font-size:25px
    }
    .topbar {
        padding:10px 16px
    }
    .topbar-actions {
        gap:9px
    }
    .page-heading {
        align-items:flex-start
    }
    .page-heading .eyebrow {
        font-size:8px;
        letter-spacing:1px
    }
    h1 {
        font-size:25px
    }
    .page-heading .muted {
        font-size:12px
    }
    .button {
        padding:10px 13px
    }
    .metric-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .metric-grid .metric:last-child {
        grid-column:1/-1
    }
    .metric {
        padding:18px
    }
    .filters {
        padding:16px;
        gap:14px
    }
    .filters label:first-child {
        flex-basis:100%
    }
    .filters .button {
        width:100%
    }
    .form-grid {
        grid-template-columns:1fr
    }
    .form-panel {
        padding:22px
    }
    .chart-panel {
        padding:22px 15px
    }
    .panel-heading {
        flex-wrap:wrap;
        gap:13px
    }
    .legend {
        gap:12px
    }
    .auth-card {
        padding:28px;
        margin:15px auto
    }
    .auth-body main {
        padding-top:0
    }
    .auth-body .topbar {
        min-height:50px
    }
    .footnote {
        font-size:10px;
        line-height:1.8
    }
}