:root{
    --primary:#312E81;
    --accent:#06B6D4;
    --sidebar-bg:#070b1f;
    --radius:24px;
    --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

html[data-theme="light"],
body[data-theme="light"]{
    color-scheme:light;
    --bg:#f5f8ff;
    --bg-2:#eef6ff;
    --surface:#ffffff;
    --surface-2:#f8fbff;
    --panel:#ffffff;
    --panel-soft:rgba(255,255,255,.88);
    --text:#0d1728;
    --heading:#07111f;
    --muted:#65758c;
    --muted-2:#8795aa;
    --line:rgba(13,23,40,.10);
    --line-strong:rgba(13,23,40,.16);
    --shadow:0 24px 72px rgba(15,23,42,.10);
    --shadow-soft:0 12px 36px rgba(15,23,42,.08);
    --body-gradient:
        radial-gradient(circle at 18% 0%,rgba(6,182,212,.16),transparent 30%),
        radial-gradient(circle at 100% 20%,rgba(49,46,129,.11),transparent 32%),
        linear-gradient(135deg,#f8fbff 0%,#eef5ff 48%,#ecfeff 100%);
}

html[data-theme="dark"],
body[data-theme="dark"]{
    color-scheme:dark;
    --bg:#070b16;
    --bg-2:#0b1220;
    --surface:#0f172a;
    --surface-2:#111c31;
    --panel:#101827;
    --panel-soft:rgba(16,24,39,.88);
    --text:#eaf1ff;
    --heading:#ffffff;
    --muted:#9baac0;
    --muted-2:#748299;
    --line:rgba(255,255,255,.10);
    --line-strong:rgba(255,255,255,.16);
    --shadow:0 30px 90px rgba(0,0,0,.42);
    --shadow-soft:0 16px 44px rgba(0,0,0,.34);
    --body-gradient:
        radial-gradient(circle at 16% 0%,rgba(6,182,212,.17),transparent 30%),
        radial-gradient(circle at 100% 22%,rgba(49,46,129,.22),transparent 34%),
        linear-gradient(135deg,#070b16 0%,#0b1220 52%,#08283b 100%);
}

*{
    box-sizing:border-box;
}

html{
    min-height:100%;
    background:var(--bg);
}

body{
    min-height:100vh;
    margin:0;
    font-family:var(--font);
    background:var(--body-gradient);
    color:var(--text);
    overflow-x:hidden;
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input,
textarea,
select{
    font:inherit;
}

.app-frame{
    display:grid;
    grid-template-columns:290px minmax(0,1fr);
    min-height:100vh;
    background:var(--body-gradient);
}

.sidebar{
    position:sticky;
    top:0;
    height:100vh;
    padding:24px 22px;
    color:#eaf1ff;
    border-right:1px solid rgba(255,255,255,.08);
    display:flex;
    flex-direction:column;
    gap:24px;
    z-index:30;
}

.brand-mark{
    display:flex;
    align-items:center;
    gap:14px;
    min-height:48px;
}

.brand-mark span{
    width:44px;
    height:44px;
    border-radius:17px;
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:900;
    box-shadow:0 14px 38px rgba(6,182,212,.22);
}

.brand-mark strong{
    color:#fff;
    letter-spacing:-.04em;
    font-size:18px;
}

.side-nav{
    display:grid;
    gap:8px;
}

.side-nav a{
    min-height:48px;
    display:flex;
    align-items:center;
    padding:0 14px;
    border-radius:15px;
    color:rgba(234,241,255,.78);
    font-weight:650;
    transition:.2s ease;
}

.side-nav a:hover,
.side-nav a.is-active{
    color:#fff;
    background:rgba(255,255,255,.10);
}

.sidebar-footer{
    margin-top:auto;
    padding:14px;
    border-radius:18px;
    color:rgba(234,241,255,.78);
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    font-size:12px;
}

.main-frame{
    min-width:0;
    display:flex;
    flex-direction:column;
}

.topbar{
    position:sticky;
    top:0;
    z-index:25;
    min-height:76px;
    padding:0 28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    background:color-mix(in srgb,var(--surface) 84%,transparent);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(22px);
}

.topbar-kicker{
    display:block;
    color:var(--muted);
    font-size:12px;
    margin-bottom:4px;
}

.topbar strong{
    color:var(--heading);
    letter-spacing:-.03em;
    font-size:17px;
}

.topbar-actions{
    display:flex;
    align-items:center;
    gap:12px;
}

.menu-toggle{
    display:none;
    width:42px;
    height:42px;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--surface);
    color:var(--text);
}

.content-frame{
    width:100%;
    max-width:1680px;
    margin:0 auto;
    padding:32px 42px 48px;
}

.health-pill,
.live-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:34px;
    padding:0 13px;
    border-radius:999px;
    color:#027a52;
    font-size:12px;
    font-weight:850;
    background:#ecfdf3;
    border:1px solid rgba(16,185,129,.18);
}

.health-pill i,
.live-badge i{
    width:9px;
    height:9px;
    border-radius:999px;
    background:#20d69b;
    box-shadow:0 0 0 6px rgba(32,214,155,.14);
}

body[data-theme="dark"] .health-pill,
body[data-theme="dark"] .live-badge{
    background:rgba(16,185,129,.13);
    color:#8df2c4;
    border-color:rgba(16,185,129,.20);
}

.soft-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 15px;
    border-radius:14px;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--text);
    box-shadow:var(--shadow-soft);
    cursor:pointer;
    transition:.2s ease;
}

.soft-btn:hover{
    transform:translateY(-1px);
    border-color:var(--line-strong);
}

.theme-switch{
    display:none!important;
}

.theme-toggle{
    position:relative;
    width:160px;
    height:42px;
    border:1px solid var(--line);
    border-radius:999px;
    background:var(--surface);
    color:var(--muted);
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    padding:4px;
    cursor:pointer;
    box-shadow:var(--shadow-soft);
    overflow:hidden;
}

.theme-toggle-option{
    width:74px;
    height:32px;
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    font-size:12px;
    font-weight:900;
    transition:.2s ease;
    user-select:none;
}

.theme-toggle-knob{
    position:absolute;
    z-index:1;
    top:4px;
    left:4px;
    width:74px;
    height:32px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 12px 26px color-mix(in srgb,var(--primary) 28%,transparent);
    transition:transform .22s ease;
}

.theme-toggle[data-mode="light"] .theme-toggle-light,
.theme-toggle[data-mode="dark"] .theme-toggle-dark{
    color:#fff;
}

.theme-toggle[data-mode="dark"] .theme-toggle-knob{
    transform:translateX(74px);
}

.auth-theme-toggle{
    position:fixed;
    right:24px;
    top:24px;
    z-index:60;
}

.toast-stack{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:100;
    display:grid;
    gap:10px;
}

.toast{
    padding:13px 16px;
    border-radius:16px;
    background:var(--heading);
    color:var(--surface);
    box-shadow:var(--shadow);
    font-size:13px;
    font-weight:750;
    animation:toastIn .24s ease both;
}

@keyframes toastIn{
    from{opacity:0;transform:translateY(12px)}
    to{opacity:1;transform:translateY(0)}
}

@media (max-width:1100px){
    .app-frame{
        grid-template-columns:1fr;
    }

    .sidebar{
        position:fixed;
        inset:0 auto 0 0;
        width:290px;
        transform:translateX(-104%);
        transition:.24s ease;
    }

    .sidebar.is-open{
        transform:translateX(0);
    }

    .menu-toggle{
        display:inline-grid;
        place-items:center;
    }

    .content-frame{
        padding:26px 22px 42px;
    }
}

@media (max-width:720px){
    .topbar{
        min-height:auto;
        padding:14px;
        align-items:flex-start;
    }

    .topbar-actions{
        flex-wrap:wrap;
        justify-content:flex-end;
    }

    .health-pill{
        display:none;
    }

    .theme-toggle{
        width:144px;
    }

    .theme-toggle-option,
    .theme-toggle-knob{
        width:66px;
    }

    .theme-toggle[data-mode="dark"] .theme-toggle-knob{
        transform:translateX(66px);
    }
}

@media (prefers-reduced-motion:reduce){
    *,
    *:before,
    *:after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}
.alert-stack{
    display:grid;
    gap:10px;
    margin-bottom:16px;
}

.app-alert{
    padding:13px 15px;
    border-radius:16px;
    font-size:13px;
    font-weight:850;
    border:1px solid var(--line);
    box-shadow:var(--shadow-soft);
}

.app-alert.success{
    color:#027a52;
    background:#ecfdf3;
    border-color:rgba(16,185,129,.22);
}

.app-alert.error{
    color:#b42318;
    background:#fff1f0;
    border-color:rgba(239,68,68,.22);
}

.app-alert.warning{
    color:#a15c00;
    background:#fff7e6;
    border-color:rgba(245,158,11,.22);
}

body[data-theme="dark"] .app-alert.success{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

body[data-theme="dark"] .app-alert.error{
    color:#ffb4ab;
    background:rgba(239,68,68,.13);
}

body[data-theme="dark"] .app-alert.warning{
    color:#ffd68a;
    background:rgba(245,158,11,.13);
}

.dev-reset-box{
    position:relative;
    z-index:1;
    margin-top:18px;
    padding:14px;
    border-radius:16px;
    border:1px solid var(--line);
    background:var(--surface);
    display:grid;
    gap:8px;
    word-break:break-all;
}

.dev-reset-box span{
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.dev-reset-box a{
    color:var(--accent);
    font-size:13px;
    font-weight:800;
}
.settings-form{
    margin-top:24px;
}

.settings-grid{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);
    gap:18px;
}

.settings-grid .glass-panel:first-child{
    grid-column:auto;
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.form-grid-3{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.form-grid label{
    display:grid;
    gap:8px;
    color:var(--heading);
    font-size:13px;
    font-weight:850;
}

.form-grid input,
.form-grid select,
.form-grid textarea{
    width:100%;
    min-height:48px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--surface);
    color:var(--text);
    padding:0 14px;
    outline:0;
    transition:.2s ease;
}

.form-grid input[type="color"]{
    padding:5px;
    cursor:pointer;
}

.form-grid input:focus,
.form-grid select:focus,
.form-grid textarea:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent);
}

.switch-field{
    display:flex!important;
    align-items:center;
    gap:12px;
    min-height:48px;
    padding:0 14px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--surface);
}

.switch-field input{
    width:18px;
    height:18px;
    min-height:auto;
    accent-color:var(--accent);
}

.primary-btn{
    min-height:48px;
    border:0;
    border-radius:16px;
    padding:0 18px;
    color:#fff;
    font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 18px 42px color-mix(in srgb,var(--primary) 24%,transparent);
    cursor:pointer;
    transition:.2s ease;
}

.primary-btn:hover{
    transform:translateY(-1px);
}

.sticky-actions{
    position:sticky;
    bottom:18px;
    z-index:20;
    display:flex;
    justify-content:flex-end;
    margin-top:18px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:20px;
    background:color-mix(in srgb,var(--panel-soft) 88%,transparent);
    backdrop-filter:blur(18px);
    box-shadow:var(--shadow-soft);
}

.preview-card{
    padding:20px;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--surface);
    display:grid;
    gap:8px;
}

.preview-card span{
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.preview-card strong{
    color:var(--heading);
    font-size:28px;
    letter-spacing:-.06em;
}

.preview-card p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.settings-info-list{
    display:grid;
    gap:12px;
}

.settings-info-list div{
    padding:16px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    display:grid;
    gap:5px;
}

.settings-info-list strong{
    color:var(--heading);
}

.settings-info-list span{
    color:var(--muted);
    line-height:1.55;
    font-size:13px;
}

@media (max-width:1100px){
    .settings-grid{
        grid-template-columns:1fr;
    }

    .form-grid,
    .form-grid-3{
        grid-template-columns:1fr;
    }

    .sticky-actions{
        justify-content:stretch;
    }

    .sticky-actions .primary-btn{
        width:100%;
    }
}
.table-panel{
    margin-top:24px;
}

.table-wrap{
    width:100%;
    overflow:auto;
}

.data-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0 10px;
}

.data-table th{
    color:var(--muted);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
    text-align:left;
    padding:0 14px 6px;
}

.data-table td{
    background:var(--surface);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:14px;
    vertical-align:middle;
}

.data-table td:first-child{
    border-left:1px solid var(--line);
    border-radius:16px 0 0 16px;
}

.data-table td:last-child{
    border-right:1px solid var(--line);
    border-radius:0 16px 16px 0;
}

.data-table td strong,
.mini-list strong{
    display:block;
    color:var(--heading);
}

.data-table td small,
.mini-list small{
    display:block;
    color:var(--muted);
    margin-top:4px;
    font-size:12px;
}

.table-actions{
    display:flex;
    gap:8px;
    justify-content:flex-end;
}

.status-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    font-style:normal;
}

.status-badge.active{
    color:#027a52;
    background:#ecfdf3;
}

.status-badge.suspended,
.status-badge.inactive{
    color:#b42318;
    background:#fff1f0;
}

body[data-theme="dark"] .status-badge.active{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

body[data-theme="dark"] .status-badge.suspended,
body[data-theme="dark"] .status-badge.inactive{
    color:#ffb4ab;
    background:rgba(239,68,68,.13);
}

.mini-list{
    display:grid;
    gap:10px;
}

.mini-list a,
.mini-list>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
}

.empty-state{
    color:var(--muted);
    padding:18px;
    border:1px dashed var(--line-strong);
    border-radius:18px;
    background:color-mix(in srgb,var(--surface) 82%,transparent);
}

.details-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

.details-grid div{
    padding:16px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
}

.details-grid span{
    display:block;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:6px;
}

.details-grid strong{
    color:var(--heading);
    word-break:break-word;
}

.action-list{
    display:grid;
    gap:10px;
}

.action-list form{
    margin:0;
}

.action-list .soft-btn{
    width:100%;
}

.danger-soft{
    color:#b42318;
}

.plan-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.plan-card{
    display:grid;
    gap:20px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:24px;
    background:var(--surface);
    box-shadow:var(--shadow-soft);
}

.plan-card h2{
    color:var(--heading);
    margin:16px 0 8px;
    letter-spacing:-.05em;
}

.plan-card strong{
    display:block;
    color:var(--heading);
    font-size:36px;
    letter-spacing:-.07em;
}

.plan-card strong small{
    color:var(--muted);
    font-size:14px;
    letter-spacing:0;
}

.plan-card ul{
    display:grid;
    gap:9px;
    padding:0;
    margin:0;
    list-style:none;
    color:var(--muted);
    font-size:14px;
}

.plan-card li:before{
    content:"✓";
    color:var(--accent);
    font-weight:900;
    margin-right:8px;
}

.card-actions{
    display:flex;
    gap:10px;
}

.mt-18{
    margin-top:18px;
}

@media (max-width:1200px){
    .plan-grid{
        grid-template-columns:1fr;
    }

    .details-grid{
        grid-template-columns:1fr;
    }
}
.primary-btn,
a.primary-btn,
button.primary-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:max-content;
    white-space:nowrap;
    text-align:center;
    line-height:1;
    text-decoration:none;
}

.panel-head{
    flex-wrap:wrap;
}

.panel-head > .primary-btn,
.panel-head > .soft-btn{
    flex-shrink:0;
}

.table-actions{
    align-items:center;
    flex-wrap:wrap;
}

.table-actions .soft-btn{
    min-height:36px;
    padding:0 12px;
    font-size:13px;
    box-shadow:none;
}

.card-actions .soft-btn,
.card-actions .primary-btn{
    flex:1;
}

.sticky-actions .primary-btn{
    min-width:180px;
}

@media (max-width:640px){
    .panel-head{
        display:grid;
        grid-template-columns:1fr;
    }

    .panel-head .primary-btn,
    .panel-head .soft-btn{
        width:100%;
    }

    .table-actions{
        justify-content:flex-start;
    }

    .table-actions .soft-btn{
        flex:1;
        min-width:90px;
    }

    .sticky-actions .primary-btn{
        width:100%;
        min-width:0;
    }
}
.dashboard-grid-3{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.org-lists{
    margin-top:24px;
}

.mini-usage-list{
    display:grid;
    gap:14px;
}

.mini-usage-list div{
    position:relative;
    overflow:hidden;
    padding:16px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    display:grid;
    gap:8px;
}

.mini-usage-list span{
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.mini-usage-list strong{
    color:var(--heading);
}

.mini-usage-list em{
    display:block;
    width:100%;
    height:8px;
    border-radius:999px;
    background:color-mix(in srgb,var(--muted) 13%,transparent);
    position:relative;
    overflow:hidden;
}

.mini-usage-list em:after{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:var(--w);
    border-radius:999px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
}

.team-list{
    display:grid;
    gap:12px;
}

.team-card{
    display:grid;
    grid-template-columns:52px minmax(0,1fr) auto;
    gap:14px;
    align-items:center;
    padding:14px;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--surface);
}

.team-avatar{
    width:52px;
    height:52px;
    border-radius:18px;
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:950;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 14px 32px color-mix(in srgb,var(--accent) 20%,transparent);
}

.team-fields{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.team-fields input,
.team-fields select{
    min-height:42px;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--panel);
    color:var(--text);
    padding:0 12px;
}

.team-fields strong{
    color:var(--heading);
}

.team-fields small{
    color:var(--muted);
}

.team-actions{
    display:flex;
    align-items:center;
    gap:8px;
}

.inline-actions{
    position:static;
    margin-top:18px;
}

@media (max-width:1200px){
    .dashboard-grid-3{
        grid-template-columns:1fr;
    }

    .team-card{
        grid-template-columns:1fr;
    }

    .team-fields{
        grid-template-columns:1fr;
    }

    .team-actions{
        justify-content:flex-start;
        flex-wrap:wrap;
    }
}
.site-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
}

.site-card{
    display:grid;
    gap:18px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:24px;
    background:var(--surface);
    box-shadow:var(--shadow-soft);
}

.site-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.site-card h2{
    color:var(--heading);
    margin:14px 0 8px;
    letter-spacing:-.05em;
}

.site-card p{
    color:var(--muted);
    margin:0;
    word-break:break-all;
}

.site-icon{
    width:52px;
    height:52px;
    border-radius:18px;
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:950;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 14px 32px color-mix(in srgb,var(--accent) 22%,transparent);
    flex-shrink:0;
}

.site-meta{
    display:grid;
    gap:8px;
}

.site-meta span{
    padding:10px 12px;
    border:1px solid var(--line);
    border-radius:14px;
    background:var(--panel);
    color:var(--muted);
    font-size:13px;
    font-weight:750;
}

.full-field{
    grid-column:1/-1;
}

.form-grid textarea{
    min-height:140px;
    padding:14px;
    resize:vertical;
}

.domain-chip-wrap{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:18px;
}

.domain-chip{
    display:inline-flex;
    align-items:center;
    min-height:32px;
    padding:0 12px;
    border-radius:999px;
    color:var(--heading);
    background:color-mix(in srgb,var(--accent) 10%,var(--surface));
    border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
    font-size:12px;
    font-weight:850;
}

.code-box{
    margin:0;
    padding:18px;
    border:1px solid var(--line);
    border-radius:20px;
    background:#07111f;
    color:#dbeafe;
    overflow:auto;
    line-height:1.7;
}

.code-box code{
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    font-size:13px;
    white-space:pre-wrap;
    word-break:break-all;
}

.key-box{
    padding:18px;
    border-radius:20px;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--heading);
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    word-break:break-all;
    font-weight:850;
}

.secret-box{
    margin-top:18px;
    padding:18px;
    border:1px solid rgba(245,158,11,.28);
    border-radius:20px;
    background:rgba(245,158,11,.08);
    display:grid;
    gap:10px;
}

.secret-box span{
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.secret-box strong{
    color:var(--heading);
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
    word-break:break-all;
}

.widget-preview-card{
    max-width:380px;
    margin:auto;
    border:1px solid var(--line);
    border-radius:28px;
    padding:18px;
    background:var(--surface);
    box-shadow:var(--shadow-soft);
    display:grid;
    gap:16px;
}

.preview-chat-head{
    display:flex;
    align-items:center;
    gap:12px;
}

.preview-chat-head>span{
    width:44px;
    height:44px;
    border-radius:16px;
    display:grid;
    place-items:center;
    color:#fff;
    font-weight:950;
    background:linear-gradient(135deg,var(--primary),var(--accent));
}

.preview-chat-head strong{
    color:var(--heading);
    display:block;
}

.preview-chat-head small{
    color:var(--muted);
}

.widget-preview-card p{
    margin:0;
    padding:14px;
    border-radius:16px;
    background:var(--panel);
    color:var(--text);
}

.widget-preview-card button{
    min-height:44px;
    border:0;
    border-radius:16px;
    color:#fff;
    font-weight:900;
    background:linear-gradient(135deg,var(--primary),var(--accent));
}

.status-badge.paused{
    color:#a15c00;
    background:#fff7e6;
}

body[data-theme="dark"] .status-badge.paused{
    color:#ffd68a;
    background:rgba(245,158,11,.14);
}

@media (max-width:1280px){
    .site-grid{
        grid-template-columns:1fr;
    }
}
.widget-preview-card{
    transition:.2s ease;
}

.widget-preview-card button{
    cursor:pointer;
}

.site-card .card-actions{
    align-items:center;
}

.settings-info-list span{
    word-break:break-word;
}
.scan-progress-panel{
    margin-top:24px;
}

.scan-progress-bar{
    position:relative;
    overflow:hidden;
    width:100%;
    height:16px;
    border-radius:999px;
    background:color-mix(in srgb,var(--muted) 14%,transparent);
    margin:18px 0 24px;
}

.scan-progress-bar span{
    position:absolute;
    inset:0 auto 0 0;
    width:0;
    border-radius:999px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 28%,transparent);
    transition:width .45s ease;
}

.scan-progress-bar span:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
    animation:scanSweep 1.4s linear infinite;
}

.scan-stats{
    margin-top:0;
}

.status-badge.completed{
    color:#027a52;
    background:#ecfdf3;
}

.status-badge.running,
.status-badge.queued{
    color:#075985;
    background:#e0f2fe;
}

.status-badge.failed{
    color:#b42318;
    background:#fff1f0;
}

body[data-theme="dark"] .status-badge.completed{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

body[data-theme="dark"] .status-badge.running,
body[data-theme="dark"] .status-badge.queued{
    color:#93e5ff;
    background:rgba(14,165,233,.13);
}

body[data-theme="dark"] .status-badge.failed{
    color:#ffb4ab;
    background:rgba(239,68,68,.13);
}

@keyframes scanSweep{
    from{transform:translateX(-100%)}
    to{transform:translateX(100%)}
}
.table-actions form,
.card-actions form{
    margin:0;
}

.table-actions button.soft-btn,
.card-actions button.soft-btn{
    border:0;
    cursor:pointer;
}
.scan-tabs{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:0 0 18px;
}

.scan-tabs a{
    min-height:42px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--text);
    text-decoration:none;
    font-size:13px;
    font-weight:850;
}

.scan-tabs a.active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 22%,transparent);
}

.scan-tabs span{
    min-width:24px;
    height:24px;
    border-radius:999px;
    display:grid;
    place-items:center;
    padding:0 7px;
    background:color-mix(in srgb,var(--muted) 14%,transparent);
    font-size:11px;
}

.scan-tabs a.active span{
    background:rgba(255,255,255,.22);
}

.scan-breakdown-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:18px;
}

.status-badge.done{
    color:#027a52;
    background:#ecfdf3;
}

.status-badge.processing{
    color:#075985;
    background:#e0f2fe;
}

body[data-theme="dark"] .status-badge.done{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

body[data-theme="dark"] .status-badge.processing{
    color:#93e5ff;
    background:rgba(14,165,233,.13);
}
.chat-layout-grid{
    align-items:start;
}

.chat-transcript{
    display:grid;
    gap:14px;
    max-height:640px;
    overflow:auto;
    padding:6px 4px 18px;
    scroll-behavior:smooth;
}

.chat-bubble{
    max-width:84%;
    padding:14px 16px;
    border-radius:20px;
    border:1px solid var(--line);
    background:var(--surface);
    box-shadow:0 12px 28px color-mix(in srgb,var(--shadow) 10%,transparent);
}

.chat-bubble.visitor{
    justify-self:end;
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-bottom-right-radius:8px;
}

.chat-bubble.assistant{
    justify-self:start;
    border-bottom-left-radius:8px;
}

.chat-bubble div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:8px;
}

.chat-bubble small{
    opacity:.72;
    font-size:11px;
    white-space:nowrap;
}

.chat-bubble p{
    margin:0;
    line-height:1.65;
}

.chat-reply-form{
    display:grid;
    gap:12px;
    margin-top:18px;
}

.chat-reply-form textarea{
    width:100%;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    color:var(--text);
    padding:14px;
    resize:vertical;
    outline:none;
    min-height:112px;
}

.chat-reply-form textarea:focus{
    border-color:color-mix(in srgb,var(--primary) 70%,var(--line));
    box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 12%,transparent);
}

.chat-control-stack{
    display:grid;
    gap:12px;
    margin-top:18px;
}

.chat-control-stack form{
    margin:0;
}

.disabled-reply-box{
    margin-top:18px;
    padding:14px 16px;
    border-radius:18px;
    border:1px dashed color-mix(in srgb,var(--primary) 34%,var(--line));
    background:color-mix(in srgb,var(--primary) 7%,var(--surface));
    display:grid;
    gap:4px;
}

.disabled-reply-box strong{
    color:var(--text);
}

.disabled-reply-box span{
    color:var(--muted);
    font-size:13px;
}

.soft-btn.is-disabled,
.soft-btn:disabled{
    opacity:.58;
    cursor:not-allowed;
}

.status-badge.human{
    color:#9a3412;
    background:#fff7ed;
}

.status-badge.ai{
    color:#075985;
    background:#e0f2fe;
}

.status-badge.limit{
    color:#92400e;
    background:#fef3c7;
}

.status-badge.closed{
    color:#475569;
    background:#f1f5f9;
}

body[data-theme="dark"] .status-badge.human{
    color:#fdba74;
    background:rgba(249,115,22,.13);
}

body[data-theme="dark"] .status-badge.ai{
    color:#93e5ff;
    background:rgba(14,165,233,.13);
}

body[data-theme="dark"] .status-badge.limit{
    color:#fde68a;
    background:rgba(245,158,11,.13);
}

body[data-theme="dark"] .status-badge.closed{
    color:#cbd5e1;
    background:rgba(148,163,184,.13);
}
.crm-typing-line{
    margin:8px 0 4px;
    color:var(--muted);
    font-size:13px;
    font-weight:800;
}

.dept2-hero{
    position:relative;
    overflow:hidden;
    padding:42px;
    border-radius:34px;
    background:
        radial-gradient(circle at 85% 24%, color-mix(in srgb,var(--surface) 46%,transparent), transparent 22%),
        linear-gradient(135deg, color-mix(in srgb,var(--primary) 78%,var(--panel)), color-mix(in srgb,var(--accent) 70%,var(--panel)));
    border:1px solid color-mix(in srgb,var(--line) 72%,transparent);
    box-shadow:var(--shadow);
}

.dept2-hero h1{
    margin:10px 0;
    max-width:820px;
    color:#fff;
    font-size:clamp(38px,4vw,64px);
    line-height:.95;
    letter-spacing:-.06em;
}

.dept2-hero p{
    max-width:760px;
    margin:0;
    color:rgba(255,255,255,.88);
    font-size:16px;
    line-height:1.7;
    font-weight:750;
}

.dept2-hero .eyebrow{
    color:rgba(255,255,255,.78);
}

.dept2-hero-tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:22px;
}

.dept2-hero-tags span{
    display:inline-flex;
    align-items:center;
    min-height:36px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid rgba(255,255,255,.22);
    background:rgba(255,255,255,.14);
    color:#fff;
    font-size:12px;
    font-weight:950;
}

.dept2-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    margin-top:22px;
}

.dept2-stats article,
.dept2-card,
.dept2-panel{
    border:1px solid var(--line);
    background:var(--panel);
    box-shadow:var(--shadow-soft);
}

.dept2-stats article{
    position:relative;
    overflow:hidden;
    min-height:128px;
    padding:22px;
    border-radius:24px;
}

.dept2-stats article:after{
    content:"";
    position:absolute;
    top:-38px;
    right:-38px;
    width:110px;
    height:110px;
    border-radius:999px;
    background:color-mix(in srgb,var(--accent) 18%,transparent);
}

.dept2-stats span,
.dept2-stats small{
    position:relative;
    z-index:1;
    display:block;
    color:var(--muted);
    font-size:13px;
    font-weight:900;
}

.dept2-stats strong{
    position:relative;
    z-index:1;
    display:block;
    margin:8px 0;
    color:var(--heading);
    font-size:38px;
    line-height:1;
    letter-spacing:-.05em;
}

.dept2-tools{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:18px;
    margin-top:22px;
}

.dept2-card,
.dept2-panel{
    border-radius:28px;
    padding:24px;
}

.dept2-card-head,
.dept2-panel-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}

.dept2-card h2,
.dept2-panel h2{
    margin:4px 0 6px;
    color:var(--heading);
    font-size:24px;
    line-height:1.15;
    letter-spacing:-.04em;
}

.dept2-card p,
.dept2-panel p{
    margin:0;
    color:var(--muted);
    font-size:14px;
    line-height:1.65;
    font-weight:750;
}

.dept2-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.dept2-form-grid label{
    display:grid;
    gap:8px;
}

.dept2-form-grid label > span{
    color:var(--muted);
    font-size:13px;
    font-weight:950;
}

.dept2-form-grid input,
.dept2-form-grid select,
.dept2-form-grid textarea,
.dept2-site-filter select{
    width:100%;
    min-height:46px;
    padding:10px 13px;
    border-radius:14px;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--text);
    font-size:14px;
    font-weight:750;
    outline:none;
}

.dept2-form-grid textarea{
    resize:vertical;
    line-height:1.6;
}

.dept2-form-grid input::placeholder,
.dept2-form-grid textarea::placeholder{
    color:var(--muted-2);
}

.dept2-wide{
    grid-column:1 / -1;
}

.dept2-check{
    grid-column:1 / -1;
    display:flex!important;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:10px!important;
    color:var(--text);
    font-size:14px;
    font-weight:850;
}

.dept2-check input{
    width:auto;
    min-height:auto;
}

.dept2-note{
    margin:16px 0;
    padding:14px 16px;
    border-radius:16px;
    background:color-mix(in srgb,var(--accent) 10%,var(--surface));
    border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
    color:var(--text);
    font-size:13px;
    line-height:1.65;
    font-weight:850;
}

.dept2-details summary{
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:0 14px;
    margin-bottom:18px;
    border-radius:999px;
    background:color-mix(in srgb,var(--primary) 12%,var(--surface));
    border:1px solid color-mix(in srgb,var(--primary) 18%,var(--line));
    color:var(--text);
    font-size:13px;
    font-weight:950;
}

.dept2-panel{
    margin-top:22px;
}

.dept2-tabs{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:20px;
}

.dept2-tabs a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:38px;
    padding:0 14px;
    border-radius:999px;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--text);
    text-decoration:none;
    font-size:13px;
    font-weight:950;
}

.dept2-tabs a.active{
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-color:transparent;
    color:#fff;
}

.dept2-tabs span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:24px;
    height:24px;
    padding:0 8px;
    border-radius:999px;
    background:color-mix(in srgb,var(--accent) 14%,var(--surface));
}

.dept2-tabs a.active span{
    background:rgba(255,255,255,.22);
    color:#fff;
}

.dept2-list{
    display:grid;
    gap:16px;
}

.dept2-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) 150px;
    gap:20px;
    padding:24px;
    border-radius:24px;
    border:1px solid var(--line);
    background:var(--surface);
    box-shadow:0 12px 32px color-mix(in srgb,var(--shadow) 8%,transparent);
    text-rendering:optimizeLegibility;
}

.dept2-row-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
}

.dept2-kicker{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:10px;
}

.dept2-kicker span{
    display:inline-flex;
    align-items:center;
    min-height:26px;
    padding:0 10px;
    border-radius:999px;
    background:color-mix(in srgb,var(--panel) 88%,var(--surface));
    border:1px solid var(--line);
    color:var(--muted);
    font-size:11px;
    font-weight:950;
}

.dept2-row h3{
    margin:0 0 14px;
    color:var(--heading);
    font-size:26px;
    line-height:1.12;
    letter-spacing:-.045em;
}

.dept2-contact{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    max-width:840px;
}

.dept2-contact div{
    padding:13px 15px;
    border-radius:16px;
    background:var(--panel);
    border:1px solid var(--line);
}

.dept2-contact span,
.dept2-source span{
    display:block;
    margin-bottom:5px;
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.06em;
}

.dept2-contact strong{
    display:block;
    color:var(--heading);
    font-size:14px;
    line-height:1.45;
    word-break:break-word;
}

.dept2-badges{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:8px;
}

.dept2-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:30px;
    padding:0 11px;
    border-radius:999px;
    background:color-mix(in srgb,var(--accent) 11%,var(--surface));
    border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
    color:var(--heading);
    font-size:11px;
    font-weight:950;
    white-space:nowrap;
}

.dept2-badge.status-approved{
    color:#027a52;
    background:#ecfdf3;
    border-color:rgba(16,185,129,.22);
}

.dept2-badge.status-pending{
    color:#92400e;
    background:#fef3c7;
    border-color:rgba(245,158,11,.22);
}

.dept2-badge.status-declined{
    color:#991b1b;
    background:#fee2e2;
    border-color:rgba(239,68,68,.22);
}

body[data-theme="dark"] .dept2-badge.status-approved{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

body[data-theme="dark"] .dept2-badge.status-pending{
    color:#fde68a;
    background:rgba(245,158,11,.13);
}

body[data-theme="dark"] .dept2-badge.status-declined{
    color:#fecaca;
    background:rgba(239,68,68,.13);
}

.dept2-source{
    margin-top:16px;
    padding:14px 16px;
    border-radius:16px;
    border:1px solid var(--line);
    background:var(--panel);
}

.dept2-source a{
    display:block;
    color:var(--heading);
    font-size:13px;
    font-weight:900;
    line-height:1.6;
    word-break:break-word;
    text-decoration:underline;
    text-decoration-thickness:1.5px;
    text-underline-offset:3px;
}

.dept2-source a:hover{
    color:var(--accent);
}

.dept2-topics{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}

.dept2-topics span{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    background:var(--panel);
    border:1px solid var(--line);
    color:var(--text);
    font-size:12px;
    font-weight:900;
}

.dept2-audit{
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid var(--line);
}

.dept2-audit summary{
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    min-height:40px;
    padding:0 14px;
    border-radius:12px;
    background:var(--panel);
    border:1px solid var(--line);
    color:var(--heading);
    font-size:13px;
    font-weight:950;
    line-height:1;
}

.dept2-audit summary:hover{
    background:color-mix(in srgb,var(--accent) 10%,var(--surface));
    border-color:color-mix(in srgb,var(--accent) 22%,var(--line));
}

.dept2-context{
    margin:14px 0;
    padding:15px;
    border-radius:16px;
    background:var(--panel);
    border:1px solid var(--line);
    color:var(--text);
    font-size:13px;
    line-height:1.75;
    font-weight:700;
}

.dept2-actions{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.dept2-actions form{
    margin:0;
}

.dept2-actions button{
    width:100%;
    justify-content:center;
}

.status-badge.pending{
    color:#92400e;
    background:#fef3c7;
}

.status-badge.approved{
    color:#027a52;
    background:#ecfdf3;
}

.status-badge.declined{
    color:#991b1b;
    background:#fee2e2;
}

body[data-theme="dark"] .status-badge.pending{
    color:#fde68a;
    background:rgba(245,158,11,.13);
}

body[data-theme="dark"] .status-badge.approved{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

body[data-theme="dark"] .status-badge.declined{
    color:#fecaca;
    background:rgba(239,68,68,.13);
}

@media (max-width:1180px){
    .dept2-stats,
    .dept2-tools{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .dept2-row{
        grid-template-columns:1fr;
    }

    .dept2-actions{
        flex-direction:row;
        flex-wrap:wrap;
    }

    .dept2-actions form{
        flex:1 1 140px;
    }
}

@media (max-width:760px){
    .dept2-hero{
        padding:30px;
        border-radius:26px;
    }

    .dept2-stats,
    .dept2-tools,
    .dept2-form-grid,
    .dept2-contact{
        grid-template-columns:1fr;
    }

    .dept2-row-top,
    .dept2-panel-head{
        flex-direction:column;
    }

    .dept2-badges{
        justify-content:flex-start;
    }
}
.settings-shortcuts{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin:22px 0;
}

.settings-shortcut{
    display:grid;
    gap:6px;
    padding:18px;
    border-radius:22px;
    border:1px solid var(--line);
    background:var(--panel);
    color:var(--text);
    text-decoration:none;
    box-shadow:0 14px 38px color-mix(in srgb,var(--shadow) 10%,transparent);
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}

.settings-shortcut:hover{
    transform:translateY(-2px);
    border-color:color-mix(in srgb,var(--primary) 42%,var(--line));
    background:color-mix(in srgb,var(--surface) 72%,var(--panel));
}

.settings-shortcut span{
    color:var(--text);
    font-size:15px;
    font-weight:950;
}

.settings-shortcut strong{
    color:var(--muted);
    font-size:12px;
    line-height:1.5;
}

.settings-shortcut.active{
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
}

.settings-shortcut.active span,
.settings-shortcut.active strong{
    color:color-mix(in srgb,var(--surface) 96%,var(--text));
}

@media (max-width: 1100px){
    .settings-shortcuts{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width: 680px){
    .settings-shortcuts{
        grid-template-columns:1fr;
    }
}
.settings-shortcuts{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
    margin:22px 0;
}

.settings-shortcut{
    display:grid;
    gap:6px;
    padding:18px;
    border-radius:22px;
    border:1px solid var(--line);
    background:var(--panel);
    color:var(--text);
    text-decoration:none;
    box-shadow:0 14px 38px color-mix(in srgb,var(--shadow) 10%,transparent);
    transition:transform .18s ease,border-color .18s ease,background .18s ease;
}

.settings-shortcut:hover{
    transform:translateY(-2px);
    border-color:color-mix(in srgb,var(--primary) 42%,var(--line));
    background:color-mix(in srgb,var(--surface) 72%,var(--panel));
}

.settings-shortcut span{
    color:var(--text);
    font-size:15px;
    font-weight:950;
}

.settings-shortcut strong{
    color:var(--muted);
    font-size:12px;
    line-height:1.5;
}

.settings-shortcut.active{
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
}

.settings-shortcut.active span,
.settings-shortcut.active strong{
    color:#fff;
}

@media (max-width:1100px){
    .settings-shortcuts{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media (max-width:680px){
    .settings-shortcuts{
        grid-template-columns:1fr;
    }
}
/* Ticket CRM show page */
.ticket-crm-grid{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);
    gap:18px;
    align-items:start;
    margin-top:22px;
}

.ticket-overview-card,
.ticket-visitor-card{
    overflow:hidden;
}

.ticket-info-list div{
    min-height:86px;
}

.ticket-info-list a{
    color:var(--accent);
    font-weight:900;
    text-decoration:underline;
    text-underline-offset:3px;
    word-break:break-word;
}

.ticket-main-message{
    margin-top:18px;
    padding:18px;
    border-radius:22px;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 34%),
        color-mix(in srgb,var(--primary) 7%,var(--surface));
    border:1px solid color-mix(in srgb,var(--primary) 18%,var(--line));
    box-shadow:0 16px 38px color-mix(in srgb,var(--shadow) 8%,transparent);
}

.ticket-main-message span{
    display:block;
    margin-bottom:8px;
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.075em;
}

.ticket-main-message p{
    margin:0;
    color:var(--heading);
    font-size:15px;
    font-weight:800;
    line-height:1.75;
    white-space:pre-wrap;
}

.ticket-live-panel{
    display:grid;
    gap:18px;
    margin-top:22px;
}

.ticket-muted-copy{
    margin:6px 0 0;
    color:var(--muted);
    font-size:14px;
    font-weight:750;
    line-height:1.6;
}

.ticket-chat-thread{
    display:flex;
    flex-direction:column;
    gap:14px;
    max-height:680px;
    overflow:auto;
    padding:18px;
    border-radius:26px;
    background:
        radial-gradient(circle at 0% 0%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 30%),
        color-mix(in srgb,var(--surface) 78%,var(--panel));
    border:1px solid var(--line);
    scroll-behavior:smooth;
}

.ticket-chat-bubble{
    width:min(82%,760px);
    border-radius:24px;
    padding:15px 16px;
    border:1px solid var(--line);
    background:var(--surface);
    box-shadow:0 14px 34px color-mix(in srgb,var(--shadow) 12%,transparent);
    animation:ticketMsgIn .18s ease both;
}

.ticket-chat-bubble.visitor{
    align-self:flex-end;
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-bottom-right-radius:9px;
}

.ticket-chat-bubble.assistant{
    align-self:flex-start;
    color:var(--text);
    border-bottom-left-radius:9px;
}

.ticket-chat-bubble.team{
    align-self:flex-start;
    color:var(--text);
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 38%),
        color-mix(in srgb,var(--primary) 9%,var(--surface));
    border-color:color-mix(in srgb,var(--primary) 22%,var(--line));
    border-bottom-left-radius:9px;
}

.ticket-chat-meta{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:9px;
    color:inherit;
    opacity:.78;
    font-size:11px;
    font-weight:950;
    letter-spacing:.065em;
    text-transform:uppercase;
}

.ticket-chat-name{
    color:inherit;
}

.ticket-chat-text{
    color:inherit;
    font-size:14px;
    line-height:1.7;
    font-weight:760;
    white-space:pre-wrap;
}

.ticket-reply-box{
    border-radius:26px;
    padding:18px;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--surface) 94%,transparent),color-mix(in srgb,var(--panel) 92%,transparent));
    border:1px solid var(--line);
    box-shadow:var(--shadow-soft);
}

.ticket-reply-head{
    padding:0;
    margin-bottom:14px;
}

.ticket-reply-box textarea{
    min-height:150px;
    resize:vertical;
}

.ticket-reply-actions{
    justify-content:flex-start;
    background:transparent;
    border:0;
    box-shadow:none;
    padding:0;
    margin-top:14px;
}

.ticket-routing-pills{
    display:flex;
    flex-wrap:wrap;
    gap:9px;
    margin-top:16px;
}

.ticket-routing-pills span{
    display:inline-flex;
    align-items:center;
    border-radius:999px;
    padding:8px 11px;
    background:color-mix(in srgb,var(--accent) 9%,var(--surface));
    border:1px solid color-mix(in srgb,var(--accent) 18%,var(--line));
    color:var(--text);
    font-size:12px;
    font-weight:900;
}

.ticket-live-dot{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    background:color-mix(in srgb,var(--primary) 8%,var(--surface));
    border:1px solid color-mix(in srgb,var(--primary) 18%,var(--line));
    font-size:12px;
    font-weight:950;
    color:color-mix(in srgb,var(--primary) 78%,var(--heading));
}

.ticket-live-dot::before{
    content:"";
    width:8px;
    height:8px;
    border-radius:999px;
    background:currentColor;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--primary) 16%,transparent);
}

.ticket-chat-thread::-webkit-scrollbar{
    width:10px;
}

.ticket-chat-thread::-webkit-scrollbar-track{
    background:color-mix(in srgb,var(--surface) 78%,transparent);
    border-radius:999px;
}

.ticket-chat-thread::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,var(--primary),var(--accent));
    border-radius:999px;
    border:2px solid color-mix(in srgb,var(--surface) 82%,transparent);
}

@keyframes ticketMsgIn{
    from{
        opacity:0;
        transform:translateY(8px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }
}

@media(max-width:980px){
    .ticket-crm-grid{
        grid-template-columns:1fr;
    }

    .ticket-chat-bubble{
        width:92%;
    }
}

@media(max-width:620px){
    .ticket-chat-thread{
        padding:12px;
        border-radius:22px;
        max-height:580px;
    }

    .ticket-chat-bubble{
        width:96%;
        padding:13px 14px;
        border-radius:20px;
    }

    .ticket-chat-meta{
        align-items:flex-start;
        flex-direction:column;
        gap:4px;
    }

    .ticket-reply-box{
        padding:14px;
        border-radius:22px;
    }
}

.owner-email-preview{
    width:100%;
    min-height:620px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:#fff;
    overflow:hidden;
}

.status-badge.queued{
    color:#92400e;
    background:rgba(245,158,11,.12);
    border-color:rgba(245,158,11,.22);
}

.status-badge.sent{
    color:#047857;
    background:rgba(16,185,129,.12);
    border-color:rgba(16,185,129,.22);
}

.status-badge.failed{
    color:#b91c1c;
    background:rgba(239,68,68,.12);
    border-color:rgba(239,68,68,.22);
}
.widget-icon-picker,
.settings-info-list .widget-icon-choice{
    display:flex;
    align-items:center;
    gap:12px;
}

.widget-icon-choice input{
    width:auto;
}

.widget-icon-choice .widget-icon-preview{
    width:42px;
    height:42px;
    border-radius:14px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg, rgba(6,182,212,.16), rgba(49,46,129,.16));
    color:#67e8f9;
    border:1px solid rgba(103,232,249,.22);
    flex:0 0 auto;
}

.widget-icon-choice .widget-icon-preview svg{
    width:22px;
    height:22px;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.widget-icon-choice strong{
    color:inherit;
}

.widget-preview-card button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}
.launcher-config-grid [data-launcher-field]{
    transition:.18s ease;
}

.field-title{
    display:block;
    margin:0 0 8px;
    font-size:12px;
    font-weight:950;
    color:var(--muted);
}

.selected-icon-card{
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px;
    border:1px solid rgba(148,163,184,.22);
    border-radius:18px;
    background:rgba(15,23,42,.32);
}

.selected-icon-preview{
    width:54px;
    height:54px;
    border-radius:18px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    color:#fff;
    font-size:23px;
    flex:0 0 auto;
    box-shadow:0 16px 35px rgba(0,0,0,.18);
}

.selected-icon-card div:nth-child(2){
    flex:1;
    min-width:0;
}

.selected-icon-card strong{
    display:block;
    color:#fff;
    font-size:13px;
    word-break:break-word;
}

.selected-icon-card small{
    display:block;
    color:var(--muted);
    margin-top:3px;
    line-height:1.5;
}

.widget-icon-picker{
    display:grid;
    gap:10px;
}

.widget-icon-choice{
    display:flex;
    align-items:center;
    gap:12px;
    padding:11px 12px;
    border:1px solid rgba(148,163,184,.18);
    border-radius:16px;
    background:rgba(15,23,42,.22);
    cursor:pointer;
}

.widget-icon-choice input{
    width:auto;
}

.widget-icon-preview{
    width:42px;
    height:42px;
    border-radius:14px;
    display:grid;
    place-items:center;
    color:#67e8f9;
    background:rgba(6,182,212,.12);
    border:1px solid rgba(103,232,249,.22);
}

.widget-icon-preview svg{
    width:22px;
    height:22px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.widget-preview-card button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
}

.amz-icon-modal[hidden]{
    display:none!important;
}

.amz-icon-modal{
    position:fixed;
    inset:0;
    z-index:99999;
    display:grid;
    place-items:center;
    padding:22px;
}

.amz-icon-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,6,23,.72);
    backdrop-filter:blur(10px);
}

.amz-icon-modal-card{
    position:relative;
    width:min(980px,96vw);
    max-height:min(760px,92vh);
    display:flex;
    flex-direction:column;
    border:1px solid rgba(148,163,184,.24);
    border-radius:28px;
    background:linear-gradient(180deg,rgba(15,23,42,.98),rgba(8,20,35,.98));
    box-shadow:0 30px 100px rgba(0,0,0,.45);
    overflow:hidden;
}

.amz-icon-modal-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:22px 24px;
    border-bottom:1px solid rgba(148,163,184,.18);
}

.amz-icon-modal-head h2{
    margin:4px 0 0;
    font-size:24px;
}

.amz-icon-modal-close{
    width:42px;
    height:42px;
    border:1px solid rgba(148,163,184,.2);
    border-radius:14px;
    background:rgba(15,23,42,.65);
    color:#fff;
    font-size:26px;
    cursor:pointer;
}

.amz-icon-search-wrap{
    padding:16px 24px;
    border-bottom:1px solid rgba(148,163,184,.14);
}

.amz-icon-search-wrap input{
    width:100%;
    height:48px;
    border:1px solid rgba(148,163,184,.24);
    border-radius:16px;
    background:rgba(15,23,42,.7);
    color:#fff;
    padding:0 16px;
    outline:0;
}

.amz-icon-search-wrap input:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 4px rgba(6,182,212,.14);
}

.amz-icon-grid{
    padding:20px 24px 24px;
    overflow:auto;
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
    gap:12px;
}

.amz-icon-option{
    min-height:110px;
    border:1px solid rgba(148,163,184,.18);
    border-radius:20px;
    background:rgba(15,23,42,.5);
    color:#fff;
    display:grid;
    place-items:center;
    gap:10px;
    cursor:pointer;
    transition:.18s ease;
}

.amz-icon-option:hover{
    transform:translateY(-2px);
    border-color:rgba(103,232,249,.45);
    background:linear-gradient(135deg,rgba(49,46,129,.45),rgba(6,182,212,.22));
}

.amz-icon-option i{
    font-size:28px;
    color:#67e8f9;
}

.amz-icon-option span{
    font-size:12px;
    font-weight:900;
    text-align:center;
}

body.amz-icon-modal-open{
    overflow:hidden;
}

@media(max-width:720px){
    .selected-icon-card{
        align-items:flex-start;
        flex-direction:column;
    }

    .selected-icon-card .soft-btn{
        width:100%;
    }

    .amz-icon-grid{
        grid-template-columns:repeat(2,1fr);
    }
}
/* Widget launcher editor */
.launcher-tabs{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:8px;
    margin-bottom:18px;
}

.launcher-tabs button{
    min-height:44px;
    border:1px solid var(--line);
    border-radius:15px;
    background:var(--surface);
    color:var(--muted);
    font-size:12px;
    font-weight:950;
    cursor:pointer;
    transition:.18s ease;
}

.launcher-tabs button:hover,
.launcher-tabs button.is-active{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 12px 30px color-mix(in srgb,var(--accent) 20%,transparent);
}

.field-title{
    display:block;
    margin:0 0 9px;
    color:var(--heading);
    font-size:13px;
    font-weight:950;
}

.selected-icon-card{
    display:flex;
    align-items:center;
    gap:14px;
    padding:15px;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--surface);
}

.selected-icon-preview{
    width:58px;
    height:58px;
    border-radius:20px;
    display:grid;
    place-items:center;
    color:var(--launcher-icon-color-preview,#fff);
    font-size:25px;
    background:linear-gradient(135deg,var(--launcher-icon-bg-preview,var(--primary)),var(--accent));
    box-shadow:0 18px 42px color-mix(in srgb,var(--accent) 22%,transparent);
    flex:0 0 auto;
}

.selected-icon-preview[data-icon-style="solid"]{
    background:var(--launcher-icon-bg-preview,var(--primary));
}

.selected-icon-preview[data-icon-style="outline"]{
    background:transparent;
    border:2px solid var(--launcher-icon-bg-preview,var(--primary));
    color:var(--launcher-icon-color-preview,var(--launcher-icon-bg-preview,var(--primary)));
}

.selected-icon-preview[data-icon-style="none"]{
    background:transparent;
    box-shadow:none;
    color:var(--launcher-icon-color-preview,var(--primary));
}

.selected-icon-card div:nth-child(2){
    min-width:0;
    flex:1;
}

.selected-icon-card strong{
    display:block;
    color:var(--heading);
    word-break:break-word;
}

.selected-icon-card small{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:12px;
    line-height:1.5;
}

.widget-svg-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.widget-svg-choice{
    display:flex!important;
    align-items:center;
    gap:12px!important;
    min-height:74px;
    padding:12px;
    border:1px solid var(--line);
    border-radius:18px;
    background:var(--surface);
    cursor:pointer;
}

.widget-svg-choice input{
    width:auto;
    min-height:auto;
}

.widget-svg-icon{
    width:44px;
    height:44px;
    border-radius:15px;
    display:grid;
    place-items:center;
    color:var(--accent);
    background:color-mix(in srgb,var(--accent) 12%,transparent);
    border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line));
    flex:0 0 auto;
}

.widget-svg-icon svg{
    width:23px;
    height:23px;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.upload-zone{
    display:grid!important;
    gap:12px!important;
}

.upload-drop{
    display:flex!important;
    align-items:center;
    gap:13px!important;
    padding:16px;
    border:1px dashed color-mix(in srgb,var(--accent) 38%,var(--line));
    border-radius:20px;
    background:color-mix(in srgb,var(--accent) 7%,var(--surface));
    cursor:pointer;
}

.upload-drop input{
    width:auto;
    min-height:auto;
}

.upload-drop span{
    display:grid;
    gap:4px;
}

.upload-drop strong{
    color:var(--heading);
}

.upload-drop small{
    color:var(--muted);
    font-size:12px;
}

.launcher-live-preview button{
    min-height:46px;
}

.launcher-preview-icon{
    width:28px;
    height:28px;
    border-radius:999px;
    display:inline-grid;
    place-items:center;
    color:var(--launcher-icon-color-preview,#fff);
    background:linear-gradient(135deg,var(--launcher-icon-bg-preview,var(--primary)),var(--accent));
}

.launcher-preview-icon[data-icon-style="solid"]{
    background:var(--launcher-icon-bg-preview,var(--primary));
}

.launcher-preview-icon[data-icon-style="outline"]{
    background:transparent;
    border:2px solid var(--launcher-icon-bg-preview,var(--primary));
    color:var(--launcher-icon-color-preview,var(--launcher-icon-bg-preview,var(--primary)));
}

.launcher-preview-icon[data-icon-style="none"]{
    background:transparent;
    color:var(--launcher-icon-color-preview,var(--primary));
}

.launcher-preview-icon img{
    width:28px;
    height:28px;
    border-radius:999px;
    object-fit:cover;
    display:block;
}

.launcher-preview-icon svg{
    width:20px;
    height:20px;
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.amz-icon-modal[hidden]{
    display:none!important;
}

.amz-icon-modal{
    position:fixed;
    inset:0;
    z-index:99999;
    display:grid;
    place-items:center;
    padding:22px;
}

.amz-icon-modal-backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,6,23,.76);
    backdrop-filter:blur(10px);
}

.amz-icon-modal-card{
    position:relative;
    width:min(1050px,96vw);
    max-height:min(780px,92vh);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--line-strong);
    border-radius:30px;
    background:var(--panel);
    box-shadow:0 35px 120px rgba(0,0,0,.48);
}

.amz-icon-modal-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:24px;
    border-bottom:1px solid var(--line);
}

.amz-icon-modal-head h2{
    margin:5px 0 6px;
    color:var(--heading);
    font-size:28px;
    letter-spacing:-.055em;
}

.amz-icon-modal-head p{
    margin:0;
    color:var(--muted);
    font-size:14px;
    font-weight:750;
}

.amz-icon-modal-close{
    width:44px;
    height:44px;
    border:1px solid var(--line);
    border-radius:15px;
    background:var(--surface);
    color:var(--heading);
    font-size:26px;
    cursor:pointer;
}

.amz-icon-search-wrap{
    padding:16px 24px;
    border-bottom:1px solid var(--line);
}

.amz-icon-search-wrap input{
    width:100%;
    min-height:50px;
    border:1px solid var(--line);
    border-radius:17px;
    background:var(--surface);
    color:var(--text);
    padding:0 16px;
    outline:0;
}

.amz-icon-search-wrap input:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent);
}

.amz-icon-grid{
    padding:22px 24px 26px;
    overflow:auto;
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(132px,1fr));
    gap:12px;
}

.amz-icon-option{
    min-height:112px;
    border:1px solid var(--line);
    border-radius:22px;
    background:var(--surface);
    color:var(--heading);
    display:grid;
    place-items:center;
    gap:10px;
    cursor:pointer;
    transition:.18s ease;
}

.amz-icon-option:hover,
.amz-icon-option.is-selected{
    transform:translateY(-2px);
    border-color:color-mix(in srgb,var(--accent) 55%,var(--line));
    background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 13%,var(--surface)),color-mix(in srgb,var(--accent) 12%,var(--surface)));
}

.amz-icon-option i{
    font-size:30px;
    color:var(--accent);
}

.amz-icon-option span{
    font-size:12px;
    font-weight:950;
    text-align:center;
}

.icon-style-card{
    grid-column:1/-1;
    padding:16px;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--surface);
    display:grid;
    gap:14px;
}

.icon-style-card h3{
    margin:0;
    color:var(--heading);
    font-size:16px;
    letter-spacing:-.03em;
}

.icon-style-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}

body.amz-icon-modal-open{
    overflow:hidden;
}

@media(max-width:900px){
    .launcher-tabs{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .widget-svg-grid,
    .icon-style-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:680px){
    .launcher-tabs{
        grid-template-columns:1fr;
    }

    .selected-icon-card{
        align-items:flex-start;
        flex-direction:column;
    }

    .selected-icon-card .soft-btn{
        width:100%;
    }

    .amz-icon-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
/* Widget launcher settings visibility fix */
[data-launcher-field][hidden],
.upload-zone[hidden],
.widget-svg-grid[hidden],
.widget-svg-choice[hidden],
.launcher-config-grid [hidden] {
    display: none !important;
}

/* Cleaner widget launcher settings UI */
.launcher-tabs {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 18px;
}

.launcher-tabs button {
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface);
    color: var(--muted);
    font-size: 12px;
    font-weight: 950;
    cursor: pointer;
    transition: .18s ease;
}

.launcher-tabs button:hover,
.launcher-tabs button.is-active {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--accent) 20%, transparent);
}

.field-title {
    display: block;
    margin: 0 0 9px;
    color: var(--heading);
    font-size: 13px;
    font-weight: 950;
}

.selected-icon-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
}

.selected-icon-preview,
.launcher-preview-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    color: var(--launcher-icon-color-preview, #fff);
    background: linear-gradient(135deg, var(--primary), var(--launcher-icon-bg-preview, var(--accent)));
    flex: 0 0 auto;
}

.selected-icon-preview[data-icon-style="solid"],
.launcher-preview-icon[data-icon-style="solid"] {
    background: var(--launcher-icon-bg-preview, var(--primary));
}

.selected-icon-preview[data-icon-style="outline"],
.launcher-preview-icon[data-icon-style="outline"] {
    background: transparent;
    color: var(--launcher-icon-bg-preview, var(--accent));
    border: 2px solid var(--launcher-icon-bg-preview, var(--accent));
}

.selected-icon-preview[data-icon-style="none"],
.launcher-preview-icon[data-icon-style="none"] {
    background: transparent;
    color: var(--launcher-icon-bg-preview, var(--accent));
}

.selected-icon-preview i,
.launcher-preview-icon i {
    color: inherit;
    font-size: 19px;
}

.launcher-preview-icon img {
    width: 100%;
    height: 100%;
    border-radius: 999px;
    object-fit: cover;
    display: block;
}

.launcher-preview-icon svg {
    width: 22px;
    height: 22px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.widget-svg-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.widget-svg-choice {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 74px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
    cursor: pointer;
}

.widget-svg-choice input {
    width: auto;
    min-height: auto;
}

.widget-svg-icon {
    width: 44px;
    height: 44px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    color: var(--accent);
    background: color-mix(in srgb, var(--accent) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
    flex: 0 0 auto;
}

.widget-svg-icon svg {
    width: 23px;
    height: 23px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.upload-zone {
    display: grid;
    gap: 12px;
}

.upload-drop {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 16px;
    border: 1px dashed color-mix(in srgb, var(--accent) 38%, var(--line));
    border-radius: 20px;
    background: color-mix(in srgb, var(--accent) 7%, var(--surface));
    cursor: pointer;
}

.upload-drop input {
    width: auto;
    min-height: auto;
}

.icon-style-card {
    grid-column: 1 / -1;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
}

.icon-style-card h3 {
    margin: 0 0 14px;
    font-size: 15px;
    color: var(--heading);
}

.icon-style-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.amz-icon-modal[hidden] {
    display: none !important;
}

.amz-icon-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: grid;
    place-items: center;
    padding: 22px;
}

.amz-icon-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(2, 6, 23, .76);
    backdrop-filter: blur(10px);
}

.amz-icon-modal-card {
    position: relative;
    width: min(1050px, 96vw);
    max-height: min(780px, 92vh);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--line-strong);
    border-radius: 30px;
    background: var(--panel);
    box-shadow: 0 35px 120px rgba(0,0,0,.48);
}

.amz-icon-modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 24px;
    border-bottom: 1px solid var(--line);
}

.amz-icon-modal-head h2 {
    margin: 5px 0 6px;
    color: var(--heading);
    font-size: 28px;
    letter-spacing: -.055em;
}

.amz-icon-modal-head p {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
    font-weight: 750;
}

.amz-icon-modal-close {
    width: 44px;
    height: 44px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface);
    color: var(--heading);
    font-size: 26px;
    cursor: pointer;
}

.amz-icon-search-wrap {
    padding: 16px 24px;
    border-bottom: 1px solid var(--line);
}

.amz-icon-search-wrap input {
    width: 100%;
    min-height: 50px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface);
    color: var(--text);
    padding: 0 16px;
    outline: 0;
}

.amz-icon-grid {
    padding: 22px 24px 26px;
    overflow: auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
    gap: 12px;
}

.amz-icon-option {
    min-height: 112px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface);
    color: var(--heading);
    display: grid;
    place-items: center;
    gap: 10px;
    cursor: pointer;
    transition: .18s ease;
}

.amz-icon-option:hover,
.amz-icon-option.is-selected {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--accent) 55%, var(--line));
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 13%, var(--surface)), color-mix(in srgb, var(--accent) 12%, var(--surface)));
}

.amz-icon-option i {
    font-size: 30px;
    color: var(--accent);
}

.amz-icon-option span {
    font-size: 12px;
    font-weight: 950;
    text-align: center;
}

body.amz-icon-modal-open {
    overflow: hidden;
}

@media(max-width:900px) {
    .launcher-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .widget-svg-grid,
    .icon-style-grid {
        grid-template-columns: 1fr;
    }
}

@media(max-width:680px) {
    .launcher-tabs {
        grid-template-columns: 1fr;
    }

    .selected-icon-card {
        align-items: flex-start;
        flex-direction: column;
    }

    .selected-icon-card .soft-btn {
        width: 100%;
    }

    .amz-icon-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* =========================================================
   Organization Team Page Polish
   Fixes: member cards, department checkboxes, form layout
   ========================================================= */

.team-list {
    display: grid;
    gap: 18px;
}

.team-card {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    gap: 18px;
    align-items: flex-start;
    padding: 22px;
    border: 1px solid var(--line, rgba(148, 163, 184, .18));
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--accent, #06B6D4) 12%, transparent), transparent 34%),
        var(--surface, rgba(15, 23, 42, .58));
    box-shadow: 0 18px 44px rgba(0, 0, 0, .14);
}

.team-avatar {
    width: 48px;
    height: 48px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: #fff;
    font-weight: 950;
    font-size: 18px;
    background: linear-gradient(135deg, var(--primary, #312E81), var(--accent, #06B6D4));
    box-shadow: 0 16px 35px color-mix(in srgb, var(--accent, #06B6D4) 28%, transparent);
}

.team-fields {
    min-width: 0;
    width: 100%;
}

.team-fields > strong {
    display: block;
    color: var(--heading, #fff);
    font-size: 16px;
    font-weight: 950;
    margin-bottom: 4px;
}

.team-fields > small {
    display: block;
    color: var(--muted, #94a3b8);
    font-size: 12px;
    line-height: 1.6;
    font-weight: 700;
}

.team-card .form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.team-card .form-grid label,
.team-card .full-field {
    min-width: 0;
}

.team-card .form-grid label {
    display: grid;
    gap: 7px;
    color: var(--heading, #fff);
    font-size: 12px;
    font-weight: 900;
}

.team-card input[type="text"],
.team-card input[type="email"],
.team-card input[type="password"],
.team-card select {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--line, rgba(148, 163, 184, .18));
    border-radius: 15px;
    background: var(--input-bg, rgba(15, 23, 42, .72));
    color: var(--text, #e5e7eb);
    padding: 0 13px;
    outline: none;
    font-size: 13px;
    font-weight: 750;
}

.team-card input:focus,
.team-card select:focus {
    border-color: var(--accent, #06B6D4);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent, #06B6D4) 18%, transparent);
}

.team-card input[disabled],
.team-card select[disabled] {
    opacity: .75;
    cursor: not-allowed;
}

.team-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 170px;
}

.team-actions .soft-btn {
    min-height: 38px;
    padding: 0 15px;
}

/* Department access pills */
.team-card .ticket-routing-pills,
.settings-form .ticket-routing-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 10px;
}

.team-card .ticket-routing-pills label,
.settings-form .ticket-routing-pills label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 40px;
    padding: 8px 12px;
    border: 1px solid color-mix(in srgb, var(--accent, #06B6D4) 28%, var(--line, rgba(148, 163, 184, .18)));
    border-radius: 999px;
    background: color-mix(in srgb, var(--accent, #06B6D4) 10%, transparent);
    color: var(--heading, #fff);
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
}

.team-card .ticket-routing-pills input[type="checkbox"],
.settings-form .ticket-routing-pills input[type="checkbox"] {
    appearance: auto;
    -webkit-appearance: checkbox;
    width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 4px;
    flex: 0 0 auto;
    accent-color: var(--accent, #06B6D4);
}

.team-card .ticket-routing-pills span,
.settings-form .ticket-routing-pills span {
    display: inline-block;
    line-height: 1.25;
}

/* Add member panel department checkbox fix */
.settings-form .full-field .field-title {
    display: block;
    margin-bottom: 8px;
    color: var(--heading, #fff);
    font-size: 13px;
    font-weight: 950;
}

/* Table panel spacing */
.table-panel .panel-head {
    margin-bottom: 18px;
}

.table-panel .ticket-muted-copy {
    max-width: 680px;
}

/* Keep cards readable on dark UI */
.team-card .status-badge {
    white-space: nowrap;
}

/* Responsive */
@media (max-width: 1200px) {
    .team-card {
        grid-template-columns: 52px minmax(0, 1fr);
    }

    .team-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
        min-width: 0;
        padding-left: 70px;
    }
}

@media (max-width: 760px) {
    .team-card {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .team-avatar {
        width: 52px;
        height: 52px;
    }

    .team-card .form-grid {
        grid-template-columns: 1fr;
    }

    .team-actions {
        padding-left: 0;
        justify-content: flex-start;
    }

    .team-actions .soft-btn {
        width: 100%;
    }
}
/* =========================================================
   Organization Team Page Final UI
   Uses org-team-* classes to avoid old .team-card conflicts
   ========================================================= */

.org-team-layout{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);
    gap:18px;
    align-items:start;
    margin-top:22px;
}

.org-team-create-panel,
.org-team-users-panel{
    min-height:0;
}

.org-team-form{
    display:grid;
    gap:18px;
}

.org-team-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
}

.org-team-form-grid label{
    display:grid;
    gap:8px;
    color:var(--heading);
    font-size:13px;
    font-weight:950;
    min-width:0;
}

.org-team-form-grid label span{
    color:var(--heading);
    font-size:12px;
    font-weight:950;
}

.org-team-form-grid input,
.org-team-form-grid select{
    width:100%;
    min-height:48px;
    border:1px solid var(--line);
    border-radius:16px;
    background:var(--surface);
    color:var(--text);
    padding:0 14px;
    outline:0;
    font-size:13px;
    font-weight:800;
}

.org-team-form-grid input:focus,
.org-team-form-grid select:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent);
}

.org-team-form-grid input:disabled,
.org-team-form-grid select:disabled{
    opacity:.72;
    cursor:not-allowed;
}

.org-team-full{
    grid-column:1 / -1;
}

.org-team-section{
    display:grid;
    gap:10px;
}

.org-team-dept-grid{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.org-team-dept-pill{
    display:inline-flex!important;
    align-items:center!important;
    gap:9px!important;
    min-height:42px;
    padding:8px 13px;
    border:1px solid color-mix(in srgb,var(--accent) 26%,var(--line));
    border-radius:999px;
    background:color-mix(in srgb,var(--accent) 9%,var(--surface));
    color:var(--heading);
    font-size:12px!important;
    font-weight:950!important;
    cursor:pointer;
    transition:.18s ease;
}

.org-team-dept-pill:hover{
    border-color:color-mix(in srgb,var(--accent) 52%,var(--line));
    background:color-mix(in srgb,var(--accent) 14%,var(--surface));
}

.org-team-dept-pill input[type="checkbox"]{
    appearance:auto;
    -webkit-appearance:checkbox;
    width:16px!important;
    height:16px!important;
    min-width:16px!important;
    min-height:16px!important;
    padding:0!important;
    margin:0!important;
    accent-color:var(--accent);
    flex:0 0 auto;
}

.org-team-dept-pill span{
    display:inline-block;
    line-height:1.25;
}

.org-team-actions-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:4px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:20px;
    background:color-mix(in srgb,var(--surface) 76%,transparent);
}

.org-team-list{
    display:grid;
    gap:16px;
}

.org-team-user-card{
    display:grid;
    gap:18px;
    padding:20px;
    border:1px solid var(--line);
    border-radius:26px;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 32%),
        var(--surface);
    box-shadow:0 16px 42px color-mix(in srgb,var(--shadow) 10%,transparent);
}

.org-team-user-top{
    display:grid;
    grid-template-columns:54px minmax(0,1fr) auto;
    gap:14px;
    align-items:center;
}

.org-team-avatar{
    width:54px;
    height:54px;
    border-radius:18px;
    display:grid;
    place-items:center;
    color:#fff;
    font-size:18px;
    font-weight:950;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 16px 36px color-mix(in srgb,var(--accent) 25%,transparent);
}

.org-team-user-meta{
    min-width:0;
}

.org-team-user-meta strong{
    display:block;
    color:var(--heading);
    font-size:17px;
    font-weight:950;
    line-height:1.25;
    word-break:break-word;
}

.org-team-user-meta span{
    display:block;
    margin-top:4px;
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    line-height:1.5;
    word-break:break-word;
}

.org-team-badges{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:8px;
}

.org-team-edit-grid{
    padding-top:2px;
}

.org-team-card-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-top:4px;
}

.org-team-note{
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    line-height:1.5;
}

.org-team-readonly{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.org-team-readonly span{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    padding:0 12px;
    border-radius:999px;
    border:1px solid var(--line);
    background:var(--panel);
    color:var(--text);
    font-size:12px;
    font-weight:850;
}

@media(max-width:1280px){
    .org-team-layout{
        grid-template-columns:1fr;
    }
}

@media(max-width:760px){
    .org-team-form-grid{
        grid-template-columns:1fr;
    }

    .org-team-full{
        grid-column:auto;
    }

    .org-team-user-top{
        grid-template-columns:54px minmax(0,1fr);
    }

    .org-team-badges{
        grid-column:1 / -1;
        justify-content:flex-start;
    }

    .org-team-actions-bar,
    .org-team-card-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .org-team-actions-bar .soft-btn,
    .org-team-actions-bar .primary-btn,
    .org-team-card-actions .soft-btn{
        width:100%;
    }
}
.owner-usage-board {
    display: grid;
    gap: 22px;
}

.owner-usage-client-card {
    border: 1px solid rgba(148, 163, 184, 0.22);
    border-radius: 26px;
    padding: 24px;
    background:
        radial-gradient(circle at top right, rgba(20, 184, 166, 0.12), transparent 34%),
        rgba(15, 23, 42, 0.56);
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.18);
}

.owner-usage-client-head,
.owner-usage-section-title,
.owner-usage-metric-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.owner-usage-client-head h3 {
    margin: 6px 0 4px;
    font-size: 24px;
}

.owner-usage-client-head p,
.owner-usage-section-title small,
.owner-usage-metric-card small,
.owner-usage-total-card small {
    color: rgba(203, 213, 225, 0.74);
}

.owner-usage-client-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.owner-usage-section-title {
    margin: 24px 0 12px;
    padding-top: 18px;
    border-top: 1px solid rgba(148, 163, 184, 0.14);
}

.owner-usage-section-title span {
    color: rgba(226, 232, 240, 0.96);
    font-weight: 800;
}

.owner-usage-metric-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.owner-usage-total-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.owner-usage-metric-card,
.owner-usage-total-card {
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 20px;
    padding: 18px;
    background: rgba(2, 6, 23, 0.26);
}

.owner-usage-metric-card strong,
.owner-usage-total-card strong {
    display: block;
    margin-top: 10px;
    color: #fff;
    font-size: 22px;
    line-height: 1.1;
}

.owner-usage-metric-card span,
.owner-usage-total-card span {
    color: rgba(191, 219, 254, 0.86);
    font-size: 13px;
    font-weight: 800;
}

.owner-usage-progress {
    width: 100%;
    height: 9px;
    margin: 14px 0 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.16);
}

.owner-usage-progress span {
    display: block;
    height: 100%;
    max-width: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(16, 185, 129, 0.95), rgba(99, 102, 241, 0.95));
}

@media (max-width: 1100px) {
    .owner-usage-metric-grid,
    .owner-usage-total-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .owner-usage-client-head,
    .owner-usage-section-title,
    .owner-usage-metric-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .owner-usage-metric-grid,
    .owner-usage-total-grid {
        grid-template-columns: 1fr;
    }

    .owner-usage-client-card {
        padding: 18px;
    }
}
.owner-usage-accordion {
    display: grid;
    gap: 16px;
}

.owner-usage-organization {
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(20, 184, 166, 0.12), transparent 34%),
        rgba(15, 23, 42, 0.5);
    overflow: hidden;
}

.owner-usage-organization summary {
    display: grid;
    grid-template-columns: minmax(220px, 1.1fr) minmax(340px, 2fr) auto;
    align-items: center;
    gap: 18px;
    padding: 18px 20px;
    cursor: pointer;
    list-style: none;
}

.owner-usage-organization summary::-webkit-details-marker {
    display: none;
}

.owner-usage-summary-main {
    display: flex;
    align-items: center;
    gap: 13px;
}

.owner-usage-avatar {
    width: 42px;
    height: 42px;
    border-radius: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 900;
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.95), rgba(99, 102, 241, 0.95));
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
}

.owner-usage-summary-main strong {
    display: block;
    color: #fff;
    font-size: 17px;
}

.owner-usage-summary-main small,
.owner-usage-section-title small,
.owner-usage-expanded-head p,
.owner-usage-mini-card small,
.owner-usage-total-card small {
    color: rgba(203, 213, 225, 0.74);
}

.owner-usage-summary-stats {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.owner-usage-summary-stats span {
    padding: 8px 10px;
    border-radius: 999px;
    color: rgba(226, 232, 240, 0.88);
    background: rgba(15, 23, 42, 0.6);
    border: 1px solid rgba(148, 163, 184, 0.16);
    font-size: 12px;
}

.owner-usage-summary-stats b {
    color: #fff;
}

.owner-usage-toggle {
    justify-self: end;
    padding: 9px 12px;
    border-radius: 999px;
    color: rgba(191, 219, 254, 0.95);
    background: rgba(99, 102, 241, 0.12);
    border: 1px solid rgba(148, 163, 184, 0.18);
    font-style: normal;
    font-weight: 800;
    font-size: 12px;
}

.owner-usage-organization[open] .owner-usage-toggle {
    color: #99f6e4;
    background: rgba(20, 184, 166, 0.14);
}

.owner-usage-organization[open] .owner-usage-toggle::before {
    content: "Collapse ";
}

.owner-usage-organization:not([open]) .owner-usage-toggle::before {
    content: "";
}

.owner-usage-expanded {
    padding: 0 20px 22px;
    border-top: 1px solid rgba(148, 163, 184, 0.12);
}

.owner-usage-expanded-head,
.owner-usage-section-title,
.owner-usage-mini-card > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.owner-usage-expanded-head {
    padding-top: 20px;
}

.owner-usage-expanded-head h3 {
    margin: 6px 0 4px;
    color: #fff;
    font-size: 22px;
}

.owner-usage-client-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.owner-usage-section-title {
    margin: 24px 0 12px;
    padding-top: 18px;
    border-top: 1px solid rgba(148, 163, 184, 0.14);
}

.owner-usage-section-title span {
    color: rgba(226, 232, 240, 0.96);
    font-weight: 900;
}

.owner-usage-metric-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.owner-usage-total-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.owner-usage-mini-card,
.owner-usage-total-card {
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 20px;
    padding: 17px;
    background:
        radial-gradient(circle at top right, rgba(20, 184, 166, 0.1), transparent 35%),
        rgba(2, 6, 23, 0.28);
}

.owner-usage-mini-card span,
.owner-usage-total-card span {
    color: rgba(191, 219, 254, 0.86);
    font-size: 12px;
    font-weight: 900;
}

.owner-usage-mini-card strong,
.owner-usage-total-card strong {
    display: block;
    margin-top: 10px;
    color: #fff;
    font-size: 20px;
    line-height: 1.15;
}

.owner-usage-progress {
    width: 100%;
    height: 9px;
    margin: 14px 0 8px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.16);
}

.owner-usage-progress span {
    display: block;
    height: 100%;
    max-width: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(16, 185, 129, 0.95), rgba(99, 102, 241, 0.95));
}

@media (max-width: 1180px) {
    .owner-usage-organization summary {
        grid-template-columns: 1fr;
    }

    .owner-usage-toggle {
        justify-self: start;
    }

    .owner-usage-metric-grid,
    .owner-usage-total-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .owner-usage-metric-grid,
    .owner-usage-total-grid {
        grid-template-columns: 1fr;
    }

    .owner-usage-expanded-head,
    .owner-usage-section-title,
    .owner-usage-mini-card > div:first-child {
        align-items: flex-start;
        flex-direction: column;
    }
}
.owner-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.owner-plan-card {
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 26px;
    padding: 22px;
    background:
        radial-gradient(circle at top right, rgba(99, 102, 241, 0.12), transparent 34%),
        rgba(15, 23, 42, 0.54);
}

.owner-plan-card-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.owner-plan-card h2 {
    margin: 14px 0 8px;
    color: #fff;
    font-size: 28px;
}

.owner-plan-price {
    color: #fff;
    font-size: 32px;
    line-height: 1;
}

.owner-plan-price small {
    font-size: 13px;
    color: rgba(203, 213, 225, 0.75);
}

.owner-plan-client-count {
    min-width: 82px;
    padding: 14px;
    border-radius: 20px;
    text-align: center;
    background: rgba(2, 6, 23, 0.28);
    border: 1px solid rgba(148, 163, 184, 0.16);
}

.owner-plan-client-count strong {
    display: block;
    color: #fff;
    font-size: 26px;
}

.owner-plan-client-count span,
.owner-plan-revenue span,
.owner-plan-limits span,
.owner-plan-usage span {
    color: rgba(191, 219, 254, 0.86);
    font-size: 12px;
    font-weight: 900;
}

.owner-plan-revenue {
    margin: 18px 0;
    padding: 16px;
    border-radius: 20px;
    background: rgba(16, 185, 129, 0.08);
    border: 1px solid rgba(16, 185, 129, 0.14);
}

.owner-plan-revenue strong {
    display: block;
    margin-top: 5px;
    color: #fff;
    font-size: 22px;
}

.owner-plan-limits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 18px;
}

.owner-plan-limits div,
.owner-plan-usage div,
.owner-plan-clients a {
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 16px;
    padding: 12px;
    background: rgba(2, 6, 23, 0.22);
}

.owner-plan-limits strong,
.owner-plan-usage strong {
    display: block;
    margin-top: 6px;
    color: #fff;
    font-size: 14px;
}

.owner-plan-usage {
    display: grid;
    gap: 10px;
}

.owner-plan-usage em {
    display: block;
    height: 8px;
    margin-top: 10px;
    border-radius: 999px;
    background:
        linear-gradient(90deg, rgba(16, 185, 129, 0.95), rgba(99, 102, 241, 0.95)) 0 0 / var(--w, 0%) 100% no-repeat,
        rgba(148, 163, 184, 0.16);
}

.owner-plan-clients {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.owner-plan-clients a {
    display: flex;
    flex-direction: column;
    text-decoration: none;
}

.owner-plan-clients a strong {
    color: #fff;
}

.owner-plan-clients a small {
    color: rgba(203, 213, 225, 0.7);
}

.empty-state.compact {
    padding: 12px;
    min-height: auto;
}

@media (max-width: 1200px) {
    .owner-plan-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .owner-plan-grid {
        grid-template-columns: 1fr;
    }

    .owner-plan-card-head {
        flex-direction: column;
    }

    .owner-plan-limits {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   Scan Knowledge Priority UI
   ========================================================= */

.inline-action-form{
    display:inline-flex;
    margin:0;
}

.scan-knowledge-panel{
    overflow:hidden;
}

.scan-knowledge-panel .panel-head{
    align-items:flex-start;
    gap:18px;
    margin-bottom:18px;
}

.scan-knowledge-panel .panel-head > div{
    min-width:260px;
}

.scan-knowledge-panel .card-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
}

.scan-knowledge-panel .card-actions .soft-btn,
.scan-knowledge-panel .card-actions .primary-btn{
    flex:0 0 auto;
    white-space:nowrap;
}

.scan-knowledge-panel .app-alert.info{
    color:color-mix(in srgb,var(--accent) 75%,var(--heading));
    background:color-mix(in srgb,var(--accent) 9%,var(--surface));
    border-color:color-mix(in srgb,var(--accent) 24%,var(--line));
}

.knowledge-toolbar{
    display:grid;
    grid-template-columns:minmax(280px,420px) minmax(0,1fr);
    gap:14px;
    align-items:start;
    margin:18px 0;
}

.knowledge-toolbar-search{
    min-height:52px;
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid var(--line);
    border-radius:18px;
    padding:0 14px;
    background:var(--surface);
    box-shadow:var(--shadow-soft);
}

.knowledge-toolbar-search span{
    color:var(--muted);
    font-size:12px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.06em;
    flex:0 0 auto;
}

.knowledge-toolbar-search input{
    width:100%;
    min-width:0;
    height:48px;
    border:0;
    outline:0;
    background:transparent;
    color:var(--text);
    font:inherit;
    font-size:14px;
    font-weight:850;
}

.knowledge-toolbar-search input::placeholder{
    color:var(--muted-2);
}

.knowledge-tag-cloud{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
}

.knowledge-tag-chip,
.knowledge-mini-tags button{
    appearance:none;
    -webkit-appearance:none;
    border:1px solid var(--line);
    border-radius:999px;
    background:var(--surface);
    color:var(--text);
    cursor:pointer;
    font-weight:900;
    line-height:1;
    transition:.18s ease;
}

.knowledge-tag-chip{
    min-height:34px;
    padding:0 12px;
    font-size:12px;
}

.knowledge-tag-chip:hover,
.knowledge-mini-tags button:hover{
    color:#fff;
    border-color:transparent;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 18%,transparent);
    transform:translateY(-1px);
}

.knowledge-grid{
    display:grid;
    gap:14px;
    margin-top:16px;
}

.knowledge-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(360px,430px);
    gap:16px;
    align-items:stretch;
    padding:16px;
    border:1px solid var(--line);
    border-radius:24px;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 34%),
        var(--surface);
    box-shadow:var(--shadow-soft);
}

.knowledge-card.is-featured{
    border-color:color-mix(in srgb,var(--primary) 48%,var(--line));
    box-shadow:0 18px 55px color-mix(in srgb,var(--primary) 14%,transparent);
}

.knowledge-card[hidden]{
    display:none!important;
}

.knowledge-page-main{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:11px;
    justify-content:center;
}

.knowledge-page-title{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.knowledge-page-title strong{
    color:var(--heading);
    font-size:16px;
    line-height:1.35;
    font-weight:950;
    word-break:break-word;
}

.knowledge-page-url{
    display:block;
    max-width:100%;
    color:color-mix(in srgb,var(--accent) 84%,var(--heading));
    font-size:12px;
    line-height:1.5;
    font-weight:800;
    word-break:break-word;
    text-decoration:none;
}

.knowledge-page-url:hover{
    color:var(--accent);
    text-decoration:underline;
    text-underline-offset:3px;
}

.knowledge-meta{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.knowledge-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:30px;
    padding:0 10px;
    border-radius:999px;
    border:1px solid var(--line);
    background:var(--panel);
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    white-space:nowrap;
}

.knowledge-pill.success{
    color:#027a52;
    background:#ecfdf3;
    border-color:rgba(16,185,129,.22);
}

body[data-theme="dark"] .knowledge-pill.success{
    color:#8df2c4;
    background:rgba(16,185,129,.13);
}

.knowledge-pill.featured{
    color:#fff;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-color:transparent;
}

.knowledge-editor{
    display:grid;
    gap:12px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:20px;
    background:var(--panel);
}

.knowledge-feature-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.knowledge-toggle{
    display:inline-flex!important;
    align-items:center!important;
    gap:10px!important;
    color:var(--heading);
    font-size:13px;
    font-weight:950;
    cursor:pointer;
}

.knowledge-toggle input[type="checkbox"]{
    appearance:auto;
    -webkit-appearance:checkbox;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    margin:0!important;
    padding:0!important;
    accent-color:var(--accent);
}

.knowledge-editor-grid{
    display:grid;
    grid-template-columns:100px minmax(0,1fr);
    gap:10px;
}

.knowledge-editor label{
    display:grid;
    gap:6px;
    min-width:0;
}

.knowledge-editor label span{
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.knowledge-editor input[type="number"],
.knowledge-editor input[type="text"]{
    width:100%;
    min-width:0;
    height:44px;
    border:1px solid var(--line);
    border-radius:14px;
    padding:0 12px;
    background:var(--surface);
    color:var(--text);
    outline:0;
    font-size:13px;
    font-weight:850;
}

.knowledge-editor input[type="number"]:focus,
.knowledge-editor input[type="text"]:focus{
    border-color:var(--accent);
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent);
}

.knowledge-editor-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.knowledge-mini-tags{
    display:flex;
    align-items:center;
    gap:7px;
    flex-wrap:wrap;
    min-width:0;
    flex:1 1 220px;
}

.knowledge-mini-tags button{
    min-height:30px;
    padding:0 9px;
    font-size:11px;
}

.knowledge-editor-actions .primary-btn{
    min-height:42px;
    border-radius:14px;
    padding:0 14px;
    flex:0 0 auto;
}

.knowledge-empty-search{
    margin-top:16px;
    padding:28px;
    border:1px dashed var(--line-strong);
    border-radius:24px;
    text-align:center;
    color:var(--muted);
    background:color-mix(in srgb,var(--surface) 82%,transparent);
    font-weight:900;
}

.knowledge-empty-search[hidden]{
    display:none!important;
}

@media (max-width:1180px){
    .knowledge-toolbar{
        grid-template-columns:1fr;
    }

    .knowledge-tag-cloud{
        justify-content:flex-start;
    }

    .knowledge-card{
        grid-template-columns:1fr;
    }
}

@media (max-width:680px){
    .scan-knowledge-panel .card-actions{
        justify-content:stretch;
    }

    .scan-knowledge-panel .card-actions .soft-btn,
    .scan-knowledge-panel .card-actions .primary-btn,
    .scan-knowledge-panel .card-actions form{
        width:100%;
    }

    .scan-knowledge-panel .card-actions form .soft-btn{
        width:100%;
    }

    .knowledge-toolbar-search{
        align-items:flex-start;
        flex-direction:column;
        height:auto;
        padding:12px;
    }

    .knowledge-toolbar-search input{
        height:40px;
    }

    .knowledge-feature-row{
        align-items:flex-start;
        flex-direction:column;
    }

    .knowledge-editor-grid{
        grid-template-columns:1fr;
    }

    .knowledge-editor-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .knowledge-editor-actions .primary-btn{
        width:100%;
    }
}
/* =========================================================
   FINAL Secure Ticket Reply Portal - app.css only
   ========================================================= */

body:has(.tpr-shell){
    margin:0!important;
    overflow:hidden!important;
    background:#070b16!important;
}

body:has(.tpr-shell) .auth-theme-toggle,
body:has(.tpr-shell) .theme-toggle,
body:has(.tpr-shell) .topbar,
body:has(.tpr-shell) .sidebar,
body:has(.tpr-shell) .app-shell > aside,
body:has(.tpr-shell) .app-header{
    display:none!important;
}

.tpr-shell{
    --tpr-text:#eaf1ff;
    --tpr-muted:#9baac0;
    --tpr-line:rgba(255,255,255,.12);

    position:fixed!important;
    inset:0!important;
    z-index:2147483000!important;
    width:100vw!important;
    height:100vh!important;
    overflow:auto!important;
    padding:40px 40px 80px!important;
    color:var(--tpr-text)!important;
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
    background:
        radial-gradient(circle at 10% 0%,rgba(255,255,255,.10),transparent 28%),
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--tpr-primary) 26%,transparent),transparent 36%),
        radial-gradient(circle at 82% 100%,rgba(6,182,212,.20),transparent 34%),
        linear-gradient(135deg,#070b16 0%,#0b1220 52%,#08283b 100%)!important;
}

.tpr-shell,
.tpr-shell *{
    box-sizing:border-box!important;
}

.tpr-page{
    width:min(1480px,100%)!important;
    max-width:1480px!important;
    margin:0 auto!important;
    display:flex!important;
    flex-direction:column!important;
    gap:26px!important;
}

.tpr-top{
    min-height:86px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;
    padding:18px 24px!important;
    border:1px solid var(--tpr-line)!important;
    border-radius:28px!important;
    background:rgba(15,23,42,.88)!important;
    box-shadow:0 18px 50px rgba(0,0,0,.24)!important;
    backdrop-filter:blur(20px)!important;
}

.tpr-brand{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:14px!important;
}

.tpr-logo{
    width:58px!important;
    height:58px!important;
    flex:0 0 auto!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    border-radius:19px!important;
    color:#fff!important;
    font-size:21px!important;
    font-weight:950!important;
    background:linear-gradient(135deg,var(--tpr-primary),var(--tpr-accent))!important;
    box-shadow:0 16px 34px rgba(0,0,0,.24)!important;
}

.tpr-logo img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
}

.tpr-brand strong{
    display:block!important;
    color:#fff!important;
    font-size:19px!important;
    line-height:1.15!important;
    font-weight:950!important;
    letter-spacing:-.035em!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.tpr-brand small{
    display:block!important;
    margin-top:4px!important;
    color:var(--tpr-muted)!important;
    font-size:12px!important;
    font-weight:850!important;
}

.tpr-status{
    min-height:36px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 15px!important;
    border-radius:999px!important;
    color:#8df2c4!important;
    background:rgba(16,185,129,.14)!important;
    border:1px solid rgba(16,185,129,.24)!important;
    font-size:12px!important;
    font-weight:950!important;
    text-transform:capitalize!important;
    flex:0 0 auto!important;
}

.tpr-status.pending{
    color:#fde68a!important;
    background:rgba(245,158,11,.14)!important;
    border-color:rgba(245,158,11,.25)!important;
}

.tpr-status.closed{
    color:#cbd5e1!important;
    background:rgba(148,163,184,.14)!important;
    border-color:rgba(148,163,184,.22)!important;
}

.tpr-alert{
    padding:15px 18px!important;
    border-radius:18px!important;
    color:#8df2c4!important;
    background:rgba(16,185,129,.14)!important;
    border:1px solid rgba(16,185,129,.22)!important;
    font-size:14px!important;
    font-weight:900!important;
}

.tpr-hero{
    min-height:270px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:flex-end!important;
    overflow:hidden!important;
    padding:50px!important;
    border-radius:34px!important;
    color:#fff!important;
    background:
        radial-gradient(circle at 82% 18%,rgba(255,255,255,.34),transparent 22%),
        radial-gradient(circle at 98% 45%,rgba(255,255,255,.20),transparent 18%),
        linear-gradient(135deg,var(--tpr-primary),var(--tpr-accent))!important;
    box-shadow:0 28px 80px color-mix(in srgb,var(--tpr-primary) 28%,transparent)!important;
}

.tpr-hero span{
    color:rgba(255,255,255,.86)!important;
    font-size:14px!important;
    font-weight:850!important;
}

.tpr-hero h1{
    margin:12px 0!important;
    color:#fff!important;
    font-size:clamp(56px,5.5vw,94px)!important;
    line-height:.94!important;
    letter-spacing:-.075em!important;
    word-break:break-word!important;
}

.tpr-hero p{
    margin:0!important;
    color:rgba(255,255,255,.94)!important;
    font-size:17px!important;
    font-weight:850!important;
    line-height:1.55!important;
}

.tpr-info-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:20px!important;
}

.tpr-info-grid article,
.tpr-card{
    border:1px solid var(--tpr-line)!important;
    background:
        radial-gradient(circle at 100% 0%,rgba(255,255,255,.06),transparent 32%),
        rgba(15,23,42,.84)!important;
    box-shadow:0 18px 46px rgba(0,0,0,.20)!important;
    backdrop-filter:blur(20px)!important;
}

.tpr-info-grid article{
    min-height:118px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:10px!important;
    padding:26px!important;
    border-radius:26px!important;
}

.tpr-info-grid span,
.tpr-section-head span{
    color:var(--tpr-muted)!important;
    font-size:12px!important;
    font-weight:950!important;
    letter-spacing:.085em!important;
    text-transform:uppercase!important;
}

.tpr-info-grid strong{
    color:#fff!important;
    font-size:17px!important;
    line-height:1.45!important;
    font-weight:950!important;
}

.tpr-card{
    padding:36px!important;
    border-radius:34px!important;
}

.tpr-section-head{
    margin-bottom:26px!important;
}

.tpr-section-head h2{
    margin:7px 0 0!important;
    color:#fff!important;
    font-size:38px!important;
    line-height:1.05!important;
    letter-spacing:-.055em!important;
}

.tpr-section-head p{
    max-width:760px!important;
    margin:11px 0 0!important;
    color:var(--tpr-muted)!important;
    font-size:16px!important;
    font-weight:760!important;
    line-height:1.65!important;
}

.tpr-chat{
    display:flex!important;
    flex-direction:column!important;
    gap:26px!important;
    width:100%!important;
    padding:36px!important;
    border-radius:30px!important;
    border:1px solid var(--tpr-line)!important;
    background:
        radial-gradient(circle at 0% 0%,rgba(6,182,212,.08),transparent 30%),
        rgba(8,13,28,.42)!important;
}

.tpr-msg{
    width:fit-content!important;
    min-width:360px!important;
    max-width:64%!important;
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
    padding:22px 24px!important;
    border-radius:26px!important;
    border:1px solid var(--tpr-line)!important;
    box-shadow:0 18px 38px rgba(0,0,0,.20)!important;
}

.tpr-msg.is-visitor{
    align-self:flex-end!important;
    margin-left:auto!important;
    margin-right:0!important;
    color:#fff!important;
    border-color:transparent!important;
    background:linear-gradient(135deg,var(--tpr-primary),var(--tpr-accent))!important;
    border-bottom-right-radius:8px!important;
}

.tpr-msg.is-assistant,
.tpr-msg.is-team{
    align-self:flex-start!important;
    margin-left:0!important;
    margin-right:auto!important;
    color:var(--tpr-text)!important;
    background:rgba(15,23,42,.90)!important;
    border-bottom-left-radius:8px!important;
}

.tpr-msg.is-team{
    background:
        radial-gradient(circle at 100% 0%,rgba(255,255,255,.08),transparent 34%),
        rgba(43,20,43,.90)!important;
    border-color:rgba(239,31,45,.25)!important;
}

.tpr-msg-meta{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
}

.tpr-msg-meta strong{
    color:inherit!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:950!important;
    text-transform:uppercase!important;
    letter-spacing:.085em!important;
}

.tpr-msg-meta small{
    color:inherit!important;
    opacity:.72!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
}

.tpr-msg p{
    margin:0!important;
    color:inherit!important;
    font-size:16px!important;
    line-height:1.75!important;
    font-weight:760!important;
    white-space:pre-wrap!important;
}

.tpr-reply{
    display:flex!important;
    flex-direction:column!important;
    gap:20px!important;
}

.tpr-reply label{
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
}

.tpr-reply label strong{
    color:#fff!important;
    font-size:15px!important;
    font-weight:950!important;
}

.tpr-reply textarea{
    width:100%!important;
    min-height:240px!important;
    padding:20px!important;
    border-radius:24px!important;
    border:1px solid var(--tpr-line)!important;
    background:rgba(8,13,28,.68)!important;
    color:var(--tpr-text)!important;
    outline:0!important;
    resize:vertical!important;
    font-size:16px!important;
    font-weight:750!important;
    line-height:1.7!important;
}

.tpr-reply textarea:focus{
    border-color:var(--tpr-accent)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--tpr-accent) 17%,transparent)!important;
}

.tpr-submit{
    width:100%!important;
    min-height:62px!important;
    border:0!important;
    border-radius:22px!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:950!important;
    cursor:pointer!important;
    background:linear-gradient(135deg,var(--tpr-primary),var(--tpr-accent))!important;
    box-shadow:0 18px 42px color-mix(in srgb,var(--tpr-primary) 24%,transparent)!important;
}

.tpr-safe-note{
    display:block!important;
    color:var(--tpr-muted)!important;
    font-size:13px!important;
    font-weight:760!important;
    line-height:1.5!important;
    text-align:center!important;
}

.tpr-empty{
    padding:20px!important;
    border:1px dashed var(--tpr-line)!important;
    border-radius:20px!important;
    color:var(--tpr-muted)!important;
    font-weight:850!important;
    text-align:center!important;
}

.tpr-error{
    min-height:360px!important;
    display:flex!important;
    align-items:center!important;
    gap:20px!important;
    padding:34px!important;
    border-radius:30px!important;
    border:1px solid var(--tpr-line)!important;
    background:rgba(15,23,42,.86)!important;
    box-shadow:0 18px 46px rgba(0,0,0,.20)!important;
}

.tpr-error-icon{
    width:64px!important;
    height:64px!important;
    flex:0 0 auto!important;
    display:grid!important;
    place-items:center!important;
    border-radius:22px!important;
    color:#fff!important;
    font-size:28px!important;
    font-weight:950!important;
    background:linear-gradient(135deg,#ef4444,#f97316)!important;
}

.tpr-error span{
    color:var(--tpr-muted)!important;
    font-size:12px!important;
    font-weight:950!important;
    letter-spacing:.085em!important;
    text-transform:uppercase!important;
}

.tpr-error h1{
    margin:7px 0 8px!important;
    color:#fff!important;
    font-size:clamp(34px,5vw,62px)!important;
    line-height:.96!important;
    letter-spacing:-.07em!important;
}

.tpr-error p{
    margin:0!important;
    color:var(--tpr-muted)!important;
    font-size:15px!important;
    line-height:1.7!important;
    font-weight:750!important;
}

@media(max-width:900px){
    .tpr-shell{
        padding:24px 14px 48px!important;
    }

    .tpr-page{
        width:min(700px,100%)!important;
        gap:18px!important;
    }

    .tpr-info-grid{
        grid-template-columns:1fr!important;
        gap:14px!important;
    }

    .tpr-hero{
        min-height:200px!important;
        padding:30px!important;
        border-radius:26px!important;
    }

    .tpr-hero h1{
        font-size:clamp(38px,11vw,54px)!important;
    }

    .tpr-card{
        padding:20px!important;
        border-radius:26px!important;
    }

    .tpr-chat{
        padding:18px!important;
        gap:18px!important;
        border-radius:22px!important;
    }

    .tpr-msg{
        max-width:78%!important;
        min-width:0!important;
    }
}

@media(max-width:560px){
    .tpr-shell{
        padding:16px 10px 36px!important;
    }

    .tpr-page{
        gap:14px!important;
    }

    .tpr-top{
        padding:14px!important;
        border-radius:22px!important;
    }

    .tpr-logo{
        width:48px!important;
        height:48px!important;
        border-radius:16px!important;
    }

    .tpr-brand strong{
        font-size:16px!important;
    }

    .tpr-brand small{
        font-size:11px!important;
    }

    .tpr-status{
        min-height:30px!important;
        padding:0 10px!important;
        font-size:10px!important;
    }

    .tpr-hero{
        min-height:178px!important;
        padding:24px!important;
        border-radius:24px!important;
    }

    .tpr-hero h1{
        margin:9px 0!important;
        font-size:38px!important;
        line-height:1!important;
        letter-spacing:-.06em!important;
    }

    .tpr-hero p{
        font-size:14px!important;
    }

    .tpr-info-grid article{
        min-height:86px!important;
        padding:18px!important;
        border-radius:20px!important;
    }

    .tpr-section-head h2{
        font-size:30px!important;
    }

    .tpr-section-head p{
        font-size:14px!important;
    }

    .tpr-card{
        padding:16px!important;
        border-radius:22px!important;
    }

    .tpr-chat{
        padding:14px!important;
        gap:14px!important;
        border-radius:20px!important;
    }

    .tpr-msg{
        max-width:88%!important;
        padding:15px!important;
        border-radius:20px!important;
    }

    .tpr-msg.is-visitor{
        margin-left:32px!important;
        border-bottom-right-radius:8px!important;
    }

    .tpr-msg.is-assistant,
    .tpr-msg.is-team{
        margin-right:32px!important;
        border-bottom-left-radius:8px!important;
    }

    .tpr-msg-meta{
        align-items:flex-start!important;
        flex-direction:column!important;
        gap:4px!important;
    }

    .tpr-msg p{
        font-size:14px!important;
        line-height:1.65!important;
    }

    .tpr-reply textarea{
        min-height:190px!important;
        border-radius:18px!important;
    }

    .tpr-error{
        align-items:flex-start!important;
        flex-direction:column!important;
        padding:22px!important;
        border-radius:24px!important;
    }
}
/* =========================================================
   Final Scan Show Page UI - isolated scan2 classes
   ========================================================= */

.scan2-progress-panel{
    margin-top:24px!important;
    overflow:hidden!important;
}

.scan2-progress-panel .panel-head,
.scan2-knowledge-panel .panel-head{
    align-items:flex-start!important;
    gap:18px!important;
}

.scan2-progress-bar{
    position:relative!important;
    width:100%!important;
    height:16px!important;
    margin:20px 0 22px!important;
    overflow:hidden!important;
    border-radius:999px!important;
    background:color-mix(in srgb,var(--muted) 16%,transparent)!important;
}

.scan2-progress-bar span{
    position:absolute!important;
    inset:0 auto 0 0!important;
    display:block!important;
    border-radius:inherit!important;
    background:linear-gradient(90deg,var(--primary),var(--accent))!important;
    box-shadow:0 12px 34px color-mix(in srgb,var(--accent) 28%,transparent)!important;
}

.scan2-progress-bar span:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.44),transparent)!important;
    animation:scanSweep 1.35s linear infinite!important;
}

.scan2-stat-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:16px!important;
}

.scan2-stat-grid article{
    position:relative!important;
    overflow:hidden!important;
    min-height:128px!important;
    padding:22px!important;
    border:1px solid var(--line)!important;
    border-radius:24px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 34%),
        var(--surface)!important;
    box-shadow:var(--shadow-soft)!important;
}

.scan2-stat-grid article:after{
    content:""!important;
    position:absolute!important;
    top:-46px!important;
    right:-46px!important;
    width:120px!important;
    height:120px!important;
    border-radius:999px!important;
    background:color-mix(in srgb,var(--primary) 16%,transparent)!important;
}

.scan2-stat-grid span,
.scan2-stat-grid small{
    position:relative!important;
    z-index:1!important;
    display:block!important;
    color:var(--muted)!important;
    font-size:12px!important;
    font-weight:950!important;
}

.scan2-stat-grid strong{
    position:relative!important;
    z-index:1!important;
    display:block!important;
    margin:10px 0!important;
    color:var(--heading)!important;
    font-size:38px!important;
    line-height:1!important;
    letter-spacing:-.055em!important;
}

.scan2-actions{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:10px!important;
    margin-top:18px!important;
}

.scan2-actions .soft-btn{
    box-shadow:none!important;
}

.scan2-info-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr)!important;
    gap:18px!important;
    margin-top:24px!important;
}

.scan2-detail-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
}

.scan2-detail-grid div{
    min-height:88px!important;
    padding:16px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background:var(--surface)!important;
}

.scan2-detail-grid span{
    display:block!important;
    margin-bottom:7px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}

.scan2-detail-grid strong{
    display:block!important;
    color:var(--heading)!important;
    font-size:14px!important;
    line-height:1.55!important;
    word-break:break-word!important;
}

.scan2-knowledge-panel{
    margin-top:24px!important;
    overflow:hidden!important;
}

.scan2-head-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:wrap!important;
    gap:10px!important;
}

.scan2-head-actions .soft-btn,
.scan2-head-actions .primary-btn{
    flex:0 0 auto!important;
    box-shadow:none!important;
    white-space:nowrap!important;
}

.scan2-toolbar{
    display:grid!important;
    grid-template-columns:minmax(300px,430px) minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    margin:20px 0 16px!important;
}

.scan2-search{
    min-height:54px!important;
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    padding:0 15px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background:var(--surface)!important;
    box-shadow:var(--shadow-soft)!important;
}

.scan2-search span{
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}

.scan2-search input{
    width:100%!important;
    min-width:0!important;
    height:50px!important;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    color:var(--text)!important;
    font-size:14px!important;
    font-weight:850!important;
}

.scan2-chip-cloud,
.scan2-mini-tags,
.scan2-saved-tags{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:8px!important;
}

.scan2-chip,
.scan2-mini-tags button,
.scan2-saved-tags span{
    appearance:none!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--surface)!important;
    color:var(--text)!important;
    font-weight:900!important;
    line-height:1!important;
}

.scan2-chip{
    min-height:34px!important;
    padding:0 12px!important;
    cursor:pointer!important;
    font-size:12px!important;
}

.scan2-mini-tags button{
    min-height:30px!important;
    padding:0 10px!important;
    cursor:pointer!important;
    font-size:11px!important;
}

.scan2-saved-tags span{
    min-height:28px!important;
    padding:0 10px!important;
    background:var(--panel)!important;
    color:var(--muted)!important;
    font-size:11px!important;
}

.scan2-chip:hover,
.scan2-mini-tags button:hover{
    color:#fff!important;
    border-color:transparent!important;
    background:linear-gradient(135deg,var(--primary),var(--accent))!important;
    transform:translateY(-1px)!important;
}

.scan2-page-grid{
    display:grid!important;
    gap:16px!important;
    margin-top:18px!important;
}

.scan2-page-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(390px,470px)!important;
    gap:16px!important;
    align-items:stretch!important;
    padding:18px!important;
    border:1px solid var(--line)!important;
    border-radius:26px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 34%),
        var(--surface)!important;
    box-shadow:var(--shadow-soft)!important;
}

.scan2-page-card.is-featured{
    border-color:color-mix(in srgb,var(--primary) 48%,var(--line))!important;
    box-shadow:0 18px 58px color-mix(in srgb,var(--primary) 14%,transparent)!important;
}

.scan2-page-card[hidden]{
    display:none!important;
}

.scan2-page-main{
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:14px!important;
}

.scan2-title-row{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:14px!important;
}

.scan2-title-row strong{
    display:block!important;
    color:var(--heading)!important;
    font-size:17px!important;
    line-height:1.35!important;
    font-weight:950!important;
    word-break:break-word!important;
}

.scan2-title-row a{
    display:block!important;
    margin-top:5px!important;
    color:color-mix(in srgb,var(--accent) 84%,var(--heading))!important;
    font-size:12px!important;
    line-height:1.55!important;
    font-weight:850!important;
    word-break:break-word!important;
}

.scan2-title-row a:hover{
    color:var(--accent)!important;
    text-decoration:underline!important;
    text-underline-offset:3px!important;
}

.scan2-meta{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:8px!important;
}

.scan2-pill{
    min-height:30px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    padding:0 10px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--panel)!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    white-space:nowrap!important;
}

.scan2-pill.success{
    color:#027a52!important;
    background:#ecfdf3!important;
    border-color:rgba(16,185,129,.22)!important;
}

body[data-theme="dark"] .scan2-pill.success{
    color:#8df2c4!important;
    background:rgba(16,185,129,.13)!important;
}

.scan2-pill.featured{
    color:#fff!important;
    background:linear-gradient(135deg,var(--primary),var(--accent))!important;
    border-color:transparent!important;
}

.scan2-editor{
    display:grid!important;
    gap:13px!important;
    padding:15px!important;
    border:1px solid var(--line)!important;
    border-radius:22px!important;
    background:var(--panel)!important;
}

.scan2-feature-row{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
}

.scan2-feature-row label{
    display:inline-flex!important;
    align-items:center!important;
    gap:10px!important;
    color:var(--heading)!important;
    font-size:13px!important;
    font-weight:950!important;
    cursor:pointer!important;
}

.scan2-feature-row input[type="checkbox"]{
    appearance:auto!important;
    -webkit-appearance:checkbox!important;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    margin:0!important;
    padding:0!important;
    accent-color:var(--accent)!important;
}

.scan2-editor-grid{
    display:grid!important;
    grid-template-columns:100px minmax(0,1fr)!important;
    gap:10px!important;
}

.scan2-editor-grid label{
    display:grid!important;
    gap:6px!important;
    min-width:0!important;
}

.scan2-editor-grid span{
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.07em!important;
    text-transform:uppercase!important;
}

.scan2-editor-grid input{
    width:100%!important;
    min-width:0!important;
    height:44px!important;
    padding:0 12px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:var(--surface)!important;
    color:var(--text)!important;
    outline:0!important;
    font-size:13px!important;
    font-weight:850!important;
}

.scan2-editor-grid input:focus{
    border-color:var(--accent)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent)!important;
}

.scan2-editor-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    flex-wrap:wrap!important;
}

.scan2-mini-tags{
    min-width:0!important;
    flex:1 1 220px!important;
}

.scan2-editor-actions .primary-btn{
    min-height:42px!important;
    padding:0 15px!important;
    border-radius:14px!important;
    flex:0 0 auto!important;
}

.scan2-empty-search{
    margin-top:16px!important;
    padding:28px!important;
    border:1px dashed var(--line-strong)!important;
    border-radius:24px!important;
    text-align:center!important;
    color:var(--muted)!important;
    background:color-mix(in srgb,var(--surface) 82%,transparent)!important;
    font-weight:900!important;
}

.scan2-empty-search[hidden]{
    display:none!important;
}

.scan2-knowledge-panel .app-alert.info{
    color:color-mix(in srgb,var(--accent) 75%,var(--heading))!important;
    background:color-mix(in srgb,var(--accent) 9%,var(--surface))!important;
    border-color:color-mix(in srgb,var(--accent) 24%,var(--line))!important;
}

@media(max-width:1280px){
    .scan2-stat-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }

    .scan2-info-grid,
    .scan2-toolbar,
    .scan2-page-card{
        grid-template-columns:1fr!important;
    }

    .scan2-chip-cloud{
        justify-content:flex-start!important;
    }
}

@media(max-width:720px){
    .scan2-stat-grid,
    .scan2-detail-grid,
    .scan2-editor-grid{
        grid-template-columns:1fr!important;
    }

    .scan2-head-actions,
    .scan2-actions{
        align-items:stretch!important;
        flex-direction:column!important;
    }

    .scan2-head-actions .soft-btn,
    .scan2-head-actions form,
    .scan2-head-actions form .soft-btn,
    .scan2-actions .soft-btn{
        width:100%!important;
    }

    .scan2-search{
        align-items:flex-start!important;
        flex-direction:column!important;
        padding:12px!important;
    }

    .scan2-search input{
        height:40px!important;
    }

    .scan2-title-row,
    .scan2-feature-row,
    .scan2-editor-actions{
        align-items:flex-start!important;
        flex-direction:column!important;
    }

    .scan2-editor-actions .primary-btn{
        width:100%!important;
    }
}

/* =========================================================
   FINAL Departments Index Compact CRM UI
   No inline CSS - global app.css only
   ========================================================= */

.dept2-panel .bulk-action-panel{
    min-height:72px!important;
    padding:14px 18px!important;
    margin:16px 0 22px!important;
    border-radius:24px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 35%),
        color-mix(in srgb,var(--surface) 92%,transparent)!important;
}

.dept2-panel .bulk-action-left{
    gap:14px!important;
}

.dept2-panel .bulk-action-left label{
    min-height:38px!important;
    padding:0 12px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--panel)!important;
}

.dept2-panel .bulk-action-right select{
    height:48px!important;
    min-width:230px!important;
    border-radius:18px!important;
}

.dept2-panel .bulk-action-right .primary-btn{
    height:48px!important;
    min-width:92px!important;
    border-radius:18px!important;
}

.dept2-list{
    display:grid!important;
    gap:16px!important;
}

.dept2-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 138px!important;
    gap:18px!important;
    align-items:start!important;
    padding:20px!important;
    border:1px solid var(--line)!important;
    border-radius:28px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 30%),
        var(--surface)!important;
    box-shadow:var(--shadow-soft)!important;
}

.dept2-row:hover{
    border-color:color-mix(in srgb,var(--accent) 28%,var(--line))!important;
    box-shadow:0 18px 52px color-mix(in srgb,var(--accent) 8%,transparent)!important;
}

.dept2-row-body{
    min-width:0!important;
}

.dept2-row .bulk-row-select{
    min-height:30px!important;
    margin:0 0 12px!important;
    padding:0!important;
    color:var(--muted)!important;
    font-size:12px!important;
}

.dept2-row .bulk-row-select span{
    font-size:12px!important;
}

.dept2-row-top{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:16px!important;
    align-items:start!important;
}

.dept2-kicker{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    margin-bottom:10px!important;
}

.dept2-kicker span{
    min-height:28px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:0 12px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--panel)!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.03em!important;
}

.dept2-row h3{
    max-width:980px!important;
    margin:0 0 14px!important;
    color:var(--heading)!important;
    font-size:24px!important;
    line-height:1.22!important;
    letter-spacing:-.035em!important;
}

.dept2-contact{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(160px,1fr))!important;
    gap:10px!important;
    max-width:860px!important;
    margin:0 0 12px!important;
}

.dept2-contact div{
    min-height:74px!important;
    padding:13px 15px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background:var(--panel)!important;
}

.dept2-contact span{
    display:block!important;
    margin-bottom:8px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}

.dept2-contact strong{
    display:block!important;
    color:var(--heading)!important;
    font-size:14px!important;
    line-height:1.35!important;
    word-break:break-word!important;
}

.dept2-badges{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    min-width:210px!important;
}

.dept2-badge{
    min-height:30px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 11px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--panel)!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    white-space:nowrap!important;
}

.dept2-badge.status-pending{
    color:#facc15!important;
    background:rgba(250,204,21,.10)!important;
    border-color:rgba(250,204,21,.25)!important;
}

.dept2-badge.status-approved{
    color:#67e8f9!important;
    background:rgba(34,211,238,.10)!important;
    border-color:rgba(34,211,238,.25)!important;
}

.dept2-badge.status-declined{
    color:#fb7185!important;
    background:rgba(244,63,94,.10)!important;
    border-color:rgba(244,63,94,.25)!important;
}

.dept2-source{
    margin-top:10px!important;
    padding:12px 14px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background:var(--panel)!important;
}

.dept2-source span{
    display:block!important;
    margin-bottom:7px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}

.dept2-source a{
    display:block!important;
    max-width:100%!important;
    color:color-mix(in srgb,var(--accent) 82%,var(--heading))!important;
    font-size:13px!important;
    font-weight:900!important;
    line-height:1.45!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.dept2-source a:hover{
    color:var(--accent)!important;
    text-decoration:underline!important;
    text-underline-offset:3px!important;
}

.dept2-topics{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    margin-top:12px!important;
}

.dept2-topics span{
    min-height:28px!important;
    display:inline-flex!important;
    align-items:center!important;
    padding:0 10px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--panel)!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:900!important;
    max-width:320px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.dept2-audit{
    margin-top:14px!important;
    border-top:1px solid var(--line)!important;
    padding-top:12px!important;
}

.dept2-audit summary{
    cursor:pointer!important;
    color:color-mix(in srgb,var(--accent) 82%,var(--heading))!important;
    font-size:13px!important;
    font-weight:950!important;
}

.dept2-actions{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:10px!important;
    position:sticky!important;
    top:92px!important;
}

.dept2-actions form,
.dept2-actions button{
    width:100%!important;
}

.dept2-actions .primary-btn,
.dept2-actions .soft-btn{
    min-height:48px!important;
    padding:0 14px!important;
    border-radius:18px!important;
    font-size:13px!important;
}

.dept2-actions .primary-btn{
    box-shadow:0 14px 34px color-mix(in srgb,var(--accent) 18%,transparent)!important;
}

.dept2-panel .table-wrap{
    margin-top:14px!important;
}

@media(max-width:1180px){
    .dept2-row{
        grid-template-columns:1fr!important;
    }

    .dept2-actions{
        position:static!important;
        flex-direction:row!important;
        flex-wrap:wrap!important;
    }

    .dept2-actions form{
        flex:1 1 140px!important;
    }

    .dept2-row-top{
        grid-template-columns:1fr!important;
    }

    .dept2-badges{
        justify-content:flex-start!important;
        min-width:0!important;
    }
}

@media(max-width:820px){
    .dept2-contact{
        grid-template-columns:1fr!important;
        max-width:none!important;
    }

    .dept2-row h3{
        font-size:20px!important;
    }

    .dept2-source a,
    .dept2-topics span{
        white-space:normal!important;
    }
}
/* =========================================================
   FINAL Global Bulk Alignment Fix
   Keep at absolute bottom of app.css
   ========================================================= */

.bulk-action-panel{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    flex-wrap:wrap!important;
}

.bulk-action-left,
.bulk-action-right{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
    flex-wrap:wrap!important;
}

.bulk-action-left label,
.bulk-row-select{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    line-height:1!important;
    vertical-align:middle!important;
}

.bulk-action-left label{
    min-height:40px!important;
    padding:0 13px!important;
}

.bulk-row-select{
    min-height:34px!important;
    margin:0 0 12px!important;
    padding:0!important;
}

.bulk-action-left label span,
.bulk-row-select span{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    line-height:1!important;
    margin:0!important;
    padding:0!important;
}

.bulk-action-panel input[type="checkbox"],
.bulk-row-select input[type="checkbox"],
.data-table input[data-bulk-checkbox],
.data-table input[data-bulk-check-all],
.data-table input[data-bulk-check-all-table]{
    appearance:none!important;
    -webkit-appearance:none!important;
    box-sizing:border-box!important;
    display:inline-block!important;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    max-width:18px!important;
    max-height:18px!important;
    margin:0!important;
    padding:0!important;
    flex:0 0 18px!important;
    vertical-align:middle!important;
    border:2px solid color-mix(in srgb,var(--muted) 70%,var(--line))!important;
    border-radius:5px!important;
    background:var(--surface)!important;
    cursor:pointer!important;
    position:relative!important;
    transform:none!important;
}

.bulk-action-panel input[type="checkbox"]:checked,
.bulk-row-select input[type="checkbox"]:checked,
.data-table input[data-bulk-checkbox]:checked,
.data-table input[data-bulk-check-all]:checked,
.data-table input[data-bulk-check-all-table]:checked{
    border-color:var(--accent)!important;
    background:var(--accent)!important;
}

.bulk-action-panel input[type="checkbox"]:checked::after,
.bulk-row-select input[type="checkbox"]:checked::after,
.data-table input[data-bulk-checkbox]:checked::after,
.data-table input[data-bulk-check-all]:checked::after,
.data-table input[data-bulk-check-all-table]:checked::after{
    content:""!important;
    position:absolute!important;
    left:4px!important;
    top:1px!important;
    width:5px!important;
    height:9px!important;
    border:solid #fff!important;
    border-width:0 2px 2px 0!important;
    transform:rotate(45deg)!important;
}

.bulk-action-panel input[type="checkbox"]:indeterminate,
.data-table input[data-bulk-check-all]:indeterminate,
.data-table input[data-bulk-check-all-table]:indeterminate{
    border-color:var(--accent)!important;
    background:var(--accent)!important;
}

.bulk-action-panel input[type="checkbox"]:indeterminate::after,
.data-table input[data-bulk-check-all]:indeterminate::after,
.data-table input[data-bulk-check-all-table]:indeterminate::after{
    content:""!important;
    position:absolute!important;
    left:4px!important;
    right:4px!important;
    top:7px!important;
    height:2px!important;
    border:0!important;
    background:#fff!important;
    transform:none!important;
}

.bulk-action-panel [data-bulk-count]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:40px!important;
    line-height:1!important;
    margin:0!important;
    padding:0!important;
}

.bulk-action-right select,
.bulk-action-right .primary-btn,
.bulk-action-right .soft-btn{
    align-self:center!important;
}

.bulk-action-right select{
    height:48px!important;
    line-height:48px!important;
    padding-top:0!important;
    padding-bottom:0!important;
}

.bulk-action-right .primary-btn,
.bulk-action-right .soft-btn{
    min-height:48px!important;
    height:48px!important;
    line-height:1!important;
}

.data-table .bulk-check-cell{
    width:48px!important;
    min-width:48px!important;
    text-align:center!important;
    vertical-align:middle!important;
}

.data-table .bulk-check-cell input{
    margin:0 auto!important;
}

.dept2-panel .bulk-action-panel{
    align-items:center!important;
}

.dept2-panel .bulk-action-left{
    align-items:center!important;
    justify-content:center!important;
}

.dept2-panel .bulk-action-left label{
    margin:0!important;
}

.dept2-row .bulk-row-select{
    align-items:center!important;
    justify-content:flex-start!important;
}

@media(max-width:720px){
    .bulk-action-panel{
        align-items:stretch!important;
    }

    .bulk-action-left,
    .bulk-action-right{
        width:100%!important;
        align-items:stretch!important;
        justify-content:flex-start!important;
    }

    .bulk-action-left label,
    .bulk-action-panel [data-bulk-count]{
        justify-content:flex-start!important;
    }
}
/* =========================================================
   FINAL Bulk Bar Real Alignment Fix
   Hidden input wrapper must not become a flex item
   ========================================================= */

.bulk-action-panel [data-bulk-hidden]{
    display:none!important;
    margin:10px 0px!important;
}

.bulk-action-panel{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    flex-wrap:wrap!important;
}

.bulk-action-left{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:12px!important;
    margin-right:auto!important;
}

.bulk-action-right{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:12px!important;
    margin-left:auto!important;
}

.bulk-action-left label{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0 13px!important;
    line-height:1!important;
}

.bulk-action-left label span,
.bulk-action-panel [data-bulk-count]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:40px!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
}

.bulk-action-right select{
    height:48px!important;
    min-height:48px!important;
    line-height:48px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    margin:0!important;
    align-self:center!important;
}

.bulk-action-right .primary-btn,
.bulk-action-right .soft-btn{
    height:48px!important;
    min-height:48px!important;
    margin:0!important;
    align-self:center!important;
    line-height:1!important;
}

.bulk-action-panel input[type="checkbox"],
.bulk-row-select input[type="checkbox"],
.data-table input[data-bulk-checkbox],
.data-table input[data-bulk-check-all],
.data-table input[data-bulk-check-all-table]{
    appearance:none!important;
    -webkit-appearance:none!important;
    box-sizing:border-box!important;
    display:inline-block!important;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    max-width:18px!important;
    max-height:18px!important;
    margin:0!important;
    padding:0!important;
    flex:0 0 18px!important;
    vertical-align:middle!important;
    border:2px solid color-mix(in srgb,var(--muted) 70%,var(--line))!important;
    border-radius:5px!important;
    background:var(--surface)!important;
    cursor:pointer!important;
    position:relative!important;
    transform:none!important;
}

.bulk-action-panel input[type="checkbox"]:checked,
.bulk-row-select input[type="checkbox"]:checked,
.data-table input[data-bulk-checkbox]:checked,
.data-table input[data-bulk-check-all]:checked,
.data-table input[data-bulk-check-all-table]:checked{
    border-color:var(--accent)!important;
    background:var(--accent)!important;
}

.bulk-action-panel input[type="checkbox"]:checked::after,
.bulk-row-select input[type="checkbox"]:checked::after,
.data-table input[data-bulk-checkbox]:checked::after,
.data-table input[data-bulk-check-all]:checked::after,
.data-table input[data-bulk-check-all-table]:checked::after{
    content:""!important;
    position:absolute!important;
    left:4px!important;
    top:1px!important;
    width:5px!important;
    height:9px!important;
    border:solid #fff!important;
    border-width:0 2px 2px 0!important;
    transform:rotate(45deg)!important;
}

.bulk-action-panel input[type="checkbox"]:indeterminate,
.data-table input[data-bulk-check-all]:indeterminate,
.data-table input[data-bulk-check-all-table]:indeterminate{
    border-color:var(--accent)!important;
    background:var(--accent)!important;
}

.bulk-action-panel input[type="checkbox"]:indeterminate::after,
.data-table input[data-bulk-check-all]:indeterminate::after,
.data-table input[data-bulk-check-all-table]:indeterminate::after{
    content:""!important;
    position:absolute!important;
    left:4px!important;
    right:4px!important;
    top:7px!important;
    height:2px!important;
    background:#fff!important;
}

.bulk-action-right select:focus{
    border-color:var(--accent)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent)!important;
    outline:none!important;
}

@media(max-width:720px){
    .bulk-action-panel{
        align-items:stretch!important;
    }

    .bulk-action-left,
    .bulk-action-right{
        width:100%!important;
        align-items:stretch!important;
        justify-content:flex-start!important;
        margin:0!important;
    }

    .bulk-action-left label,
    .bulk-action-panel [data-bulk-count]{
        justify-content:flex-start!important;
    }

    .bulk-action-right select,
    .bulk-action-right .primary-btn,
    .bulk-action-right .soft-btn{
        width:100%!important;
    }
}
/* =========================================================
   FINAL Bulk Dropdown Organization Theme Fix
   Keep below all bulk CSS
   ========================================================= */

.bulk-action-right select,
.bulk-action-panel select{
    appearance:none!important;
    -webkit-appearance:none!important;
    height:48px!important;
    min-height:48px!important;
    min-width:230px!important;
    padding:0 44px 0 16px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background-color:var(--surface)!important;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--muted) 50%),
        linear-gradient(135deg, var(--muted) 50%, transparent 50%)!important;
    background-position:
        calc(100% - 20px) 50%,
        calc(100% - 14px) 50%!important;
    background-size:
        6px 6px,
        6px 6px!important;
    background-repeat:no-repeat!important;
    color:var(--heading)!important;
    box-shadow:var(--shadow-soft)!important;
    font-size:14px!important;
    font-weight:950!important;
    line-height:48px!important;
    outline:none!important;
    cursor:pointer!important;
}

.bulk-action-right select:hover,
.bulk-action-panel select:hover{
    border-color:color-mix(in srgb,var(--accent) 36%,var(--line))!important;
    background-color:color-mix(in srgb,var(--surface) 92%,var(--accent))!important;
}

.bulk-action-right select:focus,
.bulk-action-panel select:focus{
    border-color:var(--accent)!important;
    background-color:var(--surface)!important;
    color:var(--heading)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent), var(--shadow-soft)!important;
}

.bulk-action-right select option,
.bulk-action-panel select option{
    background:#0f172a!important;
    color:#ffffff!important;
    font-weight:800!important;
}

body[data-theme="light"] .bulk-action-right select option,
body[data-theme="light"] .bulk-action-panel select option{
    background:#ffffff!important;
    color:#0f172a!important;
}
/* =========================================================
   FINAL Scan Knowledge Card Compact Inline Fix
   Keep at absolute bottom of app.css
   ========================================================= */

.scan2-page-grid{
    display:grid!important;
    gap:16px!important;
}

.scan2-page-card{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:14px!important;
    align-items:start!important;
    padding:18px!important;
    border-radius:26px!important;
    overflow:hidden!important;
}

.scan2-page-card .bulk-row-select{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:9px!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:34px!important;
    margin:0!important;
    padding:0!important;
    color:var(--heading)!important;
    font-size:13px!important;
    font-weight:900!important;
}

.scan2-page-main{
    min-width:0!important;
    width:100%!important;
}

.scan2-title-row{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:14px!important;
    width:100%!important;
    min-width:0!important;
}

.scan2-title-row > div{
    min-width:0!important;
    max-width:100%!important;
}

.scan2-title-row strong{
    display:block!important;
    max-width:100%!important;
    color:var(--heading)!important;
    font-size:20px!important;
    line-height:1.25!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.scan2-title-row a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:34px!important;
    margin-top:8px!important;
    padding:0 13px!important;
    border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line))!important;
    border-radius:999px!important;
    background:color-mix(in srgb,var(--accent) 10%,transparent)!important;
    color:var(--accent)!important;
    font-size:0!important;
    font-weight:950!important;
    line-height:1!important;
    text-decoration:none!important;
}

.scan2-title-row a::after{
    content:"Open page"!important;
    font-size:12px!important;
    line-height:1!important;
}

.scan2-title-row a:hover{
    background:color-mix(in srgb,var(--accent) 18%,transparent)!important;
    border-color:var(--accent)!important;
    color:var(--heading)!important;
    text-decoration:none!important;
}

.scan2-title-row .scan2-pill{
    flex:0 0 auto!important;
    margin-top:0!important;
}

.scan2-meta{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    margin-top:12px!important;
}

.scan2-saved-tags{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    margin-top:12px!important;
    max-width:100%!important;
}

.scan2-saved-tags span,
.scan2-mini-tags button,
.scan2-chip{
    max-width:240px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.scan2-editor{
    width:100%!important;
    min-width:0!important;
    padding:14px!important;
    border:1px solid var(--line)!important;
    border-radius:20px!important;
    background:color-mix(in srgb,var(--panel) 82%,transparent)!important;
}

.scan2-feature-row{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    flex-wrap:wrap!important;
}

.scan2-feature-row label{
    display:inline-flex!important;
    align-items:center!important;
    gap:9px!important;
    min-height:34px!important;
    margin:0!important;
    font-size:13px!important;
    font-weight:950!important;
    line-height:1!important;
}

.scan2-feature-row input[type="checkbox"]{
    appearance:none!important;
    -webkit-appearance:none!important;
    box-sizing:border-box!important;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    margin:0!important;
    border:2px solid color-mix(in srgb,var(--muted) 70%,var(--line))!important;
    border-radius:5px!important;
    background:var(--surface)!important;
    position:relative!important;
    cursor:pointer!important;
}

.scan2-feature-row input[type="checkbox"]:checked{
    border-color:var(--accent)!important;
    background:var(--accent)!important;
}

.scan2-feature-row input[type="checkbox"]:checked::after{
    content:""!important;
    position:absolute!important;
    left:4px!important;
    top:1px!important;
    width:5px!important;
    height:9px!important;
    border:solid #fff!important;
    border-width:0 2px 2px 0!important;
    transform:rotate(45deg)!important;
}

.scan2-editor-grid{
    display:grid!important;
    grid-template-columns:120px minmax(0,1fr)!important;
    gap:10px!important;
    margin-top:12px!important;
}

.scan2-editor-grid label{
    min-width:0!important;
}

.scan2-editor-grid input{
    min-width:0!important;
    width:100%!important;
}

.scan2-editor-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
    margin-top:14px!important;
}

.scan2-editor-actions .primary-btn{
    flex:0 0 auto!important;
    min-width:140px!important;
}

.scan2-mini-tags{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    min-width:0!important;
}

@media(min-width:1180px){
    .scan2-page-card{
        grid-template-columns:220px minmax(0,1fr) minmax(420px,520px)!important;
        grid-template-areas:
            "select main main"
            "editor editor editor"!important;
    }

    .scan2-page-card .bulk-row-select{
        grid-area:select!important;
        margin-top:3px!important;
    }

    .scan2-page-main{
        grid-area:main!important;
    }

    .scan2-editor{
        grid-area:editor!important;
    }
}

@media(max-width:760px){
    .scan2-title-row{
        flex-direction:column!important;
        align-items:flex-start!important;
    }

    .scan2-title-row strong{
        white-space:normal!important;
    }

    .scan2-editor-grid{
        grid-template-columns:1fr!important;
    }

    .scan2-editor-actions{
        align-items:stretch!important;
        flex-direction:column!important;
    }

    .scan2-editor-actions .primary-btn{
        width:100%!important;
    }
}
.logout-form {
    display: inline-flex;
    margin: 0;
}

.logout-form .soft-btn {
    cursor: pointer;
    font: inherit;
}
.backup-stats {
    margin-bottom: 18px;
}

.backup-stats .stat-card {
    min-height: 118px;
}

.backup-stats .stat-value {
    font-size: 28px;
    line-height: 1.15;
}

.audit-table-wrap.table-wrap {
    max-width: 100%;
    overflow-x: hidden !important;
}

.audit-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed;
}

.audit-table th,
.audit-table td {
    white-space: normal !important;
    vertical-align: top;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.audit-table .status-badge {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.35;
}

.audit-table th:nth-child(1),
.audit-table td:nth-child(1) {
    width: 105px;
}

.audit-table th:nth-child(2),
.audit-table td:nth-child(2) {
    width: 165px;
}

.audit-table th:nth-child(3),
.audit-table td:nth-child(3) {
    width: 150px;
}

.audit-table th:nth-child(4),
.audit-table td:nth-child(4) {
    width: 120px;
}

.audit-table th:nth-child(5),
.audit-table td:nth-child(5) {
    width: 90px;
}

.audit-table th:nth-child(6),
.audit-table td:nth-child(6) {
    width: 135px;
}

.audit-meta-cell small {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.45;
}

@media (max-width: 1100px) {
    .audit-table-wrap.table-wrap {
        overflow-x: auto !important;
    }

    .audit-table {
        min-width: 980px !important;
    }
}
.security-events-table-wrap {
    overflow-x: visible;
}

.security-events-table {
    width: 100%;
    table-layout: fixed;
}

.security-events-table th,
.security-events-table td {
    white-space: normal;
    vertical-align: top;
}

.security-events-table th:nth-child(1),
.security-events-table td:nth-child(1) {
    width: 115px;
}

.security-events-table th:nth-child(2),
.security-events-table td:nth-child(2) {
    width: 100px;
}

.security-events-table th:nth-child(3),
.security-events-table td:nth-child(3) {
    width: 230px;
}

.security-events-table th:nth-child(4),
.security-events-table td:nth-child(4) {
    width: 95px;
}

.security-events-table th:nth-child(5),
.security-events-table td:nth-child(5) {
    width: 160px;
}

.security-events-table th:nth-child(6),
.security-events-table td:nth-child(6) {
    width: 170px;
}

.security-event-path-cell small,
.security-event-meta-cell small {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .security-events-table-wrap {
        overflow-x: auto;
    }

    .security-events-table {
        min-width: 980px;
    }
}

/* =========================================================
   Luxe Chrome UI System
   Shared production redesign layer
   ========================================================= */

:root{
    --primary:var(--brand-primary,#312E81);
    --accent:var(--brand-accent,#06B6D4);
    --on-primary:#fff;
    --on-accent:#07111f;
    --radius:22px;
    --radius-sm:12px;
    --radius-md:16px;
    --radius-lg:26px;
    --font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --ease:cubic-bezier(.2,.8,.2,1);
}

html[data-theme="light"],
body[data-theme="light"]{
    color-scheme:light;
    --bg:#f3f6fb;
    --bg-2:#e9eef7;
    --surface:#ffffff;
    --surface-2:#f8fafc;
    --surface-3:#eef3fa;
    --panel:#ffffff;
    --panel-soft:rgba(255,255,255,.84);
    --chrome:#eef2f8;
    --chrome-2:#dfe7f1;
    --text:#121826;
    --heading:#070b12;
    --muted:#667085;
    --muted-2:#8b98aa;
    --line:rgba(20,28,42,.11);
    --line-strong:rgba(20,28,42,.18);
    --success:#079455;
    --warning:#b65c00;
    --danger:#d92d20;
    --info:#2563eb;
    --focus:rgba(var(--accent-rgb,6,182,212),.22);
    --shadow:0 24px 70px rgba(15,23,42,.13);
    --shadow-soft:0 14px 42px rgba(15,23,42,.09);
    --body-gradient:
        linear-gradient(120deg,rgba(var(--primary-rgb,49,46,129),.10),transparent 28%),
        linear-gradient(240deg,rgba(var(--accent-rgb,6,182,212),.12),transparent 30%),
        linear-gradient(180deg,#fbfcff 0%,#edf3fa 100%);
}

html[data-theme="dark"],
body[data-theme="dark"]{
    color-scheme:dark;
    --bg:#07080b;
    --bg-2:#0b0e14;
    --surface:#10141b;
    --surface-2:#151a23;
    --surface-3:#1a202b;
    --panel:#111720;
    --panel-soft:rgba(17,23,32,.78);
    --chrome:#1c212a;
    --chrome-2:#252b36;
    --text:#e8edf5;
    --heading:#ffffff;
    --muted:#a3adbc;
    --muted-2:#778294;
    --line:rgba(231,236,245,.10);
    --line-strong:rgba(231,236,245,.18);
    --success:#32d583;
    --warning:#fdb022;
    --danger:#ff6b5f;
    --info:#7cb7ff;
    --focus:rgba(var(--accent-rgb,6,182,212),.25);
    --shadow:0 30px 90px rgba(0,0,0,.50);
    --shadow-soft:0 18px 54px rgba(0,0,0,.34);
    --body-gradient:
        linear-gradient(125deg,rgba(var(--primary-rgb,49,46,129),.18),transparent 26%),
        linear-gradient(245deg,rgba(var(--accent-rgb,6,182,212),.14),transparent 30%),
        linear-gradient(180deg,#07080b 0%,#0b0e14 54%,#0a0d12 100%);
}

*{
    box-sizing:border-box;
}

html{
    min-height:100%;
    background:var(--bg);
    scroll-behavior:smooth;
}

body{
    min-height:100vh;
    margin:0;
    font-family:var(--font);
    color:var(--text);
    background:var(--body-gradient);
    overflow-x:hidden;
    text-rendering:optimizeLegibility;
}

body:before{
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background-image:
        linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);
    background-size:42px 42px;
    mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 78%);
}

body[data-theme="light"]:before{
    background-image:
        linear-gradient(rgba(20,28,42,.045) 1px,transparent 1px),
        linear-gradient(90deg,rgba(20,28,42,.035) 1px,transparent 1px);
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input,
textarea,
select{
    font:inherit;
}

img,
svg{
    max-width:100%;
}

.ui-icon{
    width:18px;
    height:18px;
    flex:0 0 18px;
}

.app-frame{
    display:grid;
    grid-template-columns:292px minmax(0,1fr);
    min-height:100vh;
    background:transparent;
}

.main-frame{
    min-width:0;
    display:flex;
    flex-direction:column;
}

.content-frame{
    width:100%;
    max-width:1720px;
    margin:0 auto;
    padding:30px clamp(18px,3vw,44px) 54px;
}

.sidebar{
    position:sticky;
    top:0;
    height:100vh;
    padding:22px 18px;
    display:flex;
    flex-direction:column;
    gap:20px;
    color:#f8fbff;
    background:
        linear-gradient(145deg,rgba(var(--accent-rgb,6,182,212),.14),transparent 30%),
        linear-gradient(180deg,rgba(var(--sidebar-bg-rgb,7,11,31),.96),#07080b 100%);
    border-right:1px solid rgba(255,255,255,.10);
    box-shadow:inset -1px 0 0 rgba(255,255,255,.04), 16px 0 50px rgba(0,0,0,.22);
    z-index:60;
}

.sidebar:after{
    content:"";
    position:absolute;
    inset:0 0 auto;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--accent),transparent);
    opacity:.55;
}

.brand-mark{
    min-height:58px;
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
    gap:13px;
    padding:8px;
    border-radius:20px;
    color:#fff;
}

a.brand-mark:hover{
    background:rgba(255,255,255,.06);
}

.brand-mark span{
    grid-row:span 2;
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    border-radius:16px;
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 18px 42px rgba(var(--accent-rgb,6,182,212),.22);
    font-weight:950;
}

.brand-mark strong,
.brand-mark small{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.brand-mark strong{
    align-self:end;
    color:#fff;
    font-size:16px;
    line-height:1.15;
    letter-spacing:0;
}

.brand-mark small{
    align-self:start;
    color:rgba(236,242,255,.62);
    font-size:11px;
    font-weight:760;
}

.side-nav{
    display:grid;
    gap:6px;
    overflow:auto;
    padding-right:2px;
}

.side-nav::-webkit-scrollbar{
    width:6px;
}

.side-nav::-webkit-scrollbar-thumb{
    background:rgba(255,255,255,.18);
    border-radius:999px;
}

.side-nav a,
.nav-item{
    min-height:44px;
    display:flex;
    align-items:center;
    gap:11px;
    padding:0 12px;
    border-radius:14px;
    color:rgba(239,245,255,.74);
    font-size:14px;
    font-weight:790;
    transition:background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease), box-shadow .18s var(--ease);
}

.side-nav a:hover,
.side-nav a.is-active,
.nav-item:hover,
.nav-item.is-active{
    color:#fff;
    background:linear-gradient(90deg,rgba(var(--primary-rgb,49,46,129),.48),rgba(var(--accent-rgb,6,182,212),.14));
    box-shadow:inset 3px 0 0 var(--accent), 0 12px 34px rgba(0,0,0,.18);
    transform:translateX(2px);
}

.nav-icon{
    color:currentColor;
    opacity:.92;
}

.sidebar-footer{
    margin-top:auto;
    display:grid;
    gap:4px;
    padding:15px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:18px;
    background:linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.045));
    color:rgba(239,245,255,.78);
    box-shadow:0 18px 48px rgba(0,0,0,.22);
}

.sidebar-footer-kicker{
    color:rgba(239,245,255,.58);
    font-size:11px;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.sidebar-footer strong{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#fff;
    font-size:13px;
}

.sidebar-scrim{
    display:none;
}

.topbar{
    position:sticky;
    top:0;
    z-index:50;
    min-height:76px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:14px clamp(18px,3vw,44px);
    background:color-mix(in srgb,var(--surface) 78%,transparent);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(22px);
    box-shadow:0 16px 40px rgba(0,0,0,.08);
}

.topbar-title-group{
    min-width:0;
    display:flex;
    align-items:center;
    gap:14px;
}

.topbar-title-group>div{
    min-width:0;
}

.topbar-kicker{
    display:block;
    color:var(--muted);
    font-size:12px;
    font-weight:800;
    margin-bottom:3px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.topbar strong{
    display:block;
    color:var(--heading);
    font-size:17px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.topbar-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
}

.menu-toggle,
.icon-btn,
.icon-btn-text,
.soft-btn,
.primary-btn,
.auth-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:1px solid var(--line);
    border-radius:14px;
    cursor:pointer;
    transition:transform .18s var(--ease), border-color .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease), color .18s var(--ease);
}

.menu-toggle{
    display:none;
    width:42px;
    height:42px;
    padding:0;
    background:var(--surface);
    color:var(--heading);
    box-shadow:var(--shadow-soft);
}

.soft-btn,
.auth-button{
    min-height:40px;
    padding:0 15px;
    background:linear-gradient(180deg,var(--surface),color-mix(in srgb,var(--surface-2) 78%,var(--accent)));
    color:var(--heading);
    font-size:13px;
    font-weight:850;
    box-shadow:var(--shadow-soft);
}

.soft-btn:hover,
.auth-button:hover,
.menu-toggle:hover{
    transform:translateY(-1px);
    border-color:color-mix(in srgb,var(--accent) 46%,var(--line));
    box-shadow:0 18px 46px rgba(var(--accent-rgb,6,182,212),.13);
}

.primary-btn,
.auth-form button,
.tpr-submit{
    min-height:46px;
    padding:0 18px;
    border:0;
    border-radius:15px;
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 18px 44px rgba(var(--primary-rgb,49,46,129),.24), inset 0 1px 0 rgba(255,255,255,.22);
    font-weight:940;
}

.primary-btn:hover,
.auth-form button:hover,
.tpr-submit:hover{
    transform:translateY(-1px);
    box-shadow:0 24px 58px rgba(var(--accent-rgb,6,182,212),.22), inset 0 1px 0 rgba(255,255,255,.25);
}

.danger-soft{
    color:var(--danger)!important;
}

.health-pill,
.live-badge,
.ticket-live-dot{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    color:var(--success);
    background:color-mix(in srgb,var(--success) 12%,var(--surface));
    border:1px solid color-mix(in srgb,var(--success) 24%,transparent);
    font-size:12px;
    font-weight:900;
    white-space:nowrap;
}

.health-pill i,
.live-badge i{
    width:8px;
    height:8px;
    border-radius:999px;
    background:var(--success);
    box-shadow:0 0 0 6px color-mix(in srgb,var(--success) 16%,transparent);
}

.theme-toggle{
    position:relative;
    width:158px;
    height:42px;
    padding:4px;
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    border:1px solid var(--line);
    border-radius:999px;
    background:linear-gradient(180deg,var(--surface),var(--surface-2));
    color:var(--muted);
    box-shadow:var(--shadow-soft);
    overflow:hidden;
}

.theme-toggle-option{
    position:relative;
    z-index:2;
    width:74px;
    height:32px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    font-size:12px;
    font-weight:900;
    line-height:1;
    user-select:none;
}

.theme-toggle-option .ui-icon{
    width:14px;
    height:14px;
    flex-basis:14px;
}

.theme-toggle-knob{
    position:absolute;
    z-index:1;
    top:4px;
    left:4px;
    width:74px;
    height:32px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 12px 28px rgba(var(--accent-rgb,6,182,212),.22);
    transition:transform .22s var(--ease);
}

.theme-toggle[data-mode="light"] .theme-toggle-light,
.theme-toggle[data-mode="dark"] .theme-toggle-dark{
    color:var(--on-primary,#fff);
}

.theme-toggle[data-mode="dark"] .theme-toggle-knob{
    transform:translateX(74px);
}

.logout-form{
    display:inline-flex;
    margin:0;
}

.page-hero{
    position:relative;
    overflow:hidden;
    min-height:210px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:42px clamp(22px,4vw,44px);
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    background:
        linear-gradient(135deg,rgba(var(--primary-rgb,49,46,129),.92),rgba(var(--accent-rgb,6,182,212),.62)),
        linear-gradient(180deg,#151922,#08090d);
    color:#fff;
    box-shadow:var(--shadow);
    isolation:isolate;
}

.page-hero:before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:
        linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px),
        linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px);
    background-size:34px 34px;
    mask-image:linear-gradient(90deg,transparent,black 24%,black 72%,transparent);
    opacity:.42;
}

.page-hero .eyebrow,
.eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:color-mix(in srgb,var(--accent) 70%,#fff);
    font-size:12px;
    font-weight:950;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.page-hero .eyebrow{
    color:rgba(255,255,255,.78);
    margin-bottom:12px;
}

.page-hero h1{
    margin:0 0 12px;
    color:#fff;
    font-size:clamp(30px,4vw,50px);
    line-height:1.02;
    letter-spacing:0;
}

.page-hero p{
    max-width:780px;
    margin:0;
    color:rgba(255,255,255,.82);
    font-size:15px;
    line-height:1.65;
}

.hero-orb{
    width:136px;
    height:112px;
    flex:0 0 136px;
    border-radius:24px;
    border:1px solid rgba(255,255,255,.20);
    background:
        linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.04)),
        repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0 1px,transparent 1px 18px);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.20), 0 24px 60px rgba(0,0,0,.26);
    opacity:.88;
    animation:none;
}

.dashboard-grid,
.panel-grid,
.site-grid,
.plan-grid,
.owner-plan-grid,
.scan2-info-grid,
.ticket-crm-grid,
.owner-usage-total-grid{
    display:grid;
    gap:18px;
}

.dashboard-grid{
    margin-top:24px;
}

.dashboard-grid-2,
.panel-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
}

.dashboard-grid-3,
.plan-grid,
.owner-plan-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.dashboard-grid-4,
.scan2-stat-grid,
.owner-usage-metric-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
}

.glass-panel,
.stat-card,
.site-card,
.plan-card,
.owner-plan-card,
.dept2-panel,
.dept2-card,
.org-team-create-panel,
.org-team-users-panel,
.org-team-user-card,
.owner-usage-total-card,
.owner-usage-organization,
.owner-usage-expanded,
.tpr-card{
    border:1px solid var(--line);
    background:linear-gradient(145deg,var(--panel-soft),color-mix(in srgb,var(--surface-2) 88%,var(--accent)));
    box-shadow:var(--shadow-soft);
    backdrop-filter:blur(20px);
}

.glass-panel,
.dept2-panel,
.org-team-create-panel,
.org-team-users-panel,
.owner-usage-expanded,
.tpr-card{
    border-radius:var(--radius-lg);
    padding:24px;
}

.stat-card,
.site-card,
.plan-card,
.owner-plan-card,
.dept2-card,
.org-team-user-card,
.owner-usage-total-card{
    border-radius:var(--radius);
    padding:22px;
}

.stat-card{
    position:relative;
    overflow:hidden;
    min-height:138px;
}

.stat-card:after{
    content:"";
    position:absolute;
    right:18px;
    top:18px;
    width:42px;
    height:42px;
    border-radius:15px;
    border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,transparent),transparent),
        linear-gradient(180deg,var(--surface),var(--surface-2));
    box-shadow:0 14px 32px rgba(var(--accent-rgb,6,182,212),.14);
}

.stat-label{
    display:block;
    max-width:calc(100% - 56px);
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    letter-spacing:.07em;
    text-transform:uppercase;
    margin-bottom:14px;
}

.stat-value{
    display:block;
    color:var(--heading);
    font-size:34px;
    line-height:1;
    font-weight:950;
    letter-spacing:0;
}

.stat-value.small-text{
    font-size:19px;
    line-height:1.25;
}

.stat-note{
    display:inline-flex;
    align-items:center;
    max-width:100%;
    min-height:28px;
    margin-top:14px;
    padding:0 10px;
    border-radius:999px;
    color:var(--success);
    background:color-mix(in srgb,var(--success) 12%,var(--surface));
    border:1px solid color-mix(in srgb,var(--success) 18%,transparent);
    font-size:12px;
    font-weight:900;
}

.stat-note.warning{
    color:var(--warning);
    background:color-mix(in srgb,var(--warning) 12%,var(--surface));
    border-color:color-mix(in srgb,var(--warning) 20%,transparent);
}

.stat-note.success{
    color:var(--success);
}

.panel-head,
.site-card-head,
.owner-plan-card-head,
.dept2-panel-head,
.dept2-card-head,
.org-team-user-top,
.owner-usage-expanded-head,
.tpr-section-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:20px;
}

.panel-head h2,
.site-card h2,
.plan-card h2,
.owner-plan-card h2,
.dept2-panel-head h2,
.dept2-card h2,
.tpr-section-head h2{
    margin:0;
    color:var(--heading);
    font-size:22px;
    line-height:1.22;
    letter-spacing:0;
}

.panel-head p,
.ticket-muted-copy,
.dept2-panel-head p,
.tpr-section-head p{
    margin:7px 0 0;
    color:var(--muted);
    font-size:13px;
    line-height:1.6;
}

.settings-form,
.table-panel,
.org-lists,
.scan2-info-grid,
.ticket-crm-grid{
    margin-top:24px;
}

.settings-grid{
    display:grid;
    grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);
    gap:18px;
    align-items:start;
}

.form-grid,
.form-grid-3,
.dept2-form-grid,
.org-team-form-grid,
.org-team-edit-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.form-grid-3{
    grid-template-columns:repeat(3,minmax(0,1fr));
}

.full-field,
.org-team-full,
.dept2-wide{
    grid-column:1 / -1;
}

label,
.field-title{
    color:var(--heading);
    font-size:13px;
    font-weight:880;
}

.form-grid label,
.auth-form label,
.dept2-form-grid label,
.org-team-form-grid label,
.org-team-edit-grid label,
.tpr-reply label,
.settings-form label{
    display:grid;
    gap:8px;
}

input,
select,
textarea,
.password-field{
    width:100%;
    min-width:0;
    border:1px solid var(--line);
    border-radius:15px;
    background:color-mix(in srgb,var(--surface) 92%,transparent);
    color:var(--text);
    outline:0;
    transition:border-color .18s var(--ease), box-shadow .18s var(--ease), background .18s var(--ease);
}

input,
select{
    min-height:46px;
    padding:0 14px;
}

textarea{
    min-height:112px;
    padding:12px 14px;
    line-height:1.55;
    resize:vertical;
}

input::placeholder,
textarea::placeholder{
    color:var(--muted-2);
}

input:focus,
select:focus,
textarea:focus,
.password-field:focus-within{
    border-color:var(--accent);
    box-shadow:0 0 0 5px var(--focus);
    background:var(--surface);
}

input[type="color"]{
    min-height:46px;
    padding:5px;
    cursor:pointer;
}

input[type="checkbox"],
input[type="radio"]{
    accent-color:var(--accent);
}

.password-field{
    display:flex;
    align-items:center;
    padding:0 6px 0 0;
    overflow:hidden;
}

.password-field input{
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
}

.password-field button{
    flex:0 0 auto;
    min-height:34px;
    border:0;
    border-radius:11px;
    padding:0 10px;
    color:var(--accent);
    background:color-mix(in srgb,var(--accent) 10%,transparent);
    font-size:12px;
    font-weight:900;
    cursor:pointer;
}

.switch-field{
    display:flex!important;
    align-items:center;
    gap:12px;
    min-height:46px;
    padding:0 14px;
    border:1px solid var(--line);
    border-radius:15px;
    background:color-mix(in srgb,var(--surface) 92%,transparent);
}

.switch-field input{
    width:18px;
    height:18px;
    min-height:auto;
}

.sticky-actions{
    position:sticky;
    bottom:18px;
    z-index:20;
    display:flex;
    justify-content:flex-end;
    gap:10px;
    margin-top:18px;
    padding:13px;
    border:1px solid var(--line);
    border-radius:20px;
    background:color-mix(in srgb,var(--panel-soft) 90%,transparent);
    backdrop-filter:blur(18px);
    box-shadow:var(--shadow-soft);
}

.sticky-actions.inline-actions{
    position:static;
    justify-content:flex-start;
    flex-wrap:wrap;
}

.table-wrap{
    width:100%;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
}

.data-table{
    width:100%;
    min-width:820px;
    border-collapse:separate;
    border-spacing:0 10px;
}

.data-table th{
    padding:0 14px 6px;
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    letter-spacing:.08em;
    text-align:left;
    text-transform:uppercase;
    white-space:nowrap;
}

.data-table td{
    padding:14px;
    vertical-align:middle;
    color:var(--text);
    background:color-mix(in srgb,var(--surface) 92%,transparent);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}

.data-table tr:hover td{
    background:color-mix(in srgb,var(--surface) 88%,var(--accent));
}

.data-table td:first-child{
    border-left:1px solid var(--line);
    border-radius:16px 0 0 16px;
}

.data-table td:last-child{
    border-right:1px solid var(--line);
    border-radius:0 16px 16px 0;
}

.data-table strong,
.mini-list strong,
.settings-info-list strong,
.details-grid strong{
    color:var(--heading);
    font-weight:900;
}

.data-table small,
.mini-list small,
.settings-info-list span,
.details-grid span,
.field-help,
.muted-line{
    color:var(--muted);
    line-height:1.5;
    overflow-wrap:anywhere;
}

.table-actions,
.card-actions,
.scan2-actions,
.scan2-head-actions,
.dept2-actions,
.org-team-card-actions,
.owner-usage-client-actions{
    display:flex;
    align-items:center;
    gap:9px;
    flex-wrap:wrap;
}

.table-actions{
    justify-content:flex-end;
}

.status-badge,
.dept2-badge,
.tpr-status,
.scan2-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:28px;
    padding:0 10px;
    border-radius:999px;
    color:var(--muted);
    background:color-mix(in srgb,var(--muted) 10%,var(--surface));
    border:1px solid color-mix(in srgb,var(--muted) 16%,transparent);
    font-size:12px;
    font-weight:940;
    font-style:normal;
    line-height:1;
    white-space:nowrap;
}

.status-badge.active,
.status-badge.completed,
.status-badge.resolved,
.status-badge.done,
.dept2-badge.status-approved,
.tpr-status.resolved{
    color:var(--success);
    background:color-mix(in srgb,var(--success) 12%,var(--surface));
    border-color:color-mix(in srgb,var(--success) 22%,transparent);
}

.status-badge.warning,
.status-badge.pending,
.status-badge.running,
.status-badge.queued,
.status-badge.processing,
.dept2-badge.status-pending,
.tpr-status.pending{
    color:var(--warning);
    background:color-mix(in srgb,var(--warning) 12%,var(--surface));
    border-color:color-mix(in srgb,var(--warning) 22%,transparent);
}

.status-badge.failed,
.status-badge.suspended,
.status-badge.inactive,
.status-badge.closed,
.status-badge.paused,
.dept2-badge.status-declined,
.tpr-status.closed{
    color:var(--danger);
    background:color-mix(in srgb,var(--danger) 10%,var(--surface));
    border-color:color-mix(in srgb,var(--danger) 20%,transparent);
}

.empty-state,
.tpr-empty{
    padding:18px;
    border:1px dashed var(--line-strong);
    border-radius:18px;
    color:var(--muted);
    background:color-mix(in srgb,var(--surface) 70%,transparent);
    line-height:1.6;
    overflow-wrap:anywhere;
}

.mini-list,
.settings-info-list,
.details-grid,
.action-list,
.mini-usage-list,
.team-list,
.owner-plan-limits,
.owner-plan-usage,
.owner-plan-clients,
.owner-usage-accordion{
    display:grid;
    gap:12px;
}

.mini-list a,
.mini-list>div,
.settings-info-list div,
.details-grid div,
.mini-usage-list div,
.action-list>*,
.owner-plan-limits li,
.owner-plan-usage div,
.owner-plan-clients a,
.owner-usage-mini-card{
    min-width:0;
    padding:15px;
    border:1px solid var(--line);
    border-radius:18px;
    background:color-mix(in srgb,var(--surface) 86%,transparent);
}

.mini-list a,
.mini-list>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

.mini-list a:hover,
.site-card:hover,
.owner-plan-card:hover,
.dept2-card:hover,
.org-team-user-card:hover{
    border-color:color-mix(in srgb,var(--accent) 36%,var(--line));
    transform:translateY(-1px);
    box-shadow:0 22px 58px rgba(var(--accent-rgb,6,182,212),.11);
}

.mini-usage-list em,
.owner-usage-progress,
.scan2-progress-bar{
    display:block;
    width:100%;
    height:9px;
    border-radius:999px;
    overflow:hidden;
    background:color-mix(in srgb,var(--muted) 15%,transparent);
}

.mini-usage-list em:after,
.owner-usage-progress span,
.scan2-progress-bar span{
    content:"";
    display:block;
    width:var(--w,0%);
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--primary),var(--accent));
    box-shadow:0 0 18px rgba(var(--accent-rgb,6,182,212),.24);
}

.usage-ring-row{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    align-items:center;
}

.usage-ring{
    position:relative;
    width:142px;
    height:142px;
    margin:0 auto;
    display:grid;
    place-items:center;
}

.usage-ring svg{
    position:absolute;
    inset:0;
    transform:rotate(-90deg);
}

.usage-ring circle{
    fill:none;
    stroke-width:11;
}

.usage-ring .ring-bg{
    stroke:color-mix(in srgb,var(--muted) 16%,transparent);
}

.usage-ring .ring-progress{
    stroke:var(--accent);
    stroke-linecap:round;
    stroke-dasharray:327;
    stroke-dashoffset:327;
    filter:drop-shadow(0 8px 16px rgba(var(--accent-rgb,6,182,212),.28));
    transition:stroke-dashoffset .9s var(--ease);
}

.usage-ring span{
    position:relative;
    z-index:1;
    display:grid;
    gap:5px;
    place-items:center;
}

.usage-ring b{
    color:var(--heading);
    font-size:26px;
    line-height:1;
    font-weight:950;
}

.usage-ring small{
    color:var(--muted);
    font-size:12px;
    font-weight:900;
}

.site-grid{
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}

.site-card,
.owner-plan-card,
.dept2-card,
.org-team-user-card{
    transition:transform .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease);
}

.site-icon,
.org-team-avatar,
.owner-usage-avatar,
.selected-icon-preview,
.launcher-preview-icon{
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    flex:0 0 48px;
    border-radius:17px;
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),var(--accent));
    box-shadow:0 16px 34px rgba(var(--accent-rgb,6,182,212),.20);
    font-weight:950;
}

.site-meta,
.dept2-topics,
.dept2-badges,
.dept2-hero-tags,
.domain-chip-wrap,
.scan-tabs,
.scan2-meta,
.scan2-saved-tags,
.scan2-mini-tags,
.scan2-chip-cloud,
.ticket-routing-pills,
.org-team-badges,
.org-team-dept-grid{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.site-meta span,
.dept2-topics span,
.domain-chip,
.scan-tabs a,
.scan2-chip,
.scan2-saved-tags span,
.scan2-mini-tags button,
.ticket-routing-pills span,
.org-team-dept-pill,
.org-team-badges span{
    max-width:100%;
    min-height:30px;
    display:inline-flex;
    align-items:center;
    padding:0 10px;
    border:1px solid var(--line);
    border-radius:999px;
    background:color-mix(in srgb,var(--surface) 78%,transparent);
    color:var(--muted);
    font-size:12px;
    font-weight:850;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.scan-tabs a.active,
.dept2-tabs a.active,
.launcher-tabs button.active{
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-color:transparent;
}

.dept2-tabs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:0 0 18px;
}

.dept2-tabs a{
    min-height:40px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0 13px;
    border:1px solid var(--line);
    border-radius:999px;
    background:color-mix(in srgb,var(--surface) 86%,transparent);
    color:var(--muted);
    font-size:13px;
    font-weight:900;
}

.dept2-tabs span{
    min-width:22px;
    min-height:22px;
    display:grid;
    place-items:center;
    padding:0 6px;
    border-radius:999px;
    background:rgba(255,255,255,.14);
}

.bulk-action-panel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    flex-wrap:wrap;
    margin-bottom:18px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:20px;
    background:color-mix(in srgb,var(--surface) 82%,transparent);
}

.bulk-action-left,
.bulk-action-right{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.bulk-check-cell{
    width:52px;
    text-align:center;
}

.chat-layout-grid,
.ticket-crm-grid{
    grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);
}

.chat-transcript,
.ticket-chat-thread,
.tpr-chat{
    display:flex;
    flex-direction:column;
    gap:12px;
    max-height:620px;
    overflow:auto;
    padding:14px;
    border:1px solid var(--line);
    border-radius:22px;
    background:linear-gradient(180deg,color-mix(in srgb,var(--surface-2) 84%,transparent),color-mix(in srgb,var(--surface) 84%,transparent));
}

.chat-bubble,
.ticket-chat-bubble,
.tpr-msg{
    max-width:min(760px,92%);
    padding:13px 15px;
    border:1px solid var(--line);
    border-radius:20px;
    color:var(--text);
    background:var(--surface);
    line-height:1.6;
    overflow-wrap:anywhere;
}

.chat-bubble.visitor,
.ticket-chat-bubble.visitor,
.tpr-msg.is-visitor{
    align-self:flex-end;
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),var(--accent));
    border-color:transparent;
}

.chat-bubble.assistant,
.ticket-chat-bubble.assistant,
.tpr-msg.is-assistant{
    align-self:flex-start;
}

.ticket-chat-bubble.team,
.tpr-msg.is-team{
    align-self:flex-start;
    border-color:color-mix(in srgb,var(--accent) 28%,var(--line));
    background:color-mix(in srgb,var(--accent) 10%,var(--surface));
}

.ticket-chat-meta,
.tpr-msg-meta{
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin-bottom:7px;
    color:var(--muted);
    font-size:12px;
    font-weight:850;
}

.ticket-main-message,
.disabled-reply-box{
    margin-top:18px;
    padding:16px;
    border:1px solid var(--line);
    border-radius:20px;
    background:color-mix(in srgb,var(--surface-2) 84%,transparent);
    overflow-wrap:anywhere;
}

.ticket-main-message span{
    display:block;
    color:var(--muted);
    font-size:12px;
    font-weight:950;
    letter-spacing:.08em;
    text-transform:uppercase;
    margin-bottom:8px;
}

.ticket-main-message p{
    margin:0;
    line-height:1.65;
}

.scan2-progress-panel,
.scan2-knowledge-panel{
    margin-top:24px;
}

.scan2-progress-bar span{
    width:0;
}

.scan2-stat-grid article,
.scan2-detail-grid div{
    padding:16px;
    border:1px solid var(--line);
    border-radius:18px;
    background:color-mix(in srgb,var(--surface) 86%,transparent);
}

.scan2-stat-grid article span,
.scan2-detail-grid span{
    display:block;
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    letter-spacing:.08em;
    text-transform:uppercase;
    margin-bottom:8px;
}

.scan2-stat-grid article strong,
.scan2-detail-grid strong{
    color:var(--heading);
    font-size:22px;
    overflow-wrap:anywhere;
}

.scan2-detail-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

.scan2-page-grid{
    display:grid;
    gap:14px;
}

.scan2-page-card{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:14px;
    padding:18px;
    border:1px solid var(--line);
    border-radius:22px;
    background:color-mix(in srgb,var(--surface) 84%,transparent);
}

.scan2-title-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
}

.scan2-title-row strong{
    display:block;
    color:var(--heading);
    font-size:18px;
    line-height:1.3;
    overflow-wrap:anywhere;
}

.scan2-editor{
    padding:14px;
    border:1px solid var(--line);
    border-radius:18px;
    background:color-mix(in srgb,var(--surface-2) 84%,transparent);
}

.scan2-editor-grid{
    display:grid;
    grid-template-columns:120px minmax(0,1fr);
    gap:10px;
}

.app-alert{
    padding:13px 15px;
    border:1px solid var(--line);
    border-radius:16px;
    font-size:13px;
    font-weight:850;
    line-height:1.5;
    box-shadow:var(--shadow-soft);
}

.app-alert.success,
.tpr-alert{
    color:var(--success);
    background:color-mix(in srgb,var(--success) 12%,var(--surface));
    border-color:color-mix(in srgb,var(--success) 22%,transparent);
}

.app-alert.error,
.tpr-error{
    color:var(--danger);
    background:color-mix(in srgb,var(--danger) 10%,var(--surface));
    border-color:color-mix(in srgb,var(--danger) 20%,transparent);
}

.app-alert.warning{
    color:var(--warning);
    background:color-mix(in srgb,var(--warning) 12%,var(--surface));
    border-color:color-mix(in srgb,var(--warning) 22%,transparent);
}

.toast-stack{
    position:fixed;
    right:22px;
    bottom:22px;
    z-index:200;
    display:grid;
    gap:10px;
}

.toast{
    padding:13px 15px;
    border:1px solid var(--line);
    border-radius:16px;
    color:var(--heading);
    background:var(--surface);
    box-shadow:var(--shadow);
    font-size:13px;
    font-weight:850;
    animation:toastIn .22s var(--ease) both;
}

.tpr-shell{
    --primary:var(--tpr-primary,#312E81);
    --accent:var(--tpr-accent,#06B6D4);
    min-height:100vh;
    width:100%;
    padding:28px;
    background:var(--body-gradient);
}

.tpr-page{
    width:min(1060px,100%);
    margin:0 auto;
}

.tpr-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:22px;
    padding:14px;
    border:1px solid var(--line);
    border-radius:22px;
    background:color-mix(in srgb,var(--surface) 84%,transparent);
    box-shadow:var(--shadow-soft);
}

.tpr-brand{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
}

.tpr-logo{
    width:48px;
    height:48px;
    flex:0 0 48px;
    display:grid;
    place-items:center;
    border-radius:16px;
    color:var(--on-primary,#fff);
    background:linear-gradient(135deg,var(--primary),var(--accent));
    overflow:hidden;
    font-weight:950;
}

.tpr-logo img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.tpr-brand strong,
.tpr-brand small{
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.tpr-brand strong{
    color:var(--heading);
    font-weight:950;
}

.tpr-brand small{
    color:var(--muted);
    font-size:12px;
    margin-top:3px;
}

.tpr-hero{
    padding:36px;
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    color:#fff;
    background:
        linear-gradient(135deg,rgba(var(--primary-rgb,49,46,129),.90),rgba(var(--accent-rgb,6,182,212),.56)),
        #10141b;
    box-shadow:var(--shadow);
}

.tpr-hero span,
.tpr-section-head span{
    display:block;
    color:color-mix(in srgb,var(--accent) 70%,#fff);
    font-size:12px;
    font-weight:950;
    letter-spacing:.1em;
    text-transform:uppercase;
    margin-bottom:8px;
}

.tpr-hero h1{
    margin:0 0 10px;
    font-size:clamp(32px,5vw,52px);
    line-height:1;
}

.tpr-hero p{
    margin:0;
    max-width:760px;
    color:rgba(255,255,255,.84);
    line-height:1.65;
}

.tpr-info-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    margin:18px 0;
}

.tpr-info-grid article{
    padding:16px;
    border:1px solid var(--line);
    border-radius:18px;
    background:color-mix(in srgb,var(--surface) 84%,transparent);
}

.tpr-info-grid span{
    display:block;
    color:var(--muted);
    font-size:11px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:7px;
}

.tpr-info-grid strong{
    color:var(--heading);
    overflow-wrap:anywhere;
}

.tpr-reply textarea{
    min-height:150px;
}

.tpr-safe-note{
    display:block;
    margin-top:12px;
    color:var(--muted);
    line-height:1.5;
}

.tpr-error{
    display:grid;
    grid-template-columns:56px minmax(0,1fr);
    gap:16px;
    padding:24px;
    border-radius:var(--radius);
}

.tpr-error-icon{
    width:56px;
    height:56px;
    display:grid;
    place-items:center;
    border-radius:18px;
    color:#fff;
    background:var(--danger);
    font-weight:950;
}

.code-box,
.key-box,
.secret-box{
    padding:14px;
    border:1px solid var(--line);
    border-radius:16px;
    background:color-mix(in srgb,var(--surface-2) 84%,transparent);
    color:var(--heading);
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    overflow:auto;
}

.owner-email-preview,
.preview-panel,
.widget-preview-card,
.launcher-live-preview{
    border:1px solid var(--line);
    border-radius:var(--radius);
    background:linear-gradient(145deg,var(--surface),var(--surface-2));
    box-shadow:var(--shadow-soft);
}

@keyframes toastIn{
    from{opacity:0;transform:translateY(10px)}
    to{opacity:1;transform:translateY(0)}
}

@media (max-width:1180px){
    .app-frame{
        grid-template-columns:1fr;
    }

    .sidebar{
        position:fixed;
        inset:0 auto 0 0;
        width:min(310px,86vw);
        transform:translateX(-104%);
        transition:transform .24s var(--ease);
    }

    .sidebar.is-open{
        transform:translateX(0);
    }

    .sidebar-scrim{
        position:fixed;
        inset:0;
        z-index:55;
        display:block;
        opacity:0;
        pointer-events:none;
        border:0;
        background:rgba(0,0,0,.48);
        backdrop-filter:blur(2px);
        transition:opacity .2s var(--ease);
    }

    body.sidebar-open .sidebar-scrim{
        opacity:1;
        pointer-events:auto;
    }

    .menu-toggle{
        display:inline-flex;
    }

    .dashboard-grid-4,
    .scan2-stat-grid,
    .owner-usage-metric-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .dashboard-grid-3,
    .plan-grid,
    .owner-plan-grid,
    .settings-grid,
    .panel-grid,
    .chat-layout-grid,
    .ticket-crm-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width:760px){
    .content-frame{
        padding:20px 14px 40px;
    }

    .topbar{
        align-items:flex-start;
        padding:12px 14px;
    }

    .topbar-actions{
        gap:8px;
    }

    .health-pill{
        display:none;
    }

    .theme-toggle{
        width:132px;
    }

    .theme-toggle-option,
    .theme-toggle-knob{
        width:62px;
    }

    .theme-toggle[data-mode="dark"] .theme-toggle-knob{
        transform:translateX(62px);
    }

    .page-hero{
        min-height:0;
        padding:28px 20px;
    }

    .hero-orb{
        display:none;
    }

    .dashboard-grid-2,
    .dashboard-grid-3,
    .dashboard-grid-4,
    .scan2-stat-grid,
    .owner-usage-metric-grid,
    .usage-ring-row,
    .form-grid,
    .form-grid-3,
    .dept2-form-grid,
    .org-team-form-grid,
    .org-team-edit-grid,
    .scan2-detail-grid,
    .tpr-info-grid{
        grid-template-columns:1fr;
    }

    .panel-head,
    .site-card-head,
    .owner-plan-card-head,
    .dept2-panel-head,
    .dept2-card-head,
    .scan2-title-row,
    .tpr-top{
        display:grid;
        grid-template-columns:1fr;
    }

    .sticky-actions,
    .sticky-actions.inline-actions,
    .bulk-action-panel,
    .bulk-action-left,
    .bulk-action-right,
    .card-actions,
    .table-actions,
    .scan2-actions,
    .scan2-head-actions{
        align-items:stretch;
        justify-content:stretch;
    }

    .sticky-actions .primary-btn,
    .sticky-actions .soft-btn,
    .bulk-action-right select,
    .bulk-action-right .primary-btn,
    .card-actions .soft-btn,
    .card-actions .primary-btn,
    .scan2-actions .soft-btn,
    .scan2-head-actions .soft-btn{
        width:100%;
    }

    .data-table{
        min-width:760px;
    }

    .tpr-shell{
        padding:14px;
    }
}

@media (max-width:520px){
    .topbar{
        display:grid;
        grid-template-columns:1fr;
    }

    .topbar-actions{
        justify-content:flex-start;
    }

    .logout-form .soft-btn span{
        display:none;
    }

    .page-hero h1{
        font-size:30px;
    }

    .stat-card,
    .glass-panel,
    .dept2-panel,
    .tpr-card{
        padding:18px;
    }
}

@media (prefers-reduced-motion:reduce){
    *,
    *:before,
    *:after{
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        scroll-behavior:auto!important;
        transition-duration:.01ms!important;
    }
}

/* Scan domain-scope + stop-run UI polish */
.scan2-status-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:wrap!important;
    gap:10px!important;
}

.scan2-actions .soft-btn,
.scan2-head-actions .soft-btn,
.scan2-status-actions .soft-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
}

.scan2-actions .soft-btn .ui-icon,
.scan2-head-actions .soft-btn .ui-icon,
.scan2-status-actions .soft-btn .ui-icon{
    width:16px!important;
    height:16px!important;
    flex:0 0 16px!important;
}

.scan2-stat-icon{
    position:relative!important;
    z-index:1!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:38px!important;
    height:38px!important;
    margin:0 0 12px!important;
    border-radius:14px!important;
    color:var(--primary)!important;
    background:color-mix(in srgb,var(--primary) 12%,var(--surface))!important;
    border:1px solid color-mix(in srgb,var(--primary) 18%,transparent)!important;
    box-shadow:0 12px 30px color-mix(in srgb,var(--primary) 12%,transparent)!important;
}

.scan2-stat-icon .ui-icon{
    width:18px!important;
    height:18px!important;
}

.status-badge.stopped{
    color:var(--danger)!important;
    background:color-mix(in srgb,var(--danger) 10%,var(--surface))!important;
    border-color:color-mix(in srgb,var(--danger) 20%,transparent)!important;
}

@media (max-width:720px){
    .scan2-status-actions{
        justify-content:flex-start!important;
        width:100%!important;
    }
}


/* Global stat-card icon layer: fills the reserved icon tile across owner, organization, usage, ticket, lead, chat, site, scan, and settings dashboards. */
.stat-card[data-stat-icon-ready="true"]{
    isolation:isolate;
}

.stat-card[data-stat-icon-ready="true"] > :not(.stat-card-icon){
    position:relative;
    z-index:2;
}

.stat-card[data-stat-icon-ready="true"]:after{
    z-index:1;
}

.stat-card-icon{
    position:absolute;
    top:29px;
    right:29px;
    z-index:3;
    width:20px;
    height:20px;
    display:grid;
    place-items:center;
    color:var(--accent);
    pointer-events:none;
    filter:drop-shadow(0 10px 18px rgba(var(--accent-rgb,6,182,212),.22));
}

.stat-card-icon-svg{
    display:block;
    width:20px;
    height:20px;
}

body[data-theme="dark"] .stat-card-icon{
    color:color-mix(in srgb,var(--accent) 82%,#fff);
}

@media (prefers-reduced-motion:no-preference){
    .stat-card[data-stat-icon-ready="true"] .stat-card-icon{
        transition:transform .18s var(--ease), color .18s var(--ease), filter .18s var(--ease);
    }

    .stat-card[data-stat-icon-ready="true"]:hover .stat-card-icon{
        transform:translateY(-1px) scale(1.04);
        filter:drop-shadow(0 14px 24px rgba(var(--accent-rgb,6,182,212),.30));
    }
}

/* =========================================================
   Final balanced dashboard/stat icon tiles
   Keeps icons inside the reserved tile and removes empty
   decorative icon spaces when JS has not decorated a card yet.
   ========================================================= */
.stat-card:after{
    display:none!important;
}

.stat-card{
    padding-right:92px!important;
}

.stat-card .stat-label,
.stat-card .stat-note,
.stat-card .stat-value{
    position:relative!important;
    z-index:2!important;
}

.stat-card-icon{
    position:absolute!important;
    top:22px!important;
    right:22px!important;
    z-index:3!important;
    width:44px!important;
    height:44px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:16px!important;
    color:var(--accent)!important;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,transparent),transparent 68%),
        linear-gradient(180deg,var(--surface),var(--surface-2))!important;
    border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line))!important;
    box-shadow:0 14px 34px rgba(var(--accent-rgb,6,182,212),.16)!important;
    pointer-events:none!important;
    filter:none!important;
}

.stat-card-icon-svg{
    display:block!important;
    width:20px!important;
    height:20px!important;
}

body[data-theme="dark"] .stat-card-icon{
    color:color-mix(in srgb,var(--accent) 84%,#fff)!important;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,transparent),transparent 68%),
        linear-gradient(180deg,color-mix(in srgb,var(--surface) 92%,#fff),var(--surface-2))!important;
}

@media (prefers-reduced-motion:no-preference){
    .stat-card[data-stat-icon-ready="true"]:hover .stat-card-icon{
        transform:translateY(-2px)!important;
        box-shadow:0 18px 42px rgba(var(--accent-rgb,6,182,212),.22)!important;
        filter:none!important;
    }
}

@media (max-width:640px){
    .stat-card{
        padding-right:76px!important;
    }

    .stat-card-icon{
        top:18px!important;
        right:18px!important;
        width:38px!important;
        height:38px!important;
        border-radius:14px!important;
    }

    .stat-card-icon-svg{
        width:18px!important;
        height:18px!important;
    }
}

/* Scan detail cards use the same balanced top-right icon tile. */
.scan2-stat-grid article{
    min-height:142px!important;
    padding:24px 86px 24px 24px!important;
}

.scan2-stat-grid article:after{
    display:none!important;
}

.scan2-stat-icon{
    position:absolute!important;
    top:22px!important;
    right:22px!important;
    z-index:4!important;
    display:grid!important;
    place-items:center!important;
    width:44px!important;
    height:44px!important;
    margin:0!important;
    border-radius:16px!important;
    color:var(--accent)!important;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 16%,transparent),transparent 68%),
        linear-gradient(180deg,var(--surface),var(--surface-2))!important;
    border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line))!important;
    box-shadow:0 14px 34px rgba(var(--accent-rgb,6,182,212),.16)!important;
}

.scan2-stat-icon .ui-icon{
    width:20px!important;
    height:20px!important;
}

.scan2-stat-grid article > span:not(.scan2-stat-icon),
.scan2-stat-grid article > strong,
.scan2-stat-grid article > small{
    position:relative!important;
    z-index:2!important;
}

body[data-theme="dark"] .scan2-stat-icon{
    color:color-mix(in srgb,var(--accent) 84%,#fff)!important;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,transparent),transparent 68%),
        linear-gradient(180deg,color-mix(in srgb,var(--surface) 92%,#fff),var(--surface-2))!important;
}

@media (prefers-reduced-motion:no-preference){
    .scan2-stat-grid article:hover .scan2-stat-icon{
        transform:translateY(-2px)!important;
        box-shadow:0 18px 42px rgba(var(--accent-rgb,6,182,212),.22)!important;
    }
}

@media (max-width:640px){
    .scan2-stat-grid article{
        padding-right:76px!important;
    }

    .scan2-stat-icon{
        top:18px!important;
        right:18px!important;
        width:38px!important;
        height:38px!important;
        border-radius:14px!important;
    }

    .scan2-stat-icon .ui-icon{
        width:18px!important;
        height:18px!important;
    }
}

/* =========================================================
   FINAL Scan Create Scope Preview
   Shows active + additional allowed domains without changing core scan logic
   ========================================================= */

.scan-scope-card{
    display:grid!important;
    gap:14px!important;
    padding:16px!important;
    border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line))!important;
    border-radius:22px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 34%),
        color-mix(in srgb,var(--surface) 88%,transparent)!important;
}

.scan-scope-head{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:14px!important;
    flex-wrap:wrap!important;
}

.scan-scope-head strong{
    display:block!important;
    margin-top:5px!important;
    color:var(--heading)!important;
    font-size:16px!important;
    font-weight:950!important;
    letter-spacing:-.025em!important;
}

.scan-scope-head .soft-btn{
    min-height:38px!important;
    box-shadow:none!important;
}

.scan-scope-summary{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
}

.scan-scope-summary div{
    min-width:0!important;
    padding:13px 14px!important;
    border:1px solid var(--line)!important;
    border-radius:17px!important;
    background:var(--panel)!important;
}

.scan-scope-summary span{
    display:block!important;
    margin-bottom:6px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.075em!important;
    text-transform:uppercase!important;
}

.scan-scope-summary strong{
    display:block!important;
    color:var(--heading)!important;
    font-size:13px!important;
    font-weight:900!important;
    line-height:1.45!important;
    word-break:break-word!important;
}

.scan-scope-card .domain-chip-wrap{
    margin-top:0!important;
}

.scan-scope-card .ticket-muted-copy{
    margin:0!important;
}

@media(max-width:760px){
    .scan-scope-summary{
        grid-template-columns:1fr!important;
    }

    .scan-scope-head .soft-btn{
        width:100%!important;
    }
}

/* =========================================================
   FINAL Scan-only domain scope UI
   Keep near bottom of app.css
   ========================================================= */
.scan-only-domain-label small{
    display:block!important;
    margin-top:2px!important;
    color:var(--muted)!important;
    font-size:12px!important;
    line-height:1.45!important;
    font-weight:800!important;
}

.scan-only-domain-label textarea{
    min-height:118px!important;
}

.scan-scope-card .scan-scope-head .status-badge{
    flex:0 0 auto!important;
}

.scan-scope-card .ticket-muted-copy{
    margin-top:14px!important;
}

.scan-scope-card .domain-chip-wrap:empty{
    display:none!important;
}
/* =========================================================
   FINAL Scan Show Stat Icon Alignment Fix
   Keep this at the absolute bottom of app.css
   ========================================================= */

.scan2-progress-panel .scan2-stat-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:18px!important;
    align-items:stretch!important;
}

.scan2-progress-panel .scan2-stat-grid article{
    position:relative!important;
    isolation:isolate!important;
    overflow:hidden!important;
    min-height:150px!important;
    padding:26px 92px 24px 26px!important;
    border-radius:26px!important;
}

.scan2-progress-panel .scan2-stat-grid article:after{
    display:none!important;
    content:none!important;
}

.scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon{
    position:absolute!important;
    top:24px!important;
    right:24px!important;
    left:auto!important;
    bottom:auto!important;
    z-index:5!important;

    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    min-height:50px!important;
    max-width:50px!important;
    max-height:50px!important;

    display:grid!important;
    place-items:center!important;
    margin:0!important;
    padding:0!important;

    border-radius:18px!important;
    color:var(--accent)!important;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,transparent),transparent 72%),
        linear-gradient(180deg,color-mix(in srgb,var(--surface) 98%,#fff),var(--surface-2))!important;
    border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))!important;
    box-shadow:0 16px 36px color-mix(in srgb,var(--accent) 16%,transparent)!important;

    line-height:1!important;
    text-align:center!important;
    pointer-events:none!important;
}

.scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon svg,
.scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon .ui-icon{
    display:block!important;
    width:23px!important;
    height:23px!important;
    min-width:23px!important;
    min-height:23px!important;
    max-width:23px!important;
    max-height:23px!important;
    color:currentColor!important;
    stroke:currentColor!important;
    fill:none!important;
    margin:0!important;
}

.scan2-progress-panel .scan2-stat-grid article > span:not(.scan2-stat-icon){
    position:relative!important;
    z-index:2!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    margin:0 0 10px!important;
    padding:0!important;
    color:var(--muted)!important;
    font-size:12px!important;
    font-weight:950!important;
    letter-spacing:.075em!important;
    line-height:1.25!important;
    text-transform:uppercase!important;
}

.scan2-progress-panel .scan2-stat-grid article > strong{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    margin:0 0 11px!important;
    padding:0!important;
    color:var(--heading)!important;
    font-size:44px!important;
    line-height:.95!important;
    font-weight:950!important;
    letter-spacing:-.065em!important;
}

.scan2-progress-panel .scan2-stat-grid article > small{
    position:relative!important;
    z-index:2!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
    color:var(--muted)!important;
    font-size:13px!important;
    font-weight:850!important;
    line-height:1.35!important;
    text-transform:none!important;
    letter-spacing:0!important;
}

body[data-theme="dark"] .scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon{
    color:color-mix(in srgb,var(--accent) 88%,#ffffff)!important;
    background:
        linear-gradient(135deg,color-mix(in srgb,var(--accent) 18%,transparent),transparent 72%),
        linear-gradient(180deg,color-mix(in srgb,var(--surface) 94%,#ffffff),var(--surface-2))!important;
    border-color:color-mix(in srgb,var(--accent) 28%,var(--line))!important;
}

@media (prefers-reduced-motion:no-preference){
    .scan2-progress-panel .scan2-stat-grid article,
    .scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon{
        transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease!important;
    }

    .scan2-progress-panel .scan2-stat-grid article:hover{
        transform:translateY(-2px)!important;
        border-color:color-mix(in srgb,var(--accent) 24%,var(--line))!important;
    }

    .scan2-progress-panel .scan2-stat-grid article:hover > .scan2-stat-icon{
        transform:translateY(-2px)!important;
        box-shadow:0 20px 44px color-mix(in srgb,var(--accent) 22%,transparent)!important;
    }
}

@media(max-width:1280px){
    .scan2-progress-panel .scan2-stat-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}

@media(max-width:720px){
    .scan2-progress-panel .scan2-stat-grid{
        grid-template-columns:1fr!important;
    }

    .scan2-progress-panel .scan2-stat-grid article{
        min-height:136px!important;
        padding:22px 82px 22px 22px!important;
    }

    .scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon{
        top:20px!important;
        right:20px!important;
        width:44px!important;
        height:44px!important;
        min-width:44px!important;
        min-height:44px!important;
        max-width:44px!important;
        max-height:44px!important;
        border-radius:16px!important;
    }

    .scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon svg,
    .scan2-progress-panel .scan2-stat-grid article > .scan2-stat-icon .ui-icon{
        width:20px!important;
        height:20px!important;
        min-width:20px!important;
        min-height:20px!important;
        max-width:20px!important;
        max-height:20px!important;
    }

    .scan2-progress-panel .scan2-stat-grid article > strong{
        font-size:38px!important;
    }
}
/* =========================================================
   FINAL Live Scan Monitor UI
   Safe isolated classes: scan-live-*
   ========================================================= */

.scan-live-panel{
    margin-top:24px!important;
    overflow:hidden!important;
}

.scan-live-panel .panel-head{
    align-items:flex-start!important;
    gap:18px!important;
}

.scan-live-grid{
    display:grid!important;
    grid-template-columns:minmax(380px,.92fr) minmax(0,1.08fr)!important;
    gap:18px!important;
    align-items:stretch!important;
    margin-top:20px!important;
}

.scan-live-browser,
.scan-live-console{
    min-width:0!important;
    border:1px solid var(--line)!important;
    border-radius:30px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 34%),
        color-mix(in srgb,var(--surface) 90%,transparent)!important;
    box-shadow:var(--shadow-soft)!important;
}

.scan-live-browser{
    display:grid!important;
    gap:16px!important;
    padding:18px!important;
}

.scan-live-window{
    position:relative!important;
    min-height:430px!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:auto auto 1fr auto!important;
    gap:14px!important;
    padding:14px!important;
    border:1px solid color-mix(in srgb,var(--accent) 22%,var(--line))!important;
    border-radius:26px!important;
    background:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
        radial-gradient(circle at 18% 0%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 30%),
        radial-gradient(circle at 100% 100%,color-mix(in srgb,var(--primary) 18%,transparent),transparent 32%),
        linear-gradient(135deg,color-mix(in srgb,var(--surface) 96%,#000),var(--surface-2))!important;
    background-size:30px 30px,30px 30px,auto,auto,auto!important;
}

.scan-live-window-top{
    position:relative!important;
    z-index:2!important;
    min-height:38px!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    padding:0 12px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:color-mix(in srgb,var(--panel) 86%,transparent)!important;
}

.scan-live-window-top span{
    width:9px!important;
    height:9px!important;
    border-radius:999px!important;
}

.scan-live-window-top span:nth-child(1){
    background:#ef4444!important;
}

.scan-live-window-top span:nth-child(2){
    background:#f59e0b!important;
}

.scan-live-window-top span:nth-child(3){
    background:#22c55e!important;
}

.scan-live-window-top strong{
    margin-left:8px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}

.scan-live-urlbar{
    position:relative!important;
    z-index:2!important;
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    padding:0 13px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--panel)!important;
}

.scan-live-urlbar i{
    width:28px!important;
    height:28px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:999px!important;
    color:#fff!important;
    background:linear-gradient(135deg,var(--primary),var(--accent))!important;
    flex:0 0 auto!important;
}

.scan-live-urlbar svg,
.scan-live-urlbar .ui-icon{
    width:15px!important;
    height:15px!important;
}

.scan-live-urlbar span{
    min-width:0!important;
    overflow:hidden!important;
    color:var(--heading)!important;
    font-size:12px!important;
    font-weight:900!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.scan-live-page{
    position:relative!important;
    z-index:2!important;
    overflow:hidden!important;
    display:grid!important;
    gap:18px!important;
    align-content:start!important;
    padding:18px!important;
    border:1px solid color-mix(in srgb,var(--accent) 16%,var(--line))!important;
    border-radius:24px!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 34%),
        color-mix(in srgb,var(--surface) 91%,transparent)!important;
}

.scan-live-page-head{
    display:grid!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:13px!important;
    align-items:center!important;
}

.scan-live-page-head i{
    width:54px!important;
    height:54px!important;
    display:grid!important;
    place-items:center!important;
    border-radius:18px!important;
    color:#fff!important;
    background:linear-gradient(135deg,var(--primary),var(--accent))!important;
    box-shadow:0 16px 36px color-mix(in srgb,var(--accent) 24%,transparent)!important;
}

.scan-live-page-head svg,
.scan-live-page-head .ui-icon{
    width:23px!important;
    height:23px!important;
}

.scan-live-page-head span{
    display:block!important;
    margin-bottom:5px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.08em!important;
    text-transform:uppercase!important;
}

.scan-live-page-head strong{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    color:var(--heading)!important;
    font-size:17px!important;
    font-weight:950!important;
    line-height:1.25!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.scan-live-faux-content{
    display:grid!important;
    gap:12px!important;
}

.scan-live-hero-line,
.scan-live-line,
.scan-live-card-row span{
    position:relative!important;
    overflow:hidden!important;
    border-radius:999px!important;
    background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 28%,transparent),color-mix(in srgb,var(--muted) 18%,transparent))!important;
}

.scan-live-hero-line{
    width:76%!important;
    height:18px!important;
    margin-bottom:3px!important;
}

.scan-live-line{
    height:11px!important;
}

.scan-live-line.w-92{
    width:92%!important;
}

.scan-live-line.w-78{
    width:78%!important;
}

.scan-live-line.w-86{
    width:86%!important;
}

.scan-live-line.w-64{
    width:64%!important;
}

.scan-live-card-row{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px!important;
    margin-top:4px!important;
}

.scan-live-card-row span{
    min-height:62px!important;
    border-radius:16px!important;
    border:1px solid var(--line)!important;
    background:
        radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 50%),
        var(--panel)!important;
}

.scan-live-hero-line:after,
.scan-live-line:after,
.scan-live-card-row span:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent)!important;
    transform:translateX(-100%)!important;
    animation:scanLiveSkeleton 1.45s linear infinite!important;
}

.scan-live-scanline{
    position:absolute!important;
    z-index:6!important;
    left:0!important;
    right:0!important;
    top:-25%!important;
    height:42%!important;
    pointer-events:none!important;
    background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--accent) 34%,transparent),transparent)!important;
    animation:scanLiveLine 2.25s ease-in-out infinite!important;
}

.scan-live-pipeline{
    position:relative!important;
    z-index:2!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:10px!important;
}

.scan-live-pipeline div{
    min-height:54px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    border:1px solid var(--line)!important;
    border-radius:17px!important;
    background:var(--panel)!important;
}

.scan-live-pipeline i{
    width:10px!important;
    height:10px!important;
    flex:0 0 auto!important;
    border-radius:999px!important;
    background:var(--accent)!important;
    box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 14%,transparent)!important;
    animation:scanLivePulse 1.25s ease-in-out infinite!important;
}

.scan-live-pipeline div:nth-child(2) i{
    animation-delay:.18s!important;
}

.scan-live-pipeline div:nth-child(3) i{
    animation-delay:.36s!important;
}

.scan-live-pipeline div:nth-child(4) i{
    animation-delay:.54s!important;
}

.scan-live-pipeline span{
    color:var(--heading)!important;
    font-size:12px!important;
    font-weight:950!important;
}

.scan-live-current-card{
    display:grid!important;
    gap:7px!important;
    padding:16px!important;
    border:1px solid var(--line)!important;
    border-radius:22px!important;
    background:var(--panel)!important;
}

.scan-live-current-card span,
.scan-live-metrics span,
.scan-live-progress-head span,
.scan-live-feed-head span{
    color:var(--muted)!important;
    font-size:11px!important;
    font-weight:950!important;
    letter-spacing:.075em!important;
    text-transform:uppercase!important;
}

.scan-live-current-card strong{
    color:var(--heading)!important;
    font-size:17px!important;
    font-weight:950!important;
    line-height:1.3!important;
    word-break:break-word!important;
}

.scan-live-current-card small{
    color:var(--muted)!important;
    font-size:12px!important;
    font-weight:850!important;
    line-height:1.45!important;
    word-break:break-word!important;
}

.scan-live-current-card a{
    color:var(--accent)!important;
    font-size:12px!important;
    font-weight:850!important;
    line-height:1.45!important;
    text-decoration:underline!important;
    text-underline-offset:3px!important;
    word-break:break-all!important;
}

.scan-live-console{
    display:grid!important;
    grid-template-rows:auto auto 1fr!important;
    gap:16px!important;
    padding:18px!important;
}

.scan-live-metrics{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:10px!important;
}

.scan-live-metrics article{
    min-width:0!important;
    min-height:118px!important;
    padding:16px!important;
    border:1px solid var(--line)!important;
    border-radius:20px!important;
    background:var(--panel)!important;
}

.scan-live-metrics strong{
    display:block!important;
    margin-top:10px!important;
    color:var(--heading)!important;
    font-size:28px!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:-.05em!important;
}

.scan-live-progress-wrap{
    display:grid!important;
    gap:10px!important;
}

.scan-live-progress-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
}

.scan-live-progress-head strong{
    color:var(--heading)!important;
    font-size:13px!important;
    font-weight:950!important;
}

.scan-live-progress{
    position:relative!important;
    overflow:hidden!important;
    width:100%!important;
    height:13px!important;
    border-radius:999px!important;
    background:color-mix(in srgb,var(--muted) 16%,transparent)!important;
}

.scan-live-progress span{
    position:absolute!important;
    inset:0 auto 0 0!important;
    border-radius:inherit!important;
    background:linear-gradient(90deg,var(--primary),var(--accent))!important;
    box-shadow:0 10px 28px color-mix(in srgb,var(--accent) 25%,transparent)!important;
    transition:width .28s ease!important;
}

.scan-live-feed-card{
    min-height:0!important;
    display:grid!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    gap:12px!important;
}

.scan-live-feed-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:14px!important;
}

.scan-live-feed-head strong{
    display:block!important;
    margin-top:5px!important;
    color:var(--heading)!important;
    font-size:16px!important;
    font-weight:950!important;
}

.scan-live-feed{
    min-height:0!important;
    max-height:430px!important;
    overflow:auto!important;
    display:grid!important;
    gap:10px!important;
    padding-right:4px!important;
}

.scan-live-feed-item{
    display:grid!important;
    grid-template-columns:14px minmax(0,1fr)!important;
    gap:12px!important;
    padding:13px!important;
    border:1px solid var(--line)!important;
    border-radius:18px!important;
    background:var(--panel)!important;
}

.scan-live-feed-item i{
    width:10px!important;
    height:10px!important;
    margin-top:5px!important;
    border-radius:999px!important;
    background:var(--muted)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--muted) 13%,transparent)!important;
}

.scan-live-feed-item.is-processing i,
.scan-live-feed-item.is-pending i{
    background:var(--accent)!important;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent)!important;
}

.scan-live-feed-item.is-done i{
    background:#22c55e!important;
    box-shadow:0 0 0 5px rgba(34,197,94,.14)!important;
}

.scan-live-feed-item.is-failed i{
    background:#ef4444!important;
    box-shadow:0 0 0 5px rgba(239,68,68,.14)!important;
}

.scan-live-feed-item.is-stopped i,
.scan-live-feed-item.is-waiting i{
    background:var(--muted)!important;
}

.scan-live-feed-item strong{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    color:var(--heading)!important;
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:950!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

.scan-live-feed-item small{
    display:block!important;
    margin-top:4px!important;
    color:var(--muted)!important;
    font-size:11px!important;
    line-height:1.35!important;
    font-weight:850!important;
}

.scan-live-feed-item em{
    display:block!important;
    margin-top:5px!important;
    color:color-mix(in srgb,var(--accent) 78%,var(--muted))!important;
    font-size:11px!important;
    line-height:1.35!important;
    font-style:normal!important;
    word-break:break-all!important;
}

.scan-live-panel.is-idle .scan-live-scanline,
.scan-live-panel.is-idle .scan-live-pipeline i,
.scan-live-panel.is-idle .scan-live-hero-line:after,
.scan-live-panel.is-idle .scan-live-line:after,
.scan-live-panel.is-idle .scan-live-card-row span:after{
    animation-play-state:paused!important;
    opacity:.36!important;
}

@keyframes scanLiveLine{
    0%{
        transform:translateY(0);
        opacity:.18;
    }

    15%{
        opacity:.9;
    }

    85%{
        opacity:.9;
    }

    100%{
        transform:translateY(390%);
        opacity:.18;
    }
}

@keyframes scanLivePulse{
    0%,100%{
        transform:scale(.72);
        opacity:.58;
    }

    50%{
        transform:scale(1);
        opacity:1;
    }
}

@keyframes scanLiveSkeleton{
    from{
        transform:translateX(-100%);
    }

    to{
        transform:translateX(100%);
    }
}

@media(max-width:1280px){
    .scan-live-grid{
        grid-template-columns:1fr!important;
    }

    .scan-live-metrics{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}

@media(max-width:720px){
    .scan-live-browser,
    .scan-live-console{
        padding:14px!important;
        border-radius:24px!important;
    }

    .scan-live-window{
        min-height:360px!important;
        padding:12px!important;
        border-radius:22px!important;
    }

    .scan-live-page{
        padding:14px!important;
        border-radius:20px!important;
    }

    .scan-live-page-head{
        grid-template-columns:44px minmax(0,1fr)!important;
    }

    .scan-live-page-head i{
        width:44px!important;
        height:44px!important;
        border-radius:16px!important;
    }

    .scan-live-card-row,
    .scan-live-pipeline,
    .scan-live-metrics{
        grid-template-columns:1fr!important;
    }

    .scan-live-feed-item strong{
        white-space:normal!important;
    }
}

@media(prefers-reduced-motion:reduce){
    .scan-live-scanline,
    .scan-live-pipeline i,
    .scan-live-hero-line:after,
    .scan-live-line:after,
    .scan-live-card-row span:after{
        animation:none!important;
    }
}