.developer-main {
    padding: 0 0 3rem;
}

body.developer-page .nav-container {
    width: min(1440px, calc(100% - 2rem));
    grid-template-columns: minmax(10rem, auto) minmax(34rem, 1fr) minmax(24rem, auto);
    gap: clamp(0.8rem, 1.4vw, 1.4rem);
}

body.developer-page .nav-menu {
    gap: clamp(0.7rem, 1.1vw, 1.2rem);
}

body.developer-page .nav-link {
    font-size: 0.92rem;
}

body.developer-page .nav-account {
    max-width: min(34rem, 42vw);
    flex: 1 1 auto;
}

body.developer-page.developer-signed-in .nav-actions .nav-become-dev-btn {
    display: none;
}

body.developer-page.developer-signed-in .nav-account {
    max-width: min(30rem, 38vw);
}

body.developer-page .nav-account-actions {
    gap: clamp(0.5rem, 0.8vw, 0.75rem);
    flex-wrap: nowrap;
}

body.developer-page .nav-dev-btn,
body.developer-page .nav-auth-signout {
    min-height: 2.45rem;
    padding-inline: 0.85rem;
}

.developer-hero {
    padding: 0 0 1.2rem;
}

.developer-hero-grid,
.developer-dashboard {
    display: grid;
    gap: 1rem;
    align-items: start;
}

.developer-hero-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(18rem, 0.8fr);
}

.developer-dashboard {
    grid-template-columns: minmax(12rem, 16rem) minmax(0, 1fr);
}

.developer-hero-copy,
.developer-readiness-panel,
.developer-sidebar,
.developer-gate,
.developer-panel {
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: var(--radius-xl);
    background: rgba(255, 255, 255, 0.04);
    box-shadow: var(--shadow-soft);
}

.developer-hero-copy,
.developer-readiness-panel,
.developer-gate,
.developer-panel {
    padding: 1.1rem;
}

.developer-hero-copy {
    display: grid;
    gap: 0.9rem;
}

.developer-hero-copy h1 {
    max-width: 52rem;
    font-size: clamp(2.2rem, 5vw, 3.55rem);
    line-height: 1.02;
    letter-spacing: -0.05em;
}

.developer-hero-copy p,
.developer-readiness-panel p,
.developer-form-status,
.developer-card p,
.developer-overview-grid span,
.developer-action-card span,
.developer-economics-grid span,
.developer-policy-grid span,
.developer-stat-card span,
.developer-analytics-block h3,
.developer-upload-box p {
    color: var(--text-muted);
}

.developer-hero-actions,
.developer-form-actions,
.developer-panel-head,
.developer-panel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.developer-panel-head {
    justify-content: space-between;
    margin-bottom: 0.95rem;
}

.developer-panel-head h2,
.developer-gate h2,
.developer-readiness-panel h2 {
    margin: 0;
}

.developer-readiness-panel,
.developer-gate {
    display: grid;
    gap: 0.85rem;
}

.developer-status-list,
.developer-deployment-list {
    display: grid;
    gap: 0.55rem;
}

.developer-status-list span,
.developer-deployment-list span,
.developer-pill {
    display: inline-flex;
    align-items: center;
    min-height: 2rem;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: rgba(15, 23, 42, 0.58);
    font-size: 0.86rem;
    font-weight: 800;
}

.developer-status-list span::before {
    content: "";
    width: 0.48rem;
    height: 0.48rem;
    margin-right: 0.45rem;
    border-radius: 999px;
    background: #f59e0b;
}

.developer-status-list span[data-state="ready"]::before,
.developer-pill[data-state="ready"] {
    background: rgba(34, 197, 94, 0.14);
    border-color: rgba(34, 197, 94, 0.34);
}

.developer-status-list span[data-state="ready"]::before {
    background: #22c55e;
}

.developer-status-list span[data-state="blocked"]::before,
.developer-pill[data-state="blocked"] {
    background: rgba(248, 113, 113, 0.14);
    border-color: rgba(248, 113, 113, 0.34);
}

.developer-status-list span[data-state="blocked"]::before {
    background: #f87171;
}

.developer-shell {
    padding: 0 0 1rem;
}

.developer-sidebar {
    position: sticky;
    top: 0.8rem;
    display: grid;
    gap: 0.35rem;
    padding: 0.65rem;
}

.developer-sidebar a {
    display: flex;
    align-items: center;
    min-height: 2.45rem;
    padding: 0.55rem 0.75rem;
    border-radius: var(--radius-md);
    color: var(--text-muted);
    font-weight: 800;
}

.developer-sidebar a:hover,
.developer-sidebar a:focus-visible,
.developer-sidebar a.is-active {
    background: rgba(56, 189, 248, 0.12);
    color: var(--text-primary);
}

.developer-content {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.developer-panel[data-developer-view] {
    display: none;
}

.developer-panel[data-developer-view].is-active {
    display: grid;
    gap: 0.95rem;
}

.developer-gate {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.developer-gate.is-hidden {
    display: none;
}

.developer-panel {
    min-width: 0;
}

.developer-form,
.developer-upload-box {
    display: grid;
    gap: 0.85rem;
}

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

.developer-form label,
.developer-upload-box label {
    display: grid;
    gap: 0.38rem;
    color: var(--text-muted);
    font-size: 0.84rem;
    font-weight: 800;
}

.developer-form input,
.developer-form textarea,
.developer-form select,
.developer-upload-box input,
.developer-upload-box select {
    width: 100%;
    min-height: 2.75rem;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: var(--radius-md);
    background: rgba(15, 23, 42, 0.78);
    color: var(--text-primary);
    padding: 0.72rem 0.8rem;
    outline: none;
}

.developer-form textarea {
    resize: vertical;
}

.developer-form input:focus,
.developer-form textarea:focus,
.developer-form select:focus,
.developer-upload-box input:focus,
.developer-upload-box select:focus {
    border-color: rgba(56, 189, 248, 0.62);
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.12);
}

.developer-form-actions {
    justify-content: flex-start;
}

.developer-form-status {
    min-height: 1.5rem;
    font-size: 0.9rem;
}

.developer-form-note {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.55;
}

.developer-upload-box {
    margin-top: 1rem;
    padding: 1rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(56, 189, 248, 0.18);
    background: rgba(8, 47, 73, 0.18);
}

.developer-list {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
}

.developer-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: start;
    padding: 0.95rem;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(148, 163, 184, 0.13);
    background: rgba(255, 255, 255, 0.035);
}

.developer-card h3 {
    margin: 0 0 0.35rem;
    font-size: 1.05rem;
}

.developer-card p {
    margin: 0;
}

.developer-card-note {
    grid-column: 1 / -1;
    color: var(--text-muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.developer-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.7rem;
}

.developer-card-meta span {
    padding: 0.28rem 0.5rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--text-muted);
    font-size: 0.75rem;
    font-weight: 800;
}

.developer-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
}

.developer-card-actions .btn,
.developer-card-actions .text-btn {
    white-space: nowrap;
}

.developer-policy-grid a {
    color: var(--accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.developer-overview-grid,
.developer-actions-grid,
.developer-economics-grid,
.developer-policy-grid,
.developer-analytics-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.developer-overview-grid article,
.developer-action-card,
.developer-economics-grid article,
.developer-policy-grid article,
.developer-analytics-block {
    display: grid;
    gap: 0.35rem;
    padding: 0.95rem;
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: var(--radius-lg);
    background: rgba(255, 255, 255, 0.035);
}

.developer-action-card {
    color: var(--text-primary);
}

.developer-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
}

.developer-chart {
    min-height: 12rem;
    display: grid;
    grid-template-rows: minmax(8rem, 1fr) auto;
    gap: 0.65rem;
    padding: 0.8rem;
    border-radius: var(--radius-md);
    border: 1px solid rgba(148, 163, 184, 0.12);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02)),
        rgba(15, 23, 42, 0.46);
}

.developer-chart-bars {
    display: flex;
    align-items: end;
    gap: 0.5rem;
    min-height: 8.5rem;
}

.developer-chart-bar {
    flex: 1 1 0;
    min-width: 0.65rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    align-items: end;
    min-height: 8.5rem;
    gap: 0.3rem;
}

.developer-chart-fill {
    display: block;
    min-height: 0.35rem;
    border-radius: 999px 999px 0.25rem 0.25rem;
    background: linear-gradient(180deg, var(--chart-color), rgba(34, 197, 94, 0.72));
    box-shadow: 0 0 18px color-mix(in srgb, var(--chart-color) 32%, transparent);
}

.developer-chart-value,
.developer-chart-label {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    text-align: center;
    white-space: nowrap;
}

.developer-chart-value {
    color: var(--text-primary);
}

.developer-chart-key {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.7rem;
    align-items: center;
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 800;
}

.developer-chart-key span {
    display: inline-flex;
    align-items: center;
    gap: 0.32rem;
}

.developer-chart-key i {
    width: 0.62rem;
    height: 0.62rem;
    border-radius: 999px;
    display: inline-block;
}

.developer-chart-key strong {
    color: var(--text-primary);
}

.developer-stat-card {
    display: grid;
    gap: 0.25rem;
    min-height: 5.5rem;
    padding: 0.85rem;
    border-radius: var(--radius-md);
    background: rgba(15, 23, 42, 0.56);
    border: 1px solid rgba(148, 163, 184, 0.12);
}

.developer-stat-card strong {
    font-size: clamp(1.35rem, 3vw, 2rem);
    line-height: 1;
}

.developer-upload-credit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
}

.developer-credit-card,
.developer-section-subhead {
    display: grid;
    gap: 0.45rem;
    padding: 0.85rem;
    border-radius: var(--radius-md);
    background: rgba(15, 23, 42, 0.56);
    border: 1px solid rgba(148, 163, 184, 0.12);
}

.developer-credit-card-wide {
    grid-column: 1 / -1;
}

.developer-credit-card strong,
.developer-section-subhead h3 {
    margin: 0;
    color: var(--text-primary);
}

.developer-credit-card span,
.developer-section-subhead span {
    color: var(--text-muted);
    line-height: 1.55;
}

.developer-section-subhead {
    margin-top: 1rem;
}

.developer-policy-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding-top: 0.25rem;
}

.developer-policy-consent {
    flex-basis: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    align-items: start;
    max-width: 780px;
    color: var(--text-muted);
    font-size: 0.92rem;
    line-height: 1.55;
}

.developer-policy-consent input {
    width: 1.1rem;
    height: 1.1rem;
    margin-top: 0.12rem;
    accent-color: var(--accent);
}

body.developer-policy-locked [data-policy-required] {
    opacity: 0.58;
}

.developer-checkout-form {
    margin-top: 1rem;
}

body[data-auth-mode="guest"] .nav-dev-btn {
    display: none;
}

body.developer-signed-out .developer-sidebar,
body.developer-signed-out .developer-panel[data-developer-view] {
    display: none !important;
}

body.developer-signed-out .developer-dashboard {
    grid-template-columns: 1fr;
}

body:not(.developer-super-admin) [data-admin-only] {
    display: none !important;
}

@media (max-width: 1240px) {
    body.developer-page .nav-container {
        grid-template-columns: minmax(9rem, auto) minmax(22rem, 1fr) minmax(18rem, auto);
    }

    body.developer-page .nav-account,
    body.developer-page.developer-signed-in .nav-account {
        max-width: min(24rem, 34vw);
    }

    body.developer-page .nav-account-copy small {
        display: none;
    }
}

@media (max-width: 980px) {
    body.developer-page .nav-container {
        display: flex;
    }

    body.developer-page .nav-account {
        max-width: none;
        flex: 0 1 auto;
    }

    .developer-hero-grid,
    .developer-dashboard {
        grid-template-columns: 1fr;
    }

    .developer-upload-credit-grid {
        grid-template-columns: 1fr;
    }

    .developer-sidebar {
        position: static;
        display: flex;
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .developer-sidebar a {
        flex: 0 0 auto;
    }
}

@media (max-width: 720px) {
    body.developer-page .nav-actions .nav-become-dev-btn,
    body.developer-page .nav-dev-btn {
        display: none;
    }

    .developer-hero-copy,
    .developer-readiness-panel,
    .developer-gate,
    .developer-panel {
        padding: 0.9rem;
        border-radius: var(--radius-lg);
    }

    .developer-gate,
    .developer-card,
    .developer-form-grid,
    .developer-overview-grid,
    .developer-actions-grid,
    .developer-economics-grid,
    .developer-policy-grid,
    .developer-analytics-grid,
    .developer-stat-grid {
        grid-template-columns: 1fr;
    }

    .developer-card-actions {
        justify-content: flex-start;
    }
}