:root {
    --navy:#10243a;
    --cyan:#087f98;
    --cyan-bright:#18b9d4;
    --ink:#14263e;
    --muted:#62738a;
    --border:#e2e9f1;
    --canvas:#f5f7fb;
    --radius:12px
}
* {
    box-sizing:border-box
}
body {
    margin:0;
    color:var(--ink);
    font-family:Inter,"Segoe UI",Arial,sans-serif;
    font-size:14px;
    line-height:1.6;
    background:var(--canvas);
    -webkit-font-smoothing:antialiased
}
a {
    color:var(--cyan);
    transition:background .15s,color .15s
}
a:hover,a:focus {
    color:#056075;
    text-decoration:none
}
button,input,select,textarea {
    font:inherit
}
button {
    cursor:pointer
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
    outline:3px solid #18b9d4;
    outline-offset:3px
}
h1,h2,h3,h4 {
    color:var(--ink);
    font-weight:650;
    letter-spacing:-.035em
}
h1 {
    font-size:30px;
    line-height:1.2
}
h2 {
    font-size:18px
}
h3 {
    font-size:27px
}
p {
    margin:0 0 12px
}
.text-muted,.help-block {
    color:var(--muted)
}
.skip-link {
    position:fixed;
    top:-100px;
    left:16px;
    z-index:3000;
    background:white;
    padding:12px;
    border-radius:8px
}
.skip-link:focus {
    top:12px
}
.app-sidebar {
    width:244px;
    position:fixed;
    inset:0 auto 0 0;
    background:var(--navy);
    color:#c8d6e5;
    display:flex;
    flex-direction:column;
    z-index:1040;
    overflow-y:auto
}
.app-brand {
    display:flex;
    gap:13px;
    align-items:center;
    padding:31px 23px 35px;
    color:white
}
.app-brand:hover,.app-brand:focus {
    color:white
}
.brand-mark {
    color:var(--cyan-bright);
    flex-shrink:0
}
.app-brand strong {
    font-size:23px;
    font-weight:700;
    letter-spacing:-.6px;
    white-space:nowrap
}
.app-brand small {
    display:block;
    font-size:12px;
    color:#b7c9db;
    letter-spacing:.2px
}
.sidebar-nav {
    padding:0 13px;
    flex:1
}
.nav-heading {
    display:block;
    text-transform:uppercase;
    font-size:10px;
    letter-spacing:1.8px;
    font-weight:650;
    color:#a4b9d0;
    margin:0 14px 13px
}
.nav-heading-secondary {
    margin-top:28px;
    padding-top:25px;
    border-top:1px solid #ffffff16
}
.sidebar-link {
    display:flex;
    align-items:center;
    gap:14px;
    color:#ccd8e6;
    padding:12px 15px;
    margin-bottom:5px;
    border-radius:7px;
    position:relative;
    font-size:13px;
    min-height:45px
}
.sidebar-link .fa {
    width:20px;
    text-align:center;
    font-size:17px
}
.sidebar-link:hover,.sidebar-link:focus {
    background:#ffffff0b;
    color:white
}
.sidebar-link.is-active {
    color:white;
    background:#12485f
}
.sidebar-link.is-active:before {
    content:"";
    position:absolute;
    left:-13px;
    top:8px;
    bottom:8px;
    background:var(--cyan-bright);
    width:4px;
    border-radius:0 4px 4px 0
}
.sidebar-account {
    display:flex;
    align-items:center;
    gap:10px;
    padding:20px 17px;
    border-top:1px solid #ffffff16;
    margin-top:30px
}
.user-avatar {
    width:36px;
    height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#dce7f3;
    color:#24405c;
    font-size:13px;
    font-weight:700;
    flex-shrink:0
}
.account-name {
    min-width:0;
    flex:1
}
.account-name strong {
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
    color:#f0f6fc
}
.account-name small {
    font-size:11px;
    color:#a4b9d0
}
.sidebar-account form {
    margin:0
}
.sidebar-logout {
    background:transparent;
    color:#b7c9db;
    border:0;
    padding:9px;
    font-size:18px
}
.sidebar-logout:hover {
    color:white
}
.app-workspace {
    margin-left:244px;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    min-width:0
}
.app-topbar {
    height:76px;
    border-bottom:1px solid var(--border);
    background:#fff;
    display:flex;
    align-items:center;
    gap:16px;
    padding:0 32px
}
.global-search {
    display:flex;
    align-items:center;
    gap:12px;
    border:1px solid var(--border);
    border-radius:8px;
    max-width:560px;
    width:100%;
    padding:0 14px;
    height:41px;
    color:var(--muted);
    margin:0
}
.global-search input {
    border:0;
    background:transparent;
    min-width:0;
    flex:1;
    font-size:12px;
    outline:none
}
.global-search:focus-within {
    border-color:var(--cyan)
}
.global-search button {
    border:0;
    background:transparent;
    color:var(--muted);
    padding:5px
}
.topbar-account {
    margin-left:auto;
    display:flex;
    gap:18px;
    align-items:center
}
.workspace-label {
    font-size:11px;
    color:var(--muted);
    white-space:nowrap
}
.icon-button {
    background:white;
    border:1px solid var(--border);
    border-radius:7px;
    width:38px;
    height:38px;
    color:var(--ink);
    flex-shrink:0
}
.menu-toggle {
    display:none
}
.sidebar-backdrop {
    position:fixed;
    inset:0;
    background:#10243a66;
    z-index:1035;
    border:0
}
.sidebar-backdrop[hidden] {
    display:none
}
.app-content {
    padding:32px;
    flex:1;
    min-width:0;
    outline:none
}
.app-footer {
    padding:18px 32px;
    display:flex;
    justify-content:space-between;
    gap:12px;
    color:var(--muted);
    font-size:10px
}
.footer-dot {
    margin:0 7px;
    color:#9badbe
}
.page-title {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-bottom:25px;
    min-height:48px
}
.page-title h1,.page-title h3 {
    margin:0 0 7px
}
.page-title p {
    margin:0;
    color:var(--muted);
    font-size:13px
}
.page-title .btn {
    margin:0
}
.page-title .title_left,.page-title .title_right {
    float:none;
    width:auto
}
.page-title .title_right {
    margin-left:auto
}
.page-eyebrow {
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:1.7px;
    color:var(--cyan);
    font-weight:700;
    display:block;
    margin-bottom:8px
}
.page-actions {
    display:flex;
    align-items:center;
    gap:12px;
    flex-shrink:0
}
.date-chip {
    border:1px solid var(--border);
    background:#fff;
    display:flex;
    align-items:center;
    gap:9px;
    border-radius:7px;
    padding:9px 13px;
    color:var(--muted);
    font-size:12px
}
.x_panel,.surface {
    background:#fff;
    border:1px solid var(--border);
    border-radius:var(--radius);
    margin-bottom:24px;
    box-shadow:0 2px 6px #10243a02;
    min-width:0
}
.x_title,.surface-heading {
    padding:20px 23px;
    border-bottom:1px solid var(--border);
    display:flex;
    align-items:center;
    gap:16px;
    justify-content:space-between
}
.x_title h2,.surface-heading h2 {
    font-size:16px;
    margin:0;
    letter-spacing:-.3px
}
.x_title>.clearfix {
    display:none
}
.x_content {
    padding:23px
}
.surface-heading p {
    font-size:12px;
    color:var(--muted);
    margin:5px 0 0
}
.surface-heading>a {
    font-size:12px;
    white-space:nowrap
}
.surface-body {
    padding:23px
}
.x_content>form:not(.form-inline) {
    max-width:100%
}
.form-group {
    margin-bottom:20px
}
label {
    font-size:12px;
    color:#3d5068;
    font-weight:600;
    margin-bottom:7px
}
.form-control {
    height:42px;
    border:1px solid #d7e1ec;
    border-radius:7px;
    box-shadow:none;
    font-size:13px;
    color:var(--ink);
    padding:10px 12px;
    background:#fff
}
.form-control:focus {
    border-color:var(--cyan);
    box-shadow:0 0 0 3px #0891b210
}
select.form-control {
    padding:8px 11px
}
select[multiple].form-control {
    height:130px
}
textarea.form-control {
    height:auto;
    min-height:90px
}
.help-block {
    font-size:11px;
    margin-top:7px
}
.checkbox label {
    font-weight:400;
    font-size:12px
}
.checkbox input,input[type=checkbox] {
    accent-color:var(--cyan)
}
.form-inline {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
    background:#f8fafc;
    border:1px solid #edf1f6;
    padding:14px;
    border-radius:9px
}
.form-inline .form-group {
    margin:0
}
.form-inline .btn {
    margin:0
}
.form-inline .checkbox {
    margin:0
}
.form-inline input[type=text] {
    min-width:245px
}
.form-inline label {
    margin:0
}
.form-horizontal .control-label {
    padding-top:11px
}
.form-section {
    padding-bottom:22px;
    margin-bottom:22px;
    border-bottom:1px solid var(--border)
}
.form-section h3 {
    font-size:15px;
    letter-spacing:-.2px;
    margin:0 0 19px;
    display:flex;
    align-items:center;
    gap:9px
}
.section-number {
    width:24px;
    height:24px;
    background:#e6f6fa;
    color:var(--cyan);
    border-radius:50%;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:12px
}
.form-actions {
    display:flex;
    align-items:center;
    gap:8px;
    padding-top:10px
}
.form-actions .btn {
    margin:0
}
.form-note {
    padding:14px 17px;
    border:1px solid #d9edf5;
    background:#f0f9fc;
    border-radius:8px;
    font-size:12px;
    color:#386278;
    margin-bottom:20px
}
.form-note .fa {
    margin-right:6px
}
.form-section:last-of-type {
    border-bottom:0;
    padding-bottom:0
}
.form-aside {
    padding:23px
}
.form-aside h3 {
    font-size:17px;
    margin:0 0 13px
}
.form-aside p {
    color:var(--muted);
    font-size:12px
}
.form-aside ul {
    padding-left:18px;
    font-size:12px;
    color:var(--muted)
}
.form-aside li {
    margin:12px 0
}
.btn {
    border-radius:7px;
    padding:10px 16px;
    font-size:12px;
    line-height:1.45;
    font-weight:600;
    box-shadow:none;
    transition:background .15s,border-color .15s;
    margin-right:3px;
    white-space:normal
}
.btn .fa {
    margin-right:6px
}
.btn-primary {
    background:var(--cyan);
    border-color:var(--cyan)
}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active {
    background:#06677c;
    border-color:#06677c
}
.btn-default {
    border-color:#d7e1ec;
    color:#42566e;
    background:#fff
}
.btn-default:hover {
    background:#f0f5f9;
    border-color:#c5d2e0
}
.btn-info {
    background:#edf7fb;
    border-color:#dceef5;
    color:#076b86
}
.btn-info:hover {
    background:#d9eef5;
    border-color:#b5dbe8;
    color:#075369
}
.btn-danger {
    background:#fff1f2;
    color:#b33445;
    border-color:#f3d5da
}
.btn-danger:hover {
    background:#fce1e5;
    color:#952436;
    border-color:#eeb9c2
}
.btn-success {
    background:#eaf8f1;
    border-color:#d0eedd;
    color:#16784b
}
.btn-warning {
    background:#fff7e6;
    border-color:#f6e2b9;
    color:#8c620e
}
.btn-xs {
    font-size:11px;
    padding:6px 9px;
    border-radius:5px
}
.btn-link {
    color:var(--cyan)
}
.btn:disabled {
    opacity:.55
}
.actions-col {
    width:1%;
    white-space:nowrap
}
.actions-wrap {
    display:flex;
    align-items:center;
    gap:5px
}
.actions-wrap form {
    margin:0
}
.actions-col .btn {
    white-space:nowrap
}
.actions-wrap .btn {
    margin:0;
    white-space:nowrap
}
.table-responsive {
    border:0;
    margin-bottom:0
}
.table {
    font-size:12px;
    margin-bottom:0
}
.table>thead>tr>th {
    background:#f7f9fc;
    border-bottom:1px solid var(--border);
    color:#62738a;
    font-weight:600;
    padding:13px 15px;
    white-space:nowrap;
    font-size:11px
}
.table>tbody>tr>td {
    vertical-align:middle;
    padding:16px 15px;
    border-top:1px solid #edf1f6;
    color:#34465e
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background:#fff
}
.table>tbody>tr:hover {
    background:#fbfdff
}
.table td:first-child {
    font-weight:600;
    color:var(--ink)
}
.table td small {
    display:block;
    font-weight:400;
    font-size:10px;
    color:var(--muted);
    margin-top:3px
}
.status-pill {
    display:inline-flex;
    align-items:center;
    gap:6px;
    border-radius:6px;
    padding:4px 8px;
    font-weight:500;
    font-size:10px;
    white-space:nowrap;
    line-height:1.5
}
.status-dot {
    height:6px;
    width:6px;
    border-radius:50%;
    background:currentColor
}
.status-success {
    background:#e9f8f0;
    color:#13774c
}
.status-warning {
    background:#fff3da;
    color:#94600b
}
.status-danger {
    background:#ffecef;
    color:#b53349
}
.status-info {
    background:#e9f6fb;
    color:#08718b
}
.status-neutral {
    background:#eef1f5;
    color:#66758a
}
.empty-state {
    text-align:center;
    padding:42px 20px;
    color:var(--muted);
    font-size:12px
}
.empty-state .fa {
    display:block;
    font-size:27px;
    color:#a5b9c9;
    margin-bottom:14px
}
.empty-state strong {
    display:block;
    color:var(--ink);
    margin-bottom:6px;
    font-size:14px
}
.table>tbody>tr>td.empty-state {
    padding:40px;
    text-align:center;
    font-weight:400;
    color:var(--muted)
}
.pagination {
    margin:20px 0 0;
    display:flex;
    flex-wrap:wrap;
    gap:5px
}
.pagination>li>a,.pagination>li>span {
    border-radius:6px!important;
    border:1px solid var(--border);
    color:var(--muted);
    font-size:12px;
    padding:6px 11px
}
.pagination>.active>span {
    background:var(--cyan);
    border-color:var(--cyan)
}
.alert {
    border-radius:9px;
    padding:14px 17px;
    font-size:12px
}
.alert ul {
    margin:8px 0 0;
    padding-left:20px
}
.alert-success {
    background:#eaf8f1;
    border-color:#d6eddf;
    color:#216b48
}
.alert-danger {
    background:#fff0f2;
    border-color:#f4d7dd;
    color:#a13246
}
.alert-info {
    background:#edf8fc;
    border-color:#d8edf5;
    color:#28657b
}
.well {
    background:#f7fafd;
    border:1px solid var(--border);
    border-radius:9px;
    box-shadow:none
}
.panel {
    border-radius:9px;
    box-shadow:none;
    border-color:var(--border)
}
.panel-default>.panel-heading {
    background:#f7f9fc;
    border-color:var(--border);
    font-size:12px
}
.label {
    padding:5px 9px;
    border-radius:5px;
    font-weight:500
}
.modal-content {
    border:0;
    border-radius:13px;
    box-shadow:0 20px 70px #10243a33
}
.modal-header,.modal-footer {
    padding:20px;
    border-color:var(--border)
}
.modal-title {
    font-size:17px
}
.modal-body {
    padding:23px;
    font-size:13px
}
.modal-body p {
    margin:0
}
.metric-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin-bottom:24px
}
.metric-card {
    padding:22px 20px;
    background:white;
    border:1px solid var(--border);
    border-radius:var(--radius);
    display:flex;
    align-items:flex-start;
    gap:14px;
    color:var(--ink)
}
.metric-card:hover {
    border-color:#b9d7e4;
    color:var(--ink)
}
.metric-icon {
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e3f6fb;
    color:var(--cyan);
    font-size:20px;
    flex-shrink:0
}
.metric-icon.amber {
    background:#fff3dd;
    color:#b77b17
}
.metric-icon.green {
    background:#e9f8f1;
    color:#16825a
}
.metric-label {
    font-size:11px;
    font-weight:600;
    color:#53657d;
    display:block
}
.metric-value {
    font-size:25px;
    font-weight:700;
    line-height:1.5;
    letter-spacing:-1px;
    display:block;
    white-space:nowrap;
    font-variant-numeric:tabular-nums
}
.metric-note {
    display:block;
    font-size:10px;
    color:var(--muted);
    margin-top:4px
}
.dashboard-grid {
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(290px,1fr);
    gap:22px
}
.dashboard-grid>.surface {
    margin-bottom:22px
}
.chart-legend {
    display:flex;
    align-items:center;
    gap:13px;
    font-size:10px;
    color:var(--muted)
}
.legend-dot {
    display:inline-block;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--cyan);
    margin-right:5px
}
.legend-dot.light {
    background:#91c9db
}
.revenue-chart {
    width:100%;
    height:auto;
    display:block
}
.chart-caption {
    font-size:10px;
    color:var(--muted);
    margin:10px 0 0
}
.attention-list {
    padding:6px 18px 18px
}
.attention-link {
    display:flex;
    align-items:center;
    gap:13px;
    padding:15px 10px;
    border-bottom:1px solid #edf1f6;
    color:var(--ink)
}
.attention-link:last-child {
    border-bottom:0
}
.attention-link:hover {
    background:#f8fbfd;
    border-radius:8px;
    color:var(--ink)
}
.attention-icon {
    height:35px;
    width:35px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:9px;
    background:#fff3df;
    color:#a96d12;
    flex-shrink:0
}
.attention-icon.red {
    background:#ffedf0;
    color:#c03c52
}
.attention-icon.blue {
    background:#e7f7fc;
    color:var(--cyan)
}
.attention-link strong {
    font-size:12px;
    display:block
}
.attention-link small {
    font-size:10px;
    color:var(--muted)
}
.attention-link>.fa-angle-right {
    margin-left:auto;
    color:#8fa0b2
}
.count-chip {
    font-size:11px;
    padding:3px 8px;
    border-radius:6px;
    background:#fff3df;
    color:#986711
}
.client-identity {
    display:flex;
    gap:10px;
    align-items:center
}
.client-avatar {
    width:33px;
    height:33px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#edf4fb;
    border-radius:9px;
    color:#3f7199;
    font-size:12px;
    font-weight:650;
    flex-shrink:0
}
.quick-links {
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:6px
}
.quick-link {
    display:flex;
    gap:10px;
    align-items:center;
    padding:13px 17px;
    background:white;
    border:1px solid var(--border);
    border-radius:8px;
    font-size:12px
}
.quick-link .fa {
    color:var(--cyan)
}
.login-page {
    min-height:100vh;
    display:grid;
    grid-template-columns:1.05fr 1fr;
    background:white
}
.login-story {
    background:var(--navy);
    padding:45px 65px;
    display:flex;
    flex-direction:column;
    color:#c3d3e4;
    position:relative;
    overflow:hidden
}
.login-story .app-brand {
    padding:0;
    align-self:flex-start
}
.login-story:after {
    content:"";
    width:470px;
    height:470px;
    border:1px solid #ffffff0c;
    border-radius:50%;
    position:absolute;
    bottom:-230px;
    right:-170px;
    box-shadow:0 0 0 65px #ffffff03,0 0 0 130px #ffffff02;
    pointer-events:none
}
.login-pitch {
    margin:auto 0;
    max-width:400px;
    padding:70px 0
}
.login-pitch .page-eyebrow {
    color:#63d4e5
}
.login-pitch h1 {
    color:white;
    font-size:42px;
    line-height:1.22;
    margin:17px 0 23px
}
.login-pitch p {
    color:#b0c4d8;
    font-size:15px;
    line-height:1.9
}
.login-story-footer {
    font-size:11px;
    color:#8da7bf
}
.login-main {
    display:flex;
    align-items:center;
    justify-content:center;
    padding:45px
}
.login-card {
    width:100%;
    max-width:365px
}
.login-card .page-eyebrow {
    margin-bottom:18px
}
.login-card h1 {
    font-size:29px;
    margin:0 0 12px
}
.login-card>p {
    color:var(--muted);
    font-size:13px;
    margin-bottom:32px
}
.login-card .btn-primary {
    width:100%;
    margin:12px 0 0;
    padding:13px
}
.login-card .form-control {
    height:46px
}
.login-card .checkbox {
    margin:7px 0 16px
}
.login-caption {
    margin-top:30px!important;
    font-size:11px!important;
    color:#7e8da0!important;
    text-align:center
}
.status-tabs {
    display:flex;
    gap:23px;
    border-bottom:1px solid var(--border);
    margin:-4px 0 22px;
    overflow-x:auto
}
.status-tab {
    font-size:12px;
    color:var(--muted);
    white-space:nowrap;
    padding:10px 0 13px;
    border-bottom:2px solid transparent
}
.status-tab.is-active {
    border-bottom-color:var(--cyan);
    color:var(--cyan);
    font-weight:650
}
@media(min-width:1500px) {
    .app-content {
        padding:38px 42px
    }
    .app-topbar {
        padding:0 42px
    }
    .metric-value {
        font-size:29px
    }
}
@media(max-width:1200px) {
    .app-sidebar {
        width:220px
    }
    .app-workspace {
        margin-left:220px
    }
    .app-brand {
        padding-left:18px;
        gap:10px
    }
    .app-brand strong {
        font-size:21px
    }
    .app-content {
        padding:26px
    }
    .metric-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px
    }
    .metric-card {
        padding:18px 14px;
        gap:10px
    }
    .metric-value {
        font-size:21px
    }
    .metric-icon {
        width:33px;
        height:33px;
        font-size:17px
    }
    .dashboard-grid {
        grid-template-columns:minmax(0,1.4fr) minmax(270px,1fr)
    }
    .page-actions .date-chip {
        display:none
    }
}
@media(max-width:991px) {
    .app-sidebar {
        transform:translateX(-100%);
        transition:transform .2s
    }
    .sidebar-open .app-sidebar {
        transform:translateX(0)
    }
    .sidebar-open {
        overflow:hidden
    }
    .app-workspace {
        margin-left:0
    }
    .menu-toggle {
        display:inline-block
    }
    .app-topbar {
        height:68px;
        padding:0 22px
    }
    .app-content {
        padding:25px 22px
    }
    .metric-value {
        font-size:24px
    }
    .dashboard-grid {
        grid-template-columns:1fr 1fr
    }
    .login-story {
        padding:38px
    }
    .login-pitch h1 {
        font-size:35px
    }
    .workspace-label {
        display:none
    }
}
@media(max-width:700px) {
    .metric-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px
    }
    .dashboard-grid {
        grid-template-columns:1fr
    }
    .page-title {
        align-items:flex-start;
        gap:12px
    }
    .page-title h1,.page-title h3 {
        font-size:24px
    }
    .page-title p {
        font-size:12px
    }
    .page-title .btn {
        padding:9px 11px;
        font-size:11px
    }
    .page-actions {
        gap:8px
    }
    .metric-value {
        font-size:24px
    }
    .app-content {
        padding:23px 16px
    }
    .app-topbar {
        padding:0 16px;
        gap:10px
    }
    .global-search {
        padding:0 10px;
        gap:8px
    }
    .global-search input {
        font-size:11px
    }
    .topbar-account {
        gap:0
    }
    .topbar-account .user-avatar {
        width:30px;
        height:30px
    }
    .app-footer {
        padding:18px 16px
    }
    .app-footer>span:last-child {
        display:none
    }
    .x_content,.surface-body {
        padding:17px
    }
    .x_title,.surface-heading {
        padding:18px
    }
    .surface-heading {
        gap:10px
    }
    .surface-heading h2 {
        font-size:15px
    }
    .form-inline {
        align-items:stretch
    }
    .form-inline .form-group {
        width:100%
    }
    .form-inline .form-control {
        width:100%
    }
    .form-inline input[type=text] {
        min-width:0
    }
    .actions-wrap {
        flex-wrap:wrap
    }
    .login-page {
        display:block;
        background:var(--canvas)
    }
    .login-story {
        padding:27px 26px
    }
    .login-story .app-brand strong {
        font-size:23px
    }
    .login-pitch,.login-story-footer {
        display:none
    }
    .login-main {
        padding:40px 25px
    }
    .login-card {
        max-width:410px
    }
    .login-card h1 {
        font-size:27px
    }
    .quick-links {
        gap:8px
    }
    .quick-link {
        flex:1;
        min-width:140px;
        font-size:11px
    }
    .chart-legend {
        gap:8px
    }
    .form-horizontal .control-label {
        text-align:left
    }
    .modal-dialog {
        margin:30px 15px
    }
    .table-responsive {
        overflow-x:auto
    }
    .surface .table-responsive .table {
        min-width:600px
    }
}
@media(max-width:380px) {
    .metric-icon {
        display:none
    }
    .metric-value {
        font-size:23px
    }
    .metric-card {
        padding:16px
    }
    .page-eyebrow {
        font-size:9px
    }
    .global-search>i {
        display:none
    }
}
@media(prefers-reduced-motion:reduce) {
    *,*:before,*:after {
        transition:none!important;
        animation:none!important;
        scroll-behavior:auto!important
    }
}
@media print {
    .app-sidebar,.app-topbar,.app-footer,.page-actions,.actions-col,.quick-links {
        display:none!important
    }
    .app-workspace {
        margin:0
    }
    .app-content {
        padding:0
    }
    .surface,.x_panel,.metric-card {
        break-inside:avoid;
        box-shadow:none
    }
    body {
        background:white
    }
}

/* Client registration and editing */
.client-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: 11px;
    margin-bottom: 18px;
}
.client-breadcrumb a { color: var(--muted); }
.client-breadcrumb a:hover { color: var(--cyan); }
.client-page-title { margin-bottom: 20px; }
.client-page-title h1 { overflow-wrap: anywhere; }
.client-required-note { color: var(--muted); font-size: 11px; margin-bottom: 14px; }
.required-mark { color: #b53349; }
.client-editor-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 22px;
    align-items: start;
}
.client-form-sections { min-width: 0; }
.client-form-card { margin-bottom: 18px; }
.client-form-card:last-child { margin-bottom: 0; }
.client-section-heading { display: flex; gap: 13px; align-items: flex-start; padding: 21px 23px 0; }
.client-section-heading .section-number {
    height: 30px;
    width: 30px;
    flex-shrink: 0;
    background: var(--cyan);
    color: white;
    font-size: 13px;
}
.client-section-heading h2 { font-size: 16px; letter-spacing: -.3px; margin: 0 0 4px; }
.client-section-heading p { font-size: 11px; color: var(--muted); margin: 0; }
.client-fields { padding: 21px 23px 5px; }
.client-field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.client-field-row > .form-group { min-width: 0; }
.client-address-street { grid-template-columns: minmax(110px, 1fr) minmax(0, 2.1fr) minmax(80px, .65fr); gap: 14px; }
.client-address-city { grid-template-columns: minmax(0, 1fr) 110px; }
.client-form .form-group { margin-bottom: 20px; }
.client-form .form-control { width: 100%; }
.client-form .help-block { margin-bottom: 0; font-size: 10px; }
.client-form .field-error { color: #b53349; font-size: 11px; margin: 6px 0 0; }
.client-form .has-error .form-control { border-color: #cf6d7b; }
#client-address_state { text-transform: uppercase; }
.client-summary-column { position: sticky; top: 22px; min-width: 0; }
.client-summary { padding: 23px; margin-bottom: 16px; }
.client-summary h2 { margin: 0 0 22px; font-size: 17px; }
.client-summary-identity { display: flex; gap: 13px; align-items: center; margin-bottom: 24px; }
.client-summary-identity > div { min-width: 0; }
.client-summary-avatar {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 54px;
    height: 54px;
    background: #e5f6fb;
    color: var(--cyan);
    font-size: 19px;
    font-weight: 650;
    border-radius: 50%;
    flex-shrink: 0;
}
.client-summary-identity strong { font-size: 14px; display: block; line-height: 1.5; overflow-wrap: anywhere; }
.client-summary-identity [data-client-document] { color: var(--muted); display: block; font-size: 11px; overflow-wrap: anywhere; margin-top: 4px; }
.client-summary-section { border-top: 1px solid var(--border); padding: 19px 0; }
.client-summary-section h3 { margin: 0 0 10px; font-size: 11px; letter-spacing: 0; color: #455970; font-weight: 500; }
.client-access-preview { display: block; padding: 9px 11px; background: #f0f7fc; border-radius: 6px; overflow-wrap: anywhere; font-size: 12px; }
.client-active-control { margin: 18px 0 0; }
.client-active-control .help-block { margin-left: 20px; }
.client-summary-footnote { font-size: 10px; color: var(--muted); border-top: 1px solid var(--border); padding-top: 18px; margin: 0; }
.client-tip { display: flex; align-items: flex-start; gap: 9px; background: #eef8fc; border: 1px solid #d5eaf3; color: #35657c; padding: 15px; border-radius: 9px; font-size: 11px; }
.client-tip .fa { margin-top: 3px; flex-shrink: 0; }
.client-action-bar {
    position: sticky;
    bottom: 12px;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 18px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 -4px 20px #10243a06;
    margin-top: 22px;
}
.client-save-note { font-size: 11px; color: var(--muted); }
.client-action-buttons { display: flex; align-items: center; gap: 9px; flex-shrink: 0; }
.client-action-buttons .btn { margin: 0; }
@media (max-width: 1200px) {
    .client-editor-grid { grid-template-columns: minmax(0, 1fr) 265px; gap: 18px; }
    .client-fields { padding: 20px 19px 3px; }
    .client-section-heading { padding: 20px 19px 0; }
    .client-summary { padding: 20px; }
    .client-address-street { grid-template-columns: minmax(0, 1fr) 85px; }
    .client-address-street > .form-group:first-child { grid-column: 1 / -1; max-width: 180px; }
}
@media (max-width: 767px) {
    .client-editor-grid { grid-template-columns: minmax(0, 1fr); }
    .client-summary-column { position: static; }
    .client-summary { margin-bottom: 12px; }
    .client-page-title { flex-wrap: wrap; }
    .client-page-title > a { font-size: 11px; }
    .client-action-bar { bottom: 8px; padding: 12px; }
    .client-save-note { display: none; }
    .client-action-buttons { width: 100%; justify-content: flex-end; }
}
@media (max-width: 480px) {
    .client-field-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .client-address-street { grid-template-columns: minmax(0, 1fr) 80px; gap: 0 12px; }
    .client-address-street > .form-group:first-child { max-width: none; }
    .client-address-city { grid-template-columns: minmax(0, 1fr) 80px; gap: 12px; }
    .client-fields { padding: 19px 17px 0; }
    .client-section-heading { padding: 19px 17px 0; gap: 10px; }
    .client-section-heading h2 { font-size: 15px; }
    .client-section-heading p { font-size: 10px; }
    .client-form .btn-primary { flex: 1; }
}
@media print {
    .client-action-bar, .client-tip { display: none; }
    .client-summary-column { position: static; }
}

/* Product configuration */
.system-identity { display: flex; align-items: center; gap: 17px; padding: 22px; margin-bottom: 15px; }
.system-identity > div { min-width: 0; }
.system-icon { width: 46px; height: 46px; flex-shrink: 0; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--cyan); background: #e4f6fb; font-size: 23px; }
.system-identity h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 13px; margin: 0 0 5px; font-size: 22px; overflow-wrap: anywhere; }
.system-identity p { margin: 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.system-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--border); margin-bottom: 22px; overflow-x: auto; }
.system-tab { padding: 13px 3px; border-bottom: 2px solid transparent; color: var(--muted); font-size: 13px; white-space: nowrap; }
.system-tab.is-active { color: var(--cyan); border-bottom-color: var(--cyan); font-weight: 650; }
.system-tab.is-disabled { color: #8b99ab; }
.system-tab-count { font-size: 10px; border-radius: 5px; background: #eaf0f6; padding: 2px 6px; margin-left: 5px; }
.system-editor-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.system-editor-grid > * { min-width: 0; }
.system-editor-grid .surface-heading { align-items: flex-start; }
.system-editor-grid .surface-heading .btn { flex-shrink: 0; margin: 0; }
.system-editor-grid .table td { overflow-wrap: anywhere; }
.system-editor-grid .table td small { max-width: 230px; }
.system-editor-grid code.resource-code { color: #4f627a; background: #f0f4f8; border-radius: 4px; padding: 4px 6px; font-size: 10px; overflow-wrap: anywhere; white-space: normal; }
.resource-type { display: inline-block; padding: 3px 7px; background: #f0f3f7; border-radius: 4px; color: #53657b; font-size: 10px; }
.system-resource-note { display: flex; align-items: flex-start; gap: 9px; border: 1px solid #d5eaf3; background: #edf8fc; color: #38667b; padding: 12px 14px; border-radius: 7px; font-size: 11px; margin: 17px 20px; }
.system-resource-note .fa { margin-top: 3px; }
.system-inline-editor { border: 1px solid var(--border); border-radius: 9px; padding: 20px; margin: 20px; scroll-margin-top: 20px; }
.system-editor-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.system-editor-heading h3 { font-size: 16px; margin: 0; }
.system-editor-heading .icon-button { width: 27px; height: 27px; display: inline-flex; align-items: center; justify-content: center; font-size: 21px; border: 0; }
.system-inline-editor .help-block { font-size: 10px; }
.system-inline-editor textarea.form-control { min-height: 75px; }
.system-inline-editor .field-error,.system-editor-grid .field-error { color: #b53349; font-size: 11px; margin: 6px 0 0; }
.system-editor-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.system-editor-actions .checkbox { margin: 0; }
.system-editor-actions > div:last-child { display: flex; gap: 7px; }
.system-editor-actions .btn { margin: 0; }
.resource-code-input { font-family: ui-monospace, monospace; }
.resource-preservation-note { margin: 17px 0 0; padding-top: 14px; border-top: 1px solid var(--border); }
.resource-preview { padding: 22px; margin-bottom: 17px; }
.resource-preview > h2 { font-size: 17px; margin: 0 0 7px; }
.resource-preview > .help-block { font-size: 11px; margin: 0 0 20px; }
.resource-preview-product { display: flex; gap: 13px; align-items: center; margin-bottom: 20px; }
.resource-preview-product strong { font-size: 17px; overflow-wrap: anywhere; }
.resource-preview-row { display: flex; gap: 15px; align-items: center; justify-content: space-between; margin-bottom: 13px; font-size: 12px; }
.resource-preview-row label { font-size: 11px; margin: 0; overflow-wrap: anywhere; }
.resource-preview-row input.form-control { width: 95px; height: 35px; font-size: 12px; flex-shrink: 0; }
.resource-preview-row input:disabled { background: #f5f7fa; color: #53657b; opacity: 1; }
.resource-preview-footnote,.resource-preview-empty { font-size: 10px; color: var(--muted); margin: 18px 0 0; }
.resource-draft-preview { border-top: 1px solid var(--border); margin-top: 20px; padding-top: 17px; }
.resource-draft-preview .page-eyebrow { font-size: 9px; }
.resource-draft-preview .resource-preview-row { overflow-wrap: anywhere; }
.system-editor-grid .client-tip strong { display: block; margin-bottom: 9px; font-size: 12px; }
.system-editor-grid .client-tip p { margin: 7px 0 0; }
@media (max-width: 1200px) {
    .system-editor-grid { grid-template-columns: minmax(0, 1fr) 250px; gap: 16px; }
    .system-editor-grid .surface-heading { flex-wrap: wrap; }
}
@media (max-width: 767px) {
    .system-editor-grid { grid-template-columns: minmax(0, 1fr); }
    .system-tabs { gap: 17px; }
    .system-tab { font-size: 12px; }
    .system-identity { padding: 18px; }
    .system-identity h2 { font-size: 19px; }
    .system-inline-editor { margin: 14px; padding: 15px; }
    .system-resource-note { margin: 14px; }
    .system-editor-grid .table { min-width: 550px; }
}
.system-editor-grid .table td.actions-col { overflow-wrap: normal; white-space: nowrap; }
.system-editor-grid .table td.actions-col .btn { white-space: nowrap; }