:root {
    --ink: #17242d;
    --muted: #65747d;
    --line: rgba(130, 151, 160, .22);
    --paper: #eef3f5;
    --white: rgba(255, 255, 255, .76);
    --green: #0a9f78;
    --green-dark: #08765e;
    --green-soft: rgba(15, 173, 132, .12);
    --shadow: 0 18px 55px rgba(28, 54, 65, .11);
    --glass-shadow: 0 24px 70px rgba(38, 66, 77, .13), inset 0 1px 0 rgba(255, 255, 255, .78);
}

/* User console dashboard: subscription and growth workspace. */
.user-workspace {
    min-height: 100vh;
    background: #0d0d0e;
    background-image: radial-gradient(circle at 80% -10%, rgba(213, 173, 91, .1), transparent 35%), linear-gradient(135deg, rgba(213, 173, 91, .025), transparent 42%);
}

.user-workspace .sidebar {
    width: 252px;
    padding: 27px 16px 18px;
    background: rgba(18, 17, 15, .92);
    border-right: 1px solid rgba(213, 173, 91, .18);
    box-shadow: 18px 0 55px rgba(0, 0, 0, .18), inset -1px 0 rgba(255, 236, 184, .035);
}

.user-workspace .sidebar-brand {
    padding: 0 10px 28px;
}

.user-workspace .workspace-label {
    width: fit-content;
    margin: 0 10px 13px;
    padding: 5px 9px;
    border: 1px solid rgba(213, 173, 91, .25);
    border-radius: 999px;
    background: rgba(213, 173, 91, .09);
    color: #e6c77f;
    font-size: 10px;
    letter-spacing: .04em;
    text-transform: none;
}

.user-workspace .side-nav {
    gap: 4px;
}

.user-workspace .side-nav a {
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #a39d92;
}

.user-workspace .side-nav a:hover {
    background: rgba(213, 173, 91, .08);
    color: #f4ead5;
    transform: translateX(2px);
}

.user-workspace .side-nav a.active {
    background: linear-gradient(100deg, rgba(213, 173, 91, .18), rgba(213, 173, 91, .06));
    border-color: rgba(213, 173, 91, .2);
    color: #f0c76d;
    box-shadow: inset 3px 0 #d5ad5b, inset 0 1px 0 rgba(255, 238, 188, .08);
}

.user-workspace .side-nav a.active .icon,
.user-workspace .side-nav a:hover .icon {
    color: #e5bc61;
}

.user-workspace .nav-group {
    padding: 18px 12px 7px;
    color: #736d63;
    letter-spacing: .03em;
    text-transform: none;
}

.user-workspace .workspace-main {
    margin-left: 252px;
}

.user-workspace .workspace-topbar {
    min-height: 76px;
    height: 76px;
    padding: 0 clamp(24px, 4vw, 58px);
    background: rgba(15, 14, 13, .82);
    border-bottom-color: rgba(213, 173, 91, .14);
    backdrop-filter: blur(22px) saturate(125%);
    -webkit-backdrop-filter: blur(22px) saturate(125%);
}

.user-workspace .workspace-topbar h1 {
    color: #f6efe1;
    font-size: 20px;
    letter-spacing: 0;
}

.user-workspace .breadcrumb {
    color: #847d70;
    font-family: inherit;
    letter-spacing: 0;
}

.user-workspace .system-status {
    color: #d5ad5b;
}

.user-workspace .workspace-notice,
.user-workspace .topbar-actions > form .icon-button {
    color: #aaa296;
}

.user-workspace .workspace-notice:hover,
.user-workspace .topbar-actions > form .icon-button:hover {
    color: #f2d58d;
    background: rgba(213, 173, 91, .1);
}

.user-workspace .user-sidebar-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px 8px;
    padding: 17px 3px 0;
    border-top-color: rgba(213, 173, 91, .15);
}

.user-sidebar-footer .actor {
    min-width: 0;
}

.user-sidebar-footer .actor strong {
    color: #f0e9dc;
}

.user-sidebar-footer .actor small {
    color: #8f887b;
}

.user-sidebar-footer .avatar,
.user-workspace .topbar-actor .avatar {
    background: #d5ad5b;
    color: #17130d;
}

.sidebar-footer-actions {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.sidebar-footer-actions .button {
    min-height: 36px;
    padding: 8px 10px;
    font-size: 11px;
}

.user-dashboard {
    display: grid;
    gap: 18px;
}

.user-dashboard-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 8px;
}

.user-dashboard-heading h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(25px, 3vw, 34px);
    letter-spacing: 0;
}

.user-dashboard-heading p:not(.eyebrow) {
    margin: 7px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.user-dashboard-actions,
.referral-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
}

.user-dashboard-actions .button,
.referral-actions .button {
    min-height: 40px;
}

.user-dashboard-primary,
.user-dashboard-secondary {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(350px, .85fr);
    gap: 18px;
}

.user-dashboard-secondary {
    grid-template-columns: minmax(0, 1.08fr) minmax(350px, .92fr);
}

.user-surface {
    min-width: 0;
    padding: 25px 27px;
    border: 1px solid rgba(213, 173, 91, .18);
    border-radius: 18px;
    background: rgba(29, 27, 23, .82);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 236, 184, .06);
}

.user-surface-heading {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 21px;
}

.user-surface-heading > div {
    min-width: 0;
}

.user-surface-heading span,
.user-surface-heading > div > span {
    color: #9b9387;
    font-size: 11px;
}

.user-surface-heading h3 {
    margin: 4px 0 0;
    color: #f4eee3;
    font-size: 22px;
    letter-spacing: 0;
}

.user-surface-link {
    display: inline-flex;
    align-items: center;
    flex: none;
    gap: 5px;
    color: #e4b95d;
    font-size: 11px;
    font-weight: 800;
}

.user-surface-link:hover {
    color: #ffe1a0;
}

.subscription-name {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 21px;
}

.subscription-name strong {
    color: #e6b64f;
    font-size: 29px;
    letter-spacing: .02em;
}

.subscription-name span {
    overflow: hidden;
    color: #8f897f;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.subscription-meta {
    display: grid;
    gap: 11px;
    padding: 17px 0;
    border-top: 1px solid rgba(213, 173, 91, .13);
    border-bottom: 1px solid rgba(213, 173, 91, .13);
}

.subscription-meta > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.meta-icon,
.quick-icon {
    display: grid;
    place-items: center;
    flex: none;
    width: 30px;
    height: 30px;
    border-radius: 10px;
}

.meta-icon.green,
.quick-icon.green { color: #d7ad57; background: rgba(213, 173, 91, .14); }
.meta-icon.blue,
.quick-icon.blue { color: #94b9d6; background: rgba(99, 145, 181, .16); }
.meta-icon.violet,
.quick-icon.violet { color: #c1a5dc; background: rgba(148, 111, 185, .15); }

.subscription-meta p {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0;
    color: #a49d92;
    font-size: 12px;
}

.subscription-meta strong {
    color: #f3ecdf;
    font-size: 12px;
}

.subscription-progress {
    display: grid;
    gap: 8px;
    margin: 17px 0 20px;
}

.subscription-progress > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: #938b80;
    font-size: 10px;
}

.subscription-progress strong {
    color: #f0d08b;
    font-weight: 800;
}

.progress-track,
.usage-progress {
    height: 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(213, 173, 91, .12);
}

.progress-track i,
.usage-progress i {
    display: block;
    height: 100%;
    min-width: 3px;
    border-radius: inherit;
    background: linear-gradient(90deg, #bd8a31, #ebc86f);
    box-shadow: 0 0 14px rgba(213, 173, 91, .36);
}

.button-block {
    width: 100%;
}

.user-workspace .button-primary {
    color: #17130d;
}

.usage-card .user-surface-heading {
    align-items: end;
}

.usage-card .user-surface-heading h3 {
    font-size: 33px;
    line-height: 1.1;
}

.usage-limit {
    margin-bottom: 3px;
    color: #91897d !important;
    font-size: 11px !important;
}

.usage-progress {
    height: 10px;
    margin: 5px 0 18px;
    background: rgba(213, 173, 91, .13);
}

.usage-rows {
    display: grid;
    gap: 9px;
    margin-bottom: 21px;
}

.usage-rows > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 43px;
    padding: 9px 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .035);
}

.usage-rows span {
    color: #9c958a;
    font-size: 11px;
}

.usage-rows strong {
    color: #f1eadc;
    font-size: 12px;
}

.referral-row {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 52px;
    border-bottom: 1px solid rgba(213, 173, 91, .12);
}

.referral-row > span {
    color: #9d958a;
    font-size: 12px;
}

.referral-row strong,
.referral-row code {
    min-width: 0;
    overflow: hidden;
    color: #f2d184;
    font: 700 13px 'DM Mono', monospace;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.referral-row code {
    color: #b4aea5;
    font-size: 10px;
}

.referral-row .icon-button {
    color: #9f9587;
}

.referral-row .icon-button:hover {
    color: #e4b95d;
    background: rgba(213, 173, 91, .1);
}

.referral-actions {
    justify-content: space-between;
    margin-top: 18px;
}

.referral-actions > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #9b9388;
    font-size: 11px;
}

.referral-actions > span .icon {
    color: #d5ad5b;
}

.referral-note {
    display: flex;
    align-items: start;
    gap: 9px;
    margin-top: 20px;
    padding: 12px 13px;
    border-radius: 11px;
    background: rgba(112, 151, 207, .1);
    color: #9eb7d9;
}

.referral-note p {
    margin: 0;
    font-size: 10px;
    line-height: 1.7;
}

.referral-note .icon {
    flex: none;
    margin-top: 1px;
}

.user-count {
    color: #d5ad5b !important;
    font-size: 11px !important;
    font-weight: 800;
}

.invited-list {
    display: grid;
    gap: 2px;
}

.invited-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 10px 0;
    border-bottom: 1px solid rgba(213, 173, 91, .1);
}

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

.invited-item .avatar {
    width: 34px;
    height: 34px;
    background: rgba(213, 173, 91, .16);
    color: #e3b95d;
}

.invited-item > div {
    display: grid;
    min-width: 0;
    flex: 1;
}

.invited-item strong {
    overflow: hidden;
    color: #ece4d5;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invited-item small {
    color: #898176;
    font-size: 10px;
}

.invited-item b {
    color: #9c9385;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.invited-item b.is-qualified {
    color: #d5ad5b;
}

.invited-empty {
    display: grid;
    justify-items: center;
    padding: 26px 10px 16px;
    text-align: center;
}

.invited-empty > span {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: rgba(213, 173, 91, .12);
    color: #d5ad5b;
}

.invited-empty p {
    margin: 11px 0 2px;
    color: #eee6d9;
    font-size: 12px;
    font-weight: 700;
}

.invited-empty small {
    color: #8e8679;
    font-size: 10px;
}

.quick-actions-panel {
    padding-bottom: 22px;
}

.quick-actions-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.quick-actions-grid > a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 13px;
    border: 1px solid rgba(213, 173, 91, .12);
    border-radius: 12px;
    color: #91897d;
    transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.quick-actions-grid > a:hover {
    border-color: rgba(213, 173, 91, .34);
    background: rgba(213, 173, 91, .06);
    transform: translateY(-2px);
}

.quick-actions-grid > a > span:nth-child(2) {
    display: grid;
    min-width: 0;
    flex: 1;
}

.quick-actions-grid strong {
    overflow: hidden;
    color: #eee6d9;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quick-actions-grid small {
    overflow: hidden;
    color: #898176;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.quick-actions-grid > a > .icon:last-child {
    color: #d5ad5b;
}

html[data-theme="light"] .user-workspace {
    background: #f5f1e8;
    background-image: radial-gradient(circle at 82% -10%, rgba(213, 173, 91, .13), transparent 38%);
}

html[data-theme="light"] .user-workspace .sidebar {
    background: rgba(255, 253, 248, .94);
    border-right-color: rgba(127, 102, 55, .18);
}

html[data-theme="light"] .user-workspace .workspace-topbar {
    background: rgba(250, 247, 239, .9);
    border-bottom-color: rgba(127, 102, 55, .16);
}

html[data-theme="light"] .user-workspace .workspace-topbar h1,
html[data-theme="light"] .user-workspace .user-surface-heading h3,
html[data-theme="light"] .user-workspace .invited-item strong,
html[data-theme="light"] .user-workspace .quick-actions-grid strong {
    color: #2b261f;
}

html[data-theme="light"] .user-workspace .side-nav a {
    color: #71695d;
}

html[data-theme="light"] .user-workspace .side-nav a.active {
    color: #88621d;
    background: rgba(213, 173, 91, .13);
}

html[data-theme="light"] .user-surface {
    background: rgba(255, 253, 248, .92);
    border-color: rgba(127, 102, 55, .18);
    box-shadow: 0 20px 55px rgba(92, 70, 32, .09), inset 0 1px 0 #fff;
}

html[data-theme="light"] .subscription-meta strong,
html[data-theme="light"] .usage-rows strong {
    color: #332b20;
}

html[data-theme="light"] .subscription-name span,
html[data-theme="light"] .subscription-meta p,
html[data-theme="light"] .usage-rows span,
html[data-theme="light"] .referral-row > span {
    color: #776f63;
}

html[data-theme="light"] .usage-rows > div,
html[data-theme="light"] .quick-actions-grid > a {
    background: rgba(111, 86, 42, .045);
    border-color: rgba(127, 102, 55, .12);
}

html[data-theme="light"] .referral-row code {
    color: #625b52;
}

@media (max-width: 1100px) {
    .user-dashboard-primary,
    .user-dashboard-secondary { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .user-workspace .workspace-main { margin-left: 0; }
    .user-workspace .workspace-topbar { height: 70px; min-height: 70px; padding: 0 14px; }
    .user-workspace .workspace-topbar h1 { font-size: 18px; }
    .user-workspace .breadcrumb { display: none; }
    .user-dashboard { gap: 14px; }
    .user-dashboard-heading { display: block; }
    .user-dashboard-heading h2 { font-size: 26px; }
    .user-dashboard-actions { margin-top: 16px; }
    .user-dashboard-actions .button { flex: 1; }
    .user-surface { padding: 20px 17px; border-radius: 15px; }
    .user-surface-heading h3 { font-size: 19px; }
    .subscription-name strong { font-size: 25px; }
    .subscription-name span { font-size: 10px; }
    .referral-row { grid-template-columns: 92px minmax(0, 1fr) auto; gap: 8px; }
    .referral-row > span { font-size: 10px; }
    .referral-actions { align-items: start; flex-direction: column; }
    .referral-actions > span { align-self: end; }
    .quick-actions-grid { grid-template-columns: 1fr; }
    .quick-actions-grid > a { min-height: 58px; }
    .user-workspace .topbar-actions { gap: 1px; }
    .user-workspace .topbar-actions .system-status,
    .user-workspace .topbar-actor { display: none; }
}

/* Client installation guides inspired by the reference console. */
.user-workspace .nav-recommend {
    display: inline-flex;
    align-items: center;
    min-height: 17px;
    margin-left: auto;
    padding: 0 6px;
    border-radius: 999px;
    background: #e6b64f;
    color: #17130d;
    font-size: 9px;
    line-height: 1;
}

.user-workspace .side-nav {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    align-content: start;
    scrollbar-width: thin;
    scrollbar-color: rgba(213, 173, 91, .45) transparent;
}

.client-doc-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 226px;
    gap: clamp(25px, 4vw, 58px);
    max-width: 1280px;
    margin: 0 auto;
    padding: 4px 0 46px;
}

.client-doc-main {
    min-width: 0;
    padding: 0 0 30px;
}

.client-doc-platforms {
    display: flex;
    gap: 28px;
    min-height: 49px;
    border-bottom: 1px solid rgba(213, 173, 91, .18);
}

.client-doc-platforms button {
    position: relative;
    padding: 0 4px;
    border: 0;
    background: transparent;
    color: #8e877c;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.client-doc-platforms button::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 2px;
    background: transparent;
    content: '';
}

.client-doc-platforms button:hover,
.client-doc-platforms button.active { color: #e7b956; }
.client-doc-platforms button.active::after { background: #d5ad5b; }

.client-doc-hero {
    padding: 42px 0 37px;
}

.client-doc-icon {
    display: grid;
    place-items: center;
    width: 53px;
    height: 53px;
    margin-bottom: 21px;
    border: 1px solid currentColor;
    border-radius: 17px;
    background: rgba(213, 173, 91, .09);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .15), inset 0 1px rgba(255, 239, 193, .12);
}

.client-doc-hero .eyebrow { margin-bottom: 9px; }
.client-doc-hero h2 { margin: 0; color: #f7f0e2; font-size: clamp(29px, 4vw, 44px); letter-spacing: 0; line-height: 1.12; }
.client-doc-hero h2 span { color: #d5ad5b; }
.client-doc-hero > p:last-child { max-width: 730px; margin: 17px 0 0; color: #a39b8e; font-size: 14px; line-height: 1.85; }

.client-doc-compatibility {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    max-width: 820px;
    margin-top: 22px;
    padding: 14px 16px;
    border: 1px solid rgba(213, 173, 91, .22);
    border-radius: 12px;
    background: rgba(213, 173, 91, .07);
}

.client-doc-compatibility > .icon { flex: none; margin-top: 1px; }
.client-doc-compatibility strong { color: #f0e6d2; font-size: 12px; }
.client-doc-compatibility p { margin: 4px 0 0; color: #a39b8e; font-size: 11px; line-height: 1.72; }
.client-doc-compatibility.tone-partial { border-color: rgba(92, 166, 177, .27); background: rgba(70, 143, 153, .08); color: #83c4ca; }
.client-doc-compatibility.tone-adapter { border-color: rgba(218, 172, 75, .3); color: #e2b14d; }
.client-doc-compatibility.tone-unsupported { border-color: rgba(204, 105, 91, .28); background: rgba(169, 71, 61, .08); color: #e28f82; }

.client-doc-source-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 15px;
    color: #756e63;
    font-size: 10px;
}

.client-doc-source-row a { display: inline-flex; align-items: center; gap: 5px; color: #b79a5d; font-weight: 700; }
.client-doc-source-row a:hover { color: #e4bc67; }

.accent-coral { color: #e99574; }
.accent-gold { color: #e6b64f; }
.accent-blue { color: #87b4d6; }
.accent-violet { color: #c5a3df; }
.accent-cyan { color: #71c4c5; }
.accent-green { color: #79c693; }
.accent-slate { color: #a7b2c4; }
.accent-red { color: #e98779; }

.client-doc-section {
    scroll-margin-top: 96px;
    padding: 30px 0 34px;
    border-top: 1px solid rgba(213, 173, 91, .14);
}

.client-doc-section-heading {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 18px;
}

.client-doc-section-heading > span {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border: 1px solid rgba(213, 173, 91, .34);
    border-radius: 50%;
    color: #d5ad5b;
    font: 800 10px 'DM Mono', monospace;
}

.client-doc-section-heading .eyebrow { margin-bottom: 4px; }
.client-doc-section-heading h3 { margin: 0; color: #f4ede0; font-size: 24px; letter-spacing: 0; }
.client-doc-copy { max-width: 800px; margin: 0 0 17px; color: #a39b8e; font-size: 13px; line-height: 1.85; }
.client-doc-platform-note { margin: -5px 0 14px; color: #81796d; font-size: 10px; }
.client-doc-copy code, .client-doc-callout code, .client-doc-faq code { color: #e6b64f; font: 600 11px 'DM Mono', monospace; }

.client-doc-checklist { display: grid; gap: 11px; margin: 0; padding: 0; list-style: none; }
.client-doc-checklist li { display: flex; align-items: center; gap: 10px; color: #b9b0a1; font-size: 13px; }
.client-doc-checklist .icon { color: #d5ad5b; }

.client-doc-code-block {
    overflow: hidden;
    border: 1px solid rgba(213, 173, 91, .18);
    border-radius: 13px;
    background: #171510;
    box-shadow: 0 20px 45px rgba(0, 0, 0, .16), inset 0 1px rgba(255, 239, 193, .05);
}

.client-doc-code-head {
    display: flex;
    align-items: center;
    min-height: 43px;
    padding: 0 12px 0 15px;
    border-bottom: 1px solid rgba(213, 173, 91, .15);
    color: #cbb274;
    font: 700 10px 'DM Mono', monospace;
}

.client-doc-code-head span { margin-right: auto; }
.client-doc-code-head .icon-button { color: #bda56e; }
.client-doc-code-block pre { margin: 0; padding: 18px 17px 20px; overflow: auto; color: #eee5d4; font: 500 11px/1.8 'DM Mono', monospace; white-space: pre-wrap; word-break: break-word; }
.client-doc-code-block code { padding: 0; color: inherit; background: transparent; font: inherit; }
.client-doc-code-stack { display: grid; gap: 12px; }
.client-doc-block-note { margin: -5px 2px 2px; color: #847d71; font-size: 10px; line-height: 1.65; }
.client-doc-verification { margin-top: 17px; }
.client-doc-platform-panel[hidden] { display: none !important; }

.client-doc-callout {
    display: flex;
    align-items: start;
    gap: 11px;
    margin-top: 17px;
    padding: 14px 16px;
    border: 1px solid rgba(213, 173, 91, .2);
    border-radius: 12px;
    background: rgba(213, 173, 91, .08);
}

.client-doc-callout > .icon { flex: none; margin-top: 1px; color: #d5ad5b; }
.client-doc-callout strong { color: #f2e9d8; font-size: 12px; }
.client-doc-callout p { margin: 4px 0 0; color: #a39b8e; font-size: 11px; line-height: 1.7; }

.client-doc-step-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 19px; }
.client-doc-step-grid > div { min-height: 105px; padding: 13px; border: 1px solid rgba(213, 173, 91, .14); border-radius: 11px; background: rgba(255, 255, 255, .025); }
.client-doc-step-grid span { color: #d5ad5b; font: 800 10px 'DM Mono', monospace; }
.client-doc-step-grid p { margin: 11px 0 0; color: #afa697; font-size: 11px; line-height: 1.6; }

.client-doc-faq { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.client-doc-faq > div { padding: 16px; border: 1px solid rgba(213, 173, 91, .14); border-radius: 11px; background: rgba(255, 255, 255, .025); }
.client-doc-faq strong { color: #f0e8db; font-size: 12px; }
.client-doc-faq p { margin: 7px 0 0; color: #a39b8e; font-size: 11px; line-height: 1.7; }

.client-doc-footer-actions { display: flex; flex-wrap: wrap; gap: 9px; padding-top: 12px; }

.client-doc-aside { position: sticky; top: 98px; align-self: start; padding: 31px 0 0; }
.client-doc-aside > p { margin: 0 0 13px; color: #f0e8db; font-size: 12px; font-weight: 800; }
.client-doc-aside nav { display: grid; gap: 3px; }
.client-doc-aside nav a { display: flex; align-items: center; gap: 8px; min-height: 34px; padding: 6px 8px; border-left: 2px solid transparent; color: #8f887c; font-size: 11px; transition: color .2s ease, background .2s ease, border-color .2s ease; }
.client-doc-aside nav a:hover, .client-doc-aside nav a.active { border-color: #d5ad5b; background: rgba(213, 173, 91, .09); color: #f0c76d; }
.client-doc-aside nav a b { margin-left: auto; padding: 3px 6px; border-radius: 999px; background: #d5ad5b; color: #17130d; font-size: 8px; }
.client-nav-icon { display: grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 7px; background: rgba(255, 255, 255, .05); }
.client-doc-toc { display: grid; gap: 9px; margin-top: 28px; padding: 17px 9px; border-top: 1px solid rgba(213, 173, 91, .16); }
.client-doc-toc strong { margin-bottom: 3px; color: #e7dcc8; font-size: 11px; }
.client-doc-toc a { color: #80786c; font-size: 10px; }
.client-doc-toc a:hover { color: #d5ad5b; }

html[data-theme="light"] .client-doc-hero h2,
html[data-theme="light"] .client-doc-section-heading h3,
html[data-theme="light"] .client-doc-aside > p,
html[data-theme="light"] .client-doc-faq strong { color: #2f2921; }
html[data-theme="light"] .client-doc-hero > p:last-child,
html[data-theme="light"] .client-doc-copy,
html[data-theme="light"] .client-doc-checklist li,
html[data-theme="light"] .client-doc-faq p,
html[data-theme="light"] .client-doc-callout p { color: #746b5e; }
html[data-theme="light"] .client-doc-compatibility strong { color: #352f27; }
html[data-theme="light"] .client-doc-compatibility p { color: #6f6659; }
html[data-theme="light"] .client-doc-source-row { color: #847a69; }
html[data-theme="light"] .client-doc-source-row a { color: #7c5c1c; }
html[data-theme="light"] .client-doc-block-note { color: #7b7163; }
html[data-theme="light"] .client-doc-platform-note { color: #847664; }
html[data-theme="light"] .client-doc-aside nav a { color: #766e61; }
html[data-theme="light"] .client-doc-aside nav a:hover,
html[data-theme="light"] .client-doc-aside nav a.active { color: #795b1d; background: rgba(213, 173, 91, .14); }
html[data-theme="light"] .client-doc-step-grid > div,
html[data-theme="light"] .client-doc-faq > div { background: rgba(111, 86, 42, .045); border-color: rgba(127, 102, 55, .15); }

@media (max-width: 1050px) {
    .client-doc-layout { grid-template-columns: minmax(0, 1fr) 190px; gap: 28px; }
    .client-doc-step-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .client-doc-faq { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .client-doc-layout { display: flex; flex-direction: column-reverse; gap: 0; padding-bottom: 25px; }
    .client-doc-aside { position: static; padding: 0 0 16px; }
    .client-doc-aside nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; }
    .client-doc-aside nav a { min-height: 36px; font-size: 10px; }
    .client-doc-toc { display: none; }
    .client-doc-hero { padding: 32px 0 28px; }
    .client-doc-hero h2 { font-size: 31px; }
    .client-doc-hero > p:last-child { font-size: 12px; }
    .client-doc-section { padding: 25px 0 29px; }
    .client-doc-section-heading h3 { font-size: 21px; }
    .client-doc-step-grid { grid-template-columns: 1fr 1fr; }
    .client-doc-footer-actions .button { flex: 1; }
}

html {
    background: #eef3f5;
}

body {
    color: var(--ink);
    background: var(--paper);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", sans-serif;
    letter-spacing: 0;
}

h1, h2, h3, p, small, strong, a, button, label {
    letter-spacing: 0;
}

button,
.button,
.icon-button,
a {
    -webkit-tap-highlight-color: transparent;
}

.site-header,
.workspace-topbar,
.sidebar,
.mobile-navigation {
    background: rgba(248, 251, 252, .72);
    border-color: var(--line);
    box-shadow: 0 10px 35px rgba(37, 61, 71, .05);
    backdrop-filter: blur(24px) saturate(155%);
    -webkit-backdrop-filter: blur(24px) saturate(155%);
}

.site-header {
    position: sticky;
    top: 0;
    box-shadow: 0 8px 30px rgba(34, 58, 69, .06);
}

.brand-mark {
    background: #172d37;
    box-shadow: 0 8px 20px rgba(23, 45, 55, .19), inset 0 1px 0 rgba(255, 255, 255, .22);
}

.button {
    border-radius: 10px;
    box-shadow: 0 7px 18px rgba(32, 65, 76, .09), inset 0 1px 0 rgba(255, 255, 255, .42);
    transition: transform .22s cubic-bezier(.2, .8, .2, 1), box-shadow .22s ease, background .22s ease, border-color .22s ease;
}

.button:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(32, 65, 76, .14), inset 0 1px 0 rgba(255, 255, 255, .5);
}

.button:active,
.icon-button:active {
    transform: scale(.96);
}

.button-primary {
    background: #0b9d77;
    box-shadow: 0 10px 24px rgba(11, 157, 119, .2), inset 0 1px 0 rgba(255, 255, 255, .35);
}

.button-primary:hover {
    background: #087f63;
}

.button-secondary,
.button-ghost,
.date-chip,
.select-like {
    background: rgba(255, 255, 255, .64);
    border-color: rgba(126, 150, 158, .3);
    backdrop-filter: blur(12px) saturate(140%);
    -webkit-backdrop-filter: blur(12px) saturate(140%);
}

.button-inverse {
    background: rgba(255, 255, 255, .09);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.icon-button {
    transition: transform .2s ease, background .2s ease, color .2s ease;
}

.icon-button:hover {
    background: rgba(255, 255, 255, .76);
    box-shadow: 0 5px 15px rgba(31, 59, 70, .1);
}

.hero {
    isolation: isolate;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .12);
}

.hero-backdrop {
    animation: hero-drift 16s ease-in-out infinite alternate;
}

.hero h1 {
    letter-spacing: 0;
    text-shadow: 0 12px 36px rgba(0, 0, 0, .18);
}

.hero-lead[data-typewriter] {
    min-height: 3.5em;
}

.hero-lead[data-typewriter].is-typing::after {
    content: "";
    display: inline-block;
    width: 2px;
    height: 1.08em;
    margin-left: 5px;
    vertical-align: -.16em;
    border-radius: 2px;
    background: currentColor;
    animation: typewriter-caret .9s steps(1, end) infinite;
}

.model-item,
.plan-card,
.metric-board,
.code-window,
.panel,
.stat-card,
.auth-panel,
.install-panel,
.modal-panel,
.secret-alert,
.info-strip {
    border-color: rgba(132, 153, 160, .27);
    box-shadow: var(--glass-shadow);
    background: rgba(255, 255, 255, .69);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
}

.model-item,
.stat-card,
.plan-card,
.panel,
.auth-panel,
.install-panel {
    transition: transform .28s cubic-bezier(.2, .8, .2, 1), box-shadow .28s ease, border-color .28s ease, background .28s ease;
}

.model-item:hover,
.stat-card:hover,
.plan-card:hover,
.panel:hover {
    transform: translateY(-4px);
    border-color: rgba(10, 159, 120, .35);
    box-shadow: 0 24px 65px rgba(36, 67, 78, .15), inset 0 1px 0 rgba(255, 255, 255, .9);
}

.plan-card.featured {
    background: rgba(236, 251, 246, .78);
    border-color: rgba(10, 159, 120, .58);
}

.status-pill {
    background: rgba(20, 167, 126, .12);
    border: 1px solid rgba(20, 167, 126, .14);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.status-pill i,
.live-dot,
.system-status i {
    animation: status-pulse 2.2s ease-in-out infinite;
}

.empty-chart,
.metric-row,
.status-list > div,
th,
td {
    border-color: rgba(128, 151, 159, .2);
}

.code-window {
    background: rgba(17, 36, 45, .91);
    border-color: rgba(139, 192, 184, .24);
    box-shadow: 0 28px 70px rgba(18, 39, 48, .22), inset 0 1px 0 rgba(255, 255, 255, .13);
}

.workspace-body {
    background: #eef3f5;
}

.sidebar {
    background: rgba(250, 252, 252, .8);
}

.side-nav a {
    transition: transform .2s ease, background .2s ease, color .2s ease;
}

.side-nav a:hover {
    transform: translateX(3px);
    background: rgba(15, 173, 132, .09);
}

.side-nav a.active {
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 8px 18px rgba(18, 151, 115, .08);
}

.form-stack input,
.form-stack textarea,
.form-stack select,
.install-form input {
    background: rgba(248, 251, 251, .8);
    border-color: rgba(126, 151, 158, .3);
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.form-stack input:focus,
.form-stack textarea:focus,
.form-stack select:focus,
.install-form input:focus {
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 0 0 4px rgba(15, 173, 132, .12), 0 8px 20px rgba(31, 73, 80, .08);
}

.modal-backdrop {
    background: rgba(21, 41, 49, .34);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.modal-panel {
    animation: modal-in .3s cubic-bezier(.2, .8, .2, 1) both;
}

.mobile-navigation {
    box-shadow: 0 18px 35px rgba(31, 59, 70, .13);
}

.motion-ready .motion-item {
    opacity: 0;
    transform: translateY(18px) scale(.985);
}

.motion-ready .motion-item.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition: opacity .6s ease var(--motion-delay, 0ms), transform .7s cubic-bezier(.2, .8, .2, 1) var(--motion-delay, 0ms);
}

@keyframes hero-drift {
    from { transform: scale(1); }
    to { transform: scale(1.035) translate3d(-1%, 1%, 0); }
}

@keyframes status-pulse {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(56, 197, 143, .24); }
    50% { opacity: .72; box-shadow: 0 0 0 5px rgba(56, 197, 143, 0); }
}

@keyframes typewriter-caret {
    0%, 45% { opacity: 1; }
    46%, 100% { opacity: 0; }
}

@keyframes fallback-globe-spin {
    from { transform: translate(-50%, -50%) rotate(0deg); }
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes modal-in {
    from { opacity: 0; transform: translateY(12px) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 700px) {
    .site-header {
        position: sticky;
    }

    .hero h1 {
        font-size: 62px;
    }

    .model-item:hover,
    .stat-card:hover,
    .plan-card:hover,
    .panel:hover {
        transform: none;
    }
}

/* Admin operations surface */
.admin-workspace {
    background-color: #0e171b;
    background-image: linear-gradient(rgba(134, 177, 174, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(134, 177, 174, .035) 1px, transparent 1px);
    background-size: 34px 34px;
}

.admin-workspace .sidebar {
    width: 264px;
    padding: 28px 18px 22px;
    background: rgba(14, 25, 30, .87);
    border-right: 1px solid rgba(174, 211, 207, .14);
    box-shadow: 18px 0 55px rgba(0, 0, 0, .16), inset -1px 0 rgba(255, 255, 255, .035);
}

.admin-workspace .workspace-main {
    margin-left: 264px;
}

.admin-workspace .sidebar-brand {
    padding: 0 10px 26px;
}

.admin-workspace .workspace-label {
    display: inline-flex;
    width: fit-content;
    margin: 0 10px 16px;
    padding: 5px 9px;
    color: #9ddaca;
    border: 1px solid rgba(102, 210, 178, .23);
    border-radius: 999px;
    background: rgba(23, 135, 105, .14);
    font-size: 10px;
}

.admin-workspace .nav-group {
    padding-top: 24px;
    color: #71898c;
}

.admin-workspace .side-nav {
    gap: 5px;
}

.admin-workspace .side-nav a {
    min-height: 44px;
    padding: 11px 14px;
    border: 1px solid transparent;
    border-radius: 13px;
    color: #9aacb0;
}

.admin-workspace .side-nav a:hover {
    color: #eff8f4;
    background: rgba(101, 186, 163, .1);
    border-color: rgba(130, 208, 185, .12);
}

.admin-workspace .side-nav a.active {
    color: #eafff7;
    background: rgba(21, 166, 126, .19);
    border-color: rgba(80, 205, 164, .27);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 9px 22px rgba(0, 0, 0, .12);
}

.admin-workspace .side-nav a.active .icon {
    color: #6fe0ba;
}

.admin-workspace .workspace-topbar {
    min-height: 92px;
    background: rgba(14, 24, 29, .72);
    border-bottom-color: rgba(174, 211, 207, .13);
}

.admin-workspace .breadcrumb {
    color: #789094;
}

.admin-workspace .workspace-topbar h1 {
    color: #f0f8f5;
    font-size: 24px;
    font-weight: 700;
}

.admin-workspace .workspace-content {
    max-width: 1420px;
    padding-top: 36px;
}

.admin-workspace .workspace-intro {
    position: relative;
    margin-bottom: 24px;
    padding: 24px 26px;
    border: 1px solid rgba(174, 211, 207, .15);
    border-radius: 20px;
    background: rgba(21, 36, 42, .68);
    box-shadow: 0 22px 60px rgba(0, 0, 0, .14), inset 0 1px 0 rgba(255, 255, 255, .07);
    overflow: hidden;
}

.admin-workspace .workspace-intro:after {
    content: "";
    position: absolute;
    top: 0;
    right: 24px;
    width: 90px;
    height: 2px;
    background: #55d3aa;
    box-shadow: 0 0 22px rgba(85, 211, 170, .7);
}

.admin-workspace .workspace-intro h2 {
    color: #f0f8f5;
    font-size: 28px;
}

.admin-workspace .workspace-intro p:not(.eyebrow) {
    color: #91a8aa;
}

.admin-workspace .stat-grid {
    gap: 16px;
    margin-bottom: 20px;
}

.admin-workspace .stat-card {
    position: relative;
    min-height: 148px;
    padding: 22px;
    border-radius: 18px;
    background: rgba(21, 36, 42, .75);
    border-color: rgba(174, 211, 207, .15);
    overflow: hidden;
}

.admin-workspace .stat-card:before {
    content: "";
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;
    height: 2px;
    background: #3bbf98;
    opacity: .75;
}

.admin-workspace .stat-card > span {
    color: #92a9ab;
}

.admin-workspace .stat-card > strong {
    color: #f1faf6;
    font-size: 29px;
}

.admin-workspace .stat-card > small {
    color: #6f898c;
}

.admin-workspace .stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .13);
}

.admin-workspace .content-grid {
    gap: 20px;
}

.admin-workspace .panel {
    border-radius: 18px;
    background: rgba(21, 36, 42, .72);
    border-color: rgba(174, 211, 207, .15);
}

.admin-workspace .panel-heading h3 {
    color: #eaf7f2;
    font-size: 18px;
}

.admin-workspace .muted-note {
    color: #829b9d;
}

.admin-workspace .status-list > div p {
    color: #dcebe8;
}

.admin-workspace .status-list > div p small {
    color: #80999c;
}

.admin-workspace .table-wrap {
    border-radius: 12px;
}

.admin-workspace th {
    color: #789295;
}

.admin-workspace td {
    color: #a9bcbc;
}

.admin-workspace td strong {
    color: #e6f2ee;
}

html[data-theme="light"] .admin-workspace {
    background-color: #eef3f5;
    background-image: linear-gradient(rgba(80, 122, 124, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(80, 122, 124, .035) 1px, transparent 1px);
}

html[data-theme="light"] .admin-workspace .sidebar,
html[data-theme="light"] .admin-workspace .workspace-topbar,
html[data-theme="light"] .admin-workspace .workspace-intro,
html[data-theme="light"] .admin-workspace .stat-card,
html[data-theme="light"] .admin-workspace .panel {
    color: var(--ink);
    background: rgba(255, 255, 255, .77);
    border-color: rgba(126, 151, 158, .24);
}

html[data-theme="light"] .admin-workspace .sidebar {
    box-shadow: 18px 0 55px rgba(44, 72, 82, .08), inset -1px 0 rgba(255, 255, 255, .7);
}

html[data-theme="light"] .admin-workspace .workspace-topbar h1,
html[data-theme="light"] .admin-workspace .workspace-intro h2,
html[data-theme="light"] .admin-workspace .stat-card > strong,
html[data-theme="light"] .admin-workspace .panel-heading h3,
html[data-theme="light"] .admin-workspace td strong {
    color: var(--ink);
}

html[data-theme="light"] .admin-workspace .workspace-intro p:not(.eyebrow),
html[data-theme="light"] .admin-workspace .stat-card > span,
html[data-theme="light"] .admin-workspace .stat-card > small,
html[data-theme="light"] .admin-workspace .muted-note,
html[data-theme="light"] .admin-workspace td {
    color: var(--muted);
}

@media (max-width: 700px) {
    .admin-workspace .workspace-main {
        margin-left: 0;
    }

    .admin-workspace .sidebar {
        width: 264px;
    }

    .admin-workspace .workspace-content {
        padding-top: 24px;
    }

    .admin-workspace .workspace-intro {
        padding: 20px;
        border-radius: 16px;
    }

    .admin-workspace .workspace-intro h2 {
        font-size: 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* Workspace structure and controls */
.theme-toggle {
    position: relative;
    overflow: hidden;
}

.theme-toggle .icon:last-child {
    display: none;
}

html[data-theme="dark"] .theme-toggle .icon:first-child {
    display: none;
}

html[data-theme="dark"] .theme-toggle .icon:last-child {
    display: block;
}

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

.topbar-actor {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding-left: 12px;
    border-left: 1px solid var(--line);
}

.topbar-actor > span:last-child {
    display: grid;
    min-width: 0;
}

.topbar-actor strong,
.topbar-actor small {
    overflow: hidden;
    max-width: 170px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-actor strong { font-size: 11px; }
.topbar-actor small { color: var(--muted); font-size: 9px; }

.auth-theme-toggle {
    position: fixed;
    z-index: 5;
    top: 28px;
    right: clamp(22px, 5vw, 72px);
    background: rgba(255, 255, 255, .52);
    border: 1px solid var(--line);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

@media (min-width: 701px) {
    .workspace-body {
        display: block;
    }

    .workspace-body .sidebar {
        position: fixed;
        z-index: 20;
        inset: 0 auto 0 0;
        height: 100vh;
        overflow-y: auto;
        scrollbar-width: thin;
    }

    .workspace-main {
        min-height: 100vh;
        margin-left: 248px;
    }

    .workspace-topbar {
        position: sticky;
        top: 0;
        z-index: 10;
    }
}

@media (max-width: 700px) {
    .site-header .header-actions {
        display: flex;
        gap: 0;
        margin-left: auto;
    }

    .site-header .header-actions > :not(.theme-toggle) {
        display: none;
    }

    .topbar-actions {
        gap: 3px;
    }

    .topbar-actions .system-status,
    .topbar-actor {
        display: none;
    }

    .workspace-topbar {
        padding-right: 14px;
    }
}

/* Dark appearance */
html[data-theme="dark"] {
    color-scheme: dark;
    --ink: #edf6f4;
    --muted: #9aadb2;
    --line: rgba(177, 205, 207, .16);
    --paper: #0d1519;
    --white: rgba(27, 39, 45, .78);
    --green-soft: rgba(20, 183, 141, .16);
    --glass-shadow: 0 24px 70px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .08);
    background: #0d1519;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .public-body,
html[data-theme="dark"] .workspace-body,
html[data-theme="dark"] .auth-body,
html[data-theme="dark"] .install-body {
    color: var(--ink);
    background: #0d1519;
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .workspace-topbar,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .mobile-navigation {
    background: rgba(18, 29, 34, .82);
    border-color: var(--line);
    box-shadow: 0 12px 35px rgba(0, 0, 0, .2);
}

html[data-theme="dark"] .model-item,
html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .metric-board,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .auth-panel,
html[data-theme="dark"] .install-panel,
html[data-theme="dark"] .modal-panel,
html[data-theme="dark"] .secret-alert,
html[data-theme="dark"] .info-strip,
html[data-theme="dark"] .date-chip,
html[data-theme="dark"] .select-like,
html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .button-ghost {
    color: var(--ink);
    background: rgba(25, 39, 45, .78);
    border-color: var(--line);
    box-shadow: var(--glass-shadow);
}

html[data-theme="dark"] .plan-card.featured {
    background: rgba(15, 78, 67, .48);
    border-color: rgba(54, 204, 163, .45);
}

html[data-theme="dark"] .feature-band {
    background: #14242a;
}

html[data-theme="dark"] .site-footer,
html[data-theme="dark"] .model-strip,
html[data-theme="dark"] .plans-section,
html[data-theme="dark"] .developer-section {
    border-color: var(--line);
}

html[data-theme="dark"] .form-stack input,
html[data-theme="dark"] .form-stack textarea,
html[data-theme="dark"] .form-stack select,
html[data-theme="dark"] .install-form input {
    color: var(--ink);
    background: rgba(12, 24, 29, .82);
    border-color: var(--line);
}

html[data-theme="dark"] .form-stack input:focus,
html[data-theme="dark"] .form-stack textarea:focus,
html[data-theme="dark"] .form-stack select:focus,
html[data-theme="dark"] .install-form input:focus {
    background: rgba(19, 37, 42, .96);
}

html[data-theme="dark"] .mobile-navigation nav a,
html[data-theme="dark"] th,
html[data-theme="dark"] td,
html[data-theme="dark"] .empty-chart,
html[data-theme="dark"] .metric-row,
html[data-theme="dark"] .status-list > div {
    border-color: var(--line);
}

html[data-theme="dark"] code {
    color: #a9d7c7;
    background: rgba(55, 91, 91, .25);
}

html[data-theme="dark"] .auth-theme-toggle {
    background: rgba(24, 39, 44, .76);
    color: var(--ink);
}

/* A softer iOS-like radius system */
.panel,
.stat-card,
.plan-card,
.model-item,
.metric-board,
.code-window,
.auth-panel,
.install-panel,
.modal-panel,
.secret-alert,
.info-strip {
    border-radius: 16px;
}

.button,
.form-stack input,
.form-stack textarea,
.form-stack select,
.install-form input,
.date-chip,
.select-like {
    border-radius: 12px;
}

.stat-icon,
.key-avatar,
.avatar,
.provider-mark,
.chart-empty-message > span,
.secret-alert-icon,
.install-icon,
.requirement-state {
    border-radius: 12px;
}

.status-pill,
.live-dot,
.system-status i {
    border-radius: 999px;
}

/* Reference-inspired floating navigation and spacious landing rhythm */
.public-body .site-header {
    position: fixed;
    z-index: 50;
    top: 18px;
    left: 50%;
    width: min(calc(100% - 32px), 1300px);
    height: 64px;
    padding: 0 24px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 18px;
    transform: translateX(-50%);
    background: rgba(20, 30, 35, .7);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .13);
    backdrop-filter: blur(30px) saturate(155%);
    -webkit-backdrop-filter: blur(30px) saturate(155%);
}

.public-body .site-header .site-nav a,
.public-body .site-header .text-link {
    color: rgba(244, 250, 249, .74);
}

.public-body .site-header .site-nav a:hover,
.public-body .site-header .text-link:hover {
    color: #fff;
}

.public-body .hero-inner {
    padding-top: 160px;
}

html[data-theme="light"] .public-body .site-header {
    color: #17242d;
    border-color: #cdd7da;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 18px 48px rgba(36, 61, 71, .12), inset 0 1px 0 rgba(255, 255, 255, .95);
}

html[data-theme="light"] .public-body .site-header .site-nav a,
html[data-theme="light"] .public-body .site-header .text-link {
    color: #65747d;
}

html[data-theme="light"] .public-body .site-header .site-nav a:hover,
html[data-theme="light"] .public-body .site-header .text-link:hover {
    color: #17242d;
}

.public-body .model-strip,
.public-body .plans-section,
.public-body .developer-section {
    max-width: 1300px;
    padding-left: 48px;
    padding-right: 48px;
}

.public-body .section-heading {
    margin-bottom: 48px;
}

.public-body .section-heading h2,
.public-body .feature-copy h2,
.public-body .developer-copy h2 {
    font-size: 40px;
    font-weight: 650;
    letter-spacing: 0;
}

.public-body .model-grid {
    gap: 14px;
    border: 0;
    background: transparent;
}

.public-body .model-item {
    min-height: 124px;
    border: 1px solid rgba(130, 151, 160, .27);
}

.public-body .plan-grid {
    gap: 24px;
}

.public-body .plan-card {
    min-height: 400px;
    padding: 32px;
}

@media (max-width: 700px) {
    .public-body .site-header {
        top: 12px;
        width: calc(100% - 24px);
        height: 56px;
        padding: 0 14px;
        border-radius: 16px;
    }

    .public-body .hero-inner {
        padding-top: 132px;
    }

    .public-body .model-strip,
    .public-body .plans-section,
    .public-body .developer-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    .public-body .section-heading h2,
    .public-body .feature-copy h2,
    .public-body .developer-copy h2 {
        font-size: 30px;
    }
}

/* Keep the operations surface distinct after the shared dark-theme cascade. */
html[data-theme="dark"] .admin-workspace {
    background-color: #0e171b;
    background-image: linear-gradient(rgba(134, 177, 174, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(134, 177, 174, .035) 1px, transparent 1px);
    background-size: 34px 34px;
}

/* Black and gold product theme. */
:root {
    --ink: #f3eee4;
    --muted: #a9a298;
    --line: rgba(215, 188, 123, .2);
    --paper: #0d0d0e;
    --white: rgba(32, 30, 26, .82);
    --green: #d5ad5b;
    --green-dark: #b68a39;
    --green-soft: rgba(213, 173, 91, .14);
    --blue: #91a8bb;
    --orange: #d7a55a;
    --violet: #b9a4cf;
    --shadow: 0 22px 65px rgba(0, 0, 0, .3);
    --glass-shadow: 0 24px 70px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 236, 184, .09);
}

html,
html[data-theme="dark"] {
    background: #0d0d0e;
    color-scheme: dark;
    --ink: #f3eee4;
    --muted: #a9a298;
    --line: rgba(215, 188, 123, .2);
    --paper: #0d0d0e;
    --white: rgba(32, 30, 26, .82);
    --green: #d5ad5b;
    --green-dark: #b68a39;
    --green-soft: rgba(213, 173, 91, .14);
}

html[data-theme="light"] {
    color-scheme: light;
    background: #f5f1e8;
    --ink: #211f1b;
    --muted: #756f65;
    --line: rgba(112, 92, 51, .2);
    --paper: #f5f1e8;
    --white: rgba(255, 253, 248, .86);
    --green: #a97824;
    --green-dark: #825d1d;
    --green-soft: rgba(169, 120, 36, .12);
    --shadow: 0 18px 55px rgba(80, 61, 25, .1);
    --glass-shadow: 0 24px 70px rgba(80, 61, 25, .13), inset 0 1px 0 rgba(255, 255, 255, .8);
}

html[data-theme="light"] body,
html[data-theme="light"] .public-body,
html[data-theme="light"] .workspace-body,
html[data-theme="light"] .auth-body,
html[data-theme="light"] .install-body {
    background: #f5f1e8;
    color: var(--ink);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .public-body,
html[data-theme="dark"] .workspace-body,
html[data-theme="dark"] .auth-body,
html[data-theme="dark"] .install-body {
    background: #0d0d0e;
    color: var(--ink);
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .workspace-topbar,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .mobile-navigation {
    background: rgba(18, 17, 15, .84);
    border-color: var(--line);
}

html[data-theme="light"] .site-header,
html[data-theme="light"] .workspace-topbar,
html[data-theme="light"] .sidebar,
html[data-theme="light"] .mobile-navigation {
    background: rgba(250, 247, 239, .88);
    border-color: var(--line);
}

html[data-theme="dark"] .model-item,
html[data-theme="dark"] .plan-card,
html[data-theme="dark"] .metric-board,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .auth-panel,
html[data-theme="dark"] .install-panel,
html[data-theme="dark"] .modal-panel,
html[data-theme="dark"] .secret-alert,
html[data-theme="dark"] .info-strip,
html[data-theme="dark"] .date-chip,
html[data-theme="dark"] .select-like,
html[data-theme="dark"] .button-secondary,
html[data-theme="dark"] .button-ghost {
    background: rgba(30, 28, 24, .84);
    border-color: var(--line);
    color: var(--ink);
}

html[data-theme="light"] .model-item,
html[data-theme="light"] .plan-card,
html[data-theme="light"] .metric-board,
html[data-theme="light"] .panel,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .auth-panel,
html[data-theme="light"] .install-panel,
html[data-theme="light"] .modal-panel,
html[data-theme="light"] .secret-alert,
html[data-theme="light"] .info-strip,
html[data-theme="light"] .date-chip,
html[data-theme="light"] .select-like,
html[data-theme="light"] .button-secondary,
html[data-theme="light"] .button-ghost {
    background: rgba(255, 253, 248, .88);
    border-color: var(--line);
    color: var(--ink);
}

html[data-theme="dark"] .plan-card.featured {
    background: rgba(97, 71, 28, .28);
    border-color: rgba(232, 193, 101, .62);
}

html[data-theme="light"] .plan-card.featured {
    background: rgba(246, 232, 196, .7);
    border-color: rgba(169, 120, 36, .55);
}

html[data-theme="dark"] .feature-band { background: #171511; }
html[data-theme="light"] .feature-band { background: #ece5d5; }
html[data-theme="dark"] .code-window { background: rgba(13, 12, 10, .96); border-color: rgba(218, 180, 91, .3); }
html[data-theme="light"] .code-window { background: #252019; }
html[data-theme="dark"] .admin-workspace {
    background-color: #0e0d0b;
    background-image: linear-gradient(rgba(208, 171, 89, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(208, 171, 89, .045) 1px, transparent 1px);
}

.hero {
    background: #0c0c0d;
}

.hero-backdrop {
    background-color: #0c0c0d;
    background-image: linear-gradient(90deg, rgba(8, 8, 9, .98) 0%, rgba(29, 25, 17, .94) 48%, rgba(69, 49, 20, .62) 100%), radial-gradient(circle at 78% 28%, rgba(218, 180, 91, .3) 0 2px, transparent 3px), radial-gradient(circle at 62% 62%, rgba(255, 231, 168, .16) 0 1px, transparent 2px);
}

.hero-backdrop:after {
    border-color: rgba(234, 201, 126, .24);
    box-shadow: 0 0 0 30px rgba(214, 171, 79, .05), 0 0 0 90px rgba(214, 171, 79, .028);
}

.hero .eyebrow { color: #e4bd68; }
.hero-lead { color: #e3ddd0; }
.button-primary { background: #c99b43; color: #17130d; box-shadow: 0 10px 24px rgba(201, 155, 67, .24), inset 0 1px 0 rgba(255, 244, 202, .45); }
.button-primary:hover { background: #e2b961; color: #17130d; }
.live-dot,
.system-status i,
.status-pill i { background: #e2b95d; box-shadow: 0 0 0 4px rgba(226, 185, 93, .13); }
.status-pill { background: rgba(213, 173, 91, .14); color: var(--green); border-color: rgba(213, 173, 91, .25); }
.plan-badge { background: #c99b43; }
.provider-mark { background: #27231b; color: #f9e8b8; }
.provider-mark.provider-gpt { background: #292929; color: #f4f4f2; border-radius: 50%; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 18px rgba(0, 0, 0, .18); }
.feature-copy .eyebrow,
.developer-copy .eyebrow,
.section-heading .eyebrow { color: var(--green); }

.hero-visual::before {
    border-color: rgba(230, 193, 104, .2);
    box-shadow: 0 0 0 28px rgba(214, 171, 79, .04), 0 0 0 82px rgba(214, 171, 79, .025);
}

.hero-globe-fallback {
    border-color: rgba(236, 200, 117, .46);
    background: radial-gradient(circle at 35% 30%, rgba(213, 173, 91, .22), rgba(74, 53, 22, .13) 48%, rgba(5, 5, 5, .12) 70%);
    box-shadow: inset -32px -20px 70px rgba(3, 3, 3, .55), inset 22px 18px 45px rgba(238, 204, 123, .12), 0 0 70px rgba(191, 144, 47, .14);
}

.hero-globe-fallback::before,
.hero-globe-fallback::after,
.hero-globe-fallback span,
.hero-globe-fallback i,
.hero-globe-fallback b { border-color: rgba(238, 204, 123, .2); }
.visual-scanline { background: linear-gradient(90deg, transparent, rgba(239, 202, 119, .5), transparent); }

html[data-theme="light"] .public-body .site-header {
    color: #211f1b;
    background: rgba(250, 247, 239, .9);
    border-color: rgba(112, 92, 51, .24);
}

html[data-theme="light"] .public-body .site-header .site-nav a,
html[data-theme="light"] .public-body .site-header .text-link { color: #756f65; }
html[data-theme="light"] .public-body .site-header .site-nav a:hover,
html[data-theme="light"] .public-body .site-header .text-link:hover { color: #211f1b; }

/* User-facing API documentation. */
.public-docs-shell {
    max-width: 1320px;
    margin: 0 auto;
    padding: 150px 48px 90px;
}

.public-docs-hero {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 30px;
    padding: 20px 0 58px;
    border-bottom: 1px solid var(--line);
}

.public-docs-hero h1 {
    margin: 0;
    font-size: clamp(42px, 5vw, 70px);
    line-height: 1;
    letter-spacing: -.04em;
}

.public-docs-hero p:not(.eyebrow) {
    max-width: 580px;
    margin: 18px 0 0;
    color: var(--muted);
    font-size: 16px;
}

.public-docs-actions,
.intro-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.api-docs-layout {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 58px;
    align-items: start;
    padding-top: 44px;
}

.api-docs-nav {
    position: sticky;
    top: 96px;
    display: grid;
    gap: 4px;
    padding: 3px 0;
}

.api-docs-nav p {
    margin: 0 0 10px;
    color: var(--ink);
    font-size: 11px;
    font-weight: 800;
}

.api-docs-nav a {
    padding: 8px 10px;
    border-left: 1px solid transparent;
    color: var(--muted);
    font-size: 12px;
    transition: color .2s ease, border-color .2s ease, background .2s ease;
}

.api-docs-nav a:hover {
    border-color: var(--green);
    color: var(--green);
    background: var(--green-soft);
}

.api-docs-content { min-width: 0; }

.docs-section {
    scroll-margin-top: 96px;
    padding: 0 0 56px;
    margin-bottom: 56px;
    border-bottom: 1px solid var(--line);
}

.docs-section:last-child { border-bottom: 0; }

.docs-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 25px;
}

.docs-section-heading h2 {
    margin: 0;
    color: var(--ink);
    font-size: 29px;
    letter-spacing: -.035em;
}

.docs-section-heading .eyebrow { margin-bottom: 8px; }
.docs-status { color: var(--green); font-size: 11px; font-weight: 800; }
.docs-status i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: var(--green); vertical-align: middle; }
.docs-lead { max-width: 760px; color: var(--muted); font-size: 14px; }
.docs-lead code, .docs-inline-code { color: var(--green-dark); font-family: 'DM Mono', monospace; font-size: 11px; }

.docs-steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}

.docs-step {
    display: flex;
    align-items: start;
    gap: 13px;
    min-height: 170px;
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--white);
    box-shadow: var(--glass-shadow);
}

.docs-step > span {
    display: grid;
    place-items: center;
    flex: none;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--green);
    color: #17130d;
    font-size: 12px;
    font-weight: 900;
}

.docs-step h3, .docs-schema-grid h3 { margin: 2px 0 7px; color: var(--ink); font-size: 14px; }
.docs-step p { margin: 0 0 12px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.docs-inline-code { display: inline-block; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--green-soft); }

.docs-callout {
    display: flex;
    align-items: start;
    gap: 12px;
    margin-bottom: 18px;
    padding: 15px 17px;
    border: 1px solid rgba(213, 173, 91, .34);
    border-radius: 12px;
    background: var(--green-soft);
    color: var(--green-dark);
}

.docs-callout > .icon { flex: none; margin-top: 1px; }
.docs-callout strong { color: var(--ink); font-size: 12px; }
.docs-callout p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }

.docs-code-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.docs-code-block {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #171510;
    box-shadow: var(--glass-shadow);
}

.docs-code-head {
    display: flex;
    align-items: center;
    min-height: 43px;
    padding: 0 12px 0 15px;
    border-bottom: 1px solid rgba(225, 189, 108, .16);
    color: #d8bb79;
    font: 600 10px 'DM Mono', monospace;
}

.docs-code-head span { margin-right: auto; }
.docs-code-head .icon-button { color: #bda56e; }
.docs-code-block pre { min-height: 0; margin: 0; padding: 18px 17px 21px; overflow: auto; color: #eee4ce; font: 500 11px/1.75 'DM Mono', monospace; white-space: pre-wrap; word-break: break-word; }
.docs-code-block code { padding: 0; color: inherit; background: transparent; font: inherit; }
.docs-code-block code em { color: #f2c977; font-style: normal; }

.endpoint-list { display: grid; gap: 9px; margin-bottom: 28px; }

.endpoint-item {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 16px 17px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: var(--white);
}

.endpoint-method { display: inline-grid; place-items: center; min-height: 23px; border-radius: 5px; font: 800 9px 'DM Mono', monospace; }
.endpoint-method.get { background: rgba(125, 164, 187, .16); color: #7fa7bd; }
.endpoint-method.post { background: var(--green-soft); color: var(--green-dark); }
.endpoint-item code { padding: 0; background: transparent; color: var(--ink); font: 700 12px 'DM Mono', monospace; }
.endpoint-item p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.endpoint-item > span { color: var(--muted); font-size: 10px; white-space: nowrap; }

.docs-schema-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.docs-table { width: 100%; border-collapse: collapse; }
.docs-table th, .docs-table td { padding: 10px 9px; border-bottom: 1px solid var(--line); text-align: left; font-size: 11px; vertical-align: top; }
.docs-table th { color: var(--muted); font-size: 10px; font-weight: 800; }
.docs-table td { color: var(--muted); }
.docs-table td:first-child { color: var(--ink); font-weight: 700; }
.docs-table code { padding: 0; background: transparent; color: var(--green-dark); font: 600 10px 'DM Mono', monospace; }
.error-code { display: inline-block; min-width: 31px; padding: 3px 5px; border-radius: 4px; background: var(--green-soft); color: var(--green-dark); font: 800 10px 'DM Mono', monospace; text-align: center; }

.docs-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.docs-info-grid > div { padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.docs-info-grid .icon { margin-bottom: 14px; color: var(--green); }
.docs-info-grid h3 { margin: 0 0 6px; color: var(--ink); font-size: 14px; }
.docs-info-grid p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.docs-checklist { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.docs-checklist li { display: flex; align-items: start; gap: 9px; color: var(--muted); font-size: 12px; }
.docs-checklist .icon { flex: none; color: var(--green); }

html[data-theme="light"] .docs-code-block { background: #282117; }

@media (max-width: 1000px) {
    .public-docs-shell { padding-left: 28px; padding-right: 28px; }
    .api-docs-layout { grid-template-columns: 150px minmax(0, 1fr); gap: 34px; }
    .docs-code-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .public-docs-shell { padding: 105px 20px 60px; }
    .public-docs-hero { display: block; padding-bottom: 35px; }
    .public-docs-hero h1 { font-size: 44px; }
    .public-docs-hero p:not(.eyebrow) { font-size: 14px; }
    .public-docs-actions { margin-top: 22px; }
    .public-docs-actions .button { flex: 1; }
    .api-docs-layout { display: block; padding-top: 28px; }
    .api-docs-nav { position: relative; top: auto; grid-template-columns: repeat(2, 1fr); margin-bottom: 38px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
    .api-docs-nav p { grid-column: 1 / -1; }
    .docs-section { margin-bottom: 39px; padding-bottom: 39px; }
    .docs-section-heading { align-items: start; display: block; }
    .docs-section-heading h2 { font-size: 25px; }
    .docs-section-heading > .button, .docs-section-heading > a { margin-top: 15px; }
    .docs-steps, .docs-schema-grid, .docs-info-grid { grid-template-columns: 1fr; }
    .docs-step { min-height: 0; }
    .endpoint-item { grid-template-columns: 50px minmax(0, 1fr); }
    .endpoint-item > span { grid-column: 2; }
    .docs-table { min-width: 500px; }
    .docs-errors { display: block; overflow-x: auto; }
}

html[data-theme="dark"] .admin-workspace .sidebar {
    background: rgba(14, 25, 30, .87);
    border-right-color: rgba(174, 211, 207, .14);
}

html[data-theme="dark"] .admin-workspace .workspace-topbar {
    background: rgba(14, 24, 29, .72);
    border-bottom-color: rgba(174, 211, 207, .13);
}

html[data-theme="dark"] .admin-workspace .stat-card,
html[data-theme="dark"] .admin-workspace .panel {
    background: rgba(21, 36, 42, .75);
    border-color: rgba(174, 211, 207, .15);
}

html[data-theme="dark"] .admin-workspace .date-chip,
html[data-theme="dark"] .admin-workspace .select-like,
html[data-theme="dark"] .admin-workspace .button-secondary,
html[data-theme="dark"] .admin-workspace .button-ghost {
    background: rgba(21, 36, 42, .72);
    border-color: rgba(174, 211, 207, .18);
}

.date-chip input,
.date-chip select {
    min-width: 0;
    color: inherit;
    border: 0;
    outline: 0;
    background: transparent;
    font-size: 11px;
}

.table-subtext {
    display: block;
    margin-top: 2px;
    color: var(--muted);
    font-size: 10px;
}

.trend-chart {
    position: relative;
    min-height: 250px;
    padding: 22px 4px 6px;
    border-top: 1px solid rgba(128, 151, 159, .2);
    border-bottom: 1px solid rgba(128, 151, 159, .2);
}

.trend-bars {
    display: flex;
    align-items: end;
    justify-content: space-around;
    gap: 12px;
    height: 218px;
}

.trend-bar {
    display: flex;
    align-items: center;
    flex: 1;
    height: 100%;
    flex-direction: column;
    justify-content: end;
    gap: 7px;
    color: var(--muted);
}

.trend-bar strong {
    min-height: 16px;
    color: var(--ink);
    font-size: 10px;
}

.trend-bar i {
    display: block;
    width: min(30px, 70%);
    min-height: 4px;
    border-radius: 999px 999px 5px 5px;
    background: linear-gradient(180deg, #55d3aa, #0d9d79);
    box-shadow: 0 7px 18px rgba(13, 157, 121, .18);
}

.trend-bar small {
    font-size: 9px;
    white-space: nowrap;
}

.trend-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    padding-top: 14px;
    color: var(--muted);
    font-size: 10px;
}

.positive-amount { color: var(--green); font-weight: 700; }
.negative-amount { color: var(--danger); font-weight: 700; }

.brand-logo {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

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

.payment-card .form-stack { gap: 14px; }
.payment-enable { align-self: end; min-height: 42px; }

.redeem-panel {
    max-width: 760px;
    margin-bottom: 18px;
}

.redeem-form {
    display: flex;
    align-items: stretch;
    gap: 10px;
}

.redeem-form label {
    min-width: 0;
    flex: 1;
}

.redeem-form input {
    width: 100%;
    height: 46px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255, 255, 255, .04);
    color: var(--ink);
    font-family: 'DM Mono', monospace;
    text-transform: uppercase;
}

.plan-tier {
    display: inline-flex;
    width: fit-content;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em;
    background: rgba(128, 151, 159, .14);
    color: var(--muted);
}

.tier-pro { color: #1b9d78; background: rgba(31, 184, 139, .13); }
.tier-max { color: #3f88d7; background: rgba(63, 136, 215, .13); }
.tier-ultra { color: #9c76d6; background: rgba(156, 118, 214, .13); }

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

@media (max-width: 700px) {
    .redeem-form { flex-direction: column; }
    .redeem-form .button { width: 100%; }
}

html[data-theme="dark"] .trend-bar strong { color: #e6f2ee; }

@media (max-width: 700px) {
    .trend-bars { gap: 4px; }
    .trend-bar i { width: min(22px, 74%); }
    .trend-summary { gap: 6px 11px; }
}

/* Growth and developer modules */
.intro-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.share-code,
.share-link {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    margin-bottom: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .04);
}

.share-code > div {
    display: grid;
    margin-right: auto;
}

.share-code span {
    color: var(--muted);
    font-size: 10px;
}

.share-code strong {
    color: var(--ink);
    font: 700 22px 'DM Mono', monospace;
}

.share-link code {
    min-width: 0;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reward-input-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.calendar-weekdays,
.calendar-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}

.calendar-weekdays {
    margin-bottom: 8px;
}

.calendar-weekdays span {
    padding: 5px 0;
    color: var(--muted);
    font-size: 10px;
    text-align: center;
}

.calendar-day {
    display: grid;
    place-items: center;
    align-content: center;
    min-width: 0;
    aspect-ratio: 1;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: var(--muted);
    background: rgba(255, 255, 255, .025);
}

.calendar-day b { font-size: 12px; }
.calendar-day small { color: var(--green); font-size: 9px; }

.calendar-day.checked {
    color: var(--ink);
    border-color: rgba(50, 193, 151, .36);
    background: rgba(28, 169, 128, .12);
}

.calendar-day.today { box-shadow: inset 0 0 0 1px var(--green); }

.calendar-day.empty {
    border-color: transparent;
    background: transparent;
}

.reward-cycle {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
}

.reward-cycle > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
}

.reward-cycle > div.current {
    border-color: rgba(50, 193, 151, .38);
    background: rgba(28, 169, 128, .12);
}

.reward-cycle span { color: var(--muted); font-size: 11px; }
.reward-cycle strong { color: var(--green); font-size: 12px; }

/* Interactive network globe on the public landing page. */
.hero-visual {
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    width: min(60vw, 860px);
    height: 100%;
    min-height: 650px;
    overflow: hidden;
    pointer-events: auto;
    isolation: isolate;
}

.hero-visual::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 14% 3% 10% 8%;
    border: 1px solid rgba(137, 226, 199, .16);
    border-radius: 50%;
    box-shadow: 0 0 0 28px rgba(99, 209, 179, .035), 0 0 0 82px rgba(99, 209, 179, .02);
    transform: rotate(-21deg) scaleY(.56);
}

.hero-globe {
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .7s ease;
    cursor: grab;
}

.hero-globe:active { cursor: grabbing; }
.hero-visual.is-ready .hero-globe { opacity: 1; }

.hero-globe-fallback {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(42vw, 520px);
    aspect-ratio: 1;
    border: 1px solid rgba(134, 235, 201, .42);
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, rgba(116, 220, 192, .24), rgba(18, 97, 87, .1) 48%, rgba(5, 34, 42, .08) 70%);
    box-shadow: inset -32px -20px 70px rgba(3, 22, 30, .45), inset 22px 18px 45px rgba(126, 235, 201, .12), 0 0 70px rgba(48, 180, 149, .12);
    transform: translate(-50%, -50%);
    transition: opacity .45s ease;
}

.hero-globe-fallback::before,
.hero-globe-fallback::after,
.hero-globe-fallback span,
.hero-globe-fallback i,
.hero-globe-fallback b {
    content: "";
    position: absolute;
    inset: 8%;
    border: 1px solid rgba(144, 237, 207, .18);
    border-radius: 50%;
}

.hero-globe-fallback::before { transform: rotate(25deg) scaleX(.42); }
.hero-globe-fallback::after { transform: rotate(-25deg) scaleX(.66); }
.hero-globe-fallback span { inset: 22% 6%; transform: scaleY(.45); }
.hero-globe-fallback i { inset: 42% 3%; transform: scaleY(.35); }
.hero-globe-fallback b { inset: 10% 18%; transform: rotate(90deg) scaleY(.58); }
.hero-globe-fallback { animation: fallback-globe-spin 24s linear infinite; }
.hero-visual.is-ready .hero-globe-fallback { opacity: 0; }

.visual-scanline {
    position: absolute;
    z-index: 2;
    top: 18%;
    left: 15%;
    width: 70%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(139, 239, 207, .42), transparent);
    opacity: .55;
    animation: visual-scan 7s ease-in-out infinite;
    pointer-events: none;
}

@keyframes visual-scan {
    0%, 100% { transform: translateY(0) scaleX(.65); opacity: .14; }
    50% { transform: translateY(380px) scaleX(1); opacity: .62; }
}

@media (max-width: 900px) {
    .hero-visual {
        width: 64vw;
        min-height: 560px;
        opacity: .82;
    }

    .hero-globe-fallback { width: min(48vw, 420px); }
    .hero-inner { z-index: 2; }
}

@media (max-width: 700px) {
    .hero-visual {
        top: 230px;
        right: -28%;
        width: 116%;
        height: 420px;
        min-height: 0;
        opacity: .55;
        pointer-events: none;
    }

    .hero-globe-fallback { width: min(76vw, 380px); }
    .hero-inner { background: linear-gradient(90deg, rgba(23, 44, 54, .96) 0%, rgba(23, 44, 54, .72) 70%, transparent 100%); }
    .visual-scanline { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .visual-scanline { animation: none; opacity: .28; }
    .hero-globe { cursor: default; }
    .hero-globe-fallback { animation: none; }
}

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

@media (max-width: 700px) {
    .intro-actions,
    .share-link {
        align-items: stretch;
        flex-direction: column;
    }

    .intro-actions .button,
    .share-link .button { width: 100%; }
    .calendar-weekdays,
    .calendar-days { gap: 4px; }
    .calendar-day { border-radius: 8px; }
}

/* Final black-gold overrides for the higher-specificity admin surface rules. */
html[data-theme="dark"] .admin-workspace {
    background-color: #0e0d0b;
    background-image: linear-gradient(rgba(208, 171, 89, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(208, 171, 89, .045) 1px, transparent 1px);
}

html[data-theme="dark"] .admin-workspace .sidebar,
html[data-theme="dark"] .admin-workspace .workspace-topbar,
html[data-theme="dark"] .admin-workspace .workspace-intro,
html[data-theme="dark"] .admin-workspace .stat-card,
html[data-theme="dark"] .admin-workspace .panel {
    background: rgba(29, 27, 23, .9);
    border-color: rgba(215, 188, 123, .2);
}

html[data-theme="dark"] .admin-workspace .workspace-label {
    color: #e0bd70;
    background: rgba(163, 118, 38, .16);
    border-color: rgba(215, 188, 123, .28);
}

html[data-theme="dark"] .admin-workspace .nav-group,
html[data-theme="dark"] .admin-workspace .breadcrumb,
html[data-theme="dark"] .admin-workspace .muted-note,
html[data-theme="dark"] .admin-workspace .stat-card > small,
html[data-theme="dark"] .admin-workspace .workspace-intro p:not(.eyebrow) {
    color: #a9a298;
}

html[data-theme="dark"] .admin-workspace .side-nav a { color: #b7afa1; }
html[data-theme="dark"] .admin-workspace .side-nav a:hover { color: #f5ead3; background: rgba(213, 173, 91, .1); border-color: rgba(213, 173, 91, .22); }
html[data-theme="dark"] .admin-workspace .side-nav a.active { color: #f6e5bb; background: rgba(174, 128, 43, .2); border-color: rgba(226, 186, 98, .34); }
html[data-theme="dark"] .admin-workspace .side-nav a.active .icon { color: #e3bd68; }
html[data-theme="dark"] .admin-workspace .workspace-topbar h1,
html[data-theme="dark"] .admin-workspace .workspace-intro h2,
html[data-theme="dark"] .admin-workspace .stat-card > strong,
html[data-theme="dark"] .admin-workspace .panel-heading h3,
html[data-theme="dark"] .admin-workspace td strong { color: #f3eee4; }
html[data-theme="dark"] .admin-workspace .workspace-intro:after,
html[data-theme="dark"] .admin-workspace .stat-card:before { background: #d5ad5b; box-shadow: 0 0 22px rgba(213, 173, 91, .62); }
html[data-theme="dark"] .admin-workspace .status-list > div p { color: #e6dfd2; }
html[data-theme="dark"] .admin-workspace .status-list > div p small,
html[data-theme="dark"] .admin-workspace th,
html[data-theme="dark"] .admin-workspace td { color: #aaa194; }
html[data-theme="dark"] .admin-workspace .date-chip,
html[data-theme="dark"] .admin-workspace .select-like,
html[data-theme="dark"] .admin-workspace .button-secondary,
html[data-theme="dark"] .admin-workspace .button-ghost { background: rgba(36, 32, 25, .86); border-color: rgba(215, 188, 123, .22); color: #e9dfcb; }

html[data-theme="light"] .admin-workspace {
    background-color: #f1ecdf;
    background-image: linear-gradient(rgba(169, 120, 36, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(169, 120, 36, .045) 1px, transparent 1px);
}

html[data-theme="light"] .admin-workspace .workspace-label { color: #825d1d; background: rgba(169, 120, 36, .1); border-color: rgba(169, 120, 36, .24); }
html[data-theme="light"] .admin-workspace .side-nav a.active { color: #825d1d; background: rgba(169, 120, 36, .12); border-color: rgba(169, 120, 36, .25); }
html[data-theme="light"] .admin-workspace .side-nav a.active .icon { color: #a97824; }
html[data-theme="light"] .admin-workspace .workspace-intro:after,
html[data-theme="light"] .admin-workspace .stat-card:before { background: #a97824; box-shadow: 0 0 18px rgba(169, 120, 36, .35); }

/* High-contrast type hierarchy for light workspaces. */
html[data-theme="light"] body.workspace-body {
    --ink: #24211c;
    --muted: #665f55;
    color: var(--ink);
}

html[data-theme="light"] body.workspace-body .side-nav a {
    color: #5f625d;
}

html[data-theme="light"] body.workspace-body .side-nav a .icon {
    color: #777b75;
}

html[data-theme="light"] body.workspace-body .side-nav a:hover,
html[data-theme="light"] body.workspace-body .side-nav a:focus-visible {
    color: #5f4212;
    background: rgba(169, 120, 36, .09);
    border-color: rgba(169, 120, 36, .2);
}

html[data-theme="light"] body.workspace-body.admin-workspace .side-nav a.active,
html[data-theme="light"] body.workspace-body.admin-workspace .side-nav a.active:hover,
html[data-theme="light"] body.workspace-body.admin-workspace .side-nav a.active:focus-visible {
    color: #66430d;
    background: #f2e7cf;
    border-color: #d9bd80;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82), 0 8px 20px rgba(112, 80, 22, .08);
}

html[data-theme="light"] body.workspace-body.admin-workspace .side-nav a.active .icon {
    color: #96691a;
}

html[data-theme="light"] body.workspace-body .nav-group,
html[data-theme="light"] body.workspace-body .breadcrumb {
    color: #6e746f;
}

html[data-theme="light"] body.workspace-body .workspace-intro p:not(.eyebrow),
html[data-theme="light"] body.workspace-body .stat-card > span,
html[data-theme="light"] body.workspace-body .stat-card > small,
html[data-theme="light"] body.workspace-body .muted-note,
html[data-theme="light"] body.workspace-body .status-list > div p small,
html[data-theme="light"] body.workspace-body .chart-empty-message small,
html[data-theme="light"] body.workspace-body .empty-inline p,
html[data-theme="light"] body.workspace-body .topbar-actor small {
    color: #70695f;
}

html[data-theme="light"] body.workspace-body .workspace-topbar h1,
html[data-theme="light"] body.workspace-body .workspace-intro h2,
html[data-theme="light"] body.workspace-body .stat-card > strong,
html[data-theme="light"] body.workspace-body .panel-heading h3,
html[data-theme="light"] body.workspace-body .status-list > div p,
html[data-theme="light"] body.workspace-body .chart-empty-message strong,
html[data-theme="light"] body.workspace-body .empty-inline strong,
html[data-theme="light"] body.workspace-body .topbar-actor strong,
html[data-theme="light"] body.workspace-body td strong {
    color: #24211c;
}

html[data-theme="light"] body.workspace-body .system-status,
html[data-theme="light"] body.workspace-body .status-list b,
html[data-theme="light"] body.workspace-body .status-pill,
html[data-theme="light"] body.workspace-body .eyebrow {
    color: #765317;
}

html[data-theme="light"] body.workspace-body .status-list > div > span,
html[data-theme="light"] body.workspace-body .empty-inline > span,
html[data-theme="light"] body.workspace-body .chart-empty-message > span {
    color: #96691a;
    background: #f5efe2;
}

html[data-theme="light"] body.workspace-body th { color: #625d55; }
html[data-theme="light"] body.workspace-body td { color: #4f4a43; }
html[data-theme="light"] body.workspace-body .date-chip,
html[data-theme="light"] body.workspace-body .select-like,
html[data-theme="light"] body.workspace-body .button-secondary,
html[data-theme="light"] body.workspace-body .button-ghost {
    color: #4b453c;
}

/* Public model market. */
.public-body .site-nav a.active {
    color: #f0ca78;
}

.model-market-page {
    min-height: 100vh;
    padding: 128px 28px 96px;
    background: var(--paper);
}

.model-market-shell {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.model-market-hero {
    padding: 54px 0 48px;
    text-align: center;
}

.model-market-hero h1 {
    margin: 0;
    color: var(--ink);
    font-size: 58px;
    line-height: 1.05;
    letter-spacing: 0;
}

.model-market-hero > p {
    margin: 19px auto 0;
    color: var(--muted);
    font-size: 15px;
}

.model-market-hero > p strong {
    color: var(--green);
    font-weight: 800;
}

.model-market-search {
    position: relative;
    display: block;
    width: min(760px, 100%);
    margin: 34px auto 0;
}

.model-market-search > .icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 19px;
    color: var(--muted);
    transform: translateY(-50%);
    pointer-events: none;
}

.model-market-search input {
    width: 100%;
    height: 58px;
    padding: 0 20px 0 52px;
    outline: 0;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--white);
    color: var(--ink);
    box-shadow: var(--glass-shadow);
    font-size: 14px;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.model-market-search input::placeholder { color: var(--muted); opacity: .78; }
.model-market-search input:focus {
    border-color: rgba(213, 173, 91, .58);
    box-shadow: 0 0 0 4px rgba(213, 173, 91, .1), var(--glass-shadow);
}

.model-market-toolbar {
    margin-bottom: 22px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--white);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(22px) saturate(135%);
    -webkit-backdrop-filter: blur(22px) saturate(135%);
}

.model-market-toolbar-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 74px;
    padding: 12px 16px;
}

.model-market-summary,
.model-market-controls,
.market-segment,
.market-view-switch,
.market-sort-control {
    display: flex;
    align-items: center;
}

.model-market-summary { gap: 15px; }
.model-market-summary strong { color: var(--ink); font-size: 13px; white-space: nowrap; }
.market-filter-toggle { min-height: 40px; padding: 8px 13px; }
.model-market-controls { justify-content: flex-end; gap: 9px; }

.market-segment,
.market-view-switch {
    gap: 3px;
    min-height: 40px;
    padding: 3px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(0, 0, 0, .08);
}

.market-segment button,
.market-view-switch button {
    display: inline-grid;
    place-items: center;
    min-width: 38px;
    height: 32px;
    padding: 0 11px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
}

.market-segment button.active,
.market-view-switch button.active {
    background: var(--green);
    color: #17130d;
    box-shadow: inset 0 1px 0 rgba(255, 244, 202, .42), 0 4px 12px rgba(113, 78, 19, .2);
}

.market-sort-control {
    gap: 7px;
    height: 40px;
    padding: 0 11px;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: var(--muted);
}

.market-sort-control select {
    max-width: 112px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ink);
    font-size: 11px;
    font-weight: 700;
}

.model-market-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr)) auto;
    align-items: end;
    gap: 12px;
    padding: 16px;
    border-top: 1px solid var(--line);
}

.model-market-filters[hidden] { display: none; }
.model-market-filters label { display: grid; gap: 6px; }
.model-market-filters label > span { color: var(--muted); font-size: 10px; font-weight: 800; }
.model-market-filters select {
    width: 100%;
    height: 40px;
    padding: 0 11px;
    outline: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--paper);
    color: var(--ink);
    font-size: 12px;
}

.model-market-filters .button { height: 40px; }

.model-market-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.market-model-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 344px;
    padding: 22px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--white);
    box-shadow: var(--glass-shadow);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.market-model-card[hidden] {
    display: none !important;
}

.market-model-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 22px;
    width: 74px;
    height: 2px;
    background: var(--green);
    box-shadow: 0 0 16px rgba(213, 173, 91, .42);
}

.market-model-card:hover {
    transform: translateY(-2px);
    border-color: rgba(213, 173, 91, .43);
    box-shadow: 0 25px 65px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 236, 184, .1);
}

.market-card-header {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
}

.market-provider-mark {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    color: #f5dd9d;
    background: #3f321e;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
}

.market-provider-mark.provider-openai { color: #9ed9c4; background: #183a31; }
.market-provider-mark.provider-anthropic { color: #f1b49b; background: #482920; }
.market-provider-mark.provider-google { color: #a9c9ef; background: #23364b; }
.market-provider-mark.provider-deepseek { color: #b8c9ff; background: #26345b; }
.market-provider-mark.provider-gpt { color: #f4f4f2; background: #292929; border-radius: 50%; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 18px rgba(0, 0, 0, .18); }

.market-model-identity { min-width: 0; }
.market-model-identity h2 {
    margin: 0;
    overflow: hidden;
    color: var(--ink);
    font-size: 15px;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.market-model-identity code {
    display: block;
    margin-top: 3px;
    padding: 0;
    overflow: hidden;
    background: transparent;
    color: var(--muted);
    font: 600 10px 'DM Mono', monospace;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.market-card-actions { display: flex; align-items: center; gap: 4px; }
.market-detail-button { min-height: 34px; padding: 6px 10px; border-radius: 10px; }
.market-copy-button { border: 1px solid var(--line); border-radius: 10px; }
.market-copy-button.copied { color: #17130d; background: var(--green); }

.market-price-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 22px;
    padding: 17px 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.market-price-row > div { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 2px 8px; }
.market-price-row span { color: var(--muted); font-size: 10px; }
.market-price-row strong { justify-self: end; color: var(--ink); font: 750 14px 'DM Mono', monospace; }
.market-price-row small { grid-column: 1 / -1; color: var(--muted); font-size: 9px; }

.market-card-description {
    min-height: 48px;
    margin: 16px 0 12px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.7;
}

.market-capability-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 18px;
}

.market-capability-list span,
.model-detail-capabilities b {
    padding: 4px 7px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: var(--green-soft);
    color: var(--green-dark);
    font-size: 9px;
    font-weight: 750;
}

.market-card-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: end;
    gap: 14px;
    margin-top: auto;
}

.market-card-footer > div:first-child { min-width: 0; display: grid; }
.market-card-footer > div:first-child strong { overflow: hidden; color: var(--ink); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.market-card-footer > div:first-child span { margin-top: 2px; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.market-context { display: grid; justify-items: end; }
.market-context span { color: var(--muted); font-size: 9px; }
.market-context strong { color: var(--ink); font: 700 11px 'DM Mono', monospace; }
.market-availability { align-self: center; color: var(--green); font-size: 10px; font-weight: 800; white-space: nowrap; }
.market-availability i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px var(--green-soft); }

.model-market-grid.is-list { grid-template-columns: 1fr; }
.model-market-grid.is-list .market-model-card {
    display: grid;
    grid-template-columns: minmax(260px, 1.1fr) minmax(260px, .85fr) minmax(220px, 1fr) minmax(260px, .9fr);
    align-items: center;
    gap: 24px;
    min-height: 0;
    padding: 19px 22px;
}

.model-market-grid.is-list .market-price-row { margin: 0; padding: 0; border: 0; }
.model-market-grid.is-list .market-card-description { min-height: 0; margin: 0; }
.model-market-grid.is-list .market-capability-list { display: none; }
.model-market-grid.is-list .market-card-footer { margin: 0; }

.model-market-empty {
    display: grid;
    justify-items: center;
    min-height: 320px;
    padding: 70px 20px;
    text-align: center;
}

.model-market-empty[hidden] { display: none; }
.model-market-empty > span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: var(--green-soft); color: var(--green); }
.model-market-empty h2 { margin: 15px 0 4px; color: var(--ink); font-size: 18px; }
.model-market-empty p { margin: 0 0 18px; color: var(--muted); font-size: 12px; }

.model-market-modal { width: min(700px, 100%); padding: 28px; }
.model-detail-header { display: flex; align-items: start; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.model-detail-header > div { min-width: 0; }
.model-detail-header span { color: var(--green); font-size: 10px; font-weight: 800; }
.model-detail-header h2 { margin: 5px 0 3px; color: var(--ink); font-size: 27px; letter-spacing: 0; }
.model-detail-header code { padding: 0; background: transparent; color: var(--muted); font: 600 10px 'DM Mono', monospace; }
.model-detail-description { margin: 20px 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.model-detail-specs { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid var(--line); }
.model-detail-specs > div { display: flex; justify-content: space-between; gap: 15px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.model-detail-specs > div:nth-child(odd) { padding-right: 18px; }
.model-detail-specs > div:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--line); }
.model-detail-specs dt { color: var(--muted); font-size: 10px; }
.model-detail-specs dd { margin: 0; color: var(--ink); font-size: 11px; font-weight: 750; text-align: right; }
.model-detail-capabilities { display: grid; gap: 9px; padding: 20px 0; }
.model-detail-capabilities > span { color: var(--muted); font-size: 10px; font-weight: 800; }
.model-detail-capabilities > div { display: flex; flex-wrap: wrap; gap: 7px; }
.model-detail-actions { display: flex; justify-content: flex-end; gap: 9px; padding-top: 18px; border-top: 1px solid var(--line); }

html[data-theme="light"] .public-body .site-nav a.active { color: #825d1d; }
html[data-theme="light"] .model-market-toolbar,
html[data-theme="light"] .market-model-card,
html[data-theme="light"] .model-market-search input { background: rgba(255, 253, 248, .92); }
html[data-theme="light"] .market-segment,
html[data-theme="light"] .market-view-switch { background: rgba(96, 74, 31, .06); }
html[data-theme="light"] .market-model-card:hover { box-shadow: 0 24px 55px rgba(80, 61, 25, .12), inset 0 1px 0 #fff; }
html[data-theme="light"] .market-capability-list span,
html[data-theme="light"] .model-detail-capabilities b { color: #765317; }

@media (max-width: 1100px) {
    .model-market-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .model-market-grid.is-list .market-model-card { grid-template-columns: minmax(240px, 1fr) minmax(230px, .8fr) minmax(220px, .9fr); }
    .model-market-grid.is-list .market-card-description { display: none; }
}

@media (max-width: 820px) {
    .model-market-page { padding: 108px 20px 70px; }
    .model-market-hero { padding: 42px 0 38px; }
    .model-market-hero h1 { font-size: 44px; }
    .model-market-toolbar-main { align-items: stretch; flex-direction: column; }
    .model-market-summary,
    .model-market-controls { justify-content: space-between; }
    .model-market-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .model-market-grid.is-list .market-model-card { grid-template-columns: minmax(230px, 1fr) minmax(220px, .8fr); }
    .model-market-grid.is-list .market-card-footer { display: none; }
}

@media (max-width: 650px) {
    html,
    body {
        max-width: 100%;
        overflow-x: clip;
    }

    .public-body .site-header {
        gap: 10px;
    }

    .public-body .site-header .brand {
        min-width: 0;
        max-width: calc(100% - 46px);
    }

    .public-body .site-header .brand > span:last-child {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .public-body .site-header .mobile-menu {
        flex: none;
    }

    .model-market-page { padding: 94px 14px 58px; }
    .model-market-page,
    .model-market-shell,
    .model-market-toolbar,
    .model-market-toolbar-main,
    .model-market-grid,
    .market-model-card {
        min-width: 0;
        max-width: 100%;
    }
    .model-market-hero { padding: 34px 6px 30px; }
    .model-market-hero h1 { font-size: 38px; }
    .model-market-hero > p { max-width: 100%; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
    .model-market-search { margin-top: 25px; }
    .model-market-search input { height: 52px; border-radius: 14px; font-size: 12px; }
    .model-market-toolbar-main { padding: 12px; }
    .model-market-summary { min-width: 0; }
    .model-market-summary strong { overflow: hidden; text-overflow: ellipsis; }
    .model-market-controls {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 6px;
        width: 100%;
        min-width: 0;
    }
    .market-segment,
    .market-view-switch,
    .market-sort-control { min-width: 0; }
    .market-segment button { min-width: 0; padding: 0 8px; }
    .market-view-switch button { min-width: 34px; padding: 0 8px; }
    .market-sort-control { width: 100%; padding: 0 8px; overflow: hidden; }
    .market-sort-control select { min-width: 0; max-width: none; width: 100%; }
    .model-market-filters { grid-template-columns: 1fr; }
    .model-market-grid,
    .model-market-grid.is-list { grid-template-columns: 1fr; }
    .model-market-grid.is-list .market-model-card,
    .market-model-card { display: flex; min-height: 330px; padding: 19px; }
    .model-market-grid.is-list .market-price-row { margin-top: 20px; padding: 15px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .model-market-grid.is-list .market-card-description { display: block; }
    .model-market-grid.is-list .market-card-footer { display: grid; margin-top: auto; }
    .market-card-header { grid-template-columns: 42px minmax(0, 1fr); }
    .market-provider-mark { width: 42px; height: 42px; }
    .market-card-actions { grid-column: 1 / -1; justify-content: flex-end; margin-top: 5px; }
    .market-detail-button { flex: 1; }
    .market-price-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
    .market-price-row > div { min-width: 0; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 5px; }
    .market-price-row span,
    .market-price-row small { overflow-wrap: anywhere; }
    .market-price-row strong { white-space: nowrap; }
    .market-card-description { overflow-wrap: anywhere; }
    .market-card-footer,
    .model-market-grid.is-list .market-card-footer {
        grid-template-columns: minmax(0, 1fr) auto;
        row-gap: 6px;
        column-gap: 12px;
        min-width: 0;
    }
    .market-context { grid-column: 2; }
    .market-availability { grid-column: 2; justify-self: end; }
    .model-market-modal { padding: 21px; }
    .model-detail-header h2 { font-size: 22px; }
    .model-detail-specs { grid-template-columns: 1fr; }
    .model-detail-specs > div:nth-child(odd),
    .model-detail-specs > div:nth-child(even) { padding: 12px 0; border-left: 0; }
    .model-detail-actions { flex-direction: column-reverse; }
    .model-detail-actions .button { width: 100%; }
}

/* Keep the user console palette above the shared workspace cascade. */
body.user-workspace,
html[data-theme="dark"] body.user-workspace {
    background: #0d0d0e;
    background-image: radial-gradient(circle at 80% -10%, rgba(213, 173, 91, .1), transparent 35%), linear-gradient(135deg, rgba(213, 173, 91, .025), transparent 42%);
}

html[data-theme="dark"] .user-workspace .sidebar {
    background: rgba(18, 17, 15, .92);
    border-right-color: rgba(213, 173, 91, .18);
}

html[data-theme="dark"] .user-workspace .workspace-topbar {
    background: rgba(15, 14, 13, .82);
    border-bottom-color: rgba(213, 173, 91, .14);
}

html[data-theme="light"] body.user-workspace {
    background: #f5f1e8;
    background-image: radial-gradient(circle at 82% -10%, rgba(213, 173, 91, .13), transparent 38%);
}

html[data-theme="light"] .user-workspace .sidebar {
    background: rgba(255, 253, 248, .94);
}

html[data-theme="light"] .user-workspace .workspace-topbar {
    background: rgba(250, 247, 239, .9);
}

/* Shared user-console secondary pages. */
.user-workspace .workspace-content {
    max-width: 1440px;
    padding-top: 34px;
    padding-bottom: 70px;
}

.user-workspace .workspace-intro h2 {
    color: #f4eee3;
    letter-spacing: 0;
}

.user-workspace .workspace-intro p:not(.eyebrow) {
    color: #a39b90;
}

.user-workspace .panel,
.user-workspace .stat-card,
.user-workspace .plan-card,
.user-workspace .secret-alert,
.user-workspace .info-strip {
    border-color: rgba(213, 173, 91, .18);
    border-radius: 16px;
    background: rgba(29, 27, 23, .82);
    box-shadow: 0 22px 60px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 236, 184, .06);
}

.user-workspace .panel-heading h3,
.user-workspace .stat-card > strong,
.user-workspace .stat-card > span,
.user-workspace .key-name strong,
.user-workspace .empty-state h3 {
    color: #f1e9dc;
}

.user-workspace .stat-card > small,
.user-workspace .muted-note,
.user-workspace .empty-state p,
.user-workspace .info-strip p {
    color: #978f83;
}

.user-workspace .table-wrap table th {
    color: #8e867a;
}

.user-workspace .table-wrap table td {
    color: #b2aaa0;
    border-bottom-color: rgba(213, 173, 91, .1);
}

.user-workspace .table-wrap table td strong,
.user-workspace .table-wrap table td code {
    color: #ece4d6;
}

.user-workspace .table-wrap table td code {
    background: rgba(213, 173, 91, .08);
}

.user-workspace .key-avatar {
    color: #dfb65e;
    background: rgba(213, 173, 91, .13);
}

.user-workspace .empty-state {
    padding: 56px 20px;
}

.user-workspace .empty-state > span {
    background: rgba(213, 173, 91, .12);
    color: #d5ad5b;
}

.user-workspace .status-pill {
    color: #e6bd64;
    background: rgba(213, 173, 91, .12);
    border-color: rgba(213, 173, 91, .2);
}

.user-workspace .status-pill i {
    background: #d5ad5b;
    box-shadow: 0 0 0 3px rgba(213, 173, 91, .1);
}

.user-workspace .alert-success,
.user-workspace .info-strip {
    color: #d5ad5b;
}

.usage-chart {
    position: relative;
    display: grid;
    grid-template-columns: repeat(24, minmax(0, 1fr));
    align-items: end;
    gap: 7px;
    min-height: 250px;
    padding: 28px 5px 3px;
    border-top: 1px solid rgba(213, 173, 91, .11);
    border-bottom: 1px solid rgba(213, 173, 91, .11);
}

.usage-chart-grid {
    position: absolute;
    inset: 28px 0 28px;
    display: grid;
    grid-template-rows: repeat(5, 1fr);
    pointer-events: none;
}

.usage-chart-grid i {
    border-top: 1px dashed rgba(213, 173, 91, .12);
}

.usage-chart-column {
    position: relative;
    z-index: 1;
    display: grid;
    align-items: end;
    justify-items: center;
    min-width: 0;
    height: 218px;
    cursor: default;
}

.usage-chart-column > strong {
    min-height: 14px;
    overflow: hidden;
    max-width: 100%;
    color: #d9b768;
    font: 600 9px 'DM Mono', monospace;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.usage-chart-bar {
    display: flex;
    align-items: end;
    width: min(24px, 75%);
    height: 182px;
}

.usage-chart-bar i {
    display: block;
    width: 100%;
    min-height: 3px;
    border-radius: 7px 7px 2px 2px;
    background: linear-gradient(180deg, #e7c773, #ad7826);
    box-shadow: 0 0 16px rgba(213, 173, 91, .22);
    transition: height .35s ease, filter .2s ease;
}

.usage-chart-column:hover .usage-chart-bar i {
    filter: brightness(1.18);
}

.usage-chart-column small {
    width: 35px;
    margin-top: 6px;
    color: #80786c;
    font: 500 9px 'DM Mono', monospace;
    text-align: center;
    white-space: nowrap;
}

.usage-chart-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 22px;
    padding-top: 15px;
    color: #9a9287;
    font-size: 11px;
}

.usage-chart-summary > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.usage-chart-summary strong {
    color: #eee5d7;
}

.summary-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.summary-dot.gold { background: #d5ad5b; }
.summary-dot.blue { background: #91b9d6; }
.summary-dot.violet { background: #b69ad4; }
.summary-dot.red { background: #d9877f; }

.usage-log-table {
    margin-top: 0;
}

.api-key-guide {
    margin-top: 18px;
}

.api-key-guide-lead {
    margin: -6px 0 18px;
    color: #9c9488;
    font-size: 12px;
}

.api-endpoint-list {
    display: grid;
    gap: 8px;
    max-width: 780px;
}

.api-endpoint-list > div {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 45px;
    padding: 6px 9px 6px 13px;
    border: 1px solid rgba(213, 173, 91, .12);
    border-radius: 10px;
    background: rgba(255, 255, 255, .035);
}

.api-endpoint-list span {
    color: #a39b90;
    font-size: 11px;
}

.api-endpoint-list code {
    min-width: 0;
    overflow: hidden;
    padding: 5px 8px;
    background: rgba(213, 173, 91, .08);
    color: #e3c77f;
    font: 600 11px 'DM Mono', monospace;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.api-endpoint-list .icon-button {
    color: #9f9587;
}

.api-client-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.api-client-grid > a {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(213, 173, 91, .12);
    border-radius: 11px;
    color: #9e9588;
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.api-client-grid > a:hover {
    border-color: rgba(213, 173, 91, .33);
    background: rgba(213, 173, 91, .06);
    transform: translateY(-2px);
}

.api-client-grid > a > span:nth-child(2) {
    display: grid;
    min-width: 0;
    flex: 1;
}

.api-client-grid strong {
    color: #eee5d7;
    font-size: 11px;
}

.api-client-grid small {
    overflow: hidden;
    color: #898176;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.api-client-grid > a > .icon:last-child {
    color: #d5ad5b;
}

.quick-icon.gold { color: #d5ad5b; background: rgba(213, 173, 91, .14); }

.wallet-subscription-summary {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: 20px;
}

.wallet-subscription-summary .panel-heading {
    flex: 1 1 260px;
    margin-bottom: 0;
}

.wallet-subscription-track {
    display: grid;
    flex: 1 1 360px;
    gap: 8px;
}

.wallet-subscription-track > div:first-child {
    display: flex;
    justify-content: space-between;
    color: #968d81;
    font-size: 10px;
}

.wallet-subscription-track strong {
    color: #e5bd66;
}

.wallet-subscription-summary > .button {
    flex: none;
}

.referral-plan-panel {
    margin-top: 18px;
}

.referral-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.referral-plan-grid article {
    display: grid;
    align-content: start;
    gap: 7px;
    min-width: 0;
    padding: 16px;
    border: 1px solid rgba(213, 173, 91, .12);
    border-radius: 12px;
    background: rgba(255, 255, 255, .035);
}

.referral-plan-grid h4 {
    margin: 2px 0 0;
    color: #f0e7d8;
    font-size: 14px;
}

.referral-plan-grid p,
.referral-plan-grid small {
    margin: 0;
    overflow: hidden;
    color: #91897e;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.referral-plan-grid strong {
    color: #e5b95c;
    font-size: 20px;
}

.referral-plan-grid .button {
    margin-top: 5px;
    width: 100%;
    min-height: 35px;
    padding: 7px 10px;
    font-size: 10px;
}

html[data-theme="light"] .user-workspace .workspace-intro h2,
html[data-theme="light"] .user-workspace .panel-heading h3,
html[data-theme="light"] .user-workspace .stat-card > strong,
html[data-theme="light"] .user-workspace .stat-card > span,
html[data-theme="light"] .user-workspace .key-name strong,
html[data-theme="light"] .user-workspace .empty-state h3,
html[data-theme="light"] .user-workspace .api-client-grid strong,
html[data-theme="light"] .user-workspace .referral-plan-grid h4 {
    color: #2f2921;
}

html[data-theme="light"] .user-workspace .panel,
html[data-theme="light"] .user-workspace .stat-card,
html[data-theme="light"] .user-workspace .plan-card,
html[data-theme="light"] .user-workspace .secret-alert,
html[data-theme="light"] .user-workspace .info-strip {
    background: rgba(255, 253, 248, .92);
    border-color: rgba(127, 102, 55, .18);
    box-shadow: 0 20px 55px rgba(92, 70, 32, .09), inset 0 1px 0 #fff;
}

html[data-theme="light"] .user-workspace .workspace-intro p:not(.eyebrow),
html[data-theme="light"] .user-workspace .muted-note,
html[data-theme="light"] .user-workspace .empty-state p,
html[data-theme="light"] .user-workspace .info-strip p,
html[data-theme="light"] .user-workspace .api-key-guide-lead,
html[data-theme="light"] .user-workspace .api-endpoint-list span,
html[data-theme="light"] .user-workspace .referral-plan-grid p,
html[data-theme="light"] .user-workspace .referral-plan-grid small {
    color: #746b5e;
}

html[data-theme="light"] .user-workspace .api-endpoint-list > div,
html[data-theme="light"] .user-workspace .api-client-grid > a,
html[data-theme="light"] .user-workspace .referral-plan-grid article {
    background: rgba(111, 86, 42, .045);
    border-color: rgba(127, 102, 55, .12);
}

@media (max-width: 900px) {
    .api-client-grid,
    .referral-plan-grid { grid-template-columns: 1fr; }
    .wallet-subscription-summary { align-items: stretch; }
    .wallet-subscription-summary > .button { width: 100%; }
}

@media (max-width: 700px) {
    .user-workspace .workspace-content { padding: 24px 14px 50px; }
    .user-workspace .workspace-intro .button { margin-top: 14px; }
    .usage-chart { gap: 3px; min-height: 205px; padding-left: 0; padding-right: 0; }
    .usage-chart-column { height: 176px; }
    .usage-chart-bar { height: 145px; width: min(15px, 80%); }
    .usage-chart-column > strong { font-size: 7px; }
    .usage-chart-column small { width: 28px; font-size: 7px; transform: rotate(-45deg); transform-origin: top center; }
    .usage-chart-summary { gap: 8px 14px; font-size: 10px; }
    .api-endpoint-list > div { grid-template-columns: 70px minmax(0, 1fr) auto; gap: 7px; }
    .api-endpoint-list code { font-size: 9px; }
}

/* Final landing-page palette guard: the globe and public UI stay black and gold. */
.public-body .hero { background: #09090a; }

.public-body .hero-backdrop {
    background-color: #09090a;
    background-image:
        linear-gradient(90deg, rgba(6, 6, 7, .99) 0%, rgba(22, 19, 13, .96) 48%, rgba(58, 42, 18, .7) 100%),
        radial-gradient(circle at 78% 28%, rgba(218, 180, 91, .3) 0 2px, transparent 3px),
        radial-gradient(circle at 62% 62%, rgba(255, 231, 168, .16) 0 1px, transparent 2px);
}

.public-body .hero-backdrop::after,
.public-body .hero-visual::before {
    border-color: rgba(230, 193, 104, .2);
    box-shadow: 0 0 0 28px rgba(214, 171, 79, .04), 0 0 0 82px rgba(214, 171, 79, .025);
}

.public-body .hero-globe-fallback {
    border-color: rgba(236, 200, 117, .46);
    background: radial-gradient(circle at 35% 30%, rgba(213, 173, 91, .22), rgba(74, 53, 22, .13) 48%, rgba(5, 5, 5, .12) 70%);
    box-shadow: inset -32px -20px 70px rgba(3, 3, 3, .55), inset 22px 18px 45px rgba(238, 204, 123, .12), 0 0 70px rgba(191, 144, 47, .14);
}

.public-body .hero-globe-fallback::before,
.public-body .hero-globe-fallback::after,
.public-body .hero-globe-fallback span,
.public-body .hero-globe-fallback i,
.public-body .hero-globe-fallback b { border-color: rgba(238, 204, 123, .2); }

.public-body .visual-scanline { background: linear-gradient(90deg, transparent, rgba(239, 202, 119, .5), transparent); }

.public-body .hero .eyebrow,
.public-body .section-heading .eyebrow,
.public-body .feature-copy .eyebrow,
.public-body .developer-copy .eyebrow,
.public-body .inline-link,
.public-body .quota { color: #d5ad5b; }

.public-body .button-primary,
.public-body .plan-badge { background: #c99b43; color: #17130d; }
.public-body .button-primary:hover { background: #e2b961; color: #17130d; }

.public-body .live-dot,
.public-body .system-status i,
.public-body .status-pill i,
.public-body .bar i { background: #e2b95d; }

.public-body .status-pill {
    border-color: rgba(213, 173, 91, .25);
    background: rgba(213, 173, 91, .14);
    color: #d5ad5b;
}

/* Homepage value proposition and start-now sections. */
.why-cc-section {
    padding: 112px max(28px, calc((100vw - 1300px) / 2));
    background: #12110f;
}

.why-cc-inner,
.start-cc-inner {
    max-width: 1300px;
    margin: 0 auto;
}

.why-cc-heading {
    max-width: 720px;
    margin: 0 auto 48px;
    text-align: center;
}

.why-cc-heading h2,
.start-cc-inner h2 {
    margin: 0;
    color: var(--ink);
    font-size: clamp(30px, 4vw, 48px);
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.2;
}

.why-cc-heading p,
.start-cc-inner > p {
    margin: 14px 0 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.7;
}

.why-cc-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.why-cc-card {
    min-width: 0;
    padding: 30px 24px 28px;
    border: 1px solid rgba(213, 173, 91, .18);
    border-radius: 18px;
    background: rgba(31, 28, 23, .8);
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255, 236, 184, .06), 0 18px 46px rgba(0, 0, 0, .14);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.why-cc-card:hover {
    transform: translateY(-5px);
    border-color: rgba(213, 173, 91, .48);
    box-shadow: inset 0 1px 0 rgba(255, 236, 184, .1), 0 24px 55px rgba(0, 0, 0, .22);
}

.why-cc-icon {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    margin: 0 auto 21px;
    border: 1px solid rgba(213, 173, 91, .3);
    border-radius: 17px;
    background: rgba(213, 173, 91, .1);
    color: #e2b95d;
}

.why-cc-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: 18px;
    line-height: 1.4;
}

.why-cc-card p {
    min-height: 78px;
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}

.start-cc-section {
    padding: 118px 28px 124px;
    border-top: 1px solid rgba(213, 173, 91, .12);
    background: #0d0d0e;
    text-align: center;
}

.start-cc-inner > p {
    max-width: 660px;
    margin-right: auto;
    margin-left: auto;
}

.start-cc-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.start-cc-platforms {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 42px;
}

.start-cc-platforms span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-width: 142px;
    justify-content: center;
    padding: 12px 18px;
    border: 1px solid rgba(213, 173, 91, .2);
    border-radius: 12px;
    background: rgba(32, 30, 26, .72);
    color: var(--ink);
    font-size: 13px;
    font-weight: 700;
}

.start-cc-platforms .icon { color: #d5ad5b; }

.start-cc-note {
    display: block;
    margin-top: 19px;
    color: var(--muted);
    font-size: 12px;
}

html[data-theme="light"] .why-cc-section {
    background: #f4eee2;
}

html[data-theme="light"] .why-cc-card {
    border-color: rgba(112, 92, 51, .18);
    background: rgba(255, 253, 248, .9);
    box-shadow: 0 18px 46px rgba(80, 61, 25, .08), inset 0 1px 0 rgba(255, 255, 255, .9);
}

html[data-theme="light"] .why-cc-card:hover {
    border-color: rgba(169, 120, 36, .46);
    box-shadow: 0 24px 55px rgba(80, 61, 25, .13), inset 0 1px 0 #fff;
}

html[data-theme="light"] .why-cc-icon {
    border-color: rgba(169, 120, 36, .28);
    background: rgba(169, 120, 36, .1);
    color: #a97824;
}

html[data-theme="light"] .start-cc-section {
    border-top-color: rgba(112, 92, 51, .14);
    background: #f5f1e8;
}

html[data-theme="light"] .start-cc-platforms span {
    border-color: rgba(112, 92, 51, .2);
    background: rgba(255, 253, 248, .9);
}

html[data-theme="light"] .start-cc-platforms .icon { color: #a97824; }

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

@media (max-width: 650px) {
    .why-cc-section { padding: 76px 20px; }
    .why-cc-heading { margin-bottom: 32px; }
    .why-cc-heading p,
    .start-cc-inner > p { font-size: 14px; }
    .why-cc-grid { grid-template-columns: 1fr; gap: 12px; }
    .why-cc-card { padding: 25px 21px 23px; }
    .why-cc-card p { min-height: 0; }
    .start-cc-section { padding: 82px 20px 88px; }
    .start-cc-actions { align-items: stretch; flex-direction: column; max-width: 340px; margin-right: auto; margin-left: auto; }
    .start-cc-actions .button { width: 100%; justify-content: center; }
    .start-cc-platforms { gap: 8px; margin-top: 32px; }
    .start-cc-platforms span { min-width: 0; flex: 1 1 30%; padding: 11px 8px; font-size: 11px; }
}

html[data-theme="dark"] .public-body .plan-card.featured {
    border-color: rgba(232, 193, 101, .62);
    background: rgba(97, 71, 28, .28);
}

html[data-theme="dark"] .public-body .feature-band { background: #171511; }

@media (max-width: 700px) {
    .public-body .hero-inner {
        background: linear-gradient(90deg, rgba(8, 8, 9, .98) 0%, rgba(22, 19, 13, .8) 72%, transparent 100%);
    }
}

/* Decorative overlines are intentionally removed across public, auth and workspace pages. */
.eyebrow { display: none !important; }

/* Responsive channel editor and live upstream diagnostics. */
.channel-modal {
    width: min(1120px, calc(100vw - 40px));
    max-height: calc(100dvh - 32px);
    overflow: auto;
    padding: clamp(22px, 2.6vw, 34px);
    border-radius: 20px;
}

.channel-modal .modal-heading {
    gap: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--line);
}

.channel-modal .modal-heading h2 {
    font-size: 24px;
    letter-spacing: 0;
}

.channel-modal .modal-heading p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 12px;
}

.channel-form {
    gap: 20px;
    margin-top: 22px;
}

.channel-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.14fr) minmax(330px, .86fr);
    gap: clamp(28px, 4vw, 52px);
    align-items: start;
}

.channel-config-fields {
    display: grid;
    gap: 16px;
    min-width: 0;
}

.channel-config-fields > [hidden] {
    display: none !important;
}

.channel-diagnostics {
    min-width: 0;
    padding-left: clamp(24px, 3vw, 38px);
    border-left: 1px solid var(--line);
    position: sticky;
    top: 0;
}

.channel-diagnostics-heading {
    display: flex;
    align-items: center;
    gap: 12px;
}

.channel-diagnostics-heading h3 {
    margin: 0;
    font-size: 15px;
    letter-spacing: 0;
}

.channel-diagnostics-heading p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 10px;
}

.diagnostic-icon,
.diagnostic-result-icon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    color: #d6aa54;
    background: rgba(214, 170, 84, .12);
    border: 1px solid rgba(214, 170, 84, .2);
}

.diagnostic-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 18px;
}

.diagnostic-actions .button {
    width: 100%;
    min-height: 40px;
    padding: 9px 10px;
    white-space: nowrap;
}

.diagnostic-actions .button-primary:last-child:nth-child(3) {
    grid-column: 1 / -1;
}

.diagnostic-result {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    min-height: 70px;
    margin-top: 14px;
    padding: 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(125, 112, 88, .055);
}

.diagnostic-result strong {
    display: block;
    font-size: 12px;
}

.diagnostic-result p {
    margin: 3px 0 0;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.5;
    word-break: break-word;
}

.diagnostic-result.is-success {
    border-color: rgba(74, 176, 126, .32);
    background: rgba(74, 176, 126, .08);
}

.diagnostic-result.is-error {
    border-color: rgba(218, 90, 88, .35);
    background: rgba(218, 90, 88, .08);
}

.diagnostic-result.is-loading .diagnostic-result-icon {
    animation: diagnostic-pulse 1s ease-in-out infinite;
}

.diagnostic-latency {
    color: #d6aa54;
    font: 700 11px ui-monospace, SFMono-Regular, Consolas, monospace;
    white-space: nowrap;
}

.discovered-models {
    margin-top: 14px;
    border-top: 1px solid var(--line);
    padding-top: 14px;
}

.discovered-models-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.discovered-models-heading strong,
.discovered-models-heading small {
    display: block;
}

.discovered-models-heading strong { font-size: 12px; }
.discovered-models-heading small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.discovered-models-heading .button { min-height: 34px; padding: 7px 10px; }

.discovered-model-list {
    display: grid;
    gap: 7px;
    max-height: 330px;
    margin-top: 12px;
    padding-right: 4px;
    overflow: auto;
}

.discovered-model-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 10px 11px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: rgba(125, 112, 88, .045);
}

.discovered-model-item strong,
.discovered-model-item small {
    display: block;
    min-width: 0;
}

.discovered-model-item strong {
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.discovered-model-item small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 9px;
    overflow-wrap: anywhere;
}

.discovered-model-item span {
    color: #d6aa54;
    font: 700 9px ui-monospace, SFMono-Regular, Consolas, monospace;
    white-space: nowrap;
}

.diagnostic-footnote {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 9px;
}

.channel-modal-actions {
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

@keyframes diagnostic-pulse {
    0%, 100% { opacity: .5; transform: scale(.92); }
    50% { opacity: 1; transform: scale(1); }
}

@media (max-width: 920px) {
    .channel-modal { width: min(720px, calc(100vw - 28px)); }
    .channel-form-grid { grid-template-columns: 1fr; gap: 26px; }
    .channel-diagnostics { position: static; padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--line); }
    .discovered-model-list { max-height: 280px; }
}

@media (max-width: 560px) {
    .modal-backdrop { padding: 8px; }
    .channel-modal { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); padding: 18px 15px; border-radius: 16px; }
    .channel-modal .modal-heading { padding-bottom: 15px; }
    .channel-modal .modal-heading h2 { font-size: 20px; }
    .channel-form { margin-top: 17px; }
    .channel-config-fields { gap: 14px; }
    .diagnostic-actions { grid-template-columns: 1fr; }
    .diagnostic-actions .button-primary:last-child:nth-child(3) { grid-column: auto; }
    .diagnostic-result { grid-template-columns: auto minmax(0, 1fr); }
    .diagnostic-latency { grid-column: 2; }
    .channel-modal-actions .button { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .diagnostic-result.is-loading .diagnostic-result-icon { animation: none; }
}

/* Catalog management details and editor surfaces. */
body.modal-open { overflow: hidden; }
.table-actions { display: flex; align-items: center; gap: 7px; }
.table-actions form { display: inline-flex; margin: 0; }
.catalog-publish-button { min-width: 62px; min-height: 32px; padding: 6px 10px; border-radius: 8px; font-size: 11px; }
.catalog-modal { width: min(760px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; }
.catalog-modal .modal-heading { margin-bottom: 24px; }
.catalog-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 0 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.catalog-detail-grid > div { display: grid; gap: 5px; min-width: 0; padding: 15px 16px; border-bottom: 1px solid var(--line); }
.catalog-detail-grid > div:nth-child(odd) { border-right: 1px solid var(--line); }
.catalog-detail-grid > div:nth-last-child(-n+2) { border-bottom: 0; }
.catalog-detail-grid span { color: var(--muted); font-size: 10px; font-weight: 700; }
.catalog-detail-grid strong { overflow-wrap: anywhere; color: var(--ink); font-size: 12px; }
.catalog-detail-section { padding: 0 2px 20px; }
.catalog-detail-section + .catalog-detail-section { padding-top: 19px; border-top: 1px solid var(--line); }
.catalog-detail-section h3 { margin: 0 0 8px; color: var(--ink); font-size: 12px; }
.catalog-detail-section p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.detail-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.detail-section-heading > span { color: var(--muted); font-size: 10px; }
.detail-model-list { max-height: 260px; overflow-y: auto; border-top: 1px solid var(--line); }
.detail-model-list > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 11px 2px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.detail-model-list > div > span:first-child { display: grid; min-width: 0; }
.detail-model-list strong { overflow: hidden; color: var(--ink); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.detail-model-list small { overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.detail-empty { padding: 15px 0; border-top: 1px solid var(--line); }

.model-management-tabs {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: -8px 0 18px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line);
}
.model-management-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
}
.model-management-tabs a:hover { background: rgba(213, 173, 91, .09); color: var(--ink); }
.model-management-tabs a span {
    min-width: 22px;
    padding: 1px 6px;
    border-radius: 999px;
    background: rgba(213, 173, 91, .12);
    color: #a77a22;
    text-align: center;
    font-size: 10px;
}
.model-publish-note {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 18px;
    padding: 12px 15px;
    border: 1px solid rgba(213, 173, 91, .2);
    border-radius: 10px;
    background: rgba(213, 173, 91, .07);
    color: var(--muted);
}
.model-publish-note > span { color: #bc8d31; }
.model-publish-note p { margin: 0; font-size: 11px; }
.model-publish-note strong { margin-right: 7px; color: var(--ink); }
.model-management-panel { scroll-margin-top: 108px; }
.model-management-panel + .model-management-panel { margin-top: 18px; }

html[data-theme="dark"] .catalog-detail-grid,
html[data-theme="dark"] .catalog-detail-grid > div,
html[data-theme="dark"] .catalog-detail-section + .catalog-detail-section,
html[data-theme="dark"] .detail-model-list,
html[data-theme="dark"] .detail-model-list > div { border-color: rgba(215, 188, 123, .16); }

@media (max-width: 700px) {
    .catalog-modal { width: 100%; max-height: calc(100vh - 24px); padding: 22px 18px; }
    .catalog-detail-grid { grid-template-columns: 1fr; }
    .catalog-detail-grid > div,
    .catalog-detail-grid > div:nth-child(odd),
    .catalog-detail-grid > div:nth-last-child(-n+2) { border-right: 0; border-bottom: 1px solid var(--line); }
    .catalog-detail-grid > div:last-child { border-bottom: 0; }
    .catalog-modal .form-columns { grid-template-columns: 1fr; }
    .table-actions { min-width: 184px; }
    .model-management-tabs { overflow-x: auto; }
    .model-management-tabs a { flex: none; }
    .model-publish-note { align-items: flex-start; }
}

/* Public plan catalog. */
.public-plans-page {
    min-height: 100vh;
    padding: 142px 28px 88px;
    background:
        linear-gradient(rgba(213, 173, 91, .035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(213, 173, 91, .035) 1px, transparent 1px),
        var(--paper);
    background-size: 48px 48px;
}

.public-plans-hero,
.public-plan-grid,
.public-plans-empty,
.public-plan-assurance {
    width: min(1320px, 100%);
    margin-right: auto;
    margin-left: auto;
}

.public-plans-hero {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 36px;
    padding: 34px 0 52px;
}

.public-plans-hero > div { max-width: 730px; }
.public-plans-hero h1 {
    margin: 0;
    color: var(--ink);
    font-size: 54px;
    line-height: 1.08;
    letter-spacing: 0;
}
.public-plans-hero p {
    margin: 18px 0 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.85;
}
.public-plans-hero > .button { flex: none; }

.public-plan-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.public-plan-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 610px;
    padding: 28px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--white);
    box-shadow: var(--glass-shadow);
    backdrop-filter: blur(22px) saturate(135%);
    -webkit-backdrop-filter: blur(22px) saturate(135%);
    animation: public-plan-arrive .48s ease both;
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.public-plan-card:nth-child(2) { animation-delay: .04s; }
.public-plan-card:nth-child(3) { animation-delay: .08s; }
.public-plan-card:nth-child(4) { animation-delay: .12s; }
.public-plan-card:nth-child(5) { animation-delay: .16s; }
.public-plan-card:nth-child(6) { animation-delay: .2s; }
.public-plan-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 28px;
    width: 74px;
    height: 2px;
    background: rgba(213, 173, 91, .52);
}
.public-plan-card:hover {
    transform: translateY(-3px);
    border-color: rgba(213, 173, 91, .42);
    box-shadow: 0 28px 70px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 239, 194, .09);
}
.public-plan-card.featured {
    border-color: rgba(232, 193, 101, .64);
    background: linear-gradient(155deg, rgba(104, 76, 29, .38), rgba(28, 26, 22, .88) 54%);
    box-shadow: 0 28px 75px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 232, 169, .14);
}
.public-plan-card.featured::before {
    width: calc(100% - 56px);
    background: linear-gradient(90deg, #e5bd68, rgba(229, 189, 104, .08));
    box-shadow: 0 0 22px rgba(229, 189, 104, .22);
}

.public-plan-card-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
}
.public-plan-card-head > div { min-width: 0; }
.public-plan-card-head span {
    display: block;
    margin-bottom: 7px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 750;
}
.public-plan-card-head h2 {
    margin: 0;
    overflow-wrap: anywhere;
    color: var(--ink);
    font-size: 23px;
    line-height: 1.3;
    letter-spacing: 0;
}
.public-plan-recommended {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: none;
    color: #e5bd68;
    font-size: 11px;
    white-space: nowrap;
}
.public-plan-description {
    min-height: 48px;
    margin: 11px 0 25px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.75;
}
.public-plan-price {
    display: flex;
    align-items: baseline;
    min-height: 60px;
    color: var(--ink);
}
.public-plan-price > span { margin-right: 5px; font-size: 18px; font-weight: 800; }
.public-plan-price > strong { font-size: 42px; line-height: 1; letter-spacing: 0; }
.public-plan-price > small { margin-left: 8px; color: var(--muted); font-size: 11px; }
.public-plan-quota {
    margin: 10px 0 22px;
    color: var(--green);
    font-size: 12px;
    font-weight: 800;
}

.public-plan-limits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    padding: 16px 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}
.public-plan-limits > div {
    min-width: 0;
    padding: 0 11px;
    border-right: 1px solid var(--line);
}
.public-plan-limits > div:first-child { padding-left: 0; }
.public-plan-limits > div:last-child { padding-right: 0; border-right: 0; }
.public-plan-limits dt {
    display: flex;
    align-items: center;
    gap: 5px;
    overflow: hidden;
    color: var(--muted);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.public-plan-limits dt .icon { flex: none; color: var(--green); }
.public-plan-limits dd {
    margin: 8px 0 0;
    overflow: hidden;
    color: var(--ink);
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.public-plan-includes { padding: 22px 0 18px; }
.public-plan-includes h3 {
    margin: 0 0 12px;
    color: var(--ink);
    font-size: 12px;
}
.public-plan-includes ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.public-plan-includes li {
    display: flex;
    align-items: start;
    gap: 8px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.55;
}
.public-plan-includes li .icon { flex: none; margin-top: 1px; color: var(--green); }
.public-plan-models {
    display: grid;
    gap: 5px;
    margin: -4px 0 20px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    font-size: 10px;
}
.public-plan-models strong { color: var(--ink); }
.public-plan-models span { overflow-wrap: anywhere; color: var(--muted); line-height: 1.65; }
.public-plan-card > .button { width: 100%; margin-top: auto; }

.public-plans-empty {
    display: grid;
    justify-items: center;
    min-height: 380px;
    padding: 82px 20px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    text-align: center;
}
.public-plans-empty > span { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; background: var(--green-soft); color: var(--green); }
.public-plans-empty h2 { margin: 18px 0 6px; color: var(--ink); font-size: 22px; letter-spacing: 0; }
.public-plans-empty p { margin: 0 0 22px; color: var(--muted); font-size: 12px; }

.public-plan-assurance {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 66px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}
.public-plan-assurance > div {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 3px 12px;
    padding: 28px 24px;
    border-right: 1px solid var(--line);
}
.public-plan-assurance > div:last-child { border-right: 0; }
.public-plan-assurance .icon { grid-row: 1 / 3; color: var(--green); }
.public-plan-assurance h2 { margin: 0; color: var(--ink); font-size: 13px; letter-spacing: 0; }
.public-plan-assurance p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.65; }

html[data-theme="light"] .public-plan-card { background: rgba(255, 253, 248, .91); }
html[data-theme="light"] .public-plan-card.featured {
    border-color: rgba(169, 120, 36, .56);
    background: linear-gradient(155deg, rgba(244, 226, 180, .92), rgba(255, 253, 248, .94) 58%);
    box-shadow: 0 26px 60px rgba(80, 61, 25, .13), inset 0 1px 0 #fff;
}
html[data-theme="light"] .public-plan-recommended { color: #825d1d; }
html[data-theme="light"] .public-plan-card:hover { box-shadow: 0 26px 60px rgba(80, 61, 25, .15), inset 0 1px 0 #fff; }

@keyframes public-plan-arrive {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}

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

@media (max-width: 700px) {
    .public-plans-page { padding: 94px 14px 56px; background-size: 36px 36px; }
    .public-plans-hero { display: block; padding: 34px 6px 34px; }
    .public-plans-hero h1 { font-size: 38px; }
    .public-plans-hero p { font-size: 13px; }
    .public-plans-hero > .button { width: 100%; margin-top: 24px; }
    .public-plan-grid { grid-template-columns: 1fr; gap: 14px; }
    .public-plan-card { min-height: 0; padding: 24px 20px; border-radius: 16px; }
    .public-plan-card::before { left: 20px; }
    .public-plan-card.featured::before { width: calc(100% - 40px); }
    .public-plan-card-head h2 { font-size: 21px; }
    .public-plan-price > strong { font-size: 38px; }
    .public-plan-limits > div { padding: 0 8px; }
    .public-plan-card > .button { margin-top: 5px; }
    .public-plan-assurance { grid-template-columns: 1fr; margin-top: 42px; }
    .public-plan-assurance > div { padding: 22px 12px; border-right: 0; border-bottom: 1px solid var(--line); }
    .public-plan-assurance > div:last-child { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .public-plan-card { animation: none; transition: none; }
}