:root {
    --blue: #2563eb;
    --blue-dark: #1e3a8a;
    --cyan: #06b6d4;
    --green: #16a34a;
    --yellow: #f59e0b;
    --red: #dc2626;
    --purple: #7c3aed;
    --dark: #0f172a;
    --gray: #64748b;
    --soft: #f4f7fb;
    --card: #ffffff;
    --border: #e5eaf3;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.08), transparent 28rem),
        var(--soft);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--dark);
}

a {
    text-decoration: none;
}

.app-shell {
    min-height: 100vh;
    display: flex;
}

.app-sidebar {
    width: 290px;
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(56,189,248,.28), transparent 20rem),
        linear-gradient(180deg, #0f172a, #172554);
    color: white;
    padding: 24px;
    position: fixed;
    inset: 0 auto 0 0;
    display: flex;
    flex-direction: column;
    z-index: 10;
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 34px;
}

.brand-icon {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    display: grid;
    place-items: center;
    font-size: 25px;
    box-shadow: 0 14px 35px rgba(37,99,235,.45);
}

.sidebar-brand h2 {
    font-size: 22px;
    font-weight: 950;
    margin: 0;
}

.sidebar-brand span {
    font-size: 13px;
    color: #bfdbfe;
}

.sidebar-menu {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.menu-section {
    margin: 20px 0 8px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: #93c5fd;
    font-weight: 900;
}

.menu-link {
    color: #e0ecff;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 14px;
    border-radius: 16px;
    font-weight: 800;
    transition: .2s ease;
}

.menu-link i {
    font-size: 18px;
}

.menu-link:hover {
    background: rgba(255,255,255,.12);
    color: white;
    transform: translateX(4px);
}

.sidebar-footer {
    margin-top: auto;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 20px;
    padding: 16px;
}

.sidebar-footer strong,
.sidebar-footer span {
    display: block;
}

.sidebar-footer span {
    color: #bfdbfe;
    font-size: 12px;
    margin-top: 4px;
}

.app-main {
    margin-left: 290px;
    width: calc(100% - 290px);
    padding: 24px;
}

.app-topbar {
    height: 86px;
    background: rgba(255,255,255,.82);
    backdrop-filter: blur(16px);
    border: 1px solid var(--border);
    border-radius: 26px;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
    box-shadow: 0 14px 45px rgba(15,23,42,.06);
}

.app-topbar h1 {
    font-size: 25px;
    font-weight: 950;
    margin: 0;
}

.app-topbar p {
    margin: 3px 0 0;
    color: var(--gray);
    font-size: 14px;
}

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

.user-pill {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #f8fafc;
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 9px 13px;
}

.user-pill i {
    font-size: 26px;
    color: var(--blue);
}

.user-pill strong,
.user-pill span {
    display: block;
    line-height: 1.1;
}

.user-pill span {
    color: var(--gray);
    font-size: 12px;
}

.dashboard-hero {
    border-radius: 32px;
    padding: 34px;
    color: white;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.55), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.35), transparent 18rem),
        linear-gradient(135deg, #1e3a8a, #2563eb);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    box-shadow: 0 24px 70px rgba(37,99,235,.28);
    margin-bottom: 24px;
    overflow: hidden;
    position: relative;
}

.dashboard-hero::after {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -80px;
    bottom: -80px;
    border-radius: 50%;
    border: 35px solid rgba(255,255,255,.10);
}

.hero-badge {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 13px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 13px;
    margin-bottom: 18px;
}

.dashboard-hero h2 {
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 950;
    margin: 0 0 10px;
    max-width: 780px;
}

.dashboard-hero p {
    margin: 0;
    max-width: 720px;
    color: rgba(255,255,255,.88);
    font-size: 16px;
}

.hero-actions {
    display: flex;
    gap: 10px;
    position: relative;
    z-index: 2;
    flex-wrap: wrap;
}

.btn {
    border-radius: 14px;
    font-weight: 850;
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.kpi-card {
    background: white;
    border: 1px solid var(--border);
    border-radius: 26px;
    padding: 22px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    min-height: 180px;
    position: relative;
    overflow: hidden;
    transition: .2s ease;
}

.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 60px rgba(15,23,42,.10);
}

.kpi-card::after {
    content: "";
    position: absolute;
    width: 90px;
    height: 90px;
    right: -35px;
    top: -35px;
    background: rgba(37,99,235,.08);
    border-radius: 50%;
}

.kpi-icon {
    width: 48px;
    height: 48px;
    border-radius: 17px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 21px;
    margin-bottom: 16px;
}

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

.kpi-card h3 {
    font-size: 42px;
    font-weight: 950;
    margin: 5px 0 0;
}

.kpi-card p {
    margin: 4px 0 0;
    color: var(--gray);
    font-size: 14px;
}

.bg-blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.bg-gray { background: linear-gradient(135deg, #64748b, #94a3b8); }
.bg-cyan { background: linear-gradient(135deg, #0891b2, #22d3ee); }
.bg-purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.bg-yellow { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.bg-green { background: linear-gradient(135deg, #16a34a, #4ade80); }
.bg-dark { background: linear-gradient(135deg, #0f172a, #334155); }
.bg-red { background: linear-gradient(135deg, #dc2626, #fb7185); }

.kpi-card.danger {
    border-color: rgba(220,38,38,.25);
}

.content-grid {
    display: grid;
    grid-template-columns: 1fr 330px;
    gap: 22px;
}

.panel-card,
.side-panel > *,
.info-box {
    background: white;
    border: 1px solid var(--border);
    border-radius: 26px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
}

.panel-card {
    padding: 22px;
}

.panel-header {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.panel-header h4 {
    font-weight: 950;
    margin: 0;
}

.panel-header p {
    color: var(--gray);
    margin: 3px 0 0;
}

.modern-table {
    margin: 0;
}

.modern-table thead th {
    background: #f8fafc;
    color: #64748b;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em;
    border: 0;
    padding: 14px;
}

.modern-table tbody td {
    padding: 15px 14px;
    border-color: #eef2f7;
}

.modern-table small {
    display: block;
    color: var(--gray);
}

.side-panel {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.mini-card {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.mini-card i {
    width: 48px;
    height: 48px;
    border-radius: 17px;
    display: grid;
    place-items: center;
    background: #eff6ff;
    color: var(--blue);
    font-size: 22px;
}

.mini-card span,
.mini-card strong {
    display: block;
}

.mini-card span {
    color: var(--gray);
    font-size: 13px;
}

.mini-card strong {
    font-size: 24px;
    font-weight: 950;
}

.info-box {
    padding: 22px;
}

.info-box h5 {
    font-weight: 950;
}

.info-box p {
    color: var(--gray);
    margin: 0;
}

.login-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(37,99,235,.35), transparent 35rem),
        linear-gradient(135deg, #0f172a, #1e3a8a);
}

.login-bg {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.login-card {
    width: 100%;
    max-width: 440px;
    background: rgba(255,255,255,.96);
    border-radius: 28px;
    padding: 36px;
    box-shadow: 0 30px 90px rgba(0,0,0,.35);
}

.login-brand {
    text-align: center;
    margin-bottom: 28px;
}

.logo-icon {
    width: 72px;
    height: 72px;
    border-radius: 24px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    font-size: 34px;
    display: grid;
    place-items: center;
    margin: 0 auto 18px;
    box-shadow: 0 16px 40px rgba(37,99,235,.35);
}

.login-brand h1 {
    font-weight: 950;
    font-size: 28px;
    margin-bottom: 6px;
}

.login-brand p {
    color: #64748b;
    margin: 0;
}

.form-control,
.form-select {
    min-height: 48px;
    border-radius: 14px;
    border: 1px solid #dbe3ef;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 .2rem rgba(37,99,235,.15);
}

.btn-primary {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    border: none;
}

.login-footer {
    margin-top: 22px;
    text-align: center;
    color: #64748b;
    font-size: 13px;
}

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

    .content-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 860px) {
    .app-shell {
        display: block;
    }

    .app-sidebar {
        position: relative;
        width: 100%;
        min-height: auto;
        border-radius: 0 0 26px 26px;
    }

    .app-main {
        margin-left: 0;
        width: 100%;
        padding: 16px;
    }

    .app-topbar {
        height: auto;
        flex-direction: column;
        align-items: flex-start;
    }

    .topbar-actions {
        width: 100%;
        justify-content: space-between;
    }

    .dashboard-hero {
        flex-direction: column;
        align-items: flex-start;
        padding: 26px;
    }

    .kpi-grid {
        grid-template-columns: 1fr;
    }

    .panel-header {
        flex-direction: column;
    }
}
.form-page {
    max-width: 1180px;
}

.demand-header {
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.35), transparent 18rem),
        linear-gradient(135deg, #0f172a, #1e40af);
    color: white;
    border-radius: 30px;
    padding: 30px;
    margin-bottom: 24px;
    box-shadow: 0 24px 70px rgba(37,99,235,.22);
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.demand-code {
    display: inline-flex;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    padding: 7px 12px;
    font-weight: 950;
    margin-bottom: 14px;
}

.demand-header h2 {
    font-size: clamp(26px, 4vw, 42px);
    font-weight: 950;
    margin: 0 0 14px;
}

.demand-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: #dbeafe;
}

.demand-meta span {
    display: inline-flex;
    gap: 6px;
    align-items: center;
}

.demand-badges {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.demand-description {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 20px;
    padding: 20px;
    color: #334155;
    line-height: 1.7;
}

.fw-black {
    font-weight: 950;
}

.timeline {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.timeline-item {
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 12px;
}

.timeline-dot {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    margin-top: 5px;
    box-shadow: 0 0 0 5px rgba(37,99,235,.10);
}

.timeline-item strong {
    display: block;
    font-weight: 950;
}

.timeline-item span {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin: 2px 0 5px;
}

.timeline-item p {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 16px;
    padding: 12px;
    margin: 0;
    color: #334155;
}

.timeline.compact {
    gap: 12px;
}

.timeline.compact .timeline-item p {
    font-size: 13px;
    padding: 10px;
}

.info-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid #eef2f7;
}

.info-row:last-child {
    border-bottom: 0;
}

.info-row span {
    color: #64748b;
}

.info-row strong {
    text-align: right;
}

@media (max-width: 860px) {
    .demand-header {
        flex-direction: column;
    }
}

/* =====================================================
   FIX DEFINITIVO DO LAYOUT - REMOVE ESPAÇO BRANCO TOPO
===================================================== */

html,
body {
    width: 100%;
    min-height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden;
}

.app-shell {
    width: 100%;
    min-height: 100vh;
    display: block !important;
}

.app-sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 290px !important;
    height: 100vh !important;
}

.app-main {
    position: fixed !important;
    top: 0 !important;
    left: 290px !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    height: 100vh !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 24px !important;
    overflow-y: auto !important;
    display: block !important;
}

.app-topbar {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
}

.form-page {
    margin-top: 0 !important;
    max-width: 1180px;
}

@media (max-width: 860px) {
    .app-sidebar {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        min-height: auto !important;
    }

    .app-main {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 100vh !important;
        padding: 16px !important;
    }
}

/* ================================
   NOVA DEMANDA PREMIUM
================================ */

.nova-hero {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.40), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.30), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 24px;
    box-shadow: 0 26px 80px rgba(37,99,235,.28);
    position: relative;
    overflow: hidden;
}

.nova-hero::after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    right: -80px;
    top: -80px;
    border-radius: 50%;
    border: 36px solid rgba(255,255,255,.09);
}

.nova-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 18px;
}

.nova-hero h2 {
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 950;
    max-width: 850px;
    margin: 0 0 12px;
}

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

.nova-hero-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 26px;
}

.nova-hero-stats div {
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 20px;
    padding: 16px;
    backdrop-filter: blur(12px);
}

.nova-hero-stats strong,
.nova-hero-stats span {
    display: block;
}

.nova-hero-stats strong {
    font-size: 24px;
    font-weight: 950;
}

.nova-hero-stats span {
    color: #dbeafe;
    font-size: 13px;
    margin-top: 2px;
}

.nova-hero-card {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 24px;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
    backdrop-filter: blur(14px);
}

.nova-hero-card i {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.20);
    font-size: 32px;
    margin-bottom: 18px;
}

.nova-hero-card h3 {
    font-weight: 950;
    margin: 0 0 8px;
}

.nova-hero-card p {
    font-size: 14px;
}

.nova-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.nova-form-card {
    background: rgba(255,255,255,.94);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.nova-section-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 26px;
    padding-bottom: 20px;
    border-bottom: 1px solid #edf2f7;
}

.section-icon {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    font-size: 25px;
    box-shadow: 0 14px 35px rgba(37,99,235,.26);
}

.nova-section-title h4 {
    margin: 0;
    font-size: 24px;
    font-weight: 950;
}

.nova-section-title p {
    margin: 3px 0 0;
    color: #64748b;
}

.premium-label {
    font-weight: 900;
    color: #0f172a;
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 8px;
}

.premium-label i {
    color: #2563eb;
}

.premium-input {
    min-height: 54px;
    border-radius: 18px;
    border: 1px solid #dbe3ef;
    background: #fbfdff;
    font-weight: 650;
}

.premium-textarea {
    border-radius: 22px;
    border: 1px solid #dbe3ef;
    background: #fbfdff;
    padding: 18px;
    line-height: 1.7;
    font-weight: 600;
}

.field-help {
    display: block;
    color: #64748b;
    margin-top: 7px;
    font-size: 12px;
}

.desc-helper-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.desc-helper-grid div {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 16px;
    padding: 11px 12px;
    color: #475569;
    font-size: 13px;
    font-weight: 800;
    display: flex;
    align-items: center;
    gap: 7px;
}

.desc-helper-grid i {
    color: #16a34a;
}

.nova-submit-box {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.12), transparent 18rem),
        #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.nova-submit-box strong,
.nova-submit-box span {
    display: block;
}

.nova-submit-box strong {
    font-size: 18px;
    font-weight: 950;
}

.nova-submit-box span {
    color: #64748b;
    margin-top: 3px;
}

.nova-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.nova-info-card,
.nova-flow-card {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 18px 55px rgba(15,23,42,.07);
}

.nova-info-card.urgent {
    border-color: rgba(220,38,38,.22);
    background:
        radial-gradient(circle at top right, rgba(220,38,38,.10), transparent 14rem),
        white;
}

.info-icon {
    width: 54px;
    height: 54px;
    border-radius: 19px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #dc2626, #fb7185);
    color: white;
    font-size: 24px;
    margin-bottom: 16px;
}

.info-icon.blue {
    background: linear-gradient(135deg, #2563eb, #38bdf8);
}

.nova-info-card h5,
.nova-flow-card h5 {
    font-weight: 950;
    margin-bottom: 8px;
}

.nova-info-card p {
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

.flow-step {
    display: flex;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid #eef2f7;
}

.flow-step:last-child {
    border-bottom: 0;
}

.flow-step span {
    width: 36px;
    height: 36px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #eff6ff;
    color: #2563eb;
    font-weight: 950;
}

.flow-step.active span {
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
}

.flow-step strong,
.flow-step small {
    display: block;
}

.flow-step strong {
    font-weight: 950;
}

.flow-step small {
    color: #64748b;
}

@media (max-width: 1200px) {
    .nova-layout,
    .nova-hero {
        grid-template-columns: 1fr;
    }

    .nova-hero-card {
        max-width: 100%;
    }

    .desc-helper-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .nova-hero {
        padding: 24px;
        border-radius: 26px;
    }

    .nova-hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .nova-form-card {
        padding: 20px;
        border-radius: 24px;
    }

    .nova-submit-box {
        flex-direction: column;
        align-items: flex-start;
    }

    .desc-helper-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================
   DEMANDAS INDEX PREMIUM
================================ */

.demandas-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.40), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.28), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 22px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.demandas-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.demandas-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.demandas-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    max-width: 840px;
    margin: 0 0 10px;
}

.demandas-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.demandas-hero-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
}

.demandas-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.demanda-kpi {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    display: flex;
    align-items: center;
    gap: 14px;
    transition: .2s ease;
}

.demanda-kpi:hover {
    transform: translateY(-3px);
}

.demanda-kpi-icon {
    width: 48px;
    height: 48px;
    border-radius: 17px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 22px;
}

.demanda-kpi-icon.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.demanda-kpi-icon.gray { background: linear-gradient(135deg, #64748b, #94a3b8); }
.demanda-kpi-icon.purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.demanda-kpi-icon.red { background: linear-gradient(135deg, #dc2626, #fb7185); }
.demanda-kpi-icon.orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }

.demanda-kpi span,
.demanda-kpi strong {
    display: block;
}

.demanda-kpi span {
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.demanda-kpi strong {
    font-size: 30px;
    font-weight: 950;
    line-height: 1;
    margin-top: 3px;
}

.demanda-kpi.danger {
    border-color: rgba(220,38,38,.18);
}

.demandas-filter-card,
.demandas-board-card {
    background: rgba(255,255,255,.95);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 24px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
    margin-bottom: 22px;
}

.filter-header,
.board-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}

.filter-header h4,
.board-header h4 {
    font-weight: 950;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.filter-header h4 i,
.board-header h4 i {
    color: #2563eb;
}

.filter-header p,
.board-header p {
    color: #64748b;
    margin: 4px 0 0;
}

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

.active-filter {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    border-radius: 999px;
    padding: 8px 12px;
    background: #eff6ff;
    color: #2563eb;
    font-weight: 900;
    font-size: 13px;
}

.demandas-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.demanda-row {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 250px 110px;
    gap: 18px;
    align-items: center;
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.06), transparent 16rem),
        #ffffff;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    transition: .2s ease;
    position: relative;
    overflow: hidden;
}

.demanda-row:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 45px rgba(15,23,42,.09);
    border-color: rgba(37,99,235,.25);
}

.demanda-row.is-late {
    border-color: rgba(220,38,38,.25);
    background:
        radial-gradient(circle at top right, rgba(220,38,38,.08), transparent 16rem),
        #ffffff;
}

.demanda-row-icon {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    font-size: 25px;
    box-shadow: 0 14px 35px rgba(37,99,235,.22);
}

.demanda-title-line {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.demanda-code-list {
    display: inline-flex;
    border-radius: 999px;
    padding: 6px 10px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 950;
    font-size: 12px;
}

.demanda-main h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 950;
    color: #0f172a;
}

.demanda-sub {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: #64748b;
    font-size: 13px;
    margin-bottom: 10px;
}

.demanda-sub span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.demanda-sub i {
    color: #2563eb;
}

.demanda-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.demanda-tags .badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 7px 10px;
}

.demanda-tags .badge i {
    font-size: 9px;
}

.demanda-side-info {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.side-info-block {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 16px;
    padding: 10px 12px;
}

.side-info-block span,
.side-info-block strong {
    display: block;
}

.side-info-block span {
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
}

.side-info-block strong {
    font-size: 13px;
    margin-top: 2px;
}

.demanda-action {
    display: flex;
    justify-content: flex-end;
}

.demanda-action .btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.empty-demandas {
    text-align: center;
    padding: 60px 20px;
}

.empty-demandas div {
    width: 82px;
    height: 82px;
    border-radius: 28px;
    margin: 0 auto 18px;
    display: grid;
    place-items: center;
    background: #eff6ff;
    color: #2563eb;
    font-size: 42px;
}

.empty-demandas h3 {
    font-weight: 950;
    margin-bottom: 8px;
}

.empty-demandas p {
    color: #64748b;
    margin-bottom: 18px;
}

@media (max-width: 1300px) {
    .demandas-kpis {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .demanda-row {
        grid-template-columns: 58px minmax(0, 1fr);
    }

    .demanda-side-info,
    .demanda-action {
        grid-column: 2;
    }

    .demanda-action {
        justify-content: flex-start;
    }
}

@media (max-width: 900px) {
    .demandas-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .demandas-kpis {
        grid-template-columns: 1fr;
    }

    .filter-header,
    .board-header {
        flex-direction: column;
    }

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

    .demanda-row-icon,
    .demanda-side-info,
    .demanda-action {
        grid-column: auto;
    }
}

/* ================================
   KANBAN PREMIUM
================================ */

.kanban-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.42), transparent 25rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.30), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 22px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.kanban-hero::after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    right: -90px;
    top: -90px;
    border-radius: 50%;
    border: 36px solid rgba(255,255,255,.08);
}

.kanban-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.kanban-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    max-width: 860px;
    margin: 0 0 10px;
}

.kanban-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.kanban-hero-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
}

.kanban-insights {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.kanban-insight-card {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    display: flex;
    align-items: center;
    gap: 14px;
}

.insight-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 23px;
}

.insight-icon.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.insight-icon.red { background: linear-gradient(135deg, #dc2626, #fb7185); }
.insight-icon.orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.insight-icon.purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.insight-icon.green { background: linear-gradient(135deg, #16a34a, #4ade80); }

.kanban-insight-card span,
.kanban-insight-card strong {
    display: block;
}

.kanban-insight-card span {
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.kanban-insight-card strong {
    font-size: 30px;
    font-weight: 950;
    line-height: 1;
    margin-top: 3px;
}

.kanban-filter-card {
    background: rgba(255,255,255,.95);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 24px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
    margin-bottom: 22px;
}

.kanban-filter-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}

.kanban-filter-head h4 {
    font-weight: 950;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.kanban-filter-head h4 i {
    color: #2563eb;
}

.kanban-filter-head p {
    color: #64748b;
    margin: 4px 0 0;
}

.kanban-toolbar {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 16px 18px;
    margin-bottom: 18px;
    box-shadow: 0 14px 40px rgba(15,23,42,.06);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.kanban-toolbar strong {
    display: block;
    font-weight: 950;
}

.kanban-toolbar span {
    color: #64748b;
    font-size: 13px;
}

.kanban-feedback {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 10px 14px;
    background: #eff6ff;
    color: #2563eb;
    font-weight: 900;
    white-space: nowrap;
}

.kanban-feedback.success {
    background: #dcfce7;
    color: #15803d;
}

.kanban-feedback.error {
    background: #fee2e2;
    color: #b91c1c;
}

.kanban-feedback.loading {
    background: #fef3c7;
    color: #92400e;
}

.kanban-board {
    display: grid;
    grid-template-columns: repeat(6, minmax(310px, 1fr));
    gap: 18px;
    overflow-x: auto;
    padding-bottom: 18px;
}

.kanban-column {
    background: rgba(255,255,255,.78);
    border: 1px solid #e5eaf3;
    border-radius: 28px;
    min-height: 620px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    overflow: hidden;
}

.kanban-column-header {
    padding: 18px;
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
}

.kanban-column-header.gray { background: linear-gradient(135deg, #475569, #94a3b8); }
.kanban-column-header.cyan { background: linear-gradient(135deg, #0891b2, #22d3ee); }
.kanban-column-header.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.kanban-column-header.yellow { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.kanban-column-header.green { background: linear-gradient(135deg, #16a34a, #4ade80); }
.kanban-column-header.dark { background: linear-gradient(135deg, #0f172a, #334155); }

.column-title {
    display: flex;
    align-items: center;
    gap: 12px;
}

.column-icon {
    width: 46px;
    height: 46px;
    border-radius: 17px;
    background: rgba(255,255,255,.18);
    display: grid;
    place-items: center;
    font-size: 22px;
}

.column-title h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 950;
}

.column-title span {
    color: rgba(255,255,255,.82);
    font-size: 12px;
}

.column-count {
    width: 42px;
    height: 42px;
    border-radius: 16px;
    background: rgba(255,255,255,.18);
    display: grid;
    place-items: center;
    font-weight: 950;
    font-size: 18px;
}

.kanban-dropzone {
    padding: 16px;
    min-height: 540px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: .2s ease;
}

.kanban-dropzone.drag-over {
    background: rgba(37,99,235,.08);
    outline: 2px dashed rgba(37,99,235,.35);
    outline-offset: -10px;
}

.kanban-empty {
    border: 2px dashed #dbe3ef;
    border-radius: 22px;
    padding: 26px 16px;
    text-align: center;
    color: #94a3b8;
    font-weight: 850;
}

.kanban-empty i {
    display: block;
    font-size: 34px;
    margin-bottom: 8px;
}

.kanban-card {
    background: white;
    border: 1px solid #e5eaf3;
    border-left: 6px solid #2563eb;
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 14px 38px rgba(15,23,42,.08);
    cursor: grab;
    transition: .18s ease;
    position: relative;
    overflow: hidden;
}

.kanban-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 48px rgba(15,23,42,.12);
}

.kanban-card:active {
    cursor: grabbing;
}

.kanban-card.dragging {
    opacity: .6;
    transform: scale(.98);
}

.kanban-card.saved-pulse {
    animation: savedPulse .8s ease;
}

@keyframes savedPulse {
    0% { box-shadow: 0 0 0 0 rgba(22,163,74,.45); }
    100% { box-shadow: 0 0 0 18px rgba(22,163,74,0); }
}

.kanban-card.prioridade-baixa {
    border-left-color: #16a34a;
}

.kanban-card.prioridade-media {
    border-left-color: #2563eb;
}

.kanban-card.prioridade-alta {
    border-left-color: #f59e0b;
}

.kanban-card.prioridade-urgente,
.kanban-card.late {
    border-left-color: #dc2626;
}

.card-top-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.card-code {
    border-radius: 999px;
    padding: 6px 10px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 950;
    font-size: 12px;
}

.card-type {
    color: #64748b;
    font-size: 12px;
    font-weight: 850;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.kanban-card h4 {
    font-size: 16px;
    line-height: 1.35;
    font-weight: 950;
    margin: 0 0 10px;
    color: #0f172a;
}

.card-system {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #64748b;
    font-size: 13px;
    margin-bottom: 12px;
}

.card-system i {
    color: #2563eb;
}

.card-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 12px;
}

.card-badges .badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    padding: 7px 9px;
}

.card-badges .badge i {
    font-size: 9px;
}

.card-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 12px;
}

.card-info-grid div {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 16px;
    padding: 10px;
}

.card-info-grid span,
.card-info-grid strong {
    display: block;
}

.card-info-grid span {
    color: #64748b;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.card-info-grid strong {
    font-size: 12px;
    margin-top: 3px;
}

.card-deadline {
    border-radius: 16px;
    padding: 10px 12px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 900;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 12px;
}

.card-deadline.deadline-late {
    background: #fee2e2;
    color: #b91c1c;
}

.card-deadline.no-date {
    background: #f8fafc;
    color: #64748b;
}

.card-footer-actions {
    border-top: 1px solid #eef2f7;
    padding-top: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.card-author {
    color: #64748b;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.card-open {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #2563eb;
    font-weight: 950;
    font-size: 13px;
}

.card-open:hover {
    color: #1d4ed8;
}

@media (max-width: 1300px) {
    .kanban-insights {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .kanban-hero,
    .kanban-toolbar,
    .kanban-filter-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .kanban-insights {
        grid-template-columns: 1fr;
    }

    .kanban-board {
        grid-template-columns: repeat(6, 310px);
    }
}

/* ================================
   VISUALIZAR DEMANDA PREMIUM
================================ */

.view-hero {
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.35), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.25), transparent 18rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 22px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    display: flex;
    justify-content: space-between;
    gap: 24px;
    position: relative;
    overflow: hidden;
}

.view-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.view-code {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 18px;
}

.view-hero h2 {
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 950;
    margin: 0 0 16px;
}

.view-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    color: #dbeafe;
}

.view-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.view-status-box {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex-wrap: wrap;
    position: relative;
    z-index: 2;
}

.view-status-box .badge {
    border-radius: 999px;
    padding: 8px 11px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.view-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.view-kpi {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    display: flex;
    align-items: center;
    gap: 14px;
}

.view-kpi.danger {
    border-color: rgba(220,38,38,.22);
}

.view-kpi-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 23px;
}

.view-kpi-icon.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.view-kpi-icon.purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.view-kpi-icon.green { background: linear-gradient(135deg, #16a34a, #4ade80); }
.view-kpi-icon.red { background: linear-gradient(135deg, #dc2626, #fb7185); }
.view-kpi-icon.orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }

.view-kpi span,
.view-kpi strong {
    display: block;
}

.view-kpi span {
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.view-kpi strong {
    font-size: 17px;
    font-weight: 950;
    margin-top: 3px;
}

.view-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 370px;
    gap: 24px;
    align-items: start;
}

.view-main-card,
.view-control-card,
.view-info-card,
.view-history-card {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 26px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.view-section-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 22px;
}

.view-section-title.small {
    margin-top: 28px;
}

.section-icon.mini {
    width: 46px;
    height: 46px;
    border-radius: 17px;
    font-size: 20px;
}

.view-section-title h4 {
    font-weight: 950;
    margin: 0;
}

.view-section-title p {
    color: #64748b;
    margin: 3px 0 0;
}

.view-description {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 22px;
    line-height: 1.8;
    color: #334155;
    font-weight: 600;
    min-height: 120px;
}

.comment-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 22px;
}

.comment-form .btn {
    align-self: flex-start;
}

.empty-comments {
    border: 2px dashed #dbe3ef;
    border-radius: 24px;
    padding: 30px;
    text-align: center;
    color: #64748b;
}

.empty-comments i {
    display: block;
    font-size: 38px;
    color: #2563eb;
    margin-bottom: 8px;
}

.empty-comments strong,
.empty-comments span {
    display: block;
}

.empty-comments strong {
    color: #0f172a;
    font-weight: 950;
}

.view-timeline {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.view-timeline-item {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 12px;
}

.timeline-avatar {
    width: 46px;
    height: 46px;
    border-radius: 17px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    display: grid;
    place-items: center;
    font-weight: 950;
}

.timeline-content {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 20px;
    padding: 14px;
}

.timeline-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.timeline-head strong {
    font-weight: 950;
}

.timeline-head span {
    color: #64748b;
    font-size: 12px;
}

.timeline-content p {
    margin: 0;
    color: #334155;
    line-height: 1.6;
}

.view-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.control-head {
    display: flex;
    gap: 13px;
    margin-bottom: 20px;
}

.control-head > div:first-child {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    display: grid;
    place-items: center;
    font-size: 24px;
}

.control-head h5 {
    margin: 0;
    font-weight: 950;
}

.control-head p {
    margin: 2px 0 0;
    color: #64748b;
}

.view-alert {
    border-radius: 20px;
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    padding: 16px;
    color: #64748b;
    display: flex;
    gap: 10px;
}

.view-info-card h5,
.view-history-card h5 {
    font-weight: 950;
    margin-bottom: 18px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.view-info-card h5 i,
.view-history-card h5 i {
    color: #2563eb;
}

.view-info-row {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid #eef2f7;
}

.view-info-row:last-child {
    border-bottom: 0;
}

.view-info-row span {
    color: #64748b;
}

.view-info-row strong {
    text-align: right;
    font-weight: 950;
}

.history-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.history-item {
    display: grid;
    grid-template-columns: 14px 1fr;
    gap: 10px;
}

.history-item > span {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    margin-top: 5px;
    box-shadow: 0 0 0 5px rgba(37,99,235,.10);
}

.history-item strong {
    display: block;
    font-weight: 950;
}

.history-item small {
    display: block;
    color: #64748b;
    margin: 2px 0 6px;
}

.history-item p {
    background: #f8fafc;
    border-radius: 14px;
    padding: 10px;
    margin: 0;
    color: #334155;
    font-size: 13px;
}

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

    .view-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .view-hero {
        flex-direction: column;
    }

    .view-kpis {
        grid-template-columns: 1fr;
    }
}

/* ================================
   USUÁRIOS PREMIUM
================================ */

.users-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.40), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.28), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 22px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.users-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.users-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.users-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    max-width: 840px;
    margin: 0 0 10px;
}

.users-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.users-hero-actions {
    position: relative;
    z-index: 2;
}

.users-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.user-kpi {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    display: flex;
    align-items: center;
    gap: 14px;
}

.user-kpi-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 23px;
}

.user-kpi-icon.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.user-kpi-icon.dark { background: linear-gradient(135deg, #0f172a, #334155); }
.user-kpi-icon.purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.user-kpi-icon.green { background: linear-gradient(135deg, #16a34a, #4ade80); }
.user-kpi-icon.cyan { background: linear-gradient(135deg, #0891b2, #22d3ee); }

.user-kpi span,
.user-kpi strong {
    display: block;
}

.user-kpi span {
    color: #64748b;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.user-kpi strong {
    font-size: 30px;
    font-weight: 950;
    line-height: 1;
    margin-top: 3px;
}

.users-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}

.users-panel {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 24px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
    overflow: hidden;
}

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

.users-panel-title {
    display: flex;
    gap: 14px;
    align-items: center;
}

.users-panel-icon {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 26px;
    box-shadow: 0 14px 35px rgba(15,23,42,.18);
}

.users-panel.admin .users-panel-icon {
    background: linear-gradient(135deg, #0f172a, #334155);
}

.users-panel.dev .users-panel-icon {
    background: linear-gradient(135deg, #7c3aed, #38bdf8);
}

.users-panel.atendente .users-panel-icon {
    background: linear-gradient(135deg, #16a34a, #4ade80);
}

.users-panel-title h3 {
    margin: 0;
    font-weight: 950;
    font-size: 22px;
}

.users-panel-title p {
    color: #64748b;
    margin: 4px 0 0;
}

.users-count {
    width: 48px;
    height: 48px;
    border-radius: 18px;
    background: #eff6ff;
    color: #2563eb;
    display: grid;
    place-items: center;
    font-size: 22px;
    font-weight: 950;
}

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

.user-card {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.06), transparent 14rem),
        #ffffff;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    display: grid;
    grid-template-columns: 56px 1fr auto;
    gap: 14px;
    align-items: center;
    transition: .2s ease;
}

.user-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 45px rgba(15,23,42,.09);
    border-color: rgba(37,99,235,.25);
}

.user-card.inactive {
    opacity: .65;
    background: #f8fafc;
}

.user-avatar {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    display: grid;
    place-items: center;
    font-size: 24px;
    font-weight: 950;
}

.user-info h4 {
    margin: 0 0 4px;
    font-weight: 950;
    font-size: 17px;
}

.user-info > span {
    color: #64748b;
    font-size: 13px;
    display: flex;
    gap: 6px;
    align-items: center;
}

.user-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}

.user-badges .badge {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    border-radius: 999px;
    padding: 7px 10px;
}

.users-empty {
    border: 2px dashed #dbe3ef;
    border-radius: 24px;
    padding: 34px;
    text-align: center;
    color: #64748b;
}

.users-empty i {
    display: block;
    font-size: 40px;
    color: #2563eb;
    margin-bottom: 10px;
}

.users-empty strong,
.users-empty span {
    display: block;
}

.users-empty strong {
    color: #0f172a;
    font-weight: 950;
}

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

    .users-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .users-hero,
    .users-panel-head {
        flex-direction: column;
    }

    .users-kpis {
        grid-template-columns: 1fr;
    }

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

    .user-actions {
        justify-self: flex-start;
    }
}

/* ================================
   NOVO USUÁRIO PREMIUM
================================ */

.user-form-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.40), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.28), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 24px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.user-form-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.user-form-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.user-form-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    max-width: 840px;
    margin: 0 0 10px;
}

.user-form-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.user-form-hero-card {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    backdrop-filter: blur(14px);
}

.user-form-hero-card i {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.20);
    font-size: 32px;
    margin-bottom: 18px;
}

.user-form-hero-card h3 {
    font-weight: 950;
    margin: 0 0 8px;
}

.user-form-hero-card p {
    font-size: 14px;
}

.user-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.user-form-card {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.user-form-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 26px;
    padding-bottom: 20px;
    border-bottom: 1px solid #edf2f7;
}

.user-form-title h4 {
    margin: 0;
    font-size: 24px;
    font-weight: 950;
}

.user-form-title p {
    margin: 3px 0 0;
    color: #64748b;
}

.user-active-box,
.user-submit-box {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.10), transparent 18rem),
        #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.user-active-box strong,
.user-active-box span,
.user-submit-box strong,
.user-submit-box span {
    display: block;
}

.user-active-box strong,
.user-submit-box strong {
    font-size: 18px;
    font-weight: 950;
}

.user-active-box span,
.user-submit-box span {
    color: #64748b;
    margin-top: 3px;
}

.switch-premium {
    position: relative;
    width: 64px;
    height: 36px;
    flex: 0 0 auto;
}

.switch-premium input {
    display: none;
}

.switch-premium span {
    position: absolute;
    inset: 0;
    background: #cbd5e1;
    border-radius: 999px;
    cursor: pointer;
    transition: .2s ease;
}

.switch-premium span::after {
    content: "";
    position: absolute;
    width: 28px;
    height: 28px;
    left: 4px;
    top: 4px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 4px 12px rgba(15,23,42,.25);
    transition: .2s ease;
}

.switch-premium input:checked + span {
    background: linear-gradient(135deg, #2563eb, #38bdf8);
}

.switch-premium input:checked + span::after {
    transform: translateX(28px);
}

.user-form-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.profile-info-card {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 18px 55px rgba(15,23,42,.07);
}

.profile-info-card > div {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 27px;
    margin-bottom: 16px;
}

.profile-info-card.admin > div {
    background: linear-gradient(135deg, #0f172a, #334155);
}

.profile-info-card.dev > div {
    background: linear-gradient(135deg, #7c3aed, #38bdf8);
}

.profile-info-card.atendente > div {
    background: linear-gradient(135deg, #16a34a, #4ade80);
}

.profile-info-card h5 {
    font-weight: 950;
    margin-bottom: 8px;
}

.profile-info-card p {
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 1200px) {
    .user-form-hero,
    .user-form-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .user-form-hero {
        padding: 24px;
        border-radius: 26px;
    }

    .user-form-card {
        padding: 20px;
        border-radius: 24px;
    }

    .user-active-box,
    .user-submit-box {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ================================
   EDITAR USUÁRIO PREMIUM
================================ */

.user-edit-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.40), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.28), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 24px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.user-edit-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.user-edit-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.user-edit-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    max-width: 840px;
    margin: 0 0 10px;
}

.user-edit-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.user-edit-profile {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 300px;
    backdrop-filter: blur(14px);
}

.user-edit-avatar {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    background: rgba(255,255,255,.20);
    color: white;
    display: grid;
    place-items: center;
    font-size: 28px;
    font-weight: 950;
}

.user-edit-profile strong,
.user-edit-profile span {
    display: block;
}

.user-edit-profile strong {
    font-size: 18px;
    font-weight: 950;
}

.user-edit-profile span {
    color: #dbeafe;
    font-size: 13px;
}

.user-edit-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.user-edit-card,
.profile-current-card,
.profile-rules-card {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.user-active-box.compact {
    min-height: 54px;
    padding: 14px 16px;
}

.password-zone {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.10), transparent 18rem),
        #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 26px;
    padding: 22px;
}

.password-head {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 18px;
}

.password-head > div:first-child {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    display: grid;
    place-items: center;
    font-size: 24px;
}

.password-head h5 {
    margin: 0;
    font-weight: 950;
}

.password-head p {
    margin: 2px 0 0;
    color: #64748b;
}

.user-edit-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.profile-current-card {
    text-align: center;
}

.profile-current-avatar {
    width: 86px;
    height: 86px;
    border-radius: 30px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    display: grid;
    place-items: center;
    font-size: 38px;
    font-weight: 950;
    margin: 0 auto 16px;
    box-shadow: 0 18px 45px rgba(37,99,235,.25);
}

.profile-current-card h5 {
    font-weight: 950;
    margin-bottom: 4px;
}

.profile-current-card p {
    color: #64748b;
    margin-bottom: 14px;
}

.profile-current-badges {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
}

.profile-current-badges .badge {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    border-radius: 999px;
    padding: 8px 11px;
}

.profile-rules-card h5 {
    font-weight: 950;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
}

.profile-rules-card h5 i {
    color: #2563eb;
}

.rule-item {
    padding: 14px 0;
    border-bottom: 1px solid #eef2f7;
}

.rule-item:last-child {
    border-bottom: 0;
}

.rule-item strong {
    display: block;
    font-weight: 950;
    margin-bottom: 3px;
}

.rule-item span {
    color: #64748b;
    line-height: 1.5;
}

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

    .users-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .user-edit-hero {
        flex-direction: column;
        align-items: flex-start;
    }

    .user-edit-profile {
        min-width: 100%;
    }

    .users-kpis {
        grid-template-columns: 1fr;
    }

    .user-submit-box {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ================================
   DASHBOARD PREMIUM V2
================================ */

.dash-premium-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.42), transparent 25rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.30), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 22px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.dash-premium-hero::after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    right: -90px;
    bottom: -90px;
    border-radius: 50%;
    border: 36px solid rgba(255,255,255,.08);
}

.dash-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.dash-premium-hero h2 {
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 950;
    max-width: 860px;
    margin: 0 0 10px;
}

.dash-premium-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.dash-quick-actions {
    margin-top: 22px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.dash-hero-card {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 24px;
    backdrop-filter: blur(14px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.dash-hero-card i {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.20);
    font-size: 32px;
    margin-bottom: 16px;
}

.dash-hero-card span {
    color: #dbeafe;
    font-weight: 900;
}

.dash-hero-card strong {
    font-size: 54px;
    font-weight: 950;
    line-height: 1;
}

.dash-hero-card p {
    font-size: 13px;
}

.dash-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}

.dash-kpi {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 26px;
    padding: 20px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    transition: .2s ease;
}

.dash-kpi:hover {
    transform: translateY(-3px);
}

.dash-kpi.danger {
    border-color: rgba(220,38,38,.20);
}

.dash-kpi-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 23px;
    margin-bottom: 14px;
}

.dash-kpi-icon.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.dash-kpi-icon.gray { background: linear-gradient(135deg, #64748b, #94a3b8); }
.dash-kpi-icon.cyan { background: linear-gradient(135deg, #0891b2, #22d3ee); }
.dash-kpi-icon.purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.dash-kpi-icon.orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.dash-kpi-icon.green { background: linear-gradient(135deg, #16a34a, #4ade80); }
.dash-kpi-icon.red { background: linear-gradient(135deg, #dc2626, #fb7185); }

.dash-kpi span {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.dash-kpi strong {
    display: block;
    font-size: 38px;
    font-weight: 950;
    line-height: 1;
    margin: 5px 0;
}

.dash-kpi p {
    color: #64748b;
    margin: 0;
    font-size: 13px;
}

.dash-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 430px;
    gap: 22px;
    margin-bottom: 22px;
}

.dash-panel {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 24px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.dash-panel-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 20px;
}

.dash-panel-head h4 {
    font-weight: 950;
    margin: 0;
    display: flex;
    gap: 8px;
    align-items: center;
}

.dash-panel-head h4 i {
    color: #2563eb;
}

.dash-panel-head p {
    color: #64748b;
    margin: 4px 0 0;
}

.status-bars {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.status-bar-info {
    display: flex;
    justify-content: space-between;
    margin-bottom: 7px;
}

.status-bar-info strong {
    font-weight: 950;
}

.status-bar-info span {
    color: #64748b;
    font-weight: 900;
}

.status-bar-track {
    height: 13px;
    border-radius: 999px;
    background: #eff6ff;
    overflow: hidden;
}

.status-bar-track div {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
}

.deadline-list,
.ranking-list,
.activity-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.deadline-item,
.ranking-item {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 18px;
    padding: 13px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: #0f172a;
}

.deadline-item:hover {
    border-color: rgba(37,99,235,.30);
}

.deadline-item.late {
    background: #fff1f2;
    border-color: rgba(220,38,38,.20);
}

.deadline-item strong,
.deadline-item span,
.deadline-item em {
    display: block;
}

.deadline-item strong {
    color: #2563eb;
    font-weight: 950;
}

.deadline-item span {
    color: #334155;
    font-size: 13px;
}

.deadline-item em {
    font-style: normal;
    font-weight: 950;
    color: #64748b;
    white-space: nowrap;
}

.activity-item {
    display: grid;
    grid-template-columns: 16px 1fr;
    gap: 12px;
}

.activity-dot {
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    margin-top: 6px;
    box-shadow: 0 0 0 5px rgba(37,99,235,.10);
}

.activity-item strong {
    font-weight: 950;
}

.activity-item p {
    margin: 2px 0;
    color: #64748b;
}

.activity-item a {
    font-weight: 950;
}

.activity-item span {
    color: #94a3b8;
    font-size: 12px;
}

.ranking-item {
    align-items: center;
}

.ranking-item div {
    display: flex;
    align-items: center;
    gap: 9px;
}

.ranking-item i {
    color: #2563eb;
}

.ranking-item span {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    background: #eff6ff;
    color: #2563eb;
    display: grid;
    place-items: center;
    font-weight: 950;
}

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

.dash-demand-card {
    color: #0f172a;
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.07), transparent 14rem),
        #ffffff;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 18px;
    transition: .2s ease;
}

.dash-demand-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 45px rgba(15,23,42,.09);
}

.dash-demand-top,
.dash-demand-footer {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}

.dash-demand-top span {
    background: #eff6ff;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 6px 10px;
    font-weight: 950;
    font-size: 12px;
}

.dash-demand-card h5 {
    font-weight: 950;
    margin: 14px 0;
    line-height: 1.35;
}

.dash-demand-meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: #64748b;
    font-size: 13px;
    margin-bottom: 14px;
}

.dash-demand-meta span {
    display: flex;
    gap: 6px;
}

.dash-demand-meta i {
    color: #2563eb;
}

.dash-demand-footer small {
    color: #94a3b8;
}

.dash-empty {
    border: 2px dashed #dbe3ef;
    border-radius: 22px;
    padding: 24px;
    text-align: center;
    color: #64748b;
    font-weight: 900;
}

@media (max-width: 1300px) {
    .dash-kpi-grid,
    .dash-recent-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dash-main-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 800px) {
    .dash-premium-hero {
        grid-template-columns: 1fr;
    }

    .dash-kpi-grid,
    .dash-recent-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================
   DASHBOARD ATENDENTE
================================ */

.att-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(74,222,128,.34), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(56,189,248,.28), transparent 20rem),
        linear-gradient(135deg, #064e3b, #2563eb);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 22px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.att-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.att-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.att-hero h2 {
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 950;
    max-width: 860px;
    margin: 0 0 10px;
}

.att-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.att-hero-card {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 24px;
    backdrop-filter: blur(14px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.att-hero-card i {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.20);
    font-size: 32px;
    margin-bottom: 16px;
}

.att-hero-card span {
    color: #dbeafe;
    font-weight: 900;
}

.att-hero-card strong {
    font-size: 54px;
    font-weight: 950;
    line-height: 1;
}

.att-demand-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.att-demand-item {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.06), transparent 16rem),
        #ffffff;
    border: 1px solid #e5eaf3;
    border-radius: 24px;
    padding: 16px;
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 14px;
    color: #0f172a;
    transition: .2s ease;
}

.att-demand-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 45px rgba(15,23,42,.09);
    border-color: rgba(37,99,235,.25);
}

.att-demand-icon {
    width: 56px;
    height: 56px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    color: white;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    font-size: 24px;
}

.att-demand-title {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.att-demand-title span {
    background: #eff6ff;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 6px 10px;
    font-weight: 950;
    font-size: 12px;
}

.att-demand-title strong {
    font-weight: 950;
}

.att-demand-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    color: #64748b;
    font-size: 13px;
    margin-bottom: 9px;
}

.att-demand-meta em {
    font-style: normal;
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.att-demand-meta i {
    color: #2563eb;
}

.att-demand-tags {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
}

.att-guide {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.10), transparent 18rem),
        white;
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 24px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
    display: flex;
    gap: 18px;
    align-items: center;
}

.att-guide > div:first-child {
    width: 62px;
    height: 62px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    color: white;
    background: linear-gradient(135deg, #f59e0b, #fbbf24);
    font-size: 30px;
}

.att-guide h4 {
    font-weight: 950;
    margin-bottom: 5px;
}

.att-guide p {
    color: #64748b;
    margin: 0;
    line-height: 1.6;
}

@media (max-width: 900px) {
    .att-hero {
        grid-template-columns: 1fr;
    }

    .att-demand-item {
        grid-template-columns: 1fr;
    }

    .att-guide {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ================================
   EDITAR DEMANDA PREMIUM
================================ */

.edit-demand-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.40), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.28), transparent 20rem),
        linear-gradient(135deg, #0f172a, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 24px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.edit-demand-hero::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    right: -80px;
    bottom: -90px;
    border-radius: 50%;
    border: 34px solid rgba(255,255,255,.08);
}

.edit-demand-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.edit-demand-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    max-width: 840px;
    margin: 0 0 10px;
}

.edit-demand-hero p {
    color: rgba(255,255,255,.88);
    max-width: 800px;
    margin: 0;
    line-height: 1.7;
}

.edit-demand-card {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 24px;
    backdrop-filter: blur(14px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.edit-demand-card i {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.20);
    font-size: 32px;
    margin-bottom: 16px;
}

.edit-demand-card h3 {
    font-weight: 950;
    margin-bottom: 6px;
}

.edit-demand-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.edit-demand-form,
.edit-demand-info,
.edit-demand-help {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.edit-demand-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.edit-demand-info h5 {
    font-weight: 950;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
}

.edit-demand-info h5 i {
    color: #2563eb;
}

.edit-demand-help {
    background:
        radial-gradient(circle at top right, rgba(245,158,11,.16), transparent 16rem),
        white;
}

.edit-demand-help > div {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #f59e0b, #fbbf24);
    color: white;
    font-size: 28px;
    margin-bottom: 16px;
}

.edit-demand-help h5 {
    font-weight: 950;
    margin-bottom: 8px;
}

.edit-demand-help p {
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

@media (max-width: 1200px) {
    .edit-demand-hero,
    .edit-demand-layout {
        grid-template-columns: 1fr;
    }
}

/* ================================
   AUDITORIA PREMIUM
================================ */

.audit-card {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.08), transparent 18rem),
        #ffffff;
}

.audit-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.audit-item {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 12px;
}

.audit-icon {
    width: 42px;
    height: 42px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    box-shadow: 0 12px 28px rgba(37,99,235,.22);
}

.audit-content {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 20px;
    padding: 14px;
}

.audit-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 5px;
}

.audit-head strong {
    font-weight: 950;
}

.audit-head span {
    color: #64748b;
    font-size: 12px;
    white-space: nowrap;
}

.audit-user {
    color: #64748b;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
}

.audit-change {
    display: grid;
    grid-template-columns: .8fr 1fr 1fr;
    gap: 8px;
    margin: 10px 0;
}

.audit-change span {
    background: white;
    border: 1px solid #e5eaf3;
    border-radius: 14px;
    padding: 10px;
}

.audit-change small,
.audit-change b {
    display: block;
}

.audit-change small {
    color: #64748b;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
    margin-bottom: 4px;
}

.audit-change b {
    font-size: 12px;
    color: #0f172a;
}

.audit-content p {
    margin: 10px 0 0;
    color: #334155;
    line-height: 1.5;
}

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

    .audit-head {
        flex-direction: column;
    }
}

/* ANEXOS PREMIUM */

.attachments-box {
    margin-top: 28px;
    padding-top: 26px;
    border-top: 1px solid #eef2f7;
}

.attachment-upload {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    align-items: stretch;
}

.attachment-drop {
    background: #f8fafc;
    border: 2px dashed #cbd5e1;
    border-radius: 24px;
    padding: 22px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    transition: .2s ease;
}

.attachment-drop:hover {
    border-color: #2563eb;
    background: #eff6ff;
}

.attachment-drop i {
    color: #2563eb;
    font-size: 32px;
}

.attachment-drop strong {
    font-weight: 950;
}

.attachment-drop span {
    color: #64748b;
    font-size: 13px;
}

.attachment-drop input {
    margin-top: 10px;
}

.attachments-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 18px;
}

.attachment-item {
    background: #f8fafc;
    border: 1px solid #e5eaf3;
    border-radius: 20px;
    padding: 14px;
    display: grid;
    grid-template-columns: 50px 1fr auto;
    align-items: center;
    gap: 12px;
    color: #0f172a;
    transition: .2s ease;
}

.attachment-item:hover {
    border-color: rgba(37,99,235,.35);
    transform: translateY(-2px);
}

.attachment-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    font-size: 23px;
}

.attachment-item strong,
.attachment-item span {
    display: block;
}

.attachment-item strong {
    font-weight: 950;
}

.attachment-item span {
    color: #64748b;
    font-size: 13px;
}

.attachment-item em {
    font-style: normal;
    color: #64748b;
    font-weight: 900;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .attachment-upload,
    .attachment-item {
        grid-template-columns: 1fr;
    }
}

/* FECHAMENTO PREMIUM */

.close-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    background:
        radial-gradient(circle at top right, rgba(74,222,128,.36), transparent 24rem),
        radial-gradient(circle at bottom left, rgba(56,189,248,.28), transparent 20rem),
        linear-gradient(135deg, #064e3b, #1d4ed8);
    color: white;
    border-radius: 34px;
    padding: 34px;
    margin-bottom: 24px;
    box-shadow: 0 26px 80px rgba(37,99,235,.25);
    position: relative;
    overflow: hidden;
}

.close-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 16px;
}

.close-hero h2 {
    font-size: clamp(30px, 4vw, 46px);
    font-weight: 950;
    margin: 0 0 10px;
}

.close-hero p {
    color: rgba(255,255,255,.88);
    margin: 0;
    line-height: 1.7;
}

.close-hero-card {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 28px;
    padding: 24px;
    backdrop-filter: blur(14px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.close-hero-card i {
    width: 64px;
    height: 64px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.20);
    font-size: 32px;
    margin-bottom: 16px;
}

.close-hero-card h3 {
    font-weight: 950;
    margin-bottom: 6px;
}

.close-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.close-card,
.close-help {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 30px;
    padding: 28px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
}

.close-side {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.close-help {
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.14), transparent 16rem),
        white;
}

.close-help i {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #16a34a, #4ade80);
    color: white;
    font-size: 28px;
    margin-bottom: 16px;
}

.close-help h5 {
    font-weight: 950;
}

.close-help p {
    color: #64748b;
    line-height: 1.6;
}

.solution-box {
    margin-top: 28px;
    padding-top: 26px;
    border-top: 1px solid #eef2f7;
}

.solution-content {
    background:
        radial-gradient(circle at top right, rgba(34,197,94,.12), transparent 16rem),
        #f8fafc;
    border: 1px solid #dbeafe;
    border-radius: 24px;
    padding: 20px;
    color: #334155;
    line-height: 1.8;
    font-weight: 650;
}

.solution-note {
    margin-top: 14px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 20px;
    padding: 16px;
}

.solution-note strong {
    display: block;
    font-weight: 950;
    margin-bottom: 5px;
}

.solution-note p {
    margin: 0;
    color: #7c2d12;
}

@media (max-width: 1200px) {
    .close-hero,
    .close-layout {
        grid-template-columns: 1fr;
    }
}

/* ================================
   LOGIN PREMIUM V2
================================ */

.login-premium-page {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    background: #020617;
    color: #0f172a;
}

.login-premium-bg {
    min-height: 100vh;
    position: relative;
    padding: 28px;
    display: grid;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 15%, rgba(37,99,235,.45), transparent 28rem),
        radial-gradient(circle at 82% 10%, rgba(56,189,248,.35), transparent 24rem),
        radial-gradient(circle at 70% 90%, rgba(124,58,237,.28), transparent 26rem),
        linear-gradient(135deg, #020617, #0f172a 45%, #172554);
}

.login-orb {
    position: absolute;
    border-radius: 999px;
    filter: blur(3px);
    opacity: .75;
    animation: loginFloat 7s ease-in-out infinite;
}

.orb-one {
    width: 170px;
    height: 170px;
    background: rgba(37,99,235,.35);
    left: 7%;
    bottom: 12%;
}

.orb-two {
    width: 110px;
    height: 110px;
    background: rgba(56,189,248,.35);
    right: 9%;
    top: 16%;
    animation-delay: 1.2s;
}

.orb-three {
    width: 80px;
    height: 80px;
    background: rgba(34,197,94,.25);
    right: 26%;
    bottom: 10%;
    animation-delay: 2.1s;
}

@keyframes loginFloat {
    0%, 100% {
        transform: translateY(0) scale(1);
    }
    50% {
        transform: translateY(-18px) scale(1.04);
    }
}

.login-premium-shell {
    width: min(1180px, 100%);
    min-height: 720px;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) 460px;
    border-radius: 38px;
    overflow: hidden;
    position: relative;
    z-index: 2;
    box-shadow: 0 40px 120px rgba(0,0,0,.48);
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(20px);
}

.login-showcase {
    padding: 42px;
    color: white;
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(56,189,248,.30), transparent 22rem),
        radial-gradient(circle at bottom left, rgba(124,58,237,.28), transparent 20rem),
        linear-gradient(135deg, rgba(15,23,42,.78), rgba(37,99,235,.58));
}

.login-showcase::after {
    content: "";
    position: absolute;
    width: 320px;
    height: 320px;
    right: -120px;
    bottom: -120px;
    border-radius: 50%;
    border: 46px solid rgba(255,255,255,.08);
}

.login-showcase-top {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 84px;
    position: relative;
    z-index: 2;
}

.login-system-logo {
    width: 66px;
    height: 66px;
    border-radius: 24px;
    display: grid;
    place-items: center;
    font-size: 31px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    box-shadow: 0 20px 50px rgba(37,99,235,.40);
}

.login-showcase-top span {
    color: #bfdbfe;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.login-showcase-top h1 {
    font-size: 28px;
    font-weight: 950;
    margin: 0;
}

.login-showcase-content {
    max-width: 660px;
    position: relative;
    z-index: 2;
}

.login-premium-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    margin-bottom: 18px;
}

.login-showcase h2 {
    font-size: clamp(34px, 5vw, 58px);
    font-weight: 950;
    line-height: 1.04;
    margin: 0 0 16px;
}

.login-showcase p {
    color: rgba(255,255,255,.86);
    font-size: 16px;
    line-height: 1.75;
    margin: 0;
}

.login-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 42px;
    position: relative;
    z-index: 2;
}

.login-feature-card {
    background: rgba(255,255,255,.13);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 22px;
    padding: 18px;
    backdrop-filter: blur(14px);
    transition: .2s ease;
}

.login-feature-card:hover {
    transform: translateY(-4px);
    background: rgba(255,255,255,.17);
}

.login-feature-card i {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.18);
    font-size: 22px;
    margin-bottom: 12px;
}

.login-feature-card strong {
    display: block;
    font-weight: 950;
    margin-bottom: 4px;
}

.login-feature-card span {
    color: #dbeafe;
    font-size: 13px;
    line-height: 1.4;
}

.login-flow {
    margin-top: 32px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    position: relative;
    z-index: 2;
}

.login-flow div {
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 18px;
    padding: 14px;
}

.login-flow span {
    display: block;
    color: #93c5fd;
    font-weight: 950;
    font-size: 12px;
}

.login-flow strong {
    font-size: 13px;
}

.login-form-area {
    background: rgba(255,255,255,.96);
    padding: 42px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.login-form-card {
    width: 100%;
}

.login-form-header {
    display: flex;
    gap: 14px;
    align-items: center;
    margin-bottom: 26px;
}

.login-form-icon {
    width: 62px;
    height: 62px;
    border-radius: 22px;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    display: grid;
    place-items: center;
    font-size: 28px;
    box-shadow: 0 16px 40px rgba(37,99,235,.26);
}

.login-form-header h3 {
    margin: 0;
    font-weight: 950;
    font-size: 28px;
}

.login-form-header p {
    margin: 3px 0 0;
    color: #64748b;
}

.login-alert {
    background: #fee2e2;
    border: 1px solid #fecaca;
    color: #991b1b;
    border-radius: 18px;
    padding: 13px 15px;
    display: flex;
    align-items: center;
    gap: 9px;
    font-weight: 850;
    margin-bottom: 18px;
}

.login-input-group {
    margin-bottom: 18px;
}

.login-input-group label {
    display: flex;
    align-items: center;
    gap: 7px;
    font-weight: 950;
    margin-bottom: 8px;
}

.login-input-group label i {
    color: #2563eb;
}

.login-input-wrap {
    min-height: 58px;
    border: 1px solid #dbe3ef;
    border-radius: 20px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    transition: .2s ease;
}

.login-input-wrap:focus-within {
    background: white;
    border-color: #2563eb;
    box-shadow: 0 0 0 .22rem rgba(37,99,235,.12);
}

.login-input-wrap > i {
    color: #2563eb;
    font-size: 18px;
}

.login-input-wrap input {
    border: 0;
    outline: 0;
    background: transparent;
    flex: 1;
    font-weight: 750;
    color: #0f172a;
    min-width: 0;
}

.login-input-wrap input::placeholder {
    color: #94a3b8;
}

.show-pass-btn {
    border: 0;
    background: transparent;
    color: #64748b;
    font-size: 18px;
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: grid;
    place-items: center;
}

.show-pass-btn:hover {
    background: #eff6ff;
    color: #2563eb;
}

.login-options {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    margin: 6px 0 22px;
    color: #64748b;
    font-size: 13px;
}

.login-options label,
.login-options small {
    display: flex;
    align-items: center;
    gap: 7px;
}

.login-submit {
    width: 100%;
    min-height: 58px;
    border: 0;
    border-radius: 20px;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: white;
    font-weight: 950;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 18px;
    box-shadow: 0 18px 45px rgba(37,99,235,.28);
    transition: .2s ease;
}

.login-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 22px 55px rgba(37,99,235,.34);
}

.login-submit span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.login-help-box {
    margin-top: 22px;
    background: #eff6ff;
    border: 1px solid #dbeafe;
    color: #1e3a8a;
    border-radius: 20px;
    padding: 15px;
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.login-help-box i {
    font-size: 22px;
    color: #2563eb;
}

.login-help-box p {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 700;
}

.login-dev-footer {
    margin-top: 24px;
    color: #64748b;
    font-size: 13px;
    display: flex;
    gap: 7px;
    align-items: center;
    justify-content: center;
    font-weight: 800;
}

.login-dev-footer i {
    color: #2563eb;
}

@media (max-width: 1050px) {
    .login-premium-shell {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .login-showcase-top {
        margin-bottom: 42px;
    }
}

@media (max-width: 700px) {
    .login-premium-bg {
        padding: 14px;
        place-items: start center;
    }

    .login-premium-shell {
        border-radius: 28px;
    }

    .login-showcase,
    .login-form-area {
        padding: 26px;
    }

    .login-feature-grid,
    .login-flow {
        grid-template-columns: 1fr;
    }

    .login-options {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ================================
   KANBAN ULTRA 3D PREMIUM
================================ */

.kanban-ultra-hero {
    min-height: 330px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 28px;
    padding: 38px;
    margin-bottom: 24px;
    border-radius: 38px;
    color: white;
    background:
        radial-gradient(circle at 15% 20%, rgba(56,189,248,.34), transparent 24rem),
        radial-gradient(circle at 88% 18%, rgba(124,58,237,.32), transparent 22rem),
        radial-gradient(circle at 60% 100%, rgba(34,197,94,.18), transparent 22rem),
        linear-gradient(135deg, #020617, #172554 52%, #1d4ed8);
    box-shadow: 0 35px 110px rgba(37,99,235,.28);
    overflow: hidden;
    position: relative;
}

.kanban-ultra-glow {
    position: absolute;
    width: 460px;
    height: 460px;
    right: -180px;
    top: -180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(56,189,248,.34), transparent 62%);
    animation: ultraGlow 5s ease-in-out infinite;
}

@keyframes ultraGlow {
    0%,100% { transform: scale(1); opacity: .75; }
    50% { transform: scale(1.12); opacity: 1; }
}

.kanban-ultra-content {
    position: relative;
    z-index: 2;
}

.kanban-ultra-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 15px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    font-weight: 950;
    margin-bottom: 18px;
}

.kanban-ultra-hero h2 {
    font-size: clamp(34px, 5vw, 58px);
    line-height: 1.02;
    max-width: 900px;
    font-weight: 950;
    margin: 0 0 14px;
}

.kanban-ultra-hero p {
    max-width: 790px;
    color: rgba(255,255,255,.86);
    line-height: 1.75;
    margin: 0;
}

.kanban-ultra-actions {
    margin-top: 24px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.kanban-ultra-orbit {
    min-height: 260px;
    position: relative;
    z-index: 2;
}

.orbit-card.main {
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    width: 210px;
    height: 210px;
    border-radius: 42px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    backdrop-filter: blur(18px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 26px;
    box-shadow: 0 24px 80px rgba(0,0,0,.25);
    animation: floatMain 4s ease-in-out infinite;
}

@keyframes floatMain {
    0%,100% { transform: translate(-50%, -50%) translateY(0); }
    50% { transform: translate(-50%, -50%) translateY(-12px); }
}

.orbit-card i {
    font-size: 36px;
    margin-bottom: 10px;
}

.orbit-card span {
    color: #dbeafe;
    font-weight: 900;
}

.orbit-card strong {
    font-size: 58px;
    line-height: 1;
    font-weight: 950;
}

.orbit-mini {
    position: absolute;
    width: 74px;
    height: 74px;
    border-radius: 26px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.22);
    color: white;
    backdrop-filter: blur(16px);
    display: grid;
    place-items: center;
    font-weight: 950;
    box-shadow: 0 18px 60px rgba(0,0,0,.24);
    animation: orbitMini 4.8s ease-in-out infinite;
}

.orbit-mini i {
    display: block;
    font-size: 22px;
}

.orbit-mini.one { left: 10px; top: 24px; }
.orbit-mini.two { right: 12px; top: 56px; animation-delay: .8s; }
.orbit-mini.three { left: 62px; bottom: 18px; animation-delay: 1.4s; }

@keyframes orbitMini {
    0%,100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-12px) rotate(3deg); }
}

.kanban-ultra-stats {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.ultra-stat {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.08), transparent 12rem),
        rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 28px;
    padding: 18px;
    display: grid;
    grid-template-columns: 54px 1fr;
    gap: 13px;
    box-shadow: 0 22px 65px rgba(15,23,42,.08);
    transition: .22s ease;
    position: relative;
    overflow: hidden;
}

.ultra-stat:hover {
    transform: translateY(-5px) rotateX(2deg);
    box-shadow: 0 28px 80px rgba(15,23,42,.12);
}

.ultra-stat small {
    grid-column: 1 / -1;
    color: #64748b;
    font-weight: 750;
}

.ultra-stat-icon {
    width: 54px;
    height: 54px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    color: white;
    font-size: 24px;
}

.ultra-stat-icon.blue { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.ultra-stat-icon.red { background: linear-gradient(135deg, #dc2626, #fb7185); }
.ultra-stat-icon.orange { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.ultra-stat-icon.purple { background: linear-gradient(135deg, #7c3aed, #a78bfa); }
.ultra-stat-icon.green { background: linear-gradient(135deg, #16a34a, #4ade80); }

.ultra-stat span {
    display: block;
    color: #64748b;
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.ultra-stat strong {
    display: block;
    font-size: 34px;
    font-weight: 950;
    line-height: 1;
    margin-top: 5px;
}

.kanban-ultra-filter {
    background: rgba(255,255,255,.96);
    border: 1px solid #e5eaf3;
    border-radius: 32px;
    padding: 24px;
    box-shadow: 0 24px 70px rgba(15,23,42,.08);
    margin-bottom: 20px;
}

.filter-glass-head {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}

.filter-glass-head h4 {
    margin: 0;
    font-weight: 950;
    display: flex;
    align-items: center;
    gap: 9px;
}

.filter-glass-head h4 i {
    color: #2563eb;
}

.filter-glass-head p {
    margin: 4px 0 0;
    color: #64748b;
}

.kanban-command-center {
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.10), transparent 18rem),
        white;
    border: 1px solid #e5eaf3;
    border-radius: 26px;
    padding: 16px 18px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    margin-bottom: 18px;
}

.command-left {
    display: flex;
    align-items: center;
    gap: 13px;
}

.command-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    color: white;
    font-size: 23px;
}

.command-left strong,
.command-left span {
    display: block;
}

.command-left strong {
    font-weight: 950;
}

.command-left span {
    color: #64748b;
    font-size: 13px;
}

.kanban-ultra-board {
    display: grid;
    grid-template-columns: repeat(6, minmax(340px, 1fr));
    gap: 20px;
    overflow-x: auto;
    padding: 8px 4px 26px;
    perspective: 1400px;
}

.kanban-ultra-column {
    min-height: 680px;
    border-radius: 32px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.95), rgba(248,250,252,.88));
    border: 1px solid #e5eaf3;
    box-shadow: 0 24px 75px rgba(15,23,42,.10);
    overflow: hidden;
    transform-style: preserve-3d;
    transition: .24s ease;
}

.kanban-ultra-column:hover {
    transform: translateY(-4px) rotateX(1deg);
}

.ultra-column-header {
    min-height: 102px;
    padding: 20px;
    color: white;
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.ultra-column-header::after {
    content: "";
    position: absolute;
    width: 120px;
    height: 120px;
    right: -45px;
    bottom: -45px;
    border-radius: 50%;
    border: 18px solid rgba(255,255,255,.12);
}

.column-slate .ultra-column-header { background: linear-gradient(135deg, #475569, #94a3b8); }
.column-cyan .ultra-column-header { background: linear-gradient(135deg, #0891b2, #22d3ee); }
.column-blue .ultra-column-header { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.column-amber .ultra-column-header { background: linear-gradient(135deg, #f59e0b, #fbbf24); }
.column-green .ultra-column-header { background: linear-gradient(135deg, #16a34a, #4ade80); }
.column-dark .ultra-column-header { background: linear-gradient(135deg, #0f172a, #334155); }

.column-top {
    display: flex;
    align-items: center;
    gap: 13px;
    position: relative;
    z-index: 2;
}

.ultra-column-icon {
    width: 50px;
    height: 50px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.18);
    font-size: 24px;
}

.ultra-column-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 950;
}

.ultra-column-header span {
    display: block;
    color: rgba(255,255,255,.82);
    font-size: 12px;
}

.ultra-column-count {
    width: 48px;
    height: 48px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.18);
    font-weight: 950;
    font-size: 20px;
    position: relative;
    z-index: 2;
}

.column-pulse-line {
    padding: 12px 16px;
    background: #f8fafc;
    border-bottom: 1px solid #eef2f7;
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    display: flex;
    gap: 7px;
    align-items: center;
}

.column-pulse-line i {
    color: #2563eb;
    animation: pulseIcon 1.8s infinite;
}

@keyframes pulseIcon {
    0%,100% { opacity: .45; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.15); }
}

.kanban-ultra-dropzone {
    padding: 16px;
    min-height: 560px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: .2s ease;
}

.kanban-ultra-dropzone.drag-over {
    background: rgba(37,99,235,.08);
    outline: 2px dashed rgba(37,99,235,.35);
    outline-offset: -11px;
}

.kanban-ultra-empty {
    border: 2px dashed #cbd5e1;
    border-radius: 24px;
    padding: 28px 16px;
    text-align: center;
    color: #94a3b8;
}

.kanban-ultra-empty i {
    display: block;
    font-size: 36px;
    margin-bottom: 8px;
}

.kanban-ultra-empty strong,
.kanban-ultra-empty span {
    display: block;
}

.kanban-ultra-card {
    position: relative;
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.07), transparent 12rem),
        rgba(255,255,255,.98);
    border: 1px solid #e5eaf3;
    border-left: 7px solid #2563eb;
    border-radius: 28px;
    padding: 18px;
    box-shadow: 0 18px 50px rgba(15,23,42,.10);
    cursor: grab;
    transition: transform .12s ease, box-shadow .22s ease, border-color .22s ease;
    transform-style: preserve-3d;
    overflow: hidden;
}

.kanban-ultra-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.45), transparent);
    transform: translateX(-140%);
    transition: .45s ease;
    pointer-events: none;
}

.kanban-ultra-card:hover::after {
    transform: translateX(140%);
}

.kanban-ultra-card:hover {
    box-shadow: 0 28px 75px rgba(15,23,42,.16);
    border-color: rgba(37,99,235,.28);
}

.kanban-ultra-card.dragging {
    opacity: .65;
    transform: scale(.97) rotateZ(1deg) !important;
}

.card-energy {
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, #2563eb, #38bdf8, #7c3aed);
    background-size: 200% 100%;
    animation: energyMove 3s linear infinite;
}

@keyframes energyMove {
    from { background-position: 0 0; }
    to { background-position: 200% 0; }
}

.kanban-ultra-card.prioridade-baixa { border-left-color: #16a34a; }
.kanban-ultra-card.prioridade-media { border-left-color: #2563eb; }
.kanban-ultra-card.prioridade-alta { border-left-color: #f59e0b; }
.kanban-ultra-card.prioridade-urgente,
.kanban-ultra-card.late { border-left-color: #dc2626; }

.ultra-card-head,
.ultra-card-footer {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}

.ultra-code {
    background: #eff6ff;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 7px 11px;
    font-size: 12px;
    font-weight: 950;
}

.ultra-priority {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 11px;
    font-weight: 950;
    background: #f8fafc;
    color: #475569;
}

.prioridade-dot-urgente { background: #fee2e2; color: #b91c1c; }
.prioridade-dot-alta { background: #fef3c7; color: #92400e; }
.prioridade-dot-media { background: #dbeafe; color: #1d4ed8; }
.prioridade-dot-baixa { background: #dcfce7; color: #15803d; }

.kanban-ultra-card h4 {
    font-size: 17px;
    font-weight: 950;
    line-height: 1.35;
    margin: 15px 0 12px;
}

.ultra-card-type {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 13px;
}

.ultra-card-type span {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    color: #64748b;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 850;
    display: inline-flex;
    gap: 5px;
    align-items: center;
}

.ultra-card-type i {
    color: #2563eb;
}

.ultra-card-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-bottom: 12px;
}

.ultra-card-meta div {
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 17px;
    padding: 10px 12px;
}

.ultra-card-meta small,
.ultra-card-meta strong {
    display: block;
}

.ultra-card-meta small {
    color: #64748b;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.ultra-card-meta strong {
    font-size: 13px;
    margin-top: 2px;
}

.ultra-deadline {
    border-radius: 17px;
    padding: 11px 12px;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 900;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.ultra-deadline.is-danger {
    background: #fee2e2;
    color: #b91c1c;
    animation: dangerBreath 1.4s ease-in-out infinite;
}

@keyframes dangerBreath {
    0%,100% { box-shadow: 0 0 0 0 rgba(220,38,38,.25); }
    50% { box-shadow: 0 0 0 8px rgba(220,38,38,0); }
}

.ultra-avatar {
    width: 42px;
    height: 42px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    color: white;
    font-weight: 950;
    background: linear-gradient(135deg, #2563eb, #38bdf8);
    box-shadow: 0 12px 25px rgba(37,99,235,.22);
}

.ultra-footer-actions {
    display: flex;
    gap: 7px;
    align-items: center;
}

.ultra-open,
.ultra-finish {
    border-radius: 14px;
    min-height: 38px;
    padding: 0 11px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 950;
}

.ultra-open {
    background: #eff6ff;
    color: #1d4ed8;
}

.ultra-finish {
    background: #dcfce7;
    color: #15803d;
}

.ultra-open:hover,
.ultra-finish:hover {
    filter: brightness(.96);
}

.kanban-feedback {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 11px 15px;
    background: #eff6ff;
    color: #2563eb;
    font-weight: 950;
    white-space: nowrap;
}

.kanban-feedback.success {
    background: #dcfce7;
    color: #15803d;
}

.kanban-feedback.error {
    background: #fee2e2;
    color: #b91c1c;
}

.kanban-feedback.loading {
    background: #fef3c7;
    color: #92400e;
}

.kanban-feedback.ultra-ready {
    background: #eff6ff;
    color: #1d4ed8;
}

.saved-pulse {
    animation: savedUltraPulse .9s ease;
}

@keyframes savedUltraPulse {
    0% { box-shadow: 0 0 0 0 rgba(22,163,74,.50); }
    100% { box-shadow: 0 0 0 22px rgba(22,163,74,0); }
}

.kanban-ultra-board.compact-mode .kanban-ultra-card {
    padding: 13px;
    border-radius: 22px;
}

.kanban-ultra-board.compact-mode .ultra-card-meta,
.kanban-ultra-board.compact-mode .ultra-deadline,
.kanban-ultra-board.compact-mode .ultra-card-type {
    display: none;
}

.kanban-ultra-board.compact-mode .kanban-ultra-column {
    min-height: 500px;
}

.kanban-ultra-board.compact-mode .kanban-ultra-dropzone {
    min-height: 400px;
}

@media (max-width: 1500px) {
    .kanban-ultra-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .kanban-ultra-board {
        grid-template-columns: repeat(6, 340px);
    }
}

@media (max-width: 1000px) {
    .kanban-ultra-hero {
        grid-template-columns: 1fr;
    }

    .kanban-ultra-orbit {
        display: none;
    }

    .kanban-ultra-stats {
        grid-template-columns: 1fr;
    }

    .filter-glass-head,
    .kanban-command-center {
        flex-direction: column;
        align-items: flex-start;
    }
}