/* Interface interna: superfícies leves e foco no conteúdo comercial. */
.app-body-shell {
    --ui-canvas: #f4f6fa;
    --ui-surface: #ffffff;
    --ui-border: #e3e8f0;
    --ui-text: #17243a;
    --ui-muted: #65758b;
    --ui-accent: #2758c5;
    --ui-accent-soft: #edf3ff;
    --ui-shadow: 0 8px 26px rgba(29, 46, 80, .055);
    background: var(--ui-canvas);
    color: var(--ui-text);
}
html[data-theme="dark"] .app-body-shell {
    --ui-canvas: #0d1524;
    --ui-surface: #151f30;
    --ui-border: #2b3b51;
    --ui-text: #e6edf8;
    --ui-muted: #a8b6c9;
    --ui-accent: #9bbaff;
    --ui-accent-soft: #223557;
    --ui-shadow: 0 10px 26px rgba(0, 0, 0, .16);
}
.app-body-shell .global-shell-header {
    padding: 0 1.5rem;
    background: var(--ui-surface);
    border-bottom: 1px solid var(--ui-border);
    box-shadow: 0 4px 18px rgba(24, 42, 77, .035);
}
.app-body-shell .global-shell-inner {
    width: min(100%, 1440px);
    padding: .65rem 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.app-body-shell .global-brand-wrap {
    width: 172px;
    min-width: 172px;
    height: 47px;
    padding: .2rem .4rem;
    border: 0;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
}
.app-body-shell .global-brand-logo { filter: none; }
.app-body-shell .global-top-nav {
    gap: .25rem;
    margin-top: .4rem;
    padding: 0 0 .5rem;
}
.app-body-shell .global-top-nav a {
    min-height: 40px;
    padding: .6rem .85rem;
    border-radius: 9px;
    background: transparent;
    color: var(--ui-muted);
    font-size: .82rem;
    font-weight: 600;
    transition: background .15s ease, color .15s ease;
}
.app-body-shell .global-top-nav a:hover,
.app-body-shell .global-top-nav a.active {
    background: var(--ui-accent-soft);
    color: var(--ui-accent);
    box-shadow: none;
}
.app-body-shell .theme-switcher-shell {
    padding: .25rem;
    border: 1px solid var(--ui-border);
    background: var(--ui-canvas);
    box-shadow: none;
}
.app-body-shell .theme-switcher-shell .theme-switcher-label,
.app-body-shell .theme-switcher-shell .theme-switcher-button { color: var(--ui-muted); }
.app-body-shell .theme-switcher-shell .theme-switcher-button.is-active {
    background: var(--ui-surface);
    color: var(--ui-accent);
    box-shadow: 0 1px 5px rgba(20, 35, 60, .12);
}
.app-body-shell .page-shell {
    min-height: 0;
    padding: 2.5rem 1.5rem 4rem;
    background: var(--ui-canvas);
}
.app-body-shell .page-panel { width: min(100%, 1440px); }
.app-body-shell .page-header { align-items: center; gap: 1.5rem; margin-bottom: 1.75rem; }
.app-body-shell .page-header-copy h1 { color: var(--ui-text); font-size: clamp(1.8rem, 2.5vw, 2.35rem); font-weight: 750; letter-spacing: -.045em; }
.app-body-shell .page-header-copy p,
.app-body-shell .list-header p { color: var(--ui-muted); font-size: .92rem; }
.app-body-shell .section-eyebrow { color: var(--ui-accent); font-size: .69rem; letter-spacing: .12em; }
.app-body-shell .list-panel,
.app-body-shell .form-panel,
.app-body-shell .content-section-card,
.app-body-shell .helper-card {
    background: var(--ui-surface);
    border: 1px solid var(--ui-border);
    border-radius: 16px;
    box-shadow: var(--ui-shadow);
    backdrop-filter: none;
}
.app-body-shell .list-panel,
.app-body-shell .form-panel { padding: 1.5rem; }
.app-body-shell .list-header { padding-bottom: 1rem; border-bottom: 1px solid var(--ui-border); margin-bottom: 1rem; }
.app-body-shell .list-header h2,
.app-body-shell .form-panel h2 { color: var(--ui-text); font-size: 1.12rem; font-weight: 700; letter-spacing: -.02em; }
.app-body-shell .primary-link,
.app-body-shell .ghost-link,
.app-body-shell .danger-button {
    min-height: 40px;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 9px;
    padding: .65rem .9rem;
    font: inherit;
    font-size: .82rem;
    font-weight: 650;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.app-body-shell .primary-link { background: #2758c5; color: #fff; }
.app-body-shell .primary-link:hover { background: #1e49a8; color: #fff; }
.app-body-shell .ghost-link { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
.app-body-shell .ghost-link:hover { background: var(--ui-accent-soft); border-color: var(--ui-accent); color: var(--ui-accent); }
.app-body-shell .danger-button { background: transparent; color: #c03939; border-color: var(--ui-border); }
.app-body-shell .danger-button:hover { background: #fff1f1; }
.app-body-shell :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #7aa6ff; outline-offset: 2px; }
.app-body-shell .company-list { grid-template-columns: minmax(0, 1fr); gap: .7rem; }
.app-body-shell .company-card {
    padding: 1.2rem;
    border: 1px solid var(--ui-border);
    border-radius: 12px;
    background: var(--ui-surface);
    color: var(--ui-text);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.app-body-shell .company-card:hover { border-color: #a9bde3; box-shadow: 0 5px 18px rgba(29, 46, 80, .06); }
.company-identity { display: flex; align-items: center; gap: .8rem; }
.company-avatar { display: grid; place-items: center; flex: 0 0 46px; height: 46px; border-radius: 12px; color: var(--ui-accent); background: var(--ui-accent-soft); font-size: 1.1rem; }
.app-body-shell .company-card h3 { margin-top: .25rem; color: var(--ui-text); font-size: 1rem; font-weight: 700; }
.app-body-shell .company-card-main p { color: var(--ui-muted); font-size: .86rem; font-weight: 500; }
.app-body-shell .company-meta { color: var(--ui-muted); font-size: .8rem; }
.app-body-shell .company-card-actions { gap: .4rem; }
.app-body-shell .company-card-actions .ghost-link,
.app-body-shell .company-card-actions .danger-button { padding: .5rem .7rem; font-size: .77rem; min-height: 36px; }
.app-body-shell .status-pill { padding: .25rem .55rem; font-size: .65rem; letter-spacing: .025em; }
.app-body-shell .field { color: var(--ui-text); font-size: .83rem; }
.app-body-shell .field :is(input, select, textarea),
.app-body-shell .compact-field select {
    border: 1px solid var(--ui-border);
    border-radius: 9px;
    background: var(--ui-surface);
    color: var(--ui-text);
}
.app-body-shell .field :is(input, select, textarea):focus { border-color: var(--ui-accent); box-shadow: 0 0 0 3px rgba(67, 111, 216, .13); }
.app-body-shell .compact-field span { color: var(--ui-muted); }
.app-body-shell .stat-card,
.app-body-shell .pipeline-card,
.app-body-shell .quick-action-card { border: 1px solid var(--ui-border); border-radius: 14px; background: var(--ui-surface); box-shadow: var(--ui-shadow); }
.app-body-shell .quick-action-card { color: var(--ui-text); }
.app-body-shell .stat-card { text-align: left; padding: 1.2rem; }
.app-body-shell .stat-card strong { font-size: 1.8rem; letter-spacing: -.04em; }
.app-body-shell .stat-card span { color: var(--ui-muted); }
.app-body-shell .detail-block { background: var(--ui-canvas); color: var(--ui-text); }
.app-body-shell .global-shell-footer { background: var(--ui-canvas); }
.app-body-shell .company-card details { margin-top: .35rem; color: var(--ui-accent); font-size: .82rem; }
.app-body-shell .company-card details summary { cursor: pointer; font-weight: 600; }
.app-body-shell .company-card details textarea { width: 100%; max-width: 520px; margin-top: .5rem; border: 1px solid var(--ui-border); border-radius: 9px; padding: .75rem; background: var(--ui-surface); color: var(--ui-text); }
.instagram-workspace { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr); gap: 1rem; align-items: start; }
.instagram-page .instagram-workspace .form-panel { height: 100%; margin: 0; }
.instagram-page .form-panel > p { color: var(--ui-muted); font-size: .88rem; line-height: 1.6; }
.instagram-page .instagram-compose form { display: grid; gap: 1rem; }
.instagram-page .instagram-compose .form-actions { margin-top: .25rem; }
.instagram-page .instagram-reasons .company-card { margin-top: .75rem; }
.instagram-page .instagram-reasons .company-card form { min-width: 0; }
.instagram-page .instagram-history { margin-top: 1rem; }
.instagram-page .instagram-history .company-card + .company-card { margin-top: .7rem; }
.instagram-page .instagram-history form { display: grid; gap: .75rem; margin-top: .5rem; }
.instagram-page .instagram-history form button { justify-self: start; }
@media (max-width: 900px) {
    .instagram-workspace { grid-template-columns: 1fr; }
    .instagram-page .instagram-workspace .form-panel { height: auto; }
    .app-body-shell .company-card { grid-template-columns: minmax(0, 1fr); }
    .app-body-shell .company-card-actions { justify-content: flex-start; }
}
@media (max-width: 640px) {
    .app-body-shell .global-shell-header { padding: 0 1rem; }
    .app-body-shell .global-brand-wrap { width: 130px; min-width: 130px; height: 40px; }
    .app-body-shell .page-shell { padding: 1.5rem 1rem 3rem; }
    .app-body-shell .list-panel, .app-body-shell .form-panel { padding: 1rem; }
    .app-body-shell .page-header { align-items: stretch; }
    .app-body-shell .company-card-actions { width: 100%; flex-direction: row; align-items: center; flex-wrap: wrap; }
    .app-body-shell .company-card-actions .ghost-link,
    .app-body-shell .company-card-actions .danger-button,
    .app-body-shell .company-card-actions .primary-link { width: auto; }
    .app-body-shell .company-card-actions form { width: auto; }
    .instagram-page .instagram-reasons .company-card { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    .app-body-shell :is(.company-card, .primary-link, .ghost-link, .danger-button, .global-top-nav a) { transition: none; }
}