html[data-shell-theme="inapp"] {
    --jf-primary: #e66239;
    --jf-secondary: #404040;
    --jf-tertiary: #00c951;
    --jf-text: #171717;
    --jf-text-soft: #525252;
    --jf-text-muted: #737373;
    --jf-bg: #f8fafc;
    --jf-bg-deep: #eef2f7;
    --jf-surface-glass: rgba(255, 255, 255, 0.96);
    --jf-surface-strong: #ffffff;
    --jf-surface-muted: #f9fafb;
    --jf-surface-float: rgba(255, 255, 255, 0.98);
    --jf-surface-glass: rgba(255, 255, 255, 0.92);
    --jf-border: rgba(212, 212, 212, 0.72);
    --jf-border-strong: rgba(163, 163, 163, 0.9);
    --jf-grid-line: rgba(163, 163, 163, 0.08);
    --jf-row-even: #ffffff;
    --jf-row-odd: #fafafa;
    --jf-row-hover: rgba(230, 98, 57, 0.07);
    --jf-shadow-rest: 0 10px 22px rgba(23, 23, 23, 0.06);
    --jf-shadow-card: 0 18px 42px rgba(23, 23, 23, 0.08);
    --jf-shadow-overlay: 0 24px 56px rgba(23, 23, 23, 0.12);
    --jf-nav-primary: #ffffff;
    --jf-nav-secondary: #ffffff;
    --jf-nav-text: #262626;
    --jf-nav-text-soft: #737373;
    --jf-nav-icon: #404040;
    --jf-nav-accent: rgba(230, 98, 57, 0.12);
    --jf-hero: linear-gradient(135deg, #ffffff 0%, #fff8f5 100%);
    --jf-radius-xl: 20px;
    --jf-radius-lg: 16px;
    --jf-radius-md: 12px;
    --jf-radius-sm: 10px;
}

html[data-shell-theme="inapp"] body {
    background:
        radial-gradient(circle at top right, rgba(230, 98, 57, 0.08), transparent 22%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
    color: var(--jf-text);
}

html[data-shell-theme="inapp"] .app-shell__aurora--primary,
html[data-shell-theme="inapp"] .app-shell__aurora--secondary,
html[data-shell-theme="inapp"] .app-shell__grid {
    opacity: .55;
}

html[data-shell-theme="inapp"] .app-shell__appbar {
    margin: 0;
    border-radius: 0 !important;
    border-left: none;
    border-right: none;
    border-top: none;
    padding-inline: 18px;
    min-height: 64px;
    background: #ffffff !important;
    box-shadow: 0 1px 0 rgba(229, 231, 235, 0.9);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

html[data-shell-theme="inapp"] .app-shell__menu-button,
html[data-shell-theme="inapp"] .app-shell__icon-action {
    background: #f5f5f5 !important;
    border: 1px solid rgba(212, 212, 212, 0.92) !important;
    box-shadow: none !important;
    color: var(--jf-text) !important;
}

html[data-shell-theme="inapp"] .app-shell__brandmark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #fff5f1;
    border-color: rgba(230, 98, 57, 0.18);
}

html[data-shell-theme="inapp"] .app-shell__brandkicker {
    color: #737373;
    letter-spacing: .08em;
}

html[data-shell-theme="inapp"] .app-shell__brandtitle {
    font-size: .96rem;
    font-weight: 800;
}

html[data-shell-theme="inapp"] .app-shell__toolbar {
    gap: 10px;
}

html[data-shell-theme="inapp"] .app-shell__toolbar-chip {
    background: #fff7ed !important;
    color: var(--jf-primary) !important;
    border-color: rgba(230, 98, 57, 0.14) !important;
}

html[data-shell-theme="inapp"] .app-shell__user-trigger {
    min-height: 44px;
    border-radius: 999px !important;
    background: #ffffff;
    border: 1px solid rgba(229, 231, 235, 0.96);
    box-shadow: none;
}

html[data-shell-theme="inapp"] .app-shell__drawer {
    margin: 0;
    height: 100vh !important;
    border-radius: 0 !important;
}

html[data-shell-theme="inapp"] .app-shell__main {
    padding: 78px 14px 16px !important;
}

html[data-shell-theme="inapp"] .app-shell__viewport {
    gap: 12px;
}

html[data-shell-theme="inapp"] .app-shell__hero {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

html[data-shell-theme="inapp"] .app-shell__hero-main,
html[data-shell-theme="inapp"] .app-shell__hero-side,
html[data-shell-theme="inapp"] .app-shell__content {
    border-radius: 16px;
    border-color: rgba(229, 231, 235, 0.96);
    box-shadow: 0 14px 34px rgba(23, 23, 23, 0.06);
}

html[data-shell-theme="inapp"] .app-shell__hero-main {
    color: var(--jf-text);
    padding: 22px 24px;
    background: #ffffff;
}

html[data-shell-theme="inapp"] .app-shell__hero-main::after {
    background: rgba(230, 98, 57, 0.08);
}

html[data-shell-theme="inapp"] .app-shell__eyebrow {
    background: #fff7ed;
    color: var(--jf-primary);
}

html[data-shell-theme="inapp"] .app-shell__description {
    color: var(--jf-text-soft);
}

html[data-shell-theme="inapp"] .app-shell__hero-side {
    background: #ffffff;
    padding: 16px;
}

html[data-shell-theme="inapp"] .app-shell__stat {
    border-radius: 18px;
    background: #fafafa;
    border-color: rgba(229, 231, 235, 0.96);
}

html[data-shell-theme="inapp"] .app-shell__content {
    padding: 10px;
    background: transparent;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

html[data-shell-theme="inapp"] .app-shell__content > * {
    border-radius: 16px;
}

html[data-shell-theme="inapp"] .codepen-nav {
    border-radius: 0 !important;
    border-top: none !important;
    border-bottom: none !important;
    border-right: none !important;
    box-shadow: 1px 0 0 rgba(229, 231, 235, 0.92) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

html[data-shell-theme="inapp"] .codepen-nav .codepen-nav-content::before {
    left: auto;
    right: 0;
    width: 4px;
    border-radius: 12px 0 0 12px;
    background: linear-gradient(180deg, var(--jf-primary), #ff9b7b);
    box-shadow: none;
}

html[data-shell-theme="inapp"] .codepen-nav .mud-nav-group .mud-nav-group-title,
html[data-shell-theme="inapp"] .codepen-nav .mud-nav-link {
    margin-left: 12px;
    margin-right: 12px;
    min-height: 42px;
    border-radius: 12px;
}

html[data-shell-theme="inapp"] .codepen-nav .mud-nav-group .mud-nav-group-title:hover,
html[data-shell-theme="inapp"] .codepen-nav .mud-nav-link:hover,
html[data-shell-theme="inapp"] .codepen-nav .mud-nav-link.mud-selected {
    background: #fff7ed !important;
    color: var(--jf-primary) !important;
    transform: none;
}

html[data-shell-theme="inapp"] .codepen-nav .mud-nav-group .mud-nav-group-title .mud-icon-root,
html[data-shell-theme="inapp"] .codepen-nav .mud-nav-link .mud-icon-root {
    color: currentColor !important;
}

html[data-shell-theme="inapp"] .codepen-nav .codepen-nav-footer {
    background: #fafafa;
    border-color: rgba(229, 231, 235, 0.96);
}

html[data-shell-theme="inapp"] .codepen-nav .codepen-nav-footer-avatar {
    background: linear-gradient(135deg, var(--jf-primary), #ff9b7b);
}

html[data-shell-theme="inapp"] .mud-paper,
html[data-shell-theme="inapp"] .mud-card,
html[data-shell-theme="inapp"] .mud-data-grid,
html[data-shell-theme="inapp"] .mud-table,
html[data-shell-theme="inapp"] .mud-dialog {
    border-radius: 16px !important;
    border: 1px solid rgba(229, 231, 235, 0.96) !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(23, 23, 23, 0.06) !important;
}

html[data-shell-theme="inapp"] .mud-card-header,
html[data-shell-theme="inapp"] .mud-dialog-title,
html[data-shell-theme="inapp"] .mud-table-head,
html[data-shell-theme="inapp"] .mud-data-grid .mud-table-head {
    background:
        linear-gradient(180deg, #ffffff 0%, #fafafa 100%) !important;
    border-bottom-color: rgba(229, 231, 235, 0.96) !important;
}

html[data-shell-theme="inapp"] .mud-card-header .mud-typography,
html[data-shell-theme="inapp"] .mud-dialog-title,
html[data-shell-theme="inapp"] .mud-table-head .mud-table-cell,
html[data-shell-theme="inapp"] .mud-data-grid .mud-table-head .mud-table-cell {
    font-weight: 800;
}

html[data-shell-theme="inapp"] .mud-card-actions,
html[data-shell-theme="inapp"] .mud-dialog-actions,
html[data-shell-theme="inapp"] .mud-table-pagination,
html[data-shell-theme="inapp"] .mud-data-grid .mud-table-pagination {
    background: #fafafa !important;
    border-top-color: rgba(229, 231, 235, 0.96) !important;
}

html[data-shell-theme="inapp"] .mud-button-root,
html[data-shell-theme="inapp"] .mud-button,
html[data-shell-theme="inapp"] .mud-icon-button,
html[data-shell-theme="inapp"] .mud-fab {
    border-radius: 10px !important;
}

html[data-shell-theme="inapp"] .mud-icon-button {
    box-shadow: none !important;
}

html[data-shell-theme="inapp"] .mud-input-slot,
html[data-shell-theme="inapp"] .mud-select-input,
html[data-shell-theme="inapp"] .mud-input-root,
html[data-shell-theme="inapp"] .mud-input-control .mud-input-outlined-border,
html[data-shell-theme="inapp"] .mud-select .mud-input-outlined-border,
html[data-shell-theme="inapp"] .mud-autocomplete .mud-input-outlined-border {
    border-radius: 10px !important;
}

html[data-shell-theme="inapp"] .mud-input-control .mud-input-outlined-border,
html[data-shell-theme="inapp"] .mud-select .mud-input-outlined-border,
html[data-shell-theme="inapp"] .mud-autocomplete .mud-input-outlined-border {
    border-color: rgba(212, 212, 212, 0.96) !important;
}

html[data-shell-theme="inapp"] .mud-input-slot {
    background: #ffffff !important;
}

html[data-shell-theme="inapp"] .mud-table .mud-table-body .mud-table-cell,
html[data-shell-theme="inapp"] .mud-data-grid .mud-table-body .mud-table-cell {
    color: #404040;
}

html[data-shell-theme="inapp"] .mud-table .mud-table-body tr:hover,
html[data-shell-theme="inapp"] .mud-data-grid .mud-table-body tr:hover {
    background: rgba(230, 98, 57, 0.06) !important;
}

html[data-shell-theme="inapp"] .auth-shell,
html[data-shell-theme="inapp"] .blank-shell {
    background:
        radial-gradient(circle at top right, rgba(230, 98, 57, 0.1), transparent 22%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}

html[data-shell-theme="inapp"] .auth-shell__glow--primary,
html[data-shell-theme="inapp"] .auth-shell__glow--secondary {
    opacity: .36;
}

html[data-shell-theme="inapp"] .hero-card,
html[data-shell-theme="inapp"] .panel,
html[data-shell-theme="inapp"] .summary-card {
    border-radius: 20px;
    background: #ffffff;
    border-color: rgba(229, 231, 235, 0.96);
    box-shadow: 0 12px 30px rgba(23, 23, 23, 0.06);
}

html[data-shell-theme="inapp"] .hero-card {
    color: var(--jf-text);
    background: linear-gradient(180deg, #ffffff 0%, #fff8f5 100%);
}

html[data-shell-theme="inapp"] .hero-subtitle,
html[data-shell-theme="inapp"] .summary-label {
    color: var(--jf-text-soft);
}

html[data-shell-theme="inapp"] .summary-value {
    color: var(--jf-text);
}

@media (max-width: 960px) {
    html[data-shell-theme="inapp"] .app-shell__appbar {
        min-height: 64px;
        padding-inline: 12px;
    }

    html[data-shell-theme="inapp"] .app-shell__main {
        padding: 96px 12px 18px !important;
    }

    html[data-shell-theme="inapp"] .app-shell__content,
    html[data-shell-theme="inapp"] .mud-card,
    html[data-shell-theme="inapp"] .mud-data-grid,
    html[data-shell-theme="inapp"] .mud-table,
    html[data-shell-theme="inapp"] .mud-dialog {
        border-radius: 14px !important;
    }
}