/* ARQ-IA shared visual layer. Opt-in only; no visibility or auth-flow rules.
 * Semantic data-ui-role is assigned by HTML/JS, not inferred from button text.
 * !important is limited to visual properties overridden by legacy inline UI.
 * Platform layout rules require data-ui-platform to avoid changing Capacitor stages.
 */
body.premium-ui {
    --ui-canvas: #0B0B0C;
    --ui-surface: #15191F;
    --ui-raised: #20262F;
    --ui-border: #586476;
    --ui-divider: #303844;
    --ui-ink: #F4F6FA;
    --ui-muted: #AAB3C2;
    --ui-brand: #FF4D00;
    --ui-on-brand: #121212;
    --ui-selected: #263344;
    --ui-selected-ink: #C7D2E2;
    --ui-selected-border: #71839B;
    --ui-danger: #EF8C88;
    --ui-success: #80CCA1;
    --ui-warning: #E5BA6B;
    --ui-focus: #B9D4FF;
    --ui-font: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ui-radius-control: 10px;
    --ui-radius-card: 16px;
    --ui-radius-panel: 20px;
    --ui-shadow-panel: 0 16px 40px rgba(0,0,0,.32);
    --dark-bg: var(--ui-canvas);
    --surface: var(--ui-surface);
    --surface-bg: var(--ui-surface);
    --card-bg: var(--ui-raised);
    --surface-2: var(--ui-raised);
    --text-main: var(--ui-ink);
    --text-muted: var(--ui-muted);
    --ink-2: var(--ui-muted);
    --ink-3: var(--ui-muted);
    --ink-4: var(--ui-muted);
    --border-color: var(--ui-divider);
    --btn-shadow-primary: none;
    --shadow-sm: 0 2px 8px rgba(0,0,0,.16);
    --shadow-md: 0 8px 24px rgba(0,0,0,.24);
    --shadow-lg: var(--ui-shadow-panel);
    font-family: var(--ui-font);
    color: var(--ui-ink);
    background: var(--ui-canvas);
    line-height: 1.45;
}

body.premium-ui :where(button, input, select, textarea, label, p, h1, h2, h3, h4, a, span, small) {
    font-family: var(--ui-font);
}

body.premium-ui :where([data-ui-role], .transformation-mode-btn, .context-btn, .toggle-btn,
    .area-text-btn, .typology-btn, .main-tab, .video-mode-tab, .video-config-btn, .pcb,
    .project-filter-chip, .camera-preset-chip, .sug-btn, .suggested-style-chip) {
    min-height: 48px;
    border-radius: var(--ui-radius-control);
    font-size: .875rem !important;
    font-weight: 600 !important;
    line-height: 1.35;
    letter-spacing: normal !important;
    text-transform: none !important;
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}

/* These roles also neutralize dynamic inline gradients and glow on existing IDs. */
body.premium-ui [data-ui-role] {
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer;
}
body.premium-ui [data-ui-role="generate"] {
    background: var(--ui-brand) !important;
    color: var(--ui-on-brand) !important;
    border: 1px solid var(--ui-brand) !important;
    padding: 13px 20px;
    font-weight: 700 !important;
}
body.premium-ui [data-ui-role="generate"] :where(span, ion-icon) { color: inherit !important; }
body.premium-ui :is([data-ui-role="secondary"], [data-ui-role="commerce"]) {
    background: var(--ui-raised) !important;
    color: var(--ui-ink) !important;
    border: 1px solid var(--ui-border) !important;
    padding: 12px 16px;
}
body.premium-ui :is([data-ui-role="secondary"], [data-ui-role="commerce"]) :where(span, ion-icon) {
    color: inherit !important;
}
body.premium-ui [data-ui-role="ghost"] {
    background: transparent !important;
    color: var(--ui-muted) !important;
    border-color: transparent !important;
    padding: 10px 12px;
}
body.premium-ui [data-ui-role="danger"] {
    background: rgba(239,140,136,.07) !important;
    color: var(--ui-danger) !important;
    border: 1px solid #A66161 !important;
    padding: 12px 16px;
}
body.premium-ui :is([data-ui-role="secondary"], [data-ui-role="commerce"], [data-ui-role="ghost"]):hover:not(:disabled) {
    background: #2A3340 !important;
    color: var(--ui-ink) !important;
}
body.premium-ui [data-ui-role="generate"]:hover:not(:disabled) { background: #FF6421 !important; }
body.premium-ui [data-ui-role="danger"]:hover:not(:disabled) { background: rgba(239,140,136,.14) !important; }
body.premium-ui [data-ui-role]:is(:disabled, [aria-disabled="true"]) {
    opacity: .5;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}
body.premium-ui [data-ui-role][aria-busy="true"] { cursor: progress; }

body.premium-ui :is(.transformation-mode-selector, .mode-toggle-pill, .video-param-pill, .context-pill, .main-tabs-container) {
    background: var(--ui-surface);
    border: 1px solid var(--ui-divider);
    border-radius: 12px;
    padding: 4px;
    gap: 4px;
    box-shadow: none;
}
body.premium-ui :is(.transformation-mode-btn, .context-btn, .toggle-btn, .area-text-btn,
    .typology-btn, .main-tab, .video-mode-tab, .video-config-btn, .pcb,
    .project-filter-chip, .camera-preset-chip, .sug-btn, .suggested-style-chip) {
    background: transparent !important;
    color: var(--ui-muted) !important;
    box-shadow: none !important;
    transform: none !important;
    border: 1px solid transparent !important;
    padding: 10px 12px;
}
body.premium-ui :is(.transformation-mode-btn, .context-btn, .toggle-btn, .area-text-btn,
    .typology-btn, .main-tab, .video-mode-tab, .video-config-btn, .pcb,
    .project-filter-chip, .camera-preset-chip, .sug-btn, .suggested-style-chip):is(.active, .selected, [aria-pressed="true"], [aria-selected="true"]) {
    background: var(--ui-selected) !important;
    color: var(--ui-selected-ink) !important;
    border-color: var(--ui-selected-border) !important;
    font-weight: 700 !important;
}
/* Segments have room for a stable check; thumbnails use an inset check below. */
body.premium-ui :is(.transformation-mode-btn, .typology-btn, .project-filter-chip):is(.active, [aria-pressed="true"])::before {
    content: '\2713';
    margin-inline-end: 6px;
    font-weight: 700;
}
body.premium-ui :is(.context-btn, .toggle-btn, .area-text-btn, .main-tab, .video-mode-tab):is(.active, [aria-selected="true"]) {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 5px;
}
body.premium-ui :is(.style-item, .color-item) { position: relative; }
body.premium-ui .style-item.active .style-thumb,
body.premium-ui .color-item.active .color-circle {
    border-color: var(--ui-selected-border) !important;
    box-shadow: 0 0 0 2px var(--ui-selected) !important;
    transform: none;
}
body.premium-ui :is(.style-item, .color-item).active::after {
    content: '\2713';
    position: absolute;
    top: 2px;
    right: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--ui-selected);
    color: var(--ui-ink);
    font: 700 13px/20px var(--ui-font);
    text-align: center;
    pointer-events: none;
}
body.premium-ui :is(.style-item, .color-item) span {
    color: var(--ui-muted);
    font-size: .75rem;
    line-height: 1.3;
    text-transform: none;
    letter-spacing: normal;
}
body.premium-ui :is(.style-item, .color-item).active span { color: var(--ui-ink); }
body.premium-ui .style-item { flex-basis: 80px; }
body.premium-ui .style-thumb { width: 64px; height: 64px; }

body.premium-ui .nav-item {
    color: var(--ui-muted);
    font-size: .75rem;
    font-weight: 500;
    min-height: 48px;
}
body.premium-ui .nav-item.active {
    color: var(--ui-ink);
    background: var(--ui-selected);
    border-color: var(--ui-selected-border);
    border-radius: 10px;
    font-weight: 700;
}
body.premium-ui .nav-item.active::after { background: var(--ui-selected-ink); }
body.premium-ui :is(.premium-new-btn, .premium-new-btn-primary, .hero-btn, .task-card, .action-card) {
    border-color: var(--ui-divider);
    box-shadow: none;
    transform: none;
}
body.premium-ui :is(.btn-icon-circle, .card-icon-box, .orange-glow, .teal-glow, .grey-glow):not([data-ui-role="generate"]) {
    background: var(--ui-raised);
    color: var(--ui-ink);
    box-shadow: none;
}
body.premium-ui :is(.premium-new-btn, .action-card):active { transform: none; box-shadow: none; }
body.premium-ui .premium-new-btn span { font-weight: 600; letter-spacing: normal; }
body.premium-ui :is(.config-section-title, .section-title, .quick-actions-title) {
    font-size: .875rem;
    font-weight: 600;
    color: var(--ui-muted);
    text-transform: none;
    letter-spacing: normal;
}
body.premium-ui :is(.branding-signature, .user-plan, .motor-tech, .motor-desc, .plan-name, #quota-text) {
    font-size: .75rem;
    line-height: 1.45;
    color: var(--ui-muted);
}
body.premium-ui :is(.creation-left-side, .creation-panel-container, .project-card-mini) {
    background: var(--ui-surface);
    border-radius: var(--ui-radius-card);
    box-shadow: none;
}
body.premium-ui .creation-right-side { background: var(--ui-canvas); border-radius: var(--ui-radius-card); }
body.premium-ui .creation-panel-container { border-color: var(--ui-divider); }
body.premium-ui .floating-glass-panel {
    background: rgba(21,25,31,.97);
    border-color: var(--ui-divider);
    border-radius: var(--ui-radius-panel);
    box-shadow: var(--ui-shadow-panel);
    backdrop-filter: none;
}
body.premium-ui :is(.mode-toggle-pill, .video-param-pill) { height: auto; min-height: 56px; }
body.premium-ui .top-bar .icon-btn { width: 48px; height: 48px; border-radius: 10px; }
body.premium-ui :is(.camera-preset-chip, .sug-btn, .suggested-style-chip) { white-space: normal; }
body.premium-ui :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]), textarea, select) {
    font-family: var(--ui-font) !important;
    font-size: 1rem !important;
    line-height: 1.45;
}
body.premium-ui :is(button, a, input, textarea, select, [tabindex]):focus-visible {
    outline: 2px solid var(--ui-focus) !important;
    outline-offset: 3px;
}

/* Web tools are a document flow, unlike the absolute native view stack. */
body.premium-ui[data-ui-platform="web"] #dashboard-view {
    position: relative;
    height: auto;
    min-height: 100vh;
    overflow-y: visible;
}
body.premium-ui[data-ui-platform="web"] #app-container { height: auto; min-height: 100vh; }
body.premium-ui[data-ui-platform="web"] .dashboard-header {
    padding: 16px 24px;
    gap: 16px;
    flex-wrap: wrap;
    background: var(--ui-surface);
}
body.premium-ui[data-ui-platform="web"] .dashboard-header :is(.logo-box, .header-right-box) {
    min-width: 0;
    flex-wrap: wrap;
}
body.premium-ui[data-ui-platform="web"] .main-tabs-container {
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: thin;
}
body.premium-ui[data-ui-platform="web"] .main-tab { flex-shrink: 0; white-space: nowrap; }
body.premium-ui[data-ui-platform="web"] .hero-titles { margin: 24px 0 !important; }
body.premium-ui[data-ui-platform="web"] .hero-titles h1 {
    font-size: clamp(1.5rem, 2.6vw, 2rem) !important;
    font-weight: 600 !important;
    letter-spacing: -.025em;
}
body.premium-ui[data-ui-platform="web"] .hero-titles p { font-size: 1rem !important; line-height: 1.5; }
body.premium-ui[data-ui-platform="web"] .creation-panel-layout { gap: 24px; }
body.premium-ui[data-ui-platform="web"] .creation-left-side { padding: 24px; gap: 20px; }

@media (max-width: 768px) {
    body.premium-ui .transformation-mode-btn { padding: 10px 6px; }
    body.premium-ui[data-ui-platform="web"] .dashboard-header { padding: 12px 16px; gap: 12px; }
    body.premium-ui[data-ui-platform="web"] .dashboard-header .header-right-box { gap: 8px !important; }
    body.premium-ui[data-ui-platform="web"] .hero-section { padding: 16px !important; }
    body.premium-ui[data-ui-platform="web"] .creation-panel-container { padding: 12px; margin-bottom: 24px; }
    body.premium-ui[data-ui-platform="web"] .creation-left-side { padding: 16px; }
    body.premium-ui[data-ui-platform="web"] .creation-panel-layout { flex-direction: column; gap: 16px; }
    body.premium-ui[data-ui-platform="web"] .hero-titles { margin: 16px 0 !important; text-align: left !important; }
    body.premium-ui[data-ui-platform="web"] .hero-titles h1 br { display: none; }
    /* Keep the 52px native area row and image stage coordinates intact. */
    body.premium-ui[data-ui-platform="android"] #workspace .context-pill { top: calc(64px + env(safe-area-inset-top)); }
    body.premium-ui[data-ui-platform="android"] .area-text-btn { min-height: 48px; height: 48px; padding-inline: 12px; }
    body.premium-ui[data-ui-platform="android"] .context-btn { padding-inline: 10px; }
    body.premium-ui[data-ui-platform="android"] .dashboard-header { padding: calc(20px + env(safe-area-inset-top)) 16px 20px; }
}

@media (prefers-reduced-motion: reduce) {
    body.premium-ui :is([data-ui-role], .nav-item, .main-tab, .toggle-btn, .style-item, .style-thumb,
        .color-item, .color-circle, .premium-new-btn, .action-card, .transformation-mode-btn, .hero-btn) {
        transition: none !important;
        animation: none !important;
    }
    body.premium-ui .horizontal-carousel { scroll-behavior: auto; }
}
body.premium-ui [data-ui-role="selection"] {background:var(--ui-raised) !important;color:var(--ui-ink) !important;border:1px solid var(--ui-divider) !important;box-shadow:none !important;}
body.premium-ui [data-ui-role="selection"].active,body.premium-ui [data-ui-role="selection"].selected {background:var(--ui-selected) !important;border-color:var(--ui-selected-border) !important;color:var(--ui-selected-ink) !important;}
body.premium-ui button.style-item,body.premium-ui button.color-item {font:inherit;cursor:pointer;background:transparent;appearance:none;}
.premium-tool-picker{display:none;}
.premium-tool-picker select{width:100%;min-height:48px;background:var(--ui-raised);color:var(--ui-ink);border:1px solid var(--ui-border);border-radius:12px;padding:10px;font:inherit;margin-top:6px;}
@media(max-width:768px){body.premium-ui[data-ui-platform="web"] .premium-tool-picker{display:block;margin-bottom:16px;color:var(--ui-muted);font-size:.875rem;}body.premium-tools-ready .main-tabs-container{display:none !important;}}
body.premium-ui .pulse-animation{animation:premium-pulse 1.4s ease-in-out infinite;}
@keyframes premium-pulse{50%{opacity:.45;}}
body.premium-ui[data-ui-platform="web"],body.premium-ui[data-ui-platform="web"] #app-container{width:100% !important;}
body.premium-ui .arquitech-promo-widget{position:relative !important;inset:auto !important;margin:24px auto !important;max-width:calc(100% - 32px) !important;}
body.premium-ui .arquitech-promo-widget a{background:var(--ui-raised) !important;color:var(--ui-ink) !important;box-shadow:none !important;border:1px solid var(--ui-divider);}

/* Results, projects and account: visual treatment only. Preserve canvas sizes,
 * comparison clipping, modal visibility, drawer slide positioning and billing IDs. */
body.premium-ui :is(.results-actions, .inpaint-controls) { padding: 20px 16px 24px; }
body.premium-ui .results-actions > [data-ui-role] { width: 100%; }
body.premium-ui :is(.inpaint-cost-note, .project-filter-hint, .presentation-field label) {
    font-size: .875rem;
    line-height: 1.45;
    color: var(--ui-muted);
    letter-spacing: normal;
    text-transform: none;
}
body.premium-ui .inpaint-brush-row { flex-wrap: wrap; gap: 12px; }
body.premium-ui .inpaint-brush-row span { font-size: .875rem; }
body.premium-ui :is(.inpaint-brush-row input[type="range"], .fidelity-slider) {
    accent-color: var(--ui-selected-border);
    min-height: 32px;
}
body.premium-ui .project-filter-row { gap: 8px; }
body.premium-ui :is(.project-card, .project-card-mini) {
    border-radius: var(--ui-radius-card);
    border-color: var(--ui-divider);
    box-shadow: none;
}
body.premium-ui .project-card-mini.selected {
    outline-color: var(--ui-selected-border);
    outline-width: 3px;
}
body.premium-ui .project-card-mini.selected .selection-dot {
    background: var(--ui-selected);
    border-color: var(--ui-selected-border);
    color: var(--ui-ink);
}
body.premium-ui .assign-project-row {
    min-height: 48px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--ui-raised);
    border-color: var(--ui-border);
    font-size: .875rem;
}
body.premium-ui .presentation-select-bar {
    background: var(--ui-surface);
    border-top-color: var(--ui-divider);
    gap: 12px;
}
body.premium-ui .presentation-select-bar .count-label { font-size: .875rem; line-height: 1.35; }
body.premium-ui .presentation-details-toggle {
    color: var(--ui-ink);
    font-size: .875rem;
    min-height: 48px;
    font-weight: 600;
}
body.premium-ui :is(.drawer-content, .subscription-card-container) {
    background: var(--ui-surface);
    border-color: var(--ui-divider);
    box-shadow: var(--ui-shadow-panel);
}
body.premium-ui .drawer-header { background: var(--ui-surface); border-bottom-color: var(--ui-divider); }
body.premium-ui .drawer-avatar-circle { color: var(--ui-selected-ink); }
body.premium-ui .drawer-user-details { min-width: 0; }
body.premium-ui .drawer-user-details :is(span, p) { overflow-wrap: anywhere; }
body.premium-ui .drawer-menu-item {
    min-height: 52px;
    color: var(--ui-ink);
    font-size: .9375rem;
    line-height: 1.4;
}
body.premium-ui .drawer-menu-item ion-icon { color: var(--ui-muted); }
body.premium-ui .drawer-menu-item-danger,
body.premium-ui .drawer-menu-item-danger ion-icon { color: var(--ui-danger); }
body.premium-ui .drawer-section-label {
    font-size: .75rem;
    color: var(--ui-muted);
    font-weight: 600;
    letter-spacing: normal;
}
body.premium-ui :is(.drawer-close-btn, .close-modal-btn) { min-width: 48px; min-height: 48px; box-shadow: none; }
body.premium-ui .drawer-divider { border-top-color: var(--ui-divider); }
body.premium-ui .drawer-footer { border-top-color: var(--ui-divider); }

/* Cards retain the existing entitlement and recommendation pseudo-labels;
 * only their visual finish changes, never wording or selection behavior. */
body.premium-ui .subscription-card-container { border-radius: var(--ui-radius-panel); }
body.premium-ui .sub-title { font-size: 1.5rem; font-weight: 600; line-height: 1.3; }
body.premium-ui .sub-tagline { font-size: .9375rem; color: var(--ui-muted); line-height: 1.5; }
body.premium-ui .plans-stack { gap: 20px; padding-top: 8px; }
body.premium-ui .plan-item-vip {
    background: var(--ui-raised);
    border-radius: var(--ui-radius-card);
    border-color: var(--ui-divider);
    padding: 18px 16px;
    gap: 12px;
    flex-wrap: wrap;
    box-shadow: none;
    transform: none;
    transition: border-color 150ms ease;
}
body.premium-ui .plan-item-vip:is(.is-active-plan, .recommended) {
    background: var(--ui-raised);
    border-color: #A78A60;
    box-shadow: none;
    transform: none;
}
body.premium-ui .plan-item-vip:is(.is-active-plan, .recommended)::before,
body.premium-ui .plan-item-vip:is(.is-active-plan, .recommended)::after {
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .02em;
    background: #D9B27C;
    color: #241B10;
    box-shadow: none;
}
body.premium-ui .plan-info-box { min-width: 0; flex: 1 1 170px; }
body.premium-ui .plan-tier { font-size: .875rem; font-weight: 600; }
body.premium-ui .plan-cost { font-size: 1.25rem; font-weight: 700; line-height: 1.4; }
body.premium-ui .plan-cost small { font-size: .8125rem; color: var(--ui-muted); }
body.premium-ui .plan-features { gap: 6px; margin-top: 8px; }
body.premium-ui .plan-features li { font-size: .8125rem; line-height: 1.4; color: var(--ui-muted); }
body.premium-ui .plan-features li.plan-per-render { font-size: .8125rem; color: var(--ui-muted); }
body.premium-ui .plan-savings-tag { font-size: .75rem; font-weight: 600; }
body.premium-ui .plan-select-btn {
    min-height: 48px;
    background: var(--ui-raised);
    border: 1px solid var(--ui-border);
    color: var(--ui-ink);
    font-size: .875rem;
    font-weight: 600;
    border-radius: var(--ui-radius-control);
    box-shadow: none;
}
body.premium-ui .plan-select-btn.orange { background: var(--ui-raised); }
body.premium-ui .plan-select-btn:disabled { color: #D9B27C; border-color: #A78A60; cursor: default; }
body.premium-ui :is(.ecosystem-value-strip, .user-chip, .credits-pill) {
    background: var(--ui-raised);
    border-color: var(--ui-divider);
    box-shadow: none;
    border-radius: 12px;
}
body.premium-ui .ecosystem-value-strip span { font-size: .875rem; line-height: 1.45; }
body.premium-ui :is(.user-name, .credits-num) { font-size: .875rem; color: var(--ui-ink); }
body.premium-ui .credits-label { font-size: .8125rem; color: var(--ui-muted); }
body.premium-ui .user-avatar { background: var(--ui-selected); color: var(--ui-ink); }
body.premium-ui .greeting-text p { font-size: .9375rem; color: var(--ui-muted); }
body.premium-ui .greeting-text h1 { font-weight: 600; }
body.premium-ui .dash-main { min-width: 0; }
body.premium-ui .dash-greeting { flex-wrap: wrap; gap: 16px; }
body.premium-ui .greeting-actions { flex-wrap: wrap; gap: 12px; }

@media (max-width: 480px) {
    body.premium-ui .plan-item-vip .plan-select-btn { flex: 1 1 100%; }
    body.premium-ui .presentation-select-bar { flex-wrap: wrap; }
    body.premium-ui .presentation-select-bar .count-label { flex-basis: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    body.premium-ui :is(.pulse-animation, .project-card.skeleton) { animation: none !important; }
    body.premium-ui :is(.plan-item-vip, .user-chip, .assign-project-row) { transition: none; }
}
body.premium-ui [data-ui-role="navigation"]{background:transparent !important;color:var(--ui-muted) !important;box-shadow:none !important;border:1px solid transparent !important;}
body.premium-ui [data-ui-role="navigation"].active{background:var(--ui-selected) !important;color:var(--ui-ink) !important;border-color:var(--ui-selected-border) !important;}
body.premium-ui [data-ui-role="navigation"] span,body.premium-ui [data-ui-role="navigation"] ion-icon{color:inherit !important;}
body.premium-ui .drawer-menu-item[role="button"]:focus-visible{outline:2px solid var(--ui-selected-border);outline-offset:-2px;border-radius:10px;}
body.premium-ui #generating-progress[data-ui-progress="pending"]{width:40% !important;animation:premium-pulse 1.4s ease-in-out infinite;}
@media(prefers-reduced-motion:reduce){body.premium-ui #generating-progress[data-ui-progress="pending"]{animation:none !important;}}
body.premium-ui button:is(.project-card,.project-card-mini){appearance:none;font:inherit;color:var(--ui-ink);text-align:left;padding:0;background:var(--ui-raised);border:1px solid var(--ui-divider);cursor:pointer;}
body.premium-ui [data-ui-role="generate"] :where(b,strong){color:inherit !important;}
body.premium-ui[data-ui-platform="web"] :is(#panel-videos,#panel-voz,#panel-avatares,#galeria-grid)>*{min-width:0;}
body.premium-ui[data-ui-platform="web"] #video-model-selector{width:100%;min-width:0;box-sizing:border-box;}
body.premium-ui[data-ui-platform="web"] #video-model-select{flex:1;min-width:0;max-width:100%;font-size:.875rem !important;}
body.premium-ui[data-ui-platform="web"] #galeria-grid{grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr)) !important;overflow-wrap:anywhere;}
body.premium-ui[data-ui-platform="web"] #galeria-grid>*{min-width:0;max-width:100%;}
body.premium-ui[data-ui-platform="web"] :is(#video-frame-start-col,#video-frame-end-col){min-width:0;}
body.premium-ui[data-ui-platform="web"] #panel-videos>.premium-video-modes{min-width:0;}
@media(max-width:768px){body.premium-ui[data-ui-platform="web"] .premium-video-modes{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));border-radius:12px !important;gap:4px !important;}body.premium-ui[data-ui-platform="web"] .premium-video-modes .video-mode-tab{border-radius:10px !important;padding:10px 6px !important;}body.premium-ui[data-ui-platform="web"] #video-images-container .upload-dropzone button:not([id^="btn-clear"]){padding-inline:6px !important;font-size:.75rem !important;width:100%;}}
body.premium-ui #btn-mejorar-fotorreal{white-space:normal !important;overflow-wrap:anywhere;}
body.premium-ui :is(.avatares-aspect-btn,.avatares-bg-tab){min-width:0;padding-inline:6px !important;white-space:normal;overflow-wrap:anywhere;}
/* Style labels must remain inside their cards, including scrollable desktop grids. */
body.premium-ui .style-item {
    height: auto;
    min-height: 124px;
    min-width: 0;
    box-sizing: border-box;
    padding: 8px 6px;
    align-self: start;
    justify-content: flex-start;
    gap: 8px;
}
body.premium-ui .style-thumb { flex-shrink: 0; }
body.premium-ui .style-item span {
    display: block;
    width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    flex-shrink: 0;
    min-height: 2.6em;
    text-align: center;
}
@media (min-width: 768px) {
    body.premium-ui .horizontal-carousel {
        grid-auto-rows: max-content;
        align-content: start;
        align-items: start;
    }
}
body.premium-ui .style-picker-grid { grid-auto-rows: max-content; align-items: start; }

/* Avatars temporarily hidden until the architectural workflow is defined. */
#tab-avatares, #panel-avatares, a[href$="#avatares"] { display: none !important; }
