/* 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: 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);
    isolation: isolate;
}
.home-poster--material .home-poster__image { filter: grayscale(1); z-index: 0; }
/* Tint only the scene, then apply the readable surface gradient above it.
   Color blending preserves the photograph's light and shadow values. */
.home-poster--material::before,
.home-inspiration__toolbar::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: var(--prism-accent);
    opacity: .55;
    mix-blend-mode: color;
    pointer-events: none;
}
.home-poster--material .home-poster__body { z-index: 3; }
.home-poster--material .home-poster__image--light { display: none; }
.home-poster--material::after {
    z-index: 2;
    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(--home-poster-arrow-background, var(--surface-soft)); }
@media (hover: hover) {
    :root[data-theme="prism-light"] .home-poster--material:hover .home-poster__arrow { background: var(--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(--material-stage);
    border-radius: var(--radius-lg);
    corner-shape: var(--corner-shape-surface);
    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); corner-shape: var(--corner-shape-surface); 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,
.ultra-banner__scene { position: absolute; inset: 0; z-index: 0; pointer-events: none; isolation: isolate; mask-image: var(--material-banner-mask); }
.editorial-banner__scene::after,
.ultra-banner__scene::after { content: ''; position: absolute; inset: 0; background: var(--prism-accent); opacity: .55; mix-blend-mode: color; }
.editorial-banner__photo { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right center; filter: grayscale(1); }
.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__scene { 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);
    corner-shape: var(--corner-shape-surface);
    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); corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface);
    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); corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface); 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);
    corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface); 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%; corner-shape: var(--corner-shape-round); 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); corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface); 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; corner-shape: 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); corner-shape: var(--corner-shape-surface); }
.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); corner-shape: var(--corner-shape-surface); 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__bg { z-index: 0; }
.ultra-banner__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: right 60%; filter: grayscale(1); }
.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); corner-shape: var(--corner-shape-surface); }
.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); corner-shape: var(--corner-shape-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-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); corner-shape: var(--corner-shape-surface); 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); corner-shape: var(--corner-shape-surface); 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: 0 calc(var(--gap-sm) * 2); }
.pricing-plan-card { min-width: 0; overflow: hidden; border: 0; border-radius: var(--radius-lg); corner-shape: var(--corner-shape-surface); background: var(--bg-elevated); display: flex; flex-direction: column; }
.pricing-plan-card.is-featured { background: color-mix(in srgb, var(--primary-500) 8%, var(--bg-elevated)); }
.pricing-plan-card.is-current { box-shadow: inset 0 0 0 1px var(--text-main-18); }
.pricing-plan-card__intro { min-width: 0; }
.pricing-plan-card__banner { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: calc(var(--text-2xl) * 2.4 + var(--gap-sm) * 8); padding: calc(var(--gap-sm) * 6) calc(var(--gap-sm) * 2.5) calc(var(--gap-sm) * 1.5); background: var(--bg-elevated); }
.pricing-plan-card__banner::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, var(--overlay-pill-bg-strong), transparent 75%), linear-gradient(to right, var(--overlay-scrim), transparent 75%); }
.pricing-plan-card__image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: right center; pointer-events: none; user-select: none; }
.pricing-plan-card__heading { position: relative; z-index: 1; min-width: 0; color: var(--overlay-text); text-shadow: 0 1px 2px var(--overlay-backdrop); }
.pricing-plan-card__heading h3 { margin: 0; font-family: var(--font-display); font-weight: var(--font-weight-display); font-size: var(--text-2xl); letter-spacing: var(--tracking-display); line-height: var(--leading-tight); }
.pricing-plan-card__badges { position: absolute; z-index: 1; inset: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 1.5) auto; display: flex; align-items: flex-start; justify-content: space-between; gap: var(--gap-sm); }
.pricing-plan-card__badge { min-width: 0; padding: var(--gap-xs) var(--gap-sm); border-radius: var(--radius-pill); corner-shape: var(--corner-shape-surface); background: var(--bg-raised); color: var(--text-main); font-size: var(--text-2xs); line-height: var(--leading-snug); }
.pricing-plan-card__badge--discount { margin-left: auto; font-weight: var(--font-weight-medium); }
.pricing-plan-card__description { margin: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 2.5) calc(var(--gap-sm) * 2); color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-normal); }
.pricing-plan-card__offer { min-width: 0; padding: 0 calc(var(--gap-sm) * 2.5) calc(var(--gap-sm) * 1.5); }
.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-4xl); 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 { margin: var(--gap-xs) 0 calc(var(--gap-sm) * 1.5); line-height: var(--leading-snug); }
.pricing-plan-card__configuration { display: grid; align-content: center; gap: var(--gap-xs); min-height: calc(var(--slider-control-size) + 3.5em); padding: var(--gap-sm) calc(var(--gap-sm) * 1.5); background: color-mix(in srgb, var(--bg-raised) 50%, transparent); border-radius: var(--radius-base); corner-shape: var(--corner-shape-surface); font-size: var(--text-xs); }
.pricing-plan-card__configuration > strong { font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
.pricing-plan-card__configuration > span { color: var(--text-muted); }
.pricing-plan-card__volume { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--gap-xs) var(--gap-sm); font-size: var(--text-xs); }
.pricing-plan-card__volume > span { color: var(--text-muted); }
.pricing-plan-card__volume > strong { font-weight: var(--font-weight-medium); font-variant-numeric: tabular-nums; }
.pricing-plan-card__volume > :last-child { grid-column: 1 / -1; }
.pricing-plan-card__usage { display: grid; grid-template-rows: repeat(4, minmax(calc(var(--gap-sm) * 5.5), 1fr)); margin: 0 calc(var(--gap-sm) * 2.5); }
.pricing-plan-card__usage-row { display: grid; grid-template-columns: minmax(min-content, 1fr) minmax(0, auto); align-items: center; gap: var(--gap-sm); padding-block: calc(var(--gap-sm) * .75); border-top: 1px solid color-mix(in srgb, var(--text-main) 6%, transparent); }
.pricing-plan-card__usage dt { min-width: 0; color: var(--text-muted); font-size: var(--text-xs); }
.pricing-plan-card__usage dd { display: grid; min-width: 0; gap: var(--gap-2xs); justify-items: end; margin: 0; text-align: right; font-size: var(--text-xs); font-variant-numeric: tabular-nums; line-height: var(--leading-snug); }
.pricing-plan-card__usage dd strong { font-weight: var(--font-weight-medium); color: var(--text-main); }
.pricing-plan-card__usage dd > span { color: var(--text-muted); font-size: var(--text-2xs); }
.pricing-plan-card__features { display: grid; align-content: start; gap: var(--gap-sm); margin: 0; padding: calc(var(--gap-sm) * 2) calc(var(--gap-sm) * 2.5); list-style: none; color: var(--text-muted); font-size: var(--text-sm); line-height: var(--leading-snug); }
.pricing-plan-card__features li { display: flex; align-items: baseline; gap: var(--gap-sm); }
.pricing-plan-card__features .ti { flex-shrink: 0; color: var(--text-subtle); }
.pricing-plan-card__checkout { margin-top: auto; padding: 0 var(--gap-sm) var(--gap-sm); }
.pricing-plan-card__action { display: flex; align-items: center; justify-content: center; width: 100%; min-height: calc(var(--gap-sm) * 6); border: 0; border-radius: max(0px, calc(var(--radius-lg) - var(--gap-sm))); corner-shape: var(--corner-shape-surface); font-size: var(--text-sm); padding: var(--gap-sm); text-align: center; }
.pricing-plan-card__action.btn-secondary { background: var(--surface-active); }
@media (hover: hover) {
    .pricing-plan-card__action.btn-secondary:hover:not(:disabled) { background: var(--surface-strong); }
}
.pricing-plan-card__action:disabled { opacity: .65; cursor: default; }
/* Shared rows keep every offer, generation category and action aligned. */
@supports (grid-template-rows: subgrid) {
    .pricing-plan-card { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; }
}
.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); corner-shape: var(--corner-shape-surface); 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-plans__head p { color: var(--text-muted); font-size: var(--text-sm); margin: var(--gap-xs) 0 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); corner-shape: var(--corner-shape-surface); }
.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); }
/* Contain the table's absolutely positioned screen-reader labels as well. */
.pricing-comparison__scroll { position: relative; overflow-x: auto; overscroll-behavior-x: contain; border-radius: var(--radius-lg); corner-shape: var(--corner-shape-surface); 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__unit { display: block; margin-top: var(--gap-xs); color: var(--text-muted); font-size: var(--text-2xs); font-weight: var(--font-weight-regular); }
.pricing-plan-grid:focus-visible, .pricing-comparison__scroll:focus-visible { outline: var(--gap-2xs) solid var(--primary-500); outline-offset: var(--gap-2xs); }
@media (max-width: 767.98px) { .pricing-capabilities__grid { grid-template-columns: minmax(0, 1fr); } .pricing-capabilities__grid article { display: grid; grid-template-columns: auto minmax(0, 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: 768px) and (max-width: 1100px) {
    .pricing-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pricing-plan-card:nth-child(n+3) { margin-top: calc(var(--gap-sm) * 2); }
}
@media (max-width: 767.98px) {
    .pricing-plan-grid {
        position: relative;
        display: flex;
        align-items: stretch;
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        gap: calc(var(--gap-sm) * 1.5);
    }
    .pricing-plan-grid::-webkit-scrollbar { display: none; width: 0; height: 0; }
    .pricing-plan-card { flex: 0 0 min(88%, 18rem); scroll-snap-align: start; }
    .pricing-plan-card__banner { padding-inline: calc(var(--gap-sm) * 2); }
    .pricing-plan-card__description { margin: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 2); }
    .pricing-plan-card__offer { padding-inline: calc(var(--gap-sm) * 2); }
    .pricing-plan-card__usage { margin-inline: calc(var(--gap-sm) * 2); }
    .pricing-plan-card__features { padding: calc(var(--gap-sm) * 1.5) calc(var(--gap-sm) * 2); gap: calc(var(--gap-sm) * .75); }
    @supports (grid-template-rows: subgrid) {
        .pricing-plan-grid { display: grid; grid-template-columns: none; grid-template-rows: repeat(5, auto); grid-auto-flow: column; grid-auto-columns: min(88%, 18rem); row-gap: 0; }
    }
    .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; }
}