:root {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color-scheme: dark;
    --bg: #0b0f15;
    --surface: #111722;
    --surface-2: #171f2c;
    --surface-3: #1b2534;
    --text: #f5f7fb;
    --muted: #94a3b8;
    --border: #263244;
    --border-soft: rgba(255,255,255,.06);
    --accent: #7da2ff;
    --accent-strong: #9bb7ff;
    --success: #59d394;
    --warning: #f0b55f;
    --danger: #ff6f7d;
    --info: #65b9ff;
    --radius: 18px;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at top right, rgba(79, 112, 193, .08), transparent 30%),
        var(--bg);
    color: var(--text);
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
h1,h2,h3,p { margin-top: 0; }
h1 { font-size: clamp(1.8rem, 3vw, 2.35rem); line-height: 1.08; letter-spacing: -.03em; }
h2 { font-size: clamp(1.15rem, 2vw, 1.45rem); letter-spacing: -.02em; }
h3 { line-height: 1.25; }
.muted { color: var(--muted); }
.small { font-size: .83rem; }

.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 68px;
    padding: 11px clamp(14px, 3vw, 26px);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    background: rgba(11,15,21,.88);
    border-bottom:1px solid rgba(255,255,255,.07);
    backdrop-filter: blur(18px);
}

.brand { display:flex; align-items:center; gap:10px; min-width:0; }
.brand-mark {
    width:38px; height:38px; flex:0 0 38px;
    display:grid; place-items:center;
    border-radius:12px;
    background: linear-gradient(145deg, #6f95f5, #8ca8ff);
    color:#07111f;
    font-weight:900;
    box-shadow: 0 8px 22px rgba(91,126,218,.2);
}
.brand-copy { display:flex; flex-direction:column; min-width:0; }
.brand-copy strong { font-size:.98rem; line-height:1.05; }
.brand-copy small { margin-top:3px; color:var(--muted); font-size:.72rem; }

.top-actions { display:flex; align-items:center; gap:9px; }
.user-chip {
    padding:7px 10px;
    border:1px solid var(--border);
    border-radius:999px;
    color:#d8dfeb;
    background:rgba(255,255,255,.025);
    font-size:.82rem;
}

.container { width:min(1220px, calc(100% - 36px)); margin:28px auto 56px; }

button, .button {
    display:inline-flex; align-items:center; justify-content:center; gap:7px;
    min-height:42px;
    border:0;
    border-radius:11px;
    padding:10px 14px;
    cursor:pointer;
    background:var(--accent);
    color:#08111f;
    font:inherit;
    font-weight:800;
    transition:.16s ease;
}
button:hover,.button:hover { transform:translateY(-1px); filter:brightness(1.04); }
button:active,.button:active { transform:none; }
.button.secondary, button.secondary {
    background:#182130;
    color:var(--text);
    border:1px solid var(--border);
}
.button.compact { min-height:38px; padding:8px 11px; font-size:.84rem; }
.primary-cta { box-shadow:0 8px 20px rgba(76,107,190,.18); }

input, textarea, select {
    width:100%;
    min-height:44px;
    background:#0d131d;
    color:var(--text);
    border:1px solid #2a364a;
    border-radius:11px;
    padding:11px 12px;
    outline:none;
    font:inherit;
    transition:.16s ease;
}
textarea { min-height:112px; resize:vertical; line-height:1.45; }
input:focus, textarea:focus, select:focus {
    border-color:var(--accent);
    box-shadow:0 0 0 3px rgba(125,162,255,.11);
}

.panel, .call-carlos {
    background: linear-gradient(180deg, rgba(23,31,44,.94), rgba(17,23,34,.96));
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:22px;
    margin-bottom:18px;
    box-shadow: 0 14px 34px rgba(0,0,0,.12);
}

.dashboard-hero {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    padding:8px 2px 22px;
}
.dashboard-hero h1 { margin:5px 0 8px; }
.dashboard-hero p { margin:0; color:var(--muted); max-width:680px; }

.eyebrow, .section-kicker {
    display:block;
    color:var(--accent-strong);
    font-size:.7rem;
    font-weight:900;
    letter-spacing:.14em;
}
.section-kicker { margin-bottom:6px; }

.metrics {
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:12px;
    margin-bottom:18px;
}
.metric-card {
    min-height:106px;
    display:flex;
    align-items:center;
    gap:13px;
    padding:16px;
    background:linear-gradient(180deg, #151d2a, #121924);
    border:1px solid var(--border);
    border-radius:15px;
}
.metric-card > div:last-child { min-width:0; }
.metric-card span { display:block; color:var(--muted); font-size:.76rem; margin-bottom:5px; }
.metric-card strong { font-size:1.42rem; line-height:1.05; white-space:nowrap; }
.metric-icon {
    width:38px;height:38px;flex:0 0 38px;
    display:grid;place-items:center;
    border-radius:12px;
    background:rgba(125,162,255,.1);
    border:1px solid rgba(125,162,255,.15);
    color:var(--accent-strong);
    font-weight:900;
}
.metric-icon.success{color:var(--success);background:rgba(89,211,148,.08);border-color:rgba(89,211,148,.14);}
.metric-icon.warning{color:var(--warning);background:rgba(240,181,95,.08);border-color:rgba(240,181,95,.14);}
.metric-icon.info{color:var(--info);background:rgba(101,185,255,.08);border-color:rgba(101,185,255,.14);}
.metric-icon.money{font-size:.72rem;color:#b8f2d1;background:rgba(89,211,148,.08);}

.panel-title {
    display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
    margin-bottom:16px;
}
.panel-title h2 { margin-bottom:5px; }
.panel-title p { margin:0; }

.finance-panel canvas { max-height:310px; }
.finance-panel .small { margin-top:12px; }

.panel-actions {
    display:grid;
    grid-template-columns:minmax(220px,1fr) auto;
    gap:9px;
    width:min(520px,100%);
    margin-left:auto;
}
.panel-actions input { width:100%; min-width:0; }
.inline-action-form { display:flex; margin:0; }
.inline-action-form .button { width:100%; white-space:nowrap; }

.client-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.client-card {
    position:relative;
    min-height:248px;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    padding:16px;
    border-radius:15px;
    border:1px solid var(--border);
    background:linear-gradient(180deg,#192230,#151d29);
    transition:.18s ease;
}
.client-card:hover {
    transform:translateY(-3px);
    border-color:#435675;
    box-shadow:0 14px 30px rgba(0,0,0,.18);
}
.client-head { display:flex;align-items:flex-start;justify-content:space-between;gap:10px;min-height:48px; }
.client-title-wrap { min-width:0;display:flex;align-items:flex-start;gap:9px; }
.client-title-wrap h3 { margin:2px 0 12px;font-size:1rem;overflow-wrap:anywhere; }
.client-avatar {
    width:31px;height:31px;flex:0 0 31px;display:grid;place-items:center;
    border-radius:10px;background:#202b3c;border:1px solid #2d3a4f;font-size:.82rem;
}
.client-card dl { flex:1; margin:0; }
.client-card dl div,.details div {
    display:flex;justify-content:space-between;gap:14px;
    padding:8px 0;border-top:1px solid var(--border-soft);
}
dt { color:var(--muted); }
dd { margin:0;text-align:right;font-weight:650;overflow-wrap:anywhere; }
.client-card-footer {
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    margin:13px -16px -16px;padding:11px 16px;
    border-top:1px solid var(--border);
    background:rgba(255,255,255,.018);
    color:var(--accent-strong);font-size:.81rem;font-weight:800;
}

.badge {
    display:inline-flex;align-items:center;
    min-height:25px;padding:4px 9px;
    border-radius:999px;border:1px solid var(--border);
    font-size:.7rem;white-space:nowrap;
    background:rgba(255,255,255,.018);
}
.badge.ativo{color:var(--success);}
.badge.urgente,.badge.vencido{color:var(--danger);}
.badge.atencao{color:var(--warning);}
.badge.teste{color:var(--accent);}
.badge.proximo_renovacao{color:#e7c969;}

.call-carlos { display:grid;grid-template-columns:1fr 1.35fr;gap:20px; }
.call-form { display:grid;grid-template-columns:1fr 1fr;gap:9px; }
.call-form textarea { grid-column:1/-1; }

.client-hero, .editor-hero {
    display:flex;align-items:center;justify-content:space-between;gap:20px;
    padding:24px;
    margin-bottom:18px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:linear-gradient(135deg, rgba(33,44,62,.95), rgba(16,22,32,.95));
}
.client-hero-main { display:flex;align-items:center;gap:15px;min-width:0; }
.client-hero-avatar {
    width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;
    border-radius:16px;background:#202b3c;border:1px solid #31415a;font-size:1.4rem;
}
.client-hero h1,.editor-hero h1 { margin:4px 0 7px;overflow-wrap:anywhere; }
.client-hero-meta { display:flex;align-items:center;gap:9px;flex-wrap:wrap;color:var(--muted);font-size:.82rem; }
.detail-grid { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.detail-panel h2,.renewal-panel h2 { margin-bottom:14px; }
.details { margin:0; }
.details dt { flex:0 0 42%; }
.details dd { max-width:58%; }

.renew-form { display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:end; }
.renew-form label { margin:0; }

.gallery { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px; }
.gallery img { width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px;border:1px solid var(--border); }

.messages { display:grid;gap:9px; }
.message { background:#141c28;border:1px solid var(--border);border-radius:12px;padding:13px 14px; }
.message p { margin:9px 0 0; }
.message-meta { display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:.8rem; }

.alert { padding:12px 14px;border-radius:11px;margin-bottom:14px; }
.alert.error { background:rgba(255,111,125,.1);border:1px solid rgba(255,111,125,.25); }
.alert.success { background:rgba(89,211,148,.1);border:1px solid rgba(89,211,148,.25);color:#b7f0d0; }

.client-edit-form { padding:0;overflow:hidden; }
.form-section { padding:22px;border-bottom:1px solid var(--border); }
.form-section:last-of-type { border-bottom:0; }
.form-section-title { margin-bottom:15px; }
.form-section-title h2 { margin-bottom:4px; }
.form-section-title p { margin:0;font-size:.85rem; }
.form-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 15px; }
.form-grid label,.full-label { margin:0;color:#b9c3d1;font-size:.85rem;font-weight:650; }
.form-grid input,.form-grid select,.full-label textarea { margin-top:7px; }
.span-2 { grid-column:1/-1; }
.form-actions {
    display:flex;align-items:center;justify-content:flex-end;gap:9px;
    padding:16px 22px;background:rgba(255,255,255,.015);border-top:1px solid var(--border);
}
.field-hint { margin-top:6px;color:var(--muted);font-size:.73rem; }

.login-body {
    min-height:100vh;display:grid;place-items:center;padding:22px;
    background:
        radial-gradient(circle at 20% 20%, rgba(87,116,198,.12), transparent 28%),
        radial-gradient(circle at 85% 80%, rgba(50,77,139,.08), transparent 30%),
        var(--bg);
}
.login-shell {
    width:min(900px,100%);
    display:grid;grid-template-columns:1.05fr .95fr;
    overflow:hidden;border:1px solid var(--border);border-radius:22px;
    background:#111722;box-shadow:0 24px 60px rgba(0,0,0,.28);
}
.login-brand-panel { padding:42px;background:linear-gradient(145deg,#19273a,#101722); }
.login-logo {
    width:54px;height:54px;display:grid;place-items:center;border-radius:16px;
    background:linear-gradient(145deg,#6f95f5,#8ca8ff);color:#07111f;font-size:1.4rem;font-weight:900;
    margin-bottom:24px;
}
.login-brand-panel h1 { margin:7px 0 12px; }
.login-brand-panel p { max-width:420px;color:#b5c0cf; }
.login-card { padding:42px;background:#111722; }
.login-card h2 { margin-bottom:7px; }
.login-card button { width:100%; }

@media (max-width:950px){
    .metrics{grid-template-columns:repeat(2,minmax(0,1fr));}
    .metric-card:last-child{grid-column:span 2;}
    .client-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
    .detail-grid,.call-carlos{grid-template-columns:1fr;}
    .panel-title{flex-direction:column;align-items:stretch;}
    .panel-actions{width:100%;margin-left:0;}
    .login-shell{grid-template-columns:1fr;}
    .login-brand-panel{display:none;}
}

@media (max-width:620px){
    .topbar{min-height:58px;padding:9px 10px;}
    .brand-mark{width:34px;height:34px;flex-basis:34px;border-radius:10px;}
    .brand-copy small{display:none;}
    .user-chip{display:none;}
    .top-actions{gap:6px;}
    .button.compact{min-height:36px;padding:7px 9px;font-size:.78rem;}

    .container{width:min(100% - 16px,1220px);margin:14px auto 36px;}

    .dashboard-hero{
        align-items:stretch;flex-direction:column;gap:14px;
        padding:4px 2px 14px;
    }
    .dashboard-hero h1{font-size:1.65rem;}
    .dashboard-hero .primary-cta{width:100%;}

    .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:12px;}
    .metric-card{min-height:84px;padding:12px;gap:9px;border-radius:13px;}
    .metric-card:last-child{grid-column:1/-1;}
    .metric-icon{width:32px;height:32px;flex-basis:32px;border-radius:10px;}
    .metric-card strong{font-size:1.2rem;}
    .metric-card span{font-size:.71rem;}

    .panel,.call-carlos{padding:14px;margin-bottom:12px;border-radius:14px;box-shadow:none;}
    .panel-title{gap:10px;margin-bottom:12px;}
    .section-kicker{font-size:.64rem;}
    .panel-title h2{font-size:1.15rem;}

    .panel-actions{grid-template-columns:1fr;gap:7px;}
    .panel-actions input,.inline-action-form,.inline-action-form .button{width:100%;}

    .client-grid{grid-template-columns:1fr;gap:9px;}
    .client-card{min-height:auto;padding:14px;border-radius:13px;}
    .client-card:hover{transform:none;box-shadow:none;}
    .client-card-footer{margin:11px -14px -14px;padding:10px 14px;}
    .client-title-wrap h3{font-size:.98rem;}
    .client-card dl div{padding:7px 0;}
    .client-card dt,.client-card dd{font-size:.84rem;}

    .call-form{grid-template-columns:1fr;}
    .call-form textarea{grid-column:auto;}

    .client-hero,.editor-hero{
        align-items:stretch;flex-direction:column;
        padding:16px;border-radius:14px;
    }
    .client-hero-main{align-items:flex-start;}
    .client-hero-avatar{width:46px;height:46px;flex-basis:46px;border-radius:13px;}
    .client-hero .primary-cta{width:100%;}
    .client-hero h1,.editor-hero h1{font-size:1.55rem;}

    .detail-grid{gap:10px;}
    .details div{align-items:flex-start;gap:10px;}
    .details dt{flex-basis:44%;font-size:.84rem;}
    .details dd{max-width:56%;font-size:.88rem;}

    .renew-form{grid-template-columns:1fr;}
    .gallery{grid-template-columns:repeat(2,minmax(0,1fr));}
    .message-meta{flex-direction:column;gap:3px;}

    .form-section{padding:15px;}
    .form-grid{grid-template-columns:1fr;gap:10px;}
    .span-2{grid-column:auto;}
    .form-actions{padding:13px 15px;flex-direction:column-reverse;}
    .form-actions .button,.form-actions button{width:100%;}

    .login-body{padding:12px;}
    .login-shell{border-radius:16px;}
    .login-card{padding:24px 18px;}
}

@media (max-width:390px){
    .metrics{grid-template-columns:1fr;}
    .metric-card:last-child{grid-column:auto;}
    .gallery{grid-template-columns:1fr;}
    .details div{flex-direction:column;gap:3px;}
    .details dt,.details dd{max-width:none;width:100%;text-align:left;}
}