:root { --green-950:#062b25; --green-900:#064e3b; --green-800:#06705a; --green-700:#078565; --green-500:#10b981; --green-300:#6ee7b7; --green-100:#d1fae5; --ink:#10231f; --muted:#56716a; --line:#d9e6e0; --surface:#fff; --canvas:#f4faf7; --danger:#b42318; --danger-soft:#fee4e2; --warning:#b54708; --warning-soft:#fffaeb; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--canvas); font:16px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; } a { color:inherit; text-decoration:none; } .container { width:min(1120px,calc(100% - 40px)); margin:auto; } .nav { display:flex; align-items:center; justify-content:space-between; min-height:72px; } .brand { display:flex; align-items:center; gap:10px; color:var(--green-900); font-size:1.2rem; font-weight:800; } .mark { display:grid; place-items:center; width:31px; height:31px; border-radius:9px; color:white; background:linear-gradient(145deg,var(--green-500),var(--green-900)); } .navlinks { display:flex; gap:25px; align-items:center; color:var(--muted); font-weight:600; } .button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; padding:0 18px; border:1px solid transparent; border-radius:9px; font-weight:700; cursor:pointer; } .button.primary { color:white; background:var(--green-800); box-shadow:0 8px 20px rgb(6 112 90 / .16); } .button.ghost { color:var(--green-800); background:white; border-color:var(--green-300); } .hero { padding:82px 0 66px; background:radial-gradient(circle at 78% 20%,#b7f7d9 0,transparent 26%),linear-gradient(180deg,#fff 0,var(--canvas) 100%); } .eyebrow { color:var(--green-800); font-weight:800; letter-spacing:.08em; text-transform:uppercase; font-size:.78rem; } h1 { max-width:760px; margin:14px 0 20px; font-size:clamp(2.6rem,7vw,5.4rem); line-height:1.03; letter-spacing:-.055em; } .lead { max-width:650px; color:var(--muted); font-size:1.15rem; } .actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; } .features { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:58px 0 76px; } .card { padding:25px; background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:0 6px 18px rgb(20 70 50 / .04); } .card h2 { margin:0 0 9px; font-size:1.05rem; } .card p { margin:0; color:var(--muted); } .page { min-height:calc(100vh - 72px); display:grid; place-items:center; padding:40px 0; } .panel { width:min(440px,100%); padding:32px; background:white; border:1px solid var(--line); border-radius:16px; box-shadow:0 12px 32px rgb(20 70 50 / .08); } .panel h1 { margin:0 0 8px; font-size:2rem; letter-spacing:-.04em; } .panel p { color:var(--muted); } .field { display:grid; gap:6px; margin:18px 0; color:var(--ink); font-weight:700; font-size:.9rem; } input, select, textarea { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:8px; font:inherit; background:#fff; } .note { margin-top:19px; font-size:.87rem; color:var(--muted); } footer { padding:30px 0; color:var(--muted); border-top:1px solid var(--line); font-size:.88rem; } .backend-page { padding:48px 0 72px; } .backend-page-header { display:flex; gap:16px; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; } .backend-page-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; margin-top:2px; } .backend-grid { display:grid; gap:18px; } .backend-grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:24px; } .backend-span-2 { grid-column:span 2; } .backend-card-space { margin-top:24px; } .backend-alert { border-color:#10b981;background:#ecfdf5;margin:28px 0; } .table { width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:white; box-shadow:0 8px 22px rgb(20 70 50 / .05); table-layout:auto; } .table thead th { padding:14px 16px; text-align:left; background:#eef8f3; color:var(--green-900); font-size:.82rem; letter-spacing:.03em; text-transform:uppercase; border-bottom:1px solid var(--line); } .table tbody td { padding:14px 16px; border-bottom:1px solid var(--line); border-right:1px solid var(--line); vertical-align:middle; } .table tbody td:last-child { border-right:none; } .table tbody tr:nth-child(even) { background:#fbfdfc; } .table tbody tr:hover { background:#f3fbf7; } .table tbody tr:last-child td { border-bottom:none; } .table .muted { color:var(--muted); } .table .actions-cell { text-align:right; white-space:nowrap; width:220px; padding-left:10px; padding-right:10px; } .table .actions-stack { display:flex; justify-content:flex-end; flex-wrap:nowrap; gap:6px; } .table .actions-stack form, .table .actions-stack a { flex:0 0 auto; } .table .actions-stack .button { min-height:30px; padding:0 8px; font-size:.76rem; border-radius:7px; white-space:nowrap; } .badge { display:inline-flex; align-items:center; min-height:28px; padding:0 10px; border-radius:999px; font-size:.82rem; font-weight:700; } .badge.success { color:var(--green-900); background:var(--green-100); } .badge.neutral { color:var(--muted); background:#edf3f1; } .badge.danger { color:var(--danger); background:var(--danger-soft); } .badge.warning { color:var(--warning); background:var(--warning-soft); } .backend-app { min-height:100vh; background:linear-gradient(180deg,#f8fbf9 0,#f3f8f5 100%); } .backend-shell { min-height:100vh; display:grid; grid-template-columns:290px minmax(0,1fr); } .backend-sidebar { display:flex; flex-direction:column; gap:18px; padding:24px 18px; background:#fff; color:var(--ink); position:sticky; top:0; height:100vh; border-right:1px solid var(--line); } .backend-brand { color:var(--green-900); } .backend-user-card { display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--line); border-radius:16px; background:#f8fcfa; } .backend-user-avatar { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; background:#e8f7f0; font-weight:800; text-transform:uppercase; color:var(--green-900); } .backend-user-meta { display:grid; gap:2px; min-width:0; } .backend-user-meta strong, .backend-user-meta span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .backend-user-meta span { color:var(--muted); font-size:.86rem; } .backend-nav { display:grid; gap:16px; overflow:auto; padding-right:4px; } .backend-nav-section { display:grid; gap:8px; } .backend-nav-title { color:var(--muted); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; font-weight:800; } .backend-nav-link { display:flex; align-items:center; gap:12px; min-height:44px; padding:0 14px; border-radius:12px; color:var(--ink); background:transparent; border:1px solid transparent; font-weight:700; } .backend-nav-icon { width:20px; text-align:center; color:var(--green-800); font-size:1rem; } .backend-nav-label { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .backend-nav-link:hover, .backend-nav-link-active { background:#eef8f3; border-color:var(--green-100); color:var(--green-900); } .backend-sidebar-footer { margin-top:auto; display:grid; gap:10px; padding-top:16px; border-top:1px solid var(--line); } .backend-sidebar-action { display:flex; align-items:center; justify-content:flex-start; min-height:40px; padding:0; border:0; background:transparent; color:var(--ink); font:inherit; font-weight:700; cursor:pointer; } .backend-topbar { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:12px 22px 0; position:sticky; top:0; z-index:20; background:linear-gradient(180deg,#f8fbf9 0,#f8fbf9cc 72%,rgb(248 251 249 / 0) 100%); backdrop-filter:blur(8px); } .backend-topbar-left { display:grid; gap:1px; min-width:0; } .backend-topbar-eyebrow { font-size:.62rem; letter-spacing:.12em; } .backend-topbar-title { margin:0; font-size:1rem; line-height:1.15; letter-spacing:-.03em; } .backend-topbar-actions { display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:flex-end; } .backend-topbar-icon { display:grid; place-items:center; width:30px; height:30px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--green-900); font-size:.92rem; cursor:pointer; } .backend-topbar-mode, .backend-topbar-balance, .backend-topbar-user { display:inline-flex; align-items:center; min-height:30px; padding:0 10px; border-radius:999px; font-size:.8rem; font-weight:700; white-space:nowrap; } .backend-topbar-mode { background:#eef8f3; color:var(--green-900); } .backend-topbar-balance { background:#eef8f3; color:var(--green-900); } .backend-topbar-user { background:#fff; border:1px solid var(--line); color:var(--ink); } .backend-topbar-logout { margin:0; } .backend-topbar-logout-button { min-height:30px; padding:0 10px; font-size:.76rem; } .backend-content { padding:20px 22px 72px; } .dashboard-hero { display:grid; gap:18px; align-items:start; grid-template-columns:minmax(0,1fr) auto; padding:24px; } .dashboard-hero-title { margin:10px 0 12px; font-size:clamp(2rem,4vw,3.2rem); line-height:1.05; letter-spacing:-.05em; } .dashboard-hero-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; align-content:start; } .dashboard-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:22px; } .dashboard-kpi-card { padding:22px; display:grid; gap:8px; } .dashboard-kpi-label { color:var(--muted); font-size:.84rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; } .dashboard-kpi-value { font-size:2rem; line-height:1.05; font-weight:800; color:var(--green-900); letter-spacing:-.04em; } .dashboard-kpi-note { color:var(--muted); font-size:.92rem; } .dashboard-layout { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(320px,.92fr); gap:18px; margin-top:22px; align-items:start; } .dashboard-main-column, .dashboard-side-column { display:grid; gap:18px; } .dashboard-side-column { position:sticky; top:24px; align-self:start; } .dashboard-rail-panel { position:relative; overflow:hidden; } .dashboard-rail-panel::before { content:''; position:absolute; inset:0 auto 0 0; width:4px; background:linear-gradient(180deg,var(--green-500),var(--green-900)); } .dashboard-rail-actions { min-height:280px; } .dashboard-rail-summary { background:linear-gradient(180deg,#ffffff 0,#f7fbf9 100%); } .dashboard-panel { padding:24px; } .dashboard-panel-header { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; } .dashboard-panel-header h2 { margin:0; font-size:1.15rem; } .dashboard-panel-subtitle { margin:4px 0 0; color:var(--muted); font-size:.88rem; } .dashboard-form { display:grid; gap:12px; } .dashboard-key-table { table-layout:fixed; } .dashboard-key-table th:nth-child(1), .dashboard-key-table td:nth-child(1) { width:16%; } .dashboard-key-table th:nth-child(2), .dashboard-key-table td:nth-child(2) { width:10%; } .dashboard-key-table th:nth-child(3), .dashboard-key-table td:nth-child(3) { width:260px; } .dashboard-key-table th:nth-child(4), .dashboard-key-table td:nth-child(4) { width:96px; } .dashboard-key-table th:nth-child(5), .dashboard-key-table td:nth-child(5) { width:96px; } .dashboard-key-table th:nth-child(6), .dashboard-key-table td:nth-child(6) { width:96px; } .dashboard-key-table th:nth-child(7), .dashboard-key-table td:nth-child(7) { width:180px; } .dashboard-key-table th:nth-child(8), .dashboard-key-table td:nth-child(8) { width:180px; } .dashboard-key-table .actions-cell { width:110px; } .dashboard-key-table td:nth-child(3) > div { min-width:0; } .dashboard-key-table td:nth-child(3) [data-secret-display] { min-width:0; flex:1 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:normal; overflow-wrap:normal; } .dashboard-key-table td:nth-child(3) [data-reveal-secret], .dashboard-key-table td:nth-child(3) [data-copy-secret] { flex:0 0 auto; } .dashboard-action-list { display:grid; gap:10px; } .dashboard-action-item { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:12px; align-items:center; padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:#fbfefd; color:var(--ink); box-shadow:0 4px 12px rgb(20 70 50 / .03); }
.dashboard-action-item:hover { border-color:var(--green-300); background:#f3fbf7; }
.dashboard-action-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:14px; font-size:1.05rem; }
.dashboard-action-icon-key { background:#d8faf2; color:#0f9f6f; }
.dashboard-action-icon-chart { background:#dcfce7; color:#16a34a; }
.dashboard-action-icon-gift { background:#fef3c7; color:#ea580c; }
.dashboard-action-copy { display:grid; gap:2px; min-width:0; }
.dashboard-action-copy strong { font-size:.98rem; }
.dashboard-action-copy span { color:var(--muted); font-size:.84rem; }
.dashboard-action-arrow { color:#a7b3ae; font-size:1.5rem; line-height:1; }
.dashboard-status-panel { padding-bottom:18px; }
.dashboard-status-grid { display:grid; gap:8px; }
.dashboard-status-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:#f8fcfa; }
.dashboard-status-row span { color:var(--muted); font-size:.88rem; }
.dashboard-status-row strong { color:var(--green-900); font-size:.95rem; }
.dashboard-wide-panel { margin-top:22px; } .models-hero { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:18px; align-items:stretch; } .models-hero-copy { display:grid; gap:10px; } .models-hero-title { margin:0; font-size:clamp(2rem,4vw,3rem); line-height:1.04; letter-spacing:-.05em; } .models-hero-meta { display:flex; flex-wrap:wrap; gap:10px; } .models-hero-summary { display:grid; align-content:space-between; gap:12px; padding:20px; border-radius:18px; background:linear-gradient(180deg,#f7fbf9 0,#ecf7f1 100%); border:1px solid var(--line); } .models-hero-stamp { width:max-content; padding:6px 10px; border-radius:999px; background:#fff; color:var(--green-900); font-size:.75rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; } .models-hero-summary strong { font-size:1.25rem; line-height:1.2; } .models-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-top:18px; padding:18px 20px; } .models-toolbar-search { display:flex; align-items:center; gap:10px; min-width:min(560px,100%); } .models-search-box { display:flex; align-items:center; gap:10px; width:100%; padding:0 14px; border:1px solid var(--line); border-radius:12px; background:#fff; } .models-search-box input { border:0; padding:0; min-height:42px; outline:none; box-shadow:none; } .models-search-icon { color:var(--muted); font-size:1rem; } .models-refresh { width:42px; padding:0; flex:0 0 auto; } .models-layout { display:grid; grid-template-columns:270px minmax(0,1fr); gap:18px; margin-top:18px; align-items:start; } .models-sidebar { display:grid; gap:18px; padding:20px; position:sticky; top:96px; } .models-sidebar-search { width:100%; margin-bottom:2px; } .models-toolbar { display:none; } .models-filter-group { display:grid; gap:10px; } .models-filter-title { font-size:.8rem; font-weight:800; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; } .models-chip-list { display:flex; flex-wrap:wrap; gap:10px; } .models-chip, .models-check-item, .models-radio-item { display:inline-flex; align-items:center; gap:10px; min-height:38px; padding:0 12px; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); font:inherit; font-weight:700; cursor:pointer; } .models-chip-active { background:#eef8f3; border-color:var(--green-100); color:var(--green-900); } .models-filter-list { display:grid; gap:8px; } .models-check-item input, .models-radio-item input { margin:0; width:16px; height:16px; accent-color:var(--green-800); } .models-clear-button { width:100%; margin-top:2px; } .models-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; } .model-card { display:grid; gap:10px; padding:16px; } .model-card-top, .model-card-footer, .model-card-stats, .model-card-prices { display:flex; justify-content:space-between; gap:8px; } .model-card-top { align-items:center; } .model-card-status { color:var(--green-900); font-size:.78rem; font-weight:800; padding:4px 8px; border-radius:999px; background:#eef8f3; } .model-card h2 { font-size:1.05rem; line-height:1.16; } .model-card-name { display:flex; align-items:center; gap:6px; min-width:0; } .model-card-name span { min-width:0; overflow-wrap:anywhere; } .model-copy-button { display:inline-grid; place-items:center; flex:0 0 auto; width:22px; height:22px; padding:0; border:0; background:transparent; color:var(--muted); font:inherit; line-height:1; cursor:pointer; } .model-copy-button:hover, .model-copy-button:focus-visible { color:var(--green-800); outline:none; } .model-copy-notice { position:fixed; left:50%; bottom:28px; z-index:1000; padding:9px 16px; border-radius:9px; color:#fff; background:var(--green-900); box-shadow:0 8px 20px rgb(6 78 59 / .22); font-size:.88rem; font-weight:700; opacity:0; transform:translate(-50%,10px); pointer-events:none; transition:opacity .18s ease,transform .18s ease; } .model-copy-notice.is-visible { opacity:1; transform:translate(-50%,0); } .model-card-subtitle { color:var(--muted); font-size:.86rem; } .model-card-description { color:var(--muted); min-height:34px; font-size:.9rem; } .model-card-meta { display:flex; justify-content:space-between; gap:8px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:#fbfefd; } .model-card-meta span, .model-card-stats span, .model-card-prices span, .model-card-time { color:var(--muted); font-size:.76rem; } .model-card-meta strong, .model-card-stats strong, .model-card-prices strong { font-size:.88rem; } .model-card-tags { display:flex; flex-wrap:wrap; gap:6px; } .models-tag { display:inline-flex; align-items:center; min-height:24px; padding:0 8px; border-radius:999px; background:#edf8f3; color:var(--green-900); font-size:.74rem; font-weight:700; } .model-card-stats, .model-card-prices { padding-top:0; } .model-card-stats > div, .model-card-prices > div { display:grid; gap:3px; min-width:0; flex:1 1 0; } .model-card-footer { align-items:center; padding-top:4px; border-top:1px solid var(--line); } .models-empty-state { grid-column:1 / -1; text-align:center; } @media (max-width:1100px) { .backend-shell { grid-template-columns:1fr; } .backend-sidebar { position:relative; height:auto; min-height:0; } .dashboard-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .dashboard-layout { grid-template-columns:1fr; } .models-hero, .models-layout { grid-template-columns:1fr; } .models-sidebar { position:relative; top:auto; } .models-toolbar { flex-direction:column; align-items:stretch; } .models-toolbar-search { min-width:0; width:100%; } .models-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:720px) { .navlinks a:not(.button) { display:none; } .features, .backend-grid-2, .dashboard-kpis { grid-template-columns:1fr; } .backend-span-2 { grid-column:auto; } .hero { padding-top:52px; } .table { display:block; overflow-x:auto; white-space:nowrap; } .backend-topbar, .backend-content, .backend-page { padding-left:16px; padding-right:16px; } .backend-topbar { padding-top:18px; align-items:flex-start; flex-direction:column; } .backend-page-actions, .backend-topbar-actions { justify-content:flex-start; } .backend-page-title { font-size:2rem; } .backend-sidebar { padding:18px 14px; } .dashboard-panel, .dashboard-kpi-card { padding:18px; } .dashboard-action-item { grid-template-columns:38px minmax(0,1fr) auto; padding:12px 12px; } .dashboard-action-icon { width:38px; height:38px; border-radius:12px; } .models-toolbar { padding:16px; } .models-sidebar { padding:16px; } .model-card { padding:18px; } .model-card-top, .model-card-footer, .model-card-stats, .model-card-prices { flex-direction:column; align-items:flex-start; } }
.developer-docs-public { width:min(1280px,100%); padding:0; background:transparent; border:0; box-shadow:none; }
.developer-docs-portal { display:grid; gap:18px; }
.developer-docs-banner { display:grid; gap:18px; padding:24px; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 6px 18px rgb(20 70 50 / .04); }
.developer-docs-banner h1 { margin:0 0 8px; font-size:2rem; letter-spacing:-.04em; }
.developer-docs-banner p { margin:0; color:var(--muted); }
.developer-docs-notice { display:grid; gap:3px; padding:10px 12px; border:1px solid #f6d37b; border-radius:10px; background:#fffbeb; color:#92400e; font-size:.86rem; }
.developer-docs-notice span { line-height:1.5; }
.developer-docs-portal-layout { display:grid; grid-template-columns:280px minmax(0,1fr); gap:18px; align-items:start; }
.developer-docs-companies { display:grid; gap:16px; position:sticky; top:96px; padding:20px 16px; }
.developer-docs-companies-header { display:flex; align-items:center; justify-content:space-between; }
.developer-docs-refresh { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--muted); font-size:1.2rem; cursor:pointer; }
.developer-docs-refresh:hover, .developer-docs-refresh:focus-visible { border-color:var(--green-500); color:var(--green-800); outline:none; }
.developer-docs-company-list { display:grid; gap:8px; }
.developer-docs-company { display:flex; justify-content:space-between; align-items:center; gap:8px; min-height:40px; padding:0 10px; border:1px solid var(--line); border-radius:9px; background:#fff; color:var(--muted); font:inherit; text-align:left; cursor:pointer; }
.developer-docs-company:hover, .developer-docs-company:focus-visible { border-color:var(--green-300); color:var(--green-900); outline:none; }
.developer-docs-company.is-active { border-color:var(--green-500); background:#effcf7; color:var(--green-900); }
.developer-docs-company-name { display:flex; align-items:center; gap:8px; min-width:0; }
.developer-docs-company-mark { display:inline-grid; place-items:center; width:22px; height:22px; flex:0 0 auto; border-radius:50%; background:#e9f8f1; color:var(--green-800); font-size:.72rem; font-weight:800; }
.developer-docs-company-count { padding:1px 6px; border-radius:6px; background:#f2f4f6; color:var(--muted); font-size:.76rem; }
.developer-docs-side-note { padding:12px; border:1px solid #cfe0ff; border-radius:9px; background:#eff6ff; color:#2354a5; font-size:.82rem; }
.developer-docs-main { display:grid; gap:18px; min-width:0; }
.developer-docs-provider { display:none; gap:18px; }
.developer-docs-provider.is-visible { display:grid; }
.developer-docs-provider-hero { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:20px; align-items:center; padding:20px; }
.developer-docs-provider-label { display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:var(--green-800); font-size:.78rem; font-weight:800; letter-spacing:.04em; }
.developer-docs-provider-label > span:last-child { color:var(--muted); font-weight:500; letter-spacing:0; }
.developer-docs-provider-hero h2 { margin:12px 0 8px; font-size:1.45rem; letter-spacing:-.035em; }
.developer-docs-provider-hero p { margin:0; color:var(--muted); }
.developer-docs-auth-box { display:grid; gap:7px; padding:14px; border:1px solid var(--line); border-radius:10px; background:#f8fafc; color:var(--muted); font-size:.8rem; }
.developer-docs-auth-box code { color:#087c7c; font-size:.78rem; overflow-wrap:anywhere; }
.developer-docs-auth-box small { line-height:1.35; }
.developer-docs-models-panel { padding:0; overflow:hidden; }
.developer-docs-models-panel h3 { margin:0; padding:18px 20px; font-size:1rem; border-bottom:1px solid var(--line); }
.developer-docs-table-wrap { overflow-x:auto; }
.developer-docs-model-table, .developer-docs-params-table { width:100%; border-collapse:collapse; }
.developer-docs-model-table th, .developer-docs-model-table td { padding:12px 20px; border-bottom:1px solid #edf0f2; text-align:left; white-space:nowrap; font-size:.84rem; }
.developer-docs-model-table th { color:var(--muted); background:#fafbfc; font-size:.76rem; font-weight:800; }
.developer-docs-model-table tr:last-child td { border-bottom:0; }
.developer-docs-model-table code { color:#087c7c; font-size:.78rem; } .developer-docs-model-table .model-copy-button { display:inline-grid; place-items:center; width:22px; height:22px; margin-left:6px; padding:0; border:0; background:transparent; color:var(--muted); font:inherit; line-height:1; cursor:pointer; vertical-align:middle; } .developer-docs-model-table .model-copy-button:hover, .developer-docs-model-table .model-copy-button:focus-visible { color:var(--green-800); outline:none; }
.developer-docs-type { display:inline-flex; padding:3px 7px; border-radius:6px; background:#f1f3f6; color:#53606c; }
.developer-docs-muted { color:var(--muted); }
.developer-docs-endpoint-card { padding:20px; }
.developer-docs-endpoint-head { display:flex; justify-content:space-between; gap:12px; align-items:center; border-bottom:1px solid var(--line); padding-bottom:14px; }
.developer-docs-endpoint-head > div { display:flex; align-items:center; gap:10px; }
.developer-docs-method { display:inline-flex; align-items:center; min-height:26px; padding:0 9px; border-radius:7px; background:#e8faf5; color:#087c68; font-size:.72rem; font-weight:800; }
.developer-docs-method-image { background:#fff5df; color:#a55d05; }
.developer-docs-copy-button, .developer-docs-code-title button { display:inline-flex; align-items:center; gap:6px; min-height:32px; padding:0 10px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--muted); font:inherit; font-size:.76rem; cursor:pointer; }
.developer-docs-copy-button:hover, .developer-docs-copy-button:focus-visible, .developer-docs-code-title button:hover, .developer-docs-code-title button:focus-visible { border-color:var(--green-300); color:var(--green-800); outline:none; }
.developer-docs-endpoint-card h2 { margin:14px 0 2px; font-size:1.1rem; }
.developer-docs-endpoint-card > p { margin:0 0 18px; color:var(--muted); }
.developer-docs-endpoint-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,1.08fr); gap:20px; }
.developer-docs-endpoint-grid h3 { margin:0 0 8px; font-size:.9rem; }
.developer-docs-params-table { border:1px solid var(--line); border-radius:9px; overflow:hidden; }
.developer-docs-params-table td { padding:9px 12px; border-bottom:1px solid #edf0f2; vertical-align:top; font-size:.8rem; }
.developer-docs-params-table tr:last-child td { border-bottom:0; }
.developer-docs-params-table td:first-child { width:36%; color:#25313b; white-space:nowrap; }
.developer-docs-params-table td:last-child { color:var(--muted); }
.developer-docs-params-table em { color:var(--danger); font-style:normal; }
.developer-docs-auth-line { margin:10px 0 0; color:var(--muted); font-size:.78rem; }
.developer-docs-code-column { min-width:0; }
.developer-docs-code-title { display:flex; justify-content:space-between; align-items:center; margin:0 0 6px; color:var(--muted); font-size:.78rem; }
.developer-docs-code-title button { border:0; min-height:24px; padding:0; }
.developer-docs-code-column pre { margin:0 0 12px; padding:15px; overflow:auto; border-radius:11px; background:#111827; color:#f3f4f6; font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; white-space:pre; }
.developer-docs-code-column code { color:inherit; }
.developer-docs-error-panel { padding:20px; }
.developer-docs-error-panel h2 { margin:0 0 6px; font-size:1rem; }
.developer-docs-error-panel p { margin:0; color:var(--muted); }
.developer-docs-empty, .developer-docs-empty-panel { color:var(--muted); }
.developer-docs-empty-panel { padding:24px; }
@media (max-width:1100px) { .developer-docs-portal-layout { grid-template-columns:1fr; } .developer-docs-companies { position:relative; top:auto; } .developer-docs-company-list { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:720px) { .developer-docs-provider-hero, .developer-docs-endpoint-grid { grid-template-columns:1fr; } .developer-docs-company-list { grid-template-columns:1fr; } .developer-docs-endpoint-head { align-items:flex-start; flex-direction:column; } .developer-docs-model-table th, .developer-docs-model-table td { padding-left:12px; padding-right:12px; } }
.images-page { display:grid; gap:20px; }
.images-workspace { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr); gap:18px; align-items:start; }
.images-form-card, .images-capability-card, .images-api-card, .images-results-card, .images-empty-state { padding:22px; }
.images-form-card h2, .images-capability-card h2, .images-api-card h2, .images-results-card h2, .images-empty-state h2 { margin:0; font-size:1.05rem; }
.images-section-heading, .images-results-header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.images-section-heading > div, .images-results-header > div { display:flex; align-items:center; gap:9px; }
.images-step { display:grid; place-items:center; width:25px; height:25px; border-radius:8px; background:#e8f8f0; color:var(--green-800); font-size:.78rem; font-weight:800; }
.images-form { display:grid; gap:14px; margin-top:20px; }
.images-form .field { margin:0; }
.images-form .field small { color:var(--muted); font-size:.78rem; font-weight:500; }
.images-form textarea { min-height:150px; resize:vertical; }
.images-dynamic-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.images-parameter { margin:0; }
.images-form-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding-top:4px; }
.images-form-actions .button:disabled { cursor:wait; opacity:.65; }
.images-form-status { color:var(--muted); font-size:.84rem; }
.images-side-column { display:grid; gap:18px; position:sticky; top:96px; }
.images-model-details { display:grid; gap:8px; margin-top:18px; }
.images-model-details > div { display:flex; justify-content:space-between; gap:14px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:#fbfefd; }
.images-model-details span { color:var(--muted); font-size:.82rem; }
.images-model-details strong { min-width:0; text-align:right; color:var(--green-900); font-size:.84rem; overflow-wrap:anywhere; }
.images-model-default { color:var(--muted); font-size:.86rem; }
.images-capability-note, .images-api-card p { margin:14px 0 0; color:var(--muted); font-size:.84rem; }
.images-api-card code { display:block; margin-top:10px; color:#087c7c; font-size:.82rem; }
.images-api-card pre { max-height:260px; margin:12px 0 0; padding:13px; overflow:auto; border-radius:10px; background:#111827; color:#e5e7eb; font:11px/1.5 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
.images-results-card { display:grid; gap:16px; }
.images-clear-button { min-height:34px; padding:0 12px; font-size:.78rem; }
.images-result-message { display:none; padding:11px 13px; border:1px solid #fecaca; border-radius:10px; background:#fff1f2; color:#b42318; font-size:.88rem; }
.images-result-message.is-visible { display:block; }
.images-results-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.images-results-empty { display:grid; place-items:center; min-height:180px; grid-column:1 / -1; padding:24px; border:1px dashed var(--line); border-radius:12px; color:var(--muted); text-align:center; }
.images-result-item { display:grid; place-items:center; min-height:180px; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#f8fcfa; color:var(--muted); font-size:.84rem; }
.images-result-item img { display:block; width:100%; max-height:520px; object-fit:contain; background:#fff; }
.images-empty-state { display:grid; gap:12px; max-width:620px; }
.images-empty-state p { margin:0; color:var(--muted); }
.images-empty-state .button { width:max-content; }
@media (max-width:1100px) { .images-workspace { grid-template-columns:1fr; } .images-side-column { position:relative; top:auto; grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:720px) { .images-dynamic-fields, .images-side-column { grid-template-columns:1fr; } .images-form-card, .images-capability-card, .images-api-card, .images-results-card, .images-empty-state { padding:18px; } .images-model-details > div { align-items:flex-start; flex-direction:column; gap:3px; } .images-model-details strong { text-align:left; } }

.images-studio { display:grid; min-height:calc(100vh - 150px); gap:18px; padding-bottom:12px; }
.images-studio-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.images-studio-header h1 { margin:6px 0 8px; font-size:2rem; letter-spacing:-.04em; }
.images-studio-header p { margin:0; color:var(--muted); }
.images-studio-header .button { flex:none; }
.images-studio-tabs { display:flex; width:max-content; gap:4px; padding:4px; border:1px solid #d7eae3; border-radius:12px; background:#edf8f4; }
.images-studio-tab { min-height:34px; padding:0 15px; border:0; border-radius:8px; background:transparent; color:var(--muted); font:700 .84rem/1 inherit; cursor:pointer; }
.images-studio-tab.is-active { background:#fff; color:var(--green-900); box-shadow:0 1px 3px #10513b18; }
.images-studio-tab:disabled { cursor:not-allowed; opacity:.48; }
.images-studio-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:12px; border:1px solid #d9ebe5; border-radius:16px; background:#fff; box-shadow:0 8px 28px #0f3f2c0b; }
.images-studio-select { display:flex; align-items:center; gap:7px; min-width:210px; padding:0 10px; border:1px solid #d8e7e1; border-radius:10px; background:#f8fcfa; }
.images-studio-select span { flex:none; color:var(--muted); font-size:.76rem; font-weight:750; }
.images-studio-select select { width:100%; min-height:37px; padding:0; border:0; background:transparent; color:var(--ink); font:700 .82rem/1 inherit; outline:0; }
.images-studio-search { display:flex; align-items:center; gap:7px; min-width:180px; flex:1; padding:0 11px; border:1px solid #d8e7e1; border-radius:10px; background:#fff; color:var(--muted); }
.images-studio-search input { width:100%; min-height:37px; padding:0; border:0; outline:0; background:transparent; color:var(--ink); }
.images-studio-counts { display:flex; align-items:center; gap:14px; margin-left:auto; color:var(--muted); font-size:.78rem; white-space:nowrap; }
.images-studio-counts b { color:var(--green-900); }
.images-studio-canvas { position:relative; display:grid; min-height:430px; overflow:hidden; border:1px solid #d9ebe5; border-radius:20px; background:linear-gradient(135deg,#f7fffc 0%,#effbf6 48%,#f5fbff 100%); box-shadow:inset 0 0 0 1px #ffffffa8; }
.images-studio-canvas::before { position:absolute; inset:0; content:""; opacity:.35; background-image:radial-gradient(#7ac9ad 1px,transparent 1px); background-size:24px 24px; pointer-events:none; }
.images-studio-results { position:relative; z-index:1; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); align-content:start; gap:14px; padding:20px; }
.images-studio-welcome { display:grid; place-items:center; align-content:center; grid-column:1 / -1; min-height:360px; padding:36px; text-align:center; color:var(--muted); }
.images-studio-welcome-mark { display:grid; place-items:center; width:58px; height:58px; margin-bottom:16px; border:1px solid #bde8d7; border-radius:20px; background:#ffffffcc; color:var(--green-700); font-size:1.65rem; box-shadow:0 8px 24px #0c60411a; }
.images-studio-welcome h2 { margin:0; color:var(--green-950); font-size:1.1rem; }
.images-studio-welcome p { max-width:360px; margin:8px 0 0; font-size:.88rem; }
.images-studio-result { display:grid; place-items:center; min-height:220px; overflow:hidden; border:1px solid #d9ebe5; border-radius:15px; background:#fff; color:var(--muted); font-size:.84rem; box-shadow:0 8px 22px #0d412514; }
.images-studio-result img { display:block; width:100%; min-height:220px; max-height:580px; object-fit:contain; background:#fff; }
.images-studio-error { position:relative; z-index:2; display:none; margin:14px 14px 0; padding:11px 13px; border:1px solid #fecaca; border-radius:10px; background:#fff1f2; color:#b42318; font-size:.86rem; }
.images-studio-error.is-visible { display:block; }
.images-studio-composer { position:sticky; bottom:18px; z-index:4; display:grid; gap:12px; padding:14px; border:1px solid #bfe5d6; border-radius:19px; background:#fffffff2; box-shadow:0 18px 42px #10483122; backdrop-filter:blur(14px); }
.images-studio-composer-top { position:relative; }
.images-studio-composer textarea { display:block; width:100%; min-height:78px; padding:7px 42px 8px 2px; border:0; outline:0; resize:vertical; background:transparent; color:var(--ink); font:500 .98rem/1.6 inherit; }
.images-studio-composer textarea::placeholder { color:#82a399; }
.images-studio-prompt-meta { position:absolute; right:4px; bottom:7px; color:#7b998f; font-size:.72rem; }
.images-studio-reference-note { padding:9px 11px; border-radius:9px; background:#fffaeb; color:#8e5a00; font-size:.8rem; }
.images-studio-upload { display:grid; gap:5px; margin-top:8px; padding:18px; border:1px dashed #9bcbbb; border-radius:12px; background:#f8fcfa; color:var(--muted); text-align:center; cursor:pointer; transition:border-color .15s, background .15s; }
.images-studio-upload:hover, .images-studio-upload.is-dragging { border-color:var(--green-600); background:#eefaf4; }
.images-studio-upload strong { color:var(--green-950); font-size:.86rem; }
.images-studio-upload span { font-size:.75rem; }
.images-studio-chat { display:grid; gap:12px; min-height:520px; }
.images-studio-chat[hidden] { display:none; }
.images-studio-chat-toolbar { display:flex; flex-wrap:wrap; gap:10px; }
.images-studio-chat-messages { display:grid; align-content:start; gap:10px; min-height:360px; max-height:560px; overflow:auto; padding:16px; border:1px solid #d9ebe5; border-radius:15px; background:#fbfefd; }
.images-studio-chat-message { max-width:82%; padding:10px 13px; border-radius:12px; box-shadow:0 5px 15px #0d41250d; }
.images-studio-chat-message.is-user { justify-self:end; background:#dff4e9; }
.images-studio-chat-message.is-assistant { justify-self:start; background:#fff; border:1px solid #d9ebe5; }
.images-studio-chat-message strong { display:block; color:var(--green-950); font-size:.75rem; }
.images-studio-chat-message p { margin:5px 0 0; color:var(--ink); font-size:.88rem; line-height:1.6; overflow-wrap:anywhere; }
.images-studio-chat-composer { display:grid; gap:10px; padding:14px; border:1px solid #bfe5d6; border-radius:15px; background:#fffffff2; }
.images-studio-chat-composer textarea { display:block; width:100%; min-height:70px; padding:8px; border:1px solid #d7e7e1; border-radius:9px; outline:0; resize:vertical; background:#fff; color:var(--ink); font:500 .92rem/1.5 inherit; }
.images-studio-chat-composer .images-studio-actions { justify-content:flex-end; }
.images-studio-chat-attachment { display:grid; gap:8px; padding:12px; border:1px dashed #b8d9cd; border-radius:10px; background:#f8fcfa; cursor:pointer; }
.images-studio-chat-attachment:hover, .images-studio-chat-attachment.is-dragging { border-color:var(--green-600); background:#eefaf4; }
.images-studio-chat-attachment-copy { display:grid; gap:3px; }
.images-studio-chat-attachment-copy strong { color:var(--green-950); font-size:.82rem; }
.images-studio-chat-attachment-copy span, .images-studio-chat-image-preview span { color:var(--muted); font-size:.75rem; }
.images-studio-chat-image-preview { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.images-studio-chat-image-preview img { width:72px; height:72px; border:1px solid #d9ebe5; border-radius:8px; object-fit:contain; background:#fff; }
.images-studio-chat-image-placeholder { display:grid; place-items:center; width:72px; height:72px; border:1px dashed #b8d9cd; border-radius:8px; color:var(--muted); font-size:.72rem; background:#f8fcfa; }
.images-studio-chat-image-preview .button { min-height:28px; padding:0 9px; font-size:.74rem; }
.images-studio-chat-message-image { display:block; width:180px; max-width:100%; max-height:180px; margin-top:6px; border-radius:8px; object-fit:contain; background:#fff; }
#chat-image-status { display:block; }
#image-reference-preview { width:72px; height:72px; border:1px solid #d9ebe5; border-radius:8px; object-fit:contain; background:#fff; }
#image-reference-remove { margin-top:8px; min-height:30px; padding:0 10px; font-size:.76rem; }
.images-studio-composer-bottom { display:flex; align-items:end; justify-content:space-between; gap:14px; padding-top:12px; border-top:1px solid #e0eee9; }
.images-studio-parameters { display:flex; flex-wrap:wrap; gap:8px; }
.images-studio-parameters label { display:flex; align-items:center; gap:5px; min-height:32px; padding:0 8px; border:1px solid #d7e7e1; border-radius:8px; background:#f8fcfa; }
.images-studio-parameters span { color:var(--muted); font-size:.7rem; font-weight:750; }
.images-studio-parameters select, .images-studio-parameters input { width:auto; max-width:95px; min-height:28px; padding:0; border:0; outline:0; background:transparent; color:var(--green-950); font:700 .76rem/1 inherit; }
.images-studio-actions { display:flex; align-items:center; gap:12px; }
.images-studio-status { color:var(--muted); font-size:.78rem; white-space:nowrap; }
.images-studio-submit { min-height:40px; padding:0 15px; white-space:nowrap; }
.images-studio-empty { display:grid; justify-items:start; gap:10px; padding:28px; }
.images-studio-empty h2, .images-studio-empty p { margin:0; }
.images-studio-empty p { color:var(--muted); }
@media (max-width:880px) { .images-studio-canvas { min-height:360px; } .images-studio-composer-bottom { align-items:stretch; flex-direction:column; } .images-studio-actions { justify-content:space-between; } }
@media (max-width:620px) { .images-studio { min-height:calc(100vh - 124px); } .images-studio-header { align-items:flex-start; flex-direction:column; } .images-studio-toolbar { align-items:stretch; flex-direction:column; } .images-studio-select, .images-studio-search { width:100%; min-width:0; } .images-studio-counts { margin-left:0; } .images-studio-canvas { min-height:300px; border-radius:16px; } .images-studio-results { grid-template-columns:1fr; padding:12px; } .images-studio-welcome { min-height:270px; } .images-studio-composer { bottom:8px; border-radius:15px; padding:11px; } .images-studio-parameters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .images-studio-parameters label { min-width:0; } .images-studio-parameters select, .images-studio-parameters input { min-width:0; width:100%; } }