/* SKYNY Material: neutral surfaces, accent enamel, silver and ivory.
   Material renders follow the selected accent; user output photos do not. */
:root {
    --material-art-filter: hue-rotate(0deg) saturate(1);
    --material-stage: color-mix(in srgb, var(--prism-accent) 8%, var(--bg-panel));
    --material-reflection: color-mix(in srgb, var(--prism-accent) 22%, transparent);
    --material-object-face: linear-gradient(150deg, color-mix(in srgb, var(--bg-elevated) 78%, var(--prism-accent)), var(--bg-elevated) 62%, var(--material-stage));
    --material-object-bevel: inset 0 1px 1px var(--text-main-18), inset 0 -2px 1px var(--bg-panel), 0 3px 0 var(--bg-panel), var(--shadow-surface);
    --material-float-duration: 7s;
    --material-float-distance: 4px;
    --material-banner-mask: linear-gradient(90deg, transparent 25%, #0005 53%, #000 76%);
    --material-banner-mask-mobile: linear-gradient(180deg, transparent, #000 25%);
    --banner-inset: clamp(calc(var(--gap-sm) * 2.5), 2.5cqw, calc(var(--gap-sm) * 4));
    --banner-scene-mobile: calc(var(--gap-sm) * 12);
}
:root[data-accent="aurora"] { --material-art-filter: hue-rotate(57deg) saturate(.48); }
:root[data-accent="sunset"] { --material-art-filter: hue-rotate(-43deg) saturate(.48); }
:root[data-accent="lagoon"] { --material-art-filter: hue-rotate(118deg) saturate(.48); }
:root[data-accent="orchid"] { --material-art-filter: hue-rotate(195deg) saturate(.25); }
.material-art,
img[src*="/brand/material/icons/"] {
    object-fit: contain;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    filter: var(--material-art-filter);
}
.chat-input-assistant-dot:has(img[src*="/brand/material/icons/"]) {
    background: transparent;
    box-shadow: none;
}
.chat-input-assistant-dot:has(img[src*="/brand/material/icons/"]) img { padding: 1px; }
.chat-input-assistant-dot.is-active:has(img[src*="/brand/material/icons/"]) { background: var(--primary-10); }
.chat-input-assistant-dot:has(img[src*="/brand/material/icons/"]):hover { background: var(--bg-hover); }
.shell-rail-nav-link .material-nav-icon { display: block; width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
.assistant-icon:has(img[src*="/brand/material/icons/"]) { background: transparent; box-shadow: none; }
.material-profile { animation: none; filter: none; }
.material-empty-assistants { display: block; width: 80px; height: 80px; margin: 0 auto 12px; }
.home-assistant-card__avatar:has(img[src*="/brand/material/icons/"]) { background: var(--material-stage); }

.home-tool__visual--object,
.home-tool__visual--model {
    display: grid;
    place-items: center;
    background: radial-gradient(ellipse at 70% 20%, var(--material-reflection), transparent 72%),
                linear-gradient(145deg, var(--bg-elevated), var(--material-stage));
}
.home-tool__visual--object > img {
    width: 70%;
    height: 90%;
    position: absolute;
    object-fit: contain;
}
.home-tool__visual--model > img {
    width: 68%;
    height: 84%;
    position: absolute;
    object-fit: contain;
    margin-top: -8px;
    filter: var(--material-art-filter);
}
.home-tool__brand {
    position: absolute;
    inset: auto 10px 10px;
    font-size: var(--text-2xs);
    line-height: var(--leading-tight);
    letter-spacing: var(--tracking-wider);
    color: var(--text-muted);
    text-align: center;
}
.home-tool__action { z-index: 1; }
.home-collection__art img { filter: var(--material-art-filter); }

/* Theme changes use the document theme, including a manual override of the OS.
   Editorial uploads without a light companion keep their existing treatment. */
.home-poster--material {
    background: var(--material-stage);
    color: var(--text-main);
}
.home-poster--material .home-poster__image { filter: var(--material-art-filter); }
.home-poster--material .home-poster__image--light { display: none; }
.home-poster--material::after {
    background: linear-gradient(90deg, color-mix(in srgb, var(--material-stage) 81%, transparent), color-mix(in srgb, var(--material-stage) 42%, transparent) 50%, transparent 90%),
                linear-gradient(0deg, color-mix(in srgb, var(--material-stage) 40%, transparent), transparent 38%);
}
.home-poster--material .home-poster__copy { margin-bottom: 9%; }
.home-poster--material .home-poster__title { font-size: clamp(var(--text-3xl), calc(9cqw * var(--font-scale)), var(--text-7xl)); }
:root[data-theme="prism-light"] .home-poster--material .home-poster__image--dark { display: none; }
:root[data-theme="prism-light"] .home-poster--material .home-poster__image--light { display: block; }
:root[data-theme="prism-light"] .home-poster--material::after {
    background: linear-gradient(90deg, color-mix(in srgb, var(--material-stage) 90%, transparent), color-mix(in srgb, var(--material-stage) 62%, transparent) 48%, transparent 92%),
                linear-gradient(0deg, color-mix(in srgb, var(--material-stage) 53%, transparent), transparent 38%);
}
:root[data-theme="prism-light"] .home-poster--material :is(.home-poster__title, .home-poster__footer) { color: var(--text-main); }
:root[data-theme="prism-light"] .home-poster--material :is(.home-poster__eyebrow, .home-poster__description) { color: var(--text-muted); }
:root[data-theme="prism-light"] .home-poster--material .home-poster__arrow { background: var(--surface-soft); }
@media (hover: hover) {
    :root[data-theme="prism-light"] .home-poster--material:hover .home-poster__arrow { background: var(--surface-strong); }
}
@media (prefers-reduced-motion: reduce) {
    .material-art { transition: none; }
}

/* Shared editorial banners: one scene, type scale, spacing and action treatment. */
.editorial-banner {
    container-type: inline-size;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    align-items: center;
    min-height: calc(var(--gap-sm) * 30);
    background: var(--bg-elevated);
    border-radius: var(--radius-lg);
    color: var(--text-main);
}
.editorial-banner__copy { position: relative; z-index: 1; width: 62%; min-width: 0; padding: var(--banner-inset); }
.editorial-banner__eyebrow { display: block; margin-bottom: var(--gap-sm); color: var(--text-muted); font-size: var(--text-label); font-weight: var(--font-weight-medium); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
.editorial-banner__title { margin: 0; font-family: var(--font-display); font-size: var(--text-banner-title); font-weight: var(--font-weight-display); line-height: var(--leading-display); letter-spacing: var(--tracking-display); text-wrap: balance; }
.editorial-banner__title em { display: block; font-family: var(--font-editorial); font-size: calc(1em * var(--font-editorial-scale)); font-weight: var(--font-weight-editorial); font-style: var(--font-style-editorial); letter-spacing: var(--tracking-editorial); }
.editorial-banner__description { max-width: 36ch; margin: calc(var(--gap-sm) * 2) 0 0; color: var(--text-muted); font-size: var(--text-banner-body); line-height: var(--leading-normal); }
.editorial-banner__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--gap-sm) calc(var(--gap-sm) * 2); margin-top: calc(var(--gap-sm) * 2); }
.editorial-banner__cta { display: inline-flex; align-items: center; justify-content: center; gap: calc(var(--gap-sm) * 1.5); min-height: calc(var(--gap-sm) * 6); max-width: 100%; padding: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 2.5); border: 0; border-radius: var(--radius-base); box-shadow: none; font-size: var(--text-banner-action); line-height: var(--leading-tight); }
.editorial-banner__note { color: var(--text-muted); font-size: var(--text-label); }
.editorial-banner__scene { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.editorial-banner__photo { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right center; mask-image: var(--material-banner-mask); }
.editorial-banner__photo, .ultra-banner__photo { filter: var(--material-art-filter); }
.editorial-banner__photo--light { display: none; }
:root[data-theme="prism-light"] .editorial-banner__photo--dark { display: none; }
:root[data-theme="prism-light"] .editorial-banner__photo--light { display: block; }
.profile-plan-banner { margin-bottom: calc(var(--gap-sm) * 3); }
@container (max-width: 600px) {
    .editorial-banner__copy { width: 100%; padding: calc(var(--gap-sm) * 3); padding-bottom: 0; }
    .editorial-banner__title { font-size: var(--text-3xl); }
    .editorial-banner__description { max-width: 34ch; }
    .editorial-banner__scene { position: relative; inset: auto; width: 100%; height: var(--banner-scene-mobile); }
    .editorial-banner__photo { mask-image: var(--material-banner-mask-mobile); }
}

/* Profile rewards use the same surface and corner scale. */
.profile-rewards.is-active { display: block; }
.reward-banner {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
    align-items: center;
    min-height: 250px;
    padding: calc(var(--gap-sm) * 3.75) calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 3.75) calc(var(--gap-sm) * 4);
    margin-bottom: calc(var(--gap-sm) * 2.5);
    border-radius: var(--radius-lg);
    overflow: hidden;
    background: radial-gradient(ellipse at 85% 65%, var(--material-reflection), transparent 65%),
                linear-gradient(125deg, var(--bg-elevated), var(--material-stage));
}
.reward-banner-copy { position: relative; z-index: 1; }
.reward-eyebrow { display: block; margin-bottom: calc(var(--gap-sm) * 2.5); color: var(--text-muted); font-size: var(--text-2xs); font-weight: var(--font-weight-semibold); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
.reward-banner h2 { font-family: var(--font-display); font-size: clamp(var(--text-2xl), calc(2.5vw * var(--font-scale)), var(--text-4xl)); font-weight: var(--font-weight-display); letter-spacing: var(--tracking-display); line-height: var(--leading-display); margin: 0 0 calc(var(--gap-sm) * 2); }
.reward-banner h2 span { color: var(--text-muted); }
.reward-banner p { max-width: 400px; margin: 0; color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-relaxed); }
.reward-banner p strong { color: var(--text-main); font-weight: var(--font-weight-semibold); }
.reward-banner-art { display: block; width: 100%; height: auto; max-height: 245px; object-fit: contain; }
.reward-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--gap-sm) * 1.5); margin-bottom: calc(var(--gap-sm) * 2.5); }
.reward-stats--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.reward-stat { display: flex; flex-direction: column; gap: var(--gap-sm); padding: calc(var(--gap-sm) * 2.5); min-width: 0; border: 0; border-radius: var(--radius-lg); background: var(--bg-elevated); }
.reward-stat > span { font-size: var(--text-xs); color: var(--text-muted); }
.reward-stat > strong { font-family: var(--font-display); font-size: clamp(var(--text-xl), calc(2.1vw * var(--font-scale)), var(--text-3xl)); font-weight: var(--font-weight-display); line-height: var(--leading-tight); letter-spacing: var(--tracking-tight); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.reward-stat > small { font-size: var(--text-2xs); line-height: var(--leading-normal); color: var(--text-muted); }
.reward-stat.is-accent .reward-stat-value { color: var(--text-main); }
.reward-card { padding: calc(var(--gap-sm) * 3); border: 0; border-radius: var(--radius-lg); background: var(--bg-elevated); margin-bottom: calc(var(--gap-sm) * 2.5); min-width: 0; }
.reward-section-head { display: flex; align-items: center; justify-content: space-between; gap: calc(var(--gap-sm) * 1.5); margin-bottom: calc(var(--gap-sm) * 2.25); }
.reward-section-head h3 { margin: 0; font-size: var(--text-sm); line-height: var(--leading-snug); font-weight: var(--font-weight-semibold); }
.reward-small-note { font-size: var(--text-xs); line-height: var(--leading-normal); color: var(--text-muted); }
.reward-link-field, .reward-promo-field { display: flex; align-items: stretch; gap: calc(var(--gap-sm) * 1.25); }
.reward-link-field input, .reward-promo-field input {
    display: block; flex: 1; min-width: 0; width: 100%; padding: calc(var(--gap-sm) * 1.625) calc(var(--gap-sm) * 1.75);
    border: 0; border-radius: var(--radius-md);
    background: var(--bg-input); color: var(--text-main); font-family: inherit; font-size: var(--text-sm); line-height: var(--leading-normal);
}
.reward-invite { min-width: 0; margin: calc(var(--gap-sm) * 3) 0 var(--gap-sm); }
.reward-invite .reward-section-head { margin-bottom: var(--gap-sm); }
.reward-link-field { align-items: center; gap: var(--gap-2xs); padding: var(--gap-xs); border-radius: var(--radius-base); background: var(--bg-input); }
.reward-link-field input { padding: var(--gap-sm); background: transparent; text-overflow: ellipsis; }
.reward-promo-field input { letter-spacing: var(--tracking-wide); }
.reward-promo-field input::placeholder { color: var(--text-muted); letter-spacing: var(--tracking-normal); }
.reward-link-field input:focus-visible, .reward-promo-field input:focus-visible { outline: var(--gap-2xs) solid var(--prism-accent); outline-offset: var(--gap-2xs); }
.reward-promo-field input[aria-invalid="true"] { background: var(--bg-input); }
.profile-rewards .btn { border: 0; box-shadow: none; }
.reward-link-field .btn, .reward-promo-field .btn { flex-shrink: 0; min-height: 48px; gap: var(--gap-sm); padding-inline: calc(var(--gap-sm) * 2.25); }
.profile-rewards button:disabled { cursor: default; opacity: .5; }
.reward-link-field .reward-copy { min-height: var(--shell-header-slot); padding: var(--gap-sm) calc(var(--gap-sm) * 1.5); border-radius: var(--radius-md); background: var(--bg-hover); font-size: var(--text-xs); }
.reward-link-field .reward-share {
    display: inline-flex; align-items: center; justify-content: center; align-self: stretch;
    flex: 0 0 var(--shell-header-slot); width: var(--shell-header-slot); height: auto;
    min-height: var(--shell-header-slot); padding: 0; line-height: 1;
    border-radius: var(--radius-md); background: var(--bg-hover); color: var(--text-main);
}
.reward-link-field .reward-share > i { display: block; line-height: 1; }
.reward-code-button { display: inline-flex; gap: var(--gap-sm); align-items: center; min-height: var(--shell-header-slot); padding: 0; color: var(--text-muted); background: transparent; border: 0; font-size: var(--text-xs); }
.reward-code-button strong { color: var(--text-main); font-family: var(--font-mono, monospace); font-weight: var(--font-weight-medium); }
.reward-how { margin-bottom: calc(var(--gap-sm) * 3); }
.reward-how summary { display: flex; align-items: center; gap: var(--gap-sm); width: fit-content; min-height: var(--shell-header-slot); color: var(--text-muted); font-size: var(--text-xs); cursor: pointer; list-style: none; }
.reward-how summary::-webkit-details-marker { display: none; }
.reward-how summary:hover { color: var(--text-main); }
.reward-how summary i { transition: transform var(--transition-fast); }
.reward-how[open] summary i { transform: rotate(180deg); }
.reward-how-content { padding: var(--gap-sm) 0; max-width: 65ch; }
.reward-steps { display: grid; gap: calc(var(--gap-sm) * 1.5); padding: 0; margin: 0 0 var(--gap-sm); list-style: none; }
.reward-steps li { display: flex; align-items: baseline; gap: calc(var(--gap-sm) * 2); }
.reward-steps li > span { color: var(--text-muted); font-size: var(--text-xs); font-variant-numeric: tabular-nums; }
.reward-steps strong { display: block; font-size: var(--text-sm); font-weight: var(--font-weight-semibold); line-height: var(--leading-normal); }
.reward-steps p { margin: var(--gap-xs) 0 0; color: var(--text-muted); font-size: var(--text-xs); line-height: var(--leading-relaxed); }
.reward-terms { color: var(--text-muted); font-size: var(--text-2xs); line-height: var(--leading-relaxed); margin: 0; }
.reward-terms a { color: var(--text-main); text-decoration: underline; text-underline-offset: 3px; }
.reward-icon-button { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: var(--radius-md); background: transparent; color: var(--text-muted); font-size: var(--text-lg); }
.reward-icon-button:hover { background: var(--bg-hover); color: var(--text-main); }
.reward-history .reward-section-head { margin-bottom: var(--gap-xs); }
.reward-history-list { list-style: none; margin: 0; padding: 0; }
.reward-history-row { display: flex; gap: calc(var(--gap-sm) * 1.5); align-items: center; min-width: 0; padding: calc(var(--gap-sm) * 2) 0; }
.reward-history-row:last-child { padding-bottom: 0; border-bottom: 0; }
.reward-history-check { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%; background: var(--material-stage); color: var(--text-main); font-size: var(--text-sm); }
.reward-history-info { display: flex; flex: 1; flex-direction: column; min-width: 0; gap: calc(var(--gap-sm) * 0.625); }
.reward-history-info strong { font-size: var(--text-sm); font-weight: var(--font-weight-medium); overflow-wrap: anywhere; }
.reward-history-info time, .reward-history-amount span { font-size: var(--text-2xs); color: var(--text-muted); }
.reward-history-amount { display: flex; flex-shrink: 0; flex-direction: column; gap: calc(var(--gap-sm) * 0.625); text-align: right; font-variant-numeric: tabular-nums; }
.reward-history-amount strong { font-size: var(--text-sm); font-weight: var(--font-weight-semibold); }
.reward-empty { padding: calc(var(--gap-sm) * 3.5) calc(var(--gap-sm) * 1.5); text-align: center; }
.reward-empty strong { font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
.reward-empty p { max-width: 370px; margin: var(--gap-sm) auto 0; color: var(--text-muted); font-size: var(--text-xs); line-height: var(--leading-relaxed); }
.reward-pagination { display: flex; justify-content: center; align-items: center; gap: calc(var(--gap-sm) * 2); margin-top: calc(var(--gap-sm) * 2); padding-top: calc(var(--gap-sm) * 1.75); }
.reward-pagination > span { font-size: var(--text-xs); color: var(--text-muted); }
.reward-field-label { display: block; color: var(--text-muted); font-size: var(--text-xs); margin-bottom: var(--gap-sm); }
.reward-promo-field + .reward-small-note { margin: calc(var(--gap-sm) * 1.25) 0 0; }
.reward-feedback { margin: calc(var(--gap-sm) * 1.5) 0 0; font-size: var(--text-xs); line-height: var(--leading-relaxed); color: var(--text-main); }
.reward-feedback.is-error { color: var(--text-main); }
.reward-feedback.is-success { padding: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 1.75); border-radius: var(--radius-md); background: var(--material-stage); }
.reward-promo {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.3fr);
    align-items: center;
    gap: calc(var(--gap-sm) * 3);
}
.reward-promo-intro { display: flex; align-items: center; gap: calc(var(--gap-sm) * 1.5); min-width: 0; }
.reward-promo-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 3rem; height: 3rem; border-radius: var(--radius-base); background: var(--primary-10); color: var(--primary-500); font-size: var(--text-2xl); }
.reward-promo-intro h3 { margin: 0 0 var(--gap-xs); font-size: var(--text-base); font-weight: var(--font-weight-semibold); line-height: var(--leading-snug); }
.reward-promo-intro .reward-small-note { margin: 0; }
.reward-promo-form { min-width: 0; }
.reward-promo .reward-promo-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: var(--gap-sm); }
.reward-promo-input { min-width: 0; display: flex; align-items: center; border-radius: var(--radius-base); background: var(--bg-input); transition: box-shadow var(--transition-fast); }
.reward-promo-input:focus-within { box-shadow: inset 0 0 0 2px var(--primary-500); }
.reward-promo .reward-promo-input input { min-height: 3rem; border-radius: inherit; background: transparent; font-size: var(--text-base); padding: var(--gap-sm) calc(var(--gap-sm) * 1.5); }
.reward-promo .reward-promo-input input:focus-visible { outline: none; }
.reward-promo .reward-promo-submit { min-width: 9.5rem; min-height: 3rem; border-radius: var(--radius-base); }
.reward-promo .reward-promo-submit:disabled { opacity: 1; background: var(--surface-active); background-image: none; color: var(--text-muted); }
.reward-promo-form.is-busy .reward-promo-submit:disabled { background: var(--primary-500); color: var(--primary-text); cursor: progress; }
.reward-promo .reward-feedback { display: flex; align-items: flex-start; gap: var(--gap-sm); padding: var(--gap-sm) calc(var(--gap-sm) * 1.5); border-radius: var(--radius-base); background: var(--surface-soft); overflow-wrap: anywhere; }
.reward-promo .reward-feedback > .ti { flex-shrink: 0; margin-top: 0.125rem; font-size: var(--text-base); }
.reward-promo .reward-feedback.is-success { background: var(--primary-10); }
.reward-promo-input.is-error { background: var(--surface-active); }
@media (max-width: 850px) { .reward-promo { grid-template-columns: minmax(0, 1fr); gap: calc(var(--gap-sm) * 2); } }
@media (max-width: 480px) { .reward-promo .reward-promo-field { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
    .reward-banner { min-height: 220px; padding: calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 2.5); grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr); }
    .reward-eyebrow { font-size: var(--text-2xs); margin-bottom: calc(var(--gap-sm) * 1.75); }
    .reward-banner h2 { font-size: var(--text-2xl); }
    .reward-banner p { font-size: var(--text-xs); }
    .reward-banner-art { width: 120%; max-width: none; margin-left: -8%; }
    .reward-stats { gap: var(--gap-sm); }
    .reward-stat { padding: calc(var(--gap-sm) * 1.75) calc(var(--gap-sm) * 1.5); }
    .reward-stat > strong { font-size: var(--text-2xl); }
    .reward-stat > span { font-size: var(--text-2xs); }
    .reward-stat > small { font-size: var(--text-2xs); }
    .reward-card { padding: calc(var(--gap-sm) * 2.25); }
    .reward-section-head { gap: var(--gap-sm); }
    .reward-promo-field { flex-wrap: wrap; }
    .reward-promo-field input { flex-basis: 100%; font-size: var(--text-base); }
    .reward-link-field input { font-size: var(--text-base); }
    .reward-promo-field .btn { width: 100%; }
}
@media (max-width: 390px) {
    .reward-copy span { display: none; }
    .reward-stats:not(.reward-stats--two) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .reward-stats:not(.reward-stats--two) .reward-stat:last-child { grid-column: 1 / -1; }
    .reward-history-check { display: none; }
    .reward-history-row { gap: var(--gap-sm); }
}
/* Shared type roles: modern line with an editorial category/accent. */
.studio-page-title, .pricing-overview h1 { margin: 0; color: var(--text-main); font-family: var(--font-display); font-size: var(--text-feature); font-weight: var(--font-weight-display); letter-spacing: var(--tracking-display); line-height: var(--leading-display); text-wrap: balance; }
.studio-page-title em, .pricing-overview h1 em { display: block; font-family: var(--font-editorial); font-size: calc(1em * var(--font-editorial-scale)); font-weight: var(--font-weight-editorial); font-style: var(--font-style-editorial); letter-spacing: var(--tracking-editorial); }
.studio-page-description { max-width: 48ch; margin: calc(var(--gap-sm) * 2) auto 0; color: var(--text-muted); font-size: var(--text-base); line-height: var(--leading-normal); text-wrap: pretty; }
.ultra-banner__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right 60%; mask-image: var(--material-banner-mask); }
.ultra-banner__bg::after { background: linear-gradient(90deg, var(--bg-panel) 5%, transparent 80%); }
.ultra-banner__content { gap: calc(var(--gap-sm) * 2); padding: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 2); }
.ultra-banner__text { max-width: 68%; }
.ultra-banner__subtitle { display: block; overflow: visible; }
.ultra-banner__btn { min-height: calc(var(--gap-sm) * 5); border-radius: var(--radius-base); }
.payment-header-back { display: grid; place-items: center; flex-shrink: 0; width: calc(var(--gap-sm) * 5); height: calc(var(--gap-sm) * 5); border: 0; border-radius: var(--radius-round); background: transparent; color: var(--text-muted); font-size: var(--text-xl); }
.payment-header-back:hover { background: var(--bg-hover); color: var(--text-main); }

/* Pricing: compact comparison with real offer values, shared card geometry. */
.pricing-overview { text-align: center; max-width: 52rem; margin: 0 auto calc(var(--gap-sm) * 5); }
.pricing-overview__eyebrow { display: block; margin-bottom: var(--gap-sm); color: var(--text-muted); font-size: var(--text-label); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; }
.pricing-overview > p { max-width: 52ch; margin: calc(var(--gap-sm) * 2) auto; color: var(--text-muted); font-size: var(--text-base); line-height: var(--leading-normal); }
.pricing-account { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: var(--gap-sm) calc(var(--gap-sm) * 2); font-size: var(--text-sm); color: var(--text-muted); }
.pricing-account strong { color: var(--text-main); font-weight: var(--font-weight-medium); }
.pricing-account a { display: inline-flex; align-items: center; gap: var(--gap-xs); min-height: calc(var(--gap-sm) * 5); }
.pricing-plans { margin-bottom: calc(var(--gap-sm) * 4); }
.pricing-plans__head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: calc(var(--gap-sm) * 2); margin-bottom: calc(var(--gap-sm) * 3); }
.pricing-plans__head h2, .pricing-wallet h2 { margin: 0; font-size: var(--text-xl); font-weight: var(--font-weight-display); letter-spacing: var(--tracking-display); }
.pricing-period { display: inline-flex; gap: var(--gap-xs); padding: var(--gap-xs); border-radius: var(--radius-base); background: var(--bg-elevated); }
.pricing-period button { display: inline-flex; align-items: center; gap: var(--gap-sm); min-height: calc(var(--gap-sm) * 5); padding: var(--gap-sm) calc(var(--gap-sm) * 2); border: 0; border-radius: var(--radius-md); color: var(--text-muted); background: transparent; font-size: var(--text-sm); }
.pricing-period button[aria-pressed="true"] { background: var(--bg-raised); color: var(--text-main); }
.pricing-period button span { font-size: var(--text-xs); color: var(--text-main); }
.pricing-plan-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(var(--gap-sm) * 2); }
.pricing-plan-card { min-width: 0; overflow: hidden; border: 0; border-radius: var(--radius-lg); background: var(--bg-elevated); display: flex; flex-direction: column; }
.pricing-plan-card__image { display: block; flex-shrink: 0; width: 100%; height: calc(var(--gap-sm) * 18); object-fit: contain; }
.pricing-plan-card__body { display: flex; flex-direction: column; flex: 1; min-width: 0; padding: 0 calc(var(--gap-sm) * 2.5) calc(var(--gap-sm) * 2.5); }
.pricing-plan-card__heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--gap-xs); min-height: calc(var(--gap-sm) * 3.5); }
.pricing-plan-card__heading h3 { margin: 0; font-family: var(--font-display); font-weight: var(--font-weight-display); font-size: var(--text-xl); letter-spacing: var(--tracking-display); }
.pricing-plan-card__badge { color: var(--text-muted); font-size: var(--text-2xs); }
.pricing-plan-card__description { margin: var(--gap-sm) 0 calc(var(--gap-sm) * 2); color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-normal); }
.pricing-plan-card__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--gap-xs); font-variant-numeric: tabular-nums; }
.pricing-plan-card__price strong { font-family: var(--font-display); font-size: var(--text-3xl); font-weight: var(--font-weight-display); letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); }
.pricing-plan-card__price > span, .pricing-plan-card__equivalent { color: var(--text-muted); font-size: var(--text-xs); }
.pricing-plan-card__equivalent { min-height: 1.5em; margin: var(--gap-xs) 0 calc(var(--gap-sm) * 2); }
.pricing-plan-card__metrics { display: grid; gap: var(--gap-sm); margin: 0; }
.pricing-plan-card__metrics > div { display: flex; align-items: baseline; flex-wrap: wrap; justify-content: space-between; gap: var(--gap-xs); font-size: var(--text-sm); }
.pricing-plan-card__metrics dt { color: var(--text-muted); }
.pricing-plan-card__metrics dd { margin: 0; font-weight: var(--font-weight-medium); }
.pricing-plan-card__volume { display: grid; grid-template-columns: 1fr auto; gap: var(--gap-sm); margin-top: calc(var(--gap-sm) * 2); font-size: var(--text-xs); }
.pricing-plan-card__volume > span { color: var(--text-muted); }
.pricing-plan-card__volume > :last-child { grid-column: 1 / -1; }
.pricing-plan-card__features { margin: calc(var(--gap-sm) * 2.5) 0; padding: 0; list-style: none; display: grid; gap: var(--gap-sm); color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-normal); }
.pricing-plan-card__action { width: 100%; min-height: calc(var(--gap-sm) * 6); margin-top: auto; border: 0; border-radius: var(--radius-base); font-size: var(--text-sm); padding: var(--gap-sm); }
.pricing-plan-card__action:disabled { opacity: .65; cursor: default; }
.pricing-plans__note { margin: calc(var(--gap-sm) * 2) 0 0; color: var(--text-muted); font-size: var(--text-xs); line-height: var(--leading-normal); text-align: center; }
.pricing-wallet { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: calc(var(--gap-sm) * 3); padding: calc(var(--gap-sm) * 3); margin-bottom: calc(var(--gap-sm) * 6); border-radius: var(--radius-lg); background: var(--bg-elevated); }
.pricing-wallet p { margin: var(--gap-sm) 0 0; color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-normal); }
.pricing-wallet .profile-topup-methods { min-width: min(100%, 18rem); flex: 1; max-width: 24rem; }
.landing-prices-public .landing-plan { overflow: hidden; }
.pricing-plan-card__intro { padding: calc(var(--gap-sm) * 2.5) calc(var(--gap-sm) * 2.5) var(--gap-sm); }
.pricing-plan-card.is-featured { background: color-mix(in srgb, var(--primary-500) 10%, var(--bg-elevated)); }
.pricing-plan-card.is-featured .pricing-plan-card__badge { color: var(--text-main); }
.pricing-plans__head p { color: var(--text-muted); font-size: var(--text-sm); margin: var(--gap-xs) 0 0; }
.pricing-plan-card__budget { min-height: calc(var(--gap-sm) * 16); padding: calc(var(--gap-sm) * 2); border-radius: var(--radius-base); background: color-mix(in srgb, var(--bg-raised) 50%, transparent); }
.pricing-plan-card__label { display: block; font-size: var(--text-xs); color: var(--text-muted); margin-bottom: var(--gap-sm); }
.pricing-plan-card__budget > strong { display: block; font-size: var(--text-2xl); font-weight: var(--font-weight-display); letter-spacing: var(--tracking-tight); font-variant-numeric: tabular-nums; }
.pricing-plan-card__budget p, .pricing-plan-card__examples { font-size: var(--text-sm); line-height: var(--leading-normal); color: var(--text-muted); margin: var(--gap-sm) 0 0; }
.pricing-plan-card__examples { display: grid; gap: var(--gap-xs); }
.pricing-plan-card__examples small { font-size: inherit; }
.pricing-plan-card__features li { display: flex; align-items: baseline; gap: var(--gap-sm); }
.pricing-plan-card__features .ti { flex-shrink: 0; }
.pricing-plan-card__benefit { color: var(--text-main); }
.pricing-plan-card__checkout { margin-top: auto; }
.pricing-plan-card__action { display: flex; align-items: center; justify-content: center; text-align: center; }
.pricing-plan-card__saving { min-height: 2.8em; margin: var(--gap-sm) 0 0; color: var(--text-muted); text-align: center; font-size: var(--text-xs); line-height: var(--leading-snug); }
.pricing-estimate-details { max-width: 80ch; margin: var(--gap-sm) auto 0; font-size: var(--text-xs); color: var(--text-muted); line-height: var(--leading-normal); }
.pricing-estimate-details summary { display: flex; justify-content: center; align-items: center; gap: var(--gap-sm); min-height: calc(var(--gap-sm) * 5); cursor: pointer; list-style: none; }
.pricing-estimate-details summary::-webkit-details-marker { display: none; }
.pricing-estimate-details[open] summary .ti { transform: rotate(180deg); }
.pricing-estimate-details p { margin: var(--gap-sm) 0; }
.pricing-section-heading { margin-bottom: calc(var(--gap-sm) * 3); }
.pricing-section-heading h2 { margin: 0; font-family: var(--font-display); font-size: var(--text-3xl); font-weight: var(--font-weight-display); letter-spacing: var(--tracking-display); line-height: var(--leading-display); }
.pricing-section-heading h2 em { font-family: var(--font-editorial); font-size: calc(1em * var(--font-editorial-scale)); font-style: var(--font-style-editorial); font-weight: var(--font-weight-editorial); letter-spacing: var(--tracking-editorial); }
.pricing-section-heading p { color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-normal); max-width: 65ch; margin: var(--gap-sm) 0 0; }
.pricing-capabilities, .pricing-comparison { margin-block: calc(var(--gap-sm) * 6); }
.pricing-capabilities__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--gap-sm) * 2); }
.pricing-capabilities__grid article { padding: calc(var(--gap-sm) * 3); background: var(--bg-elevated); border-radius: var(--radius-lg); }
.pricing-capabilities__grid img { width: calc(var(--gap-sm) * 7); height: calc(var(--gap-sm) * 7); object-fit: contain; margin-bottom: calc(var(--gap-sm) * 2); }
.pricing-capabilities__grid h3 { margin: 0; font-size: var(--text-lg); font-weight: var(--font-weight-medium); }
.pricing-capabilities__grid p { margin: var(--gap-sm) 0 0; font-size: var(--text-sm); color: var(--text-muted); line-height: var(--leading-normal); }
.pricing-comparison__scroll { overflow-x: auto; overscroll-behavior-x: contain; border-radius: var(--radius-lg); background: var(--bg-elevated); }
.pricing-comparison table { width: 100%; min-width: 46rem; border-collapse: collapse; font-size: var(--text-sm); line-height: var(--leading-normal); }
.pricing-comparison th, .pricing-comparison td { padding: calc(var(--gap-sm) * 2); text-align: left; width: 20%; }
.pricing-comparison th { font-weight: var(--font-weight-medium); }
.pricing-comparison thead th { padding-block: calc(var(--gap-sm) * 2.5); color: var(--text-main); }
.pricing-comparison tbody th, .pricing-comparison td { color: var(--text-muted); }
.pricing-comparison tr:nth-child(even) { background: color-mix(in srgb, var(--bg-raised) 40%, transparent); }
.pricing-comparison .ti { color: var(--text-main); }
.pricing-comparison__scroll:focus-visible, .pricing-estimate-details summary:focus-visible { outline: var(--gap-2xs) solid var(--primary-500); outline-offset: var(--gap-2xs); }
@media (max-width: 700px) { .pricing-capabilities__grid { grid-template-columns: 1fr; } .pricing-capabilities__grid article { display: grid; grid-template-columns: auto 1fr; column-gap: calc(var(--gap-sm) * 2); padding: calc(var(--gap-sm) * 2.5); } .pricing-capabilities__grid img { grid-row: span 2; margin: 0; } }
@media (min-width: 701px) and (max-width: 1100px) { .pricing-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) {
    .pricing-plan-grid, .landing-prices-public .landing-plans { display: flex; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; gap: calc(var(--gap-sm) * 1.5); padding-bottom: var(--gap-sm); }
    .pricing-plan-card, .landing-prices-public .landing-plan { flex: 0 0 88%; min-width: 0; scroll-snap-align: start; }
    .pricing-overview { margin-bottom: calc(var(--gap-sm) * 4); }
    .pricing-wallet { padding: calc(var(--gap-sm) * 2.5); }
    .pricing-wallet .profile-topup-methods { max-width: none; }
}

.prompt-library-panel.prompt-library-panel--media { height: auto; border-radius: var(--radius-lg); }
.preset-library-header { display: flex; align-items: center; justify-content: space-between; gap: var(--gap-sm); padding: calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 2); }
.preset-library-header h2 { margin: 0; font-family: var(--font-display); font-weight: var(--font-weight-display); font-size: var(--text-xl); letter-spacing: var(--tracking-display); }
.preset-library-header p { margin: var(--gap-xs) 0 0; color: var(--text-muted); font-size: var(--text-xs); }
.preset-library-search { display: flex; align-items: center; gap: var(--gap-sm); margin: 0 calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 2); padding: 0 calc(var(--gap-sm) * 1.5); min-height: calc(var(--gap-sm) * 5.5); border-radius: var(--radius-base); background: var(--bg-input); color: var(--text-muted); }
.preset-library-search input { flex: 1; min-width: 0; width: 100%; height: calc(var(--gap-sm) * 5.5); background: transparent; color: var(--text-main); border: 0; font-size: var(--text-sm); outline: none; }
.preset-library-search:focus-within { outline: var(--gap-2xs) solid var(--primary-500); outline-offset: var(--gap-2xs); }
.preset-library-filters { padding: 0 calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 2); }
.preset-library-filters .model-chip { min-height: calc(var(--gap-sm) * 5); font-size: var(--text-xs); border: 0; }
.preset-library-filters .model-chip-active { color: var(--text-main); background: var(--bg-raised); }
.preset-library-scroll { overflow-y: auto; min-height: 0; padding: 0 calc(var(--gap-sm) * 3) calc(var(--gap-sm) * 3); }
.preset-library-loading { display: flex; align-items: center; justify-content: center; min-height: calc(var(--gap-sm) * 24); gap: var(--gap-sm); color: var(--text-muted); font-size: var(--text-sm); }
.preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--gap-sm) * 2.5) calc(var(--gap-sm) * 1.5); }
.preset-card { display: flex; flex-direction: column; min-width: 0; aspect-ratio: auto; border-radius: var(--radius-base); border: 0; background: transparent; text-align: left; }
.preset-card:hover { box-shadow: none; }
.preset-card-visual { position: relative; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; border-radius: var(--radius-base); background: var(--bg-raised); }
.preset-card-img { transition: transform var(--transition); }
.preset-card:hover .preset-card-img { transform: scale(1.03); }
.preset-card-name { position: static; padding: var(--gap-sm) 0 0; color: var(--text-main); background: none; font-size: var(--text-sm); line-height: var(--leading-snug); }
.preset-card-name strong { display: block; font-weight: var(--font-weight-medium); overflow-wrap: anywhere; }
.preset-card-description { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: var(--gap-xs); color: var(--text-muted); font-family: var(--font-sans); font-weight: var(--font-weight-regular); font-size: var(--text-xs); line-height: var(--leading-normal); }
.preset-card-selected .preset-card-visual::after { content: '✓'; position: absolute; inset: auto var(--gap-sm) var(--gap-sm) auto; display: grid; place-items: center; width: calc(var(--gap-sm) * 3); height: calc(var(--gap-sm) * 3); border-radius: var(--radius-round); background: var(--primary-500); color: var(--primary-text); }
.preset-card-create { justify-content: center; align-items: center; min-height: calc(var(--gap-sm) * 18); padding: calc(var(--gap-sm) * 2); background: var(--bg-input); }
@media (min-width: 640px) { .preset-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 639px) {
    .prompt-library-panel.prompt-library-panel--media { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
    .preset-library-header { padding: calc(var(--gap-sm) * 2); }
    .preset-library-search { margin-inline: calc(var(--gap-sm) * 2); }
    .preset-library-filters, .preset-library-scroll { padding-inline: calc(var(--gap-sm) * 2); }
}
@media (prefers-reduced-motion: reduce) { .preset-card:hover .preset-card-img { transform: none; } }