
:root {
    --burgundy: #322e29;
    --burgundy-2: #5b534a;
    --burgundy-dark: #221f1c;
    --gold: #b39a6d;
    --gold-light: #f7f3ec;
    --gold-hover: #9c8357;
    --ink: #181715;
    --cream: #f2eee6;
    --paper: #fcfaf6;
    --paper-card: #ffffff;
    --muted: #746f68;
    --muted-light: #9a948c;
    --line: #d8d0c4;
    --line-light: #ece7de;
    --sidebar-bg: #f7f3ed;
    --sidebar-text: #342f2a;
    --sidebar-hover: #eee7de;
    --sidebar-active: #ffffff;
    --success: #1f7a4d;
    --success-bg: #edf7f1;
    --warning: #b36b00;
    --warning-bg: #fcf5eb;
    --danger: #b3261e;
    --danger-bg: #fdf0ed;
    --info: #2b5c8f;
    --info-bg: #edf4fa;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --shadow-sm: 0 1px 3px rgba(24, 23, 21, 0.04);
    --shadow-md: 0 4px 14px rgba(24, 23, 21, 0.06);
    --shadow-lg: 0 12px 32px rgba(24, 23, 21, 0.08);
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    background-color: var(--paper);
    color: var(--ink);
    font-family:var(--ui-font);
    -webkit-font-smoothing: antialiased;
    font-size: 14px;
    line-height: 1.5;
}

/* Blazor toggles this element inline only when a fatal circuit error occurs. */
#blazor-error-ui { display: none; position: fixed; inset-inline: 0; bottom: 0; z-index: 2000; padding: 10px 44px 10px 16px; background: #fff4e5; color: #6d4510; border-top: 1px solid #e4c48f; font-size: 12px; }
#blazor-error-ui .dismiss { position: absolute; inset-inline-end: 14px; cursor: pointer; }

[dir="rtl"] body, html[lang="ar"] body {
    font-family:var(--ui-font);
}

code, pre, .font-mono {
    font-family: 'IBM Plex Mono', 'Courier New', monospace;
    direction: ltr !important;
    text-align: left !important;
}

/* Studio Layout */
.studio-shell {
    display: flex;
    min-height: 100vh;
    background-color: var(--paper);
}

.studio-sidebar {
    width: 270px;
    background: var(--sidebar-bg);
    color: var(--sidebar-text);
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    border-inline-end: 1px solid #e4ddd3;
    box-shadow: 8px 0 28px rgba(61, 49, 38, .025);
    z-index: 100;
    transition: width 0.2s ease;
}

.sidebar-brand {
    padding: 24px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    border-bottom: 1px solid #e5ddd2;
    background: rgba(255,255,255,.58);
}

.sidebar-brand img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    border-radius: 0;
    filter: drop-shadow(0 3px 8px rgba(108,20,56,.13));
}

.brand-text h1 {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #302b27;
    text-transform: uppercase;
}

.brand-text span {
    font-size: 9px;
    color: #8c7045;
    letter-spacing: 0.14em;
    display: block;
    font-weight: 600;
    text-transform: uppercase;
}

.sidebar-nav {
    flex: 1;
    padding: 16px 12px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.nav-group-label {
    font-size: 9.5px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #9a8e80;
    padding: 0 10px 6px;
    font-weight: 700;
}

.sidebar-links {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sidebar-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    color: #5d554d;
    text-decoration: none;
    border-radius: 10px;
    font-size: 12.5px;
    font-weight: 500;
    transition: all 0.15s ease;
}

.sidebar-link i {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    text-align: center;
    color: #826d4d;
    border: 1px solid transparent;
    border-radius: 9px;
    background: rgba(255,255,255,.68);
    opacity: 1;
    transition: inherit;
}

.studio-icon { width: 17px; height: 17px; display: block; }

.sidebar-link:hover {
    background: var(--sidebar-hover);
    color: #2c2723;
}

.sidebar-link:hover i { background: rgba(255,255,255,.7); color: #6e193b; }

.sidebar-link.active {
    background: var(--sidebar-active);
    color: #271f1b;
    font-weight: 600;
    border-inline-start: 3px solid #7d173d;
    box-shadow: 0 4px 14px rgba(70,55,43,.07);
}

.sidebar-link.active i { background: #7d173d; border-color: #7d173d; color: #fff; box-shadow: 0 4px 12px rgba(125,23,61,.18); }

.sidebar-footer {
    padding: 16px 14px;
    border-top: 1px solid #e3dbd0;
    background: #f0e9df;
}

.wallet-pill {
    background: rgba(255,255,255,.64);
    border: 1px solid #d8cbb8;
    border-radius: var(--radius-md);
    padding: 10px 14px;
    margin-bottom: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wallet-pill span {
    font-size: 10.5px;
    color: #756a5f;
}

.wallet-pill strong {
    font-size: 14px;
    color: #6e193b;
    font-weight: 700;
}

.user-snippet {
    display: flex;
    align-items: center;
    gap: 10px;
}

.user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #7d173d;
    color: #ffffff;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 700;
}

.user-info {
    flex: 1;
    min-width: 0;
}

.user-info strong {
    display: block;
    font-size: 12px;
    color: #302a26;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.user-info span {
    display: block;
    font-size: 10px;
    color: #8a7f74;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Main Studio Canvas */
.studio-canvas {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--paper);
}

.studio-header {
    height: 64px;
    background: var(--paper-card);
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 28px;
    position: sticky;
    top: 0;
    z-index: 90;
}

.header-left {
    display: flex;
    align-items: center;
    gap: 16px;
}

.header-select {
    padding: 6px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--paper);
    color: var(--ink);
    font-size: 12px;
    font-weight: 600;
    outline: none;
    cursor: pointer;
}

.header-select:focus {
    border-color: var(--gold);
}

.header-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.badge-mode {
    background: var(--cream);
    border: 1px solid var(--line);
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--burgundy);
}

.btn-lang {
    background: var(--paper);
    border: 1px solid var(--line);
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    font-size: 11.5px;
    font-weight: 700;
    color: var(--ink);
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-lang:hover {
    background: var(--cream);
    border-color: var(--gold);
}

.studio-content {
    flex: 1;
    padding: 28px;
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
}

/* Page Headers */
.page-title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line-light);
}

.page-title-row h2 {
    font-size: 24px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--ink);
}

.page-title-row p {
    font-size: 13px;
    color: var(--muted);
    margin-top: 4px;
}

.page-actions {
    display: flex;
    gap: 10px;
}

/* Primary UI Elements */
.btn-primary {
    background: linear-gradient(135deg, #322e29 0%, #5b534a 100%);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: var(--radius-sm);
    padding: 8px 18px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: var(--shadow-sm);
    transition: all 0.2s ease;
    text-decoration: none;
    line-height: 1.25;
}

.btn-primary:hover {
    background: #1c1b18;
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.btn-secondary {
    background: var(--paper-card);
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 8px 16px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s ease;
    text-decoration: none;
    line-height: 1.25;
}

a.btn-primary:any-link,
a.btn-secondary:any-link,
a.btn-gold:any-link {
    text-decoration: none;
}

.studio-welcome__actions > a {
    justify-content: center;
    min-height: 40px;
    box-sizing: border-box;
}

.btn-secondary:hover {
    background: var(--cream);
    border-color: var(--gold);
}

.btn-gold {
    background: var(--gold);
    color: #ffffff;
    border: 0;
    border-radius: var(--radius-sm);
    padding: 8px 18px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.btn-gold:hover {
    background: var(--gold-hover);
}

/* Cards & Metric Cards */
.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

@media(max-width: 1100px) {
    .metric-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

.card {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    padding: 20px;
    box-shadow: var(--shadow-sm);
}

.metric-card-studio {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    padding: 20px;
    position: relative;
    box-shadow: var(--shadow-sm);
}

.metric-card-studio span.metric-label {
    font-size: 11px;
    font-weight: 600;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: block;
    margin-bottom: 8px;
}

.metric-card-studio strong.metric-value {
    font-size: 26px;
    font-weight: 700;
    color: var(--ink);
    display: block;
    letter-spacing: -0.02em;
    margin-bottom: 6px;
}

.metric-sub {
    font-size: 11px;
    color: var(--muted-light);
    display: flex;
    align-items: center;
    gap: 6px;
}

.metric-sub.positive {
    color: var(--success);
}

.metric-sub.negative {
    color: var(--danger);
}

/* Tables */
.table-container {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.studio-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12.5px;
    text-align: start;
}

.studio-table th {
    background: var(--cream);
    padding: 12px 16px;
    font-weight: 700;
    color: var(--burgundy);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-bottom: 1px solid var(--line);
}

.studio-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--line-light);
    color: var(--ink);
    vertical-align: middle;
}

.studio-table tr:hover td {
    background: #faf8f4;
}

.studio-table tr:last-child td {
    border-bottom: 0;
}

/* Badges */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    border-radius: 20px;
    font-size: 10.5px;
    font-weight: 600;
}

.badge-success {
    background: var(--success-bg);
    color: var(--success);
    border: 1px solid rgba(31, 122, 77, 0.2);
}

.badge-warning {
    background: var(--warning-bg);
    color: var(--warning);
    border: 1px solid rgba(179, 107, 0, 0.2);
}

.badge-danger {
    background: var(--danger-bg);
    color: var(--danger);
    border: 1px solid rgba(179, 38, 30, 0.2);
}

.badge-neutral {
    background: var(--cream);
    color: var(--muted);
    border: 1px solid var(--line);
}

.badge-gold {
    background: rgba(179, 154, 109, 0.12);
    color: var(--burgundy);
    border: 1px solid rgba(179, 154, 109, 0.3);
}

/* AI Playground Layout */
.playground-shell {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 20px;
    min-height: calc(100vh - 180px);
}

.playground-sidebar {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.playground-main {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.chat-history {
    flex: 1;
    padding: 24px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 18px;
    max-height: 580px;
}

.chat-bubble {
    padding: 14px 18px;
    border-radius: var(--radius-md);
    max-width: 80%;
    font-size: 13.5px;
    line-height: 1.6;
}

.chat-bubble.user {
    align-self: flex-end;
    background: var(--burgundy);
    color: #ffffff;
    border-bottom-right-radius: 2px;
}

[dir="rtl"] .chat-bubble.user {
    border-bottom-right-radius: var(--radius-md);
    border-bottom-left-radius: 2px;
}

.chat-bubble.assistant {
    align-self: flex-start;
    background: var(--cream);
    color: var(--ink);
    border: 1px solid var(--line);
    border-bottom-left-radius: 2px;
}

[dir="rtl"] .chat-bubble.assistant {
    border-bottom-left-radius: var(--radius-md);
    border-bottom-right-radius: 2px;
}

.chat-input-bar {
    padding: 16px;
    border-top: 1px solid var(--line);
    background: var(--paper);
    display: flex;
    gap: 12px;
    align-items: flex-end;
}

.chat-textarea {
    flex: 1;
    min-height: 52px;
    max-height: 140px;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--paper-card);
    font-size: 13px;
    resize: none;
    outline: none;
}

.chat-textarea:focus {
    border-color: var(--gold);
}

/* Compare Mode Columns */
.compare-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 14px;
    height: 100%;
}

.compare-column {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.compare-col-header {
    padding: 10px 14px;
    background: var(--cream);
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11.5px;
    font-weight: 700;
}

.compare-col-body {
    flex: 1;
    padding: 14px;
    overflow-y: auto;
    font-size: 12.5px;
    line-height: 1.6;
}

.compare-col-footer {
    padding: 8px 12px;
    background: var(--paper);
    border-top: 1px solid var(--line-light);
    font-size: 10.5px;
    color: var(--muted);
    display: flex;
    justify-content: space-between;
}

/* Modals */
.modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(24, 23, 21, 0.6);
    backdrop-filter: blur(6px);
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 20px;
}

.modal-card {
    background: var(--paper-card);
    border: 1px solid var(--line);
    border-top: 4px solid var(--gold);
    border-radius: var(--radius-md);
    width: min(640px, 100%);
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    box-shadow: var(--shadow-lg);
    padding: 32px;
}

.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 20px;
}

.modal-header h3 {
    font-size: 20px;
    font-weight: 600;
    color: var(--ink);
}

.modal-close {
    background: none;
    border: 0;
    font-size: 20px;
    color: var(--muted);
    cursor: pointer;
}

.form-group {
    margin-bottom: 16px;
}

.form-label {
    display: block;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--burgundy);
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.form-control {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--paper);
    font-size: 13px;
    color: var(--ink);
    outline: none;
}

.form-control:focus {
    border-color: var(--gold);
    background: #ffffff;
}

/* Copy Snippet */
.key-reveal-box {
    background: #1c1b18;
    color: #e6e2dc;
    padding: 16px;
    border-radius: var(--radius-sm);
    border: 1px solid #383530;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 13px;
    margin: 14px 0;
}

.key-reveal-box button {
    background: var(--gold);
    color: #ffffff;
    border: 0;
    border-radius: var(--radius-sm);
    padding: 6px 12px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
}

/* Creative studios: quiet, conversational composition. */
.gemini-studio { width: min(920px, 100%); min-height: calc(100vh - 190px); margin: 0 auto; padding: clamp(42px, 8vh, 92px) 18px 28px; display: flex; flex-direction: column; }
.gemini-studio__intro { text-align: center; margin: auto auto 44px; }
.gemini-studio__mark { display: block; color: var(--gold); font-size: 28px; margin-bottom: 12px; }
.gemini-studio__intro h1 { margin: 0; color: var(--ink); font-size: clamp(28px, 4vw, 42px); font-weight: 500; letter-spacing: -.035em; }
.gemini-studio__intro p { margin: 12px auto 0; color: var(--muted); font-size: 15px; line-height: 1.7; }
[dir="rtl"] .gemini-studio__intro h1 { letter-spacing: 0; }
.gemini-composer { width: min(820px,100%); margin-inline: auto; background: rgba(255,255,255,.94); border: 1px solid #ded7cc; border-radius: 18px; box-shadow: 0 12px 34px rgba(38,33,28,.06), 0 1px 2px rgba(38,33,28,.04); overflow: hidden; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.gemini-composer:focus-within { border-color: rgba(179,154,109,.8); box-shadow: 0 16px 42px rgba(38,33,28,.09), 0 0 0 3px rgba(179,154,109,.10); transform: translateY(-1px); }
.gemini-composer textarea { display: block; width: 100%; min-height: 104px; max-height: 190px; padding: 22px 24px 16px; border: 0; outline: 0; resize: none; background: transparent; color: var(--ink); font: inherit; font-size: 15px; line-height: 1.75; }
.gemini-composer textarea::placeholder { color: #9a958e; }
.gemini-composer__bar { min-height: 58px; padding: 9px 11px 10px 14px; display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--line-light); background: linear-gradient(180deg,rgba(252,250,246,.35),rgba(247,243,236,.72)); }
.gemini-tool { border: 1px solid transparent; background: transparent; color: var(--muted); padding: 8px 11px; border-radius: 10px; cursor: pointer; font: inherit; font-size: 11px; }
.gemini-tool:hover { background: #fff; border-color: var(--line); color: var(--ink); }
.gemini-cost { margin-inline-start: auto; padding-inline: 10px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.gemini-send { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border: 0; border-radius: 12px; background: var(--ink); color: white; cursor: pointer; font-size: 14px; box-shadow: 0 4px 12px rgba(24,23,21,.16); transform: rotate(180deg); transition: transform .16s ease, opacity .16s ease, background .16s ease; }
[dir="ltr"] .gemini-send { transform: none; }
.gemini-send:hover:not(:disabled) { background: var(--gold-hover); transform: rotate(180deg) translateY(-1px); }
[dir="ltr"] .gemini-send:hover:not(:disabled) { transform: translateY(-1px); }
.gemini-send:disabled { opacity: .26; cursor: default; box-shadow: none; }
.gemini-options { margin: 0 18px; padding: 14px 6px; border-top: 1px solid var(--line-light); display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.gemini-options label span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.gemini-options select { width: 100%; border: 1px solid var(--line-light); background: var(--paper); border-radius: 9px; padding: 9px 11px; color: var(--ink); outline: 0; font: inherit; font-size: 11px; }
.gemini-notice { margin-bottom: 18px; padding: 12px 16px; border: 1px solid #e4c7bf; border-radius: 14px; background: #fff7f4; color: #7b342a; font-size: 13px; }
.gemini-result-grid { margin: 0 auto 28px; width: min(720px,100%); display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 16px; }
.gemini-result { margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.gemini-result img { width: 100%; max-height: 520px; display: block; object-fit: cover; }
.gemini-result figcaption { padding: 11px 14px; display: flex; justify-content: space-between; color: var(--muted); font-size: 11px; }
.gemini-result a { color: var(--burgundy); text-decoration: none; font-weight: 700; }
.gemini-job { width: min(720px,100%); margin: 0 auto 28px; display: grid; grid-template-columns: 180px 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.gemini-job__preview { min-height: 150px; display: grid; place-items: center; background: linear-gradient(145deg,#312d28,#8a7252); color: #fff; font-size: 24px; }
.gemini-job__body { padding: 20px; }
.gemini-job__body h2 { margin: 12px 0 8px; font-size: 15px; font-weight: 600; line-height: 1.6; }
.gemini-job__body p { margin: 0; color: var(--muted); font-size: 11px; }
.gemini-progress { height: 4px; margin-top: 18px; overflow: hidden; border-radius: 8px; background: var(--cream); }
.gemini-progress span { display: block; width: 68%; height: 100%; background: var(--gold); }
@media (max-width:700px) { .gemini-studio { min-height: calc(100vh - 130px); padding: 34px 0 16px; } .gemini-studio__intro { margin-bottom: 28px; padding-inline: 14px; } .gemini-options { grid-template-columns: 1fr; } .gemini-job { grid-template-columns: 1fr; } .gemini-job__preview { min-height: 110px; } }

/* Navigation clarity and decision-focused resource pages. */
.page-eyebrow { display: block; margin-bottom: 7px; color: var(--gold-hover); font-size: 9px; font-weight: 800; letter-spacing: .14em; direction: ltr; }
.studio-page-head { align-items: center; }
.studio-primary-link { text-decoration: none; }
.model-toolbar { margin-bottom: 18px; padding: 12px; display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--line-light); border-radius: 12px; box-shadow: var(--shadow-sm); }
.model-search { flex: 1; min-width: 240px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); }
.model-search span { color: var(--muted); font-size: 18px; }
.model-search input { width: 100%; padding: 10px 0; border: 0; outline: 0; background: transparent; font: inherit; }
.model-toolbar select { min-width: 160px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper); color: var(--ink); font: inherit; font-size: 12px; }
.model-count { padding-inline: 8px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.model-catalog { box-shadow: var(--shadow-sm); }
.model-catalog .studio-table td { padding-block: 14px; vertical-align: middle; }
.model-identity { min-width: 255px; display: flex; align-items: center; gap: 12px; }
.model-logo { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: var(--cream); color: var(--burgundy); font-weight: 800; }
.model-identity strong { display: block; margin-bottom: 3px; font-size: 13px; }
.model-identity code { display: block; max-width: 280px; overflow: hidden; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.model-catalog small { color: var(--muted); font-size: 9px; }
.speed-dots { display: flex; gap: 3px; direction: ltr; }
.speed-dots i { width: 5px; height: 14px; border-radius: 4px; background: var(--line); }
.speed-dots i.on { background: var(--gold); }
.table-action { color: var(--burgundy); font-size: 11px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.table-action:hover { color: var(--gold-hover); }
.studio-loading, .studio-empty { min-height: 220px; display: grid; place-content: center; gap: 7px; text-align: center; color: var(--muted); border: 1px dashed var(--line); border-radius: 12px; }
.studio-empty strong { color: var(--ink); }

.playground-shell { grid-template-columns: auto minmax(0,1fr); }
.playground-shell > .playground-main:only-child { grid-column: 1 / -1; }
.playground-main { min-height: min(720px,calc(100vh - 190px)); border-radius: 16px; box-shadow: 0 8px 30px rgba(35,31,27,.04); }
.playground-sidebar { width: 300px; border-radius: 16px; box-shadow: var(--shadow-sm); }
.chat-history { max-height: none; padding: 34px; }
.chat-input-bar { margin: 14px; padding: 10px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 6px 24px rgba(35,31,27,.06); }
.chat-input-bar .chat-textarea { border: 0; background: transparent; }
.chat-input-bar .btn-primary { min-width: 112px; justify-content: center; border-radius: 12px; }

.context-strip { margin-bottom: 18px; padding: 16px 18px; display: flex; align-items: center; gap: 30px; border: 1px solid var(--line-light); border-radius: 12px; background: #fff; }
.context-strip > div { min-width: 90px; }
.context-strip strong { display: block; color: var(--ink); font-size: 18px; }
.context-strip span { color: var(--muted); font-size: 10px; }
.context-strip p { margin-inline-start: auto; max-width: 520px; color: var(--muted); font-size: 11px; }

@media (max-width:900px) {
    .model-toolbar { align-items: stretch; flex-wrap: wrap; }
    .model-search { flex-basis: 100%; }
    .model-toolbar select { flex: 1; }
    .playground-shell { grid-template-columns: 1fr; }
    .playground-sidebar { width: 100%; }
    .context-strip { flex-wrap: wrap; }
    .context-strip p { flex-basis: 100%; margin-inline-start: 0; }
}

/* Global page orientation and contextual help. */
.page-guide { min-height: 34px; margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.studio-breadcrumb { display: flex; align-items: center; gap: 8px; color: var(--muted-light); font-size: 10.5px; }
.studio-breadcrumb a { color: var(--muted); text-decoration: none; }
.studio-breadcrumb a:hover { color: var(--burgundy); }
.studio-breadcrumb strong { color: var(--ink); font-weight: 600; }
.page-help-button { min-height: 32px; padding: 5px 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--burgundy); font: inherit; font-size: 10.5px; font-weight: 700; cursor: pointer; box-shadow: var(--shadow-sm); }
.page-help-button span { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: var(--cream); color: var(--gold-hover); font-size: 11px; }
.page-help-button:hover { border-color: var(--gold); background: var(--gold-light); }
.help-backdrop { position: fixed; inset: 0; z-index: 1400; padding: 24px; display: grid; place-items: center; background: rgba(24,23,21,.46); backdrop-filter: blur(5px); animation: help-fade .16s ease-out; }
.help-dialog { position: relative; width: min(560px,100%); overflow: hidden; border: 1px solid rgba(255,255,255,.7); border-radius: 18px; background: #fff; box-shadow: 0 26px 80px rgba(20,18,16,.24); animation: help-rise .2s ease-out; }
.help-dialog__accent { height: 4px; background: linear-gradient(90deg,var(--burgundy),var(--gold),#e8dcc7); }
.help-dialog header { padding: 24px 26px 18px; display: flex; align-items: center; gap: 13px; border-bottom: 1px solid var(--line-light); }
.help-dialog__icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; background: var(--gold-light); color: var(--gold-hover); font-size: 18px; font-weight: 700; }
.help-dialog header span { display: block; margin-bottom: 2px; color: var(--gold-hover); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.help-dialog header h2 { margin: 0; color: var(--ink); font-size: 19px; font-weight: 650; }
.help-dialog header button { margin-inline-start: auto; width: 32px; height: 32px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); font-size: 22px; cursor: pointer; }
.help-dialog header button:hover { background: var(--cream); color: var(--ink); }
.help-dialog__summary { margin: 0; padding: 20px 26px 10px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.help-dialog__steps { padding: 10px 26px 22px; }
.help-dialog__steps h3 { margin-bottom: 12px; color: var(--ink); font-size: 11px; }
.help-dialog__steps > div { padding: 9px 0; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--line-light); }
.help-dialog__steps > div:last-child { border-bottom: 0; }
.help-dialog__steps > div > span { width: 25px; height: 25px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: var(--cream); color: var(--burgundy); font-size: 10px; font-weight: 800; }
.help-dialog__steps p { margin: 0; color: var(--burgundy-2); font-size: 12px; }
.help-dialog footer { padding: 15px 26px; display: flex; justify-content: flex-end; background: var(--paper); border-top: 1px solid var(--line-light); }
@keyframes help-fade { from { opacity: 0; } }
@keyframes help-rise { from { opacity: 0; transform: translateY(10px) scale(.985); } }

.playground-welcome { max-width: 680px; margin: auto; padding: 58px 20px; text-align: center; color: var(--muted); }
.playground-welcome__mark { margin-bottom: 12px; color: var(--gold); font-size: 28px; }
.playground-model-state { width: fit-content; margin: 0 auto 18px; padding: 6px 10px; display: flex; align-items: center; gap: 7px; border: 1px solid var(--line-light); border-radius: 20px; background: var(--paper); color: var(--muted); font-size: 9.5px; }
.playground-model-state i { width: 6px; height: 6px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px var(--success-bg); }
.playground-welcome > strong { display: block; margin-bottom: 8px; color: var(--ink); font-size: 21px; font-weight: 650; }
.playground-welcome > p { max-width: 560px; margin: 0 auto; font-size: 12.5px; line-height: 1.8; }
.prompt-starters { margin-top: 24px; display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
.prompt-starters button { min-height: 68px; padding: 11px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; border: 1px solid var(--line-light); border-radius: 12px; background: #fff; color: var(--burgundy); text-align: start; font: inherit; font-size: 10.5px; cursor: pointer; }
.prompt-starters button span { color: var(--gold-hover); font-size: 16px; }
.prompt-starters button:hover { border-color: var(--gold); background: var(--gold-light); transform: translateY(-1px); }

@media (max-width:700px) {
    .page-guide { margin-bottom: 12px; }
    .studio-breadcrumb span:nth-of-type(1), .studio-breadcrumb span:nth-of-type(2) { display: none; }
    .help-backdrop { padding: 12px; }
    .help-dialog header, .help-dialog__summary, .help-dialog__steps, .help-dialog footer { padding-inline: 18px; }
    .prompt-starters { grid-template-columns: 1fr; }
    .prompt-starters button { min-height: 52px; }
}

/* Bright, visual creation experience. */
.studio-welcome { position:relative; min-height:300px; margin-bottom:38px; padding:48px 54px; display:flex; align-items:center; overflow:hidden; border:1px solid rgba(149,132,112,.18); border-radius:28px; background:linear-gradient(120deg,#fff 0%,#fdfbf7 48%,#eef7f6 76%,#f5eef1 100%); box-shadow:0 24px 65px rgba(71,58,48,.075); isolation:isolate; }
.studio-welcome::before,.studio-welcome::after { content:""; position:absolute; border-radius:50%; filter:blur(4px); z-index:-1; }
.studio-welcome::before { width:360px; height:360px; inset-inline-end:8%; top:-45%; background:radial-gradient(circle,rgba(104,191,192,.21),rgba(104,191,192,0) 70%); }
.studio-welcome::after { width:300px; height:300px; inset-inline-end:25%; bottom:-60%; background:radial-gradient(circle,rgba(126,29,65,.11),rgba(126,29,65,0) 70%); }
.studio-welcome__copy { position:relative; z-index:2; max-width:680px; }
.studio-welcome__eyebrow { display:block; margin-bottom:12px; color:#8a3152; font-size:10px; font-weight:800; letter-spacing:.16em; }
.studio-welcome h1 { max-width:650px; margin:0; color:#182735; font-size:clamp(32px,4vw,58px); line-height:1.08; letter-spacing:-.04em; }
.studio-welcome p { max-width:570px; margin:18px 0 25px; color:#687887; font-size:15px; line-height:1.8; }
.studio-welcome__actions { display:flex; gap:10px; flex-wrap:wrap; }
.studio-welcome__actions .btn-primary { background:linear-gradient(135deg,#812348,#a33563); box-shadow:0 10px 22px rgba(129,35,72,.2); }
.studio-welcome__orb-scene { width:185px;height:185px;margin-inline-start:auto;flex:0 0 auto;display:grid;place-items:center;perspective:850px; }
.studio-welcome__orb { position:relative;width:155px;height:155px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.84);border-radius:42px;transform-style:preserve-3d;background:linear-gradient(145deg,#4aa9b0,#88608b 52%,#a92f5b 78%,#c59d62);box-shadow:0 30px 58px rgba(94,68,78,.2),inset 0 1px 2px rgba(255,255,255,.85);animation:ai-orb-3d 7s ease-in-out infinite;will-change:transform; }
.studio-welcome__orb::before { content:"";position:absolute;inset:9px;border:1px solid rgba(255,255,255,.2);border-radius:34px;transform:translateZ(12px);background:linear-gradient(135deg,rgba(255,255,255,.2),transparent 42%); }
.studio-welcome__orb::after { content:"";position:absolute;width:70%;height:24%;inset:auto 15% -18%;border-radius:50%;background:rgba(84,44,68,.2);filter:blur(18px);transform:translateZ(-35px) rotateX(80deg); }
.studio-welcome__orb span { position:relative;z-index:1;color:#fff;font-size:42px;font-weight:800;letter-spacing:-.08em;transform:translateZ(34px);text-shadow:0 5px 20px rgba(40,44,70,.25); }
@keyframes ai-orb-3d { 0%,100% { transform:rotateX(7deg) rotateY(-13deg) rotateZ(-4deg) translateY(0); } 25% { transform:rotateX(-7deg) rotateY(12deg) rotateZ(3deg) translateY(-8px); } 50% { transform:rotateX(9deg) rotateY(17deg) rotateZ(7deg) translateY(-3px); } 75% { transform:rotateX(-4deg) rotateY(-9deg) rotateZ(-7deg) translateY(-10px); } }
@media(prefers-reduced-motion:reduce) { .studio-welcome__orb { animation:none;transform:rotateX(5deg) rotateY(-8deg) rotateZ(-4deg); } }
.studio-section-heading { margin-bottom:16px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.studio-section-heading span { color:#728391; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.studio-section-heading h2 { margin:3px 0 0; color:#182735; font-size:22px; letter-spacing:-.02em; }
.studio-section-heading small,.studio-section-heading__count { color:#8a98a4; font-size:11px; }
.studio-section-link { color:#7b1f46; font-size:9px; font-weight:700; text-decoration:none; white-space:nowrap; }
.studio-journey,.studio-visual-launches { margin-bottom:42px; }
.studio-journey__grid { padding:14px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; border:1px solid #e8edf0; border-radius:24px; background:rgba(247,250,252,.78); }
.studio-step { position:relative; min-height:178px; padding:22px; overflow:hidden; border:1px solid #e2e8ec; border-radius:18px; background:#fff; color:#263440; text-decoration:none; transition:.22s ease; }
.studio-step::after { content:""; position:absolute; width:150px; height:150px; inset-inline-end:-45px; top:-65px; border-radius:50%; opacity:.36; }
.studio-step--cyan::after { background:#b8e1df; }.studio-step--violet::after { background:#dfccd7; }.studio-step--coral::after { background:#ead6b8; }
.studio-step:hover { transform:translateY(-4px); border-color:#b8dce4; box-shadow:0 16px 35px rgba(57,91,105,.1); }
.studio-step b { color:#8b98a2; font-size:10px; }.studio-step>span { display:block; margin:22px 0 12px; color:#812348; font-size:24px; }
.studio-step h3 { margin:0 0 7px; font-size:16px; }.studio-step p { margin:0; color:#75828c; font-size:11.5px; line-height:1.6; }
.studio-template-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.studio-template-card { position:relative; min-height:250px; overflow:hidden; border-radius:23px; color:#fff; text-decoration:none; box-shadow:0 14px 35px rgba(38,50,56,.12); transition:.25s ease; }
.studio-template-card:hover { transform:translateY(-5px); box-shadow:0 22px 48px rgba(38,50,56,.18); }
.studio-template-card img { position:absolute; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }.studio-template-card:hover img { transform:scale(1.035); }
.studio-template-card__shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,25,32,.82),rgba(15,25,32,.12) 72%); }
.studio-template-card div { position:absolute; inset-inline:24px; bottom:22px; z-index:1; }.studio-template-card small { opacity:.82; font-size:9px; letter-spacing:.06em; }.studio-template-card h3 { margin:5px 0 4px; font-size:21px; }.studio-template-card p { min-height:16px; margin:0 0 14px; color:rgba(255,255,255,.78); font-size:8.5px; }.studio-template-card b { padding:8px 13px; border:1px solid rgba(255,255,255,.55); border-radius:20px; background:rgba(255,255,255,.16); backdrop-filter:blur(8px); font-size:9px; }
.dashboard-data-heading { margin-top:54px; }.dashboard-data-heading .page-actions { display:none; }

.gemini-studio { width:min(1080px,100%); max-width:1080px; min-height:auto; padding:18px 18px 42px; }.gemini-studio__intro { position:relative; margin:0 0 26px; padding:22px 20px 18px; }.gemini-studio__intro::before { content:""; position:absolute; width:430px; height:170px; left:50%; top:-8px; transform:translateX(-50%); z-index:-1; background:radial-gradient(ellipse,rgba(76,224,235,.15),rgba(126,29,65,.07) 48%,transparent 72%); }
.gemini-studio__intro h1 { color:#182735; font-size:clamp(32px,4vw,52px); letter-spacing:-.04em; }.gemini-studio__mark { color:#35b9cf; }
.video-template-section { margin:38px 0 0; }.video-template-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.video-template { position:relative; min-height:190px; padding:0; overflow:hidden; border:0; border-radius:20px; background:#eef3f5; color:#fff; text-align:start; font:inherit; cursor:pointer; box-shadow:0 10px 25px rgba(38,50,56,.1); transition:.22s ease; }
.video-template:hover { transform:translateY(-4px); box-shadow:0 20px 42px rgba(38,50,56,.18); }.video-template img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }.video-template:hover img { transform:scale(1.04); }
.video-template>span { position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,26,33,.78),rgba(15,26,33,.08) 80%); }.video-template>div { position:absolute; inset-inline-start:20px; bottom:18px; z-index:1; display:flex; flex-direction:column; align-items:flex-start; }
.video-template small { opacity:.78; font-size:9px; text-transform:uppercase; letter-spacing:.1em; }.video-template strong { margin:4px 0 14px; font-size:19px; }.video-template em { padding:7px 11px; border:1px solid rgba(255,255,255,.55); border-radius:18px; background:rgba(255,255,255,.15); font-size:9.5px; font-style:normal; backdrop-filter:blur(8px); }
.gemini-composer { width:100%; border-color:#dce7eb; box-shadow:0 18px 48px rgba(65,94,108,.1); }

@media(max-width:900px) { .studio-welcome { padding:38px 30px; }.studio-welcome__orb-scene { width:130px;height:130px; }.studio-welcome__orb { width:110px;height:110px;border-radius:31px; }.studio-journey__grid,.studio-template-grid,.video-template-grid { grid-template-columns:1fr; }.studio-template-card,.video-template { min-height:230px; } }
@media(max-width:620px) { .studio-welcome { min-height:auto; padding:30px 22px; }.studio-welcome__orb-scene { display:none; }.studio-welcome h1 { font-size:34px; }.studio-section-heading { align-items:flex-start; flex-direction:column; }.studio-journey__grid { padding:8px; }.studio-step { min-height:150px; }.studio-template-card,.video-template { min-height:205px; } }

/* Authentication pages intentionally exclude tenant, project, billing, and studio navigation. */
.auth-shell { min-height:100vh; display:grid; grid-template-rows:auto 1fr auto; overflow:hidden; background:linear-gradient(120deg,#f4efe7 0%,#faf8f4 44%,#fff 100%); }
.auth-header { min-height:76px; padding:14px clamp(22px,4vw,58px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #e8e0d5; background:rgba(252,250,246,.94); backdrop-filter:blur(14px); }
.auth-brand { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; }
.auth-brand img { width:34px; height:34px; object-fit:contain; filter:drop-shadow(0 3px 8px rgba(108,20,56,.11)); }
.auth-brand span { display:flex; flex-direction:column; }.auth-brand strong { color:#29241f; font-size:13px; font-weight:700; }.auth-brand small { color:#94794b; font-family:var(--ui-font); font-size:8px; font-weight:700; letter-spacing:.16em; }
.auth-language { min-height:34px; padding:6px 13px; border:1px solid var(--line-light); border-radius:10px; background:#fff; color:var(--burgundy); font:inherit; font-size:11px; font-weight:700; cursor:pointer; box-shadow:var(--shadow-sm); }
.auth-language:hover { border-color:var(--gold); background:var(--gold-light); }
.auth-content { position:relative; min-width:0; display:grid; place-items:center; }
.auth-content::before { content:""; position:absolute; inset:8% auto auto 7%; width:min(34vw,430px); aspect-ratio:1; border-radius:50%; border:1px solid rgba(179,154,109,.12); box-shadow:0 0 0 62px rgba(255,255,255,.20),0 0 0 124px rgba(179,154,109,.035); pointer-events:none; }
.auth-content>div { width:100%; min-height:auto !important; }
.auth-footer { min-height:54px; padding:12px clamp(22px,4vw,58px); display:flex; align-items:center; justify-content:space-between; gap:18px; color:var(--muted-light); font-size:9.5px; border-top:1px solid rgba(216,208,196,.5); }
.login-stage { position:relative; z-index:1; min-height:calc(100vh - 132px); padding:42px 20px; display:grid; place-items:center; }
.login-card { position:relative; width:min(470px,100%); padding:42px 44px 30px; overflow:hidden; border:1px solid #ddd4c7; border-radius:18px; background:rgba(255,255,255,.96); box-shadow:0 28px 80px rgba(56,46,36,.12),0 2px 6px rgba(56,46,36,.04); }
.login-card__accent { position:absolute; inset:0 0 auto; height:4px; background:linear-gradient(90deg,#7c193f 0 34%,#b39a6d 34% 66%,#dfd2bd 66%); }
.login-intro { margin-bottom:28px; text-align:start; }.login-eyebrow { display:block; margin-bottom:10px; color:#94794b; font-family:var(--ui-font); font-size:9px; font-weight:800; letter-spacing:.16em; }
.login-intro h1 { margin:0; color:#201d19; font-size:30px; font-weight:650; line-height:1.35; letter-spacing:-.025em; }[dir="rtl"] .login-intro h1 { letter-spacing:0; }.login-intro p { margin:8px 0 0; color:#7b746c; font-size:12.5px; line-height:1.8; }
.login-alert { margin-bottom:20px; padding:11px 13px; display:flex; align-items:flex-start; gap:9px; border:1px solid; border-radius:10px; font-size:11px; line-height:1.65; }.login-alert svg { margin-top:2px; flex:0 0 auto; }.login-alert--danger { border-color:#ebc7c1; background:#fff7f5; color:#96382f; }.login-alert--success { border-color:#c9e2d5; background:#f3faf6; color:#287451; }
.login-form { display:grid; gap:17px; }.login-field label { color:#3d3731; font-size:11.5px; font-weight:650; }.login-field__head { margin-bottom:7px; display:flex; align-items:center; justify-content:space-between; gap:16px; }.login-field__head a { color:#8b6d3d; font-size:10.5px; font-weight:600; text-decoration:none; }.login-field__head a:hover { color:#7c193f; text-decoration:underline; }
.login-field>label { display:block; margin-bottom:7px; }.login-field input { width:100%; height:48px; padding:0 14px; border:1px solid #d9d0c4; border-radius:10px; background:#fcfaf7; color:#211e1a; font:inherit; font-size:13px; outline:0; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }.login-field input::placeholder { color:#aaa39a; }.login-field input:focus { border-color:#a78a58; background:#fff; box-shadow:0 0 0 3px rgba(179,154,109,.13); }
.login-password { position:relative; }.login-password input { padding-inline-end:44px; }.login-password button { position:absolute; top:50%; inset-inline-end:12px; width:28px; height:28px; padding:0; display:grid; place-items:center; transform:translateY(-50%); border:0; border-radius:7px; background:transparent; color:#817a72; cursor:pointer; }.login-password button:hover { background:#f0ebe3; color:#5a5148; }
.login-remember { width:fit-content; display:flex; align-items:center; gap:9px; color:#746d65; font-size:11.5px; cursor:pointer; }.login-remember input { width:16px; height:16px; accent-color:#7c193f; }
.login-submit { width:100%; min-height:48px; padding:10px 18px; display:flex; align-items:center; justify-content:center; gap:9px; border:0; border-radius:10px; background:#7c193f; color:#fff; font:inherit; font-size:13px; font-weight:700; cursor:pointer; box-shadow:0 8px 20px rgba(124,25,63,.18); transition:transform .16s ease,background .16s ease,box-shadow .16s ease; }.login-submit:hover:not(:disabled) { background:#651331; transform:translateY(-1px); box-shadow:0 11px 24px rgba(124,25,63,.22); }.login-submit:disabled { opacity:.62; cursor:wait; }.login-submit .spinner { width:16px;height:16px;border-width:2px; }
.login-signup { margin-top:22px; padding-top:20px; display:flex; justify-content:center; flex-wrap:wrap; gap:5px; border-top:1px solid #eee8df; color:#7b746c; text-align:center; font-size:11.5px; }.login-signup a { color:#7c193f; font-weight:700; text-decoration:none; }.login-signup a:hover { text-decoration:underline; }
.login-assurance { margin:18px 0 0; display:flex; align-items:center; justify-content:center; gap:6px; color:#9a9289; font-size:9.5px; }.login-assurance svg { color:#a68b5d; }
.signup-stage { position:relative; z-index:1; min-height:calc(100vh - 132px); padding:38px 20px; display:grid; place-items:center; }
.signup-card { position:relative; width:min(720px,100%); padding:40px 44px 30px; overflow:hidden; border:1px solid #ddd4c7; border-radius:18px; background:rgba(255,255,255,.97); box-shadow:0 28px 80px rgba(56,46,36,.12),0 2px 6px rgba(56,46,36,.04); }
.signup-intro { margin-bottom:27px; text-align:start; }.signup-intro h1 { margin:0; color:#201d19; font-size:28px; font-weight:650; line-height:1.4; }.signup-intro p { margin:7px 0 0; color:#7b746c; font-size:12px; line-height:1.75; }
.signup-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px 18px; }.signup-field label { display:block; margin-bottom:7px; color:#3d3731; font-size:11px; font-weight:650; }.signup-field label span { color:#7c193f; }.signup-field input,.signup-field select { width:100%; height:46px; padding:0 13px; border:1px solid #d9d0c4; border-radius:10px; background:#fcfaf7; color:#211e1a; font:inherit; font-size:12px; outline:0; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }.signup-field input::placeholder { color:#aaa39a; }.signup-field input:focus,.signup-field select:focus { border-color:#a78a58; background:#fff; box-shadow:0 0 0 3px rgba(179,154,109,.13); }
.signup-section-head { grid-column:1/-1;margin-top:5px;padding-top:15px;display:flex;align-items:center;gap:8px;border-top:1px solid #eee8df;text-align:start; }.signup-section-head:first-child { margin-top:0;padding-top:0;border-top:0; }.signup-section-head span { width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:#f2ebe1;color:#8b6d3d;font-family:var(--ui-font);font-size:8px;font-weight:800; }.signup-section-head strong { color:#403932;font-size:11.5px; }.signup-section-head small { margin-inline-start:auto;color:#9a9289;font-size:9px; }
.signup-phone { height:46px; display:flex; align-items:center; overflow:hidden; border:1px solid #d9d0c4; border-radius:10px; background:#fcfaf7; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }.signup-phone:focus-within { border-color:#a78a58; background:#fff; box-shadow:0 0 0 3px rgba(179,154,109,.13); }.signup-phone>span { height:100%; min-width:62px; padding:0 12px; display:flex; align-items:center; justify-content:center; border-right:1px solid #e2d9cd; background:#f3eee6; color:#6d5b42; font-family:var(--ui-font); font-size:11px; font-weight:700; }.signup-phone input { height:100%; min-width:0; border:0; border-radius:0; background:transparent; direction:ltr; text-align:left; box-shadow:none !important; }
.signup-terms { margin:22px 0; display:flex; align-items:flex-start; gap:9px; color:#746d65; font-size:10.5px; line-height:1.75; cursor:pointer; }.signup-terms input { width:16px; height:16px; margin-top:2px; flex:0 0 auto; accent-color:#7c193f; }.signup-submit { margin-top:0; }.signup-login { margin-top:20px; padding-top:18px; }
@media(max-width:560px) { .auth-header { min-height:66px; }.auth-brand strong { font-size:11px; }.auth-brand small { display:none; }.auth-footer { justify-content:center; }.auth-footer span:last-child { display:none; }.login-stage { padding:24px 13px; align-items:start; }.login-card { padding:34px 24px 24px; border-radius:15px; }.login-intro h1 { font-size:27px; }.auth-content::before { display:none; } }
@media(max-width:680px) { .signup-stage { padding:24px 13px; align-items:start; }.signup-card { padding:34px 22px 24px; border-radius:15px; }.signup-intro h1 { font-size:25px; }.signup-form { grid-template-columns:1fr; gap:14px; }.signup-section-head small { display:none; } }

/* Email verification keeps the final onboarding step focused and reassuring. */
.verify-stage { position:relative; z-index:1; min-height:calc(100vh - 132px); padding:42px 20px; display:grid; place-items:center; }
.verify-card { position:relative; width:min(510px,100%); padding:42px 44px 32px; overflow:hidden; border:1px solid #ddd4c7; border-radius:20px; background:rgba(255,255,255,.97); box-shadow:0 30px 90px rgba(56,46,36,.13),0 2px 7px rgba(56,46,36,.04); text-align:center; }
.verify-icon { width:58px;height:58px;margin:0 auto 17px;display:grid;place-items:center;border:1px solid #d9c7aa;border-radius:17px;background:linear-gradient(145deg,#faf7f0,#f1e8d8);color:#9b7c49;box-shadow:0 8px 22px rgba(116,84,38,.09); }
.verify-eyebrow { display:block;margin-bottom:9px;color:#94794b;font-family:var(--ui-font);font-size:8.5px;font-weight:800;letter-spacing:.15em; }
.verify-card h1 { margin:0;color:#201d19;font-size:29px;font-weight:680;line-height:1.4;letter-spacing:-.025em; }[dir="rtl"] .verify-card h1 { letter-spacing:0; }
.verify-lead { max-width:390px;margin:8px auto 0;color:#7b746c;font-size:12.5px;line-height:1.85; }
.verify-destination { width:fit-content;max-width:100%;margin:18px auto 0;padding:8px 12px;display:flex;align-items:center;gap:7px;border:1px solid #ebe3d8;border-radius:20px;background:#faf8f4;color:#8b837a;font-size:9.5px; }.verify-destination strong { overflow:hidden;color:#514941;font-size:10px;text-overflow:ellipsis; }
.verify-field { margin-top:27px;text-align:start; }.verify-field__head { margin-bottom:8px;display:flex;align-items:center;justify-content:space-between;gap:16px; }.verify-field__head label { color:#3d3731;font-size:11.5px;font-weight:700; }.verify-field__head span { color:#9a9289;font-size:9.5px; }
.verify-field input { width:100%;height:54px;padding:0 16px;border:1px solid #d7ccbd;border-radius:11px;background:#fcfaf7;color:#211e1a;font-family:var(--ui-font);font-size:17px;font-weight:700;letter-spacing:.12em;text-align:center;outline:0;transition:.18s ease; }.verify-field input::placeholder { color:#c3bbb1; }.verify-field input:focus { border-color:#9e804f;background:#fff;box-shadow:0 0 0 4px rgba(179,154,109,.13); }
.verify-action { margin-top:14px;text-decoration:none; }.verify-assurance { margin:18px 0 0;display:flex;align-items:center;justify-content:center;gap:7px;color:#9a9289;font-size:9.5px; }.verify-assurance span { color:#a68b5d;font-size:7px; }
.verify-result { margin:26px 0 20px;padding:17px;display:grid;gap:4px;border:1px solid;border-radius:12px;text-align:start; }.verify-result strong { font-size:12.5px; }.verify-result span { font-size:10.5px;line-height:1.6; }.verify-result--success { border-color:#c9e2d5;background:#f3faf6;color:#287451; }
@media(max-width:560px) { .verify-stage { padding:24px 13px;align-items:start; }.verify-card { padding:36px 22px 26px;border-radius:16px; }.verify-card h1 { font-size:25px; }.verify-field__head span { display:none; } }

/* Digital character management. */
.avatar-page-head { align-items:flex-end; }.avatar-summary { margin-bottom:18px; display:grid; grid-template-columns:repeat(4,1fr); overflow:hidden; border:1px solid var(--line-light); border-radius:16px; background:#fff; box-shadow:var(--shadow-sm); }
.avatar-summary>div { padding:17px 20px; border-inline-end:1px solid var(--line-light); }.avatar-summary>div:last-child { border:0; }.avatar-summary strong { display:block; color:#822649; font-size:23px; }.avatar-summary span { color:var(--muted); font-size:10px; }
.avatar-toolbar { margin-bottom:18px; display:flex; align-items:center; justify-content:space-between; gap:14px; }.avatar-search { width:min(390px,100%); display:flex; align-items:center; gap:8px; padding:0 13px; border:1px solid var(--line); border-radius:11px; background:#fff; }.avatar-search span { color:var(--muted); font-size:20px; }.avatar-search input { width:100%; padding:10px 0; border:0; outline:0; background:transparent; font:inherit; font-size:11px; }
.avatar-filters { padding:3px; display:flex; gap:2px; border:1px solid var(--line-light); border-radius:11px; background:var(--cream); }.avatar-filters button { padding:7px 12px; border:0; border-radius:8px; background:transparent; color:var(--muted); font:inherit; font-size:10px; cursor:pointer; }.avatar-filters button.active { background:#fff; color:#7d173d; font-weight:700; box-shadow:var(--shadow-sm); }
.avatar-manager-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }.avatar-management-card { overflow:hidden; border:1px solid var(--line-light); border-radius:18px; background:#fff; box-shadow:0 8px 26px rgba(38,33,28,.055); transition:.2s ease; }.avatar-management-card:hover { transform:translateY(-3px); box-shadow:0 16px 38px rgba(38,33,28,.09); }
.avatar-management-card__cover { position:relative; min-height:145px; display:grid; place-items:center; overflow:hidden; }.avatar-management-card__cover::before,.avatar-management-card__cover::after { content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.2); }.avatar-management-card__cover::before { width:180px;height:180px;inset-inline-start:-55px;top:-90px; }.avatar-management-card__cover::after { width:100px;height:100px;inset-inline-end:-25px;bottom:-55px; }.accent-burgundy { background:linear-gradient(135deg,#6e193b,#a44869); }.accent-teal { background:linear-gradient(135deg,#267b7d,#72b9b5); }.accent-gold { background:linear-gradient(135deg,#9a7745,#d4b77d); }.accent-violet { background:linear-gradient(135deg,#68547f,#a78eb5); }
.avatar-portrait { position:relative; z-index:1; width:76px;height:76px;display:grid;place-items:center;border:3px solid rgba(255,255,255,.72);border-radius:50%;background:rgba(255,255,255,.91);color:#70203f;font-size:28px;font-weight:800;box-shadow:0 10px 28px rgba(28,23,21,.18); }.avatar-live-state { position:absolute; z-index:2; inset-inline-start:12px; top:12px; padding:5px 9px; border-radius:16px; background:rgba(255,255,255,.9); color:#615850; font-size:8.5px; font-weight:800; }.avatar-live-state.ready { color:var(--success); }.avatar-live-state.draft { color:var(--warning); }
.avatar-management-card__body { padding:17px; }.avatar-card-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.avatar-card-title h3 { margin:0 0 3px;font-size:15px; }.avatar-card-title p { margin:0;color:var(--muted);font-size:10.5px; }.avatar-card-title>button { border:0;background:transparent;color:var(--muted);font-weight:800;cursor:pointer; }
.avatar-meta { margin:16px 0; padding:12px; display:grid; grid-template-columns:1.3fr 1.3fr .7fr; gap:8px; border-radius:11px; background:var(--paper); }.avatar-meta small,.avatar-meta b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.avatar-meta small { margin-bottom:3px;color:var(--muted-light);font-size:8px; }.avatar-meta b { color:var(--burgundy);font-size:9.5px;font-weight:600; }.avatar-card-actions { display:flex; gap:7px; }.avatar-card-actions .btn-primary { flex:1;justify-content:center; }.avatar-card-actions .btn-secondary { justify-content:center; }.avatar-copy { width:34px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--muted);cursor:pointer; }
.avatar-create-card { min-height:370px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; border:1px dashed #cbbca8; border-radius:18px; background:rgba(255,255,255,.46); color:var(--burgundy); font:inherit; cursor:pointer; }.avatar-create-card>span { width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#fff1f5;color:#8b3154;font-size:25px; }.avatar-create-card strong { font-size:13px; }.avatar-create-card small { color:var(--muted);font-size:10px; }.avatar-create-card:hover { border-color:#8b3154;background:#fff; }
.avatar-editor { width:min(700px,100%); overflow:hidden; border:1px solid rgba(255,255,255,.7); border-radius:20px; background:#fff; box-shadow:0 26px 80px rgba(20,18,16,.24); }.avatar-editor header { padding:20px 24px;display:flex;align-items:center;border-bottom:1px solid var(--line-light); }.avatar-editor header span { color:#8b3154;font-size:9px;font-weight:800; }.avatar-editor header h2 { margin:3px 0 0;font-size:19px; }.avatar-editor header button { margin-inline-start:auto;width:32px;height:32px;border:0;border-radius:9px;background:var(--paper);font-size:21px;cursor:pointer; }.avatar-editor__preview { padding:20px;display:flex;flex-direction:column;align-items:center;gap:8px;background:linear-gradient(120deg,#edf7f5,#f8eef2); }.avatar-editor__preview p { color:var(--muted);font-size:9.5px; }.avatar-editor__form { padding:22px 24px;display:grid;grid-template-columns:1fr 1fr;gap:15px; }.avatar-editor__form label>span { display:block;margin-bottom:6px;color:var(--burgundy);font-size:9px;font-weight:700; }.avatar-editor__form input,.avatar-editor__form select,.avatar-editor__form textarea { width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--paper);font:inherit;font-size:11px;outline:0; }.avatar-editor__form textarea { min-height:82px;resize:vertical; }.avatar-editor__wide { grid-column:1/-1; }.avatar-editor footer { padding:15px 24px;display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--line-light);background:var(--paper); }
@media(max-width:1000px) { .avatar-manager-grid { grid-template-columns:repeat(2,1fr); }.avatar-summary { grid-template-columns:repeat(2,1fr); }.avatar-summary>div:nth-child(2) { border-inline-end:0; } }
@media(max-width:650px) { .avatar-page-head { align-items:flex-start; }.avatar-toolbar { align-items:stretch;flex-direction:column; }.avatar-filters { overflow:auto; }.avatar-manager-grid { grid-template-columns:1fr; }.avatar-summary { grid-template-columns:1fr 1fr; }.avatar-editor__form { grid-template-columns:1fr; }.avatar-editor__wide { grid-column:auto; } }

/* Professional dashboard density and navigation hierarchy. */
.studio-sidebar { width:252px; background:#f8f5f0; border-inline-end-color:#e8e1d8; box-shadow:6px 0 24px rgba(46,37,31,.025); }
.sidebar-brand { min-height:74px; padding:17px 18px; background:rgba(255,255,255,.72); }.sidebar-brand img { width:31px;height:31px; }.brand-text h1 { font-size:12.5px;letter-spacing:.045em; }.brand-text span { margin-top:2px;font-size:7.5px; }
.sidebar-nav { padding:14px 10px 12px; gap:11px; scrollbar-width:thin; scrollbar-color:#d8d0c4 transparent; }.sidebar-nav>div { padding-top:1px; }.sidebar-nav>div+div { padding-top:10px; border-top:1px solid rgba(216,208,196,.58); }
.nav-group-label { height:22px; padding:0 10px 5px; display:flex; align-items:center; gap:8px; color:#9b9186; font-size:8px; letter-spacing:.1em; }.nav-group-label::after { content:""; height:1px; flex:1; background:linear-gradient(90deg,rgba(216,208,196,.72),transparent); }[dir="rtl"] .nav-group-label::after { background:linear-gradient(270deg,rgba(216,208,196,.72),transparent); }
.sidebar-links { gap:2px; }.sidebar-link { min-height:39px; padding:5px 9px; gap:10px; border-radius:10px; color:#5b544d; font-size:11.5px; }.sidebar-link i { width:27px;height:27px;flex-basis:27px;border:1px solid #ece5dc;border-radius:8px;background:rgba(255,255,255,.72);color:#8d7756; }.studio-icon { width:15px;height:15px; }
.sidebar-link:hover { background:#f0eae3;color:#302923; }.sidebar-link.active { padding-inline-start:9px;border-inline-start:0;background:#fff;color:#6f1e40;box-shadow:0 5px 16px rgba(65,48,38,.065),inset 3px 0 0 #8a234d; }[dir="rtl"] .sidebar-link.active { box-shadow:0 5px 16px rgba(65,48,38,.065),inset -3px 0 0 #8a234d; }.sidebar-link.active i { border-color:#ead7df;background:#f8ebf0;color:#831f48;box-shadow:none; }
.sidebar-footer { padding:12px 11px;background:#f2ece4;border-top-color:#e3dbd1; }.wallet-pill { margin-bottom:9px;padding:8px 10px;background:rgba(255,255,255,.78); }.wallet-pill strong { font-size:12px; }.user-snippet { padding:5px 3px; }.user-avatar { width:31px;height:31px;font-size:11px; }
.studio-header { height:68px;padding:0 24px;border-bottom-color:#e8e1d8;box-shadow:0 2px 12px rgba(40,34,29,.025); }.header-left,.header-right { gap:9px; }.header-select,.btn-lang { min-height:34px;border-color:#e4ddd4;border-radius:9px;background:#fff;font-size:10.5px;box-shadow:0 1px 2px rgba(40,34,29,.025); }

.studio-content { padding:22px 26px 34px; }.page-guide { min-height:28px;margin-bottom:12px; }.studio-welcome { min-height:250px;margin-bottom:28px;padding:34px 42px;border-radius:24px; }.studio-welcome h1 { font-size:clamp(32px,3.6vw,50px); }.studio-welcome p { margin:13px 0 20px;font-size:13px; }.studio-welcome__orb-scene { width:155px;height:155px; }.studio-welcome__orb { width:130px;height:130px;border-radius:36px; }.studio-welcome__orb span { font-size:35px; }
.studio-journey,.studio-visual-launches { margin-bottom:30px; }.studio-section-heading { margin-bottom:12px; }.studio-section-heading h2 { font-size:19px; }.studio-journey__grid { padding:9px;gap:9px;border-radius:18px; }.studio-step { min-height:138px;padding:16px 18px;border-radius:14px; }.studio-step>span { margin:12px 0 7px;font-size:19px; }.studio-step h3 { font-size:13px; }.studio-step p { font-size:9.5px; }.studio-step::after { width:110px;height:110px; }
.studio-template-grid { gap:12px; }.studio-template-card { min-height:205px;border-radius:18px;box-shadow:0 9px 24px rgba(38,50,56,.1); }.studio-template-card div { inset-inline:18px;bottom:17px; }.studio-template-card h3 { margin:4px 0;font-size:19px; }.studio-template-card p { margin-bottom:12px; }.dashboard-data-heading { margin-top:36px;margin-bottom:18px;padding-top:26px;border-top:1px solid #ebe4dc; }.dashboard-data-heading h2 { font-size:21px; }.metric-grid { gap:12px;margin-bottom:18px; }
@media(max-width:1100px) { .studio-sidebar { width:230px; }.studio-welcome__orb-scene { display:none; } }

.header-context-select { min-width:205px; display:flex; align-items:center; gap:9px; }.header-context-select__icon { width:30px;height:30px;flex:0 0 auto;display:grid;place-items:center;border:1px solid #e8e1d8;border-radius:9px;background:#faf7f2;color:#856f51; }.header-context-select label { min-width:0;display:flex;flex-direction:column; }.header-context-select small { padding-inline:3px;color:var(--muted-light);font-size:7.5px;font-weight:700;line-height:1.15; }.header-context-select .header-select { min-width:170px;height:25px;padding:0 3px;border:0;background:transparent;box-shadow:none;color:#36302b;font-size:10.5px; }
.header-icon-button { width:34px;height:34px;display:grid;place-items:center;border:1px solid #e4ddd4;border-radius:10px;background:#fff;color:#685e55;cursor:pointer;transition:.16s ease; }.header-icon-button:hover { border-color:#c9b7a1;background:#faf6f1;color:#7d173d; }.header-language { height:34px;padding:0 10px;display:flex;align-items:center;gap:4px;border:1px solid #e4ddd4;border-radius:10px;background:#fff;color:#7d173d;font:inherit;font-size:9px;font-weight:800;cursor:pointer; }.header-language b { color:#c7bdb2;font-weight:400; }
.header-user-menu { position:relative; }.header-user-menu>summary { list-style:none;cursor:pointer; }.header-user-menu>summary::-webkit-details-marker { display:none; }
.header-account { min-width:185px;height:44px;padding:4px 7px;display:flex;align-items:center;gap:9px;border:1px solid transparent;border-radius:13px;color:var(--ink);transition:.16s ease; }.header-account:hover,.header-user-menu[open] .header-account { background:#f8f4ef;border-color:#e8dfd5; }.header-account__avatar { width:33px;height:33px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#772044,#a54368);box-shadow:0 3px 10px rgba(119,32,68,.18);color:#fff;font-size:11px;font-weight:800; }.header-account__identity { min-width:0;display:flex;flex:1;flex-direction:column;line-height:1.3; }.header-account strong { max-width:118px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px; }.header-account small { max-width:118px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted-light);font-size:7.5px; }.header-account__chevron { width:7px;height:7px;flex:0 0 auto;border-inline-end:1.5px solid #695f58;border-bottom:1.5px solid #695f58;transform:rotate(45deg) translateY(-2px);transition:transform .16s ease; }.header-user-menu[open] .header-account__chevron { transform:rotate(225deg) translate(-2px,-1px); }
.header-user-menu__panel { position:absolute;inset-block-start:calc(100% + 9px);inset-inline-end:0;z-index:220;width:220px;padding:7px;border:1px solid #e7dfd6;border-radius:14px;background:#fff;box-shadow:0 18px 42px rgba(38,29,24,.14); }.header-user-menu__intro { padding:8px 9px 10px;border-bottom:1px solid #eee8e1;display:flex;flex-direction:column;gap:2px; }.header-user-menu__intro strong { font-size:11px; }.header-user-menu__intro small { overflow:hidden;text-overflow:ellipsis;color:var(--muted-light);font-size:8px; }.header-user-menu__panel>a,.header-user-menu__panel>button { width:100%;min-height:36px;padding:7px 9px;display:flex;align-items:center;gap:8px;border:0;border-radius:9px;background:transparent;color:var(--ink);font:inherit;font-size:9px;text-decoration:none;cursor:pointer; }.header-user-menu__panel>a:hover,.header-user-menu__panel>button:hover { background:#f8f4ef;color:var(--burgundy); }.header-user-menu__panel svg { width:15px;height:15px; }
:where(a,button,input,select,textarea):focus-visible { outline:3px solid rgba(131,31,72,.18);outline-offset:2px; }
h1:focus,h2:focus,h3:focus { outline:none; }
.btn-primary,.btn-secondary,.btn-gold { transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease; }.btn-primary:hover:not(:disabled) { transform:translateY(-1px);box-shadow:0 8px 20px rgba(110,25,59,.18); }.btn-secondary:hover:not(:disabled) { transform:translateY(-1px);box-shadow:var(--shadow-sm); }
@media(max-width:1050px) { .header-context-select { min-width:150px; }.header-context-select__icon,.header-context-select small { display:none; }.header-context-select .header-select { min-width:145px;border:1px solid #e4ddd4;padding:0 8px; }.header-account__identity { display:none; }.header-account { min-width:auto;padding:4px; }.header-account__chevron { margin-inline:2px; } }
.mobile-nav-toggle,.mobile-nav-backdrop { display:none; }
@media(max-width:780px) {
    .studio-sidebar { position:fixed;inset-block:0;right:0;left:auto;z-index:500;width:min(290px,86vw);transform:translateX(105%);transition:transform .22s ease;box-shadow:-18px 0 45px rgba(29,24,21,.15); }
    [dir="ltr"] .studio-sidebar { left:0;right:auto;transform:translateX(-105%); }
    .studio-shell.nav-open .studio-sidebar { transform:translateX(0); }
    .mobile-nav-toggle { position:fixed;z-index:180;inset-block-start:15px;inset-inline-end:16px;width:38px;height:38px;padding:9px;display:flex;flex-direction:column;justify-content:center;gap:4px;border:1px solid #e4ddd4;border-radius:10px;background:#fff;box-shadow:var(--shadow-md);cursor:pointer; }
    .mobile-nav-toggle span { height:2px;border-radius:2px;background:#72203f; }
    .mobile-nav-backdrop { position:fixed;inset:0;z-index:490;display:block;border:0;background:rgba(31,27,24,.35);backdrop-filter:blur(2px); }
    .studio-header { height:68px;padding-inline:64px 10px; }.header-context-select { min-width:0; }.header-context-select:first-child { display:none; }.header-context-select .header-select { min-width:118px;max-width:35vw; }.header-language { display:none; }.header-user-menu { display:block; }.header-account { display:flex; }.header-user-menu__panel { position:fixed;inset-block-start:62px;inset-inline-end:10px; }
    .studio-content { padding:18px 14px 28px; }.studio-welcome { padding:28px 22px; }.studio-welcome h1 { font-size:32px; }.studio-welcome__actions { align-items:stretch;flex-direction:column; }.studio-welcome__actions a { justify-content:center; }
}

/* Model discovery — editorial hierarchy inspired by modern model indexes */
.models-discovery-head{margin-bottom:22px;display:flex;align-items:end;justify-content:space-between;gap:20px}.models-discovery-head h2{margin:3px 0 4px;font-size:27px;letter-spacing:-.035em}.models-discovery-head p{margin:0;color:var(--muted);font-size:11px}.models-discovery-head .btn-secondary{white-space:nowrap;text-decoration:none}
.models-frontier-grid{margin-bottom:28px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr);gap:12px}.models-frontier-card,.models-signal-grid article,.leaderboard-card{border:1px solid #e9e3dc;border-radius:14px;background:#fff;box-shadow:0 7px 22px rgba(43,34,29,.035)}.models-frontier-card{padding:20px}.models-section-kicker{color:var(--muted-light);font-size:8px}.models-frontier-card h3{margin:3px 0 4px;font-size:21px}.models-frontier-card>p{margin:0 0 16px;color:var(--muted);font-size:9px}.frontier-table-head{padding:0 0 7px 55px;display:flex;justify-content:space-between;border-bottom:1px solid #eee9e3;color:var(--muted-light);font-size:8px}.frontier-row{min-height:45px;padding:6px 2px;display:grid;grid-template-columns:20px 30px minmax(145px,1fr) minmax(75px,125px) 26px;align-items:center;gap:8px;border-bottom:1px solid #f1ede8}.frontier-row:last-child{border:0}.frontier-rank{color:var(--muted-light);font-size:9px}.model-mini-logo{width:27px;height:27px;display:grid;place-items:center;border:1px solid #e8e1d9;border-radius:8px;background:linear-gradient(145deg,#fff,#f3eee8);color:var(--burgundy);font-size:9px;font-weight:800}.frontier-name{min-width:0;display:flex;flex-direction:column}.frontier-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.frontier-name small{color:var(--muted);font-size:7.5px}.frontier-score{height:4px;border-radius:4px;background:#eee8e2;overflow:hidden}.frontier-score i{height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,var(--burgundy),#b86989)}.frontier-row>strong{font-size:9px}
.models-signal-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.models-signal-grid article{padding:15px;display:flex;flex-direction:column;justify-content:center;min-height:120px}.models-signal-grid article.wide{grid-column:1/-1;min-height:105px}.models-signal-grid span{color:var(--muted);font-size:8px}.models-signal-grid strong{margin:6px 0 10px;font-size:10px}.models-signal-grid b{font-size:24px;line-height:1}.models-signal-grid small{margin-top:3px;color:var(--muted-light);font-size:7px}
.models-section{margin:30px 0}.models-section-title{margin-bottom:11px;display:flex;align-items:end;justify-content:space-between;gap:16px}.models-section-title h3{margin:0 0 3px;font-size:14px}.models-section-title p{margin:0;color:var(--muted);font-size:8.5px}.models-section-title>a,.models-section-title>button{padding:0;border:0;background:transparent;color:var(--ink);font:inherit;font-size:8px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}.models-section-title.compact{margin-bottom:12px}.models-section-title.compact h3{font-size:12px}
.router-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.router-card{min-height:115px;padding:13px;position:relative;display:flex;flex-direction:column;border:1px solid #e9e3dc;border-radius:11px;background:#fff;color:var(--ink);text-decoration:none;transition:.18s ease}.router-card:hover{transform:translateY(-2px);border-color:#d8c4cd;box-shadow:0 10px 24px rgba(82,40,57,.07)}.router-card>span{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:#f6f1eb;color:var(--burgundy)}.router-card svg{width:13px}.router-card strong{margin:9px 0 4px;font-size:9px}.router-card p{margin:0;color:var(--muted);font-size:7.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.router-card b{position:absolute;inset-inline-end:11px;inset-block-end:8px;color:var(--burgundy)}
.models-leaderboards{margin:30px 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.leaderboard-card{padding:16px}.leaderboard-head{padding:0 63px 7px 2px;display:grid;grid-template-columns:1fr 48px 48px 64px;gap:5px;border-bottom:1px solid #eee8e2;color:var(--muted-light);font-size:7px}.leaderboard-row{min-height:39px;display:grid;grid-template-columns:18px 27px minmax(100px,1fr) 48px 48px 64px;align-items:center;gap:5px;border-bottom:1px solid #f0ebe5;color:var(--ink);font-size:8px;text-decoration:none}.leaderboard-row:last-child{border:0}.leaderboard-row>b:first-child{color:var(--muted-light);font-weight:500}.leaderboard-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8.5px}.leaderboard-row:hover strong{color:var(--burgundy)}
.modality-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.modality-card{overflow:hidden;border:1px solid #e8e2db;border-radius:12px;background:#fff;color:var(--ink);text-decoration:none;transition:.18s ease}.modality-card:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(45,34,29,.08)}.modality-visual{height:105px;position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(140deg,#e7f5f5 0%,#f5edf6 52%,#f7eadf 100%)}.modality-visual:after{content:"";width:100px;height:100px;position:absolute;border:1px solid rgba(255,255,255,.7);border-radius:50%;box-shadow:0 0 45px rgba(255,255,255,.8)}.modality-visual span{z-index:1;color:#772044;font-size:28px;font-weight:700}.modality-visual i{width:42px;height:42px;position:absolute;border:1px solid rgba(119,32,68,.13);border-radius:11px;transform:rotate(30deg)}.modality-visual i:nth-of-type(2){transform:translate(32px,18px) rotate(50deg)}.modality-visual i:nth-of-type(3){transform:translate(-36px,-15px) rotate(12deg)}.modality-card>div:last-child{min-height:54px;padding:9px;display:grid;grid-template-columns:27px 1fr 12px;grid-template-rows:auto auto;gap:0 7px;align-items:center}.modality-card .model-mini-logo{grid-row:1/3}.modality-card strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8.5px}.modality-card small{color:var(--muted);font-size:7px}.modality-card b{grid-column:3;grid-row:1/3;color:var(--burgundy)}
.capability-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.capability-grid button{min-height:100px;padding:13px;display:grid;grid-template-columns:28px 1fr 12px;grid-template-rows:auto auto;align-items:center;gap:2px 8px;border:1px solid #e9e3dc;border-radius:11px;background:#fff;color:var(--ink);text-align:start;cursor:pointer;transition:.18s ease}.capability-grid button:hover{border-color:#d8bdc8;box-shadow:0 8px 20px rgba(78,40,54,.06)}.capability-grid button>span{width:28px;height:28px;grid-row:1/3;display:grid;place-items:center;border-radius:8px;background:#f6edf1;color:var(--burgundy);font-size:10px}.capability-grid strong{font-size:9px}.capability-grid small{color:var(--muted);font-size:7.5px}.capability-grid b{grid-column:3;grid-row:1/3;color:var(--burgundy)}.all-models-section{padding-top:22px;border-top:1px solid #eae4dd;scroll-margin-top:85px}.all-models-section .model-toolbar{box-shadow:none}
@media(max-width:1100px){.models-frontier-grid{grid-template-columns:1fr}.models-signal-grid{grid-template-columns:repeat(4,1fr)}.models-signal-grid article.wide{grid-column:auto}.router-strip,.modality-strip{grid-template-columns:repeat(3,1fr)}.router-card:nth-child(n+4),.modality-card:nth-child(n+4){display:none}}
@media(max-width:800px){.models-discovery-head{align-items:start;flex-direction:column}.models-frontier-card{padding:14px}.frontier-row{grid-template-columns:16px 27px minmax(100px,1fr) 60px 22px}.models-signal-grid{grid-template-columns:1fr 1fr}.models-signal-grid article.wide{grid-column:1/-1}.models-leaderboards{grid-template-columns:1fr}.router-strip,.modality-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.router-card,.modality-card{min-width:210px;scroll-snap-align:start}.router-card:nth-child(n),.modality-card:nth-child(n){display:flex}.capability-grid{grid-template-columns:1fr 1fr}.leaderboard-card{padding:12px}.leaderboard-head{display:none}.leaderboard-row{grid-template-columns:16px 27px minmax(110px,1fr) 40px 40px}.leaderboard-row span:last-child{display:none}}
@media(max-width:520px){.models-discovery-head h2{font-size:23px}.models-discovery-head .btn-secondary{width:100%;text-align:center}.models-signal-grid article{min-height:105px;padding:12px}.models-signal-grid b{font-size:20px}.frontier-score{display:none}.frontier-row{grid-template-columns:16px 27px 1fr 22px}.capability-grid{grid-template-columns:1fr}.models-section{margin:24px 0}.model-toolbar select{min-width:calc(50% - 5px)}}

/* Brand-first product studio */
.product-kicker{display:block;color:#9a7d4f;font-size:8px;font-weight:800;letter-spacing:.18em}.brand-page,.products-page,.builder-page{max-width:1180px;margin:auto}.brand-page__head,.builder-head{margin-bottom:24px;display:flex;align-items:flex-start;justify-content:space-between;gap:28px}.brand-page__head>div{max-width:720px}.brand-page__head h1,.products-hero h1,.builder-head h1{margin:5px 0 8px;color:#211d1a;font-size:clamp(28px,3.6vw,47px);line-height:1.08;letter-spacing:-.045em}.brand-page__head p,.products-hero p,.builder-head p{margin:0;color:#7b7067;font-size:11px;line-height:1.7}.brand-page__step{color:#a59688;font-size:10px}.brand-builder-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:18px}.brand-form-card{padding:26px;border:1px solid #e8e0d7;border-radius:20px;background:#fff;box-shadow:0 18px 45px rgba(54,40,30,.055)}.brand-card-title{margin-bottom:24px;display:flex;gap:12px}.brand-card-title>span{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;background:#f4e9ee;color:#7b1f46;font-size:9px;font-weight:800}.brand-card-title h2{margin:0 0 3px;font-size:17px}.brand-card-title p{margin:0;color:#8e8278;font-size:9px}.brand-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.brand-fields label,.builder-form>label,.builder-two label{display:flex;flex-direction:column;gap:6px}.brand-fields label>span,.brand-colors>span,.builder-form label>span{color:#635951;font-size:9px;font-weight:700}.brand-fields input,.brand-fields select,.builder-form input,.builder-form select,.builder-form textarea{width:100%;min-height:43px;padding:10px 12px;border:1px solid #e4ddd5;border-radius:10px;background:#fcfbf9;color:#28231f;font:inherit;font-size:10px;box-sizing:border-box}.brand-fields .wide{grid-column:1/-1}.brand-personalities{display:flex;gap:6px;flex-wrap:wrap}.brand-personalities button{padding:7px 13px;border:1px solid #e7dfd7;border-radius:20px;background:#fff;color:#665d55;font:inherit;font-size:9px;cursor:pointer}.brand-personalities button.active{border-color:#7b1f46;background:#7b1f46;color:#fff}.brand-colors{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.brand-colors>span{width:100%}.brand-colors label{height:40px;padding:5px 9px;display:flex;align-items:center;flex-direction:row;border:1px solid #e5ddd4;border-radius:10px;background:#fff}.brand-colors input{width:27px;min-height:27px;height:27px;padding:0;border:0}.brand-colors b{font-size:8px}.brand-save,.generate-product{width:100%;min-height:45px;margin-top:22px;padding:10px 15px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:11px;background:linear-gradient(135deg,#751d43,#9a315d);box-shadow:0 10px 24px rgba(117,29,67,.18);color:#fff;font:inherit;font-size:10px;font-weight:800;cursor:pointer}.brand-save b{font-size:16px}.brand-error{color:#a72545;font-size:9px}.brand-live-card{min-height:520px;padding:25px;position:relative;overflow:hidden;display:flex;flex-direction:column;border-radius:22px;background:linear-gradient(150deg,var(--brand-primary) 0%,#19171a 68%);box-shadow:0 26px 60px rgba(38,27,31,.2);color:#fff}.brand-live-card:before{content:"";width:320px;height:320px;position:absolute;inset:-120px -80px auto auto;border-radius:50%;background:var(--brand-accent);opacity:.23;filter:blur(2px)}.brand-live-card__top{z-index:1;display:flex;justify-content:space-between;color:rgba(255,255,255,.68);font-size:7px;letter-spacing:.15em}.brand-live-card__top i{width:7px;height:7px;border-radius:50%;background:#8ae2b1;box-shadow:0 0 0 5px rgba(138,226,177,.1)}.brand-monogram{width:86px;height:86px;margin:auto;position:relative;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:24px;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);font-size:31px;font-weight:800;box-shadow:0 16px 35px rgba(0,0,0,.2)}.brand-live-card__copy{position:relative}.brand-live-card__copy small{opacity:.65;font-size:8px}.brand-live-card__copy h2{margin:4px 0 5px;font-size:31px;letter-spacing:-.04em}.brand-live-card__copy p{margin:0;opacity:.78;font-size:10px}.brand-live-card__palette{margin:18px 0;display:flex;gap:6px}.brand-live-card__palette span{width:28px;height:7px;border-radius:6px}.brand-live-card__palette span:nth-child(3){background:#f7f0e7}.brand-live-card footer{padding-top:14px;display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.18);font-size:7px;letter-spacing:.1em}.brand-gate{min-height:66vh;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}.brand-gate>span{color:#b99358;font-size:35px}.brand-gate h1{max-width:620px;margin:12px 0;font-size:37px}.brand-gate p{max-width:540px;color:var(--muted);font-size:11px}.brand-gate a{margin-top:15px;padding:12px 20px;border-radius:11px;background:var(--burgundy);color:#fff;text-decoration:none;font-size:10px;font-weight:800}
.products-hero{margin-bottom:34px;padding:30px 34px;position:relative;overflow:hidden;display:grid;grid-template-columns:170px 1fr auto;align-items:center;gap:26px;border-radius:22px;background:linear-gradient(120deg,#f8f4ef,#fff);border:1px solid #e8e0d7}.products-hero:after{content:"";width:280px;height:280px;position:absolute;inset:-160px 10% auto auto;border-radius:50%;background:var(--brand-accent);opacity:.12}.products-hero__brand{display:flex;align-items:center;gap:10px}.products-hero__brand>span{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--brand-primary);color:#fff;font-size:16px;font-weight:800}.products-hero__brand div{display:flex;flex-direction:column}.products-hero__brand small{color:#998b7e;font-size:6px;letter-spacing:.12em}.products-hero__brand strong{font-size:11px}.products-hero h1{font-size:31px}.products-hero>a{z-index:1;color:#6f1e40;font-size:8px}.product-section__head{margin-bottom:12px;display:flex;align-items:end;justify-content:space-between}.product-section__head span{color:#9c8c7e;font-size:7px;letter-spacing:.15em}.product-section__head h2{margin:3px 0 0;font-size:18px}.product-section__head small{color:#a99b8f;font-size:8px}.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.product-card{padding:0;overflow:hidden;border:1px solid #e7dfd6;border-radius:17px;background:#fff;color:#29231f;text-align:start;font:inherit;box-shadow:0 9px 28px rgba(47,35,28,.045);transition:.2s ease}.product-card:is(button){cursor:pointer}.product-card:is(button):hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(47,35,28,.1)}.product-card__visual{height:210px;position:relative;overflow:hidden;background:linear-gradient(145deg,#25303b,#742044)}.product-card--video .product-card__visual:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,#e4a95d 0,transparent 28%),linear-gradient(145deg,transparent 40%,rgba(0,0,0,.5))}.product-card__visual>em{position:absolute;inset:12px 12px auto auto;padding:4px 7px;border-radius:12px;background:rgba(255,255,255,.17);color:#fff;font-size:7px;font-style:normal}.product-play{width:42px;height:42px;position:absolute;left:calc(50% - 21px);top:calc(50% - 21px);display:grid;place-items:center;border:1px solid rgba(255,255,255,.65);border-radius:50%;background:rgba(255,255,255,.16);color:#fff}.product-card--video .product-card__visual>div{position:absolute;inset:auto 18px 16px;display:flex;flex-direction:column;color:#fff}.product-card__visual div b{font-size:17px}.product-card__visual div small{opacity:.8;font-size:8px}.product-card--menu .product-card__visual{display:grid;place-items:center;background:linear-gradient(135deg,#efe5d5,#d9c4a5)}.menu-paper{width:42%;height:78%;padding:15px;box-sizing:border-box;background:#fffaf1;box-shadow:0 16px 28px rgba(67,47,28,.18);transform:rotate(-3deg);color:#4b3027;text-align:center}.menu-paper small{font-size:6px}.menu-paper strong{margin:5px 0 12px;display:block;font-family:var(--ui-font);font-size:14px}.menu-paper i{height:1px;margin:13px 0;display:block;background:#d9c5aa}.product-card__body{padding:17px 19px}.product-card__body>span{color:#a17e4e;font-size:7px}.product-card__body h3{margin:4px 0 6px;font-size:16px}.product-card__body p{margin:0;min-height:30px;color:#82766d;font-size:8.5px;line-height:1.6}.product-card__body footer{margin-top:14px;padding-top:11px;display:flex;justify-content:space-between;border-top:1px solid #eee8e1;font-size:7.5px}.product-card__body footer span{color:#94887e}.product-card__body footer b{color:#741e43}.product-card--soon{display:grid;grid-template-columns:110px 1fr}.soon-art{display:grid;place-items:center;background:linear-gradient(145deg,#f2ebe4,#e5d8cb)}.soon-art span{font-size:30px;color:#8a6d52}.recent-creations{margin-top:34px}.recent-creations article{min-height:62px;padding:10px 14px;display:grid;grid-template-columns:34px 1fr auto 100px;align-items:center;gap:10px;border-bottom:1px solid #eee8e1;background:#fff}.recent-creations article>span{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#f4eaf0;color:#7b1f46}.recent-creations article>div{display:flex;flex-direction:column}.recent-creations strong{font-size:9px}.recent-creations small,.recent-creations time{color:#988b81;font-size:7.5px}.recent-creations article>b{padding:5px 8px;border-radius:12px;background:#edf7f0;color:#37754b;font-size:7px;text-align:center}
.builder-head{align-items:center}.builder-head>button{width:36px;height:36px;border:1px solid #e3dbd2;border-radius:10px;background:#fff;cursor:pointer}.builder-head>div{flex:1}.builder-head>div>span{color:#a18256;font-size:7px;letter-spacing:.13em}.builder-head h1{font-size:30px}.builder-head>em{color:#9d9085;font-size:9px;font-style:normal}.builder-layout{display:grid;grid-template-columns:minmax(350px,.82fr) minmax(420px,1.18fr);gap:16px}.builder-form,.builder-preview{min-height:515px;border:1px solid #e7dfd6;border-radius:19px;background:#fff}.builder-form{padding:23px}.builder-progress{margin-bottom:25px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}.builder-progress i{height:3px;border-radius:3px;background:#e8e1d9}.builder-progress i.done,.builder-progress i.active{background:var(--brand-primary)}.builder-progress span{grid-column:1/-1;margin-top:5px;color:#9b8d81;font-size:7px}.builder-form{display:flex;flex-direction:column;gap:15px}.builder-form textarea{min-height:90px;resize:vertical}.builder-form textarea.tall{min-height:145px}.builder-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.generate-product{margin-top:auto}.generate-product:disabled{opacity:.65}.builder-note{text-align:center;color:#9c8f84;font-size:7px}.builder-preview{padding:18px;display:grid;place-items:center;overflow:hidden;background:#f5f0e9}.preview-empty{max-width:270px;text-align:center}.preview-empty>span{font-size:30px;color:var(--brand-primary)}.preview-empty h3{margin:8px 0 5px;font-size:14px}.preview-empty p{margin:0;color:#94877c;font-size:8px;line-height:1.6}.builder-preview.is-generated{padding:0}.video-result{width:100%;height:100%;min-height:515px;padding:23px;box-sizing:border-box;position:relative;display:flex;flex-direction:column;background:radial-gradient(circle at 75% 20%,var(--brand-accent),transparent 28%),linear-gradient(145deg,#172632,var(--brand-primary));color:#fff}.result-brand{font-size:11px;font-weight:800}.result-shot{position:absolute;inset:24px 23px auto auto;font-size:7px}.video-result__copy{margin-top:auto;max-width:75%}.video-result__copy small{opacity:.65;font-size:7px}.video-result__copy h2{margin:7px 0;font-size:34px;letter-spacing:-.04em}.video-result__copy p{opacity:.8;font-size:9px;line-height:1.6}.video-result__copy button{padding:8px 12px;border:1px solid rgba(255,255,255,.5);border-radius:18px;background:rgba(255,255,255,.15);color:#fff;font:inherit;font-size:8px}.menu-result{width:68%;min-height:445px;padding:32px;box-sizing:border-box;background:#fffdf8;box-shadow:0 20px 50px rgba(64,45,29,.15);color:var(--brand-primary)}.menu-result header{text-align:center}.menu-result header small{font-size:8px;font-weight:800}.menu-result header h2{margin:7px 0 2px;font-family:var(--ui-font);font-size:25px}.menu-result header span{font-size:5px;letter-spacing:.2em}.menu-result__items{margin:32px 0}.menu-result__items p{display:flex;align-items:center;gap:7px;font-size:8px}.menu-result__items i{height:1px;flex:1;border-bottom:1px dotted #c7b9a7}.menu-result footer{text-align:center;color:#9a8569;font-size:6px}
@media(max-width:900px){.brand-builder-grid,.builder-layout{grid-template-columns:1fr}.brand-live-card{min-height:420px}.products-hero{grid-template-columns:1fr}.product-grid{grid-template-columns:1fr}.builder-preview{min-height:480px}.product-card--soon{grid-template-columns:90px 1fr}}
@media(max-width:580px){.brand-fields,.builder-two{grid-template-columns:1fr}.brand-fields .wide{grid-column:auto}.brand-form-card{padding:18px}.brand-page__head{flex-direction:column}.products-hero{padding:22px}.products-hero__brand{display:none}.product-card__visual{height:180px}.product-card--soon{grid-template-columns:1fr}.soon-art{min-height:100px}.recent-creations article{grid-template-columns:34px 1fr}.recent-creations article time,.recent-creations article>b{display:none}.builder-head>em{display:none}.menu-result{width:88%}}

/* Brand and product experience refinements */
.brand-page__head{margin-bottom:18px}
.brand-builder-grid{grid-template-columns:minmax(0,1fr) 310px;align-items:start;gap:20px}
.brand-form-stack{display:flex;min-width:0;flex-direction:column;gap:16px}
.brand-form-card{padding:22px;border-radius:18px;box-shadow:0 12px 34px rgba(54,40,30,.05)}
.brand-card-title{margin-bottom:18px}
.brand-fields{gap:13px}
.brand-live-card{height:460px;min-height:0;position:sticky;top:86px;align-self:start;box-sizing:border-box;box-shadow:0 20px 48px rgba(38,27,31,.18)}
.brand-monogram{margin:58px auto 34px}

.products-hero{min-height:126px;margin-bottom:24px;padding:24px 28px;box-sizing:border-box;gap:24px}
.product-section{margin-bottom:32px}
.product-grid.product-grid--catalog{grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.product-grid--catalog .product-card--featured{grid-column:span 6}
.product-grid--catalog .product-card--compact{grid-column:span 4}
.product-card--compact .product-card__visual{height:135px}
.product-card--compact .product-card__body{padding:15px 17px}
.product-card--compact .product-card__body h3{font-size:14px}
.product-card--compact .product-card__body p{min-height:42px}

@media(max-width:900px){
  .brand-builder-grid{grid-template-columns:1fr}
  .brand-live-card{height:340px;min-height:0;position:relative;top:auto;order:-1}
  .brand-monogram{margin:34px auto 22px}
  .product-grid.product-grid--catalog{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-grid--catalog .product-card--featured,.product-grid--catalog .product-card--compact{grid-column:span 1}
}
@media(max-width:580px){
  .brand-live-card{height:320px;padding:20px}
  .brand-monogram{width:68px;height:68px;margin:25px auto 18px;font-size:25px}
  .product-grid.product-grid--catalog{grid-template-columns:1fr;gap:12px}
  .product-card--compact .product-card__visual{height:120px}
}

/* Unified premium studio system */
.studio-content{max-width:1580px;padding:26px clamp(22px,2.4vw,38px) 48px}
.brand-page,.products-page,.builder-page{max-width:1320px}
.studio-content .studio-icon{width:18px;height:18px}
.btn-primary,.btn-secondary,.btn-gold,.brand-save,.generate-product{min-height:40px;border-radius:11px;font-weight:700}
.btn-primary:focus-visible,.btn-secondary:focus-visible,.btn-gold:focus-visible,.product-card:focus-visible,.brand-save:focus-visible{outline:3px solid rgba(179,154,109,.28);outline-offset:2px}
.form-control,.brand-fields input,.brand-fields select,.builder-form input,.builder-form select,.builder-form textarea{min-height:46px;border-color:#ded5c9;border-radius:11px;background:#fdfcf9;font-size:12px;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.form-control:focus,.brand-fields input:focus,.brand-fields select:focus,.builder-form input:focus,.builder-form select:focus,.builder-form textarea:focus{outline:0;border-color:#a88a57;background:#fff;box-shadow:0 0 0 3px rgba(179,154,109,.12)}

.studio-context-bar{margin-bottom:22px!important;padding:12px 16px!important;border:1px solid #e3dbd0!important;border-radius:14px!important;background:rgba(255,255,255,.82)!important;box-shadow:0 7px 24px rgba(50,42,34,.035)}
.studio-context-label,.studio-context-meta,.product-section__eyebrow{display:inline-flex;align-items:center;gap:7px;color:#796b5f;font-size:10px;font-weight:800;letter-spacing:.055em}
.studio-context-label .studio-icon,.studio-context-meta .studio-icon,.product-section__eyebrow .studio-icon{width:15px;height:15px;color:#9a7a45}
.field-section-label{margin-bottom:8px;display:flex!important;align-items:center;gap:7px;color:#5c4434!important;font-size:11.5px!important;font-weight:750!important}.field-section-label--muted{color:#7b7168!important;font-size:10px!important;text-transform:uppercase;letter-spacing:.05em}.field-section-label .studio-icon{width:16px;height:16px;color:#9a7a45}
.studio-context-bar .btn-secondary,.studio-context-bar .btn-gold{min-height:34px;padding:6px 12px!important;border-radius:18px!important;font-size:10.5px!important}
.studio-context-bar .btn-secondary .studio-icon,.studio-context-bar .btn-gold .studio-icon{width:14px;height:14px}
.studio-notice-icon,.studio-empty-icon{width:42px;height:42px;display:grid!important;place-items:center;border:1px solid #dfd1bc;border-radius:13px;background:#f7f1e8;color:#8f6e3c}
.studio-empty-icon{margin:0 auto 12px}.studio-empty-icon .studio-icon{width:21px;height:21px}
.creation-type-icon{width:42px;height:42px;display:grid!important;place-items:center;border:1px solid #e0d6ca;border-radius:11px;background:#fff;color:#7c193f}.creation-type-icon .studio-icon{width:19px;height:19px}
.icon-heading,.icon-label{display:flex;align-items:center;gap:8px}.icon-heading .studio-icon{width:18px;height:18px;color:#9a7a45}.icon-label .studio-icon{width:16px;height:16px;color:#8b6d3d}

.brand-page__head{margin-bottom:20px;padding:12px 2px 18px;border-bottom:1px solid #ebe4da}
.brand-page__head h1{max-width:820px;font-size:clamp(34px,3.8vw,52px);font-weight:700;line-height:1.22;letter-spacing:-.035em}
[dir="rtl"] .brand-page__head h1{letter-spacing:0}
.brand-page__head p{max-width:760px;font-size:12px;line-height:1.8}
.brand-builder-grid{grid-template-columns:minmax(0,1fr) 330px;gap:22px}
.brand-form-stack{gap:18px}
.brand-form-card{padding:24px;border:1px solid #e5ddd2;border-radius:18px;box-shadow:0 12px 34px rgba(51,42,34,.045)}
.brand-card-title{margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #eee8df}
.brand-card-title>span{width:32px;height:32px;border-radius:10px;background:#f5eaf0;color:#7c193f}
.brand-card-title h2{font-size:18px}.brand-card-title p{font-size:10px;line-height:1.7}
.brand-live-card{width:100%;height:500px;top:82px;border:1px solid rgba(255,255,255,.14);background:radial-gradient(circle at 28% 5%,color-mix(in srgb,var(--brand-accent) 42%,transparent),transparent 38%),linear-gradient(155deg,var(--brand-primary),#171518 72%);box-shadow:0 24px 60px rgba(38,27,31,.19)}
.brand-monogram{margin:68px auto 38px}

.products-hero{min-height:166px;margin-bottom:32px!important;padding:28px 30px!important;border:1px solid #e1d7ca;border-radius:20px!important;background:linear-gradient(118deg,#fff 0%,#faf6ef 58%,#f2e9dc 100%);box-shadow:0 14px 38px rgba(50,41,32,.045)}
.products-hero:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(#7c193f,#b39a6d)}
.products-hero h1{margin:6px 0 9px;font-size:clamp(27px,2.8vw,38px);font-weight:750;line-height:1.25}
.products-hero p{max-width:720px;font-size:11.5px;line-height:1.85}
.products-hero>a{padding:8px 11px;border:1px solid rgba(124,25,63,.18);border-radius:9px;background:rgba(255,255,255,.7);color:#7c193f!important;text-decoration:none!important;font-size:9.5px!important;font-weight:700}
.products-hero__brand>span{width:54px;height:54px;border-radius:16px;box-shadow:0 9px 22px color-mix(in srgb,var(--brand-primary) 20%,transparent)}
.product-section{margin-bottom:42px!important}.product-section__head{margin-bottom:16px!important;padding-inline:2px}
.product-section__head h2{margin-top:6px;font-size:22px;line-height:1.4}.product-section__head small{font-size:9px}
.product-section__eyebrow{color:#8b6d3d!important;font-size:9px!important;letter-spacing:.08em!important}
.product-grid,.product-grid.product-grid--catalog{display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;gap:16px!important}
.product-grid.product-grid--catalog>.product-card:first-child{grid-column:span 12}
.product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:span 3}
.product-grid:not(.product-grid--catalog)>.product-card{grid-column:span 6}
.product-card{padding:0!important;overflow:hidden;border:1px solid #e4dcd1!important;border-radius:18px;background:#fff!important;text-align:start!important;box-shadow:0 10px 30px rgba(47,38,31,.05);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.product-card:hover{transform:translateY(-4px)!important;border-color:#ccb995!important;box-shadow:0 18px 42px rgba(47,38,31,.1)!important}
.product-grid--catalog>.product-card:first-child{display:grid;grid-template-columns:minmax(300px,1.05fr) minmax(320px,.95fr)}
.product-grid--catalog>.product-card:first-child .product-card__visual{height:260px}
.product-grid--catalog>.product-card:not(:first-child) .product-card__visual{height:155px}
.product-card__visual{height:210px}.product-card__visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.16));pointer-events:none}
.product-card__body{position:relative;z-index:1;padding:18px 20px}.product-card__body>span{font-size:8px;font-weight:700;letter-spacing:.04em}.product-card__body h3{margin:7px 0;font-size:16px;line-height:1.45}.product-card__body p{min-height:42px;font-size:9px;line-height:1.75}.product-card__body footer{margin-top:16px;padding-top:13px;font-size:8px}
.product-visual-icon{width:48px;height:48px;margin:0 auto 10px;display:grid!important;place-items:center;border:1px solid rgba(255,255,255,.5);border-radius:14px;background:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(6px)}
.product-visual-icon .studio-icon{width:25px;height:25px}.product-play .studio-icon{width:18px;height:18px}
.recent-creations{margin-top:34px!important;border-radius:18px!important;box-shadow:0 10px 32px rgba(47,38,31,.04)}

.builder-page{max-width:1280px}.builder-head{margin-bottom:20px!important;padding:8px 0 18px;border-bottom:1px solid #e8e1d8;align-items:center!important}
.builder-head h1{font-size:clamp(25px,2.7vw,35px)!important;line-height:1.35}.builder-head p{font-size:11.5px!important}.builder-head .badge{display:inline-flex;align-items:center;gap:5px}.builder-head .badge .studio-icon,.builder-head>div:last-child .studio-icon{width:14px;height:14px}
.builder-layout{display:grid!important;grid-template-columns:minmax(390px,.92fr) minmax(440px,1.08fr)!important;gap:20px!important;align-items:start!important}
.builder-form,.builder-preview{min-height:560px;padding:26px!important;border:1px solid #e2d9ce!important;border-radius:18px!important;background:#fff!important;box-shadow:0 14px 40px rgba(48,39,31,.05)}
.builder-form{gap:17px}.builder-form>label{margin-bottom:0!important}.builder-form>label>span{font-size:11.5px!important;color:#403932!important}.builder-form textarea{min-height:116px}
.builder-progress{margin-bottom:4px!important;padding-bottom:17px;border-bottom:1px solid #eee8df}.builder-progress i{height:4px!important}.builder-progress span{font-size:9.5px!important}
.builder-brand-note{display:inline-flex;align-items:center;gap:6px}.builder-brand-note .studio-icon{width:14px;height:14px;color:#a58045}.builder-preview .btn-secondary .studio-icon{width:14px;height:14px}.builder-preview [style*="text-transform: uppercase"]{display:flex!important;align-items:center;gap:7px}.builder-preview [style*="text-transform: uppercase"] .studio-icon{width:15px;height:15px}
.builder-preview{position:sticky;top:82px;display:grid;place-items:center;overflow:auto}
.builder-empty-state{min-height:500px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:var(--muted)}
.builder-empty-state__icon{width:58px;height:58px;margin-bottom:16px;display:grid;place-items:center;border:1px solid #ddcfba;border-radius:18px;background:linear-gradient(145deg,#fbf8f2,#efe5d6);color:#936f3a;box-shadow:0 10px 28px rgba(93,68,31,.08)}
.builder-empty-state__icon .studio-icon{width:28px;height:28px}.builder-empty-state h3{font-size:17px!important}.builder-empty-state p{max-width:370px;font-size:11px!important;line-height:1.8!important}

@media(max-width:1100px){
 .product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:span 6}
 .builder-layout{grid-template-columns:1fr!important}.builder-preview{position:relative;top:auto;min-height:460px;order:-1}.builder-empty-state{min-height:390px}
}
@media(max-width:900px){
 .brand-builder-grid{grid-template-columns:1fr}.brand-live-card{height:370px;position:relative;top:auto;order:-1}.brand-monogram{margin:38px auto 24px}
 .products-hero{grid-template-columns:1fr;min-height:0}.products-hero__brand{order:-1}.product-grid--catalog>.product-card:first-child{display:block}.product-grid--catalog>.product-card:first-child .product-card__visual{height:220px}
}
@media(max-width:650px){
 .studio-content{padding:18px 13px 36px}.studio-context-bar{padding:10px!important}.brand-page__head h1{font-size:31px}.brand-form-card{padding:18px}
 .product-grid,.product-grid.product-grid--catalog{grid-template-columns:1fr!important}.product-grid.product-grid--catalog>.product-card,.product-grid:not(.product-grid--catalog)>.product-card{grid-column:1!important}.product-grid--catalog>.product-card:not(:first-child) .product-card__visual{height:145px}
 .builder-layout{display:flex!important;flex-direction:column}.builder-form,.builder-preview{width:100%;min-height:auto;padding:18px!important}.builder-preview{order:-1}.builder-empty-state{min-height:300px}.builder-head>div:last-child{display:none!important}
}

/* Product builder refinement: shared by every /studio/create/{type} page. */
.builder-page{max-width:1220px}
.builder-head{min-height:118px;margin-bottom:24px!important;padding:18px 4px 22px!important;display:flex;align-items:center!important;justify-content:space-between;gap:28px;border-bottom:1px solid #e6ded3}
.builder-head__main{min-width:0;display:flex;align-items:flex-start;gap:15px}
.builder-back{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border:1px solid #ded5c9;border-radius:50%;background:#fff;color:#54483e;cursor:pointer;box-shadow:0 5px 18px rgba(49,39,31,.04);transition:.18s ease}
.builder-back:hover{border-color:#bca77f;background:#faf6ef;color:#7c193f;transform:translateX(2px)}
.builder-back .studio-icon{width:18px;height:18px}[dir="ltr"] .builder-back .studio-icon{transform:rotate(180deg)}
.builder-head__title{min-width:0;max-width:760px}.builder-head__eyebrow{margin-bottom:9px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.builder-head__title h1{margin:0!important;color:#211d19!important;font-family:var(--ui-font);font-size:clamp(27px,2.5vw,36px)!important;font-weight:700!important;line-height:1.28!important;letter-spacing:0!important}
[dir="ltr"] .builder-head__title h1{font-family:var(--ui-font);letter-spacing:-.035em!important}
.builder-head__title p{max-width:700px;margin:7px 0 0!important;color:#7a7168!important;font-size:11.5px!important;line-height:1.8}
.builder-brand-chip{min-height:25px;padding:4px 9px;display:inline-flex;align-items:center;gap:5px;border:1px solid #e2d9ce;border-radius:15px;background:#faf7f2;color:#65584d;font-size:9px;font-weight:700}
.builder-brand-chip .studio-icon{width:13px;height:13px;color:#9a7a45}
.builder-head__meta{flex:0 0 auto;display:flex;align-items:center;gap:10px}
.builder-personality{min-height:34px;padding:7px 11px;display:inline-flex;align-items:center;gap:7px;border:1px solid #e3dacd;border-radius:18px;background:#fff;color:#8a7048;font-size:9.5px;font-weight:700}
.builder-personality .studio-icon{width:14px;height:14px}.builder-step{color:#a18f7c;font-family:var(--ui-font);font-size:9px;font-weight:700;letter-spacing:.13em;direction:ltr}
.builder-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:22px!important}
.builder-form,.builder-preview{min-height:520px;padding:24px!important;border-radius:17px!important;box-shadow:0 12px 34px rgba(49,39,31,.045)}
.builder-form{gap:15px}.builder-progress{margin:0 0 3px!important;padding:0 0 17px!important;display:flex!important;align-items:center;justify-content:space-between;gap:18px}
.builder-progress>div{display:flex;align-items:center;gap:6px}.builder-progress i{width:28px;height:3px!important;display:block;border-radius:3px}.builder-progress span{margin:0!important;color:#5f5045!important;font-size:10.5px!important;font-weight:750!important}
.builder-two{margin-bottom:2px;gap:12px}.builder-two label{gap:6px}.builder-two label>span{color:#493f37;font-size:10.5px;font-weight:700}
.builder-submit{width:100%;min-height:52px;margin-top:5px;padding:12px 18px!important;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:12px!important;background:linear-gradient(135deg,#a98b56,#c2a773)!important;color:#fff;font-size:13px!important;font-weight:800!important;box-shadow:0 10px 24px rgba(162,129,76,.18)}
.builder-submit:hover:not(:disabled){background:linear-gradient(135deg,#947544,#af925e)!important;transform:translateY(-1px);box-shadow:0 14px 28px rgba(142,108,57,.22)}
.builder-form-footer{margin-top:1px;padding-top:13px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #eee8df;color:#8c8177;font-size:9.5px}
.builder-form-footer>span:last-child{flex:0 0 auto;color:#8f7247;font-family:var(--ui-font);font-weight:700}
.builder-preview{top:84px;overflow:hidden;background:linear-gradient(145deg,#fdfcf9,#f7f2eb)!important}
.builder-preview:before{content:"";position:absolute;width:280px;height:280px;inset:-170px auto auto -120px;border:1px solid rgba(179,154,109,.16);border-radius:50%;box-shadow:0 0 0 55px rgba(179,154,109,.025);pointer-events:none}
.builder-empty-state{min-height:470px;position:relative;z-index:1}.builder-empty-state__icon{width:56px;height:56px;margin-bottom:15px;border-radius:17px;background:#fff;color:#8d6c3a;box-shadow:0 12px 30px rgba(82,62,35,.08)}
.preview-empty-eyebrow{margin-bottom:8px;color:#9b7d4e;font-family:var(--ui-font);font-size:7.5px;font-weight:800;letter-spacing:.15em;direction:ltr}
.builder-empty-state h3{margin:0 0 7px!important;color:#342d27!important;font-size:16px!important;font-weight:700}.builder-empty-state p{margin:0;max-width:360px!important;color:#837970;font-size:10.5px!important;line-height:1.85!important}
@media(max-width:1100px){.builder-head{align-items:flex-start!important}.builder-head__meta{padding-top:7px}.builder-layout{grid-template-columns:1fr!important}.builder-preview{position:relative;top:auto;order:0}.builder-empty-state{min-height:360px}}
@media(max-width:700px){.builder-head{min-height:0;padding:10px 0 17px!important}.builder-head__main{gap:10px}.builder-back{width:36px;height:36px;flex-basis:36px}.builder-head__title h1{font-size:25px!important}.builder-head__meta{display:none}.builder-head__eyebrow{margin-bottom:6px}.builder-layout{display:flex!important;flex-direction:column}.builder-form{order:0}.builder-preview{order:1}.builder-form,.builder-preview{padding:17px!important}.builder-progress{align-items:flex-start;flex-direction:column-reverse;gap:9px}.builder-empty-state{min-height:285px}.builder-two{grid-template-columns:1fr}.builder-form-footer{align-items:flex-start;flex-direction:column}.builder-submit{font-size:11.5px!important}}

/* Shared presentation for advanced AI product studios. */
.product-studio,.product-admin-page,.product-collection-page{width:min(1180px,100%);margin-inline:auto}
.product-studio.gemini-studio{min-height:auto;padding:0 0 42px}
.product-studio .gemini-studio__intro{min-height:178px;margin:0 0 26px;padding:30px;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;border:1px solid #e3d9cc;border-radius:20px;background:radial-gradient(circle at 50% -55%,rgba(179,154,109,.2),transparent 52%),linear-gradient(120deg,#fff,#faf6ef);box-shadow:0 14px 38px rgba(49,39,31,.045)}
.product-studio .gemini-studio__intro:before{display:none}.product-studio .gemini-studio__mark{width:46px;height:46px;margin-bottom:13px;display:grid;place-items:center;border:1px solid #dfd1bc;border-radius:14px;background:#fff;color:#8f6e3c;box-shadow:0 9px 24px rgba(85,63,32,.07)}
.product-studio .gemini-studio__mark .studio-icon{width:22px;height:22px}.product-studio .gemini-studio__intro h1{color:#211d19;font-family:var(--ui-font);font-size:clamp(30px,3.4vw,43px);font-weight:700;line-height:1.3;letter-spacing:0}.product-studio .gemini-studio__intro p{margin-top:8px;color:#7c736a;font-size:12px;line-height:1.75}
.product-studio .gemini-composer{width:min(900px,100%);border-color:#ded4c7;border-radius:17px;background:#fff;box-shadow:0 16px 44px rgba(48,39,31,.065)}
.product-studio .gemini-composer textarea{min-height:120px;padding:21px 23px;font-size:13px}.product-studio .gemini-composer__bar{min-height:58px;background:#faf7f2}.product-studio .gemini-tool{display:inline-flex;align-items:center;gap:7px}.product-studio .gemini-tool .studio-icon{width:15px;height:15px}.product-studio .gemini-send{width:42px;height:42px;border-radius:12px;background:#7c193f;transform:none!important}.product-studio .gemini-send:hover:not(:disabled){background:#651331;transform:translateY(-1px)!important}.product-studio .gemini-send .studio-icon{width:17px;height:17px;transform:rotate(180deg)}[dir="ltr"] .product-studio .gemini-send .studio-icon{transform:none}.product-studio .gemini-send .spinner{width:15px;height:15px;border-width:2px}
.product-studio .gemini-options{gap:12px}.product-studio .gemini-options select{min-height:40px;border-color:#ded5c9;background:#fff}.product-studio .gemini-result-grid,.product-studio .gemini-job{margin-bottom:22px}

.product-admin-page,.product-collection-page{padding-bottom:42px}.product-page-head{min-height:108px;margin-bottom:22px;padding:14px 2px 20px;align-items:center;border-bottom:1px solid #e6ded3}.product-page-head>div:first-child{max-width:760px}.product-page-head h2{color:#211d19;font-family:var(--ui-font);font-size:clamp(27px,2.8vw,37px);font-weight:700;line-height:1.35;letter-spacing:0}.product-page-head p{margin-top:7px;color:#7a7168;font-size:11.5px;line-height:1.8}.product-page-head .page-eyebrow{margin-bottom:7px;color:#9a7a45}
.product-workbench{margin-bottom:22px!important;padding:26px!important;border:1px solid #e2d9ce!important;border-radius:18px!important;background:#fff!important;box-shadow:0 14px 40px rgba(48,39,31,.05)}
.product-workbench textarea.form-control{min-height:130px;padding:15px;line-height:1.8}.product-options-grid{margin-bottom:20px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.product-options-grid>div{padding:14px;border:1px solid #ebe4da;border-radius:13px;background:#fdfbf8}.product-options-grid input[type="range"]{accent-color:#7c193f}
.product-workbench__footer{padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #eee8df}.product-workbench__footer .btn-primary{min-height:44px;padding-inline:20px}.product-result-card{padding:20px!important;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #d6c49f!important;border-radius:16px!important;background:#faf6ed!important}

.product-collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.product-collection-card{min-height:260px;padding:24px!important;display:flex;flex-direction:column;border:1px solid #e3dbd0!important;border-radius:18px!important;background:#fff!important;box-shadow:0 12px 34px rgba(48,39,31,.045);transition:.2s ease}.product-collection-card:hover{transform:translateY(-3px);border-color:#cdbb98!important;box-shadow:0 19px 42px rgba(48,39,31,.085)}.product-collection-card h3{font-family:var(--ui-font) !important;font-size:17px!important;line-height:1.45}.product-collection-card>p{min-height:58px!important;font-size:11px!important;line-height:1.75!important}.product-collection-card>.btn-secondary{margin-top:auto;min-height:42px;border-color:#d9cdbd}
.product-collection-page--avatars{width:min(1240px,100%)}.product-collection-page--avatars .avatar-summary{border-radius:17px;box-shadow:0 10px 30px rgba(48,39,31,.035)}.product-collection-page--avatars .avatar-management-card{border-color:#e3dbd0;border-radius:18px}.avatar-search .studio-icon{width:17px;height:17px;color:#8b6d3d}.avatar-copy .studio-icon{width:15px;height:15px}.avatar-create-card>span .studio-icon{width:22px;height:22px}
@media(max-width:850px){.product-options-grid{grid-template-columns:1fr}.product-collection-grid{grid-template-columns:1fr}.product-workbench__footer,.product-result-card{align-items:flex-start;flex-direction:column}.product-studio .gemini-studio__intro{min-height:155px;padding:24px 18px}.product-studio .gemini-studio__intro h1{font-size:29px}.product-page-head{align-items:flex-start;flex-direction:column}.product-page-head .page-actions,.product-page-head>.btn-primary{width:100%}.product-page-head .page-actions .btn-primary,.product-page-head>.btn-primary{justify-content:center}}

/* Typography and icon alignment for secondary actions. */
.page-actions .btn-secondary,.page-actions .btn-gold,.page-help-button{font-family:var(--ui-font);font-size:11px;font-weight:600;line-height:1.35;letter-spacing:0}
[dir="ltr"] .page-actions .btn-secondary,[dir="ltr"] .page-actions .btn-gold,[dir="ltr"] .page-help-button{font-family:var(--ui-font)}
.page-actions .btn-secondary{min-height:38px;padding:8px 13px;border-color:#ded5c9;border-radius:10px;background:#fff;color:#4e453d;box-shadow:none}
.page-actions .btn-secondary:hover{border-color:#bda77e;background:#faf7f1;color:#6f1e40}
.page-actions .btn-secondary .studio-icon,.page-actions .btn-gold .studio-icon{width:15px;height:15px;color:#927344}
.page-actions .btn-secondary.btn-gold{border-color:#a98b56;background:#a98b56;color:#fff}.page-actions .btn-secondary.btn-gold .studio-icon{color:#fff}
.page-help-button{min-height:34px;padding:6px 10px;gap:7px;border-radius:9px;color:#554b42}.page-help-button>.studio-icon{width:18px;height:18px;color:#9a7a45}.help-dialog__icon .studio-icon{width:22px;height:22px}

/* AI products catalog: balanced discovery and compact creation ledger. */
.products-page{max-width:1240px}.products-page .products-hero{margin-bottom:38px!important}.products-page .product-section{margin-bottom:46px!important}
.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:span 6}
.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__visual{height:175px}
.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__body{min-height:168px;padding:19px 21px}
.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__body h3{font-size:16px}
.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__body p{min-height:38px;font-size:9.5px}
.products-page .product-grid:not(.product-grid--catalog)>.product-card .product-card__visual{height:220px}
.products-page .product-grid:not(.product-grid--catalog)>.product-card .product-card__body{min-height:160px;padding:20px 22px}
.creation-ledger{margin-top:18px!important;padding:24px!important;border:1px solid #e2d9ce!important;border-radius:19px!important;background:#fff!important;box-shadow:0 14px 38px rgba(48,39,31,.045)}
.creation-ledger .product-section__head{margin-bottom:18px!important;padding-bottom:16px;border-bottom:1px solid #ece5dc}
.creation-list{display:flex;flex-direction:column;gap:8px}.creation-row{min-height:82px;padding:13px 15px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;border:1px solid #e9e2d9;border-radius:13px;background:#fcfaf7;transition:.18s ease}.creation-row:hover{border-color:#d4c5ad;background:#fff;box-shadow:0 7px 20px rgba(48,39,31,.045)}
.creation-row__identity{min-width:0;display:flex;align-items:center;gap:13px}.creation-row__identity>div{min-width:0}.creation-row__identity strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px!important}.creation-row__identity small{display:block;margin-top:3px;overflow:hidden;color:#8b8178!important;font-size:9px!important;text-overflow:ellipsis;white-space:nowrap}
.creation-row__actions{display:flex;align-items:center;gap:9px}.creation-row__actions .badge{padding:5px 8px;font-size:8.5px!important}.creation-row__actions>span:not(.badge),.creation-row__actions time{font-size:8.5px!important}.creation-row__actions .btn-secondary{min-height:32px;padding:5px 9px!important;font-size:8.5px!important;border-radius:8px}.creation-row__actions .btn-secondary .studio-icon{width:13px;height:13px}
@media(max-width:860px){.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:span 12}.creation-row{grid-template-columns:1fr}.creation-row__actions{padding-top:10px;border-top:1px solid #eee7de;flex-wrap:wrap}}
@media(max-width:560px){.creation-ledger{padding:15px!important}.creation-row__actions time{display:none}.creation-row__actions .btn-secondary:first-of-type{margin-inline-start:auto}.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__visual{height:150px}}

/* Image studio: visual-first creative workspace. */
.product-studio--image{max-width:1160px!important}.product-studio--image .image-studio-hero{min-height:310px;margin-bottom:28px;padding:34px 40px;display:grid;grid-template-columns:minmax(0,1fr) 47%;gap:38px;text-align:start;background:radial-gradient(circle at 18% 15%,rgba(217,178,111,.2),transparent 35%),linear-gradient(125deg,#fffdf9 0%,#f8f1e8 56%,#efe3d6 100%)}
.image-studio-hero__copy{position:relative;z-index:2;align-self:center}.image-studio-hero__eyebrow{display:inline-flex;align-items:center;gap:8px;color:#976f38;font-size:10px;font-weight:800;letter-spacing:.15em}.image-studio-hero__eyebrow .studio-icon{width:16px;height:16px}.product-studio--image .image-studio-hero h1{max-width:570px;margin-top:16px;font-size:clamp(32px,4vw,50px);line-height:1.18}.product-studio--image .image-studio-hero p{max-width:540px;margin:13px 0 0;font-size:13px}.image-studio-hero__meta{margin-top:22px;display:flex;gap:9px;flex-wrap:wrap}.image-studio-hero__meta span{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgba(130,91,52,.15);border-radius:999px;background:rgba(255,255,255,.65);color:#665b50;font-size:9.5px;font-weight:700}.image-studio-hero__meta .studio-icon{width:13px;height:13px;color:#8d1c48}
.image-studio-hero__media{position:relative;min-height:240px;direction:ltr}.image-studio-hero__frame{position:absolute;margin:0;overflow:hidden;border:5px solid rgba(255,255,255,.92);border-radius:18px;background:#ddd;box-shadow:0 22px 50px rgba(57,39,27,.18)}.image-studio-hero__frame img{width:100%;height:100%;display:block;object-fit:cover}.image-studio-hero__frame--main{inset:8px 58px 8px 30px;transform:rotate(-2deg)}.image-studio-hero__frame--top{width:145px;height:105px;right:0;top:-3px;transform:rotate(5deg)}.image-studio-hero__frame--bottom{width:155px;height:112px;right:4px;bottom:-5px;transform:rotate(3deg)}
.image-inspiration{width:min(1040px,100%);margin:0 auto 24px}.image-inspiration__head{margin-bottom:13px;display:flex;align-items:end;justify-content:space-between;gap:20px}.image-inspiration__head span{color:#a07a43;font-size:8.5px;font-weight:800;letter-spacing:.15em}.image-inspiration__head h2{margin:4px 0 0;color:#251f1a;font-size:19px}.image-inspiration__head small{color:#8b8279;font-size:9.5px}.image-inspiration__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.image-idea{position:relative;height:176px;padding:0;overflow:hidden;border:0;border-radius:16px;background:#302820;cursor:pointer;text-align:start;box-shadow:0 12px 28px rgba(45,35,28,.09);isolation:isolate}.image-idea img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .45s ease}.image-idea__shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 15%,rgba(18,13,11,.15) 45%,rgba(20,13,12,.88) 100%)}.image-idea__content{position:absolute;inset:auto 16px 14px;z-index:2;display:flex;flex-direction:column;align-items:flex-start;color:#fff}.image-idea__content small{color:#ead3ad;font-size:8.5px}.image-idea__content strong{margin-top:3px;font-size:13px}.image-idea__content>span{margin-top:8px;display:flex;align-items:center;gap:5px;opacity:.82;font-size:8.5px;font-weight:700}.image-idea__content .studio-icon{width:12px;height:12px}.image-idea:hover img{transform:scale(1.055)}.image-idea:hover{box-shadow:0 17px 34px rgba(45,35,28,.16)}
.product-studio--image .image-composer{width:min(1040px,100%)}.image-composer__label{padding:15px 22px 0;display:flex;align-items:center;gap:8px;color:#51473e;font-size:10px;font-weight:800}.image-composer__label .studio-icon{width:15px;height:15px;color:#9a1748}.image-composer__label small{margin-inline-start:auto;color:#a49a90;font-size:8px;font-weight:500}.product-studio--image .image-composer textarea{min-height:105px;padding-top:12px}.image-result-gallery{width:min(1040px,100%)!important}.image-result-gallery .gemini-result{border-radius:20px;box-shadow:0 20px 48px rgba(45,35,28,.12)}.image-result-gallery .gemini-result img{max-height:680px}
@media(max-width:900px){.product-studio--image .image-studio-hero{grid-template-columns:1fr;gap:24px;padding:28px}.image-studio-hero__media{min-height:230px}.image-inspiration__grid{grid-template-columns:1fr 1fr}.image-inspiration__grid .image-idea:last-child{grid-column:1/-1}.image-inspiration{padding-inline:4px}}
@media(max-width:600px){.product-studio--image .image-studio-hero{padding:24px 19px}.product-studio--image .image-studio-hero h1{font-size:31px}.image-studio-hero__media{min-height:190px}.image-studio-hero__frame--main{inset:5px 35px 5px 5px}.image-studio-hero__frame--top{width:105px;height:78px}.image-studio-hero__frame--bottom{width:112px;height:82px}.image-inspiration__head{align-items:flex-start;flex-direction:column;gap:4px}.image-inspiration__grid{grid-template-columns:1fr}.image-inspiration__grid .image-idea:last-child{grid-column:auto}.image-idea{height:160px}.image-composer__label{padding-inline:16px}}

/* Brand library: make multi-brand ownership explicit and discoverable. */
.brand-library{margin:18px 0 24px;padding:22px;border:1px solid #e3dacf;border-radius:19px;background:linear-gradient(135deg,#fff 0%,#fbf8f3 100%);box-shadow:0 13px 36px rgba(48,39,31,.045)}.brand-library__head{margin-bottom:17px;display:flex;align-items:flex-end;justify-content:space-between;gap:24px}.brand-library__eyebrow{color:#a27d47;font-size:8.5px;font-weight:800;letter-spacing:.14em}.brand-library__head h2{margin:3px 0 2px;color:#251f1a;font-size:19px}.brand-library__head p{margin:0;color:#8a8179;font-size:9.5px}.brand-library__count{min-width:92px;padding:9px 12px;border:1px solid #e2d8ca;border-radius:11px;background:#fff;color:#7c193f;font-size:19px;font-weight:800;text-align:center}.brand-library__count small{display:block;color:#8d847b;font-size:8px;font-weight:600}.brand-library__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.brand-library-card{min-width:0;padding:0;overflow:hidden;border:1px solid #e2d9ce;border-radius:15px;background:#fff;color:#28211c;cursor:pointer;text-align:start;box-shadow:0 7px 20px rgba(48,39,31,.035);transition:.2s ease}.brand-library-card:hover{border-color:#c8b390;transform:translateY(-2px);box-shadow:0 14px 28px rgba(48,39,31,.09)}.brand-library-card.is-active{border-color:#8b1b46;box-shadow:0 0 0 2px rgba(139,27,70,.1),0 14px 30px rgba(67,24,40,.1)}.brand-library-card__cover{position:relative;height:90px;display:block;overflow:hidden;background:radial-gradient(circle at 75% 20%,var(--brand-accent),transparent 28%),linear-gradient(135deg,var(--brand-primary),var(--brand-secondary))}.brand-library-card__cover:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.13),transparent 42%,rgba(0,0,0,.12))}.brand-library-card__logo{position:absolute;z-index:2;inset:auto 13px 12px auto;width:43px;height:43px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.42);border-radius:12px;background:rgba(255,255,255,.88);color:var(--brand-primary);box-shadow:0 8px 20px rgba(0,0,0,.12)}.brand-library-card__logo img{width:100%;height:100%;object-fit:contain}.brand-library-card__logo strong{font-size:14px}.brand-library-card__palette{position:absolute;z-index:2;bottom:13px;left:13px;display:flex;gap:4px}.brand-library-card__palette i{width:20px;height:4px;border-radius:99px;background:var(--brand-primary)}.brand-library-card__palette i:nth-child(2){background:var(--brand-accent)}.brand-library-card__palette i:nth-child(3){background:#fff}.brand-library-card__body{min-height:102px;padding:13px 14px;display:flex;flex-direction:column}.brand-library-card__title{display:flex;align-items:center;justify-content:space-between;gap:6px}.brand-library-card__title strong{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.brand-library-card__title em{display:flex;align-items:center;gap:3px;padding:3px 5px;border-radius:99px;background:#f5ecdd;color:#87652f;font-size:7px;font-style:normal;white-space:nowrap}.brand-library-card__title em .studio-icon{width:9px;height:9px}.brand-library-card__body>small{margin-top:5px;color:#90867d;font-size:8px}.brand-library-card__action{margin-top:auto;padding-top:10px;display:flex;align-items:center;gap:4px;color:#8b1b46;font-size:8.5px;font-weight:800}.brand-library-card__action .studio-icon{width:11px;height:11px}.brand-library-card.is-active .brand-library-card__action{color:#2e7657}.brand-library-card--new{min-height:192px;padding:22px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;border-style:dashed;background:rgba(249,245,238,.62);text-align:center}.brand-library-card__new-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;background:#7c193f;color:#fff;box-shadow:0 9px 22px rgba(124,25,63,.2)}.brand-library-card__new-icon .studio-icon{width:19px;height:19px}.brand-library-card--new strong{display:block;font-size:11px}.brand-library-card--new small{display:block;margin-top:4px;color:#91867d;font-size:8px}.brand-library__loading{min-height:100px;display:flex;align-items:center;justify-content:center;gap:9px;color:#857b72;font-size:10px}
@media(max-width:1050px){.brand-library__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.brand-library__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-library__head{align-items:flex-start;flex-direction:column;gap:10px}.brand-library__count{align-self:flex-start}}@media(max-width:480px){.brand-library{padding:15px}.brand-library__grid{grid-template-columns:1fr}.brand-library-card__cover{height:105px}.brand-library-card--new{min-height:150px}}

/* Progressive brand onboarding: basics first, identity depth later. */
.brand-quick-create{width:min(880px,100%);margin:24px auto 42px;overflow:hidden;border:1px solid #ded3c5;border-radius:22px;background:#fff;box-shadow:0 22px 58px rgba(48,39,31,.085)}.brand-quick-create__intro{padding:30px 34px 25px;text-align:center;background:radial-gradient(circle at 50% -35%,rgba(217,178,111,.26),transparent 52%),linear-gradient(135deg,#fffdf9,#f8f2e9)}.brand-quick-create__step{width:38px;height:38px;margin:0 auto 10px;display:grid;place-items:center;border-radius:12px;background:#7c193f;color:#fff;font-size:11px;font-weight:800;box-shadow:0 9px 22px rgba(124,25,63,.18)}.brand-quick-create__intro h2{margin:5px 0 6px;color:#241e19;font-size:25px}.brand-quick-create__intro>p{max-width:590px;margin:0 auto;color:#7f756d;font-size:11px;line-height:1.8}.brand-quick-create__journey{max-width:520px;margin:22px auto 0;display:flex;align-items:center;justify-content:center;gap:8px}.brand-quick-create__journey>span{display:flex;align-items:center;gap:6px;color:#9a9086;font-size:8.5px;font-weight:700;white-space:nowrap}.brand-quick-create__journey b{width:22px;height:22px;display:grid;place-items:center;border:1px solid #d9cec0;border-radius:50%;background:#fff;color:#8d8175;font-size:8px}.brand-quick-create__journey .is-current{color:#7c193f}.brand-quick-create__journey .is-current b{border-color:#7c193f;background:#7c193f;color:#fff}.brand-quick-create__journey i{width:34px;height:1px;background:#ddd3c6}.brand-quick-create__form{padding:28px 34px 32px;display:grid;grid-template-columns:1fr 1fr;gap:19px}.brand-quick-field{display:flex;flex-direction:column;gap:7px}.brand-quick-field>span{color:#332b25;font-size:10px;font-weight:800}.brand-quick-field>span b{color:#9a1748}.brand-quick-field input,.brand-quick-field select,.brand-quick-field textarea{width:100%;border:1px solid #ddd4ca;border-radius:11px;background:#fdfcfa;color:#241f1b;font-family:inherit;font-size:12px;outline:0;transition:.18s ease}.brand-quick-field input,.brand-quick-field select{height:47px;padding:0 13px}.brand-quick-field textarea{min-height:108px;padding:13px;resize:vertical;line-height:1.7}.brand-quick-field input:focus,.brand-quick-field select:focus,.brand-quick-field textarea:focus{border-color:#b79a6b;background:#fff;box-shadow:0 0 0 3px rgba(183,154,107,.11)}.brand-quick-field>small{color:#9b9188;font-size:8.5px}.brand-quick-field--wide{grid-column:1/-1}.brand-quick-create__actions{padding-top:5px;display:flex;align-items:center;justify-content:flex-end;gap:10px}.brand-quick-create__actions .brand-save{width:auto;min-width:280px;padding:13px 20px;display:inline-flex;align-items:center;justify-content:center;gap:9px}.brand-quick-create__actions .brand-save .studio-icon{width:15px;height:15px}.brand-quick-create__actions .spinner{width:14px;height:14px;border-width:2px}
@media(max-width:650px){.brand-quick-create__intro,.brand-quick-create__form{padding:23px 18px}.brand-quick-create__form{grid-template-columns:1fr}.brand-quick-field--wide{grid-column:auto}.brand-quick-create__journey>span{font-size:0}.brand-quick-create__journey b{font-size:8px}.brand-quick-create__actions{align-items:stretch;flex-direction:column-reverse}.brand-quick-create__actions .brand-save,.brand-quick-create__actions .btn-secondary{width:100%;min-width:0;justify-content:center}}

/* Image studio typewriter headline. */
.image-studio-hero__title{display:block}.image-studio-hero__title>span:first-child{display:inline}.typewriter-word{display:inline-block;min-width:3.8em;margin-inline-start:.22em;color:#7c193f;white-space:nowrap}.typewriter-caret{width:2px;height:.82em;margin-inline:3px 1px;display:inline-block;background:#b49055;vertical-align:-.04em;animation:typewriter-blink .82s steps(1,end) infinite}@keyframes typewriter-blink{0%,48%{opacity:1}49%,100%{opacity:0}}@media(prefers-reduced-motion:reduce){.typewriter-caret{animation:none;opacity:1}}

/* Keep the prompt as the primary action of the image studio. */
.image-prompt-stage{width:min(1060px,100%);margin:0 auto 34px;padding:22px;border:1px solid #dfd4c6;border-radius:20px;background:linear-gradient(145deg,#fff,#fcf9f4);box-shadow:0 18px 46px rgba(48,39,31,.075)}.image-prompt-stage__head{margin-bottom:15px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:13px}.image-prompt-stage__number{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:#7c193f;color:#fff;font-size:10px;font-weight:800}.image-prompt-stage__head>div>span{color:#a07a43;font-size:8px;font-weight:800;letter-spacing:.14em}.image-prompt-stage__head h2{margin:3px 0 0;color:#261f1a;font-size:18px}.image-prompt-stage__head>small{display:flex;align-items:center;gap:5px;color:#857a70;font-size:8.5px}.image-prompt-stage__head>small .studio-icon{width:13px;height:13px;color:#9b1749}.product-studio--image .image-prompt-stage .image-composer{width:100%;border:2px solid #d1b989;border-radius:16px;box-shadow:0 12px 30px rgba(77,54,29,.08)}.product-studio--image .image-prompt-stage .image-composer:focus-within{border-color:#8b1b46;box-shadow:0 15px 38px rgba(95,25,53,.11),0 0 0 4px rgba(139,27,70,.07)}.product-studio--image .image-prompt-stage textarea{min-height:155px;padding:15px 22px 20px;font-size:14px;line-height:1.85}.image-generate-button{width:auto!important;min-width:142px!important;padding:0 15px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;color:#fff;font-size:10px;font-weight:800}.image-generate-button .studio-icon{flex:0 0 auto}.image-prompt-stage+.image-inspiration{margin-top:0}.image-prompt-stage~.image-inspiration{opacity:.96}
@media(max-width:700px){.image-prompt-stage{padding:15px}.image-prompt-stage__head{grid-template-columns:auto 1fr}.image-prompt-stage__head>small{grid-column:1/-1}.product-studio--image .image-prompt-stage textarea{min-height:135px}.image-generate-button{min-width:118px!important;padding-inline:11px!important}.image-prompt-stage .gemini-composer__bar{flex-wrap:wrap}.image-prompt-stage .gemini-cost{margin-inline-start:auto}}

/* Desktop image studio: complete creative flow within one viewport. */
@media(min-width:901px){.product-studio--image{padding-bottom:20px!important}.product-studio--image .image-studio-hero{min-height:238px;margin-bottom:18px;padding:24px 34px;grid-template-columns:minmax(0,1fr) 43%;gap:28px}.product-studio--image .image-studio-hero h1{margin-top:10px;font-size:clamp(32px,3.25vw,43px);line-height:1.12}.product-studio--image .image-studio-hero p{margin-top:8px;font-size:11px}.image-studio-hero__meta{margin-top:14px}.image-studio-hero__media{min-height:188px}.image-studio-hero__frame--main{inset:5px 48px 5px 24px}.image-studio-hero__frame--top{width:118px;height:84px}.image-studio-hero__frame--bottom{width:126px;height:88px}.image-prompt-stage{margin-bottom:18px;padding:15px 17px;border-radius:17px}.image-prompt-stage__head{margin-bottom:10px}.image-prompt-stage__number{width:34px;height:34px}.image-prompt-stage__head h2{font-size:15px}.product-studio--image .image-prompt-stage textarea{min-height:88px;max-height:112px;padding:10px 18px 12px;font-size:12px}.image-composer__label{padding:11px 18px 0}.product-studio--image .gemini-composer__bar{min-height:50px;padding-block:6px}.product-studio--image .gemini-options{padding-block:10px}.image-inspiration{margin-bottom:8px}.image-inspiration__head{margin-bottom:9px}.image-inspiration__head h2{font-size:15px}.image-idea{height:112px;border-radius:13px}.image-idea__content{inset:auto 13px 10px}.image-idea__content strong{font-size:11px}.image-idea__content>span{margin-top:4px}.image-result-gallery{margin-bottom:16px!important}}
@media(min-width:901px) and (max-height:900px){.product-studio--image .image-studio-hero{min-height:208px;padding-block:19px}.image-studio-hero__media{min-height:160px}.product-studio--image .image-studio-hero h1{font-size:35px}.image-studio-hero__meta{margin-top:10px}.image-prompt-stage{padding:12px 15px}.product-studio--image .image-prompt-stage textarea{min-height:72px}.image-idea{height:96px}}

/* Video studio: same one-screen visual hierarchy as the image studio. */
.product-studio--video{max-width:1160px!important}.product-studio--video .video-studio-hero{padding:30px 38px;display:grid;grid-template-columns:minmax(0,1fr) 42%;gap:32px;text-align:start;background:radial-gradient(circle at 18% 15%,rgba(124,25,63,.12),transparent 36%),linear-gradient(125deg,#fffdf9,#f4eade)}.video-studio-hero__copy{align-self:center}.video-studio-hero__eyebrow{display:inline-flex;align-items:center;gap:7px;color:#956e38;font-size:9px;font-weight:800;letter-spacing:.14em}.video-studio-hero__eyebrow .studio-icon{width:15px;height:15px}.product-studio--video .video-studio-hero h1{max-width:560px;margin-top:12px;text-align:start}.product-studio--video .video-studio-hero p{max-width:510px;margin-inline:0;text-align:start}.video-studio-hero__meta{margin-top:16px;display:flex;gap:8px}.video-studio-hero__meta span{padding:6px 9px;display:inline-flex;align-items:center;gap:5px;border:1px solid #e3d6c5;border-radius:99px;background:rgba(255,255,255,.72);color:#6e6258;font-size:8.5px;font-weight:700}.video-studio-hero__meta .studio-icon{width:12px;height:12px;color:#8b1b46}.video-studio-hero__media{position:relative;min-height:205px;direction:ltr}.video-studio-frame{position:absolute;margin:0;overflow:hidden;border:5px solid rgba(255,255,255,.94);border-radius:18px;background:#29211c;box-shadow:0 19px 43px rgba(52,35,28,.18)}.video-studio-frame img{width:100%;height:100%;display:block;object-fit:cover}.video-studio-frame--main{inset:5px 40px 5px 5px}.video-studio-frame--side{width:125px;height:94px;right:0;bottom:-4px;transform:rotate(4deg)}.video-studio-frame--main i{position:absolute;inset:50% auto auto 50%;width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(28,18,20,.42);color:#fff;transform:translate(-50%,-50%);backdrop-filter:blur(6px)}.video-studio-frame--main i .studio-icon{width:17px;height:17px}.video-prompt-stage{width:min(1060px,100%);margin:0 auto 20px;padding:16px 18px;border:1px solid #dfd4c6;border-radius:18px;background:linear-gradient(145deg,#fff,#fcf9f4);box-shadow:0 17px 42px rgba(48,39,31,.07)}.video-prompt-stage__head{margin-bottom:11px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}.video-prompt-stage__head>span{width:35px;height:35px;display:grid;place-items:center;border-radius:11px;background:#7c193f;color:#fff;font-size:9px;font-weight:800}.video-prompt-stage__head small{color:#a07a43;font-size:8px;font-weight:800;letter-spacing:.13em}.video-prompt-stage__head h2{margin:2px 0 0;font-size:16px}.video-prompt-stage__head em{display:flex;align-items:center;gap:5px;color:#867b71;font-size:8.5px;font-style:normal}.video-prompt-stage__head em .studio-icon{width:12px;height:12px;color:#9b1749}.video-composer{width:100%!important;border:2px solid #d1b989!important}.video-composer:focus-within{border-color:#8b1b46!important;box-shadow:0 14px 36px rgba(95,25,53,.11),0 0 0 4px rgba(139,27,70,.07)!important}.video-composer__label{padding:11px 18px 0;display:flex;align-items:center;gap:7px;color:#51473e;font-size:10px;font-weight:800}.video-composer__label .studio-icon{width:14px;height:14px;color:#9a1748}.video-composer__label small{margin-inline-start:auto;color:#a49a90;font-size:8px;font-weight:500}.product-studio--video .video-composer textarea{min-height:90px;padding:10px 18px 13px;font-size:12px}.video-generate-button{width:auto!important;min-width:142px!important;padding:0 15px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;font-size:10px;font-weight:800}.video-template-section{margin-top:18px}.product-studio--video .video-template{min-height:115px;border-radius:14px}.product-studio--video .video-template>div{inset-inline-start:14px;bottom:11px}.product-studio--video .video-template strong{margin:2px 0 5px;font-size:12px}.product-studio--video .video-template em{padding:4px 7px;font-size:7.5px}.product-studio--video .studio-section-heading{margin-bottom:9px}.product-studio--video .studio-section-heading h2{font-size:16px}
@media(min-width:901px){.product-studio--video .video-studio-hero{min-height:235px;margin-bottom:18px}.product-studio--video .gemini-composer__bar{min-height:50px;padding-block:6px}.product-studio--video{padding-bottom:18px!important}}@media(min-width:901px) and (max-height:900px){.product-studio--video .video-studio-hero{min-height:205px;padding-block:19px}.video-studio-hero__media{min-height:165px}.product-studio--video .video-studio-hero h1{font-size:35px}.product-studio--video .video-template{min-height:95px}.product-studio--video .video-composer textarea{min-height:72px}}
@media(max-width:900px){.product-studio--video .video-studio-hero{grid-template-columns:1fr;padding:26px 20px}.video-studio-hero__media{min-height:210px}.video-prompt-stage{padding:15px}.video-prompt-stage__head{grid-template-columns:auto 1fr}.video-prompt-stage__head em{grid-column:1/-1}.video-generate-button{min-width:120px!important}}

/* Enterprise knowledge register: database-backed, formal and auditable. */
.knowledge-page{max-width:1160px;margin:0 auto;padding:5px 0 40px}.knowledge-head{padding:27px 30px;display:flex;align-items:center;justify-content:space-between;gap:28px;border:1px solid #e1d8cd;border-radius:20px;background:radial-gradient(circle at 90% 0,rgba(179,154,109,.16),transparent 37%),linear-gradient(135deg,#fff,#faf6ef);box-shadow:0 14px 38px rgba(48,39,31,.045)}.knowledge-head h1{margin:4px 0 5px;color:#251f1a;font-size:34px}.knowledge-head p{max-width:720px;margin:0;color:#7f756c;font-size:11px;line-height:1.8}.knowledge-create-button{flex:0 0 auto}.knowledge-assurance{margin:15px 0 25px;padding:12px 16px;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #e6ded4;border-radius:15px;background:#fff}.knowledge-assurance>span{padding:5px 16px;display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:9px;border-inline-end:1px solid #eee7df}.knowledge-assurance>span:last-child{border:0}.knowledge-assurance .studio-icon{grid-row:1/3;width:22px;height:22px;color:#9a7742}.knowledge-assurance b{color:#3b332c;font-size:10px}.knowledge-assurance small{color:#91877e;font-size:8px}.knowledge-create-panel{margin-bottom:25px;padding:23px;border:1px solid #d9c8ad;border-radius:18px;background:#fff;box-shadow:0 16px 42px rgba(55,42,29,.07)}.knowledge-create-panel__head{margin-bottom:18px;display:flex;align-items:center;justify-content:space-between}.knowledge-create-panel__head span,.knowledge-list-head span{color:#a07b44;font-size:8px;font-weight:800;letter-spacing:.14em}.knowledge-create-panel__head h2,.knowledge-list-head h2{margin:3px 0 0;font-size:18px}.knowledge-create-panel__head>button{width:31px;height:31px;border:1px solid #e0d8cf;border-radius:9px;background:#fff;color:#6c625a;font-size:19px;cursor:pointer}.knowledge-form-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:14px}.knowledge-form-grid label{display:flex;flex-direction:column;gap:6px}.knowledge-form-grid label.wide{grid-column:1/-1}.knowledge-form-grid label>span{font-size:9px;font-weight:800}.knowledge-form-grid input,.knowledge-form-grid select,.knowledge-form-grid textarea{width:100%;box-sizing:border-box;border:1px solid #ddd5cc;border-radius:10px;background:#fdfcfa;color:#2e2823;font:inherit;font-size:10px;outline:0}.knowledge-form-grid input,.knowledge-form-grid select{height:42px;padding:0 11px}.knowledge-form-grid textarea{min-height:82px;padding:11px;resize:vertical;line-height:1.7}.knowledge-form-grid input:focus,.knowledge-form-grid select:focus,.knowledge-form-grid textarea:focus{border-color:#ad8d59;box-shadow:0 0 0 3px rgba(173,141,89,.1)}.knowledge-create-panel__actions{margin-top:15px;display:flex;justify-content:flex-end;gap:9px}.knowledge-error{margin:12px 0 0;padding:9px 11px;border:1px solid #efc7c7;border-radius:9px;background:#fff5f5;color:#9b2b2b;font-size:9px}.knowledge-list-head{margin-bottom:13px;display:flex;align-items:end;justify-content:space-between}.knowledge-list-head>strong{width:38px;height:38px;display:grid;place-items:center;border:1px solid #e1d6c8;border-radius:11px;background:#fff;color:#7c193f;font-size:14px}.knowledge-state{min-height:220px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#887e74;text-align:center}.knowledge-state--empty{border:1px dashed #d9cdbf;border-radius:18px;background:#fcfaf6}.knowledge-state--empty>.studio-icon{width:32px;height:32px;color:#a48350}.knowledge-state h3{margin:12px 0 5px;font-size:15px;color:#342d27}.knowledge-state p{max-width:480px;margin:0 0 15px;font-size:9.5px;line-height:1.7}.knowledge-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.knowledge-card{padding:20px;display:flex;flex-direction:column;border:1px solid #e2dad1;border-radius:17px;background:#fff;box-shadow:0 10px 30px rgba(48,39,31,.045)}.knowledge-card>header{display:flex;align-items:center;justify-content:space-between}.knowledge-classification,.knowledge-status{padding:5px 7px;border-radius:99px;background:#f4efe7;color:#745e3b;font-size:7.5px;font-weight:800}.knowledge-status{display:flex;align-items:center;gap:5px;background:#f2f0ec;color:#726a63}.knowledge-status i{width:6px;height:6px;border-radius:50%;background:#b39973}.knowledge-status--active{background:#eaf7f0;color:#26724d}.knowledge-status--active i{background:#2d9464}.knowledge-card__icon{width:42px;height:42px;margin-top:17px;display:grid;place-items:center;border:1px solid #e1d4c4;border-radius:12px;background:#faf6ef;color:#8d6b38}.knowledge-card__icon .studio-icon{width:20px;height:20px}.knowledge-card h3{margin:11px 0 5px;font-size:15px}.knowledge-card>p{min-height:36px;margin:0;color:#80766d;font-size:9.5px;line-height:1.75}.knowledge-card dl{margin:17px 0;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #ebe4dc;border-radius:11px;background:#faf8f5}.knowledge-card dl>div{padding:10px;border-inline-end:1px solid #ebe4dc}.knowledge-card dl>div:last-child{border:0}.knowledge-card dt{color:#958a80;font-size:7.5px}.knowledge-card dd{margin:3px 0 0;color:#332b25;font-size:10px;font-weight:800}.knowledge-card>footer{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.knowledge-card>footer small{color:#988d83;font-size:7.5px}.knowledge-card>footer>div{display:flex;gap:6px}.knowledge-card>footer .btn-secondary{min-height:30px;padding:4px 9px;font-size:8px}.knowledge-delete{width:30px;height:30px;display:grid;place-items:center;border:1px solid #ead8d8;border-radius:8px;background:#fff;color:#b23b3b;cursor:pointer}.knowledge-delete .studio-icon{width:13px;height:13px}.knowledge-card__details{margin-top:13px;padding:11px;border-radius:10px;background:#f7f3ed}.knowledge-card__details b{font-size:8px}.knowledge-card__details p{margin:4px 0 0;color:#7c7269;font-size:8.5px;line-height:1.6}
@media(max-width:850px){.knowledge-head{align-items:flex-start;flex-direction:column}.knowledge-assurance,.knowledge-grid{grid-template-columns:1fr}.knowledge-assurance>span{border-inline-end:0;border-bottom:1px solid #eee7df}.knowledge-form-grid{grid-template-columns:1fr}.knowledge-form-grid label.wide{grid-column:auto}}@media(max-width:520px){.knowledge-head,.knowledge-create-panel{padding:18px}.knowledge-card dl{grid-template-columns:1fr}.knowledge-card dl>div{border-inline-end:0;border-bottom:1px solid #ebe4dc}}

/* Products hub: denser hierarchy, faster scanning and less vertical repetition. */
.products-page{max-width:1180px}.products-page .studio-context-bar{margin-bottom:14px;padding:10px 14px;border-radius:14px;box-shadow:none}.products-page .studio-context-bar .btn-secondary,.products-page .studio-context-bar .btn-gold{min-height:31px!important;padding:5px 10px!important;font-size:8.5px!important}.products-page .studio-context-label,.products-page .studio-context-meta{font-size:8.5px}.products-page .products-hero{min-height:116px;margin-bottom:13px!important;padding:18px 22px!important;grid-template-columns:155px 1fr auto;gap:18px}.products-page .products-hero h1{margin:4px 0 5px;font-size:27px}.products-page .products-hero p{max-width:680px;display:-webkit-box;overflow:hidden;font-size:9.5px;line-height:1.65;-webkit-box-orient:vertical;-webkit-line-clamp:2}.products-page .products-hero__brand>span{width:43px;height:43px}.products-page .products-hero>a{padding:6px 8px;font-size:8px!important}.product-jump-nav{margin-bottom:24px;padding:9px 11px;display:flex;align-items:center;gap:8px;border:1px solid #e5ddd3;border-radius:13px;background:#fff}.product-jump-nav>span{margin-inline-end:auto;color:#92877d;font-size:8px}.product-jump-nav a{min-height:31px;padding:0 10px;display:inline-flex;align-items:center;gap:6px;border:1px solid #e5ddd3;border-radius:9px;background:#fbf9f6;color:#51483f;font-size:8.5px;font-weight:750;text-decoration:none;transition:.18s ease}.product-jump-nav a:hover{border-color:#bfa779;background:#fff;color:#7c193f}.product-jump-nav a .studio-icon{width:13px;height:13px;color:#956f39}.product-jump-nav a b{min-width:18px;height:18px;display:grid;place-items:center;border-radius:6px;background:#efe7dc;color:#80633a;font-size:7px}.products-page .product-section{margin-bottom:29px!important;scroll-margin-top:20px}.products-page .product-section__head{margin-bottom:11px!important}.products-page .product-section__head h2{font-size:17px}.products-page .product-grid.product-grid--catalog>.product-card:first-child{grid-column:span 12;grid-template-columns:minmax(270px,.9fr) minmax(310px,1.1fr)}.products-page .product-grid.product-grid--catalog>.product-card:first-child .product-card__visual{height:185px}.products-page .product-grid.product-grid--catalog>.product-card:first-child .product-card__body{padding:16px 18px}.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:span 3}.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__visual{height:112px}.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__body{min-height:128px;padding:13px 14px}.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__body h3{margin:5px 0;font-size:12px;line-height:1.4}.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child) .product-card__body p{min-height:42px;font-size:7.8px;line-height:1.6}.products-page .product-card__body footer{margin-top:9px;padding-top:8px}.products-page .product-grid:not(.product-grid--catalog)>.product-card .product-card__visual{height:155px}.products-page .product-grid:not(.product-grid--catalog)>.product-card .product-card__body{min-height:125px;padding:15px 17px}.products-page .product-grid:not(.product-grid--catalog)>.product-card .product-card__body p{min-height:28px}.products-page .creation-ledger{margin-top:6px!important;padding:18px!important;scroll-margin-top:20px}.products-page .creation-ledger .product-section__head{margin-bottom:10px!important;padding-bottom:11px}.products-page .creation-list{gap:6px}.products-page .creation-row{min-height:66px;padding:9px 11px}.products-page .creation-row__identity strong{font-size:10px!important}.products-page .creation-row__identity small{font-size:7.5px!important}.products-page .creation-row__actions{gap:6px}.products-page .creation-row__actions .btn-secondary{min-height:28px;padding:4px 7px!important}
@media(max-width:1050px){.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:span 6}.products-page .products-hero{grid-template-columns:1fr auto}.products-page .products-hero__brand{display:none}}
@media(max-width:700px){.product-jump-nav{align-items:stretch;flex-wrap:wrap}.product-jump-nav>span{width:100%}.product-jump-nav a{flex:1;justify-content:center}.products-page .products-hero{grid-template-columns:1fr}.products-page .product-grid.product-grid--catalog>.product-card:first-child,.products-page .product-grid.product-grid--catalog>.product-card:not(:first-child){grid-column:1}.products-page .product-grid.product-grid--catalog>.product-card:first-child{display:block}.products-page .product-grid.product-grid--catalog>.product-card:first-child .product-card__visual{height:175px}}

/* ==========================================================================
   Claude / Codex Inspired Layout, Project Tree, Modals & Scoped Studio Styles
   ========================================================================== */

/* Top Sidebar Action: Large New Project Button */
.sidebar-top-action {
    padding: 14px 16px 8px;
}

.btn-sidebar-new {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #711D42 0%, #83254F 100%);
    color: #ffffff;
    border: 1px solid rgba(217, 178, 111, 0.4);
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(113, 29, 66, 0.18);
    transition: all 0.2s ease;
}

.btn-sidebar-new:hover {
    background: linear-gradient(135deg, #83254F 0%, #952E5C 100%);
    box-shadow: 0 6px 20px rgba(113, 29, 66, 0.28);
    transform: translateY(-1px);
}

.btn-new-icon {
    font-size: 16px;
    line-height: 1;
    font-weight: 800;
    color: #D9B26F;
}

/* Sidebar Navigation Main Menu */
.sidebar-main-menu {
    margin-bottom: 12px;
}

.sidebar-link-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 8px;
}

/* Sidebar Projects Tree Section (Codex Style) */
.sidebar-tree-section {
    border-top: 1px solid rgba(216, 208, 196, 0.6);
    padding-top: 14px;
    margin-top: 6px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sidebar-tree-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 8px;
}

.tree-title {
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #8c8175;
}

.btn-tree-add {
    background: none;
    border: 1px solid rgba(216, 208, 196, 0.8);
    border-radius: 6px;
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    font-size: 13px;
    color: #635749;
    cursor: pointer;
    line-height: 1;
    transition: all 0.15s ease;
}

.btn-tree-add:hover {
    background: #ffffff;
    border-color: #711D42;
    color: #711D42;
}

.sidebar-tree-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sidebar-project-item {
    border-radius: 9px;
    transition: all 0.15s ease;
}

.sidebar-project-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 8px;
    color: #4a4138;
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 600;
    transition: all 0.15s ease;
}

.sidebar-project-header:hover {
    background: rgba(255, 255, 255, 0.7);
    color: #181715;
}

.sidebar-project-item.is-active .sidebar-project-header {
    background: #ffffff;
    color: #711D42;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.project-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.project-name-label {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.btn-project-edit-inline {
    background: none;
    border: none;
    font-size: 11px;
    color: #9c9285;
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
}

.btn-project-edit-inline:hover {
    color: #711D42;
    background: rgba(113, 29, 66, 0.08);
}

/* Active Project Sub-items (Creations underneath active project) */
.sidebar-project-creations {
    padding-inline-start: 22px;
    padding-block: 4px;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.sidebar-creation-pill-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    background: rgba(217, 178, 111, 0.12);
    border: 1px dashed rgba(217, 178, 111, 0.5);
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 10.5px;
    color: #7a5e30;
    font-weight: 600;
    cursor: pointer;
    margin-bottom: 2px;
    text-align: start;
    transition: all 0.15s ease;
}

.sidebar-creation-pill-btn:hover {
    background: rgba(217, 178, 111, 0.22);
    color: #5c431b;
}

.sidebar-sub-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 6px;
    border-radius: 5px;
    color: #70665b;
    text-decoration: none;
    font-size: 11px;
    transition: all 0.12s ease;
}

.sidebar-sub-item:hover {
    background: rgba(255, 255, 255, 0.6);
    color: #181715;
}

.sub-bullet {
    color: #b0a495;
    font-weight: 700;
}

.sub-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ==========================================================================
   Cockpit Hero & Grid Styling
   ========================================================================== */
.project-cockpit-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: radial-gradient(circle at 85% 15%, rgba(217, 178, 111, 0.15), transparent 45%),
                linear-gradient(135deg, #ffffff 0%, #fbf9f5 60%, #f7f1e6 100%);
    border: 1px solid #e5ded2;
    border-radius: 18px;
    padding: 26px 32px;
    margin-bottom: 24px;
    box-shadow: 0 8px 24px rgba(48, 39, 31, 0.03);
    gap: 20px;
    flex-wrap: wrap;
}

.cockpit-hero-eyebrow {
    color: #a07a43;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.cockpit-hero-content h1 {
    margin: 6px 0 8px;
    font-size: 24px;
    font-weight: 700;
    color: #241e19;
}

.cockpit-hero-content p {
    color: #73695e;
    font-size: 13px;
    max-width: 620px;
    line-height: 1.6;
}

.btn-gold-large {
    background: linear-gradient(135deg, #D9B26F 0%, #C49852 100%);
    color: #241a0b;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    padding: 12px 22px;
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 4px 14px rgba(196, 152, 82, 0.25);
    transition: all 0.2s ease;
}

.btn-gold-large:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(196, 152, 82, 0.35);
}

.project-cards-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    gap: 18px;
}

.cockpit-project-card {
    background: #ffffff;
    border: 1px solid #e5ded2;
    border-radius: 16px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(48, 39, 31, 0.02);
}

.cockpit-project-card:hover {
    border-color: #D9B26F;
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(48, 39, 31, 0.07);
}

.card-top-identity {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.project-card-logo {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 15px;
    flex-shrink: 0;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.project-card-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card-title-group {
    flex: 1;
    min-width: 0;
}

.card-title-group h3 {
    margin: 0 0 3px;
    font-size: 15px;
    font-weight: 700;
    color: #241e19;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project-industry-pill {
    font-size: 10.5px;
    background: #f4eee4;
    color: #75634d;
    padding: 2px 8px;
    border-radius: 20px;
    font-weight: 600;
}

.btn-card-edit {
    background: none;
    border: 1px solid #e0d7cb;
    border-radius: 6px;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    font-size: 12px;
    color: #7d7265;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-card-edit:hover {
    border-color: #711D42;
    color: #711D42;
    background: #faf4f7;
}

.card-desc {
    color: #756a5e;
    font-size: 12px;
    line-height: 1.6;
    margin: 0 0 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card-palette-strip {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding-bottom: 12px;
    border-bottom: 1px solid #f0eae1;
}

.card-palette-strip i {
    width: 18px;
    height: 6px;
    border-radius: 4px;
}

.card-location {
    margin-inline-start: auto;
    font-size: 10.5px;
    color: #8c8276;
}

.card-footer-action {
    padding-top: 10px;
    display: flex;
    justify-content: flex-end;
}

.open-cta {
    font-size: 11.5px;
    font-weight: 700;
    color: #711D42;
    transition: color 0.15s ease;
}

.cockpit-project-card:hover .open-cta {
    color: #8f2152;
}

/* ==========================================================================
   Inside Project Cockpit & Persistent Credits Status Bar
   ========================================================================== */
.in-project-workspace {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.project-credits-status-banner {
    background: linear-gradient(135deg, #27211c 0%, #362e27 100%);
    color: #ffffff;
    border: 1px solid rgba(217, 178, 111, 0.3);
    border-radius: 12px;
    padding: 10px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

.credits-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.credits-icon {
    font-size: 16px;
}

.credits-label {
    font-size: 12px;
    color: #d1c8be;
}

.credits-badge-spent {
    background: rgba(217, 178, 111, 0.18);
    border: 1px solid #D9B26F;
    color: #f7e4c1;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11.5px;
}

.credits-badge-spent strong {
    color: #ffffff;
    font-weight: 800;
}

.credits-right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.wallet-balance-note {
    font-size: 11.5px;
    color: #b8ada0;
}

.wallet-balance-note strong {
    color: #D9B26F;
    font-size: 13px;
    margin-inline-start: 4px;
}

.btn-sm-refill {
    background: #D9B26F;
    color: #27211c;
    text-decoration: none;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

.btn-sm-refill:hover {
    background: #eed099;
}

/* Active Project Header Bar */
.active-project-header-bar {
    background: #ffffff;
    border: 1px solid #e5ded2;
    border-radius: 16px;
    padding: 16px 22px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
}

.project-header-left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.btn-back-projects {
    font-size: 12px;
    font-weight: 600;
    color: #7d7265;
    text-decoration: none;
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid #e2d9cd;
    transition: all 0.15s ease;
}

.btn-back-projects:hover {
    background: #f7f3ed;
    color: #181715;
}

.project-header-logo {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-size: 14px;
    font-weight: 700;
    overflow: hidden;
}

.project-header-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-header-titles h2 {
    margin: 0;
    font-size: 18px;
    color: #241e19;
}

.btn-edit-badge {
    background: none;
    border: 1px solid #e0d7cb;
    border-radius: 6px;
    padding: 2px 7px;
    font-size: 10.5px;
    color: #7a6e60;
    cursor: pointer;
}

.btn-edit-badge:hover {
    color: #711D42;
    border-color: #711D42;
}

.project-header-sub {
    font-size: 11.5px;
    color: #8c8276;
}

/* The Primary In-Project + Button for Product Selection */
.btn-project-plus-product {
    background: linear-gradient(135deg, #711D42 0%, #85224e 100%);
    color: #ffffff;
    border: 1px solid #D9B26F;
    border-radius: 12px;
    padding: 10px 20px;
    font-size: 13.5px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 4px 14px rgba(113, 29, 66, 0.22);
    transition: all 0.2s ease;
}

.btn-project-plus-product:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(113, 29, 66, 0.32);
}

.plus-icon {
    font-size: 18px;
    color: #D9B26F;
    line-height: 1;
}

/* ==========================================================================
   Scoped Creation Workspace & Refinement Thread
   ========================================================================== */
.creation-scoped-workspace {
    background: #ffffff;
    border: 2px solid #D9B26F;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 8px 30px rgba(113, 29, 66, 0.08);
}

.scoped-workspace-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 18px;
}

.badge-scoped-product {
    background: #f7ede0;
    color: #7d5a23;
    border: 1px solid #D9B26F;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    display: inline-block;
    margin-bottom: 6px;
}

.scoped-workspace-head h3 {
    margin: 0 0 4px;
    font-size: 17px;
    color: #241e19;
}

.scoped-workspace-head p {
    margin: 0;
    color: #7a6f62;
    font-size: 12px;
}

.btn-close-scoped {
    background: none;
    border: none;
    font-size: 18px;
    color: #9c9285;
    cursor: pointer;
}

.btn-close-scoped:hover {
    color: #b3261e;
}

.scoped-label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #383028;
    margin-bottom: 6px;
}

.scoped-textarea {
    min-height: 100px;
    resize: vertical;
    font-size: 13px;
    line-height: 1.6;
}

.scoped-tools-bar {
    margin-top: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.scoped-attachments {
    display: flex;
    align-items: center;
    gap: 10px;
}

.btn-attachment {
    background: #f5f0e6;
    border: 1px solid #ddd2c4;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 12px;
    cursor: pointer;
    color: #574b3d;
    font-weight: 600;
    transition: all 0.15s ease;
}

.btn-attachment:hover {
    background: #eee6d8;
}

.attachment-pill {
    background: #edf7f1;
    border: 1px solid #a8d5be;
    color: #1f7a4d;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11.5px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.attachment-pill button {
    background: none;
    border: none;
    color: #1f7a4d;
    cursor: pointer;
    font-weight: 800;
}

.scoped-submit-row {
    display: flex;
    align-items: center;
    gap: 14px;
}

.cost-estimate-note {
    font-size: 11.5px;
    color: #7d7265;
}

.cost-estimate-note strong {
    color: #711D42;
}

/* Scoped Iteration Thread */
.scoped-iteration-thread {
    margin-top: 20px;
    border-top: 1px solid #eee7dd;
    padding-top: 16px;
}

.thread-header {
    margin-bottom: 12px;
}

.thread-header h4 {
    margin: 0;
    font-size: 13.5px;
    color: #383028;
}

.thread-header small {
    color: #8c8072;
    font-size: 11px;
}

.thread-messages {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.iteration-msg {
    padding: 12px 16px;
    border-radius: 12px;
    max-width: 85%;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.iteration-msg.user {
    align-self: flex-start;
    background: #f7f3ed;
    border: 1px solid #e5ded2;
}

.iteration-msg.ai {
    align-self: flex-end;
    background: #fcf9f2;
    border: 1px solid #ebd9b9;
}

.msg-sender {
    font-size: 10px;
    font-weight: 700;
    color: #8c8175;
    text-transform: uppercase;
}

.msg-body {
    font-size: 12.5px;
    line-height: 1.6;
    color: #27211c;
    white-space: pre-wrap;
}

.msg-credits {
    align-self: flex-end;
    font-size: 10px;
    color: #711D42;
    font-weight: 700;
}

/* ==========================================================================
   Product Catalog Modal (2 Lists: Popular + All Products)
   ========================================================================== */
.product-catalog-modal-card {
    width: min(880px, 100%) !important;
    max-height: 90vh;
}

.catalog-modal-badge {
    background: rgba(217, 178, 111, 0.18);
    color: #7d5a23;
    border: 1px solid #D9B26F;
    font-size: 10.5px;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: 20px;
}

.catalog-tabs-bar {
    display: flex;
    gap: 10px;
    border-bottom: 2px solid #ede7dc;
    margin: 16px 0 20px;
    padding-bottom: 4px;
}

.catalog-tab-item {
    background: none;
    border: none;
    padding: 8px 14px;
    font-size: 13.5px;
    font-weight: 600;
    color: #6e6457;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    position: relative;
    transition: all 0.15s ease;
}

.catalog-tab-item:hover {
    color: #241e19;
    background: rgba(0, 0, 0, 0.03);
}

.catalog-tab-item.active {
    color: #711D42;
    font-weight: 700;
    background: rgba(113, 29, 66, 0.06);
}

.catalog-tab-item.active::after {
    content: "";
    position: absolute;
    bottom: -6px;
    inset-inline: 10px;
    height: 3px;
    background: #711D42;
    border-radius: 3px;
}

.tab-count-pill {
    background: #e8e1d5;
    color: #5e5345;
    font-size: 10px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
}

.catalog-tab-item.active .tab-count-pill {
    background: #711D42;
    color: #ffffff;
}

.catalog-section-lead {
    margin-bottom: 16px;
}

.catalog-section-lead h4 {
    margin: 0 0 2px;
    font-size: 14.5px;
    color: #2e261f;
}

.catalog-section-lead p {
    margin: 0;
    font-size: 12px;
    color: #7d7265;
}

/* Featured / Popular Cards Grid */
.catalog-cards-grid--featured {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.catalog-product-card {
    background: #ffffff;
    border: 1px solid #e5ded2;
    border-radius: 14px;
    overflow: hidden;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(48, 39, 31, 0.03);
}

.catalog-product-card:hover {
    border-color: #D9B26F;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(48, 39, 31, 0.08);
}

.catalog-card-icon-banner {
    padding: 14px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ffffff;
}

.card-icon {
    font-size: 20px;
    font-weight: 700;
}

.card-pill {
    background: rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(4px);
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.catalog-card-content {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.product-network-tag {
    font-size: 10px;
    font-weight: 700;
    color: #94887b;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.catalog-card-content h4 {
    margin: 0 0 6px;
    font-size: 14.5px;
    color: #241e19;
}

.catalog-card-content p {
    color: #706557;
    font-size: 12px;
    line-height: 1.55;
    margin: 0 0 14px;
    flex: 1;
}

.catalog-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 10px;
    border-top: 1px solid #f0eae1;
}

.meta-cost {
    font-size: 11px;
    font-weight: 700;
    color: #711D42;
}

.btn-select-product {
    background: #f7f3ec;
    border: 1px solid #dfd4c5;
    border-radius: 8px;
    padding: 5px 12px;
    font-size: 11px;
    font-weight: 700;
    color: #382e24;
    cursor: pointer;
    transition: all 0.15s ease;
}

.catalog-product-card:hover .btn-select-product {
    background: #711D42;
    border-color: #711D42;
    color: #ffffff;
}

/* Categorized Full List View */
.catalog-all-categories {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.catalog-category-block {
    background: #fcfaf7;
    border: 1px solid #ede5d8;
    border-radius: 14px;
    padding: 16px;
}

.category-block-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.cat-title-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cat-icon-pill {
    font-size: 16px;
}

.category-block-header h4 {
    margin: 0;
    font-size: 14px;
    color: #241e19;
}

.cat-count {
    font-size: 10.5px;
    color: #8c8173;
}

.catalog-category-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.catalog-mini-card {
    background: #ffffff;
    border: 1px solid #e5ded2;
    border-radius: 10px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.catalog-mini-card:hover {
    border-color: #D9B26F;
    background: #fdfbf7;
    transform: translateX(-2px);
}

.mini-icon {
    font-size: 18px;
    color: #711D42;
    flex-shrink: 0;
}

.catalog-mini-card div {
    flex: 1;
    min-width: 0;
}

.catalog-mini-card strong {
    display: block;
    font-size: 12.5px;
    color: #27211c;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.catalog-mini-card small {
    display: block;
    font-size: 10px;
    color: #857a6e;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mini-cost {
    font-size: 10px;
    font-weight: 800;
    color: #711D42;
    background: #f5ede0;
    padding: 2px 6px;
    border-radius: 4px;
}

/* ==========================================================================
   Project Modal (Add/Edit)
   ========================================================================== */
.project-modal-card {
    width: min(640px, 100%) !important;
}

.modal-field-row {
    display: flex;
    gap: 20px;
    margin-bottom: 16px;
    align-items: flex-start;
}

.project-modal-logo-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.modal-logo-preview {
    width: 74px;
    height: 74px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    font-size: 22px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.modal-logo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.modal-upload-btn {
    font-size: 11px !important;
    padding: 5px 10px !important;
    cursor: pointer;
}

.btn-text-danger {
    background: none;
    border: none;
    color: #b3261e;
    font-size: 11px;
    cursor: pointer;
}

.project-modal-info-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.modal-color-selectors {
    display: flex;
    gap: 16px;
    margin-top: 6px;
}

.color-picker-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fcf9f4;
    border: 1px solid #e3d9cc;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 600;
}

.color-picker-item input[type="color"] {
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background: none;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #eee7dd;
}

.modal-error-banner {
    background: #fdf2f2;
    border: 1px solid #f2bcbc;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #9b2323;
    font-size: 12px;
}

.spinner-inline {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    display: inline-block;
    vertical-align: middle;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 768px) {
    .catalog-cards-grid--featured,
    .catalog-category-grid,
    .form-grid-2 {
        grid-template-columns: 1fr;
    }
    .modal-field-row {
        flex-direction: column;
        align-items: center;
    }
}
.studio-skip-link { position: fixed; top: -100px; inset-inline-start: 20px; z-index: 3000; padding: 12px 18px; background: #fff; color: #294e3b; border: 2px solid #294e3b; border-radius: 8px; }
.studio-skip-link:focus { top: 12px; }
.studio-shell :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid #50755a; outline-offset: 3px; }
/* Shared dialog surfaces: softer depth, quieter borders, clear controls. */
.modal-backdrop { background: #20172988; backdrop-filter: blur(10px); }
.modal-card { border: 1px solid #e8e0ed; border-top: 1px solid #e8e0ed; border-radius: 24px; box-shadow: 0 28px 90px #24123230; }
.modal-header { gap: 18px; }
.modal-header .modal-close { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: #f4eef6; color: #81628c; font-size: 17px; }
.modal-card .form-control { background: #f9f7fb; border-color: #e7e0ec; border-radius: 12px; }
.modal-card .form-control:focus { background: #fff; border-color: #b690c8; box-shadow: 0 0 0 3px #b690c815; }
.modal-card .modal-footer { border-top-color: #eee7f2; }
