:root {
  color-scheme: light;
  --lz-color-primary: #2563eb;
  --lz-color-primary-hover: #1d4ed8;
  --lz-color-primary-soft: rgba(37, 99, 235, 0.12);
  --lz-color-accent: #7c3aed;
  --lz-color-accent-soft: rgba(124, 58, 237, 0.12);
  --lz-color-text: #0f172a;
  --lz-color-text-secondary: #475569;
  --lz-color-text-muted: #64748b;
  --lz-color-surface: #ffffff;
  --lz-color-surface-raised: rgba(255, 255, 255, 0.96);
  --lz-color-surface-soft: #f8fafc;
  --lz-color-canvas: #eef2f7;
  --lz-color-border: #dbe3ee;
  --lz-color-success: #16a34a;
  --lz-color-warning: #d97706;
  --lz-color-danger: #dc2626;
  --lz-color-overlay: rgba(15, 23, 42, 0.48);
  --lz-gradient-hero: linear-gradient(135deg, #eff6ff 0%, #f5f3ff 52%, #ffffff 100%);
  --lz-home-canvas: #050816;
  --lz-home-surface: #0a1020;
  --lz-home-surface-raised: rgba(14, 22, 40, 0.88);
  --lz-home-surface-soft: rgba(255, 255, 255, 0.04);
  --lz-home-border: rgba(148, 163, 184, 0.18);
  --lz-home-border-strong: rgba(148, 163, 184, 0.3);
  --lz-home-text: #f8fafc;
  --lz-home-text-secondary: #a6afc3;
  --lz-home-text-muted: #758097;
  --lz-home-accent: #ffc400;
  --lz-home-accent-hover: #ffd43b;
  --lz-home-accent-contrast: #251d00;
  --lz-home-cyan: #35e5e2;
  --lz-home-blue: #69a7ff;
  --lz-home-purple: #9b78ff;
  --lz-home-glow: rgba(53, 229, 226, 0.18);
  --lz-home-overlay: rgba(3, 7, 18, 0.82);
  --lz-home-gradient: radial-gradient(circle at 50% 38%, rgba(24, 45, 78, 0.42), transparent 34%), linear-gradient(180deg, #050816 0%, #070b17 52%, #050816 100%);
  --lz-home-card-gradient: linear-gradient(145deg, rgba(16, 25, 45, 0.94), rgba(7, 12, 26, 0.92));
  --lz-home-shadow: 0 24px 70px rgba(0, 0, 0, 0.32);
  --lz-front-workspace-bg: #1b1c20;
  --lz-front-video-stage-bg: #1b1c20;
  --lz-front-composer-panel: #242424;
  --lz-front-composer-border: rgba(255, 255, 255, 0.12);
  --lz-front-composer-control: rgba(255, 255, 255, 0.055);
  --lz-front-composer-control-border: rgba(255, 255, 255, 0.12);
  --lz-front-composer-text: #f6f7fb;
  --lz-front-composer-muted: #9ca3af;
  --lz-front-guide-panel: rgba(31, 34, 40, 0.74);
  --lz-front-guide-gradient: linear-gradient(135deg, rgba(46, 51, 61, 0.82), rgba(28, 31, 38, 0.7));
  --lz-front-guide-border: rgba(255, 255, 255, 0.12);
  --lz-front-guide-text: #e7e7e7;
  --lz-front-guide-shadow: 0 18px 46px rgba(12, 16, 24, 0.2);
  --lz-front-param-panel: rgba(34, 36, 42, 0.86);
  --lz-front-param-panel-border: rgba(255, 255, 255, 0.1);
  --lz-front-param-panel-hover: rgba(255, 255, 255, 0.08);
  --lz-front-param-shadow: 0 18px 48px rgba(0, 0, 0, 0.46);
  --lz-front-floating-control: rgba(42, 44, 49, 0.94);
  --lz-front-floating-control-hover: rgba(55, 58, 65, 0.98);
  --lz-front-billing-surface: rgba(255, 255, 255, 0.07);
  --lz-front-billing-text: #ffaf3f;
  --lz-front-billing-border: rgba(255, 255, 255, 0.12);
  --lz-front-danger: #ef4444;
  --lz-front-loader-surface: rgba(27, 28, 32, 0.78);
  --lz-front-loader-text: #a8b0bd;
  --lz-front-loader-spinner-track: rgba(148, 163, 184, 0.3);
  --lz-front-loader-spinner-accent: #60a5fa;
  --lz-front-loader-backdrop-filter: blur(16px) saturate(0.72);
  --lz-front-loader-layer: 12;
  --lz-front-loader-padding: var(--lz-space-6);
  --lz-front-loader-mobile-padding-inline: var(--lz-space-5);
  --lz-front-loader-spinner-size: 36px;
  --lz-front-loader-spinner-border-width: 3px;
  --lz-front-loader-status-gap: var(--lz-space-3);
  --lz-front-loader-font-size: 13px;
  --lz-front-loader-font-weight: 700;
  --lz-front-loader-line-height: 20px;
  --lz-front-loader-spin-duration: 720ms;
  --lz-creative-composer-content-width: 980px;
  --lz-creative-composer-height: 208px;
  --lz-creative-composer-shell-height: 222px;
  --lz-creative-composer-bottom-inset: calc(var(--lz-creative-composer-shell-height) - var(--lz-creative-composer-height));
  --lz-creative-composer-prompt-inset: 22px;
  --lz-creative-composer-prompt-bottom: 64px;
  --lz-creative-composer-controls-right: 76px;
  --lz-creative-composer-controls-bottom: 18px;
  --lz-creative-composer-controls-height: 34px;
  --lz-creative-composer-tools-gap: 1px;
  --lz-creative-composer-tools-offset: calc((var(--lz-creative-composer-controls-height) + var(--lz-creative-composer-tools-gap)) * -1);
  --lz-creative-composer-mobile-height: 190px;
  --lz-creative-composer-mobile-bottom-inset: 10px;
  --lz-creative-composer-mobile-inline: 12px;
  --lz-creative-composer-mobile-top: 16px;
  --lz-creative-composer-mobile-prompt-bottom: 62px;
  --lz-creative-composer-mobile-controls-right: 72px;
  --lz-creative-composer-mobile-controls-bottom: 16px;
  --lz-creative-mobile-composer-shell-height: 238px;
  --lz-creative-mobile-result-role-gap: var(--lz-space-3);
  --lz-creative-mobile-content-clearance: calc(var(--lz-creative-mobile-composer-shell-height) + var(--lz-ai-agent-role-strip-mobile-offset-y) + var(--lz-creative-mobile-result-role-gap) + var(--lz-safe-bottom));
  --lz-ai-agent-selector-layer: 32;
  --lz-ai-agent-avatar-bg: #64748b;
  --lz-ai-agent-pill-width: 220px;
  --lz-ai-agent-pill-avatar: 26px;
  --lz-ai-agent-clear-size: 28px;
  --lz-ai-agent-panel-width: 340px;
  --lz-ai-agent-panel-height: 300px;
  --lz-ai-agent-option-avatar: 40px;
  --lz-ai-agent-create-glyph-size: 28px;
  --lz-ai-agent-selected-ring: 3px;
  --lz-ai-agent-owner-badge-size: 9px;
  --lz-ai-agent-manager-width: 780px;
  --lz-ai-agent-manager-height: 760px;
  --lz-ai-agent-manager-mobile-height: 92svh;
  --lz-ai-agent-manager-radius: 20px;
  --lz-ai-agent-manager-close-size: 36px;
  --lz-ai-agent-card-avatar-size: 48px;
  --lz-ai-agent-card-description-height: 44px;
  --lz-ai-agent-form-prompt-height: 210px;
  --lz-ai-agent-login-copy-width: 420px;
  --lz-ai-agent-focus-ring: 3px;
  --lz-ai-agent-role-strip-offset-y: 40px;
  --lz-ai-agent-role-strip-mobile-offset-y: 42px;
  --lz-ai-agent-role-strip-inset-x: 12px;
  --lz-ai-agent-role-strip-mobile-inset-x: 8px;
  --lz-ai-agent-role-strip-shell-gutter: 64px;
  --lz-ai-agent-role-desktop-visible-count: 10;
  --lz-ai-agent-role-mobile-visible-count: 5;
  --lz-ai-agent-role-strip-desktop-capacity: 355px;
  --lz-ai-agent-role-strip-mobile-capacity: 220px;
  --lz-ai-agent-role-strip-surface-inset-x: 5px;
  --lz-ai-agent-role-strip-surface-inset-y: 4px;
  --lz-ai-agent-role-strip-surface-layer: 0;
  --lz-ai-agent-role-strip-content-layer: 1;
  --lz-ai-agent-role-strip-surface: var(--lz-front-billing-surface);
  --lz-ai-agent-role-strip-surface-border: var(--lz-front-billing-border);
  --lz-ai-agent-role-scroll-padding-y: 1px;
  --lz-ai-agent-role-gap: 5px;
  --lz-ai-agent-role-size: 31px;
  --lz-ai-agent-role-mobile-size: 40px;
  --lz-ai-agent-role-avatar-size: 27px;
  --lz-ai-agent-role-mobile-avatar-size: 34px;
  --lz-ai-agent-role-border-width: 2px;
  --lz-ai-agent-role-border: var(--lz-front-billing-border);
  --lz-ai-agent-role-surface: var(--lz-front-billing-surface);
  --lz-ai-agent-role-hover-border: var(--lz-front-billing-text);
  --lz-ai-agent-role-hover-shadow: 0 2px 8px rgba(0, 0, 0, 0.22), 0 0 9px color-mix(in srgb, var(--lz-front-billing-text) 18%, transparent);
  --lz-ai-agent-role-hover-offset: -1px;
  --lz-ai-agent-role-selected-border: var(--lz-color-accent);
  --lz-ai-agent-role-selected-shadow: 0 0 0 2px color-mix(in srgb, var(--lz-color-accent) 22%, transparent), 0 2px 8px rgba(0, 0, 0, 0.22);
  --lz-ai-agent-role-create-border: var(--lz-front-billing-border);
  --lz-ai-agent-role-create-hover-border: var(--lz-front-billing-text);
  --lz-ai-agent-role-plus: var(--lz-front-billing-text);
  --lz-ai-agent-role-plus-size: 16px;
  --lz-ai-agent-role-plus-line-height: 24px;
  --lz-ai-agent-role-strip-collapse-duration: 280ms;
  --lz-ai-agent-role-strip-collapse-offset: 26px;
  --lz-ai-agent-role-strip-collapse-scale: .985;
  --lz-role-overlay-layer: 100220;
  --lz-role-overlay-bg: rgba(80, 90, 100, 0.35);
  --lz-role-overlay-blur: 8px;
  --lz-role-glow-layer: 1;
  --lz-role-content-layer: 2;
  --lz-role-close-layer: 3;
  --lz-role-panel-width: 705.6px;
  --lz-role-panel-max-height: 880px;
  --lz-role-panel-bg: #ffffff;
  --lz-role-panel-text: #000000;
  --lz-role-panel-border: rgba(0, 0, 0, 0.08);
  --lz-role-panel-radius: 18.375px;
  --lz-role-panel-shadow: 0 25px 60px rgba(0, 0, 0, 0.15), 0 8px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
  --lz-role-panel-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "HarmonyOS Sans", "Microsoft YaHei", sans-serif;
  --lz-role-panel-font-size: 14.7px;
  --lz-role-panel-line-height: 22.05px;
  --lz-role-glow-height: 2px;
  --lz-role-glow-opacity: 0.6;
  --lz-role-glow-bg: linear-gradient(90deg, transparent, rgba(0, 161, 194, 0.72), transparent);
  --lz-role-accent: #00a1c2;
  --lz-role-accent-soft: rgba(0, 161, 194, 0.08);
  --lz-role-accent-border: rgba(0, 161, 194, 0.4);
  --lz-role-close-size: 29.4px;
  --lz-role-close-inset: 12.86px;
  --lz-role-close-bg: rgba(0, 0, 0, 0.04);
  --lz-role-close-bg-hover: rgba(0, 0, 0, 0.08);
  --lz-role-close-color: rgba(0, 0, 0, 0.4);
  --lz-role-header-padding: 18.375px 22.05px 11.025px;
  --lz-role-header-gap: 12.8625px;
  --lz-role-header-icon-size: 36.75px;
  --lz-role-header-icon-radius: 11.025px;
  --lz-role-header-icon-bg: rgba(0, 161, 194, 0.09);
  --lz-role-title-size: 15.6187px;
  --lz-role-title-line: 23.4375px;
  --lz-role-title-weight: 600;
  --lz-role-title-group-gap: 1.8375px;
  --lz-role-subtitle-size: 11.025px;
  --lz-role-subtitle-line: 16.5375px;
  --lz-role-muted: #8c96a3;
  --lz-role-secondary: #4a5568;
  --lz-role-tabs-height: 36.375px;
  --lz-role-tabs-padding: 0 22.05px;
  --lz-role-tabs-gap: 3.675px;
  --lz-role-tabs-border: rgba(0, 0, 0, 0.07);
  --lz-role-tab-padding: 9.1875px 14.7px;
  --lz-role-tab-gap: 5.5125px;
  --lz-role-tab-size: 11.9437px;
  --lz-role-tab-color: #8c96a3;
  --lz-role-tab-active: #5a6577;
  --lz-role-body-padding: 14.7px 22.05px 22.05px;
  --lz-role-body-list-height: 554.91px;
  --lz-role-body-form-height: 568.72px;
  --lz-role-card-bg: #f7f8fa;
  --lz-role-card-border: rgba(0, 0, 0, 0.06);
  --lz-role-card-radius: 12.8625px;
  --lz-role-card-padding: 14.7px 16.5375px;
  --lz-role-card-gap: 9.1875px;
  --lz-role-section-header-gap: 7.35px;
  --lz-role-section-header-margin: 11.025px;
  --lz-role-grid-gap: 11.025px;
  --lz-role-form-grid-height: 476.25px;
  --lz-role-form-top-card-height: 182.797px;
  --lz-role-form-prompt-card-height: 282.422px;
  --lz-role-list-scroll-height: 294px;
  --lz-role-list-gap: 7.35px;
  --lz-role-item-height: 60.781px;
  --lz-role-item-padding: 11.025px 88.2px 11.025px 33.075px;
  --lz-role-item-gap: 11.025px;
  --lz-role-item-bg: #ffffff;
  --lz-role-item-hover-bg: rgba(248, 250, 252, 0.86);
  --lz-role-item-border: rgba(0, 0, 0, 0.07);
  --lz-role-item-hover-border: rgba(100, 116, 139, 0.12);
  --lz-role-item-selected-bg: color-mix(in srgb, var(--lz-role-accent) 7%, #ffffff);
  --lz-role-item-selected-border: var(--lz-role-accent-border);
  --lz-role-item-selected-shadow: 0 0 0 2px color-mix(in srgb, var(--lz-role-accent) 12%, transparent);
  --lz-role-item-radius: 9.1875px;
  --lz-role-item-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  --lz-role-avatar-size: 36.75px;
  --lz-role-avatar-border: rgba(0, 0, 0, 0.06);
  --lz-role-avatar-radius: 50%;
  --lz-role-drag-left: 7.35px;
  --lz-role-drag-width: 18.375px;
  --lz-role-drag-height: 29.391px;
  --lz-role-drag-radius: 5.5125px;
  --lz-role-drag-color: rgba(100, 116, 139, 0.38);
  --lz-role-badge-inset: 5.5125px;
  --lz-role-badge-padding: 1.47px 5.5125px;
  --lz-role-badge-radius: 3.675px;
  --lz-role-badge-size: 8.26875px;
  --lz-role-badge-weight: 500;
  --lz-role-badge-line: 12.4031px;
  --lz-role-badge-custom-bg: rgba(217, 119, 6, 0.08);
  --lz-role-badge-custom-color: #b45309;
  --lz-role-badge-official-bg: rgba(0, 161, 194, 0.08);
  --lz-role-badge-official-color: #0891b2;
  --lz-role-action-size: 22.05px;
  --lz-role-action-right: 11.025px;
  --lz-role-action-bottom: 5.5125px;
  --lz-role-action-font-size: 13.3333px;
  --lz-role-action-line: 13.3333px;
  --lz-role-action-radius: 50%;
  --lz-role-actions-gap: 5.5125px;
  --lz-role-actions-bg: rgba(255, 255, 255, 0.88);
  --lz-role-actions-border: rgba(0, 0, 0, 0.1);
  --lz-role-actions-shadow: 0 7.35px 16.5375px rgba(15, 23, 42, 0.1);
  --lz-role-action-bg: rgba(15, 23, 42, 0.04);
  --lz-role-action-border: rgba(15, 23, 42, 0.08);
  --lz-role-action-color: rgba(15, 23, 42, 0.62);
  --lz-role-action-active-bg: rgba(0, 161, 194, 0.1);
  --lz-role-action-active-border: rgba(0, 161, 194, 0.4);
  --lz-role-card-description-size: 10.1062px;
  --lz-role-card-description-line: 15.1594px;
  --lz-role-card-description-margin: 1.8375px;
  --lz-role-danger: #dc2626;
  --lz-role-remove-avatar-bg: rgba(220, 50, 50, 0.06);
  --lz-role-remove-avatar-padding: 3.675px 9.1875px;
  --lz-role-field-height: 34.375px;
  --lz-role-field-bg: #f2f3f5;
  --lz-role-field-border: rgba(0, 0, 0, 0.08);
  --lz-role-field-color: #1a1d21;
  --lz-role-field-radius: 7.35px;
  --lz-role-field-padding: 9.1875px 12.8625px;
  --lz-role-field-gap: 5.5125px;
  --lz-role-field-size: 11.9437px;
  --lz-role-field-line: 17.9156px;
  --lz-role-control-font: Arial, sans-serif;
  --lz-role-control-line: normal;
  --lz-role-hint-color: #a0aab4;
  --lz-role-hint-size: 9.1875px;
  --lz-role-hint-line: 13.7812px;
  --lz-role-hint-margin: 3.675px;
  --lz-role-count-color: #b0b8c4;
  --lz-role-prompt-height: 163.625px;
  --lz-role-prompt-tools-margin: 5.5125px;
  --lz-role-avatar-upload-size: 58.797px;
  --lz-role-avatar-upload-bg: #f2f3f5;
  --lz-role-avatar-upload-border: rgba(0, 0, 0, 0.12);
  --lz-role-avatar-upload-radius: 50%;
  --lz-role-optimize-height: 26.2812px;
  --lz-role-optimize-padding: 5.145px 11.025px;
  --lz-role-optimize-gap: 5.145px;
  --lz-role-optimize-size: 10.1062px;
  --lz-role-optimize-bg: rgba(0, 161, 194, 0.06);
  --lz-role-optimize-border: rgba(0, 161, 194, 0.16);
  --lz-role-form-actions-gap: 9.1875px;
  --lz-role-form-actions-margin: 7.35px;
  --lz-role-form-actions-padding: 11.025px;
  --lz-role-form-button-height: 36.375px;
  --lz-role-button-padding: 9.1875px;
  --lz-role-button-radius: 7.35px;
  --lz-role-button-muted-bg: #f2f3f5;
  --lz-role-button-muted-border: rgba(0, 0, 0, 0.08);
  --lz-role-button-primary-bg: #00a1c2;
  --lz-role-button-primary-disabled-bg: #7bcbd9;
  --lz-role-button-text: #ffffff;
  --lz-role-disabled-opacity: 0.5;
  --lz-role-list-card-height: 518.172px;
  --lz-role-list-card-border: rgba(0, 0, 0, 0.1);
  --lz-role-model-border: rgba(0, 0, 0, 0.08);
  --lz-role-model-height: 27.563px;
  --lz-role-model-save-height: 30.688px;
  --lz-role-model-save-padding: 7.35px;
  --lz-role-model-radius: 5.5125px;
  --lz-role-model-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --lz-role-model-save-shadow: 0 3px 12px rgba(0, 161, 194, 0.32);
  --lz-role-model-hint-size: 10.1062px;
  --lz-role-model-hint-line: 14.1488px;
  --lz-role-model-selector-size: 13.3333px;
  --lz-role-model-selector-gap: 5.5125px;
  --lz-role-model-selector-padding: 0 9.1875px;
  --lz-role-model-selector-text: #1e2332;
  --lz-role-model-selector-border: rgba(0, 0, 0, 0.12);
  --lz-role-model-icon-size: 14px;
  --lz-role-model-icon-filter: invert(1);
  --lz-role-model-chevron-size: 10px;
  --lz-role-model-menu-gap: 3.675px;
  --lz-role-model-menu-padding: 5.5125px;
  --lz-role-model-menu-offset: 3.675px;
  --lz-role-model-menu-layer: 3;
  --lz-role-model-menu-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
  --lz-role-status-error: #dc2626;
  --lz-role-mobile-inline-gutter: var(--lz-space-3);
  --lz-role-mobile-block-gutter: var(--lz-space-3);
  --lz-role-mobile-width: calc(min(100vw, 100dvw) - var(--lz-role-mobile-inline-gutter) - var(--lz-role-mobile-inline-gutter) - var(--lz-safe-left) - var(--lz-safe-right));
  --lz-role-mobile-max-height: min(92svh, calc(100dvh - var(--lz-role-mobile-block-gutter) - var(--lz-role-mobile-block-gutter) - var(--lz-safe-top) - var(--lz-safe-bottom)));
  --lz-border-width: 1px;
  --lz-border-width-lg: 2px;
  --lz-font-weight-light: 300;
  --lz-font-weight-bold: 700;
  --lz-control-height: var(--lz-control-height-md);
  --lz-image-stage-bottom-space: 232px;
  --lz-video-stage-bottom-space: 246px;
  --lz-audio-content-width: var(--lz-creative-composer-content-width);
  --lz-audio-panel-width: 520px;
  --lz-audio-empty-offset: 120px;
  --lz-audio-empty-icon-size: 68px;
  --lz-audio-empty-icon-glyph-size: 34px;
  --lz-audio-stage-bottom-space: 280px;
  --lz-audio-composer-height: var(--lz-creative-composer-height);
  --lz-audio-composer-control-reserve: 72px;
  --lz-audio-composer-controls-bottom-space: 76px;
  --lz-audio-composer-controls-height: var(--lz-creative-composer-controls-height);
  --lz-audio-param-min-width: 74px;
  --lz-audio-param-max-width: 128px;
  --lz-audio-model-min-width: 148px;
  --lz-audio-model-max-width: 236px;
  --lz-audio-mobile-stage-bottom-space: calc(var(--lz-audio-mobile-shell-height) + var(--lz-space-3));
  --lz-audio-mobile-empty-offset: 104px;
  --lz-audio-mobile-shell-height: 306px;
  --lz-audio-mobile-composer-height: 258px;
  --lz-audio-mobile-control-reserve: 58px;
  --lz-audio-mobile-controls-bottom-space: 56px;
  --lz-audio-mobile-model-min-width: 132px;
  --lz-audio-mobile-model-max-width: 168px;
  --lz-creative-result-card-size: 194px;
  --lz-media-player-width: 480px;
  --lz-media-player-art-size: 180px;
  --lz-media-player-disc-size: 132px;
  --lz-media-player-toggle-size: 52px;
  --lz-media-player-action-height: 36px;
  --lz-media-player-track-height: 4px;
  --lz-media-player-thumb-size: 14px;
  --lz-media-player-volume-width: 86px;
  --lz-media-player-overlay: rgba(3, 7, 18, 0.72);
  --lz-media-player-layer: 100260;
  --lz-creative-prompt-width: 560px;
  --lz-creative-prompt-max-height: min(76dvh, 620px);
  --lz-creative-prompt-content-min-height: 150px;
  --lz-creative-prompt-mobile-content-min-height: 120px;
  --lz-creative-prompt-header-height: 64px;
  --lz-creative-prompt-footer-height: 56px;
  --lz-creative-prompt-layer: 100120;
  --lz-icon-size-sm: 16px;
  --lz-control-width-sm: 64px;
  --lz-control-height-md: 40px;
  --lz-scrollbar-size: 5px;
  --lz-focus-ring-size: 3px;
  --lz-opacity-disabled: 0.52;
  --lz-audio-voice-trigger-height: 34px;
  --lz-audio-voice-trigger-max-width: 240px;
  --lz-audio-voice-trigger-icon-size: 26px;
  --lz-audio-voice-toolbar-gap: var(--lz-creative-composer-tools-gap);
  --lz-audio-voice-dialog-width: 960px;
  --lz-audio-voice-dialog-max-height: min(86dvh, 740px);
  --lz-audio-voice-dialog-layer: 100280;
  --lz-audio-voice-card-min-width: 160px;
  --lz-audio-voice-card-min-height: 138px;
  --lz-audio-voice-card-icon-size: 38px;
  --lz-audio-voice-preview-size: 30px;
  --lz-audio-voice-overlay: rgba(3, 7, 18, 0.68);
  --lz-audio-voice-male-surface: color-mix(in srgb, var(--lz-color-primary) 9%, var(--lz-front-param-panel));
  --lz-audio-voice-male-border: color-mix(in srgb, var(--lz-color-primary) 28%, var(--lz-front-param-panel-border));
  --lz-audio-voice-female-surface: color-mix(in srgb, var(--lz-color-accent) 9%, var(--lz-front-param-panel));
  --lz-audio-voice-female-border: color-mix(in srgb, var(--lz-color-accent) 26%, var(--lz-front-param-panel-border));
  --lz-audio-voice-neutral-surface: color-mix(in srgb, var(--lz-front-param-panel-hover) 48%, var(--lz-front-param-panel));
  --lz-audio-lyrics-trigger-max-width: 240px;
  --lz-audio-lyrics-dialog-width: 520px;
  --lz-audio-lyrics-dialog-max-height: min(82dvh, 620px);
  --lz-audio-lyrics-result-min-height: 200px;
  --lz-audio-lyrics-layer: 100290;
  --lz-audio-lyrics-overlay: rgba(3, 7, 18, 0.72);
  --lz-audio-lyrics-primary: #7c5cff;
  --lz-audio-lyrics-primary-hover: #6d4df2;
  --lz-audio-lyrics-primary-contrast: #ffffff;
  --lz-audio-lyrics-primary-soft: rgba(124, 92, 255, 0.13);
  --lz-audio-lyrics-success: #22c55e;
  --lz-audio-lyrics-warning: #f6c453;
  --lz-audio-lyrics-spinner-track: rgba(124, 92, 255, 0.2);
  --lz-audio-lyrics-result-surface: color-mix(in srgb, var(--lz-front-param-panel-hover) 58%, var(--lz-front-param-panel));
  --lz-audio-lyrics-result-line: color-mix(in srgb, var(--lz-audio-lyrics-primary) 28%, var(--lz-front-param-panel-border));
  --lz-audio-lyrics-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
  --lz-font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  --lz-font-size-xs: 12px;
  --lz-font-size-sm: 13px;
  --lz-font-size-md: 14px;
  --lz-font-size-lg: 16px;
  --lz-font-size-xl: 18px;
  --lz-font-size-2xl: 24px;
  --lz-font-size-3xl: 30px;
  --lz-icon-size-md: 18px;
  --lz-control-height-sm: 34px;
  --lz-line-height-tight: 1.25;
  --lz-line-height-normal: 1.6;
  --lz-space-1: 4px;
  --lz-space-2: 8px;
  --lz-space-3: 12px;
  --lz-space-4: 16px;
  --lz-space-5: 20px;
  --lz-space-6: 24px;
  --lz-space-8: 32px;
  --lz-radius-sm: 6px;
  --lz-radius-md: 8px;
  --lz-radius-lg: 12px;
  --lz-radius-xl: 18px;
  --lz-radius-pill: 999px;
  --lz-social-qq-background: #18b8f2;
  --lz-social-wechat-background: #07c160;
  --lz-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
  --lz-shadow-md: 0 8px 20px rgba(15, 23, 42, 0.12);
  --lz-shadow-lg: 0 14px 34px rgba(15, 23, 42, 0.08);
  --lz-duration-fast: 120ms;
  --lz-duration-normal: 180ms;
  --lz-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 150ms;
  --duration-normal: 250ms;
  --lz-reference-asset-trigger-inline-offset: -8px;
  --lz-z-creative-reference-active: 8;
  --lz-z-dropdown: 1000;
  --lz-z-dialog: 1100;
  --lz-z-toast: 1200;
  --lz-z-priority-dialog: 2147483647;
  --lz-z-theme-transition: 2147483600;
  --jn-qicon-bell: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27black%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9%27/%3E%3Cpath d=%27M10 21h4%27/%3E%3C/svg%3E");
  --jn-qicon-pin: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27black%27%3E%3Cpath d=%27M14 2a1 1 0 0 1 1 1v3.17l2.41 2.42A2 2 0 0 1 18 10v1a1 1 0 0 1-1 1h-4v7l-1 3-1-3v-7H7a1 1 0 0 1-1-1v-1a2 2 0 0 1 .59-1.41L9 6.17V3a1 1 0 0 1 1-1h4Z%27/%3E%3C/svg%3E");
  --lz-notice-header-icon-color: #f8feff;
  --lz-notice-accent-default: #38bdf8;
  --lz-notice-accent-activity: #fbbf24;
  --lz-notice-accent-maintenance: #fb7185;
  --lz-notice-accent-general: #a78bfa;
  --lz-notice-text: #e7f1ff;
  --lz-notice-title: #f8fafc;
  --lz-notice-muted: #9caabc;
  --lz-notice-surface: rgba(21, 26, 36, 0.72);
  --lz-notice-surface-soft: rgba(255, 255, 255, 0.045);
  --lz-notice-surface-raised: rgba(255, 255, 255, 0.08);
  --lz-notice-border: rgba(148, 163, 184, 0.2);
  --lz-notice-border-soft: rgba(148, 163, 184, 0.14);
  --lz-notice-link: #67e8f9;
  --lz-notice-code-text: #bae6fd;
  --lz-notice-code-surface: rgba(8, 47, 73, 0.34);
  --lz-notice-code-border: rgba(125, 211, 252, 0.18);
  --lz-notice-media-surface: rgba(2, 6, 23, 0.28);
  --lz-notice-danger: #fb3f55;
  --lz-notice-danger-contrast: #ffffff;
  --lz-notice-pin-surface: linear-gradient(135deg, #fcd34d 0%, #f59e0b 100%);
  --lz-notice-pin-text: #2d1a00;
  --lz-notice-pin-border: rgba(253, 230, 138, 0.82);
  --lz-notice-pin-shadow: 0 5px 14px rgba(245, 158, 11, 0.24);
  --lz-notice-card-shadow: 0 18px 44px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  --lz-notice-card-active-shadow: 0 24px 54px rgba(0, 0, 0, 0.22), 0 0 0 1px color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 76%);
  --lz-notice-block-title-surface: linear-gradient(90deg, color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 84%), transparent);
  --lz-notice-block-pill-surface: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 84%);
  --lz-notice-block-card-surface: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 92%);
  --lz-notice-block-line-surface: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 94%);
  --lz-notice-block-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  --lz-notice-media-max-height: 420px;
  --lz-notice-media-mobile-max-height: 260px;
  --lz-notice-file-icon-size: 28px;
  --lz-notice-border-width: 1px;
  --lz-notice-accent-line-width: 3px;
  --lz-notice-card-accent-line-width: 4px;
  --lz-notice-font-weight-body: 650;
  --lz-notice-font-weight-meta: 800;
  --lz-notice-font-weight-label: 850;
  --lz-notice-font-weight-heading: 900;
  --lz-notice-font-weight-strong: 950;
  --lz-notice-line-height-heading: 1.35;
  --lz-notice-line-height-body: 1.86;
  --lz-notice-line-height-body-mobile: 1.72;
  --lz-notice-font-size-body-mobile: 13.5px;
  --lz-front-password-overlay: rgba(3, 7, 18, 0.78);
  --lz-theme-transition-light: #f7f8fb;
  --lz-theme-transition-dark: #111111;
  --lz-theme-transition-admin-dark: #0f1117;
  --lz-theme-transition-creative-dark: #1b1c20;
  --lz-recharge-canvas: #f7f8fc;
  --lz-recharge-surface: #ffffff;
  --lz-recharge-surface-soft: #f5f7fd;
  --lz-recharge-border: #e1e5ee;
  --lz-recharge-border-strong: #d5dae5;
  --lz-recharge-text: #161a25;
  --lz-recharge-text-secondary: #687184;
  --lz-recharge-text-muted: #8e96a8;
  --lz-recharge-primary: #6675f5;
  --lz-recharge-primary-disabled: #86a8ef;
  --lz-recharge-gold: #e1a800;
  --lz-recharge-green: #3aa98f;
  --lz-recharge-head-text: #202538;
  --lz-recharge-head-muted: #858da2;
  --lz-recharge-head-mark: #6874eb;
  --lz-recharge-head-mark-surface: #f0f2ff;
  --lz-recharge-head-mark-border: #dfe4fb;
  --lz-recharge-head-border: #e7ebf2;
  --lz-recharge-close-text: #626a7e;
  --lz-recharge-close-surface: #f6f7fb;
  --lz-recharge-close-border: #e0e4ee;
  --lz-recharge-nav-tab-text: rgba(255, 255, 255, 0.96);
  --lz-recharge-nav-icon-surface: rgba(255, 255, 255, 0.035);
  --lz-recharge-nav-icon-border: rgba(255, 255, 255, 0.34);
  --lz-recharge-nav-icon-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
  --lz-recharge-nav-icon-text: #64748b;
  --lz-recharge-nav-active-text: #4f63cf;
  --lz-recharge-nav-active-surface: #ffffff;
  --lz-recharge-nav-active-border: #ffffff;
  --lz-recharge-nav-active-icon-surface: #eef0ff;
  --lz-recharge-nav-active-icon-text: #64748b;
  --lz-recharge-nav-active-shadow: 0 10px 22px rgba(31, 47, 113, 0.18);
  --lz-recharge-redeem-balance-surface: #effaf6;
  --lz-recharge-redeem-balance-border: #bfe5d9;
  --lz-recharge-redeem-balance-label: #3f8d76;
  --lz-recharge-redeem-balance-amount: #246653;
  --lz-recharge-redeem-balance-unit: #5f9888;
  --lz-recharge-redeem-paste-surface: #eef2f7;
  --lz-recharge-redeem-paste-text: #0f172a;
  --lz-recharge-redeem-paste-border: rgba(15, 23, 42, 0.12);
  --lz-recharge-redeem-divider-label: #64748b;
  --lz-recharge-nav-gradient: linear-gradient(#5570df 0%, #7188e8 58%, #9aabea 100%);
  --lz-recharge-submit-gradient: linear-gradient(90deg, #6675f5 0%, #8b5de8 100%);
  --lz-recharge-redeem-workspace: #f6f8fb;
  --lz-recharge-redeem-surface: #ffffff;
  --lz-recharge-redeem-control: #fafaff;
  --lz-recharge-redeem-text: #25263a;
  --lz-recharge-redeem-soft: #55586f;
  --lz-recharge-redeem-muted: #8b8ea4;
  --lz-recharge-redeem-line: #e7e7f1;
  --lz-recharge-redeem-line-strong: #d8d9e8;
  --lz-recharge-redeem-accent: #6675f5;
  --lz-recharge-redeem-accent-end: #8b5de8;
  --lz-recharge-redeem-accent-soft: rgba(105, 112, 242, 0.1);
  --lz-recharge-redeem-tip: #f4f2ff;
  --lz-recharge-redeem-tip-line: #e6e0ff;
  --lz-recharge-redeem-base-font-size: 16px;
  --lz-recharge-redeem-base-line-height: normal;
  --lz-recharge-radius-modal: 18px;
  --lz-recharge-radius-card: 10px;
  --lz-recharge-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
  --lz-front-quick-trigger-layer: 100200;
  --lz-recharge-layer: 100240;
  --lz-safe-top: env(safe-area-inset-top, 0px);
  --lz-safe-right: env(safe-area-inset-right, 0px);
  --lz-safe-bottom: env(safe-area-inset-bottom, 0px);
  --lz-safe-left: env(safe-area-inset-left, 0px);
}

html.jn-light-mode,
html[data-theme="light"],
body.jn-light-mode:not(.page-admin),
body[data-theme="light"]:not(.page-admin) {
  --lz-notice-text: #334155;
  --lz-notice-header-icon-color: #0369a1;
  --lz-notice-title: #0f172a;
  --lz-notice-muted: #64748b;
  --lz-notice-surface: #ffffff;
  --lz-notice-surface-soft: #f8fafc;
  --lz-notice-surface-raised: #f1f5f9;
  --lz-notice-pin-surface: linear-gradient(135deg, #fef3c7 0%, #fbbf24 100%);
  --lz-notice-pin-text: #78350f;
  --lz-notice-pin-border: rgba(217, 119, 6, 0.58);
  --lz-notice-pin-shadow: 0 4px 12px rgba(180, 83, 9, 0.16);
  --lz-notice-border: rgba(15, 23, 42, 0.14);
  --lz-notice-border-soft: rgba(15, 23, 42, 0.09);
  --lz-notice-link: #0369a1;
  --lz-notice-code-text: #075985;
  --lz-notice-code-surface: #e0f2fe;
  --lz-notice-code-border: rgba(3, 105, 161, 0.16);
  --lz-notice-media-surface: #f8fafc;
  --lz-notice-card-shadow: 0 18px 44px rgba(15, 23, 42, 0.08), inset 0 1px 0 #ffffff;
  --lz-notice-card-active-shadow: 0 22px 48px rgba(15, 23, 42, 0.11), 0 0 0 1px color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 80%);
  --lz-notice-block-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
  --lz-front-password-overlay: rgba(15, 23, 42, 0.42);
  --lz-media-player-overlay: rgba(15, 23, 42, 0.42);
  --lz-front-workspace-bg: #f7f8fb;
  --lz-front-video-stage-bg: #f4f6fa;
  --lz-front-loader-surface: rgba(244, 247, 251, 0.84);
  --lz-front-loader-text: #64748b;
  --lz-front-loader-spinner-track: rgba(100, 116, 139, 0.24);
  --lz-front-loader-spinner-accent: var(--lz-color-primary);
  --lz-front-composer-panel: rgba(246, 248, 252, 0.76);
  --lz-front-composer-border: rgba(15, 23, 42, 0.12);
  --lz-front-composer-control: rgba(255, 255, 255, 0.34);
  --lz-front-composer-control-border: rgba(15, 23, 42, 0.12);
  --lz-front-composer-text: #0f172a;
  --lz-front-composer-muted: #64748b;
  --lz-ai-agent-avatar-bg: #64748b;
  --lz-ai-agent-role-hover-shadow: 0 2px 8px rgba(15, 23, 42, 0.10), 0 0 9px color-mix(in srgb, var(--lz-front-billing-text) 16%, transparent);
  --lz-ai-agent-role-selected-shadow: 0 0 0 2px color-mix(in srgb, var(--lz-color-accent) 20%, transparent), 0 2px 8px rgba(15, 23, 42, 0.10);
  --lz-front-guide-panel: #ffffff;
  --lz-front-guide-gradient: none;
  --lz-front-guide-border: rgba(15, 23, 42, 0.1);
  --lz-front-guide-text: #475569;
  --lz-front-guide-shadow: 0 12px 28px rgba(15, 23, 42, 0.07);
  --lz-front-param-panel: #ffffff;
  --lz-front-param-panel-border: rgba(15, 23, 42, 0.12);
  --lz-front-param-panel-hover: #eef6ff;
  --lz-front-param-shadow: 0 18px 48px rgba(15, 23, 42, 0.16);
  --lz-front-floating-control: rgba(255, 255, 255, 0.9);
  --lz-front-floating-control-hover: #ffffff;
  --lz-front-billing-surface: #ffffff;
  --lz-front-billing-text: #92400e;
  --lz-front-billing-border: rgba(15, 23, 42, 0.12);
  --lz-role-overlay-bg: rgba(80, 90, 100, 0.35);
  --lz-role-panel-bg: #ffffff;
  --lz-role-panel-text: #000000;
  --lz-role-panel-border: rgba(0, 0, 0, 0.08);
  --lz-role-panel-shadow: 0 25px 60px rgba(0, 0, 0, 0.15), 0 8px 20px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
  --lz-role-close-bg: rgba(0, 0, 0, 0.04);
  --lz-role-close-bg-hover: rgba(0, 0, 0, 0.08);
  --lz-role-close-color: rgba(0, 0, 0, 0.4);
  --lz-role-muted: #8c96a3;
  --lz-role-secondary: #4a5568;
  --lz-role-tabs-border: rgba(0, 0, 0, 0.07);
  --lz-role-tab-color: #8c96a3;
  --lz-role-tab-active: #5a6577;
  --lz-role-card-bg: #f7f8fa;
  --lz-role-card-border: rgba(0, 0, 0, 0.06);
  --lz-role-item-bg: #ffffff;
  --lz-role-item-hover-bg: rgba(248, 250, 252, 0.86);
  --lz-role-item-border: rgba(0, 0, 0, 0.07);
  --lz-role-item-hover-border: rgba(100, 116, 139, 0.12);
  --lz-role-avatar-border: rgba(0, 0, 0, 0.06);
  --lz-role-actions-bg: rgba(255, 255, 255, 0.88);
  --lz-role-actions-border: rgba(0, 0, 0, 0.1);
  --lz-role-action-bg: rgba(15, 23, 42, 0.04);
  --lz-role-action-border: rgba(15, 23, 42, 0.08);
  --lz-role-action-color: rgba(15, 23, 42, 0.62);
  --lz-role-model-border: rgba(0, 0, 0, 0.08);
  --lz-role-model-selector-border: rgba(0, 0, 0, 0.1);
  --lz-role-model-selector-text: #3f4a5a;
  --lz-role-field-bg: #f2f3f5;
  --lz-role-field-border: rgba(0, 0, 0, 0.08);
  --lz-role-field-color: #1a1d21;
  --lz-role-button-muted-bg: #ffffff;
  --lz-role-button-muted-border: rgba(0, 0, 0, 0.1);
}
body.jn-light-mode:not(.page-admin),
body[data-theme="light"]:not(.page-admin) {
  --lz-notice-text: #334155;
  --lz-notice-header-icon-color: #0369a1;
  --lz-notice-title: #0f172a;
  --lz-notice-muted: #64748b;
  --lz-notice-surface: #ffffff;
  --lz-notice-surface-soft: #f8fafc;
  --lz-notice-surface-raised: #f1f5f9;
  --lz-notice-pin-surface: linear-gradient(135deg, #fef3c7 0%, #fbbf24 100%);
  --lz-notice-pin-text: #78350f;
  --lz-notice-pin-border: rgba(217, 119, 6, 0.58);
  --lz-notice-pin-shadow: 0 4px 12px rgba(180, 83, 9, 0.16);
  --lz-notice-border: rgba(15, 23, 42, 0.14);
  --lz-notice-border-soft: rgba(15, 23, 42, 0.09);
  --lz-notice-link: #0369a1;
  --lz-notice-code-text: #075985;
  --lz-notice-code-surface: #e0f2fe;
  --lz-notice-code-border: rgba(3, 105, 161, 0.16);
  --lz-notice-media-surface: #f8fafc;
  --lz-notice-card-shadow: 0 18px 44px rgba(15, 23, 42, 0.08), inset 0 1px 0 #ffffff;
  --lz-notice-card-active-shadow: 0 22px 48px rgba(15, 23, 42, 0.11), 0 0 0 1px color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 80%);
  --lz-notice-block-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

:root {
  --lz-workspace-model-picker-layer: 100230;
  --lz-workspace-model-picker-compact-width: 320px;
  --lz-workspace-model-picker-compact-height: 420px;
  --lz-workspace-model-picker-compact-screen-gap: 24px;
  --lz-workspace-model-picker-compact-header-padding: 15px 16px 12px;
  --lz-workspace-model-picker-compact-search-margin: 12px 16px 9px;
  --lz-workspace-model-picker-compact-list-height: 288px;
  --lz-workspace-model-picker-compact-list-padding: 0 12px 14px 16px;
  --lz-workspace-model-picker-compact-icon-size: 36px;
  --lz-workspace-model-picker-compact-action-width: 54px;
  --lz-workspace-model-picker-compact-gap: 8px;
  --lz-workspace-model-picker-compact-item-padding: 8px;
  --lz-workspace-model-picker-popover-gap: 6px;
  --lz-workspace-model-picker-popover-viewport-inset: 12px;
  --lz-workspace-model-picker-popover-list-padding: 8px;
  --lz-workspace-model-picker-popover-item-min-height: 72px;
  --lz-workspace-model-picker-popover-item-padding: 10px 42px 10px 10px;
  --lz-workspace-model-picker-popover-item-radius: 8px;
  --lz-workspace-model-picker-popover-copy-gap: 2px;
  --lz-workspace-model-picker-popover-title-size: 15px;
  --lz-workspace-model-picker-popover-description-size: 11px;
  --lz-workspace-model-picker-popover-model-title-size: 13px;
  --lz-workspace-model-picker-popover-model-description-size: 11px;
  --lz-workspace-model-picker-popover-status-size: 10px;
  --lz-workspace-model-picker-popover-check-size: 16px;
  --lz-workspace-model-picker-popover-description-line: 16px;
  --lz-workspace-model-picker-popover-status-inset: 8px;
  --lz-workspace-model-picker-popover-status-padding: 1px 5px;
  --lz-workspace-model-picker-popover-status-radius: 3px;
  --lz-workspace-model-picker-popover-check-inset: 13px;
  --lz-workspace-model-picker-popover-selected-bg: color-mix(in srgb, var(--lz-front-accent) 9%, var(--lz-front-surface-2));
  --lz-workspace-model-picker-popover-selected-border: color-mix(in srgb, var(--lz-front-accent) 30%, transparent);
  --lz-role-model-picker-height: 30px;
  --lz-role-model-picker-padding: 0 11px;
  --lz-role-model-picker-min-width: 106px;
  --lz-role-model-picker-max-width: 160px;
  --lz-role-model-picker-gap: 6px;
}
html[data-theme="dark"],
html:not(.jn-light-mode):not([data-theme="light"]),
body[data-theme="dark"]:not(.page-admin) {
  --lz-role-overlay-bg: rgba(0, 0, 0, 0.46);
  --lz-role-panel-bg: #17191d;
  --lz-role-panel-text: #f4f6f8;
  --lz-role-panel-border: rgba(255, 255, 255, 0.1);
  --lz-role-panel-shadow: 0 25px 60px rgba(0, 0, 0, 0.48), 0 8px 20px rgba(0, 0, 0, 0.32), 0 0 0 1px rgba(255, 255, 255, 0.03);
  --lz-role-close-bg: rgba(255, 255, 255, 0.06);
  --lz-role-close-bg-hover: rgba(255, 255, 255, 0.11);
  --lz-role-close-color: rgba(255, 255, 255, 0.62);
  --lz-role-muted: #9099a6;
  --lz-role-secondary: #d6dbe2;
  --lz-role-tabs-border: rgba(255, 255, 255, 0.08);
  --lz-role-tab-color: #8f98a5;
  --lz-role-tab-active: #eef2f6;
  --lz-role-card-bg: #202329;
  --lz-role-card-border: rgba(255, 255, 255, 0.08);
  --lz-role-item-bg: #191c21;
  --lz-role-item-hover-bg: #242830;
  --lz-role-item-border: rgba(255, 255, 255, 0.08);
  --lz-role-item-hover-border: rgba(255, 255, 255, 0.15);
  --lz-role-item-selected-bg: color-mix(in srgb, var(--lz-role-accent) 10%, #191c21);
  --lz-role-item-selected-border: var(--lz-role-accent-border);
  --lz-role-item-selected-shadow: 0 0 0 2px color-mix(in srgb, var(--lz-role-accent) 18%, transparent);
  --lz-role-item-shadow: 0 1px 3px rgba(0, 0, 0, 0.24);
  --lz-role-avatar-border: rgba(255, 255, 255, 0.09);
  --lz-role-avatar-upload-bg: #202329;
  --lz-role-avatar-upload-border: rgba(255, 255, 255, 0.16);
  --lz-role-actions-bg: rgba(28, 31, 37, 0.94);
  --lz-role-actions-border: rgba(255, 255, 255, 0.1);
  --lz-role-action-bg: rgba(255, 255, 255, 0.05);
  --lz-role-action-border: rgba(255, 255, 255, 0.08);
  --lz-role-action-color: rgba(255, 255, 255, 0.68);
  --lz-role-model-border: rgba(255, 255, 255, 0.08);
  --lz-role-model-selector-border: rgba(255, 255, 255, 0.1);
  --lz-role-model-selector-text: #e8ebef;
  --lz-role-field-bg: #17191d;
  --lz-role-field-border: rgba(255, 255, 255, 0.11);
  --lz-role-field-color: #f3f5f7;
  --lz-role-button-muted-bg: #202329;
  --lz-role-button-muted-border: rgba(255, 255, 255, 0.1);
}


:root {
  --lz-ai-agent-action-layer: 100250;
  --lz-ai-agent-action-overlay: rgba(8, 10, 14, 0.58);
  --lz-ai-agent-action-width: 45rem;
  --lz-ai-agent-action-viewport-width: 90vw;
  --lz-ai-agent-action-max-height: 82vh;
  --lz-ai-agent-action-radius: 1rem;
  --lz-ai-agent-action-bg: var(--lz-role-panel-bg);
  --lz-ai-agent-action-border: var(--lz-role-panel-border);
  --lz-ai-agent-action-text: var(--lz-role-panel-text);
  --lz-ai-agent-action-muted: var(--lz-role-muted);
  --lz-ai-agent-action-shadow: var(--lz-role-panel-shadow);
  --lz-ai-agent-action-padding: 1.25rem;
  --lz-ai-agent-action-gap: 0.75rem;
  --lz-ai-agent-action-close-size: 2rem;
  --lz-ai-agent-action-close-inset: 0.875rem;
  --lz-ai-agent-action-content-layer: 1;
  --lz-ai-agent-action-close-layer: 2;
  --lz-ai-agent-action-mobile-gutter: var(--lz-space-3);
  --lz-ai-agent-action-mobile-max-height: calc(100dvh - max(var(--lz-ai-agent-action-mobile-gutter), var(--lz-safe-top)) - max(var(--lz-ai-agent-action-mobile-gutter), var(--lz-safe-bottom)));
  --lz-ai-agent-action-close-bg: var(--lz-role-close-bg);
  --lz-ai-agent-action-close-hover: var(--lz-role-close-bg-hover);
  --lz-ai-agent-action-avatar-size: 3.25rem;
  --lz-ai-agent-action-header-avatar-size: 2rem;
  --lz-ai-agent-action-avatar-border: 0.125rem;
  --lz-ai-agent-action-active-size: 0.625rem;
  --lz-ai-agent-action-active-ring: 0.125rem;
  --lz-ai-agent-action-title-size: 1rem;
  --lz-ai-agent-action-copy-size: 0.75rem;
  --lz-ai-agent-action-body-size: 0.875rem;
  --lz-ai-agent-action-small-size: 0.75rem;
  --lz-ai-agent-action-card-radius: 0.75rem;
  --lz-ai-agent-action-card-padding: 0.875rem;
  --lz-ai-agent-action-card-bg: var(--lz-role-card-bg);
  --lz-ai-agent-action-card-border: var(--lz-role-card-border);
  --lz-ai-agent-action-card-hover-border: var(--lz-role-accent-border);
  --lz-ai-agent-action-header-gap: var(--lz-space-3);
  --lz-ai-agent-action-header-padding: var(--lz-space-4) calc(var(--lz-ai-agent-action-close-size) + var(--lz-space-6)) var(--lz-space-4) var(--lz-space-5);
  --lz-ai-agent-action-results-padding: var(--lz-space-5);
  --lz-ai-agent-action-section-gap: var(--lz-space-4);
  --lz-ai-agent-action-prompt-grid-columns: repeat(2, minmax(0, 1fr));
  --lz-ai-agent-action-result-max-height: 10rem;
  --lz-ai-agent-action-prompt-max-height: 12rem;
  --lz-ai-agent-action-prompt-card-min-height: 15rem;
  --lz-ai-agent-action-prompt-card-bg: var(--lz-ai-agent-action-bg);
  --lz-ai-agent-action-copy-height: 2rem;
  --lz-ai-agent-action-copy-min-width: 4rem;
  --lz-ai-agent-action-copy-padding: 0 var(--lz-space-3);
  --lz-ai-agent-action-copy-color: var(--lz-ai-agent-action-muted);
  --lz-ai-agent-action-copy-bg: var(--lz-role-button-muted-bg);
  --lz-ai-agent-action-copy-border: var(--lz-role-button-muted-border);
  --lz-ai-agent-action-copy-hover-bg: color-mix(in srgb, var(--lz-role-accent) 9%, var(--lz-role-button-muted-bg));
  --lz-ai-agent-action-icon-size: 1rem;
  --lz-ai-agent-action-icon-stroke: 1.75;
  --lz-ai-agent-action-use-color: var(--lz-color-surface);
  --lz-ai-agent-action-use-bg: var(--lz-role-accent);
  --lz-ai-agent-action-use-hover-bg: color-mix(in srgb, var(--lz-role-accent) 86%, var(--lz-ai-agent-action-text));
  --lz-ai-agent-action-use-shadow: 0 0.375rem 1rem color-mix(in srgb, var(--lz-role-accent) 28%, transparent);
  --lz-ai-agent-action-button-height: 2.25rem;
  --lz-ai-agent-action-button-padding: 0 1rem;
  --lz-ai-agent-action-button-radius: 0.5rem;
  --lz-ai-agent-action-footer-padding: var(--lz-space-4) var(--lz-space-5);
  --lz-ai-agent-action-footer-bg: var(--lz-ai-agent-action-bg);
  --lz-ai-agent-action-regenerate-color: var(--lz-ai-agent-action-muted);
  --lz-ai-agent-action-regenerate-bg: var(--lz-role-button-muted-bg);
  --lz-ai-agent-action-regenerate-border: var(--lz-role-button-muted-border);
  --lz-ai-agent-action-regenerate-hover-bg: color-mix(in srgb, var(--lz-role-accent) 8%, var(--lz-role-button-muted-bg));
  --lz-ai-agent-action-dot-size: 0.375rem;
  --lz-ai-agent-action-dot-gap: 0.375rem;
  --lz-ai-agent-action-dot-offset: -0.25rem;
  --lz-ai-agent-action-duration: 1.1s;
  --lz-ai-agent-tooltip-layer: 99999;
  --lz-ai-agent-tooltip-max-width: 16rem;
  --lz-ai-agent-tooltip-radius: 0.5rem;
  --lz-ai-agent-tooltip-padding: 0.375rem 0.75rem;
  --lz-ai-agent-tooltip-bg: #ffffff;
  --lz-ai-agent-tooltip-text: #111827;
  --lz-ai-agent-tooltip-muted: #6b7280;
  --lz-ai-agent-tooltip-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.2);
  --lz-ai-agent-tooltip-title-size: 0.75rem;
  --lz-ai-agent-tooltip-copy-size: 0.625rem;
  --lz-ai-agent-tooltip-copy-line: 0.875rem;
}

html[data-theme="dark"],
html:not(.jn-light-mode):not([data-theme="light"]),
body[data-theme="dark"]:not(.page-admin) {
  --lz-ai-agent-tooltip-bg: rgba(0, 0, 0, 0.85);
  --lz-ai-agent-tooltip-text: #ffffff;
  --lz-ai-agent-tooltip-muted: rgba(255, 255, 255, 0.72);
}


/* Installation design tokens */
:root {
  --lz-install-canvas: #f6f8fb;
  --lz-install-surface: #ffffff;
  --lz-install-surface-soft: #f9fbff;
  --lz-install-field: #ffffff;
  --lz-install-text: #111827;
  --lz-install-secondary: #111827;
  --lz-install-muted: #667085;
  --lz-install-border: #dce3ee;
  --lz-install-primary: #2563eb;
  --lz-install-primary-hover: #1d4ed8;
  --lz-install-primary-soft: rgba(37, 99, 235, 0.1);
  --lz-install-primary-border: rgba(37, 99, 235, 0.18);
  --lz-install-primary-text: #ffffff;
  --lz-install-success: #16a34a;
  --lz-install-success-soft: rgba(22, 163, 74, 0.1);
  --lz-install-success-border: rgba(22, 163, 74, 0.28);
  --lz-install-danger: #dc2626;
  --lz-install-danger-soft: rgba(220, 38, 38, 0.08);
  --lz-install-danger-border: rgba(220, 38, 38, 0.28);
  --lz-install-shadow: 0 22px 70px rgba(15, 23, 42, 0.1);
  --lz-install-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.12);
  --lz-install-shell-width: 1120px;
  --lz-install-shell-min-height: 760px;
  --lz-install-aside-width: 268px;
  --lz-install-shell-radius: 18px;
  --lz-install-control-radius: 8px;
  --lz-install-card-radius: 10px;
  --lz-install-logo-size: 42px;
  --lz-install-input-height: 42px;
  --lz-install-button-height: 40px;
  --lz-install-head-title-size: 24px;
  --lz-install-status-column: 28px;
  --lz-install-info-icon-size: 40px;
  --lz-install-installed-logo-size: 52px;
  --lz-install-success-size: 72px;
  --lz-install-success-font-size: 34px;
  --lz-install-font-weight-medium: 500;
  --lz-install-font-weight-black: 900;
  --lz-install-line-height-loose: 1.7;  --lz-install-disabled-opacity: 0.55;
  --lz-install-motion-duration: 180ms;
  --lz-install-motion-ease: ease;
}
/* The installer intentionally follows the legacy light visual contract. A system-level
   dark preference must not override the explicit installer palette. */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,
h1,
h2,
h3,
p,
ul,
ol {
  margin: 0;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  border: 0;
  background: none;
}

button,
a,
input,
select,
textarea {
  min-width: 0;
}

button,
[role="button"] {
  cursor: pointer;
}

img,
svg,
video {
  display: block;
  max-width: 100%;
}

[hidden] {
  display: none;
}

html {
  max-width: 100%;
  background: var(--lz-color-canvas);
  color: var(--lz-color-text);
  font-family: var(--lz-font-sans);
  line-height: var(--lz-line-height-normal);
  overflow-x: hidden;
}

body {
  min-width: 0;
  max-width: 100%;
  min-height: 100vh;
  background: var(--lz-color-canvas);
  font-size: var(--lz-font-size-md);
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--lz-color-primary);
  text-decoration: none;
  transition: color var(--duration-fast) var(--ease-out-expo);
}

code {
  border-radius: 4px;
  background: var(--main-surface-soft);
  padding: 0 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: clamp(11px, 1.3vw, 13px);
}

pre code {
  background: transparent;
  padding: 0;
}

input {
  width: 100%;
  border: 1.5px solid var(--line-strong, #cbd5e1);
  border-radius: var(--radius, 14px);
  outline: none;
  background: var(--main-surface, #ffffff);
  color: var(--text, #1e293b);
  transition: border-color var(--duration-fast) var(--ease-out-expo),
    box-shadow var(--duration-fast) var(--ease-out-expo);
  font-family: inherit;
}

input:where(:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=hidden]):not([type=file])),
select,
textarea {
  transition: border-color var(--duration-fast) var(--ease-out-expo),
    box-shadow var(--duration-fast) var(--ease-out-expo),
    background var(--duration-fast) var(--ease-out-expo);
}

html.jn-browser-compat,
html.jn-browser-compat body {
  min-height: var(--jn-compat-layout-height, 100vh);
}

input:where(:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"])) {
  height: clamp(36px, 4.5vw, 44px);
  padding: 0 clamp(10px, 1.2vw, 14px);
}

@media (max-width: 640px) {
  input:where(:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"])),
  input[type="text"],
  input[type="password"],
  input[type="email"],
  input[type="number"],
  select {
    font-size: 16px;
  }
}

:focus-visible {
  outline: 2px solid var(--lz-color-primary);
  outline-offset: 2px;
}

::selection {
  background: var(--lz-color-primary-soft);
}

.lz-button {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  gap: var(--lz-space-2);
  border: 1px solid transparent;
  border-radius: var(--lz-radius-md);
  padding: 0 var(--lz-space-4);
  background: var(--lz-color-primary);
  color: var(--lz-color-surface);
  font-weight: 600;
  transition: background var(--lz-duration-fast) var(--lz-ease-standard),
    box-shadow var(--lz-duration-fast) var(--lz-ease-standard);
}

.lz-button:hover {
  background: var(--lz-color-primary-hover);
}

.lz-button--secondary {
  border-color: var(--lz-color-border);
  background: var(--lz-color-surface);
  color: var(--lz-color-text);
}

.lz-field {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--lz-color-border);
  border-radius: var(--lz-radius-md);
  padding: var(--lz-space-2) var(--lz-space-3);
  background: var(--lz-color-surface);
}

.lz-card {
  border: 1px solid var(--lz-color-border);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-color-surface-raised);
  box-shadow: var(--lz-shadow-sm);
}

.lz-dialog-layer {
  position: fixed;
  z-index: var(--lz-z-dialog);
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--lz-space-4);
  background: var(--lz-color-overlay);
}

.lz-dialog {
  width: min(440px, 100%);
  border-radius: var(--lz-radius-lg);
  padding: var(--lz-space-6);
  background: var(--lz-color-surface);
  box-shadow: var(--lz-shadow-lg);
}

.lz-dialog__actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--lz-space-2);
  margin-top: var(--lz-space-5);
}

.lz-toast-region {
  position: fixed;
  z-index: var(--lz-z-toast);
  top: calc(var(--lz-space-4) + var(--lz-safe-top));
  right: calc(var(--lz-space-4) + var(--lz-safe-right));
  display: grid;
  width: min(360px, calc(100vw - var(--lz-space-8)));
  gap: var(--lz-space-2);
}

.lz-toast {
  border: 1px solid var(--lz-color-border);
  border-radius: var(--lz-radius-md);
  padding: var(--lz-space-3) var(--lz-space-4);
  background: var(--lz-color-surface-raised);
  box-shadow: var(--lz-shadow-md);
}

.lz-loading-layer {
  position: fixed;
  z-index: var(--lz-z-dialog);
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--lz-color-overlay);
}

.lz-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--lz-color-border);
  border-top-color: var(--lz-color-primary);
  border-radius: 50%;
  animation: lz-spin 700ms linear infinite;
}

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

@media (prefers-reduced-motion: reduce) {
  .lz-button {
    transition: none;
  }

  .lz-spinner {
    animation-duration: 1400ms;
  }
}

.lz-shell {
  min-height: 100vh;
  padding: var(--lz-safe-top) var(--lz-safe-right) var(--lz-safe-bottom) var(--lz-safe-left);
}

.lz-container {
  width: min(1200px, calc(100% - var(--lz-space-8)));
  margin-inline: auto;
}

.lz-stack {
  display: grid;
  gap: var(--lz-space-4);
}

.lz-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--lz-space-3);
}

@media (max-width: 767px) {
  .lz-container {
    width: min(100% - var(--lz-space-4), 1200px);
  }
}

.lz-health-page {
  display: grid;
  min-height: 100vh;
  place-items: center;
  padding: var(--lz-space-6);
}

.lz-health-card {
  width: min(480px, 100%);
  padding: var(--lz-space-8);
  text-align: center;
}

.public-page {
  min-height: 100vh;
  background: var(--lz-color-surface-soft);
}

.public-header {
  position: sticky;
  z-index: var(--lz-z-dropdown);
  top: 0;
  border-bottom: 1px solid var(--lz-color-border);
  background: var(--lz-color-surface-raised);
  backdrop-filter: blur(16px);
}

.public-header__inner,
.public-footer__inner {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-5);
}

.public-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--lz-space-3);
  color: var(--lz-color-text);
  font-size: var(--lz-font-size-xl);
  font-weight: 800;
}

.public-brand__mark {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: var(--lz-radius-lg);
  background: var(--lz-color-primary);
  color: var(--lz-color-surface);
}

.public-nav {
  display: flex;
  align-items: center;
  gap: var(--lz-space-2);
}

.public-nav__link {
  border-radius: var(--lz-radius-pill);
  padding: var(--lz-space-2) var(--lz-space-3);
  color: var(--lz-color-text-secondary);
  font-weight: 600;
}

.public-nav__link[aria-current="page"],
.public-nav__link:hover {
  background: var(--lz-color-primary-soft);
  color: var(--lz-color-primary);
}

.public-hero {
  padding: 88px 0 72px;
  background: var(--lz-gradient-hero);
}

.public-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
  align-items: center;
  gap: 56px;
}

.public-eyebrow {
  display: inline-flex;
  border-radius: var(--lz-radius-pill);
  padding: var(--lz-space-2) var(--lz-space-3);
  background: var(--lz-color-accent-soft);
  color: var(--lz-color-accent);
  font-weight: 700;
}

.public-hero h1 {
  max-width: 760px;
  margin-top: var(--lz-space-5);
  font-size: clamp(40px, 6vw, 72px);
  line-height: 1.08;
  letter-spacing: -0.04em;
}

.public-hero__lead {
  max-width: 680px;
  margin-top: var(--lz-space-5);
  color: var(--lz-color-text-secondary);
  font-size: var(--lz-font-size-xl);
}

.public-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lz-space-3);
  margin-top: var(--lz-space-8);
}

.public-hero__panel {
  padding: var(--lz-space-6);
  background: var(--lz-color-surface-raised);
  box-shadow: var(--lz-shadow-lg);
}

.public-hero__panel-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--lz-space-3);
  margin-top: var(--lz-space-5);
}

.public-stat {
  border-radius: var(--lz-radius-md);
  padding: var(--lz-space-4);
  background: var(--lz-color-surface-soft);
}

.public-stat strong {
  display: block;
  font-size: 24px;
}

.public-stat span,
.public-section__lead,
.public-feature p,
.public-notice p,
.public-footer {
  color: var(--lz-color-text-muted);
}

.public-section {
  padding: 72px 0;
}

.public-section--surface {
  background: var(--lz-color-surface);
}

.public-section__heading {
  max-width: 720px;
  margin-bottom: var(--lz-space-8);
}

.public-section__heading h2 {
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.2;
}

.public-section__lead {
  margin-top: var(--lz-space-3);
  font-size: var(--lz-font-size-lg);
}

.public-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--lz-space-5);
}

.public-feature {
  padding: var(--lz-space-6);
}

.public-feature__icon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: var(--lz-radius-lg);
  margin-bottom: var(--lz-space-5);
  background: var(--lz-color-primary-soft);
  color: var(--lz-color-primary);
  font-size: 22px;
  font-weight: 800;
}

.public-feature p,
.public-notice p {
  margin-top: var(--lz-space-2);
}

.public-notice__content {
  margin-top: var(--lz-space-2);
  color: var(--lz-color-text-muted);
}

.public-notice__content > :first-child {
  margin-top: 0;
}

.public-notice__content > :last-child {
  margin-bottom: 0;
}

.public-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-5);
  padding: var(--lz-space-6);
}

.public-footer {
  border-top: 1px solid var(--lz-color-border);
  background: var(--lz-color-surface);
}

.public-footer__records {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--lz-space-3);
}

.public-login {
  display: grid;
  min-height: calc(100vh - 137px);
  place-items: center;
  padding: 64px var(--lz-space-4);
  background: var(--lz-gradient-hero);
}

.public-login__card {
  width: min(460px, 100%);
  padding: var(--lz-space-8);
  box-shadow: var(--lz-shadow-lg);
}

.public-login__card h1 {
  font-size: 32px;
}

.public-login__intro,
.public-login__status {
  margin-top: var(--lz-space-2);
  color: var(--lz-color-text-muted);
}

.public-form {
  display: grid;
  gap: var(--lz-space-4);
  margin-top: var(--lz-space-6);
}

.public-form__field {
  display: grid;
  gap: var(--lz-space-2);
  font-weight: 600;
}

.public-form__captcha {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--lz-space-2);
}

.public-captcha-code {
  display: grid;
  min-width: 104px;
  min-height: 42px;
  padding: 0;
  overflow: hidden;
  place-items: center;
  border: 1px solid var(--lz-color-border);
  border-radius: var(--lz-radius-md);
  background: var(--lz-color-surface-soft);
  color: var(--lz-color-accent);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.18em;
}

.public-captcha-code img {
  display: block;
  width: 104px;
  height: 42px;
  object-fit: cover;
}

.public-form__error {
  color: var(--lz-color-danger);
}

.public-support {
  position: fixed;
  right: calc(var(--lz-space-5) + var(--lz-safe-right));
  bottom: calc(var(--lz-space-5) + var(--lz-safe-bottom));
  z-index: var(--lz-z-dropdown);
}

.public-support__panel {
  position: fixed;
  right: calc(var(--lz-space-5) + var(--lz-safe-right));
  bottom: calc(72px + var(--lz-safe-bottom));
  z-index: var(--lz-z-dropdown);
  width: min(360px, calc(100vw - var(--lz-space-8)));
  padding: var(--lz-space-5);
  box-shadow: var(--lz-shadow-lg);
}

.public-support__panel img {
  width: 132px;
  margin: var(--lz-space-4) auto;
  border-radius: var(--lz-radius-md);
}

@media (max-width: 820px) {
  .public-header__inner,
  .public-footer__inner,
  .public-notice {
    align-items: flex-start;
    flex-direction: column;
  }

  .public-header__inner {
    padding-block: var(--lz-space-3);
  }

  .public-nav {
    width: 100%;
    overflow-x: auto;
  }

  .public-hero {
    padding: 56px 0;
  }

  .public-hero__grid,
  .public-feature-grid {
    grid-template-columns: 1fr;
  }

  .public-footer__records {
    justify-content: flex-start;
  }
}

@media (max-width: 480px) {
  .public-hero h1 {
    font-size: 40px;
  }

  .public-hero__actions .lz-button,
  .public-login__card .lz-button {
    width: 100%;
  }

  .public-login__card {
    padding: var(--lz-space-6);
  }
}

.public-home-page {
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--lz-home-gradient);
  color: var(--lz-home-text);
}

.home-header {
  position: absolute;
  z-index: var(--lz-z-dropdown);
  top: 0;
  right: 0;
  left: 0;
}

.home-header__inner,
.home-footer__inner {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-5);
}

.home-brand,
.home-footer__brand {
  display: inline-flex;
  align-items: center;
  gap: var(--lz-space-3);
  color: var(--lz-home-text);
  font-size: var(--lz-font-size-xl);
  font-weight: 800;
}

.home-brand img,
.home-footer__brand img {
  width: 34px;
  height: 34px;
  border-radius: var(--lz-radius-md);
  object-fit: cover;
}

.home-header__actions {
  display: flex;
  align-items: center;
  gap: var(--lz-space-2);
}

.home-icon-button,
.home-header__start,
.home-language {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-pill);
  padding: 0 var(--lz-space-4);
  background: var(--lz-home-surface-soft);
  color: var(--lz-home-text);
  font-weight: 650;
}

.home-icon-button {
  width: 38px;
  padding: 0;
}

.home-hero {
  position: relative;
  display: grid;
  min-height: 900px;
  overflow: hidden;
  place-items: center;
  isolation: isolate;
}

.home-hero::before,
.home-hero::after {
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  content: "";
  filter: blur(1px);
}

.home-hero::before {
  width: 520px;
  height: 520px;
  background: radial-gradient(circle, var(--lz-home-glow), transparent 68%);
}

.home-hero::after {
  width: 760px;
  height: 760px;
  border: 1px solid var(--lz-home-border);
  opacity: 0.24;
}

.home-hero__content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  padding-top: 82px;
  text-align: center;
}

.home-eyebrow,
.home-section__heading > span {
  display: inline-flex;
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-pill);
  padding: var(--lz-space-2) var(--lz-space-4);
  background: var(--lz-home-surface-soft);
  color: var(--lz-home-cyan);
  font-weight: 700;
  letter-spacing: 0.04em;
}

.home-hero h1 {
  margin-top: var(--lz-space-8);
  font-size: clamp(54px, 7vw, 94px);
  line-height: 1.05;
  letter-spacing: -0.055em;
}

.home-hero h1 span {
  color: var(--lz-home-text);
}

.home-hero__content > p {
  max-width: 660px;
  margin: var(--lz-space-8) auto 0;
  color: var(--lz-home-text-secondary);
  font-size: var(--lz-font-size-xl);
  line-height: 1.9;
}

.home-hero__actions {
  display: flex;
  justify-content: center;
  gap: var(--lz-space-3);
  margin-top: var(--lz-space-8);
}

.home-button {
  display: inline-flex;
  min-width: 136px;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: var(--lz-radius-pill);
  padding: 0 var(--lz-space-6);
  font-weight: 750;
}

.home-button--primary {
  background: var(--lz-home-accent);
  color: var(--lz-home-canvas);
}

.home-button--primary:hover {
  background: var(--lz-home-accent-hover);
}

.home-button--secondary {
  border-color: var(--lz-home-border);
  background: var(--lz-home-surface-soft);
  color: var(--lz-home-text);
}

.home-stats {
  display: grid;
  max-width: 400px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--lz-space-3);
  margin: 60px auto 0;
}

.home-stats div {
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-lg);
  padding: var(--lz-space-3);
  background: var(--lz-home-surface-soft);
}

.home-stats strong,
.home-stats span {
  display: block;
}

.home-stats strong {
  color: var(--lz-home-blue);
  font-size: 24px;
}

.home-stats span {
  color: var(--lz-home-text-secondary);
  font-size: var(--lz-font-size-sm);
}

.home-model-cloud {
  position: absolute;
  inset: 0;
  overflow: hidden;
  opacity: 0.58;
}

.home-model-tag {
  position: absolute;
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-md);
  padding: var(--lz-space-2) var(--lz-space-3);
  background: var(--lz-home-surface-raised);
  color: var(--lz-home-text-muted);
  box-shadow: var(--lz-home-shadow);
  animation: home-float 7s ease-in-out infinite;
}

.home-model-tag--1 { top: 15%; left: 7%; }
.home-model-tag--2 { top: 30%; left: 17%; animation-delay: -2s; }
.home-model-tag--3 { top: 58%; left: 8%; animation-delay: -4s; }
.home-model-tag--4 { top: 74%; left: 22%; animation-delay: -1s; }
.home-model-tag--5 { top: 11%; right: 13%; animation-delay: -5s; }
.home-model-tag--6 { top: 28%; right: 6%; animation-delay: -3s; }
.home-model-tag--7 { top: 54%; right: 14%; animation-delay: -6s; }
.home-model-tag--8 { top: 72%; right: 5%; animation-delay: -2s; }
.home-model-tag--9 { top: 6%; left: 39%; animation-delay: -3s; }
.home-model-tag--10 { bottom: 8%; left: 42%; animation-delay: -5s; }
.home-model-tag--11 { top: 43%; left: 3%; animation-delay: -1s; }
.home-model-tag--12 { top: 43%; right: 3%; animation-delay: -4s; }

@keyframes home-float {
  50% { transform: translateY(-12px); }
}

.home-notice {
  max-width: 620px;
  margin: var(--lz-space-6) auto 0;
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-lg);
  padding: var(--lz-space-4);
  background: var(--lz-home-surface-raised);
  color: var(--lz-home-text-secondary);
  text-align: left;
}

.home-section {
  padding: 104px 0;
}

.home-section--capabilities {
  background: var(--lz-home-surface-soft);
}

.home-section__heading {
  max-width: 690px;
  margin-bottom: 48px;
}

.home-section__heading h2 {
  margin-top: var(--lz-space-4);
  font-size: clamp(34px, 5vw, 52px);
  line-height: 1.16;
}

.home-section__heading p {
  margin-top: var(--lz-space-3);
  color: var(--lz-home-text-secondary);
  font-size: var(--lz-font-size-lg);
}

.home-workflow-grid,
.home-capability-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--lz-space-4);
}

.home-workflow-grid article,
.home-capability-grid article {
  min-height: 280px;
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-lg);
  padding: var(--lz-space-6);
  background: var(--lz-home-card-gradient);
  box-shadow: var(--lz-home-shadow);
}

.home-workflow-grid b,
.home-capability-grid span {
  color: var(--lz-home-cyan);
  font-size: var(--lz-font-size-sm);
  letter-spacing: 0.08em;
}

.home-workflow-grid h3,
.home-capability-grid h3 {
  margin-top: var(--lz-space-6);
  font-size: 22px;
}

.home-workflow-grid p,
.home-capability-grid p {
  margin-top: var(--lz-space-3);
  color: var(--lz-home-text-secondary);
}

.home-workflow-grid a {
  display: inline-flex;
  margin-top: var(--lz-space-6);
  color: var(--lz-home-accent);
  font-weight: 700;
}

.home-gallery-status {
  color: var(--lz-home-text-secondary);
}

.home-gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--lz-space-4);
  margin-top: var(--lz-space-5);
}

.home-gallery-card {
  overflow: hidden;
  border: 1px solid var(--lz-home-border);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-home-card-gradient);
}

.home-gallery-card__media {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--lz-home-surface);
}

.home-gallery-card__media img,
.home-gallery-card__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--lz-duration-normal) var(--lz-ease-standard);
}

.home-gallery-card:hover .home-gallery-card__media img,
.home-gallery-card:hover .home-gallery-card__media video {
  transform: scale(1.035);
}

.home-gallery-card__body {
  padding: var(--lz-space-4);
}

.home-gallery-card__body h3 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-gallery-card__meta {
  display: flex;
  justify-content: space-between;
  gap: var(--lz-space-2);
  margin-top: var(--lz-space-3);
  color: var(--lz-home-text-muted);
  font-size: var(--lz-font-size-sm);
}

.home-gallery-more {
  margin: 40px auto 0;
}

.home-footer {
  border-top: 1px solid var(--lz-home-border);
  color: var(--lz-home-text-secondary);
}

.home-footer__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--lz-space-4);
}

.home-support-panel {
  position: fixed;
  z-index: var(--lz-z-dialog);
  right: var(--lz-space-6);
  bottom: var(--lz-space-6);
  width: min(340px, calc(100vw - 32px));
  border: 1px solid var(--lz-home-border-strong);
  border-radius: var(--lz-radius-lg);
  padding: var(--lz-space-6);
  background: var(--lz-home-surface-raised);
  box-shadow: var(--lz-home-shadow);
}

.home-support-panel > button {
  position: absolute;
  top: var(--lz-space-3);
  right: var(--lz-space-3);
  color: var(--lz-home-text-secondary);
}

.home-support-panel p,
.home-support-panel img {
  margin-top: var(--lz-space-4);
}

.home-support-panel img {
  width: 180px;
  max-width: 100%;
}

.home-support-panel .home-button {
  margin-top: var(--lz-space-5);
}

@media (prefers-reduced-motion: reduce) {
  .home-model-tag { animation: none; }
}

@media (max-width: 980px) {
  .home-workflow-grid,
  .home-capability-grid,
  .home-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-model-cloud { opacity: 0.34; }
}

@media (max-width: 640px) {
  .home-main { display: flex; flex-direction: column; }
  .home-header__inner { min-height: 56px; }
  .home-brand span,
  .home-language { display: none; }
  .home-header__start { min-height: 34px; padding: 0 var(--lz-space-3); }
  .home-hero { min-height: 610px; order: 0; }
  .home-hero__content { padding-top: 52px; }
  .home-hero h1 { margin-top: var(--lz-space-5); font-size: clamp(46px, 14vw, 58px); }
  .home-hero__content > p { display: none; }
  .home-hero__actions { margin-top: var(--lz-space-6); }
  .home-stats { margin-top: var(--lz-space-6); }
  .home-model-tag { font-size: var(--lz-font-size-xs); }
  .home-model-tag--2,
  .home-model-tag--4,
  .home-model-tag--6,
  .home-model-tag--8,
  .home-model-tag--10,
  .home-model-tag--12 { display: none; }
  .home-section { padding: 72px 0; }
  .home-section--inspiration { order: 1; }
  .home-section--workflow { order: 2; }
  .home-section--capabilities { order: 3; }
  .home-workflow-grid,
  .home-capability-grid,
  .home-gallery-grid { grid-template-columns: 1fr; }
  .home-workflow-grid article,
  .home-capability-grid article { min-height: 0; }
  .home-footer__inner { align-items: flex-start; flex-direction: column; padding: var(--lz-space-5) 0; }
  .home-footer__meta { justify-content: flex-start; }
}

.workspace-page{min-height:100vh;margin:0;background:#17181c;color:#f7f8fb;overflow-x:hidden}.workspace-page,.workspace-page button{font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif}.workspace-sidebar{position:fixed;inset:0 auto 0 0;z-index:40;width:248px;display:flex;flex-direction:column;padding:14px;background:#1b1c20;border-right:1px solid rgba(255,255,255,.09);transition:width .2s ease,transform .2s ease}.workspace-sidebar__head{display:flex;align-items:center;gap:8px;min-height:58px}.workspace-brand{min-width:0;display:flex;align-items:center;gap:11px;flex:1;color:inherit;text-decoration:none;overflow:hidden}.workspace-brand__logo{width:40px;height:40px;display:grid;place-items:center;flex:0 0 40px;border:1px solid rgba(255,255,255,.11);border-radius:13px;background:linear-gradient(145deg,#303540,#202228)}.workspace-brand__logo img{width:30px;height:30px;object-fit:contain}.workspace-brand__copy{min-width:0;display:grid;gap:2px;white-space:nowrap}.workspace-brand__copy strong{font-size:16px}.workspace-brand__copy small{color:#9098a6;font-size:11px}.workspace-sidebar__toggle{width:32px;height:32px;border:0;border-radius:10px;background:#252830;color:#dfe4ec;font-size:25px;cursor:pointer}.workspace-nav{display:grid;gap:6px;margin-top:18px}.workspace-nav__item{min-height:46px;display:flex;align-items:center;gap:12px;padding:0 13px;border:1px solid transparent;border-radius:13px;color:#c8ced8;text-decoration:none;transition:background .16s ease,color .16s ease}.workspace-nav__item:hover{background:#252830;color:#fff}.workspace-nav__item.is-active{border-color:rgba(255,255,255,.07);background:#2b2e35;color:#fff;box-shadow:inset 3px 0 #f1b832}.workspace-nav__icon{width:24px;display:grid;place-items:center;font-size:17px}.workspace-nav__label{white-space:nowrap}.workspace-account{margin-top:auto;display:grid;gap:10px}.workspace-profile{width:100%;display:flex;align-items:center;gap:10px;padding:8px;border:0;border-radius:14px;background:#24262c;color:#fff;text-align:left;cursor:pointer}.workspace-avatar{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:12px;background:linear-gradient(145deg,#edb72e,#d7891d);color:#191919;font-weight:900;overflow:hidden}.workspace-avatar img{width:100%;height:100%;object-fit:cover}.workspace-profile__copy{min-width:0;display:grid;gap:2px;flex:1}.workspace-profile__copy strong,.workspace-profile__copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workspace-profile__copy strong{font-size:13px}.workspace-profile__copy small{color:#929aa7;font-size:11px}.workspace-profile__arrow{color:#929aa7}.workspace-balance{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 11px 24px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:#202228}.workspace-balance span{display:grid;gap:3px}.workspace-balance small{color:#8f97a4;font-size:10px}.workspace-balance strong{font-size:14px}.workspace-balance em{position:absolute;right:10px;bottom:7px;color:#7e8795;font-size:10px;font-style:normal}.workspace-recharge{height:42px;border:1px solid rgba(247,196,60,.28);border-radius:13px;background:linear-gradient(135deg,#f3c33e,#db9622);color:#211b0f;font-weight:900;cursor:pointer}.workspace-stage{min-height:100vh;margin-left:248px;background:radial-gradient(circle at 72% 18%,rgba(50,57,72,.28),transparent 31%),#17181c;transition:margin-left .2s ease}.workspace-main{min-height:100vh;display:grid;place-items:center;padding:42px}.workspace-module{width:min(920px,100%);display:grid;gap:28px}.workspace-module__heading span{color:#efb936;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.workspace-module__heading h1{margin:12px 0 10px;font-size:clamp(34px,5vw,68px);line-height:1.05}.workspace-module__heading p{max-width:650px;margin:0;color:#9da5b2;font-size:16px;line-height:1.8}.workspace-module__foundation{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px;border:1px solid rgba(255,255,255,.09);border-radius:20px;background:rgba(35,38,45,.76);box-shadow:0 24px 60px rgba(0,0,0,.2)}.workspace-module__foundation div{display:grid;gap:6px}.workspace-module__foundation span{color:#9da5b2;font-size:13px}.workspace-module__foundation>span{padding:7px 11px;border-radius:999px;background:rgba(239,185,54,.12);color:#f1c554;white-space:nowrap}.workspace-mobile-header{display:none}.workspace-backdrop{position:fixed;inset:0;z-index:35;background:rgba(0,0,0,.58)}.workspace-profile-dialog{width:min(360px,calc(100vw - 28px));padding:22px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:#23252b;color:#fff;box-shadow:0 28px 90px rgba(0,0,0,.55)}.workspace-profile-dialog::backdrop{background:rgba(0,0,0,.62)}.workspace-profile-dialog>button{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#aeb5c0;font-size:24px;cursor:pointer}.workspace-profile-dialog__user{display:flex;align-items:center;gap:12px;padding-right:28px}.workspace-profile-dialog__user div{display:grid;gap:3px}.workspace-profile-dialog__user small{color:#8f97a4}.workspace-profile-dialog__actions{display:grid;gap:8px;margin-top:20px}.workspace-profile-dialog__actions button{height:42px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:#2c2f36;color:#eef1f5;text-align:left;padding:0 14px;cursor:pointer}.workspace-profile-dialog__actions button.is-danger{color:#ff9c9c}.workspace-profile-dialog p{min-height:20px;margin:12px 0 0;color:#efc050;font-size:12px}.workspace-page.is-sidebar-collapsed .workspace-sidebar{width:72px}.workspace-page.is-sidebar-collapsed .workspace-stage{margin-left:72px}.workspace-page.is-sidebar-collapsed :is(.workspace-brand__copy,.workspace-nav__label,.workspace-profile__copy,.workspace-profile__arrow,.workspace-balance,.workspace-recharge){display:none}.workspace-page.is-sidebar-collapsed .workspace-sidebar__toggle{transform:rotate(180deg)}
@media(max-width:760px){.workspace-sidebar{width:min(286px,86vw);transform:translateX(-105%);box-shadow:24px 0 70px rgba(0,0,0,.42)}.workspace-page.is-mobile-menu-open .workspace-sidebar{transform:translateX(0)}.workspace-sidebar__toggle{display:none}.workspace-stage,.workspace-page.is-sidebar-collapsed .workspace-stage{margin-left:0}.workspace-mobile-header{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid rgba(255,255,255,.08);background:#1b1c20}.workspace-mobile-header button{width:36px;height:36px;border:0;border-radius:10px;background:#272a31;color:#fff}.workspace-mobile-header a{display:flex;align-items:center;gap:7px;color:#fff;text-decoration:none}.workspace-mobile-header img{width:27px;height:27px;object-fit:contain}.workspace-mobile-header span{color:#efc050;font-size:11px}.workspace-main{min-height:calc(100vh - 56px);padding:28px 18px}.workspace-module{gap:20px}.workspace-module__heading h1{font-size:38px}.workspace-module__heading p{font-size:14px}.workspace-module__foundation{align-items:flex-start;flex-direction:column;padding:18px}.workspace-page.is-sidebar-collapsed :is(.workspace-brand__copy,.workspace-nav__label,.workspace-profile__copy,.workspace-profile__arrow,.workspace-balance,.workspace-recharge){display:initial}}

.front-role-overlay { position: fixed; inset: 0; z-index: var(--lz-role-overlay-layer); display: flex; align-items: center; justify-content: center; background: var(--lz-role-overlay-bg); -webkit-backdrop-filter: blur(var(--lz-role-overlay-blur)); backdrop-filter: blur(var(--lz-role-overlay-blur)); font-family: var(--lz-role-panel-font); font-size: var(--lz-role-panel-font-size); line-height: var(--lz-role-panel-line-height); }
.front-role-overlay[hidden] { display: none; }
body.front-role-panel-open { overflow: hidden; }
.front-role-panel { position: relative; display: flex; width: min(var(--lz-role-panel-width), var(--lz-role-mobile-width)); max-height: var(--lz-role-panel-max-height); flex-direction: column; overflow: hidden; color: var(--lz-role-panel-text); border: var(--lz-border-width) solid var(--lz-role-panel-border); border-radius: var(--lz-role-panel-radius); background: var(--lz-role-panel-bg); box-shadow: var(--lz-role-panel-shadow); }
.front-role-panel__glow { position: absolute; z-index: var(--lz-role-glow-layer); top: 0; right: 0; left: 0; height: var(--lz-role-glow-height); background: var(--lz-role-glow-bg); opacity: var(--lz-role-glow-opacity); pointer-events: none; }
.front-role-panel__close { position: absolute; z-index: var(--lz-role-close-layer); top: var(--lz-role-close-inset); right: var(--lz-role-close-inset); display: flex; width: var(--lz-role-close-size); height: var(--lz-role-close-size); align-items: center; justify-content: center; padding: 0; color: var(--lz-role-close-color); border: 0; border-radius: var(--lz-radius-pill); background: var(--lz-role-close-bg); cursor: pointer; transition: background var(--lz-duration-fast) var(--lz-ease-standard); }
.front-role-panel__close:hover { background: var(--lz-role-close-bg-hover); }
.front-role-panel__header { position: relative; z-index: var(--lz-role-content-layer); display: flex; flex: 0 0 auto; align-items: center; gap: var(--lz-role-header-gap); padding: var(--lz-role-header-padding); padding-right: calc(var(--lz-role-close-inset) + var(--lz-role-close-size) + var(--lz-space-2)); }
.front-role-panel__header > span:last-child { display: grid; gap: var(--lz-role-title-group-gap); }
.front-role-panel__icon { display: flex; width: var(--lz-role-header-icon-size); height: var(--lz-role-header-icon-size); flex: 0 0 var(--lz-role-header-icon-size); align-items: center; justify-content: center; color: var(--lz-role-accent); border-radius: var(--lz-role-header-icon-radius); background: var(--lz-role-header-icon-bg); }
.front-role-panel__header strong { font-size: var(--lz-role-title-size); font-weight: var(--lz-role-title-weight); line-height: var(--lz-role-title-line); }
.front-role-panel__header small { color: var(--lz-role-muted); font-size: var(--lz-role-subtitle-size); line-height: var(--lz-role-subtitle-line); }
.front-role-panel__tabs { display: flex; height: var(--lz-role-tabs-height); flex: 0 0 var(--lz-role-tabs-height); gap: var(--lz-role-tabs-gap); padding: var(--lz-role-tabs-padding); border-bottom: var(--lz-border-width) solid var(--lz-role-tabs-border); }
.front-role-panel__tabs button { position: relative; display: flex; align-items: center; gap: var(--lz-role-tab-gap); padding: var(--lz-role-tab-padding); color: var(--lz-role-tab-color); border: 0; background: transparent; font-family: var(--lz-role-control-font); font-size: var(--lz-role-tab-size); font-weight: 500; line-height: var(--lz-role-control-line); cursor: pointer; }
.front-role-panel__tabs button::after { position: absolute; right: 0; bottom: -1px; left: 0; height: var(--lz-border-width-lg); background: transparent; content: ''; }
.front-role-panel__tabs button.is-active { color: var(--lz-role-tab-active); }
.front-role-panel__tabs button.is-active::after { background: var(--lz-role-accent); }
.front-role-panel__tabs button:disabled { cursor: not-allowed; opacity: var(--lz-role-disabled-opacity); }
.front-role-panel__body { height: var(--lz-role-body-list-height); min-height: 0; box-sizing: border-box; overflow: hidden; padding: var(--lz-role-body-padding); }
.front-role-panel:not(.is-form) .front-role-panel__body { display: flex; flex-direction: column; }
.front-role-panel.is-form .front-role-panel__body { height: var(--lz-role-body-form-height); overflow: auto; }
.front-role-section-icon { display: inline-flex; align-items: center; color: var(--lz-role-accent); }
.front-role-empty, .front-role-login, .front-role-loading { color: var(--lz-role-muted); text-align: center; }
.front-role-login, .front-role-loading { display: grid; min-height: var(--lz-role-list-scroll-height); place-content: center; justify-items: center; gap: var(--lz-role-card-gap); }
.front-role-login strong, .front-role-loading strong { color: var(--lz-role-secondary); }
.front-role-login p, .front-role-loading p { margin: 0; }
.front-role-login a { padding: var(--lz-role-tab-padding); color: var(--lz-role-button-text); border-radius: var(--lz-role-button-radius); background: var(--lz-role-accent); text-decoration: none; }
@media (max-width: 720px) { .front-role-overlay { box-sizing: border-box; width: 100dvw; height: 100dvh; padding: max(var(--lz-role-mobile-block-gutter), var(--lz-safe-top)) max(var(--lz-role-mobile-inline-gutter), var(--lz-safe-right)) max(var(--lz-role-mobile-block-gutter), var(--lz-safe-bottom)) max(var(--lz-role-mobile-inline-gutter), var(--lz-safe-left)); } .front-role-panel { width: min(var(--lz-role-mobile-width), 100%); height: auto; max-height: min(var(--lz-role-panel-max-height), var(--lz-role-mobile-max-height), 100%); } .front-role-panel__tabs { flex-shrink: 0; } .front-role-panel__body, .front-role-panel.is-form .front-role-panel__body { height: auto; min-height: 0; flex: 1 1 auto; } }

.front-ai-agent-selector {
  position: relative;
  z-index: var(--lz-ai-agent-selector-layer);
  color: var(--lz-front-composer-text);
  font-size: var(--lz-font-size-sm);
  pointer-events: auto;
}

.front-ai-agent-selector[hidden] {
  display: none;
}

.front-ai-agent-selector--compact-pill {
  align-self: flex-start;
  margin: 0 0 var(--lz-space-2);
}

html body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls {
  overflow: visible;
}

body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls > .front-ai-agent-selector--compact-pill {
  min-width: 0;
  flex: 0 1 auto;
  margin: 0;
}

.front-ai-agent-compact {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--lz-space-2);
}

.front-ai-agent-pill,
.front-ai-agent-clear {
  min-height: var(--lz-control-height-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: var(--lz-border-width) solid var(--lz-front-composer-control-border);
  background: var(--lz-front-composer-control);
  color: var(--lz-front-composer-muted);
  cursor: pointer;
}

.front-ai-agent-pill {
  max-width: var(--lz-ai-agent-pill-width);
  gap: var(--lz-space-2);
  padding: var(--lz-space-1) var(--lz-space-3) var(--lz-space-1) var(--lz-space-1);
  border-radius: var(--lz-radius-pill);
}

.front-ai-agent-pill.is-selected {
  border-color: var(--lz-color-accent);
  background: color-mix(in srgb, var(--lz-color-accent) 12%, var(--lz-front-composer-control));
  color: var(--lz-front-composer-text);
}

.front-ai-agent-pill > span:not(.front-ai-agent-pill-avatar):not(.front-ai-agent-pill-icon) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.front-ai-agent-pill svg {
  width: var(--lz-icon-size-sm);
  height: var(--lz-icon-size-sm);
  fill: none;
  stroke: currentColor;
  stroke-width: var(--lz-border-width-lg);
}

.front-ai-agent-pill-avatar,
.front-ai-agent-pill-icon {
  width: var(--lz-ai-agent-pill-avatar);
  height: var(--lz-ai-agent-pill-avatar);
  display: grid;
  flex: 0 0 var(--lz-ai-agent-pill-avatar);
  place-items: center;
  overflow: hidden;
  border-radius: var(--lz-radius-pill);
  background: var(--lz-ai-agent-avatar-bg);
  object-fit: cover;
}

.front-ai-agent-clear {
  width: var(--lz-ai-agent-clear-size);
  height: var(--lz-ai-agent-clear-size);
  min-height: 0;
  padding: 0;
  border-radius: var(--lz-radius-pill);
  font-size: var(--lz-font-size-lg);
  line-height: var(--lz-line-height-tight);
}

.front-ai-agent-selector--role-strip {
  pointer-events: none;
}

.front-ai-agent-role-strip {
  position: relative;
  width: fit-content;
  max-width: min(calc(var(--lz-ai-agent-role-strip-desktop-capacity) + var(--lz-ai-agent-role-gap) + var(--lz-ai-agent-role-size)), 100%);
  display: flex;
  align-items: center;
  gap: var(--lz-ai-agent-role-gap);
  pointer-events: auto;
}

.front-ai-agent-role-strip::before {
  content: "";
  position: absolute;
  inset: calc(var(--lz-ai-agent-role-strip-surface-inset-y) * -1) calc(var(--lz-ai-agent-role-strip-surface-inset-x) * -1);
  z-index: var(--lz-ai-agent-role-strip-surface-layer);
  border: var(--lz-border-width) solid var(--lz-ai-agent-role-strip-surface-border);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-ai-agent-role-strip-surface);
}

.front-ai-agent-role-scroll {
  position: relative;
  z-index: var(--lz-ai-agent-role-strip-content-layer);
  display: flex;
  gap: var(--lz-ai-agent-role-gap);
  width: var(--lz-ai-agent-role-strip-desktop-capacity);
  max-width: calc(100% - var(--lz-ai-agent-role-gap) - var(--lz-ai-agent-role-size));
  flex: 0 1 var(--lz-ai-agent-role-strip-desktop-capacity);
  padding: var(--lz-ai-agent-role-scroll-padding-y) 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x proximity;
  scrollbar-color: transparent transparent;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
}

.front-ai-agent-role-scroll::-webkit-scrollbar {
  display: none;
}

.front-ai-agent-role {
  position: relative;
  box-sizing: border-box;
  width: var(--lz-ai-agent-role-size);
  min-width: var(--lz-ai-agent-role-size);
  height: var(--lz-ai-agent-role-size);
  min-height: var(--lz-ai-agent-role-size);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow: visible;
  border: var(--lz-ai-agent-role-border-width) solid var(--lz-ai-agent-role-border);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-ai-agent-role-surface);
  color: var(--lz-ai-agent-role-plus);
  box-shadow: none;
  cursor: pointer;
  scroll-snap-align: start;
  transition: border-color var(--lz-duration-fast) ease, box-shadow var(--lz-duration-fast) ease, translate var(--lz-duration-fast) ease;
}

.front-ai-agent-role:hover,
.front-ai-agent-role:focus-visible {
  border-color: var(--lz-ai-agent-role-hover-border);
  box-shadow: var(--lz-ai-agent-role-hover-shadow);
  translate: 0 var(--lz-ai-agent-role-hover-offset);
  outline: none;
}

.front-ai-agent-role.is-selected {
  border-color: var(--lz-ai-agent-role-selected-border);
  box-shadow: var(--lz-ai-agent-role-selected-shadow);
}

.front-ai-agent-role-avatar-wrap,
.front-ai-agent-role-avatar {
  width: var(--lz-ai-agent-role-avatar-size);
  height: var(--lz-ai-agent-role-avatar-size);
  border-radius: var(--lz-radius-pill);
}

.front-ai-agent-role-avatar-wrap {
  display: block;
  overflow: hidden;
}

.front-ai-agent-role-avatar {
  display: block;
  object-fit: cover;
}

.front-ai-agent-role--create {
  z-index: var(--lz-ai-agent-role-strip-content-layer);
  flex: 0 0 var(--lz-ai-agent-role-size);
  border-style: dashed;
  border-color: var(--lz-ai-agent-role-create-border);
  background: transparent;
}

.front-ai-agent-role--create:hover,
.front-ai-agent-role--create:focus-visible {
  border-color: var(--lz-ai-agent-role-create-hover-border);
}

.front-ai-agent-role-plus {
  display: block;
  color: var(--lz-ai-agent-role-plus);
  font-size: var(--lz-ai-agent-role-plus-size);
  font-weight: var(--lz-font-weight-light);
  line-height: var(--lz-ai-agent-role-plus-line-height);
}

.front-ai-agent-avatar-fallback {
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--lz-color-accent), var(--lz-color-primary-hover));
  color: var(--lz-color-surface);
  font-weight: var(--lz-font-weight-bold);
}

@media (max-width: 640px) {
  .front-ai-agent-selector--compact-pill {
    margin-bottom: var(--lz-space-2);
  }

  .front-ai-agent-role-strip {
    max-width: min(calc(var(--lz-ai-agent-role-strip-mobile-capacity) + var(--lz-ai-agent-role-gap) + var(--lz-ai-agent-role-mobile-size)), 100%);
  }

  .front-ai-agent-role-scroll {
    width: var(--lz-ai-agent-role-strip-mobile-capacity);
    max-width: calc(100% - var(--lz-ai-agent-role-gap) - var(--lz-ai-agent-role-mobile-size));
    flex-basis: var(--lz-ai-agent-role-strip-mobile-capacity);
  }

  .front-ai-agent-role {
    width: var(--lz-ai-agent-role-mobile-size);
    min-width: var(--lz-ai-agent-role-mobile-size);
    height: var(--lz-ai-agent-role-mobile-size);
    min-height: var(--lz-ai-agent-role-mobile-size);
  }

  .front-ai-agent-role--create {
    flex-basis: var(--lz-ai-agent-role-mobile-size);
  }

  .front-ai-agent-role-avatar-wrap,
  .front-ai-agent-role-avatar {
    width: var(--lz-ai-agent-role-mobile-avatar-size);
    height: var(--lz-ai-agent-role-mobile-avatar-size);
  }
}

body.page-app.front-creative-page .front-param-portal.front-param-draw-popover{
  --draw-param-panel:var(--front-param-panel-bg);
  --draw-param-line:var(--front-param-panel-border);
  --draw-param-text:var(--front-param-panel-text);
  --draw-param-muted:var(--front-param-control-muted);
  --draw-param-selected:var(--front-param-panel-hover);
  --draw-param-scroll:rgba(174,180,191,.52);
  --front-param-portal-width:max-content;
  --front-param-portal-min-width:132px;
  --front-param-portal-max-width:min(260px,calc(100vw - 24px));
  padding:8px;
  gap:4px;
  border:1px solid var(--draw-param-line);
  border-radius:12px;
  background:var(--draw-param-panel);
  background-image:none;
  color:var(--draw-param-text);
  box-shadow:var(--front-param-shadow);
  max-height:min(248px,calc(100dvh - 24px));
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:var(--draw-param-scroll) transparent;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover,
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover button,
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover input{
  font-family:"Microsoft YaHei UI","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-synthesis:none;
  letter-spacing:0;
  text-shadow:none;
  -webkit-font-smoothing:auto;
  text-rendering:auto;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover::before{
  color:var(--draw-param-muted);
  -webkit-text-fill-color:var(--draw-param-muted);
  font-family:"Microsoft YaHei UI","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:12px;
  font-weight:600;
  line-height:1.5;
  letter-spacing:0;
  text-shadow:none;
  -webkit-font-smoothing:auto;
  text-rendering:auto;
  opacity:1;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"]{
  --front-param-portal-width:244px;
  --front-param-portal-min-width:244px;
  max-height:min(336px,calc(100dvh - 24px));
  gap:6px;
  padding:8px;
  border-radius:10px;
  background:rgba(34,36,42,.94);
  border-color:rgba(255,255,255,.10);
  box-shadow:0 18px 44px rgba(0,0,0,.36);
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  text-rendering:optimizeLegibility;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"]::before{
  content:"\9009\62E9\6A21\578B";
  margin:0 4px 5px;
  text-align:center;
  font-size:11px;
  font-weight:600;
  line-height:16px;
  color:var(--draw-param-muted);
  -webkit-text-fill-color:var(--draw-param-muted);
  background-image:linear-gradient(to right,var(--draw-param-line) 0,var(--draw-param-line) calc(50% - 38px),transparent calc(50% - 38px),transparent calc(50% + 38px),var(--draw-param-line) calc(50% + 38px),var(--draw-param-line) 100%);
  background-repeat:no-repeat;
  background-size:100% 1px;
  background-position:center;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="size"]{
  min-width:166px;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover::-webkit-scrollbar,
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover *::-webkit-scrollbar{
  width:2px;
  height:2px;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover::-webkit-scrollbar-track,
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover *::-webkit-scrollbar-track{
  background:transparent;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover::-webkit-scrollbar-thumb,
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover *::-webkit-scrollbar-thumb{
  border:0;
  border-radius:999px;
  background:var(--draw-param-scroll);
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option{
  width:100%;
  min-width:max-content;
  height:34px;
  min-height:34px;
  padding:0 9px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
  font-size:13px;
  font-weight:600;
  line-height:1.2;
  white-space:nowrap;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option,
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option *{
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
  font-family:inherit;
  font-weight:600;
  letter-spacing:0;
  text-shadow:none;
  opacity:1;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option::after{
  color:var(--draw-param-muted);
  -webkit-text-fill-color:var(--draw-param-muted);
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option:hover,
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option.is-selected{
  background:var(--draw-param-selected);
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="size"] .front-param-option-icon{
  width:16px;
  height:16px;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  shape-rendering:geometricPrecision;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="quality"] .front-param-option-icon{
  width:19px;
  height:16px;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  shape-rendering:geometricPrecision;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="quality"] .ai-draw-quality-badge-text{
  fill:currentColor;
  stroke:none;
  font-family:Arial,sans-serif;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:0;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option{
  width:100%;
  min-width:0;
  height:40px;
  min-height:40px;
  padding:0 12px;
  align-items:center;
  justify-content:flex-start;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  background-image:none;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:800;
  line-height:1;
  white-space:normal;
  overflow:visible;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option:hover{
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.10);
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected{
  background:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.13);
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-copy{
  display:block;
  gap:0;
  width:100%;
  min-width:0;
  font-weight:800;
  line-height:1;
  text-align:left;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title{
  display:block;
  overflow:hidden;
  color:#f7f8fb;
  -webkit-text-fill-color:#f7f8fb;
  font-size:14px;
  font-weight:900;
  line-height:1.18;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-intro{
  display:block;
  overflow:hidden;
  color:#9ca3af;
  -webkit-text-fill-color:#9ca3af;
  font-size:11px;
  font-weight:600;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-price{
  display:block;
  color:#f59e0b;
  -webkit-text-fill-color:#f59e0b;
  font-size:12px;
  font-weight:820;
  line-height:1.2;
  white-space:nowrap;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-bolt{
  color:#fbbf24;
  -webkit-text-fill-color:#fbbf24;
  font-weight:820;
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option:hover,
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option.is-selected{
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count{
  min-width:0;
  padding:8px 2px 2px;
  border-top:1px solid var(--draw-param-line);
  color:var(--draw-param-muted);
}
html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count>span{
  color:var(--draw-param-muted);
  -webkit-text-fill-color:var(--draw-param-muted);
  font-size:12px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:0;
  text-shadow:none;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count>div{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count input{
  flex:0 0 54px;
  width:54px;
  min-width:54px;
  max-width:54px;
  height:30px;
  min-height:30px;
  max-height:30px;
  padding:0 6px;
  border:1px solid var(--draw-param-line);
  border-radius:8px;
  background:var(--front-param-control-bg);
  background-image:none;
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
  box-shadow:none;
}
html body.page-app.front-creative-page:not(#jnDrawParamInputA):not(#jnDrawParamInputB):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count input{
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
}
body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count button{
  flex:0 0 auto;
  width:auto;
  min-width:46px;
  height:30px;
  min-height:30px;
  padding:0 10px;
  border:1px solid var(--draw-param-line);
  border-radius:8px;
  background:var(--front-param-panel-hover);
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
}
html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"],
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"],
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"]{
  --draw-param-scroll:rgba(100,116,139,.42);
}
html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger:hover,
html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.is-portal-open .front-param-trigger.ai-param-trigger,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger:hover,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.is-portal-open .front-param-trigger.ai-param-trigger,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger:hover,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-select.is-portal-open .front-param-trigger.ai-param-trigger{
  border-color:rgba(15,23,42,.18);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover{
  --draw-param-panel:var(--front-param-panel-bg);
  --draw-param-line:var(--front-param-panel-border);
  --draw-param-text:var(--front-param-panel-text);
  --draw-param-muted:var(--front-param-control-muted);
  --draw-param-selected:var(--front-param-panel-hover);
  --draw-param-scroll:rgba(100,116,139,.42);
  box-shadow:var(--front-param-shadow);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"],
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"],
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"]{
  background:var(--front-param-panel-bg);
  border-color:var(--front-param-panel-border);
  box-shadow:var(--front-param-shadow);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option{
  background:transparent;
  border-color:transparent;
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option:hover,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option:hover,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option:hover{
  background:linear-gradient(135deg,#fff,#eef6ff);
  border-color:rgba(37,99,235,.24);
  box-shadow:0 10px 22px rgba(37,99,235,.12),inset 0 1px 0 rgba(255,255,255,.95);
  transform:translateY(-1px);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected{
  background:rgba(59,130,246,.10);
  border-color:rgba(37,99,235,.22);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected:hover,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected:hover,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected:hover{
  background:linear-gradient(135deg,#eff6ff,#dbeafe);
  border-color:rgba(37,99,235,.36);
  box-shadow:0 12px 26px rgba(37,99,235,.14),inset 0 1px 0 rgba(255,255,255,.94);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title{
  color:#111827;
  -webkit-text-fill-color:#111827;
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-intro,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-intro,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-intro{
  color:#64748b;
  -webkit-text-fill-color:#64748b;
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-price,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-price,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-price{
  color:#d97706;
  -webkit-text-fill-color:#d97706;
}
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option,
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option *,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option *,
html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option,
html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option *,
html body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option,
html body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-option *{
  color:var(--front-param-panel-text);
  -webkit-text-fill-color:var(--front-param-panel-text);
}
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover::before,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover::before,
html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover::before,
html body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover::before,
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count>span,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count>span,
html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count>span,
html body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count>span{
  color:var(--front-param-control-muted);
  -webkit-text-fill-color:var(--front-param-control-muted);
}
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count input,
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count button,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count input,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count button,
html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count input,
html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count button,
html body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count input,
html body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count button{
  color:var(--front-param-panel-text);
  -webkit-text-fill-color:var(--front-param-panel-text);
}
:is(html.jn-light-mode,html[data-theme="light"]) body.page-app.front-creative-page:not(#jnDrawParamTextA):not(#jnDrawParamTextB):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover button.front-param-option,
body.page-app.front-creative-page:is(.jn-light-mode,[data-theme="light"]):not(#jnDrawParamTextA):not(#jnDrawParamTextB):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover button.front-param-option,
:is(html.jn-light-mode,html[data-theme="light"]) body.page-app.front-creative-page:not(#jnDrawParamTextA):not(#jnDrawParamTextB):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count button,
body.page-app.front-creative-page:is(.jn-light-mode,[data-theme="light"]):not(#jnDrawParamTextA):not(#jnDrawParamTextB):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover .front-param-custom-count button{
  color:var(--front-param-panel-text);
  -webkit-text-fill-color:var(--front-param-panel-text);
}
:is(html.jn-light-mode,html[data-theme="light"]) body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-title,
html body.page-app.front-creative-page:is(.jn-light-mode,[data-theme="light"]):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-title{
  color:#111827;
  -webkit-text-fill-color:#111827;
}
:is(html.jn-light-mode,html[data-theme="light"]) body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-intro,
html body.page-app.front-creative-page:is(.jn-light-mode,[data-theme="light"]):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-intro{
  color:#64748b;
  -webkit-text-fill-color:#64748b;
}
:is(html.jn-light-mode,html[data-theme="light"]) body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-price,
html body.page-app.front-creative-page:is(.jn-light-mode,[data-theme="light"]):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-price{
  color:#d97706;
  -webkit-text-fill-color:#d97706;
}
:is(html.jn-light-mode,html[data-theme="light"]) body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-bolt,
html body.page-app.front-creative-page:is(.jn-light-mode,[data-theme="light"]):not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] .front-param-option.front-chat-model-option .front-chat-model-bolt{
  color:#f59e0b;
  -webkit-text-fill-color:#f59e0b;
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count input,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count input,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover .front-param-custom-count input{
  background:var(--front-param-control-bg);
}
html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count button,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-custom-count button,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover .front-param-custom-count button{
  background:var(--front-param-panel-hover);
}
@media(max-width:860px){
  body.page-app.front-creative-page .front-param-portal.front-param-draw-popover{
    max-height:min(190px,calc(100dvh - 24px));
    padding:6px;
    gap:2px;
  }
  body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"]::before{
    margin-bottom:6px;
  }
  body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"]{
    --front-param-portal-width:min(220px,calc(100vw - 24px));
    --front-param-portal-min-width:min(220px,calc(100vw - 24px));
    max-height:min(190px,calc(100dvh - 24px));
    gap:4px;
  }
  body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option{
    height:36px;
    min-height:36px;
    padding:0 10px;
  }
  html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title{
    font-size:13px;
  }
  html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-intro,
  html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-price{
    font-size:11px;
  }
  body.page-app.front-creative-page .front-param-portal.front-param-draw-popover .front-param-option{
    height:30px;
    min-height:30px;
    padding:0 8px;
    border-radius:8px;
    font-size:13px;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools{
    width:100%;
    max-width:100%;
    margin-bottom:var(--lz-creative-composer-tools-gap);
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools [data-clear-failed]{
    order:1;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools [data-clear-all]{
    order:2;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools .front-creative-billing-pill.ai-video-price-pill{
    order:3;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
    padding:16px 12px 62px;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] #aiDrawPrompt{
    left:12px;
    right:12px;
    top:16px;
    bottom:62px;
    padding-left:100px;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .ai-draw-inner-controls{
    left:12px;
    right:72px;
    bottom:16px;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-side-image{
    right:14px;
    bottom:16px;
  }
  body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select,
  body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
    min-width:max-content;
    height:30px;
    min-height:30px;
    max-height:30px;
  }
  body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
    padding:0 9px;
    gap:5px;
    border-radius:10px;
    font-size:13px;
    font-weight:800;
  }
  body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger svg{
    width:13px;
    height:13px;
    flex-basis:13px;
  }
  body.page-app.front-creative-page [data-front-creative-composer="image"] .ai-draw-model-select,
  body.page-app.front-creative-page [data-front-creative-composer="image"] .ai-draw-model-select>.front-param-trigger.ai-param-trigger{
    width:max-content;
    min-width:max-content;
    max-width:min(168px,calc(100vw - 44px));
  }
  html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-model-select.ai-draw-model-select>.front-param-trigger.ai-param-trigger{
    padding:0 20px 0 10px;
  }
}

html.jn-light-mode body.page-app.front-creative-page .front-param-portal.front-param-draw-popover,
html[data-theme="light"] body.page-app.front-creative-page .front-param-portal.front-param-draw-popover,
body.page-app.front-creative-page.jn-light-mode .front-param-portal.front-param-draw-popover{
  --front-param-panel-bg:rgba(246,248,252,.82);
  --front-param-panel-text:#50627a;
  --front-param-panel-hover:rgba(15,23,42,.06);
  --front-param-shadow:0 18px 44px rgba(15,23,42,.14);
}

html body.page-app.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-copy{
  overflow:visible;
  overflow-x:visible;
  overflow-y:visible;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"]::before{
  content:"数量\A选择生成内容的数量";
  display:block;
  margin:0 4px 6px;
  white-space:pre-line;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] .front-param-option{
  gap:10px;
  overflow:hidden;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] .front-param-option-icon{
  width:14px;
  height:14px;
  flex:none;
  opacity:1;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] .front-param-check{
  width:15px;
  height:15px;
  display:none;
  flex:none;
  align-items:normal;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] .front-param-check svg{
  width:15px;
  height:15px;
  display:block;
  stroke-width:3;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] .front-param-option.is-selected .front-param-check{
  display:block;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="size"]::before{
  content:"尺寸\A选择生成内容的比例";
  display:block;
  margin:0 4px 6px;
  white-space:pre-line;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="size"] .front-param-option{
  gap:10px;
  overflow:hidden;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="size"] .front-param-check{
  width:15px;
  height:15px;
  display:none;
  flex:none;
  align-items:normal;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="size"] .front-param-check svg{
  width:15px;
  height:15px;
  display:block;
  stroke-width:3;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="size"] .front-param-option.is-selected .front-param-check{
  display:block;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="quality"]::before{
  content:"质量\A选择生成清晰度";
  display:block;
  margin:0 4px 6px;
  white-space:pre-line;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="quality"] .front-param-option{
  gap:10px;
  overflow:hidden;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="quality"] .front-param-option-icon{
  width:19px;
  height:16px;
  flex:none;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="quality"] .front-param-check{
  width:15px;
  height:15px;
  display:none;
  flex:none;
  align-items:normal;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="quality"] .front-param-check svg{
  width:15px;
  height:15px;
  display:block;
  stroke-width:3;
}

html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="quality"] .front-param-option.is-selected .front-param-check{
  display:block;
}

html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-video-composer-frame{
  margin:0;
}

html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"],
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"],
body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"]{
  color:#0f172a;
}

html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools,
body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools{
  color:#0f172a;
}

html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-select.ai-draw-select{
  --draw-param-text:#50627a;
  --draw-param-muted:#64748b;
  color:var(--draw-param-text);
}

html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-model-select,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-model-select,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-select.ai-draw-model-select{
  color:#475569;
}

html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) [data-front-creative-composer="image"] .ai-draw-clear-tool :is(svg,span),
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) [data-front-creative-composer="image"] .ai-draw-clear-tool :is(svg,span),
body.page-app.front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer="image"] .ai-draw-clear-tool :is(svg,span){
  color:inherit;
}

html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
  color:#475569;
  -webkit-text-fill-color:#475569;
}

.front-role-preference-card { box-sizing: border-box; padding: var(--lz-role-card-padding); border: var(--lz-border-width) solid var(--lz-role-card-border); border-radius: var(--lz-role-card-radius); background: var(--lz-role-card-bg); }
.front-role-preference-card--list { display: flex; height: 100%; min-height: 0; flex-direction: column; border-color: var(--lz-role-list-card-border); }
.front-role-panel:not(.is-form) .front-role-preference-card--list { height: auto; flex: 1 1 auto; overflow: hidden; }
.front-role-list-title { display: flex; align-items: center; gap: var(--lz-role-section-header-gap); margin-bottom: var(--lz-role-section-header-margin); color: var(--lz-role-secondary); font-size: var(--lz-role-subtitle-size); line-height: var(--lz-role-subtitle-line); }
.front-role-list-title strong { font-weight: 600; }
.front-role-list-description { margin: 0 0 var(--lz-role-list-gap); color: var(--lz-role-muted); font-size: var(--lz-role-subtitle-size); line-height: var(--lz-role-subtitle-line); }
.front-role-scroll { min-height: 0; flex: 1 1 auto; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.front-role-list { display: flex; flex-direction: column; gap: var(--lz-role-list-gap); }
.front-role-card { position: relative; display: flex; min-height: var(--lz-role-item-height); box-sizing: border-box; align-items: center; gap: var(--lz-role-item-gap); padding: var(--lz-role-item-padding); border: var(--lz-border-width) solid var(--lz-role-item-border); border-radius: var(--lz-role-item-radius); background: var(--lz-role-item-bg); box-shadow: var(--lz-role-item-shadow); transition: border-color var(--lz-duration-fast) var(--lz-ease-standard), opacity var(--lz-duration-fast) var(--lz-ease-standard); }
.front-role-card:hover { border-color: var(--lz-role-item-hover-border); background: var(--lz-role-item-hover-bg); }
.front-role-card[data-role-select] { cursor: pointer; }
.front-role-card[data-role-select]:focus-visible { border-color: var(--lz-role-item-selected-border); outline: none; box-shadow: var(--lz-role-item-selected-shadow); }
.front-role-card.is-selected { border-color: var(--lz-role-item-selected-border); background: var(--lz-role-item-selected-bg); box-shadow: var(--lz-role-item-selected-shadow); }
.front-role-card.is-hidden-role { opacity: var(--lz-role-disabled-opacity); cursor: default; }
.front-role-card.is-dragging { opacity: var(--lz-role-disabled-opacity); }
.front-role-card__drag { position: absolute; left: var(--lz-role-drag-left); display: flex; width: var(--lz-role-drag-width); height: var(--lz-role-drag-height); align-items: center; justify-content: center; padding: 0; color: var(--lz-role-drag-color); border: 0; border-radius: var(--lz-role-drag-radius); background: transparent; font-family: var(--lz-role-control-font); font-size: var(--lz-role-action-font-size); line-height: var(--lz-role-control-line); cursor: grab; }
.front-role-card__drag:active { cursor: grabbing; }
.front-role-card__badge { position: absolute; top: var(--lz-role-badge-inset); right: var(--lz-role-badge-inset); padding: var(--lz-role-badge-padding); border-radius: var(--lz-role-badge-radius); font-size: var(--lz-role-badge-size); font-weight: var(--lz-role-badge-weight); line-height: var(--lz-role-badge-line); }
.front-role-card__badge.is-custom { color: var(--lz-role-badge-custom-color); background: var(--lz-role-badge-custom-bg); }
.front-role-card__badge.is-official { color: var(--lz-role-badge-official-color); background: var(--lz-role-badge-official-bg); }
.front-role-card__avatar { width: var(--lz-role-avatar-size); height: var(--lz-role-avatar-size); flex: 0 0 var(--lz-role-avatar-size); box-sizing: border-box; object-fit: cover; border: var(--lz-border-width) solid var(--lz-role-avatar-border); border-radius: var(--lz-role-avatar-radius); }
.front-role-avatar-fallback { display: flex; align-items: center; justify-content: center; color: var(--lz-role-button-text); background: var(--lz-ai-agent-avatar-bg); font-size: var(--lz-role-tab-size); }
.front-role-card__info { display: block; min-width: 0; flex: 1; }
.front-role-card__info strong, .front-role-card__info small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.front-role-card__info strong { display: block; color: var(--lz-role-panel-text); font-size: var(--lz-role-tab-size); font-weight: 600; line-height: var(--lz-role-field-line); }
.front-role-card__info small { display: block; margin-top: var(--lz-role-card-description-margin); color: var(--lz-role-muted); font-size: var(--lz-role-card-description-size); line-height: var(--lz-role-card-description-line); }
.front-role-card__actions { position: absolute; right: var(--lz-role-action-right); bottom: var(--lz-role-action-bottom); display: flex; align-items: center; gap: var(--lz-role-actions-gap); padding: var(--lz-role-actions-gap); border: var(--lz-border-width) solid var(--lz-role-actions-border); border-radius: var(--lz-radius-pill); background: var(--lz-role-actions-bg); box-shadow: var(--lz-role-actions-shadow); }
.front-role-card__actions button { display: flex; width: var(--lz-role-action-size); height: var(--lz-role-action-size); flex: 0 0 var(--lz-role-action-size); align-items: center; justify-content: center; padding: 0; color: var(--lz-role-action-color); border: var(--lz-border-width) solid var(--lz-role-action-border); border-radius: var(--lz-role-action-radius); background: var(--lz-role-action-bg); font-family: var(--lz-role-control-font); font-size: var(--lz-role-action-font-size); line-height: var(--lz-role-action-line); cursor: pointer; }
.front-role-card__actions button.is-danger { color: var(--lz-role-danger); }
.front-role-card__actions button.is-visible { color: var(--lz-role-accent); border-color: var(--lz-role-action-active-border); background: var(--lz-role-action-active-bg); }
.front-role-model-section { margin-top: var(--lz-role-grid-gap); padding-top: var(--lz-role-grid-gap); border-top: var(--lz-border-width) solid var(--lz-role-model-border); }
.front-role-model-section header { display: flex; align-items: center; gap: var(--lz-role-list-gap); margin-bottom: var(--lz-role-list-gap); color: var(--lz-role-secondary); font-size: var(--lz-role-subtitle-size); line-height: var(--lz-role-subtitle-line); }
.front-role-model-section header strong { font-weight: 600; }
.front-role-model-section header span { padding: 0 var(--lz-role-list-gap); color: var(--lz-role-badge-custom-color); border-radius: var(--lz-radius-pill); background: var(--lz-role-badge-custom-bg); font-size: var(--lz-role-badge-size); line-height: var(--lz-role-subtitle-line); }
.front-role-model-section p { margin: 0 0 var(--lz-role-grid-gap); color: var(--lz-role-muted); font-size: var(--lz-role-model-hint-size); line-height: var(--lz-role-model-hint-line); }
.front-role-model-row { display: flex; height: var(--lz-role-model-picker-height); align-items: center; margin-bottom: var(--lz-role-grid-gap); }
.front-role-model-picker-button { display: flex; width: fit-content; min-width: var(--lz-role-model-picker-min-width); max-width: var(--lz-role-model-picker-max-width); height: var(--lz-role-model-picker-height); align-items: center; justify-content: center; gap: var(--lz-role-model-picker-gap); padding: var(--lz-role-model-picker-padding); color: var(--lz-role-model-selector-text); border: var(--lz-border-width) solid var(--lz-role-model-selector-border); border-radius: var(--lz-role-model-radius); background: var(--lz-role-panel-bg); box-shadow: var(--lz-role-model-shadow); font-family: var(--lz-role-control-font); text-align: left; cursor: pointer; }
.front-role-model-picker-button strong { min-width: 0; overflow: hidden; color: var(--lz-role-panel-text); font-size: var(--lz-role-model-selector-size); font-weight: 500; line-height: var(--lz-role-field-line); text-overflow: ellipsis; white-space: nowrap; }
.front-role-model-picker-button > svg { flex: 0 0 auto; color: var(--lz-role-accent); }
.front-role-model-section > button { display: block; width: 100%; height: var(--lz-role-model-save-height); padding: var(--lz-role-model-save-padding); color: var(--lz-role-button-text); border: 0; border-radius: var(--lz-role-button-radius); background: var(--lz-role-accent); box-shadow: var(--lz-role-model-save-shadow); font-family: var(--lz-role-control-font); font-size: var(--lz-role-tab-size); font-weight: 500; line-height: var(--lz-role-control-line); cursor: pointer; }
@media (max-width: 720px) { .front-role-card { padding-right: var(--lz-space-8); } .front-role-card__info small { display: none; } .front-role-card__actions { position: static; margin-left: auto; padding: var(--lz-space-1); box-shadow: none; } .front-role-card__badge { display: none; } }

.front-role-form { display: flex; min-height: 100%; flex-direction: column; }
.front-role-form-grid { display: grid; height: var(--lz-role-form-grid-height); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--lz-role-grid-gap); }
.front-role-form-grid > .front-role-preference-card { height: var(--lz-role-form-top-card-height); }
.front-role-form-grid > .front-role-prompt-card { height: var(--lz-role-form-prompt-card-height); grid-column: 1 / -1; }
.front-role-preference-card > header { display: flex; align-items: center; gap: var(--lz-role-section-header-gap); margin-bottom: var(--lz-role-section-header-margin); color: var(--lz-role-secondary); }
.front-role-preference-card > header strong { font-size: var(--lz-role-subtitle-size); font-weight: 600; line-height: var(--lz-role-subtitle-line); }
.front-role-basic-card { display: flex; flex-direction: column; }
.front-role-form-field { color: var(--lz-role-panel-text); font-size: var(--lz-role-panel-font-size); }
.front-role-basic-card .front-role-form-field + .front-role-form-field { margin-top: var(--lz-role-grid-gap); }
.front-role-form-field > label { display: flex; align-items: center; gap: var(--lz-role-hint-margin); margin-bottom: var(--lz-role-field-gap); color: var(--lz-role-secondary); font-size: var(--lz-role-subtitle-size); line-height: var(--lz-role-subtitle-line); }
.front-role-form-field b { color: var(--lz-role-danger); font-weight: 500; }
.front-role-prompt-card label small { color: var(--lz-role-hint-color); font-size: var(--lz-role-hint-size); line-height: var(--lz-role-hint-line); }
.front-role-basic-card input, .front-role-prompt-card textarea { display: inline-block; width: 100%; box-sizing: border-box; color: var(--lz-role-field-color); border: var(--lz-border-width) solid var(--lz-role-field-border); border-radius: var(--lz-role-field-radius); outline: 0; background: var(--lz-role-field-bg); font-family: var(--lz-role-control-font); font-size: var(--lz-role-field-size); transition: border-color var(--lz-duration-fast) var(--lz-ease-standard), box-shadow var(--lz-duration-fast) var(--lz-ease-standard); }
.front-role-basic-card input { height: var(--lz-role-field-height); padding: var(--lz-role-field-padding); line-height: var(--lz-role-control-line); }
.front-role-prompt-card textarea { height: var(--lz-role-prompt-height); padding: var(--lz-role-field-padding); resize: vertical; line-height: var(--lz-role-field-line); }
.front-role-basic-card input:focus, .front-role-prompt-card textarea:focus { border-color: var(--lz-role-accent); box-shadow: 0 0 0 var(--lz-border-width-lg) var(--lz-role-accent-soft); }
.front-role-basic-card input::placeholder, .front-role-prompt-card textarea::placeholder { color: var(--lz-role-muted); }
.front-role-avatar-row { display: flex; align-items: center; gap: var(--lz-role-grid-gap); }
.front-role-avatar-uploader { display: flex; width: var(--lz-role-avatar-upload-size); height: var(--lz-role-avatar-upload-size); flex: 0 0 var(--lz-role-avatar-upload-size); align-items: center; justify-content: center; overflow: hidden; padding: 0; color: var(--lz-role-panel-text); border: var(--lz-border-width-lg) dashed var(--lz-role-avatar-upload-border); border-radius: var(--lz-role-avatar-upload-radius); background: var(--lz-role-avatar-upload-bg); cursor: pointer; }
.front-role-avatar-uploader.has-image { border-style: dashed; }
.front-role-avatar-uploader img { width: 100%; height: 100%; object-fit: cover; }
.front-role-remove-avatar { padding: var(--lz-role-remove-avatar-padding); color: var(--lz-role-danger); border: 0; border-radius: var(--lz-role-badge-radius); background: var(--lz-role-remove-avatar-bg); font-family: var(--lz-role-control-font); font-size: var(--lz-role-card-description-size); line-height: var(--lz-role-control-line); cursor: pointer; }
.front-role-prompt-tools { display: flex; align-items: center; justify-content: space-between; margin-top: var(--lz-role-prompt-tools-margin); }
.front-role-prompt-tools button { display: flex; height: var(--lz-role-optimize-height); align-items: center; gap: var(--lz-role-optimize-gap); padding: var(--lz-role-optimize-padding); color: var(--lz-role-badge-official-color); border: var(--lz-border-width) solid var(--lz-role-optimize-border); border-radius: var(--lz-radius-pill); background: var(--lz-role-optimize-bg); font-family: var(--lz-role-control-font); font-size: var(--lz-role-optimize-size); line-height: var(--lz-role-control-line); cursor: pointer; }
.front-role-prompt-tools button:disabled { cursor: not-allowed; opacity: var(--lz-role-disabled-opacity); }
.front-role-prompt-tools > span { color: var(--lz-role-count-color); font-size: var(--lz-role-hint-size); line-height: var(--lz-role-hint-line); }
.front-role-form-status { color: var(--lz-role-muted); font-size: var(--lz-role-subtitle-size); line-height: var(--lz-role-subtitle-line); }
.front-role-form-status:empty { display: none; }
.front-role-form-status.is-error { color: var(--lz-role-status-error); }
.front-role-form footer { display: flex; gap: var(--lz-role-form-actions-gap); margin-top: var(--lz-role-form-actions-margin); padding-top: var(--lz-role-form-actions-padding); border-top: var(--lz-border-width) solid var(--lz-role-tabs-border); }
.front-role-form footer button { height: var(--lz-role-form-button-height); flex: 1; padding: var(--lz-role-button-padding); color: var(--lz-role-tab-active); border: var(--lz-border-width) solid var(--lz-role-button-muted-border); border-radius: var(--lz-role-button-radius); background: var(--lz-role-button-muted-bg); font-family: var(--lz-role-control-font); font-size: var(--lz-role-tab-size); font-weight: 500; line-height: var(--lz-role-control-line); cursor: pointer; }
.front-role-form footer button.is-primary { color: var(--lz-role-button-text); border: 0; background: var(--lz-role-button-primary-bg); }
.front-role-form footer button:disabled { cursor: not-allowed; opacity: var(--lz-role-disabled-opacity); background: var(--lz-role-button-primary-disabled-bg); }
@media (max-width: 720px) { .front-role-form-grid { height: auto; grid-template-columns: 1fr; } .front-role-form-grid > .front-role-preference-card { height: auto; min-height: var(--lz-role-form-top-card-height); } .front-role-form-grid > .front-role-prompt-card { grid-column: auto; } }

.front-ai-agent-action-layer {
  position: fixed;
  inset: 0;
  z-index: var(--lz-ai-agent-action-layer);
  display: grid;
  place-items: center;
  box-sizing: border-box;
  padding: var(--lz-ai-agent-action-gap);
  background: var(--lz-ai-agent-action-overlay);
}
.front-ai-agent-action-layer[hidden] { display: none; }
.front-ai-agent-action-open { overflow: hidden; }
.front-ai-agent-action-dialog {
  position: relative;
  width: min(var(--lz-ai-agent-action-width), var(--lz-ai-agent-action-viewport-width));
  max-height: var(--lz-ai-agent-action-max-height);
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: hidden;
  color: var(--lz-ai-agent-action-text);
  border: var(--lz-border-width) solid var(--lz-ai-agent-action-border);
  border-radius: var(--lz-ai-agent-action-radius);
  background: var(--lz-ai-agent-action-bg);
  box-shadow: var(--lz-ai-agent-action-shadow);
}
.front-ai-agent-action-dialog > [data-agent-action-content] {
  z-index: var(--lz-ai-agent-action-content-layer);
  min-width: 0;
  min-height: 0;
  overflow: auto;
  scrollbar-width: thin;
}
.front-ai-agent-action-close {
  position: absolute;
  top: var(--lz-ai-agent-action-close-inset);
  right: var(--lz-ai-agent-action-close-inset);
  z-index: var(--lz-ai-agent-action-close-layer);
  width: var(--lz-ai-agent-action-close-size);
  height: var(--lz-ai-agent-action-close-size);
  display: grid;
  place-items: center;
  padding: 0;
  color: var(--lz-ai-agent-action-muted);
  border: 0;
  border-radius: var(--lz-radius-pill);
  background: var(--lz-ai-agent-action-close-bg);
  font-size: var(--lz-ai-agent-action-title-size);
  cursor: pointer;
}
.front-ai-agent-action-close:hover,
.front-ai-agent-action-close:focus-visible { color: var(--lz-ai-agent-action-text); background: var(--lz-ai-agent-action-close-hover); outline: none; }
.front-ai-agent-action-thinking,
.front-ai-agent-action-error {
  min-height: calc(var(--lz-ai-agent-action-avatar-size) * 4);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--lz-ai-agent-action-gap);
  padding: calc(var(--lz-ai-agent-action-padding) * 2) var(--lz-ai-agent-action-padding);
  text-align: center;
}
.front-ai-agent-action-avatar-wrap { position: relative; display: block; flex: 0 0 auto; }
.front-ai-agent-action-avatar {
  width: var(--lz-ai-agent-action-avatar-size);
  height: var(--lz-ai-agent-action-avatar-size);
  display: block;
  overflow: hidden;
  border: var(--lz-ai-agent-action-avatar-border) solid var(--lz-ai-agent-action-card-border);
  border-radius: var(--lz-radius-pill);
  object-fit: cover;
}
.front-ai-agent-action-avatar-wrap > i {
  position: absolute;
  right: 0;
  bottom: 0;
  width: var(--lz-ai-agent-action-active-size);
  height: var(--lz-ai-agent-action-active-size);
  border: var(--lz-ai-agent-action-active-ring) solid var(--lz-ai-agent-action-bg);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-color-success);
}
.front-ai-agent-action-thinking strong,
.front-ai-agent-action-error strong { font-size: var(--lz-ai-agent-action-title-size); }
.front-ai-agent-action-thinking > span:not(.front-ai-agent-action-avatar-wrap),
.front-ai-agent-action-error p { margin: 0; color: var(--lz-ai-agent-action-muted); font-size: var(--lz-ai-agent-action-body-size); }
.front-ai-agent-action-thinking > b { display: flex; gap: var(--lz-ai-agent-action-dot-gap); }
.front-ai-agent-action-thinking > b i {
  width: var(--lz-ai-agent-action-dot-size);
  height: var(--lz-ai-agent-action-dot-size);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-role-accent);
  animation: front-ai-agent-thinking var(--lz-ai-agent-action-duration) ease-in-out infinite;
}
.front-ai-agent-action-thinking > b i:nth-child(2) { animation-delay: calc(var(--lz-ai-agent-action-duration) / 6); }
.front-ai-agent-action-thinking > b i:nth-child(3) { animation-delay: calc(var(--lz-ai-agent-action-duration) / 3); }
.front-ai-agent-action-dialog > [data-agent-action-content][data-agent-action-state="success"] { overflow: hidden; }
.front-ai-agent-action-success {
  min-width: 0;
  min-height: 0;
  max-height: var(--lz-ai-agent-action-max-height);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.front-ai-agent-action-header {
  display: flex;
  align-items: center;
  gap: var(--lz-ai-agent-action-header-gap);
  padding: var(--lz-ai-agent-action-header-padding);
  border-bottom: var(--lz-border-width) solid var(--lz-ai-agent-action-border);
}
.front-ai-agent-action-header .front-ai-agent-action-avatar {
  width: var(--lz-ai-agent-action-header-avatar-size);
  height: var(--lz-ai-agent-action-header-avatar-size);
}
.front-ai-agent-action-header strong { min-width: 0; overflow: hidden; font-size: var(--lz-ai-agent-action-title-size); text-overflow: ellipsis; white-space: nowrap; }
.front-ai-agent-action-results {
  min-height: 0;
  display: grid;
  gap: var(--lz-ai-agent-action-section-gap);
  align-content: start;
  padding: var(--lz-ai-agent-action-results-padding);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.front-ai-agent-action-prompt-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: var(--lz-ai-agent-action-prompt-grid-columns);
  gap: var(--lz-ai-agent-action-section-gap);
  align-items: stretch;
}
.front-ai-agent-action-card {
  min-width: 0;
  padding: var(--lz-ai-agent-action-card-padding);
  border: var(--lz-border-width) solid var(--lz-ai-agent-action-card-border);
  border-radius: var(--lz-ai-agent-action-card-radius);
  background: var(--lz-ai-agent-action-card-bg);
}
.front-ai-agent-action-card header { display: flex; align-items: center; justify-content: space-between; gap: var(--lz-ai-agent-action-gap); margin-bottom: var(--lz-space-3); }
.front-ai-agent-action-card header strong { display: inline-flex; align-items: center; gap: var(--lz-space-2); font-size: var(--lz-ai-agent-action-body-size); }
.front-ai-agent-action-card header button,
.front-ai-agent-action-footer button { display: inline-flex; align-items: center; justify-content: center; gap: var(--lz-space-2); cursor: pointer; }
.front-ai-agent-action-card header button {
  min-width: var(--lz-ai-agent-action-copy-min-width);
  height: var(--lz-ai-agent-action-copy-height);
  padding: var(--lz-ai-agent-action-copy-padding);
  color: var(--lz-ai-agent-action-copy-color);
  border: var(--lz-border-width) solid var(--lz-ai-agent-action-copy-border);
  border-radius: var(--lz-ai-agent-action-button-radius);
  background: var(--lz-ai-agent-action-copy-bg);
  font-size: var(--lz-ai-agent-action-copy-size);
}
.front-ai-agent-action-card header button:hover,
.front-ai-agent-action-card header button:focus-visible { color: var(--lz-ai-agent-action-text); background: var(--lz-ai-agent-action-copy-hover-bg); outline: none; }
.front-ai-agent-action-button-icon { width: var(--lz-ai-agent-action-icon-size); height: var(--lz-ai-agent-action-icon-size); fill: none; stroke: currentColor; stroke-width: var(--lz-ai-agent-action-icon-stroke); stroke-linecap: round; stroke-linejoin: round; }
.front-ai-agent-action-card p { margin: 0; color: var(--lz-ai-agent-action-text); font-size: var(--lz-ai-agent-action-body-size); line-height: var(--lz-line-height-relaxed); overflow-wrap: anywhere; white-space: pre-wrap; }
.front-ai-agent-action-reply-card p { max-height: var(--lz-ai-agent-action-result-max-height); overflow: auto; scrollbar-width: thin; }
.front-ai-agent-action-prompt-card {
  min-height: var(--lz-ai-agent-action-prompt-card-min-height);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  background: var(--lz-ai-agent-action-prompt-card-bg);
}
.front-ai-agent-action-prompt-text { max-height: var(--lz-ai-agent-action-prompt-max-height); overflow: auto; scrollbar-width: thin; }
.front-ai-agent-action-use {
  width: 100%;
  height: var(--lz-ai-agent-action-button-height);
  margin-top: var(--lz-space-3);
  padding: var(--lz-ai-agent-action-button-padding);
  color: var(--lz-ai-agent-action-use-color);
  border: 0;
  border-radius: var(--lz-ai-agent-action-button-radius);
  background: var(--lz-ai-agent-action-use-bg);
  box-shadow: var(--lz-ai-agent-action-use-shadow);
  font-size: var(--lz-ai-agent-action-body-size);
  font-weight: var(--lz-font-weight-semibold);
  cursor: pointer;
}
.front-ai-agent-action-use:hover,
.front-ai-agent-action-use:focus-visible { background: var(--lz-ai-agent-action-use-hover-bg); outline: none; }
.front-ai-agent-action-prompt-card:hover { border-color: var(--lz-ai-agent-action-card-hover-border); }
.front-ai-agent-action-footer {
  display: flex;
  justify-content: flex-end;
  padding: var(--lz-ai-agent-action-footer-padding);
  border-top: var(--lz-border-width) solid var(--lz-ai-agent-action-border);
  background: var(--lz-ai-agent-action-footer-bg);
}
.front-ai-agent-action-footer button {
  height: var(--lz-ai-agent-action-button-height);
  padding: var(--lz-ai-agent-action-button-padding);
  color: var(--lz-ai-agent-action-regenerate-color);
  border: var(--lz-border-width) solid var(--lz-ai-agent-action-regenerate-border);
  border-radius: var(--lz-ai-agent-action-button-radius);
  background: var(--lz-ai-agent-action-regenerate-bg);
  font-size: var(--lz-ai-agent-action-body-size);
}
.front-ai-agent-action-footer button:hover,
.front-ai-agent-action-footer button:focus-visible { color: var(--lz-ai-agent-action-text); background: var(--lz-ai-agent-action-regenerate-hover-bg); outline: none; }
.front-ai-agent-action-error button {
  height: var(--lz-ai-agent-action-button-height);
  padding: var(--lz-ai-agent-action-button-padding);
  color: var(--lz-color-surface);
  border: 0;
  border-radius: var(--lz-ai-agent-action-button-radius);
  background: var(--lz-role-accent);
  font-size: var(--lz-ai-agent-action-body-size);
  cursor: pointer;
}
.front-ai-agent-action-error > span {
  width: var(--lz-ai-agent-action-avatar-size);
  height: var(--lz-ai-agent-action-avatar-size);
  display: grid;
  place-items: center;
  color: var(--lz-color-danger);
  border-radius: var(--lz-radius-pill);
  background: color-mix(in srgb, var(--lz-color-danger) 12%, transparent);
  font-size: var(--lz-ai-agent-action-title-size);
  font-weight: var(--lz-font-weight-bold);
}
.front-ai-agent-role-tooltip {
  position: fixed;
  z-index: var(--lz-ai-agent-tooltip-layer);
  max-width: min(var(--lz-ai-agent-tooltip-max-width), calc(100vw - var(--lz-ai-agent-action-gap) * 2));
  display: grid;
  gap: var(--lz-space-1);
  padding: var(--lz-ai-agent-tooltip-padding);
  color: var(--lz-ai-agent-tooltip-text);
  border-radius: var(--lz-ai-agent-tooltip-radius);
  background: var(--lz-ai-agent-tooltip-bg);
  box-shadow: var(--lz-ai-agent-tooltip-shadow);
  pointer-events: none;
}
.front-ai-agent-role-tooltip[hidden] { display: none; }
.front-ai-agent-role-tooltip strong { overflow: hidden; font-size: var(--lz-ai-agent-tooltip-title-size); font-weight: var(--lz-font-weight-semibold); text-overflow: ellipsis; white-space: nowrap; }
.front-ai-agent-role-tooltip span {
  display: -webkit-box;
  overflow: hidden;
  color: var(--lz-ai-agent-tooltip-muted);
  font-size: var(--lz-ai-agent-tooltip-copy-size);
  line-height: var(--lz-ai-agent-tooltip-copy-line);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
@keyframes front-ai-agent-thinking { 0%, 60%, 100% { translate: 0 0; opacity: .45; } 30% { translate: 0 var(--lz-ai-agent-action-dot-offset); opacity: 1; } }
@media (max-width: 640px) {
  .front-ai-agent-action-layer {
    padding: max(var(--lz-ai-agent-action-mobile-gutter), var(--lz-safe-top)) max(var(--lz-ai-agent-action-mobile-gutter), var(--lz-safe-right)) max(var(--lz-ai-agent-action-mobile-gutter), var(--lz-safe-bottom)) max(var(--lz-ai-agent-action-mobile-gutter), var(--lz-safe-left));
  }
  .front-ai-agent-action-dialog { width: 100%; max-height: min(var(--lz-ai-agent-action-max-height), var(--lz-ai-agent-action-mobile-max-height), 100%); }
  .front-ai-agent-action-header { padding-right: calc(var(--lz-ai-agent-action-close-size) + var(--lz-space-6)); }
  .front-ai-agent-action-results { padding: var(--lz-space-4); }
  .front-ai-agent-action-prompt-grid { grid-template-columns: minmax(0, 1fr); }
  .front-ai-agent-action-prompt-card { min-height: 0; }
  .front-ai-agent-action-reply-card p,
  .front-ai-agent-action-prompt-text { max-height: none; overflow: visible; }
  .front-ai-agent-action-footer { padding: var(--lz-space-3) var(--lz-space-4) var(--lz-space-4); }
}

html.jn-light-mode body.page-app:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) :is(.ai-draw-preview-modal, .ai-draw-dialog),
body.page-app.jn-light-mode:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) :is(.ai-draw-preview-modal, .ai-draw-dialog) {
  background: none rgba(248, 250, 252, .88);
  color: rgb(15, 23, 42);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

html.jn-light-mode body.page-app:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) :is(.ai-draw-preview-panel, .ai-draw-dialog-panel),
body.page-app.jn-light-mode:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) :is(.ai-draw-preview-panel, .ai-draw-dialog-panel) {
  background: none rgb(255, 255, 255);
  border: 1px solid rgba(15, 23, 42, .12);
  color: rgb(15, 23, 42);
  box-shadow: rgba(15, 23, 42, .16) 0 26px 80px;
  color-scheme: light;
}

html.jn-light-mode body.page-app:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) :is(.ai-draw-preview-close, .ai-draw-preview-zoom button, .ai-draw-preview-zoom span, .ai-draw-dialog-head button, .ai-draw-dialog-cancel),
body.page-app.jn-light-mode:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) :is(.ai-draw-preview-close, .ai-draw-preview-zoom button, .ai-draw-preview-zoom span, .ai-draw-dialog-head button, .ai-draw-dialog-cancel) {
  background: none rgb(238, 242, 247);
  border-color: rgba(15, 23, 42, .12);
  color: rgb(15, 23, 42);
  -webkit-text-fill-color: rgb(15, 23, 42);
  box-shadow: none;
}

html.jn-light-mode body.page-app:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) .ai-draw-dialog-head,
body.page-app.jn-light-mode:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) .ai-draw-dialog-head {
  background: rgb(255, 255, 255);
  border-color: rgba(15, 23, 42, .10);
}

html.jn-light-mode body.page-app:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) .ai-draw-dialog-body :is(h3, p, span),
body.page-app.jn-light-mode:not(#jnDrawPreviewLightA):not(#jnDrawPreviewLightB) .ai-draw-dialog-body :is(h3, p, span) {
  color: rgb(15, 23, 42);
  -webkit-text-fill-color: rgb(15, 23, 42);
}

html.jn-light-mode body.page-app:not(#jnDrawActionToastA):not(#jnDrawActionToastB) :is(.ai-draw-dialog-confirm, .ai-draw-dialog-confirm:not(.is-danger)),
body.page-app.jn-light-mode:not(#jnDrawActionToastA):not(#jnDrawActionToastB) :is(.ai-draw-dialog-confirm, .ai-draw-dialog-confirm:not(.is-danger)) {
  background: rgb(37, 99, 235);
  border-color: rgb(37, 99, 235);
  color: rgb(255, 255, 255);
  -webkit-text-fill-color: rgb(255, 255, 255);
  box-shadow: rgba(37, 99, 235, .22) 0 10px 24px;
}

html.jn-light-mode body.page-app:not(#jnDrawActionToastA):not(#jnDrawActionToastB) .ai-draw-dialog-input,
body.page-app.jn-light-mode:not(#jnDrawActionToastA):not(#jnDrawActionToastB) .ai-draw-dialog-input {
  background: rgb(248, 250, 252);
  border-color: rgba(15, 23, 42, .14);
  color: rgb(15, 23, 42);
  -webkit-text-fill-color: rgb(15, 23, 42);
  box-shadow: none;
}

html.jn-light-mode body.page-app:not(#jnDrawActionToastA):not(#jnDrawActionToastB) .ai-draw-dialog-input::placeholder,
body.page-app.jn-light-mode:not(#jnDrawActionToastA):not(#jnDrawActionToastB) .ai-draw-dialog-input::placeholder {
  color: rgb(100, 116, 139);
  -webkit-text-fill-color: rgb(100, 116, 139);
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog,
body.page-app:not(.jn-light-mode) .ai-draw-dialog,
html:not(.jn-light-mode) body.page-app #mainArea .ai-draw-dialog,
body.page-app:not(.jn-light-mode) #mainArea .ai-draw-dialog {
  background: none rgba(0, 0, 0, .18);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-panel,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-panel,
html:not(.jn-light-mode) body.page-app #mainArea .ai-draw-dialog .ai-draw-dialog-panel,
body.page-app:not(.jn-light-mode) #mainArea .ai-draw-dialog .ai-draw-dialog-panel {
  background: none rgba(18, 18, 20, .92);
  border: 1px solid rgba(255, 255, 255, .16);
  color: rgb(248, 250, 252);
  -webkit-text-fill-color: rgb(248, 250, 252);
  box-shadow: rgba(0, 0, 0, .36) 0 26px 80px;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-head,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-head {
  background: transparent;
  border-color: rgba(255, 255, 255, .10);
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-body h3,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-body h3,
html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-head span,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-head span {
  color: rgb(248, 250, 252);
  -webkit-text-fill-color: rgb(248, 250, 252);
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-body p,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-body p {
  color: rgb(212, 212, 216);
  -webkit-text-fill-color: rgb(212, 212, 216);
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-cancel,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-cancel,
html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-head button,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-head button {
  background: none rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .16);
  color: rgb(244, 244, 245);
  -webkit-text-fill-color: rgb(244, 244, 245);
  box-shadow: none;
}

html:not(.jn-light-mode) body.page-app .ai-draw-dialog .ai-draw-dialog-confirm,
body.page-app:not(.jn-light-mode) .ai-draw-dialog .ai-draw-dialog-confirm {
  background: none rgba(250, 204, 21, .18);
  border-color: rgba(250, 204, 21, .32);
  color: rgb(253, 230, 138);
  -webkit-text-fill-color: rgb(253, 230, 138);
  box-shadow: none;
}

body.page-app .ai-draw-reference-scan-modal {
  position: fixed;
  inset: 0;
  z-index: 100200;
  display: grid;
  place-items: center;
  width: auto;
  height: auto;
  margin: 0;
  padding: 18px;
  overflow: auto;
  background: rgba(12, 14, 18, .52);
  background-image: none;
  box-sizing: border-box;
}

body.page-app .ai-draw-reference-scan-card {
  position: relative;
  width: min(360px, calc(100vw - 28px));
  height: auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
  display: block;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 8px;
  background: rgb(24, 26, 32);
  color: rgb(245, 247, 251);
  box-shadow: 0 26px 82px rgba(0, 0, 0, .46);
  overflow: hidden;
}

body.page-app .ai-draw-reference-scan-head,
body.page-app .ai-draw-reference-scan-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 14px;
  border-bottom: 1px solid rgba(255, 255, 255, .09);
}

body.page-app .ai-draw-reference-scan-foot {
  border-top: 1px solid rgba(255, 255, 255, .08);
  border-bottom: 1px solid rgba(255, 255, 255, .09);
}

body.page-app .ai-draw-reference-scan-head strong {
  font-size: 15px;
  font-weight: 850;
}

body.page-app .ai-draw-reference-scan-close {
  width: 30px;
  min-width: 30px;
  height: 30px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 8px;
  background: rgba(255, 255, 255, .06);
  color: #f8fafc;
  cursor: pointer;
}

body.page-app .ai-draw-reference-scan-body {
  display: grid;
  gap: 12px;
  justify-items: center;
  padding: 18px 16px 16px;
}

body.page-app .ai-draw-reference-qr {
  width: 214px;
  height: 214px;
  display: grid;
  place-items: center;
  padding: 10px;
  border-radius: 8px;
  background: #fff;
  box-sizing: border-box;
}

body.page-app .ai-draw-reference-qr img {
  width: 100%;
  height: 100%;
  display: block;
}

body.page-app .ai-draw-reference-scan-tip {
  margin: 0;
  color: rgba(238, 239, 242, .82);
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

body.page-app .ai-draw-reference-scan-url {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 8px;
  background: rgba(255, 255, 255, .04);
  color: rgba(232, 234, 238, .76);
  padding: 9px 10px;
  font-size: 11px;
}

body.page-app .ai-draw-reference-scan-status {
  color: rgba(238, 239, 242, .78);
  font-size: 12px;
  font-weight: 600;
}

html.jn-light-mode body.page-app .ai-draw-reference-scan-modal,
body.page-app.jn-light-mode .ai-draw-reference-scan-modal {
  background: rgba(31, 35, 42, .24);
}

html.jn-light-mode body.page-app .ai-draw-reference-scan-card,
body.page-app.jn-light-mode .ai-draw-reference-scan-card {
  background: #f7f8fa;
  color: #20242b;
  border-color: rgba(31, 35, 42, .14);
  box-shadow: 0 24px 60px rgba(20, 24, 31, .16);
}

html.jn-light-mode body.page-app :is(.ai-draw-reference-scan-head, .ai-draw-reference-scan-foot),
body.page-app.jn-light-mode :is(.ai-draw-reference-scan-head, .ai-draw-reference-scan-foot) {
  border-color: rgba(15, 23, 42, .10);
}

html.jn-light-mode body.page-app .ai-draw-reference-scan-close,
body.page-app.jn-light-mode .ai-draw-reference-scan-close {
  background: #f8fafc;
  border-color: rgba(15, 23, 42, .12);
  color: #0f172a;
}

html.jn-light-mode body.page-app :is(.ai-draw-reference-scan-tip, .ai-draw-reference-scan-status),
body.page-app.jn-light-mode :is(.ai-draw-reference-scan-tip, .ai-draw-reference-scan-status) {
  color: #565b64;
}

html.jn-light-mode body.page-app .ai-draw-reference-scan-url,
body.page-app.jn-light-mode .ai-draw-reference-scan-url {
  background: #f8fafc;
  border-color: rgba(15, 23, 42, .12);
  color: #666c75;
}

@media (max-width: 860px) {
  body.page-app .ai-draw-reference-scan-modal {
    padding: 12px;
  }

  body.page-app .ai-draw-reference-scan-card {
    width: min(330px, calc(100vw - 24px));
    max-height: calc(100dvh - 24px);
    border-radius: 10px;
    overflow: auto;
    overscroll-behavior: contain;
  }

  body.page-app .ai-draw-reference-scan-body {
    gap: 10px;
    padding: 14px 14px 13px;
  }

  body.page-app .ai-draw-reference-qr {
    width: 188px;
    height: 188px;
    min-width: 188px;
    min-height: 188px;
    max-width: 188px;
    max-height: 188px;
    flex: 0 0 188px;
  }

  body.page-app .ai-draw-reference-qr img {
    width: 168px;
    height: 168px;
    min-width: 168px;
    min-height: 168px;
    max-width: 168px;
    max-height: 168px;
    object-fit: contain;
  }
}

body.page-app .ai-draw-preview-modal {
  overflow: hidden;
}

body.page-app .ai-draw-preview-close {
  z-index: 6;
  width: 36px;
  height: 36px;
  min-width: 34px;
  min-height: 34px;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-zoom {
  position: absolute;
  z-index: 8;
  width: 1px;
  height: 1px;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: normal;
  gap: 8px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(20, 20, 20, .88);
  color: #fff;
  opacity: 0;
  pointer-events: none;
  overflow: hidden;
}

body.page-app .ai-draw-preview-zoom button,
body.page-app .ai-draw-preview-zoom span {
  height: 30px;
  min-width: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 999px;
  background: #222;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}

body.page-app .ai-draw-preview-zoom span {
  min-width: 58px;
  background: transparent;
  border-color: transparent;
  color: #cfcfcf;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools {
  min-height: 34px;
  border-color: transparent;
}

html.jn-light-mode body.page-app:not(.page-admin) .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button,
body.jn-light-mode.page-app:not(.page-admin) .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button {
  background: rgba(255, 255, 255, .78);
  background-image: none;
  border: 1px solid rgba(15, 23, 42, .14);
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .12);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html.jn-light-mode body.page-app:not(.page-admin) .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button.ai-draw-share-plaza,
body.jn-light-mode.page-app:not(.page-admin) .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button.ai-draw-share-plaza {
  background: rgba(255, 251, 235, .84);
  border-color: rgba(245, 158, 11, .26);
  color: #92400e;
  -webkit-text-fill-color: #92400e;
}

@media (max-width: 700px) {
  body.page-app .ai-draw-preview-modal .ai-draw-preview-zoom {
    gap: 5px;
    max-width: calc(100vw - 82px);
  }

  body.page-app .ai-draw-preview-zoom button,
  body.page-app .ai-draw-preview-zoom span {
    min-width: 30px;
    height: 28px;
    padding: 0 8px;
    font-size: 12px;
  }
}

body.page-app.front-creative-page:not(.jn-light-mode):not([data-theme="light"]):not(.page-admin) .ai-draw-preview-modal.is-open,
html:not(.jn-light-mode):not([data-theme="light"]) body.page-app.front-creative-page:not(.jn-light-mode):not(.page-admin) .ai-draw-preview-modal.is-open {
  background: rgba(0, 0, 0, .88);
}

html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) .ai-draw-preview-modal.is-open,
html[data-theme="light"] body.page-app.front-creative-page:not(.page-admin) .ai-draw-preview-modal.is-open,
body.page-app.front-creative-page.jn-light-mode:not(.page-admin) .ai-draw-preview-modal.is-open,
body.page-app.front-creative-page[data-theme="light"]:not(.page-admin) .ai-draw-preview-modal.is-open {
  background: rgba(248, 250, 252, .88);
}

html.jn-light-mode body.page-app.front-creative-page:not(#jnDrawPreviewParityA):not(#jnDrawPreviewParityB):not(#jnDrawPreviewParityC):not(.page-admin) .ai-draw-preview-modal.is-open,
html[data-theme="light"] body.page-app.front-creative-page:not(#jnDrawPreviewParityA):not(#jnDrawPreviewParityB):not(#jnDrawPreviewParityC):not(.page-admin) .ai-draw-preview-modal.is-open,
body.page-app.front-creative-page.jn-light-mode:not(#jnDrawPreviewParityA):not(#jnDrawPreviewParityB):not(#jnDrawPreviewParityC):not(.page-admin) .ai-draw-preview-modal.is-open,
body.page-app.front-creative-page[data-theme="light"]:not(#jnDrawPreviewParityA):not(#jnDrawPreviewParityB):not(#jnDrawPreviewParityC):not(.page-admin) .ai-draw-preview-modal.is-open {
  background: rgba(248, 250, 252, .88);
}

@media (max-width: 860px) {
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page {
    display: grid;
    grid-template-rows: 0 minmax(0, 1fr);
    gap: 0;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-conversation {
    max-width: 100%;
    max-height: 100dvh;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-stream {
    align-items: flex-start;
    gap: 16px;
    padding-bottom: 8px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-top-spacer {
    height: 1px;
    min-height: 0;
    max-height: 1px;
    flex: 0 0 1px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-bottom-spacer {
    height: calc(var(--composer-safe, 190px) + 72px);
    min-height: calc(var(--composer-safe, 190px) + 72px);
    flex: 0 0 calc(var(--composer-safe, 190px) + 72px);
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-result-prompt {
    grid-template-columns: 1fr;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-batch-shell {
    min-height: auto;
    position: static;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt {
    width: 100%;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item {
    min-height: 0;
    flex-direction: column;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-tags {
    gap: 6px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-result-image {
    min-width: 0;
    min-height: 0;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-result-actions {
    width: min(190px, 100%);
    max-width: 190px;
    gap: 4px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item time {
    min-height: 14px;
    margin: 1px 0 0;
    line-height: 14px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) {
    min-height: 0;
    align-self: flex-start;
    flex-direction: column;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message {
    align-self: flex-start;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-user-prompt {
    max-width: 100%;
    color: #28282d;
    border-color: #28282d;
  }

  html[data-theme='dark'] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-user-prompt {
    color: #e8e8eb;
    border-color: #e8e8eb;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-result-prompt .ai-draw-prompt-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-result-prompt .ai-draw-prompt-actions button {
    border: 0;
    border-radius: 0;
    background: transparent;
    background-image: none;
    box-shadow: none;
    flex-shrink: 0;
    transition: color .16s ease, transform .16s ease;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-prompt .ai-draw-prompt-actions button {
    flex: 1 1 0;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
  }

  html:is(.jn-light-mode,[data-theme='light']) body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-result-prompt .ai-draw-prompt-actions button,
  body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page .ai-draw-result-prompt .ai-draw-prompt-actions button {
    border: 0;
    background: transparent;
    border-color: #0f172a;
    color: #0f172a;
    -webkit-text-fill-color: #0f172a;
    box-shadow: none;
  }

  html:is(.jn-light-mode,[data-theme='light']) body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-result-prompt .ai-draw-prompt-actions button > svg,
  body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page .ai-draw-result-prompt .ai-draw-prompt-actions button > svg {
    color: #0f172a;
    border-color: #0f172a;
    stroke: #0f172a;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
    width: min(var(--draw-result-card-size, 182px), 100%);
    max-width: min(var(--draw-result-card-size, 182px), 100%);
    height: auto;
    min-height: 0;
    max-height: 100%;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto 28px;
    gap: 6px;
    align-self: flex-start;
    align-content: normal;
    flex-direction: column;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card {
    align-content: normal;
    flex-direction: column;
  }

  html body.page-app.front-creative-page.has-front-creative-menu:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: 1 / 1;
    flex: 0 0 auto;
    background: var(--front-video-chat-bg) padding-box padding-box;
    cursor: zoom-in;
  }

  html[data-theme='light'] body.page-app.front-creative-page.has-front-creative-menu:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] {
    background: var(--front-video-chat-bg) padding-box padding-box;
    background-clip: padding-box;
  }

  html[data-theme='dark'] body.page-app.front-creative-page.has-front-creative-menu:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] {
    background: var(--front-video-chat-bg) padding-box border-box;
    background-clip: border-box;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] > img {
    position: relative;
    inset: 0;
    align-items: center;
    justify-items: center;
    cursor: zoom-in;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] > img {
    align-items: center;
    justify-items: center;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-image-tools {
    cursor: zoom-in;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card > .ai-draw-result-actions {
    width: 100%;
    max-width: 100%;
    height: 28px;
    display: flex;
    gap: 6px;
    flex: 0 0 auto;
    z-index: 2;
  }

  html:is(.jn-light-mode,[data-theme='light']) body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-image-tools > button:not(.ai-draw-share-plaza),
  body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-image-tools > button:not(.ai-draw-share-plaza) {
    background: rgba(255, 255, 255, .84);
    border-color: rgba(15, 23, 42, .14);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
  }

  html:is(.jn-light-mode,[data-theme='light']) body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-image-tools > button.ai-draw-share-plaza,
  body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-image-tools > button.ai-draw-share-plaza {
    background: rgba(255, 251, 235, .88);
    border-color: rgba(245, 158, 11, .28);
    color: #92400e;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-success-time {
    left: 0;
    bottom: 6px;
    color: #77777e;
    border-color: #77777e;
  }

  html[data-theme='dark'] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-success-time {
    color: #929297;
    border-color: #929297;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block[data-status='failed']:not(.is-batch-item) > .ai-draw-result-card {
    height: auto;
    grid-template-rows: 172px auto 28px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block[data-status='failed']:not(.is-batch-item) > .ai-draw-result-card > .ai-draw-result-status {
    height: auto;
    min-height: 18px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'].ai-draw-composer {
    width: 100vw;
    max-width: 100vw;
    height: calc(238px + env(safe-area-inset-bottom, 0px));
    min-height: calc(238px + env(safe-area-inset-bottom, 0px));
    max-height: calc(238px + env(safe-area-inset-bottom, 0px));
    padding: 0 10px calc(10px + env(safe-area-inset-bottom, 0px));
    overflow: visible;
    grid-template-rows: 34px auto auto;
    align-content: start;
    justify-items: center;
    background-image: linear-gradient(rgba(247, 248, 251, 0), #f7f8fb 34%, #f7f8fb 100%);
  }

  html[data-theme='dark'] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'].ai-draw-composer {
    background-image: linear-gradient(rgba(27, 28, 32, 0), #1b1c20 34%, #1b1c20 100%);
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'].ai-draw-composer.is-scroll-collapsed {
    height: 88px;
    min-height: 88px;
    max-height: 88px;
    overflow: visible;
    background: transparent;
    background-image: none;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-draw-select] > [data-select-options] > .front-param-option {
    overflow: hidden;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-inner {
    display: grid;
    width: 100%;
    height: 190px;
    min-height: 190px;
    max-height: 190px;
    grid-template-columns: 78px minmax(0, 1fr);
    grid-template-rows: 62px 40px;
    gap: 8px 10px;
    padding: 16px 12px 62px;
    overflow: hidden;
    z-index: 90;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-left-image {
    width: 78px;
    height: 62px;
    transform: none;
    transform-origin: center center;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-main-image {
    width: auto;
    height: 62px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-image-prompt.ai-video-prompt-panel,
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-image-prompt.ai-video-prompt-wrap {
    height: 62px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] #aiDrawPrompt.front-chat-input {
    font-size: 14px;
    line-height: 1.5;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .ai-draw-inner-controls {
    flex-direction: column;
    grid-template-columns: minmax(0, 1fr) 40px;
    grid-template-rows: 34px 34px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .ai-draw-selects {
    position: absolute;
    inset: 0 56px 0 5px;
    z-index: 2147482300;
    flex: 1 1 auto;
    align-self: end;
    grid-column: 1;
    grid-row: 1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .ai-draw-selects > [data-front-param-select] > [data-select-trigger] > .front-param-value {
    font-size: 10px;
    line-height: 1;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-tools {
    grid-template-columns: 1fr auto auto;
    flex-wrap: wrap;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-tools > .front-creative-tool-chip.ai-video-clear-chip {
    height: 30px;
    min-height: 30px;
    max-height: 30px;
  }

  html:not(.jn-light-mode):not([data-theme='light']) body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-tools > .front-creative-tool-chip.ai-video-clear-chip {
    height: 32px;
    min-height: 32px;
    max-height: 32px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-composer-tools > .front-creative-billing-pill.ai-video-price-pill {
    height: 34px;
    min-height: 34px;
    max-height: 34px;
    padding-left: 12px;
    padding-right: 12px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .front-creative-send {
    cursor: pointer;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] .ai-draw-selects > [data-front-param-select].is-portal-open {
    z-index: 2147483600;
  }

  html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] [data-front-param-select].is-portal-open > [data-select-trigger],
  html[data-theme='light'] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] [data-front-param-select].is-portal-open > [data-select-trigger],
  html body.page-app.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer='image'] [data-front-param-select].is-portal-open > [data-select-trigger] {
    border-color: rgba(15, 23, 42, 0.12);
  }

  html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param='model'] .front-chat-model-copy {
    text-overflow: clip;
    white-space: normal;
  }

  html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover .front-param-option.is-selected::after {
    font-weight: 900;
  }

  html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover .front-param-check {
    justify-items: normal;
  }

  html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param='size'] .front-param-option-icon {
    flex: 0 0 auto;
  }

  html body.page-app.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param='count'] .front-param-custom-count input {
    font-size: 13px;
  }
}

@media (max-width: 560px) {
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-icon {
    width: 28px;
    height: 28px;
    flex-basis: 28px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-icon svg {
    width: 15px;
    height: 15px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-title {
    font-size: 12px;
    line-height: 17px;
  }

  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-hint {
    display: none;
  }
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block {
  width: min(432px, 100%);
  max-width: 100%;
  display: grid;
  gap: 10px;
  align-self: flex-start;
  margin-left: 0;
  margin-right: auto;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item {
  position: static;
  transform: none;
  max-width: none;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card {
  border: 0;
  border-radius: 0;
  position: relative;
  inset: 0;
  max-height: 100%;
  min-height: 0;
  max-width: none;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-user-message,
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-user-message,
body.page-app.front-creative-page .ai-draw-page .ai-draw-result-card {
  width: min(432px, 100%);
  max-width: min(432px, 100%);
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 16px;
  background: var(--front-video-chat-bg);
  color: #f4f4f5;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18);
  overflow: hidden;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-result-card {
  padding: 0;
  display: grid;
  gap: 8px;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
  width: min(var(--draw-result-card-size, 182px), 100%);
  max-width: min(var(--draw-result-card-size, 182px), 100%);
  grid-template-columns: minmax(0, 1fr);
}

html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-user-message,
html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-result-card,
html[data-theme="light"] body.page-app.front-creative-page .ai-draw-page .ai-draw-user-message,
html[data-theme="light"] body.page-app.front-creative-page .ai-draw-page .ai-draw-result-card,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-user-message,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-result-card {
  border-color: rgba(15, 23, 42, .10);
  background: var(--front-video-chat-bg);
  color: #0f172a;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .08);
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item),
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) {
  width: min(var(--draw-result-row-width, 432px), calc(100vw - 24px));
  max-width: min(var(--draw-result-row-width, 432px), calc(100vw - 24px));
  gap: 6px;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message {
  width: min(var(--draw-result-row-width, 100%), calc(100vw - 24px));
  max-width: none;
  padding: 0;
  background: transparent;
  background-image: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
  width: min(var(--draw-result-card-size, 182px), 100%);
  max-width: min(var(--draw-result-card-size, 182px), 100%);
  gap: 6px;
  padding: 0;
  background: transparent;
  background-image: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}

html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options]:not(.front-param-portal):not(.is-open),
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options]:not(.front-param-portal):not(.is-open) {
  display: none;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  box-shadow: none;
  min-width: 112px;
  color: #475569;
}

html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options]:not(.front-param-portal):not(.is-open),
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options]:not(.front-param-portal):not(.is-open),
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-options[data-select-options]:not(.front-param-portal):not(.is-open) {
  background: #f8fafc;
}

html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="model"]:not(.front-param-portal),
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="model"]:not(.front-param-portal) {
  width: min(260px, calc(100vw - 18px));
  min-width: 112px;
  max-width: min(260px, calc(100vw - 18px));
}

html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="count"]:not(.front-param-portal),
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="count"]:not(.front-param-portal) {
  width: 198px;
  min-width: 112px;
  max-width: min(198px, calc(100vw - 18px));
  grid-template-columns: 1fr;
}

html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="size"]:not(.front-param-portal),
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="size"]:not(.front-param-portal) {
  width: 206px;
  min-width: 112px;
  max-width: min(206px, calc(100vw - 18px));
  grid-template-columns: 1fr;
}

html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="quality"]:not(.front-param-portal),
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options][data-param="quality"]:not(.front-param-portal) {
  width: 176px;
  min-width: 112px;
  max-width: min(176px, calc(100vw - 18px));
  grid-template-columns: 1fr;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-user-message,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-user-message {
  align-self: flex-start;
  margin: 0 auto 0 0;
  width: 100%;
  max-width: 560px;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message,
body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message {
  width: min(var(--draw-result-row-width, 100%), calc(100vw - 24px));
  max-width: none;
  background: transparent;
  background-image: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-prompt-box,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-prompt-box {
  align-items: normal;
  border: 0;
  border-radius: 0;
  gap: 8px;
  grid-template-columns: none;
  width: auto;
  min-width: 0;
  max-width: none;
  min-height: 0;
  padding: 0;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt {
  display: block;
  font-size: 14px;
  font-weight: 400;
  line-height: 21.7px;
  max-height: none;
  max-width: 100%;
  overflow: visible;
  white-space: pre-wrap;
}

html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt,
html[data-theme="light"] body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt {
  color: #0f172a;
}

html.jn-light-mode body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-conversation .ai-draw-stream .ai-draw-message-block.is-batch-item .ai-draw-user-message .ai-draw-prompt-box .ai-draw-user-prompt,
html[data-theme="light"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-conversation .ai-draw-stream .ai-draw-message-block.is-batch-item .ai-draw-user-message .ai-draw-prompt-box .ai-draw-user-prompt,
body.page-app.front-creative-page.jn-light-mode #mainArea .ai-draw-page .ai-draw-conversation .ai-draw-stream .ai-draw-message-block.is-batch-item .ai-draw-user-message .ai-draw-prompt-box .ai-draw-user-prompt {
  color: #0f172a;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-prompt-actions,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-prompt-actions {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-tags,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-tags {
  gap: 8px;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card {
  align-self: flex-start;
}

html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card,
html[data-theme="light"] body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card {
  border-color: rgba(15, 23, 42, .10);
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-result-actions,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-result-actions {
  align-items: normal;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: auto 0 0;
  max-width: 100%;
  position: relative;
  width: 240px;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item time,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block.is-batch-item time {
  align-self: flex-end;
  font-size: 10px;
  font-weight: 400;
  line-height: 12px;
  padding: 0;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message,
html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
  align-self: flex-start;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-prompt-box,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-prompt-box {
  min-width: 0;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-prompt-box,
body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-prompt-box {
  min-width: 0;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-user-prompt,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-user-prompt {
  max-width: 100%;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
  max-height: 100%;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > img,
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > video,
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > canvas,
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > .ai-draw-generated-art,
body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > img,
body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > video,
body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > canvas,
body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > .ai-draw-generated-art {
  position: relative;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  max-width: 100%;
  max-height: 432px;
  object-fit: contain;
  object-position: center center;
  display: block;
  border-radius: 0;
  background: var(--front-video-chat-bg);
}

html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > img,
html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > video,
html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > canvas,
html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > .ai-draw-generated-art,
html[data-theme=light] body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > img,
html[data-theme=light] body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > video,
html[data-theme=light] body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > canvas,
html[data-theme=light] body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > .ai-draw-generated-art,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-result-image > img,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-result-image > video,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-result-image > canvas,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-result-image > .ai-draw-generated-art {
  background: #f1f5f9;
}

html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]),
html[data-theme=light] body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]),
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]) {
  color: #77777e;
  -webkit-text-fill-color: #77777e;
}

:is(html.jn-light-mode, html[data-theme=light]) body.page-app.front-creative-page:not(.page-admin) .ai-draw-page .ai-draw-stream .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] > .ai-draw-generated-art.is-error,
body.page-app.front-creative-page:is(.jn-light-mode, [data-theme=light]):not(.page-admin) .ai-draw-page .ai-draw-stream .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] > .ai-draw-generated-art.is-error {
  border-color: transparent;
  outline: 0;
  box-shadow: none;
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block {
  color: #f2f2f2;
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-user-message {
  background: var(--front-video-chat-bg);
  border-color: rgba(255, 255, 255, .12);
  color: #f7f8fb;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18);
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item > .ai-draw-result-card,
html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message,
html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
  background: transparent;
  border: 0;
  color: #f7f8fb;
  box-shadow: none;
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-result-image {
  background: var(--front-video-chat-bg);
  background-origin: padding-box;
  background-clip: border-box;
  border: 1px solid rgba(255, 255, 255, .08);
  color: #f7f8fb;
  box-shadow: 0 18px 42px rgba(0, 0, 0, .18);
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item .ai-draw-user-prompt {
  color: #f4f4f4;
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block .ai-draw-prompt-box,
html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block .ai-draw-prompt-actions,
html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block .ai-draw-tags,
html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block .ai-draw-result-actions {
  color: #f7f8fb;
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-message-block.is-batch-item time {
  color: #a0a0a0;
}

html[data-theme="dark"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-options[data-select-options] {
  background: #1f1f1f;
  border-color: rgba(255, 255, 255, .12);
  color: #f7f8fb;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .35);
}

html[data-theme="dark"] body.page-app.front-creative-page #mainArea [data-front-creative-composer="image"] .front-param-options[data-select-options]:not(.front-param-portal):not(.is-open) {
  color: #f7f8fb;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .35);
}
html.jn-light-mode body.page-app.front-creative-page:not(#jnDrawToolFinalA):not(#jnDrawToolFinalB):not(.page-admin) .ai-draw-preview-modal.is-open .ai-draw-preview-stage .ai-draw-image-tools > button[data-image-action],
body.page-app.front-creative-page.jn-light-mode:not(#jnDrawToolFinalA):not(#jnDrawToolFinalB):not(.page-admin) .ai-draw-preview-modal.is-open .ai-draw-preview-stage .ai-draw-image-tools > button[data-image-action] {
  background: rgba(255, 255, 255, .78);
  background-color: rgba(255, 255, 255, .78);
  background-image: none;
  border: 1px solid rgba(15, 23, 42, .14);
  border-color: rgba(15, 23, 42, .14);
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .12);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html.jn-light-mode body.page-app.front-creative-page:not(#jnDrawToolFinalA):not(#jnDrawToolFinalB):not(.page-admin) .ai-draw-preview-modal.is-open .ai-draw-preview-stage .ai-draw-image-tools > button.ai-draw-share-plaza[data-image-action],
body.page-app.front-creative-page.jn-light-mode:not(#jnDrawToolFinalA):not(#jnDrawToolFinalB):not(.page-admin) .ai-draw-preview-modal.is-open .ai-draw-preview-stage .ai-draw-image-tools > button.ai-draw-share-plaza[data-image-action] {
  background: rgba(255, 251, 235, .84);
  background-color: rgba(255, 251, 235, .84);
  border-color: rgba(245, 158, 11, .26);
  color: #92400e;
  -webkit-text-fill-color: #92400e;
}

@media (max-width: 700px) {
  body.page-app.front-creative-page .ai-draw-preview-modal.is-open .ai-draw-preview-zoom {
    left: -.5px;
  }
}

body.page-app.front-creative-page .ai-draw-preview-modal.is-open .ai-draw-preview-stage > .ai-action-toast.is-inside-image {
  z-index: 55;
}

@media (max-width: 860px) {
  body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-batch-shell .ai-draw-prompt-actions {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }
}

html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select:is(.is-select-open, .is-portal-open) > .front-param-trigger.ai-param-trigger,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select:is(.is-select-open, .is-portal-open) > .front-param-trigger.ai-param-trigger,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer="image"] .front-param-select:is(.is-select-open, .is-portal-open) > .front-param-trigger.ai-param-trigger {
  border-color: rgba(15, 23, 42, .12);
}

html:not(.jn-light-mode):not([data-theme="light"]) body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select:is(.is-select-open, .is-portal-open) > .front-param-trigger.ai-param-trigger {
  border-color: rgba(255, 255, 255, .17);
}

html:not(.jn-light-mode):not([data-theme="light"]) body.page-app.front-creative-page .front-param-portal.front-param-draw-popover:is([data-param="model"], [data-param="count"], [data-param="size"], [data-param="quality"]) {
  --draw-param-text: #f2f4f8;
  color: #f2f4f8;
}

/* Successful images enter the document only after decode; video frames keep their own visual-ready cover. */
html body.page-app.front-creative-page .ai-video-result-frame > .ai-video-status-card.is-video-media-loading {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: inherit;
  overflow: hidden;
}
@keyframes lz-workspace-media-pulse {
  0%,100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
html body.page-app.front-creative-page .ai-video-result-frame:not(.has-video-poster):not(.has-video-preview) {
  background: linear-gradient(115deg, #20242b 18%, #303640 36%, #20242b 54%);
  background-size: 220% 100%;
  animation: lz-workspace-media-pulse 1.35s ease-in-out infinite;
}
html body.page-app.front-creative-page .ai-video-result-frame:not(.has-video-poster):not(.has-video-preview) > video {
  opacity: 0 !important;
  visibility: hidden !important;
}
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image.is-media-ready > img,
html body.page-app.front-creative-page .ai-video-result-frame:is(.has-video-poster,.has-video-preview) > video {
  opacity: 1 !important;
  visibility: visible !important;
  transition: none;
}
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image:not(.is-media-ready) > .ai-draw-image-tools,
html body.page-app.front-creative-page .ai-video-result-frame:not(.has-video-poster):not(.has-video-preview) > :is(.ai-video-play,.ai-video-result-tools) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
html body.page-app.front-creative-page .ai-video-result-frame:is(.has-video-poster,.has-video-preview) > :is(.ai-video-play,.ai-video-result-tools) {
  visibility: visible;
}
html:is(.jn-light-mode,[data-theme="light"]) body.page-app.front-creative-page .ai-video-result-frame:not(.has-video-poster):not(.has-video-preview) {
  background: linear-gradient(115deg, #e8edf3 18%, #f7f9fc 36%, #e8edf3 54%);
  background-size: 220% 100%;
}
@media (prefers-reduced-motion: reduce) {
  html body.page-app.front-creative-page .ai-video-result-frame:not(.has-video-poster):not(.has-video-preview) { animation: none; }
}

/* Keep the image reference frame anchored while its asset button hangs over the upper-right edge. */
@media (min-width: 861px) {
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-left.front-creative-composer-left-image {
    left: var(--front-reference-left, 14px);
  }
}

body.page-gallery.front-creative-page .gallery-footer {
  display: none;
}
html:not(.jn-light-mode):not([data-theme="light"]) body.page-gallery.front-creative-page .gallery-toolbar,
html[data-theme="dark"] body.page-gallery.front-creative-page .gallery-toolbar,
body.page-gallery.front-creative-page:not(.jn-light-mode):not([data-theme="light"]) .gallery-toolbar {
  background: rgb(32, 35, 42);
  border-color: rgba(255, 255, 255, 0.12);
}
/* 104-gallery-workspace-parity-strong */
html[data-theme="dark"] body.page-gallery.front-creative-page #galleryLibraryPage .gallery-toolbar,
html.jn-theme-booting[data-theme="dark"] body.page-gallery.front-creative-page #galleryLibraryPage .gallery-toolbar,
html:not(.jn-light-mode):not([data-theme="light"]) body.page-gallery.front-creative-page #galleryLibraryPage .gallery-toolbar {
  background: rgb(32, 35, 42);
  border-color: rgba(255, 255, 255, 0.12);
}
/* 105-light-control-visual-parity */
html.jn-light-mode body.page-app.front-creative-page .front-param-select,
html[data-theme="light"] body.page-app.front-creative-page .front-param-select,
body.page-app.front-creative-page.jn-light-mode .front-param-select {
  color: rgb(71, 85, 105);
}
html.jn-light-mode body.page-chat.front-creative-page .front-model-select,
html[data-theme="light"] body.page-chat.front-creative-page .front-model-select,
body.page-chat.front-creative-page.jn-light-mode .front-model-select {
  border-color: rgba(15, 23, 42, 0.12);
}
html.jn-light-mode body.page-gallery.front-creative-page .gallery-search input,
html[data-theme="light"] body.page-gallery.front-creative-page .gallery-search input,
body.page-gallery.front-creative-page.jn-light-mode .gallery-search input {
  color: rgb(15, 23, 42);
  border-color: rgb(15, 23, 42);
}
/* 105-light-control-visual-parity-strong */
html.jn-light-mode body.page-app.front-creative-page #mainArea .front-param-select,
html[data-theme="light"] body.page-app.front-creative-page #mainArea .front-param-select,
body.page-app.front-creative-page.jn-light-mode #mainArea .front-param-select {
  color: rgb(71, 85, 105);
}
html.jn-light-mode body.page-chat.front-creative-page #mainArea .front-model-select,
html[data-theme="light"] body.page-chat.front-creative-page #mainArea .front-model-select,
body.page-chat.front-creative-page.jn-light-mode #mainArea .front-model-select {
  border-color: rgba(15, 23, 42, 0.12);
}
html.jn-light-mode body.page-gallery.front-creative-page #galleryLibraryPage .gallery-search input,
html[data-theme="light"] body.page-gallery.front-creative-page #galleryLibraryPage .gallery-search input,
body.page-gallery.front-creative-page.jn-light-mode #galleryLibraryPage .gallery-search input {
  color: rgb(15, 23, 42);
  border-color: rgb(15, 23, 42);
}
/* 106-front-mobile-theme-detail-parity */
html.jn-light-mode body.page-app.front-creative-page #mainArea .front-param-select[data-param="count"],
html[data-theme="light"] body.page-app.front-creative-page #mainArea .front-param-select[data-param="count"],
body.page-app.front-creative-page.jn-light-mode #mainArea .front-param-select[data-param="count"] {
  color: rgb(80, 98, 122);
  border-color: rgb(80, 98, 122);
}
@media (max-width: 640px) {
  body.page-chat.front-creative-page #mainArea .front-chat-new-btn.oc-chat-new-btn {
    width: 82px;
    min-width: 82px;
    padding-left: 10px;
    padding-right: 10px;
    transform: translateY(-2px);
  }
  
  
  html.jn-light-mode body.page-video.front-creative-page #mainArea .front-param-select[data-param="count"],
  html[data-theme="light"] body.page-video.front-creative-page #mainArea .front-param-select[data-param="count"],
  body.page-video.front-creative-page.jn-light-mode #mainArea .front-param-select[data-param="count"] {
    width: max-content;
  }
}
/* 107-front-mobile-theme-detail-parity-strong */
@media (max-width: 640px) {
  
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) #mainArea .front-param-select[data-param="count"],
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) #mainArea .front-param-select[data-param="count"],
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .front-param-select[data-param="count"] {
    width: max-content;
    min-width: max-content;
    max-width: none;
    flex: 0 0 auto;
  }
}
/* 109-mobile-chat-control-visual-parity */
@media (max-width: 760px) {
  html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) .front-chat-history-toggle.oc-chat-history-toggle {
    width: 80px;
    min-width: 80px;
    max-width: 80px;
    height: 29px;
    min-height: 29px;
    padding-left: 8px;
    padding-right: 8px;
    gap: 5px;
    font-size: 11px;
    font-weight: 900;
    transform: translateY(-3px);
  }
  html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls .front-model-select.front-param-select {
    width: 138.844px;
    min-width: 118px;
    max-width: 236px;
  }
  html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls .front-model-select > .front-param-trigger.ai-param-trigger {
    width: 138.844px;
    padding: 0 24px 0 14px;
    color: rgb(71, 85, 105);
    -webkit-text-fill-color: rgb(71, 85, 105);
    font-weight: 820;
    justify-content: flex-start;
  }
}
/* 110-mobile-chat-dark-history-model-parity */
@media (max-width: 760px) {
  html:not(.jn-light-mode):not([data-theme="light"]) body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls .front-model-select > .front-param-trigger.ai-param-trigger,
  html[data-theme="dark"] body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls .front-model-select > .front-param-trigger.ai-param-trigger,
  body.page-chat.front-creative-page:not(.jn-light-mode):not([data-theme="light"]):not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls .front-model-select > .front-param-trigger.ai-param-trigger {
    color: rgb(232, 237, 247);
    -webkit-text-fill-color: rgb(232, 237, 247);
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-chat-history-panel.oc-chat-history-panel {
    transform: translateY(-3px);
  }
}
/* 111-mobile-video-light-param-popover-parity */
@media (max-width: 760px) {
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) #mainArea .front-param-select.ai-video-control.is-model,
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) #mainArea .front-param-select.ai-video-control.is-model,
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .front-param-select.ai-video-control.is-model {
    font-size: 12px;
    line-height: 12px;
  }
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) #mainArea .front-param-select.ai-video-control.is-model > .front-param-trigger.ai-param-trigger,
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) #mainArea .front-param-select.ai-video-control.is-model > .front-param-trigger.ai-param-trigger,
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .front-param-select.ai-video-control.is-model > .front-param-trigger.ai-param-trigger {
    font-weight: 800;
    -webkit-text-fill-color: rgb(71, 85, 105);
  }
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover,
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover,
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-draw-popover {
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.14);
  }
}
/* 112-mobile-video-light-param-popover-parity-strong */
@media (max-width: 760px) {
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer="video"] .front-param-select.ai-video-control.is-model.ai-draw-select[data-param="model"],
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer="video"] .front-param-select.ai-video-control.is-model.ai-draw-select[data-param="model"],
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) #mainArea [data-front-creative-composer="video"] .front-param-select.ai-video-control.is-model.ai-draw-select[data-param="model"] {
    font-size: 12px;
    line-height: 12px;
  }
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer="video"] .front-param-select.ai-video-control.is-model.ai-draw-select[data-param="model"] > .front-param-trigger.ai-param-trigger,
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer="video"] .front-param-select.ai-video-control.is-model.ai-draw-select[data-param="model"] > .front-param-trigger.ai-param-trigger,
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) #mainArea [data-front-creative-composer="video"] .front-param-select.ai-video-control.is-model.ai-draw-select[data-param="model"] > .front-param-trigger.ai-param-trigger {
    font-weight: 800;
    -webkit-text-fill-color: rgb(71, 85, 105);
  }
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param="model"],
  html.jn-light-mode body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param="count"],
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param="model"],
  html[data-theme="light"] body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param="count"],
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param="model"],
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) .front-param-portal.front-param-draw-popover[data-param="count"] {
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.14);
  }
}

.image-workspace{position:relative;min-height:100dvh;padding:24px 46px 224px}.image-result{min-height:calc(100dvh - 248px);display:flex;align-items:center;justify-content:flex-start;border:0;background:transparent;box-shadow:none}.image-result__empty{width:min(560px,calc(100vw - 320px));display:grid;place-items:center;gap:20px;margin:auto;color:#a2a6ae;text-align:center}.image-result__empty>span{width:78px;height:78px;display:grid;place-items:center;border:0;background:transparent;color:#f4f4f5;font-size:70px;line-height:1}.image-result__empty small{width:min(560px,100%);padding:20px 24px;border:1px solid rgba(255,255,255,.14);border-radius:16px;background:var(--front-composer-panel);color:#eef0f4;font-size:14px;line-height:1.8;box-shadow:0 18px 44px rgba(0,0,0,.24)}.image-result__status{width:min(560px,100%);margin:auto;padding:16px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:var(--front-composer-panel);color:#cbd1da;line-height:1.65}.image-result__status.is-error{border-color:rgba(255,105,105,.28);color:#ffaaaa}.image-result__media{width:min(620px,100%);display:grid;align-content:start;gap:28px;margin:0 0 0 12px}.image-result-card{width:min(432px,100%);display:grid;gap:8px;border:0;background:transparent}.image-result-card img{width:100%;max-height:520px;display:block;border:0;border-radius:0;background:var(--front-video-chat-bg);object-fit:contain}.image-result-card__meta{display:grid;gap:6px}.image-result-card__meta strong{overflow:hidden;color:#f1f2f5;font-size:15px;font-weight:500;text-overflow:ellipsis;white-space:nowrap}.image-result-card__meta small{color:#9ca1ab;font-size:11px}.image-result-card__actions{display:flex;gap:7px}.image-result-card__actions a,.image-result-card__actions button{height:30px;display:flex;align-items:center;justify-content:center;padding:0 11px;border:1px solid rgba(255,255,255,.13);border-radius:6px;background:var(--front-composer-control);color:#f0f1f4;font-family:inherit;font-size:11px;text-decoration:none;cursor:pointer}.image-result-card__actions button:disabled{opacity:.55}.image-result-card.is-failed{min-height:150px;place-items:center;color:#ffaaaa}.image-composer{position:fixed;left:calc(var(--front-menu-width) + (100vw - var(--front-menu-width) - min(980px,calc(100vw - var(--front-menu-width) - 48px)))/2);bottom:14px;z-index:70;width:min(980px,calc(100vw - var(--front-menu-width) - 48px));min-height:208px;display:grid;grid-template-columns:100px minmax(0,1fr);grid-template-rows:minmax(96px,1fr) auto;column-gap:16px;padding:14px 18px 16px;border:1px solid rgba(255,255,255,.13);border-radius:17px;background:#20211f;color:#f4f4f5;box-shadow:0 18px 48px rgba(0,0,0,.3)}.image-references{grid-column:1;grid-row:1/3;display:grid;align-content:center}.image-references__head{display:none}.image-references__list{position:absolute;left:14px;bottom:100%;display:flex;gap:8px;margin-bottom:10px}.image-reference-card{position:relative;width:64px;height:64px;overflow:hidden;border:1px solid rgba(255,255,255,.15);border-radius:9px;background:var(--front-video-chat-bg)}.image-reference-card img{width:100%;height:100%;object-fit:cover}.image-reference-card button{position:absolute;right:3px;top:3px;width:20px;height:20px;border:0;border-radius:50%;background:rgba(0,0,0,.72);color:#fff;cursor:pointer}.image-references__actions{display:grid;gap:7px}.image-reference-upload{width:76px;height:96px;display:grid;place-items:center;border:1px dashed rgba(255,255,255,.15);border-radius:7px;background:var(--front-video-chat-bg);color:#f2f3f5;transform:rotate(-7deg);cursor:pointer}.image-reference-upload input{position:absolute;width:1px;height:1px;opacity:0}.image-reference-upload span{display:grid;place-items:center;gap:5px;font-size:20px}.image-reference-upload small{font-size:11px}.image-references__actions>button{height:28px;border:1px solid rgba(255,255,255,.11);border-radius:7px;background:var(--front-composer-control);color:#cfd3da;font-size:10px;cursor:pointer}.image-composer__prompt{grid-column:2;grid-row:1;display:grid}.image-composer__prompt-head{display:flex;justify-content:flex-end}.image-composer__prompt-head b{display:none}.image-composer__prompt-head button{height:28px;padding:0 10px;border:1px solid rgba(244,190,84,.3);border-radius:8px;background:rgba(244,190,84,.1);color:#f7c95d;font-size:10px;font-weight:800;cursor:pointer}.image-composer textarea{width:100%;height:88px;resize:none;padding:4px 0;border:0;outline:0;background:transparent;color:#f4f4f5;font:14px/1.7 inherit}.image-composer textarea::placeholder{color:#9da1aa}.image-composer__controls{grid-column:2;grid-row:2;display:flex;align-items:end;gap:7px}.image-composer__controls label{display:grid;gap:0}.image-composer__controls label>span{display:none}.image-composer select{height:36px;max-width:190px;padding:0 28px 0 12px;border:1px solid rgba(255,255,255,.13);border-radius:18px;background:#292b2f;color:#f2f3f5;font-size:12px;font-weight:700}.image-composer__footer{position:absolute;right:18px;bottom:15px;display:flex;align-items:center;gap:10px}.image-composer__footer span{position:absolute;right:0;bottom:50px;padding:7px 12px;border:1px solid rgba(244,190,84,.24);border-radius:16px;background:#292b2f;color:#f7c95d;font-size:11px;font-weight:800;white-space:nowrap}.image-composer__footer button{width:46px;height:46px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:50%;background:#2a2b2d;color:#fff;font-size:23px;cursor:pointer}.image-composer__footer button:disabled{opacity:.42;cursor:not-allowed}.workspace-page.is-sidebar-collapsed .image-composer{left:calc((100vw - min(980px,calc(100vw - 48px)))/2);width:min(980px,calc(100vw - 48px))}
@media(max-width:760px){.image-workspace{padding:18px 14px 210px}.image-result{min-height:calc(100dvh - 266px)}.image-result__empty{width:100%}.image-result__empty small{padding:16px;font-size:13px}.image-composer,.workspace-page.is-sidebar-collapsed .image-composer{left:10px;right:10px;bottom:10px;width:auto;min-height:184px;grid-template-columns:74px minmax(0,1fr);column-gap:10px;padding:12px}.image-reference-upload{width:62px;height:78px}.image-references__actions>button{display:none}.image-composer textarea{height:72px}.image-composer__controls{overflow-x:auto;padding-right:52px}.image-composer select{max-width:150px}.image-composer__footer{right:12px;bottom:12px}.image-composer__footer span{display:none}}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page [data-front-creative-composer=image] .front-param-select.ai-draw-select{
    --draw-param-bg:#f8fafc;
    --draw-param-text:#475569;
}

html body.page-app.front-creative-page .front-video-composer-frame{
    backdrop-filter:blur(22px) saturate(1.32);
    -webkit-backdrop-filter:blur(22px) saturate(1.32);
}









:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page :is(.front-creative-brand-mark,.front-creative-profile-avatar) img{
    color:#64748b;
    -webkit-text-fill-color:#64748b;
    border-color:#64748b;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .ai-draw-result-image img{
    border-color:transparent;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .front-creative-avatar,
:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page :is(.front-creative-logo,.front-creative-avatar) img{
    color:#64748b;
    -webkit-text-fill-color:#64748b;
    border-color:#64748b;
}

html body.page-app.front-creative-page .ai-draw-clear-tool.ai-video-clear-chip{
    width:32px;
    min-width:32px;
    max-width:32px;
    height:32px;
    min-height:32px;
    max-height:32px;
    padding:0;
    display:grid;
    place-items:center;
    grid-template-columns:30px;
    overflow:hidden;
    background:rgba(255,255,255,.07);
    font:900 12px/12px system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .ai-draw-clear-tool.ai-video-clear-chip{
    height:34px;
    min-height:34px;
    max-height:34px;
    border-color:rgba(15,23,42,.12);
    background:#fff;
    color:#0f172a;
    -webkit-text-fill-color:#0f172a;
}

html[data-theme=dark]:not(.jn-light-mode) body.page-app.front-creative-page [data-front-creative-composer=image] .front-creative-send:is(:disabled,.is-empty),
body.page-app.front-creative-page[data-theme=dark]:not(.jn-light-mode) [data-front-creative-composer=image] .front-creative-send:is(:disabled,.is-empty),
body.page-app.front-creative-page:not(.jn-light-mode):not([data-theme=light]) [data-front-creative-composer=image] .front-creative-send:is(:disabled,.is-empty){
    border-color:rgba(255,255,255,.14);
    background:#2f3033;
    color:#9ca3af;
    -webkit-text-fill-color:#9ca3af;
    box-shadow:none;
    opacity:.68;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page [data-front-creative-composer=image] .front-creative-send:is(:disabled,.is-empty){
    border-color:rgba(15,23,42,.12);
    background:#f8fafc;
    color:#64748b;
    -webkit-text-fill-color:#64748b;
    box-shadow:none;
    opacity:.72;
}

html body.page-app.front-creative-page .ai-draw-clear-tool.ai-video-clear-chip svg{
    width:15px;
    height:15px;
    stroke-width:2;
}

html body.page-app.front-creative-page .ai-draw-clear-tool.ai-video-clear-chip span{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
    display:block;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page [data-front-creative-composer=image] :is(.ai-draw-size-icon,.ai-draw-quality-icon){
    color:#50627a;
}

html body.page-app.front-creative-page .front-creative-billing-pill svg,
html body.page-app.front-creative-page .front-creative-billing-pill svg path{
    stroke:none;
    stroke-width:1px;
    stroke-linecap:butt;
    stroke-linejoin:miter;
}

html[data-theme=dark]:not(.jn-light-mode) body.page-app.front-creative-page .ai-draw-page .front-creative-billing-pill.ai-video-price-pill :is(svg,span),
body.page-app.front-creative-page[data-theme=dark]:not(.jn-light-mode) .ai-draw-page .front-creative-billing-pill.ai-video-price-pill :is(svg,span),
body.page-app.front-creative-page:not(.jn-light-mode):not([data-theme=light]) .ai-draw-page .front-creative-billing-pill.ai-video-price-pill :is(svg,span){
    fill:currentColor;
}

html body.page-app.front-creative-page .front-creative-send svg,
html body.page-app.front-creative-page .front-creative-send svg path{
    stroke-linecap:butt;
    stroke-linejoin:miter;
}

html body.page-app.front-creative-page [data-front-creative-composer=image] .front-param-trigger::after{
    content:none;
    display:none;
}

/* Shared image/video reference stack. Frame pickers remain separate. */
body:is(.page-app,.page-video).front-creative-page [data-front-creative-composer] [data-reference-stack-host].is-reference-stack-active{
  z-index:var(--lz-z-creative-reference-active);
}
body:is(.page-app,.page-video).front-creative-page [data-front-creative-composer] .front-creative-composer-inner.is-reference-stack-layer-active{
  z-index:var(--lz-z-creative-reference-active);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference.ai-draw-reference-stack{
  --ref-card-w:65px;
  --ref-card-h:82px;
  --ref-card-top:0px;
  --ref-card-step:56px;
  --ref-card-bg:var(--front-composer-panel,#242424);
  --ref-card-border:var(--front-composer-control-line,rgba(255,255,255,.12));
  --ref-card-muted:var(--front-composer-muted,#9ca3af);
  --ref-circle-bg:#31343c;
  --ref-circle-border:rgba(255,255,255,.16);
  --ref-action-bg:rgba(54,57,64,.96);
  --ref-action-border:rgba(255,255,255,.18);
  --reference-button-z:110;
  --reference-list-z:5;
  --reference-corner-x:0px;
  --reference-corner-y:0px;
  position:absolute;
  inset:0 auto auto 0;
  width:var(--ref-card-w);
  min-width:var(--ref-card-w);
  max-width:none;
  height:var(--ref-card-h);
  min-height:var(--ref-card-h);
  max-height:none;
  margin:0;
  padding:0;
  display:block;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  transform:none;
  pointer-events:auto;
  z-index:48;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference:is(:hover,.is-reference-expanded){
  width:min(calc(var(--ref-card-w) + (var(--reference-count,1) * var(--ref-card-step)) + 20px),calc(100vw - 34px));
  min-width:min(calc(var(--ref-card-w) + (var(--reference-count,1) * var(--ref-card-step)) + 20px),calc(100vw - 34px));
  z-index:160;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack>[data-reference-input],
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack>[data-reference-picker]{
  position:fixed;
  left:-10000px;
  top:-10000px;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack>.ai-draw-reference-btn{
  position:absolute;
  inset:0 auto auto 0;
  width:var(--ref-card-w);
  min-width:var(--ref-card-w);
  max-width:var(--ref-card-w);
  height:var(--ref-card-h);
  min-height:var(--ref-card-h);
  max-height:var(--ref-card-h);
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px dashed var(--ref-card-border);
  border-radius:3px;
  background:var(--ref-card-bg);
  color:var(--ref-card-muted);
  box-shadow:none;
  opacity:1;
  visibility:visible;
  z-index:var(--reference-button-z);
  transform:var(--reference-button-transform,none);
  transform-origin:50% 86%;
  transition:width .3s ease,height .3s ease,border-radius .3s ease,background-color .2s ease,border-color .2s ease,transform .3s cubic-bezier(.4,0,.2,1);
  pointer-events:auto;
  cursor:pointer;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack:not(.has-reference)>.ai-draw-reference-btn{
  transform:translate3d(0,-1px,0) rotate(-8deg);
  box-shadow:0 9px 20px rgba(0,0,0,.18),0 2px 5px rgba(0,0,0,.12);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack:not(.has-reference)>.ai-draw-reference-btn:hover{
  transform:translate3d(0,-3px,0) rotate(-6deg) scale(1.025);
  box-shadow:0 13px 26px rgba(0,0,0,.22),0 3px 7px rgba(0,0,0,.14);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference>.ai-draw-reference-btn.collapsed{
  width:32px;
  min-width:32px;
  max-width:32px;
  height:32px;
  min-height:32px;
  max-height:32px;
  border-color:transparent;
  border-radius:50%;
  background:transparent;
  color:transparent;
  box-shadow:none;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-card-form,
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-circle-form{
  position:absolute;
  inset:0;
  width:100%;
  min-width:0;
  max-width:none;
  height:100%;
  min-height:0;
  max-height:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:transparent;
  box-shadow:none;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .upload-placeholder{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-plus,.ai-draw-reference-add){
  width:auto;
  min-width:0;
  height:auto;
  min-height:0;
  padding:0;
  display:block;
  border:0;
  border-radius:0;
  background:transparent;
  color:currentColor;
  box-shadow:none;
  font-size:27px;
  font-weight:300;
  line-height:1;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .frame-label{
  color:var(--front-composer-text,#f6f7fb);
  -webkit-text-fill-color:var(--front-composer-text,#f6f7fb);
  font-size:11px;
  font-weight:450;
  line-height:1.15;
  letter-spacing:0;
  opacity:.78;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
  white-space:nowrap;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-circle-form,
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference>.ai-draw-reference-btn.collapsed .ai-draw-reference-card-form{
  display:none;
  opacity:0;
  visibility:hidden;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-preview{
  position:absolute;
  inset:0 auto auto 0;
  width:var(--ref-card-w);
  min-width:var(--ref-card-w);
  max-width:86px;
  height:var(--ref-card-h);
  min-height:var(--ref-card-h);
  max-height:86px;
  display:block;
  overflow:visible;
  border:0;
  border-radius:18px;
  background:transparent;
  box-shadow:none;
  pointer-events:none;
  z-index:var(--reference-list-z);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-preview.hidden{display:none}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-hover-overlay{
  position:absolute;
  inset:0 auto auto 0;
  width:var(--reference-overlay-width,var(--ref-card-w));
  height:var(--reference-overlay-height,var(--ref-card-h));
  background:transparent;
  pointer-events:none;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card.image-upload-card{
  position:absolute;
  inset:0 auto auto 0;
  width:var(--ref-card-w);
  min-width:var(--ref-card-w);
  max-width:var(--ref-card-w);
  height:var(--ref-card-h);
  min-height:var(--ref-card-h);
  max-height:var(--ref-card-h);
  box-sizing:border-box;
  margin:0;
  padding:0;
  display:block;
  overflow:visible;
  border:2px solid rgba(255,255,255,.96);
  border-radius:3px;
  background:var(--ref-card-bg,var(--front-composer-panel,#242424));
  box-shadow:0 4px 12px rgba(0,0,0,.3);
  transform-origin:50% 86%;
  transition:transform .32s cubic-bezier(.4,0,.2,1),box-shadow .2s ease;
  pointer-events:auto;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference .ai-draw-reference-card.image-upload-card[data-reference-card]{
  z-index:var(--reference-card-z,1);
  transform:var(--reference-card-transform,none);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card.is-reference-loading,
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card.is-reference-loading .image-preview,
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card.is-reference-loading img{
  background:var(--ref-card-bg,var(--front-composer-panel,#242424));
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card.is-reference-loading img{
  opacity:0;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card :is(.image-preview,img){
  position:static;
  width:100%;
  min-width:100%;
  max-width:100%;
  height:100%;
  min-height:100%;
  max-height:100%;
  display:block;
  overflow:hidden;
  border:0;
  border-radius:2px;
  background:var(--ref-card-bg,var(--front-composer-panel,#242424));
  object-fit:cover;
  object-position:center;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card [data-reference-remove]{
  position:absolute;
  right:-8px;
  top:-8px;
  z-index:1200;
  width:20px;
  min-width:20px;
  max-width:20px;
  height:20px;
  min-height:20px;
  max-height:20px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.26);
  border-radius:50%;
  background:rgba(26,29,35,.94);
  color:#fff;
  box-shadow:none;
  font-size:14px;
  font-weight:600;
  line-height:1;
  opacity:0;
  transform:scale(.6);
  transition:opacity .18s ease,transform .18s ease,background-color .18s ease;
  pointer-events:none;
  cursor:pointer;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack:is(:hover,.is-reference-expanded) .ai-draw-reference-card [data-reference-remove]{
  opacity:1;
  transform:scale(1);
  pointer-events:auto;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card [data-reference-remove]:hover{background:#dc4f57}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-corner-plus{
  position:absolute;
  left:var(--reference-corner-x);
  top:var(--reference-corner-y);
  width:32px;
  min-width:32px;
  max-width:32px;
  height:32px;
  min-height:32px;
  max-height:32px;
  margin:0;
  padding:0;
  display:none;
  align-items:center;
  justify-content:center;
  border:1px dashed var(--ref-circle-border);
  border-radius:50%;
  background:var(--ref-circle-bg);
  color:#f8fafc;
  box-shadow:0 3px 12px rgba(0,0,0,.28);
  font-size:20px;
  font-weight:500;
  line-height:1;
  pointer-events:auto;
  cursor:pointer;
  z-index:1520;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.show-reference-corner-plus .ai-draw-reference-corner-plus{
  display:flex;
  opacity:1;
  visibility:visible;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan){
  position:absolute;
  width:22px;
  min-width:22px;
  max-width:22px;
  height:22px;
  min-height:22px;
  max-height:22px;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--ref-action-border);
  border-radius:5px;
  background:var(--ref-action-bg);
  color:#eef1f5;
  box-shadow:0 4px 9px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.09);
  transform:translateZ(0);
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
  cursor:pointer;
  z-index:1320;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.is-reference-expanded :is(.ai-draw-reference-asset,.ai-draw-reference-scan){
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-asset{
  top:-10px;
  right:var(--lz-reference-asset-trigger-inline-offset);
  bottom:auto;
  left:auto;
  transform:translateZ(0);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-scan{
  top:auto;
  right:auto;
  bottom:-13px;
  left:-13px;
  color:#d8dce3;
  -webkit-text-fill-color:#d8dce3;
  background:var(--ref-action-bg);
  border-color:var(--ref-action-border);
  border-radius:6px;
  box-shadow:0 7px 16px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.09);
  transform:rotate(-9deg) translateZ(0);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan):hover{
  background:#3b3f48;
  border-color:rgba(255,255,255,.25);
  color:#fff;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan):hover{transform:scale(1.06) translateZ(0)}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-scan:hover{transform:rotate(-4deg) scale(1.08) translateZ(0)}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan) svg{
  width:14px;
  min-width:14px;
  height:14px;
  min-height:14px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-scan svg{
  width:12px;
  min-width:12px;
  height:12px;
  min-height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-manage,[data-reference-clear]){
  display:none;
  visibility:hidden;
  pointer-events:none;
}
html.jn-light-mode body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference.ai-draw-reference-stack,
html[data-theme="light"] body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference.ai-draw-reference-stack,
body:is(.page-app,.page-video).front-creative-page.jn-light-mode [data-reference-stack].ai-draw-reference.ai-draw-reference-stack{
  --ref-card-bg:var(--front-composer-panel,rgba(246,248,252,.76));
  --ref-card-border:var(--front-composer-control-line,rgba(15,23,42,.12));
  --ref-card-muted:var(--front-composer-muted,#64748b);
  --ref-circle-bg:#f8fafc;
  --ref-circle-border:rgba(15,23,42,.16);
  --ref-action-bg:#f5f6f8;
  --ref-action-border:rgba(31,35,42,.17);
}
html.jn-light-mode body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-corner-plus,
html[data-theme="light"] body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-corner-plus,
body:is(.page-app,.page-video).front-creative-page.jn-light-mode [data-reference-stack] .ai-draw-reference-corner-plus{
  color:#111827;
  box-shadow:0 4px 12px rgba(15,23,42,.12);
}
html.jn-light-mode body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card [data-reference-remove],
html[data-theme="light"] body:is(.page-app,.page-video).front-creative-page [data-reference-stack] .ai-draw-reference-card [data-reference-remove],
body:is(.page-app,.page-video).front-creative-page.jn-light-mode [data-reference-stack] .ai-draw-reference-card [data-reference-remove]{
  background:#fff;
  border-color:rgba(220,79,87,.24);
  color:#cf3f49;
  box-shadow:0 6px 14px rgba(15,23,42,.12);
}
html.jn-light-mode body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan),
html[data-theme="light"] body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan),
body:is(.page-app,.page-video).front-creative-page.jn-light-mode [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan){
  background:#f5f6f8;
  border-color:rgba(31,35,42,.17);
  color:#343840;
  -webkit-text-fill-color:#343840;
  box-shadow:0 5px 12px rgba(20,24,31,.10);
}
html.jn-light-mode body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan):hover,
html[data-theme="light"] body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan):hover,
body:is(.page-app,.page-video).front-creative-page.jn-light-mode [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan):hover{
  background:#fff;
  border-color:rgba(31,35,42,.26);
  color:#16191f;
  -webkit-text-fill-color:#16191f;
}
@media(max-width:860px){
  body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference.ai-draw-reference-stack{
    --ref-card-w:60px;
    --ref-card-h:75px;
    --ref-card-step:65px;
  }
  body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference:not(.is-reference-expanded){
    width:var(--ref-card-w);
    min-width:var(--ref-card-w);
    z-index:48;
  }
  body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference:not(.is-reference-expanded) .ai-draw-reference-card [data-reference-remove]{
    opacity:0;
    transform:scale(.6);
    pointer-events:none;
  }
  body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.show-reference-corner-plus .ai-draw-reference-corner-plus{
    display:flex;
    opacity:1;
    visibility:visible;
  }
  body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack :is(.ai-draw-reference-asset,.ai-draw-reference-scan){
    width:22px;
    min-width:22px;
    max-width:22px;
    height:22px;
    min-height:22px;
    max-height:22px;
  }
  body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack .ai-draw-reference-scan{
    width:20px;
    min-width:20px;
    max-width:20px;
    height:20px;
    min-height:20px;
    max-height:20px;
  }
}

html:not(.jn-light-mode):not([data-theme="light"]) body:is(.page-app,.page-video).front-creative-page:not(.jn-light-mode) [data-reference-stack].ai-draw-reference.ai-draw-reference-stack{
  --ref-card-bg:#242424;
  --front-composer-control-line:rgba(255,255,255,.12);
}
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.has-reference:not(:hover):not(.is-reference-expanded).can-add-reference .ai-draw-reference-corner-plus,
body:is(.page-app,.page-video).front-creative-page [data-reference-stack].ai-draw-reference-stack.show-reference-corner-plus .ai-draw-reference-corner-plus{
  display:flex;
  opacity:1;
  visibility:visible;
}

.image-references{display:grid;gap:10px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.07)}.image-references__head{display:flex;align-items:center;justify-content:space-between;color:#aeb5c0;font-size:12px;font-weight:800}.image-references__head small{color:#777f8c;font-weight:500}.image-references__list{display:flex;gap:9px;min-height:0;overflow-x:auto}.image-reference-card{position:relative;width:68px;height:68px;flex:0 0 68px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:#1b1d22;overflow:hidden}.image-reference-card img{width:100%;height:100%;object-fit:cover}.image-reference-card button{position:absolute;right:3px;top:3px;width:20px;height:20px;border:0;border-radius:50%;background:rgba(10,11,14,.78);color:#fff;cursor:pointer}.image-references__actions{display:flex;gap:8px}.image-reference-upload,.image-references__actions>button{height:36px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#24272d;color:#dce1e8;font-size:11px;font-weight:800;cursor:pointer}.image-reference-upload input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.image-references__actions>button{font-family:inherit}.image-mobile-dialog{width:min(390px,calc(100vw - 28px));padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:22px;background:#23252b;color:#fff;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.56)}.image-mobile-dialog::backdrop{background:rgba(0,0,0,.68)}.image-mobile-dialog>button:first-child{position:absolute;right:14px;top:12px;border:0;background:transparent;color:#aeb5c0;font-size:24px}.image-mobile-dialog h2{margin:0 24px 8px;font-size:21px}.image-mobile-dialog p{margin:0;color:#9aa2ae;font-size:13px;line-height:1.6}.image-mobile-dialog__qr{width:226px;height:226px;display:grid;place-items:center;margin:18px auto;padding:12px;border-radius:18px;background:#fff}.image-mobile-dialog__qr svg{width:100%;height:100%}.image-mobile-dialog code{display:block;max-height:56px;overflow:auto;padding:9px;border-radius:10px;background:#1a1c20;color:#aab2be;font-size:10px;word-break:break-all}.image-mobile-dialog>[data-image-mobile-copy]{position:static;width:100%;height:40px;margin-top:10px;border:0;border-radius:11px;background:#efbb3d;color:#211b0f;font-size:13px;font-weight:900}.image-mobile-dialog small{display:block;min-height:18px;margin-top:10px;color:#efc458}.reference-mobile-page{min-height:100vh;display:grid;place-items:center;margin:0;padding:20px;background:radial-gradient(circle at 70% 12%,rgba(67,76,96,.36),transparent 34%),#17181c;color:#f7f8fb;font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif}.reference-mobile-card{width:min(420px,100%);padding:28px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:#23252b;box-shadow:0 28px 80px rgba(0,0,0,.35)}.reference-mobile-mark{color:#efbd43;font-size:12px;font-weight:900;letter-spacing:.12em}.reference-mobile-card h1{margin:12px 0 8px}.reference-mobile-card p{color:#a6aeba;line-height:1.7}.reference-mobile-card form{display:grid;gap:14px;margin-top:22px}.reference-mobile-card label{display:grid;gap:8px;color:#cbd1d9;font-size:13px}.reference-mobile-card input{padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#1b1d22;color:#fff}.reference-mobile-card button{height:46px;border:0;border-radius:13px;background:linear-gradient(135deg,#f2c33f,#dc9622);color:#211b0f;font-weight:900}.reference-mobile-card>small{display:block;margin-top:14px;color:#7f8794}.reference-mobile-card.is-success{border-color:rgba(80,205,137,.3)}.reference-mobile-card.is-error{border-color:rgba(255,105,105,.3)}
@media(max-width:560px){.image-references__actions{align-items:stretch;flex-direction:column}.image-reference-upload,.image-references__actions>button{width:100%}}

.front-param-select,
.front-param-options {
  --front-param-control-bg: var(--lz-front-composer-control);
  --front-param-control-border: var(--lz-front-composer-control-border);
  --front-param-control-text: var(--lz-front-composer-text);
  --front-param-control-muted: #9aa3b2;
  --front-param-panel-bg: var(--lz-front-param-panel);
  --front-param-panel-border: var(--lz-front-param-panel-border);
  --front-param-panel-hover: var(--lz-front-param-panel-hover);
  --front-param-panel-text: var(--lz-front-composer-text);
  --front-param-shadow: var(--lz-front-param-shadow);
  --front-param-height: 34px;
  box-sizing: border-box;
}

html.jn-light-mode .front-param-select,
html.jn-light-mode .front-param-options,
html[data-theme=light] .front-param-select,
html[data-theme=light] .front-param-options,
body.jn-light-mode .front-param-select,
body.jn-light-mode .front-param-options,
body[data-theme=light] .front-param-select,
body[data-theme=light] .front-param-options {
  --front-param-control-muted: #64748b;
}

.front-param-select {
  position: relative;
  min-width: 0;
}

.front-param-select[data-front-param-select] {
  width: max-content;
  min-width: max-content;
  max-width: 100%;
  flex: 0 0 auto;
}

.front-param-trigger {
  position: relative;
  width: max-content;
  min-width: max-content;
  max-width: 100%;
  height: var(--front-param-height);
  min-height: var(--front-param-height);
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 0 12px;
  overflow: hidden;
  border: 1px solid var(--front-param-control-border);
  border-radius: 12px;
  background: var(--front-param-control-bg);
  color: var(--front-param-control-text);
  box-shadow: none;
  font: inherit;
  font-size: var(--lz-font-size-sm);
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.front-param-trigger:hover,
.front-param-select.is-portal-open .front-param-trigger {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.075);
}

.front-param-trigger > svg {
  width: 14px;
  height: 14px;
  display: block;
  flex: 0 0 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.86;
}

.front-param-select[data-param="size"] .front-param-trigger > svg,
.front-param-select[data-param="ratio"] .front-param-trigger > svg {
  width: 15px;
  height: 15px;
  flex-basis: 15px;
}

.front-param-value {
  min-width: 0;
  max-width: none;
  display: block;
  overflow: visible;
  color: inherit;
  text-overflow: clip;
  white-space: nowrap;
}

.front-param-select[data-param="model"] .front-param-trigger {
  min-width: 0;
  max-width: min(236px, calc(100vw - 44px));
  padding: 0 24px 0 14px;
}

.front-param-select[data-param="model"] .front-param-value {
  max-width: 174px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.front-param-trigger::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.8px solid currentColor;
  border-bottom: 1.8px solid currentColor;
  opacity: 0.78;
  transform: translateY(-62%) rotate(45deg);
  transition: transform var(--lz-duration-fast) var(--lz-ease-standard);
  pointer-events: none;
}

.front-param-select.is-portal-open .front-param-trigger::after,
.front-param-select.is-select-open .front-param-trigger::after {
  transform: translateY(-20%) rotate(225deg);
}

.front-param-select select {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
}

.front-param-options {
  position: fixed;
  z-index: 2147483647;
  width: var(--front-param-portal-width, var(--front-param-runtime-width, max-content));
  min-width: var(--front-param-portal-min-width, var(--front-param-runtime-min-width, 168px));
  max-width: var(--front-param-portal-max-width, var(--front-param-runtime-max-width, min(420px, calc(100vw - 18px))));
  max-height: min(336px, calc(100dvh - 18px));
  padding: 7px;
  display: none;
  grid-auto-rows: min-content;
  gap: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid var(--front-param-panel-border);
  border-radius: 10px;
  background: var(--front-param-panel-bg);
  color: var(--front-param-panel-text);
  box-shadow: var(--front-param-shadow);
  backdrop-filter: blur(22px) saturate(132%);
  -webkit-backdrop-filter: blur(22px) saturate(132%);
  scrollbar-width: thin;
  scrollbar-color: rgba(174, 180, 191, 0.52) transparent;
}

.front-param-options.is-open {
  display: grid;
}

.front-param-option {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-2);
  padding: 7px 9px;
  border: 0;
  border-radius: var(--lz-radius-md);
  background: transparent;
  color: var(--front-param-panel-text);
  font: inherit;
  font-size: var(--lz-font-size-sm);
  font-weight: 750;
  line-height: var(--lz-line-height-tight);
  text-align: left;
  cursor: pointer;
}

.front-param-option:hover,
.front-param-option.is-selected {
  background: var(--front-param-panel-hover);
}

.front-param-option-main {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

.front-param-option-icon {
  width: 16px;
  height: 16px;
  display: block;
  flex: 0 0 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: var(--front-param-control-muted);
}

.front-param-option-label {
  min-width: 0;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.front-param-popup-heading {
  min-width: 0;
  max-width: 340px;
  display: grid;
  gap: var(--lz-space-1);
  padding: var(--lz-space-2) var(--lz-space-2) var(--lz-space-3);
  border-bottom: 1px solid var(--front-param-panel-border);
}

.front-param-popup-title {
  color: var(--front-param-panel-text);
  font-size: var(--lz-font-size-sm);
  font-weight: 900;
  line-height: var(--lz-line-height-tight);
}

.front-param-popup-description {
  color: var(--front-param-control-muted);
  font-size: var(--lz-font-size-xs);
  font-weight: 650;
  line-height: var(--lz-line-height-base);
  white-space: normal;
  overflow-wrap: anywhere;
}

.front-param-check {
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  flex: 0 0 16px;
  color: var(--front-param-control-muted);
  opacity: 0;
}

.front-param-option.is-selected .front-param-check {
  opacity: 1;
}

.front-param-check svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.front-param-custom-count {
  margin: 7px 2px 0;
  padding-top: 9px;
  display: grid;
  gap: 7px;
  border-top: 1px solid var(--front-param-panel-border);
}

.front-param-custom-count > span {
  color: var(--front-param-control-muted);
  font-size: var(--lz-font-size-xs);
  font-weight: 760;
}

.front-param-custom-count > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px;
  gap: var(--lz-space-2);
  align-items: center;
}

.front-param-custom-count input,
.front-param-custom-count button {
  box-sizing: border-box;
  height: 30px;
  min-height: 30px;
  border-radius: var(--lz-radius-sm);
  box-shadow: none;
  font: inherit;
}

.front-param-custom-count input {
  width: 100%;
  padding: 0 9px;
  border: 1px solid var(--front-param-panel-border);
  background: var(--front-param-control-bg);
  color: var(--front-param-control-text);
  font-size: 13px;
  font-weight: 800;
}

.front-param-custom-count button {
  padding: 0 9px;
  border: 1px solid var(--front-param-control-muted);
  background: transparent;
  color: var(--front-param-control-text);
  font-size: var(--lz-font-size-xs);
  font-weight: 900;
  cursor: pointer;
}

/* Parameter labels are already actionable; do not add a second arrow over their text. */
html body:not(.page-admin) .front-param-trigger::after,
html body:not(.page-admin) .front-param-select::after,
html body.page-video.front-creative-page .ai-video-page .front-param-select.ai-video-control::after {
  content: none;
  display: none;
  width: 0;
  height: 0;
  border: 0;
}

html body:not(.page-admin) .front-param-trigger {
  padding-right: 12px;
}

html body:not(.page-admin) .front-param-option:has(.front-param-check)::after {
  content: none;
  display: none;
}

html body:not(.page-admin) .front-param-options .front-param-option.is-selected::after,
html body:not(.page-admin) .front-param-options button.front-param-option.is-selected::after {
  content: '';
  box-sizing: border-box;
  width: 7px;
  height: 12px;
  margin-left: auto;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-1px) rotate(45deg);
  color: var(--front-param-control-muted);
  -webkit-text-fill-color: var(--front-param-control-muted);
  font-size: 0;
  line-height: 0;
  flex: 0 0 7px;
}

@media (max-width: 860px) {
  .front-param-trigger {
    --front-param-height: 34px;
    font-size: var(--lz-font-size-xs);
  }
}

:where([data-records-workspace]) {}

.chat-workspace{height:calc(100vh - 257px);min-height:520px;display:grid;grid-template-columns:260px minmax(0,1fr);overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:#1d1f24;color:#f4f4f5}.chat-library{min-width:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:12px;padding:14px;border-right:1px solid rgba(255,255,255,.08);background:#191a1f}.chat-new{height:42px;border:0;border-radius:11px;background:#efc050;color:#17181c;font-weight:900;cursor:pointer}.chat-new span{margin-right:5px;font-size:18px}.chat-library__search input{width:100%;height:38px;border:1px solid rgba(255,255,255,.09);border-radius:10px;background:#23252b;color:#eef1f5;padding:0 11px;outline:none}.chat-library__search input:focus{border-color:rgba(239,192,80,.6)}.chat-conversations{min-height:0;display:grid;align-content:start;gap:6px;overflow:auto;scrollbar-width:none}.chat-conversations::-webkit-scrollbar{display:none}.chat-conversation{display:grid;grid-template-columns:minmax(0,1fr) 30px;border-radius:10px}.chat-conversation:hover,.chat-conversation.is-active{background:#292c32}.chat-conversation.is-active{box-shadow:inset 3px 0 #efc050}.chat-conversation button{border:0;background:transparent;color:#dfe2e7;cursor:pointer}.chat-conversation__open{min-width:0;display:grid;gap:4px;text-align:left;padding:10px}.chat-conversation__open strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.chat-conversation__open small{color:#777f8b;font-size:10px}.chat-conversation__delete{opacity:0;color:#ff9c9c}.chat-conversation:hover .chat-conversation__delete{opacity:1}.chat-library__status{min-height:16px;margin:0;color:#747b87;font-size:10px}.chat-stage{min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;background:radial-gradient(circle at 50% 25%,rgba(239,192,80,.035),transparent 30%),#202228}.chat-stage__header{height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 18px;border-bottom:1px solid rgba(255,255,255,.07)}.chat-stage__header>div{min-width:0;display:grid;gap:3px}.chat-stage__header strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-stage__header small,.chat-stage__header label span{color:#7f8793;font-size:10px}.chat-stage__header label{display:grid;gap:3px}.chat-stage__header select{width:190px;height:36px;border:1px solid rgba(255,255,255,.09);border-radius:9px;background:#292c32;color:#eef1f5;padding:0 10px}.chat-messages{min-height:0;overflow:auto;padding:24px clamp(18px,5vw,70px)}.chat-welcome{min-height:100%;display:grid;place-items:center;align-content:center;gap:10px;text-align:center}.chat-welcome>span{width:54px;height:54px;display:grid;place-items:center;border:1px solid rgba(239,192,80,.24);border-radius:18px;background:rgba(239,192,80,.08);color:#efc050;font-size:28px}.chat-welcome h2{margin:4px 0 0;font-size:26px}.chat-welcome p{max-width:480px;margin:0;color:#8d94a0}.chat-welcome>div{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}.chat-welcome button{height:35px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:#292c32;color:#cfd3da;padding:0 13px;cursor:pointer}.chat-message{display:grid;grid-template-columns:34px minmax(0,1fr);gap:11px;max-width:900px;margin:0 auto 20px}.chat-message__avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#30333a;color:#dfe2e7;font-size:12px;font-weight:900}.chat-message.is-assistant .chat-message__avatar{background:#efc050;color:#17181c}.chat-message__body{min-width:0}.chat-message__head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.chat-message__head strong{font-size:12px}.chat-message__head small{color:#6f7784;font-size:10px}.chat-message__content,.chat-message__reasoning{color:#d9dce2;font-size:14px;line-height:1.75;overflow-wrap:anywhere}.chat-message.is-user .chat-message__content{display:inline-block;border:1px solid rgba(255,255,255,.08);border-radius:4px 14px 14px 14px;background:#292c32;padding:10px 13px}.chat-message__content p,.chat-message__reasoning p{margin:0 0 8px}.chat-message__content :is(h3,h4,h5,h6){margin:14px 0 7px}.chat-message__content :is(ul,ol){margin:8px 0;padding-left:22px}.chat-message__content blockquote{margin:8px 0;border-left:3px solid #efc050;background:#292c32;padding:8px 12px;color:#aeb4be}.chat-message__content a{color:#efc050}.chat-message__content code:not(.chat-code code){border-radius:5px;background:#15161a;padding:2px 5px;color:#ffd978}.chat-message details{margin:0 0 10px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:#1a1b20;padding:8px 10px}.chat-message summary{color:#8e96a2;font-size:11px;cursor:pointer}.chat-message__reasoning{margin-top:8px;color:#969da8;font-size:12px}.chat-code{overflow:hidden;margin:10px 0;border:1px solid rgba(255,255,255,.08);border-radius:11px;background:#141519}.chat-code>div{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#25272d;color:#8d94a0;font-size:10px}.chat-code button{border:0;background:transparent;color:#efc050;cursor:pointer}.chat-code pre{overflow:auto;margin:0;padding:14px}.chat-code code{font-family:Consolas,"SFMono-Regular",monospace;font-size:12px;line-height:1.65}.chat-message__actions{display:flex;align-items:center;gap:10px;margin-top:8px;color:#6f7784;font-size:10px}.chat-message__actions button{border:0;background:transparent;color:#8e96a2;padding:0;cursor:pointer}.chat-notice{min-height:18px;margin:0;padding:0 clamp(18px,5vw,70px);color:#efc050;font-size:11px}.chat-notice.is-error{color:#ff9292}.chat-composer{margin:8px clamp(18px,5vw,70px) 20px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:#292c32;padding:10px}.chat-composer:focus-within{border-color:rgba(239,192,80,.55);box-shadow:0 0 0 3px rgba(239,192,80,.08)}.chat-composer textarea{width:100%;max-height:180px;resize:none;border:0;background:transparent;color:#f4f4f5;outline:none;padding:2px 4px}.chat-composer>div{display:flex;align-items:center;justify-content:space-between;gap:10px}.chat-composer small{color:#737b87;font-size:10px}.chat-composer button{height:34px;border:0;border-radius:9px;background:#efc050;color:#17181c;padding:0 16px;font-weight:900;cursor:pointer}.chat-composer [data-chat-stop]{margin-left:auto;border:1px solid rgba(255,255,255,.1);background:#353840;color:#eef1f5}.chat-composer button:disabled{opacity:.4;cursor:not-allowed}.chat-delete-dialog{width:min(420px,calc(100vw - 30px));border:1px solid rgba(255,255,255,.12);border-radius:16px;background:#202228;color:#f4f4f5;padding:22px}.chat-delete-dialog::backdrop{background:rgba(6,7,10,.78)}.chat-delete-dialog h2{margin:0 0 8px}.chat-delete-dialog p{color:#9299a4}.chat-delete-dialog>div{display:flex;justify-content:flex-end;gap:8px}.chat-delete-dialog button{height:38px;border:1px solid rgba(255,255,255,.1);border-radius:9px;background:#292c32;color:#e5e7eb;padding:0 14px}.chat-delete-dialog .is-danger{color:#ffaaaa}
@media(max-width:900px){.chat-workspace{height:auto;min-height:720px;grid-template-columns:210px minmax(0,1fr)}.chat-messages{padding-inline:18px}.chat-composer{margin-inline:18px}}
@media(max-width:680px){.chat-workspace{min-height:calc(100vh - 180px);grid-template-columns:1fr;grid-template-rows:auto minmax(620px,1fr);overflow:visible}.chat-library{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}.chat-library__search{grid-column:2}.chat-conversations{grid-column:1/-1;display:flex;overflow:auto;padding-bottom:3px}.chat-conversation{min-width:170px}.chat-library__status{display:none}.chat-stage__header{padding-inline:12px}.chat-stage__header select{width:142px}.chat-messages{padding:18px 12px}.chat-composer{margin:8px 12px 14px}.chat-composer small{display:none}.chat-message{grid-template-columns:30px minmax(0,1fr);gap:8px}.chat-message__avatar{width:30px;height:30px}.chat-welcome h2{font-size:23px}}

/* Installation */
.installation-page {
  min-height: 100vh;
  margin: 0;
  color: var(--lz-install-text);
  background: var(--lz-install-canvas);
  font-family: var(--lz-font-sans);
  font-size: var(--lz-font-size-sm);
  line-height: var(--lz-line-height-normal);
}
.installation-page *,
.installation-page *::before,
.installation-page *::after {
  box-sizing: border-box;
}
.installation-page button,
.installation-page input {
  font: inherit;
}
.installation-viewport {
  display: grid;
  min-height: 100vh;
  padding: var(--lz-install-status-column);
  place-items: center;
}
.installation-shell {
  display: grid;
  grid-template-columns: var(--lz-install-aside-width) minmax(0, 1fr);
  width: min(var(--lz-install-shell-width), 100%);
  min-height: min(var(--lz-install-shell-min-height), calc(100vh - var(--lz-install-status-column) - var(--lz-install-status-column)));
  overflow: hidden;
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-shell-radius);
  background: var(--lz-install-surface);
  box-shadow: var(--lz-install-shadow);
}
.installation-aside {
  display: flex;
  flex-direction: column;
  gap: var(--lz-space-5);
  padding: var(--lz-space-6) var(--lz-space-5);
  border-right: var(--lz-border-width) solid var(--lz-install-border);
  background: var(--lz-install-surface-soft);
}
.installation-brand {
  display: flex;
  align-items: center;
  gap: var(--lz-space-3);
}
.installation-brand img {
  width: var(--lz-install-logo-size);
  height: var(--lz-install-logo-size);
  border-radius: var(--lz-install-control-radius);
  object-fit: contain;
}
.installation-brand div {
  display: grid;
}
.installation-brand strong {
  color: var(--lz-install-text);
  font-size: var(--lz-font-size-lg);
}
.installation-brand span {
  color: var(--lz-install-muted);
  font-size: var(--lz-font-size-xs);
}
.installation-progress {
  display: grid;
  gap: var(--lz-space-2);
}
.installation-progress button {
  display: flex;
  align-items: center;
  width: 100%;
  height: var(--lz-install-button-height);
  gap: var(--lz-space-2);
  padding: 0 var(--lz-space-3);
  color: var(--lz-install-muted);
  border: var(--lz-border-width) solid transparent;
  border-radius: var(--lz-install-control-radius);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: color var(--lz-install-motion-duration) var(--lz-install-motion-ease), background var(--lz-install-motion-duration) var(--lz-install-motion-ease), border-color var(--lz-install-motion-duration) var(--lz-install-motion-ease);
}
.installation-progress button:disabled {
  cursor: default;
}
.installation-progress button.is-active {
  color: var(--lz-install-primary);
  border-color: var(--lz-install-primary-border);
  background: var(--lz-install-primary-soft);
}
.installation-progress button.is-complete:not(.is-active) {
  color: var(--lz-install-text);
}
.installation-progress button span {
  display: grid;
  flex: 0 0 auto;
  width: var(--lz-space-5);
  height: var(--lz-space-5);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-install-border);
  color: currentColor;
  font-size: var(--lz-font-size-xs);
  place-items: center;
}
.installation-progress button strong {
  font-size: var(--lz-font-size-sm);
  font-weight: var(--lz-install-font-weight-medium);
}
.installation-aside-note {
  margin: auto 0 0;
  color: var(--lz-install-muted);
  font-size: var(--lz-font-size-xs);
  line-height: var(--lz-install-line-height-loose);
}
.installation-panel {
  display: flex;
  min-width: 0;
  flex-direction: column;
}
.installation-panel-header {
  display: flex;
  min-height: 78px;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-4);
  padding: var(--lz-space-5) var(--lz-install-status-column) var(--lz-space-4);
  border-bottom: var(--lz-border-width) solid var(--lz-install-border);
}
.installation-panel-header h1 {
  margin: 0;
  color: var(--lz-install-text);
  font-size: var(--lz-install-head-title-size);
  line-height: var(--lz-line-height-tight);
}
.installation-panel-header p {
  margin: var(--lz-space-1) 0 0;
  color: var(--lz-install-muted);
}
.installation-form {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: var(--lz-space-6) var(--lz-install-status-column);
}
.installation-step[hidden] {
  display: none;
}
.installation-step.is-active {
  animation: lz-install-enter var(--lz-install-motion-duration) var(--lz-install-motion-ease);
}
.installation-heading {
  display: none;
}
.installation-requirements,
.installation-progress-list {
  display: grid;
  gap: var(--lz-space-2);
}
.installation-requirement,
.installation-progress-row {
  display: grid;
  grid-template-columns: var(--lz-install-status-column) minmax(0, 1fr) auto;
  align-items: start;
  gap: var(--lz-space-3);
  padding: var(--lz-space-3);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-card-radius);
  background: var(--lz-install-surface-soft);
}
.installation-requirement-state,
.installation-progress-state {
  display: grid;
  width: var(--lz-space-5);
  height: var(--lz-space-5);
  color: var(--lz-install-muted);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-install-border);
  font-size: var(--lz-font-size-xs);
  font-weight: var(--lz-install-font-weight-black);
  place-items: center;
}
.installation-requirement.is-passed .installation-requirement-state,
.installation-progress-row[data-state="done"] .installation-progress-state {
  color: var(--lz-install-primary-text);
  background: var(--lz-install-success);
}
.installation-requirement.is-failed .installation-requirement-state,
.installation-progress-row[data-state="error"] .installation-progress-state {
  color: var(--lz-install-primary-text);
  background: var(--lz-install-danger);
}
.installation-progress-row[data-state="running"] .installation-progress-state {
  color: var(--lz-install-primary-text);
  background: var(--lz-install-primary);
}
.installation-requirement div,
.installation-progress-row div {
  display: grid;
  min-width: 0;
  gap: var(--lz-space-1);
}
.installation-requirement strong,
.installation-progress-row strong {
  color: var(--lz-install-text);
}
.installation-requirement small,
.installation-progress-row small {
  overflow-wrap: anywhere;
  color: var(--lz-install-muted);
  font-size: var(--lz-font-size-xs);
}
.installation-requirement em,
.installation-progress-row em {
  padding: var(--lz-space-1) var(--lz-space-2);
  color: var(--lz-install-muted);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-radius-pill);
  font-size: var(--lz-font-size-xs);
  font-style: normal;
  line-height: var(--lz-line-height-tight);
}
.installation-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--lz-space-4);
}
.installation-fields label {
  display: grid;
  gap: var(--lz-space-2);
  color: var(--lz-install-text);
  font-size: var(--lz-font-size-sm);
  font-weight: var(--lz-font-weight-bold);
}
.installation-fields label.is-wide {
  grid-column: 1 / -1;
}
.installation-fields input {
  width: 100%;
  height: var(--lz-install-input-height);
  padding: 0 var(--lz-space-3);
  color: var(--lz-install-text);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-control-radius);
  outline: none;
  background: var(--lz-install-field);
  transition: border-color var(--lz-install-motion-duration) var(--lz-install-motion-ease), box-shadow var(--lz-install-motion-duration) var(--lz-install-motion-ease);
}
.installation-fields input:focus,
.installation-fields select:focus {
  border-color: var(--lz-install-primary);
  box-shadow: var(--lz-install-focus-ring);
}
.installation-fields select {
  width: 100%;
  height: var(--lz-install-input-height);
  padding: 0 var(--lz-space-3);
  color: var(--lz-install-text);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-control-radius);
  outline: none;
  background: var(--lz-install-field);
}
.installation-asset-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--lz-space-4);
  margin-top: var(--lz-space-4);
}
.installation-asset {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--lz-space-3);
  padding: var(--lz-space-3);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-card-radius);
  background: var(--lz-install-surface-soft);
}
.installation-asset img {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  object-fit: contain;
  border-radius: var(--lz-install-control-radius);
}
.installation-asset div {
  display: grid;
  min-width: 0;
  gap: var(--lz-space-1);
}
.installation-asset strong,
.installation-asset small {
  overflow-wrap: anywhere;
}
.installation-asset small {
  color: var(--lz-install-muted);
  font-size: var(--lz-font-size-xs);
}
.installation-info-card {
  display: grid;
  grid-template-columns: var(--lz-install-info-icon-size) minmax(0, 1fr);
  align-items: start;
  gap: var(--lz-space-3);
  padding: var(--lz-space-4);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-card-radius);
  background: var(--lz-install-surface-soft);
}
.installation-info-card + .installation-info-card {
  margin-top: var(--lz-space-3);
}
.installation-info-icon {
  display: grid;
  width: var(--lz-install-button-height);
  height: var(--lz-install-button-height);
  color: var(--lz-install-primary);
  border-radius: var(--lz-install-control-radius);
  background: var(--lz-install-primary-soft);
  font-weight: var(--lz-font-weight-bold);
  place-items: center;
}
.installation-info-card strong {
  display: block;
}
.installation-info-card p {
  margin: var(--lz-space-1) 0;
  overflow-wrap: anywhere;
  color: var(--lz-install-text);
}
.installation-info-card small {
  color: var(--lz-install-muted);
}
.installation-alert {
  margin: var(--lz-space-4) 0 0;
  padding: var(--lz-space-3);
  color: var(--lz-install-success);
  border: var(--lz-border-width) solid var(--lz-install-success-border);
  border-radius: var(--lz-install-card-radius);
  background: var(--lz-install-success-soft);
}
.installation-alert.is-error {
  color: var(--lz-install-danger);
  border-color: var(--lz-install-danger-border);
  background: var(--lz-install-danger-soft);
}
.installation-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-3);
  margin-top: var(--lz-space-6);
  padding-top: var(--lz-space-4);
  border-top: var(--lz-border-width) solid var(--lz-install-border);
}
.installation-actions > div {
  display: flex;
  gap: var(--lz-space-2);
  margin-left: auto;
}
.installation-button {
  display: inline-flex;
  height: var(--lz-install-button-height);
  align-items: center;
  justify-content: center;
  padding: 0 var(--lz-space-4);
  color: var(--lz-install-text);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-install-control-radius);
  background: var(--lz-install-surface);
  font-weight: var(--lz-install-font-weight-medium);
  text-decoration: none;
  cursor: pointer;
}
.installation-button.is-primary {
  color: var(--lz-install-primary-text);
  border-color: var(--lz-install-primary);
  background: var(--lz-install-primary);
}
.installation-button.is-primary:hover:not(:disabled) {
  background: var(--lz-install-primary-hover);
}
.installation-button:disabled {
  cursor: not-allowed;
  opacity: var(--lz-install-disabled-opacity);
}
.installation-success {
  display: grid;
  min-height: 420px;
  text-align: center;
  place-items: center;
  align-content: center;
}
.installation-success-mark {
  display: grid;
  width: var(--lz-install-success-size);
  height: var(--lz-install-success-size);
  margin: 0 auto var(--lz-space-4);
  color: var(--lz-install-primary-text);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-install-success);
  font-size: var(--lz-install-success-font-size);
  font-weight: var(--lz-install-font-weight-black);
  place-items: center;
}
.installation-success h2 {
  margin: 0;
}
.installation-success p {
  margin: var(--lz-space-2) 0 var(--lz-space-5);
  color: var(--lz-install-muted);
}
.installation-installed {
  width: min(520px, calc(100vw - var(--lz-space-8)));
  padding: var(--lz-install-status-column);
  color: var(--lz-install-text);
  border: var(--lz-border-width) solid var(--lz-install-border);
  border-radius: var(--lz-space-4);
  background: var(--lz-install-surface);
  box-shadow: var(--lz-install-shadow);
  text-align: center;
}
.installation-installed img {
  width: var(--lz-install-installed-logo-size);
  height: var(--lz-install-installed-logo-size);
  object-fit: contain;
}
.installation-installed h1 {
  margin: var(--lz-space-4) 0 var(--lz-space-2);
  font-size: var(--lz-install-head-title-size);
}
.installation-installed p {
  margin: 0 0 var(--lz-space-5);
  color: var(--lz-install-muted);
}
@keyframes lz-install-enter {
  from { opacity: 0; transform: translateY(var(--lz-space-2)); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 820px) {
  .installation-viewport {
    padding: var(--lz-space-3);
    place-items: stretch;
  }
  .installation-shell {
    grid-template-columns: 1fr;
    min-height: calc(100vh - var(--lz-space-6));
    border-radius: var(--lz-space-3);
  }
  .installation-aside {
    gap: var(--lz-space-4);
    padding: var(--lz-space-4);
    border-right: 0;
    border-bottom: var(--lz-border-width) solid var(--lz-install-border);
  }
  .installation-progress {
    display: flex;
    overflow-x: auto;
    padding-bottom: var(--lz-space-1);
    scrollbar-width: none;
  }
  .installation-progress::-webkit-scrollbar {
    display: none;
  }
  .installation-progress button {
    width: auto;
    min-width: max-content;
  }
  .installation-aside-note {
    display: none;
  }
  .installation-panel-header {
    padding: var(--lz-space-4) var(--lz-space-4) var(--lz-space-3);
  }
  .installation-form {
    padding: var(--lz-space-4);
  }
  .installation-fields,
  .installation-asset-row {
    grid-template-columns: 1fr;
  }
  .installation-fields label.is-wide {
    grid-column: auto;
  }
  .installation-requirement,
  .installation-progress-row {
    grid-template-columns: var(--lz-space-6) minmax(0, 1fr);
  }
  .installation-requirement em,
  .installation-progress-row em {
    grid-column: 2;
    width: max-content;
  }
  .installation-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .installation-actions > span {
    display: none;
  }
  .installation-actions > div {
    width: 100%;
    margin-left: 0;
  }
  .installation-button {
    width: 100%;
  }
}
@media (prefers-reduced-motion: reduce) {
  .installation-step.is-active {
    animation: none;
  }
}

.front-profile-layer{position:fixed;inset:0;z-index:100040;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.72);backdrop-filter:blur(10px)}.front-profile-layer[hidden]{display:none}.front-profile-modal{width:min(366px,calc(100vw - 26px));max-height:calc(100dvh - 26px);overflow:auto;padding:0 20px;border:1px solid #2b2d34;border-radius:7px;background:#15161a;color:#f6f7fb;box-shadow:0 28px 90px rgba(0,0,0,.52)}.front-profile-modal::-webkit-scrollbar{width:0;height:0}.front-profile-toast{position:sticky;top:8px;z-index:2;margin:8px 0 -42px;padding:9px 12px;border:1px solid rgba(0,216,239,.38);border-radius:6px;background:#1d1f25;color:#00d7ef;font-size:12px;text-align:center}.front-profile-toast[data-toast-type=error]{border-color:rgba(255,93,93,.4);color:#ff8c8c}.front-profile-top{height:60px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #24262c}.front-profile-top h2{margin:0;color:#fff;font-size:20px;line-height:1.1;font-weight:900}.front-profile-top-actions{display:flex;align-items:center;gap:7px}.front-profile-close-btn{width:25px;height:25px;display:grid;place-items:center;padding:0;border:1px solid #343741;border-radius:5px;background:#24262d;color:#cbd5e1;font-size:18px;line-height:1;cursor:pointer}.front-profile-id{height:22px;display:inline-flex;align-items:center;gap:6px;padding:0 8px;border:1px solid rgba(0,216,239,.48);border-radius:5px;background:rgba(0,216,239,.1);color:#00d7ef;font-size:11px;font-weight:900;cursor:pointer}.front-profile-id i{width:11px;height:11px;position:relative;display:inline-block}.front-profile-id i::before,.front-profile-id i::after{content:"";position:absolute;border:1px solid #ff8b28;border-radius:2px}.front-profile-id i::before{left:2px;top:1px;width:6px;height:7px}.front-profile-id i::after{left:0;top:3px;width:6px;height:7px;background:#15161a}.front-profile-hero{display:grid;grid-template-columns:70px minmax(0,1fr);gap:14px;align-items:center;padding:20px 0 24px;border-bottom:1px solid #24262c}.front-profile-avatar-btn{width:64px;height:64px;padding:0;overflow:hidden;border:0;border-radius:50%;background:#090a0d;box-shadow:0 0 0 1px #23252b;cursor:pointer}.front-profile-avatar-img{width:100%;height:100%;display:grid;place-items:center;color:#fff;font-size:22px;font-weight:900}.front-profile-avatar-img img{width:100%;height:100%;display:block;object-fit:cover}.front-profile-name-row{display:flex;align-items:center;gap:7px;min-width:0}.front-profile-name-row strong{max-width:150px;overflow:hidden;color:#fff;font-size:17px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.front-profile-edit-btn{width:22px;height:22px;display:grid;place-items:center;border:0;border-radius:5px;background:#2d3036;color:#aeb5c2;font-size:12px;cursor:pointer}.front-profile-role{height:25px;display:inline-flex;align-items:center;margin-top:8px;padding:0 12px;border:1px solid rgba(255,218,0,.55);border-radius:999px;background:rgba(255,218,0,.1);color:#ffd800;font-size:12px;font-weight:900}.front-profile-list{display:grid;padding:16px 0;border-bottom:1px solid #24262c}.front-profile-row{min-height:70px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.front-profile-row-label{display:block;color:#8d929d;font-size:12px;font-weight:800;line-height:1.2}.front-profile-row-value{display:block;max-width:100%;margin-top:12px;overflow:hidden;color:#fff;font-size:13px;font-weight:900;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.front-profile-row-action{height:29px;min-width:53px;padding:0 13px;border:1px solid rgba(0,216,239,.52);border-radius:5px;background:rgba(0,216,239,.08);color:#00d7ef;font-size:12px;font-weight:900;cursor:pointer;white-space:nowrap}.front-profile-inline-panel{display:none;gap:9px;margin:-3px 0 12px;padding:12px;border:1px solid #2d3037;border-radius:8px;background:#1d1f25}.front-profile-inline-panel.is-open{display:grid}.front-profile-inline-panel label{display:grid;gap:6px;color:#aeb4c0;font-size:11px;font-weight:900}.front-profile-inline-panel input{height:36px;padding:0 10px;border:1px solid #343741;border-radius:6px;outline:0;background:#111216;color:#fff;font:13px inherit}.front-profile-inline-panel input:focus{border-color:#00d7ef;box-shadow:0 0 0 3px rgba(0,216,239,.1)}.front-profile-panel-actions{display:flex;justify-content:flex-end;gap:8px}.front-profile-panel-actions button{height:32px;padding:0 13px;border-radius:6px;font-size:12px;font-weight:900;cursor:pointer}.front-profile-panel-actions .secondary{border:1px solid #343741;background:#24262d;color:#cbd5e1}.front-profile-panel-actions .primary{border:1px solid rgba(0,216,239,.52);background:rgba(0,216,239,.12);color:#00d7ef}.front-profile-balance{min-height:68px;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center}.front-profile-balance-card{display:grid;gap:7px}.front-profile-balance-card span{color:#a2a6b0;font-size:12px;font-weight:800}.front-profile-balance-card strong{color:#00e5ff;font-size:18px;font-weight:900}.has-dialog{overflow:hidden}

:where(body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page) [data-front-creative-loader-surface] {
  position: relative;
  isolation: isolate;
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page.front-creative-page-loading
[data-front-creative-loader-surface] > :not([data-front-creative-page-loader]):not(script) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  user-select: none;
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page [data-front-creative-page-loader] {
  position: absolute;
  inset: 0;
  z-index: var(--lz-front-loader-layer);
  display: grid;
  place-items: center;
  box-sizing: border-box;
  margin: 0;
  padding: var(--lz-front-loader-padding);
  background: var(--lz-front-loader-surface);
  background-image: none;
  -webkit-backdrop-filter: var(--lz-front-loader-backdrop-filter);
  backdrop-filter: var(--lz-front-loader-backdrop-filter);
  color: var(--lz-front-loader-text);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity var(--lz-duration-normal) var(--lz-ease-standard), visibility var(--lz-duration-normal) var(--lz-ease-standard);
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page [data-front-creative-page-loader][hidden] {
  display: none;
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page [data-front-creative-page-loader].is-leaving {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page .front-creative-page-loader-status {
  display: grid;
  grid-template-columns: var(--lz-front-loader-spinner-size);
  justify-items: center;
  gap: var(--lz-front-loader-status-gap);
  color: inherit;
  text-align: center;
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page .front-creative-page-loader-spinner {
  box-sizing: border-box;
  width: var(--lz-front-loader-spinner-size);
  height: var(--lz-front-loader-spinner-size);
  display: block;
  border: var(--lz-front-loader-spinner-border-width) solid var(--lz-front-loader-spinner-track);
  border-top-color: var(--lz-front-loader-spinner-accent);
  border-radius: var(--lz-radius-pill);
  animation: frontCreativePageLoaderSpin var(--lz-front-loader-spin-duration) linear infinite;
}

body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page .front-creative-page-loader-text {
  color: inherit;
  -webkit-text-fill-color: currentColor;
  font-size: var(--lz-front-loader-font-size);
  font-weight: var(--lz-front-loader-font-weight);
  line-height: var(--lz-front-loader-line-height);
  letter-spacing: 0;
  white-space: nowrap;
}

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

@media (max-width: 900px) {
  body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page [data-front-creative-page-loader] {
    padding-inline: var(--lz-front-loader-mobile-padding-inline);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page [data-front-creative-page-loader] {
    transition: none;
  }

  body:is(.page-chat, .page-app, .page-video, .page-audio, .page-records, .page-gallery).front-creative-page .front-creative-page-loader-spinner {
    animation-duration: calc(var(--lz-front-loader-spin-duration) * 2.5);
  }
}

body:is(.page-chat,.page-app,.page-video,.page-audio,.page-records,.page-gallery).front-creative-page {
  --front-menu-expanded-width: 273px;
  --front-menu-collapsed-width: 72px;
  --front-menu-width: var(--front-menu-expanded-width);
  --front-menu-offset: 0px;
  --front-model-nav-primary-width: 78px;
  --front-model-nav-primary-height: 63px;
  --front-model-nav-primary-gap: 7px;
  --front-model-nav-type-width: 39px;
  --front-model-nav-type-height: 32px;
  --front-model-nav-search-width: 247px;
  --front-model-nav-search-height: 27px;
  --front-model-nav-card-width: 247px;
  --front-model-nav-card-height: 75px;
  --front-model-nav-icon-size: 38px;
  --front-model-nav-radius-large: 12px;
  --front-model-nav-radius-small: 8px;
  --front-menu-bg: #1b1c20;
  --front-menu-panel: rgba(31,34,40,.76);
  --front-menu-panel-strong: rgba(38,42,50,.82);
  --front-menu-line: rgba(255,255,255,.10);
  --front-menu-text: #f4f4f5;
  --front-menu-muted: #a8b0bd;
  --front-menu-item: #d9dde6;
  --front-menu-active-bg: rgba(46,52,64,.70);
  --front-menu-active-text: #fff;
  --front-menu-accent: #3b82f6;
  --front-menu-logo-bg: rgba(38,42,50,.70);
  --front-menu-button-bg: #2563eb;
  --front-menu-button-text: #fff;
  --front-menu-logo-surface: linear-gradient(145deg,rgba(48,53,64,.82),rgba(31,34,40,.74));
  --front-menu-logo-border: rgba(255,255,255,.12);
  --front-menu-logo-shadow: 0 10px 24px rgba(12,16,24,.24),inset 0 1px 0 rgba(255,255,255,.07);
  --front-menu-action-surface: linear-gradient(145deg,rgba(48,53,64,.82),rgba(31,34,40,.74));
  --front-menu-action-text: #f8fafc;
  --front-menu-action-border: rgba(255,255,255,.12);
  --front-menu-action-shadow: 0 10px 24px rgba(12,16,24,.24),inset 0 1px 0 rgba(255,255,255,.07);
  --front-model-nav-primary-surface: transparent;
  --front-model-nav-primary-hover-surface: rgba(255,255,255,.05);
  --front-model-nav-primary-text: rgba(255,255,255,.50);
  --front-model-nav-primary-hover-text: rgba(255,255,255,.70);
  --front-model-nav-model-active-surface: linear-gradient(135deg,rgba(0,202,224,.15),rgba(0,168,204,.10));
  --front-model-nav-model-active-text: #00cae0;
  --front-model-nav-records-active-surface: linear-gradient(135deg,rgba(168,85,247,.15),rgba(139,92,246,.10));
  --front-model-nav-records-active-text: #a855f7;
  --front-model-nav-gallery-active-surface: linear-gradient(135deg,rgba(236,72,153,.15),rgba(219,39,113,.10));
  --front-model-nav-gallery-active-text: #f472b6;
  --front-model-nav-type-active: #00cae0;
  --front-model-nav-search-surface: rgba(255,255,255,.055);
  --front-model-nav-search-line: rgba(255,255,255,.075);
  --front-model-nav-tag-surface: rgba(255,255,255,.055);
  --front-model-nav-tag-line: rgba(255,255,255,.09);
  --front-model-nav-tag-chat-surface: rgba(34,211,238,.12);
  --front-model-nav-tag-chat-line: rgba(34,211,238,.25);
  --front-model-nav-tag-chat-text: #67e8f9;
  --front-model-nav-tag-image-surface: rgba(167,139,250,.12);
  --front-model-nav-tag-image-line: rgba(167,139,250,.24);
  --front-model-nav-tag-image-text: #c4b5fd;
  --front-model-nav-tag-video-surface: rgba(251,113,133,.12);
  --front-model-nav-tag-video-line: rgba(251,113,133,.24);
  --front-model-nav-tag-video-text: #fda4af;
  --front-model-nav-tag-audio-surface: rgba(251,191,36,.12);
  --front-model-nav-tag-audio-line: rgba(251,191,36,.24);
  --front-model-nav-tag-audio-text: #fcd34d;
  --front-model-nav-scroll-thumb: rgba(168,176,189,.24);
  --front-model-nav-hover-surface: rgba(255,255,255,.035);
  --front-model-nav-title-text: #f8fafc;
  --front-model-nav-description-text: #b8c0cc;
  --front-model-nav-icon-surface: #24262c;
  --front-model-nav-monochrome-opacity: 1;
  --front-model-nav-active-surface: linear-gradient(90deg,rgba(0,202,224,.34),rgba(0,202,224,.08));
  --front-model-nav-active-accent: #00cae0;
  --front-account-surface: linear-gradient(145deg,rgba(45,47,53,.96),rgba(29,31,36,.98));
  --front-account-line: rgba(255,255,255,.11);
  --front-account-shadow: 0 14px 32px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06);
  --front-recharge-idle-bg: linear-gradient(135deg,rgba(75,65,45,.96),rgba(50,46,40,.98));
  --front-recharge-idle-line: rgba(244,190,84,.34);
  --front-recharge-idle-text: #ffe5ad;
  --front-recharge-idle-muted: #d4b97e;
  --front-recharge-idle-icon: rgba(255,213,126,.14);
  --front-recharge-active-bg: linear-gradient(135deg,#a93b31 0%,#842d29 52%,#5f2626 100%);
  --front-recharge-active-line: rgba(255,211,124,.58);
  --front-recharge-active-text: #fff9e9;
  --front-recharge-active-muted: #a1a1aa;
  --front-recharge-active-icon: rgba(255,231,174,.18);
  --front-recharge-active-shadow: 0 14px 30px rgba(122,33,31,.34),inset 0 1px 0 rgba(255,255,255,.14);
  --front-workspace-bg: #1b1c20;
  color: var(--front-menu-text);
  background: var(--front-workspace-bg);
}

body:is(.page-chat,.page-app,.page-video,.page-audio,.page-records,.page-gallery).front-creative-page .app-layout {
  align-items: stretch;
  background: var(--front-workspace-bg);
  z-index: 1;
}

html.jn-light-mode body.front-creative-page,
html[data-theme="light"] body.front-creative-page,
body.front-creative-page.jn-light-mode,
body.front-creative-page[data-theme="light"] {
  --front-menu-bg: #fff;
  --front-menu-panel: #f8fafc;
  --front-menu-panel-strong: #eef2f7;
  --front-menu-line: rgba(15,23,42,.12);
  --front-menu-text: #0f172a;
  --front-menu-muted: #64748b;
  --front-menu-item: #334155;
  --front-menu-active-bg: #eaf3ff;
  --front-menu-active-text: #1d4ed8;
  --front-menu-accent: #2563eb;
  --front-menu-logo-bg: #eef6ff;
  --front-menu-button-bg: #2563eb;
  --front-menu-button-text: #fff;
  --front-menu-logo-surface: linear-gradient(145deg,#fff,#eef6ff);
  --front-menu-logo-border: rgba(37,99,235,.16);
  --front-menu-logo-shadow: 0 10px 22px rgba(37,99,235,.12),inset 0 1px 0 rgba(255,255,255,.96);
  --front-menu-action-surface: linear-gradient(145deg,#fff,#f4f8ff);
  --front-menu-action-text: #0f172a;
  --front-menu-action-border: rgba(15,23,42,.12);
  --front-menu-action-shadow: 0 8px 18px rgba(15,23,42,.09),inset 0 1px 0 rgba(255,255,255,.95);
  --front-model-nav-primary-surface: transparent;
  --front-model-nav-primary-hover-surface: rgba(15,23,42,.05);
  --front-model-nav-primary-text: rgba(15,23,42,.50);
  --front-model-nav-primary-hover-text: rgba(15,23,42,.70);
  --front-model-nav-model-active-surface: linear-gradient(135deg,rgba(0,202,224,.15),rgba(0,168,204,.10));
  --front-model-nav-model-active-text: #009bb0;
  --front-model-nav-records-active-surface: linear-gradient(135deg,rgba(168,85,247,.15),rgba(139,92,246,.10));
  --front-model-nav-records-active-text: #8b5cf6;
  --front-model-nav-gallery-active-surface: linear-gradient(135deg,rgba(236,72,153,.15),rgba(219,39,113,.10));
  --front-model-nav-gallery-active-text: #db2777;
  --front-model-nav-type-active: #0284c7;
  --front-model-nav-search-surface: rgba(15,23,42,.045);
  --front-model-nav-search-line: rgba(15,23,42,.075);
  --front-model-nav-tag-surface: rgba(255,255,255,.7);
  --front-model-nav-tag-line: rgba(15,23,42,.1);
  --front-model-nav-tag-chat-surface: #ecfeff;
  --front-model-nav-tag-chat-line: #a5f3fc;
  --front-model-nav-tag-chat-text: #0e7490;
  --front-model-nav-tag-image-surface: #f5f3ff;
  --front-model-nav-tag-image-line: #ddd6fe;
  --front-model-nav-tag-image-text: #6d28d9;
  --front-model-nav-tag-video-surface: #fff1f2;
  --front-model-nav-tag-video-line: #fecdd3;
  --front-model-nav-tag-video-text: #be123c;
  --front-model-nav-tag-audio-surface: #fffbeb;
  --front-model-nav-tag-audio-line: #fde68a;
  --front-model-nav-tag-audio-text: #a16207;
  --front-model-nav-scroll-thumb: rgba(100,116,139,.26);
  --front-model-nav-hover-surface: rgba(15,23,42,.04);
  --front-model-nav-title-text: #0b1220;
  --front-model-nav-description-text: #475569;
  --front-model-nav-icon-surface: #f8fafc;
  --front-model-nav-monochrome-opacity: 1;
  --front-model-nav-active-surface: linear-gradient(90deg,rgba(14,165,233,.18),rgba(14,165,233,.04));
  --front-model-nav-active-accent: #0284c7;
  --front-account-surface: linear-gradient(145deg,#fff,#f5f6f8);
  --front-account-line: rgba(15,23,42,.12);
  --front-account-shadow: 0 12px 28px rgba(15,23,42,.10),inset 0 1px 0 rgba(255,255,255,.96);
  --front-recharge-idle-bg: linear-gradient(135deg,#fff9ed,#f6edda);
  --front-recharge-idle-line: rgba(180,124,31,.32);
  --front-recharge-idle-text: #7b4b0d;
  --front-recharge-idle-muted: #946d31;
  --front-recharge-idle-icon: rgba(190,132,36,.12);
  --front-recharge-active-bg: linear-gradient(135deg,#b84436 0%,#97342e 52%,#7a2b2a 100%);
  --front-recharge-active-line: rgba(133,52,38,.44);
  --front-recharge-active-text: #fffaf0;
  --front-recharge-active-muted: #ffe1a8;
  --front-recharge-active-icon: rgba(255,237,192,.18);
  --front-recharge-active-shadow: 0 14px 28px rgba(151,52,46,.24),inset 0 1px 0 rgba(255,255,255,.20);
  --front-workspace-bg: #f7f8fb;
}

body.front-creative-page.front-creative-menu-collapsed {
  --front-menu-width: var(--front-menu-collapsed-width);
}

body:is(.page-chat,.page-app,.page-video,.page-audio,.page-records,.page-gallery).front-creative-page.has-front-creative-menu {
  --front-menu-offset: var(--front-menu-width);
}

.front-creative-menu {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 120;
  width: var(--front-menu-width);
  height: 100vh;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: 11px;
  background: var(--front-menu-bg);
  border-right: 1px solid var(--front-menu-line);
  color: var(--front-menu-text);
  overflow: hidden;
  transition: width .18s ease,padding .18s ease;
}

.front-creative-head {
  min-height: 58px;
  display: grid;
  grid-template-columns: minmax(0,1fr) 34px;
  align-items: center;
  gap: 8px;
}

.front-creative-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}

.front-creative-logo {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  padding: 3px;
  overflow: hidden;
  border: 1px solid var(--front-menu-logo-border);
  border-radius: 12px;
  background: var(--front-menu-logo-surface);
  box-shadow: var(--front-menu-logo-shadow);
}

.front-creative-logo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  border-radius: 9px;
  background: transparent;
}

.front-creative-brand-text {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.front-creative-brand-text strong {
  min-width: 0;
  overflow: hidden;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.front-creative-brand-text small {
  color: var(--front-menu-muted);
  font-size: 12px;
}

.front-creative-toggle {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--front-menu-action-border);
  border-radius: 10px;
  background: var(--front-menu-action-surface);
  color: var(--front-menu-action-text);
  box-shadow: var(--front-menu-action-shadow);
  cursor: pointer;
}

.front-creative-toggle svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .18s ease;
}

.front-creative-nav {
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 0;
  overflow: auto;
}

.front-creative-nav-item {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--front-menu-item);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}

.front-creative-nav-item svg {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
}

.front-creative-nav-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.front-creative-nav-item.is-active {
  border-color: var(--front-menu-line);
  background: var(--front-menu-active-bg);
  color: var(--front-menu-active-text);
  box-shadow: inset 3px 0 0 var(--front-menu-accent);
}

.front-creative-account {
  position: relative;
  min-width: 0;
  margin-top: auto;
  display: grid;
  gap: 8px;
  padding-top: 13px;
  border-top: 1px solid var(--front-menu-line);
  isolation: isolate;
}

.front-creative-account-main {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0,1fr);
  align-items: center;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--front-account-line);
  border-radius: 8px;
  background: var(--front-account-surface);
  box-shadow: var(--front-account-shadow);
}

.front-creative-profile {
  width: 100%;
  min-width: 0;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 9px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--front-menu-text);
  box-shadow: none;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.front-creative-avatar {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  overflow: hidden;
  border-radius: 50%;
  background: var(--front-menu-button-bg);
  color: var(--front-menu-button-text);
  font-weight: 900;
}

.front-creative-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.front-creative-profile-text {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.front-creative-profile-text > strong {
  min-width: 0;
  overflow: hidden;
  font-size: 13px;
  font-weight: 850;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.front-creative-profile-balance {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 5px;
  overflow: hidden;
  line-height: 14px;
  white-space: nowrap;
  color: var(--front-menu-muted);
}

.front-creative-profile-balance small {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
}

.front-creative-profile-balance b {
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 3px;
  color: var(--front-menu-text);
  font-size: 12px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  line-height: 14px;
  white-space: nowrap;
}

.front-creative-profile-balance em {
  color: var(--front-menu-muted);
  font-size: 9px;
  font-style: normal;
}

.front-creative-account-actions {
  min-width: 0;
  display: block;
}

.front-creative-recharge {
  position: relative;
  width: 100%;
  min-width: 0;
  height: 54px;
  min-height: 54px;
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) auto 14px;
  align-items: center;
  justify-content: stretch;
  gap: 8px;
  padding: 7px 10px;
  overflow: hidden;
  border: 1px solid var(--front-recharge-idle-line);
  border-radius: 8px;
  background: var(--front-recharge-idle-bg);
  color: var(--front-recharge-idle-text);
  box-shadow: 0 12px 24px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.08);
  text-align: left;
  font-weight: 900;
  line-height: 16px;
  isolation: isolate;
  transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease;
  cursor: pointer;
}

.front-creative-recharge:hover,
.front-creative-recharge:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(255,213,126,.58);
  box-shadow: 0 15px 28px rgba(0,0,0,.23),inset 0 1px 0 rgba(255,255,255,.12);
  outline: none;
}

.front-creative-recharge.has-recharge-activity {
  grid-template-columns: 34px minmax(0,1fr);
  gap: 7px;
  border-color: var(--front-recharge-active-line);
  background: var(--front-recharge-active-bg);
  background-image: var(--front-recharge-active-bg);
  color: var(--front-recharge-active-text);
  -webkit-text-fill-color: var(--front-recharge-active-text);
  box-shadow: var(--front-recharge-active-shadow);
  animation: front-recharge-activity-breathe 3.2s ease-in-out infinite;
}

.front-creative-recharge.has-recharge-activity::before {
  content: "";
  position: absolute;
  inset: -40% auto -40% -42%;
  z-index: -1;
  width: 34%;
  background: linear-gradient(90deg,transparent,rgba(255,244,210,.24),transparent);
  transform: skewX(-18deg);
  animation: front-recharge-activity-shine 3.8s ease-in-out infinite;
  pointer-events: none;
}

.front-creative-recharge-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  flex: 0 0 36px;
  border: 1px solid rgba(255, 226, 162, .2);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,190,74,.06));
  color: inherit;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 7px 16px rgba(64,35,8,.16);
  overflow: visible;
}

.front-creative-recharge-icon img {
  width: 34px;
  height: 34px;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 4px 5px rgba(67, 36, 7, .18));
  transform: translateY(-1px);
}

.front-creative-recharge-arrow svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.has-recharge-activity .front-creative-recharge-icon {
  background: linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,190,74,.11));
  border-color: rgba(255,235,190,.28);
}

.has-recharge-activity .front-creative-recharge-icon img {
  filter: drop-shadow(0 4px 6px rgba(67, 36, 7, .2)) saturate(1.08);
}

.front-creative-recharge-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.front-creative-recharge-copy strong {
  overflow: hidden;
  font-size: 13px;
  font-weight: 900;
  line-height: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.front-creative-recharge-copy small {
  overflow: hidden;
  color: var(--front-recharge-idle-muted);
  font-size: 10px;
  font-weight: 650;
  line-height: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.has-recharge-activity .front-creative-recharge-copy small {
  color: var(--front-recharge-active-muted);
  -webkit-text-fill-color: var(--front-recharge-active-muted);
  overflow: visible;
  text-overflow: clip;
}

html body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-recharge-copy small,
body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-recharge-copy small {
  color: var(--front-recharge-idle-muted);
  -webkit-text-fill-color: var(--front-recharge-idle-muted);
}

html body.front-creative-page:not(.page-admin) .front-creative-account .has-recharge-activity .front-creative-recharge-copy small,
body.front-creative-page:not(.page-admin) .front-creative-account .has-recharge-activity .front-creative-recharge-copy small {
  color: var(--front-recharge-active-muted);
  -webkit-text-fill-color: var(--front-recharge-active-muted);
  overflow: visible;
  text-overflow: clip;
}

.has-recharge-activity .front-creative-recharge-copy strong {
  padding-right: 52px;
}

.front-creative-recharge-badge {
  position: absolute;
  top: 7px;
  right: 7px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  padding: 4px 6px;
  border: 1px solid rgba(255,235,190,.28);
  border-radius: 999px;
  background: rgba(68,15,17,.26);
  color: #fff4d2;
  -webkit-text-fill-color: #fff4d2;
  font-size: 9px;
  font-weight: 900;
  line-height: 12px;
  white-space: nowrap;
}

.front-creative-recharge-badge[hidden] {
  display: none;
}

.front-creative-recharge-badge i {
  width: 5px;
  height: 5px;
  flex: 0 0 5px;
  border-radius: 50%;
  background: #ffd46f;
  box-shadow: 0 0 0 3px rgba(255,212,111,.13);
  animation: front-recharge-activity-dot 1.6s ease-in-out infinite;
}

.front-creative-recharge-arrow {
  width: 14px;
  height: 20px;
  display: grid;
  place-items: center;
}

.front-creative-recharge-arrow svg {
  width: 14px;
  height: 14px;
}

.front-creative-recharge.has-recharge-activity .front-creative-recharge-arrow {
  display: none;
}

@keyframes front-recharge-activity-breathe {
  0%,100% { filter: saturate(1); box-shadow: var(--front-recharge-active-shadow); }
  50% { filter: saturate(1.08); box-shadow: 0 16px 34px rgba(148,42,37,.42),inset 0 1px 0 rgba(255,255,255,.16); }
}

@keyframes front-recharge-activity-shine {
  0%,58% { left: -42%; opacity: 0; }
  66% { opacity: 1; }
  86%,100% { left: 112%; opacity: 0; }
}

@keyframes front-recharge-activity-dot {
  0%,100% { opacity: .65; transform: scale(.88); }
  50% { opacity: 1; transform: scale(1.12); }
}

@media (prefers-reduced-motion: reduce) {
  .front-creative-recharge.has-recharge-activity,
  .front-creative-recharge.has-recharge-activity::before,
  .front-creative-recharge-badge i {
    animation: none;
  }
}

body:is(.page-chat,.page-app,.page-video,.page-audio,.page-records,.page-gallery).front-creative-page .app-layout {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  display: block;
  overflow: hidden;
  background: var(--front-workspace-bg);
}

body:is(.page-chat,.page-app,.page-video,.page-audio,.page-records,.page-gallery).front-creative-page .main-area {
  flex: 1 1 0%;
  width: calc(100% - var(--front-menu-offset));
  max-width: calc(100% - var(--front-menu-offset));
  min-height: 100vh;
  min-height: 100dvh;
  margin-left: var(--front-menu-offset);
  padding: 0;
  overflow: hidden;
  background: var(--front-workspace-bg);
  transition: margin-left var(--duration-normal) var(--ease-out-expo);
}

.workspace-mobile-header,
.workspace-module__heading {
  display: none;
}

.workspace-main {
  min-height: 100dvh;
  display: block;
  padding: 0;
}

.workspace-module {
  width: 100%;
  display: block;
}

.front-quick-drawer {
  position: fixed;
  top: 18px;
  right: 20px;
  z-index: 100080;
  width: 51px;
  height: 51px;
  display: grid;
  grid-template-columns: repeat(2,7px);
  place-content: center;
  gap: 4px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  background: radial-gradient(120% 120% at 30% 25%,rgba(255,255,255,.08),rgba(255,255,255,0) 65%),linear-gradient(155deg,rgba(30,32,40,.85),rgba(20,22,28,.85));
  box-shadow: 0 8px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08);
  cursor: pointer;
}

html.jn-light-mode .front-quick-drawer,
html[data-theme="light"] .front-quick-drawer,
body.jn-light-mode .front-quick-drawer {
  border-color: rgba(15,23,42,.12);
  background: radial-gradient(120% 120% at 30% 22%,rgba(255,255,255,.92),rgba(255,255,255,0) 65%),linear-gradient(155deg,rgba(255,255,255,.96),rgba(236,241,248,.96));
  box-shadow: 0 8px 22px rgba(15,23,42,.14),inset 0 1px 0 rgba(255,255,255,.98);
}

.front-quick-drawer span {
  width: 7px;
  height: 7px;
  border-radius: 2px;
}

.front-quick-drawer span:nth-child(1) { background: #ffca28; }
.front-quick-drawer span:nth-child(2) { background: #8b5cf6; }
.front-quick-drawer span:nth-child(3) { background: #22d3ee; }
.front-quick-drawer span:nth-child(4) { background: #22c55e; }

.workspace-backdrop {
  position: fixed;
  inset: 0;
  z-index: 110;
  background: rgba(0,0,0,.58);
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-menu,
body.front-creative-page.is-sidebar-collapsed .front-creative-menu {
  padding: 10px;
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-head,
body.front-creative-page.is-sidebar-collapsed .front-creative-head {
  grid-template-columns: 1fr;
  gap: 8px;
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-brand,
body.front-creative-page.is-sidebar-collapsed .front-creative-brand {
  justify-content: center;
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-brand-text,
body.front-creative-page.front-creative-menu-collapsed .front-creative-nav-label,
body.front-creative-page.is-sidebar-collapsed .front-creative-brand-text,
body.front-creative-page.is-sidebar-collapsed .front-creative-nav-label {
  display: none;
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-nav-item,
body.front-creative-page.is-sidebar-collapsed .front-creative-nav-item {
  justify-content: center;
  padding: 0;
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-toggle,
body.front-creative-page.is-sidebar-collapsed .front-creative-toggle {
  justify-self: center;
}

body.front-creative-page.front-creative-menu-collapsed .front-creative-toggle svg,
body.front-creative-page.is-sidebar-collapsed .front-creative-toggle svg {
  transform: rotate(180deg);
}

@media (min-width: 901px) {
  body.front-creative-page.front-creative-menu-collapsed .front-creative-account,
  body.front-creative-page.is-sidebar-collapsed .front-creative-account {
    width: 51px;
    gap: 7px;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-account-main,
  body.front-creative-page.is-sidebar-collapsed .front-creative-account-main {
    width: 51px;
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-profile,
  body.front-creative-page.is-sidebar-collapsed .front-creative-profile {
    width: 51px;
    height: 51px;
    justify-content: center;
    padding: 0;
    border: 1px solid var(--front-account-line);
    border-radius: 8px;
    background: var(--front-account-surface);
    box-shadow: var(--front-account-shadow);
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-avatar,
  body.front-creative-page.is-sidebar-collapsed .front-creative-avatar {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-profile-text,
  body.front-creative-page.is-sidebar-collapsed .front-creative-profile-text {
    display: none;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge {
    width: 51px;
    height: 56px;
    min-height: 56px;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 25px 15px;
    gap: 3px;
    place-items: center;
    padding: 6px 3px;
    text-align: center;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-icon,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-icon {
    width: 25px;
    height: 25px;
    border: 0;
    background: transparent;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-icon img,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-icon img {
    width: 24px;
    height: 24px;
    transform: none;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-copy,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-copy {
    display: block;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-copy strong,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-copy strong {
    font-size: 0;
    line-height: 15px;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-copy strong::after,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-copy strong::after {
    content: "充值";
    font-size: 10px;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-copy small,
  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-arrow,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-copy small,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-arrow {
    display: none;
  }

  body.front-creative-page.front-creative-menu-collapsed .has-recharge-activity .front-creative-recharge-copy,
  body.front-creative-page.is-sidebar-collapsed .has-recharge-activity .front-creative-recharge-copy {
    display: none;
  }

  body.front-creative-page.front-creative-menu-collapsed .front-creative-recharge-badge,
  body.front-creative-page.is-sidebar-collapsed .front-creative-recharge-badge {
    position: static;
    top: auto;
    right: auto;
    grid-row: 2;
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 9px;
    line-height: 13px;
  }
}

@media (max-width: 900px) {
  body.front-creative-page {
    --front-menu-expanded-width: min(273px,84vw);
    --front-menu-collapsed-width: 0px;
    --front-menu-width: 0px;
    --front-menu-offset: 0px;

  }

  body.front-creative-page.has-front-creative-menu.front-creative-menu-collapsed,
  body.front-creative-page.has-front-creative-menu.is-sidebar-collapsed {
    --front-menu-width: 0px;
    --front-menu-offset: 0px;

  }

  body.front-creative-page.front-creative-menu-expanded {
    --front-menu-width: var(--front-menu-expanded-width);
  }

  body:is(.page-chat,.page-app,.page-video,.page-audio,.page-records,.page-gallery).front-creative-page .main-area {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }

  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-menu {
    width: 0;
    min-width: 0;
    max-width: 0;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
    pointer-events: none;
  }

  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-head {
    display: block;
    min-height: 0;
  }

  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-brand,
  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-nav,
  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-account {
    display: none;
  }

  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-toggle {
    position: fixed;
    top: 16px;
    left: 12px;
    z-index: 100090;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid var(--front-menu-action-border);
    border-radius: 12px;
    background: var(--front-menu-action-surface);
    color: var(--front-menu-action-text);
    box-shadow: var(--front-menu-action-shadow);
    pointer-events: auto;
  }

  body.front-creative-page:not(.front-creative-menu-expanded) .front-creative-toggle svg {
    transform: rotate(180deg);
  }

  body.front-creative-page.front-creative-menu-expanded .front-creative-menu,
  body.front-creative-page.is-mobile-menu-open .front-creative-menu {
    width: var(--front-menu-expanded-width);
    max-width: var(--front-menu-expanded-width);
    transform: translateX(0);
    padding: 10px;
    overflow: hidden;
    border-right: 1px solid var(--front-menu-line);
    background: var(--front-menu-bg);
    box-shadow: 18px 0 50px rgba(12,16,24,.24);
    pointer-events: auto;
  }

  .front-quick-drawer {
    top: 10px;
    right: 10px;
    width: 46px;
    height: 46px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  html.jn-theme-switching::view-transition-old(root),
  html.jn-theme-switching::view-transition-new(root) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.22,1,.36,1);
    mix-blend-mode: normal;
  }

  html.jn-theme-switching::view-transition-old(root) {
    animation: none;
  }

  html.jn-theme-switching::view-transition-new(root) {
    animation: jnThemeRevealFromTopRight .48s cubic-bezier(.22,1,.36,1) both;
  }
}

@keyframes jnThemeRevealFromTopRight {
  from {
    clip-path: circle(0 at var(--jn-theme-x,calc(100% - 34px)) var(--jn-theme-y,34px));
  }

  to {
    clip-path: circle(var(--jn-theme-r,150vmax) at var(--jn-theme-x,calc(100% - 34px)) var(--jn-theme-y,34px));
  }
}

.jn-theme-transition-wipe {
  position: fixed;
  inset: 0;
  z-index: var(--lz-z-theme-transition);
  pointer-events: none;
  background: var(--lz-theme-transition-dark);
  clip-path: circle(0 at var(--jn-theme-x,calc(100% - 34px)) var(--jn-theme-y,34px));
  -webkit-clip-path: circle(0 at var(--jn-theme-x,calc(100% - 34px)) var(--jn-theme-y,34px));
  transition: clip-path .46s cubic-bezier(.22,1,.36,1),-webkit-clip-path .46s cubic-bezier(.22,1,.36,1),opacity .16s ease;
  opacity: 1;
}

.jn-theme-transition-wipe.is-light-target {
  background: var(--lz-theme-transition-light);
}

body.page-admin .jn-theme-transition-wipe.is-dark-target {
  background: var(--lz-theme-transition-admin-dark);
}

body.front-creative-page .jn-theme-transition-wipe.is-dark-target {
  background: var(--lz-theme-transition-creative-dark);
}

.jn-theme-transition-wipe.is-active {
  clip-path: circle(var(--jn-theme-r,150vmax) at var(--jn-theme-x,calc(100% - 34px)) var(--jn-theme-y,34px));
  -webkit-clip-path: circle(var(--jn-theme-r,150vmax) at var(--jn-theme-x,calc(100% - 34px)) var(--jn-theme-y,34px));
}

.jn-theme-transition-wipe.is-complete {
  opacity: 0;
}

body.front-creative-page .ai-draw-prompt-preview-modal {
  position: fixed;
  inset: 0;
  z-index: var(--lz-creative-prompt-layer);
  padding: var(--lz-space-5);
  display: grid;
  place-items: center;
  background: var(--lz-media-player-overlay);
  opacity: 0;
  transition: opacity var(--lz-duration-normal) var(--lz-ease-standard);
}
body.front-creative-page .ai-draw-prompt-preview-modal.is-open { opacity: 1; }
body.front-creative-page .ai-draw-prompt-preview-panel {
  width: min(100%, var(--lz-creative-prompt-width));
  max-height: var(--lz-creative-prompt-max-height);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  border: 1px solid var(--lz-front-param-panel-border);
  border-radius: var(--lz-radius-md);
  background: var(--lz-front-param-panel);
  color: var(--lz-front-composer-text);
  box-shadow: var(--lz-front-param-shadow);
  transform: translateY(var(--lz-space-2)) scale(.985);
  transition: transform var(--lz-duration-normal) var(--lz-ease-standard);
}
body.front-creative-page .ai-draw-prompt-preview-modal.is-open .ai-draw-prompt-preview-panel { transform: none; }
body.front-creative-page .ai-draw-prompt-preview-panel header {
  min-height: var(--lz-creative-prompt-header-height);
  padding: var(--lz-space-3) var(--lz-space-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-4);
  border-bottom: 1px solid var(--lz-front-param-panel-border);
}
body.front-creative-page .ai-draw-prompt-preview-panel header > div { display: grid; gap: var(--lz-space-1); }
body.front-creative-page .ai-draw-prompt-preview-panel header strong { color: var(--lz-front-composer-text); font-size: var(--lz-font-size-md); line-height: var(--lz-line-height-tight); }
body.front-creative-page .ai-draw-prompt-preview-panel header span { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); line-height: var(--lz-line-height-tight); }
body.front-creative-page .ai-draw-prompt-preview-panel header button {
  width: var(--lz-control-height-sm);
  min-width: var(--lz-control-height-sm);
  height: var(--lz-control-height-sm);
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--lz-front-composer-border);
  border-radius: var(--lz-radius-sm);
  background: var(--lz-front-composer-control);
  color: var(--lz-front-composer-text);
  cursor: pointer;
}
body.front-creative-page .ai-draw-prompt-preview-panel header svg { width: var(--lz-icon-size-md); height: var(--lz-icon-size-md); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
body.front-creative-page .ai-draw-prompt-preview-content {
  min-height: var(--lz-creative-prompt-content-min-height);
  padding: var(--lz-space-5);
  overflow: auto;
  color: var(--lz-front-composer-text);
  font-size: var(--lz-font-size-md);
  line-height: var(--lz-line-height-normal);
  white-space: pre-wrap;
  word-break: break-word;
}
body.front-creative-page .ai-draw-prompt-preview-panel footer {
  min-height: var(--lz-creative-prompt-footer-height);
  padding: var(--lz-space-3) var(--lz-space-4);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-top: 1px solid var(--lz-front-param-panel-border);
}
body.front-creative-page .ai-draw-prompt-preview-panel footer button {
  height: var(--lz-control-height-sm);
  padding: 0 var(--lz-space-3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--lz-space-2);
  border: 1px solid var(--lz-front-composer-border);
  border-radius: var(--lz-radius-sm);
  background: var(--lz-front-composer-control);
  color: var(--lz-front-composer-text);
  font-size: var(--lz-font-size-xs);
  font-weight: 600;
  cursor: pointer;
}
body.front-creative-page .ai-draw-prompt-preview-panel :is(header button, footer button):hover { background: var(--lz-front-param-panel-hover); }
body.front-creative-page .ai-draw-prompt-preview-panel footer svg { width: var(--lz-icon-size-md); height: var(--lz-icon-size-md); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 520px) {
  body.front-creative-page .ai-draw-prompt-preview-modal { padding: var(--lz-space-3); }
  body.front-creative-page .ai-draw-prompt-preview-panel { max-height: calc(100dvh - (var(--lz-space-3) * 2)); }
  body.front-creative-page .ai-draw-prompt-preview-content { min-height: var(--lz-creative-prompt-mobile-content-min-height); padding: var(--lz-space-4); font-size: var(--lz-font-size-sm); }
  body.front-creative-page .ai-draw-prompt-preview-panel footer button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  body.front-creative-page .ai-draw-prompt-preview-modal,
  body.front-creative-page .ai-draw-prompt-preview-panel { transition: none; }
}

.page-app {
  --front-video-chat-bg: var(--lz-front-workspace-bg);
  --front-composer-panel: var(--lz-front-composer-panel);
  --front-composer-line: var(--lz-front-composer-border);
  --front-composer-control: var(--lz-front-composer-control);
  --front-composer-control-line: var(--lz-front-composer-control-border);
  --front-composer-text: var(--lz-front-composer-text);
  --front-composer-muted: var(--lz-front-composer-muted);
  overflow: hidden;
  background: var(--front-video-chat-bg);
  color: var(--front-composer-text);
  font-family: var(--lz-font-sans);
}

body.page-app .ai-action-toast {
  position: fixed ;
  left: 50% ;
  top: 76px ;
  z-index: 2147483600 ;
  width: fit-content ;
  min-width: 154px ;
  max-width: min(220px, calc(100vw - 24px)) ;
  min-height: 42px ;
  box-sizing: border-box ;
  display: grid ;
  grid-template-columns: 22px minmax(0, 1fr) ;
  grid-template-rows: auto auto ;
  column-gap: 8px ;
  row-gap: 1px ;
  align-items: center ;
  padding: 7px 10px ;
  border: 1px solid rgba(255, 255, 255, .11) ;
  border-radius: 8px ;
  background: rgba(43, 43, 46, .96) ;
  background-image: none ;
  color: #fafafa ;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .05) ;
  backdrop-filter: none ;
  -webkit-backdrop-filter: none ;
  opacity: 0 ;
  visibility: hidden ;
  transform: translate(-50%, -6px) scale(.98) ;
  transition: opacity .16s ease, transform .16s cubic-bezier(.22, 1, .36, 1), visibility .16s ease ;
  pointer-events: none ;
  text-shadow: none ;
  color-scheme: dark ;
}

body.page-app .ai-action-toast::before {
  content: "" ;
  grid-row: 1 / 3 ;
  width: 20px ;
  height: 20px ;
  display: grid ;
  place-items: center ;
  border: 1px solid rgba(255, 255, 255, .12) ;
  border-radius: 50% ;
  background-color: rgba(255, 255, 255, .08) ;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23f4f4f5' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") ;
  background-position: center ;
  background-repeat: no-repeat ;
  background-size: 13px 13px ;
}

body.page-app .ai-action-toast strong {
  display: block ;
  margin: 0 ;
  color: #fafafa ;
  -webkit-text-fill-color: #fafafa ;
  font-size: 11px ;
  line-height: 1.18 ;
  font-weight: 650 ;
  letter-spacing: 0 ;
}

body.page-app .ai-action-toast span {
  display: block ;
  min-width: 0 ;
  margin: 0 ;
  color: #c7c7ca ;
  -webkit-text-fill-color: #c7c7ca ;
  font-size: 10px ;
  line-height: 1.25 ;
  letter-spacing: 0 ;
  overflow: hidden ;
  text-overflow: ellipsis ;
  white-space: nowrap ;
}

body.page-app .ai-action-toast.is-show {
  opacity: 1 ;
  visibility: visible ;
  transform: translate(-50%, 0) scale(1) ;
}

body.page-app .ai-action-toast.is-inside-image {
  position: absolute ;
  left: 50% ;
  top: 50% ;
  z-index: 30 ;
  width: auto ;
  min-width: 126px ;
  max-width: min(184px, calc(100% - 16px)) ;
  min-height: 44px ;
  grid-template-columns: 20px minmax(0, 1fr) ;
  column-gap: 7px ;
  row-gap: 1px ;
  padding: 6px 9px ;
  border: 1px solid rgba(255, 255, 255, .11) ;
  border-radius: 8px ;
  background: rgba(43, 43, 46, .96) ;
  background-image: none ;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .05) ;
  backdrop-filter: none ;
  -webkit-backdrop-filter: none ;
  transform: translate(-50%, -50%) scale(.96) ;
}

body.page-app .ai-action-toast.is-inside-image::before {
  width: 18px ;
  height: 18px ;
  border-radius: 50% ;
  background-size: 12px 12px ;
}

body.page-app .ai-action-toast.is-inside-image strong {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif ;
  font-size: 12px ;
  line-height: 14px ;
  font-weight: 600 ;
  font-synthesis: none ;
  text-shadow: none ;
}

body.page-app .ai-action-toast.is-inside-image span {
  max-width: 138px ;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif ;
  font-size: 11px ;
  line-height: 13px ;
  font-weight: 400 ;
  font-synthesis: none ;
  text-shadow: none ;
}

body.page-app .ai-action-toast.is-inside-image.is-show {
  transform: translate(-50%, -50%) scale(1) ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-action-toast,
body.page-app.jn-light-mode .ai-action-toast,
body.page-app[data-theme="light"] .ai-action-toast {
  border-color: rgba(24, 24, 27, .13) ;
  background: rgba(255, 255, 255, .97) ;
  background-image: none ;
  color: #18181b ;
  box-shadow: 0 8px 24px rgba(24, 24, 27, .14), inset 0 1px 0 rgba(255, 255, 255, .86) ;
  color-scheme: light ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-action-toast::before,
body.page-app.jn-light-mode .ai-action-toast::before,
body.page-app[data-theme="light"] .ai-action-toast::before {
  border-color: rgba(22, 163, 74, .24) ;
  background-color: #f0fdf4 ;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-action-toast > strong,
body.page-app.jn-light-mode .ai-action-toast > strong,
body.page-app[data-theme="light"] .ai-action-toast > strong {
  color: #18181b ;
  -webkit-text-fill-color: #18181b ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-action-toast > span,
body.page-app.jn-light-mode .ai-action-toast > span,
body.page-app[data-theme="light"] .ai-action-toast > span {
  color: #52525b ;
  -webkit-text-fill-color: #52525b ;
}

@media (max-width: 820px) {
  body.page-app .ai-action-toast {
    top: 58px ;
    width: fit-content ;
    min-width: 146px ;
    max-width: calc(100vw - 20px) ;
    min-height: 40px ;
    padding: 6px 9px ;
    border-radius: 8px ;
  }

  body.page-app .ai-action-toast.is-inside-image {
    min-width: 122px ;
    max-width: min(176px, calc(100% - 12px)) ;
    min-height: 42px ;
    padding: 6px 8px ;
  }
}

.ai-draw-dialog {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(2, 6, 23, .72);
  box-shadow: 0 28px 80px rgba(15, 23, 42, .16);
  font: 16px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  opacity: 0;
  transition: opacity .14s ease;
}

.ai-draw-dialog.is-open {
  opacity: 1;
}

.ai-draw-dialog-panel {
  width: min(420px, calc(100vw - 32px));
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(26, 26, 26, .98), rgba(17, 17, 17, .98));
  color: #f2f2f2;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
  transform: translateY(8px) scale(.98);
  transition: transform .14s ease;
}

.ai-draw-dialog.is-open .ai-draw-dialog-panel {
  transform: translateY(0) scale(1);
}

.ai-draw-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 48px;
  padding: 0 14px 0 18px;
  border-bottom: 1px solid #2d2d2d;
}

.ai-draw-dialog-head span {
  color: #949494;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
}

.ai-draw-dialog-head button {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 10px;
  background: #242424;
  color: #d4d4d4;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

.ai-draw-dialog-head button:hover {
  background: #2d2d2d;
  color: #fff;
}

.ai-draw-dialog-body {
  padding: 22px 22px 18px;
}

.ai-draw-dialog-body h3 {
  margin: 0 0 10px;
  color: #f2f2f2;
  font-size: 18px;
  font-weight: 850;
  line-height: 1.25;
}

.ai-draw-dialog-body p {
  margin: 0;
  color: #bdbdbd;
  font-size: 14px;
  line-height: 1.65;
}

.ai-draw-dialog-foot {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 14px 18px 18px;
}

.ai-draw-dialog-foot button {
  min-width: 88px;
  height: 38px;
  padding: 0 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.ai-draw-dialog-cancel {
  border: 1px solid #3a3a3a;
  background: #242424;
  color: #f2f2f2;
}

.ai-draw-dialog-confirm {
  border: 1px solid #2584ff;
  background: #2584ff;
  color: #fff;
  box-shadow: 0 8px 22px rgba(37, 132, 255, .22);
}

.ai-draw-dialog-confirm.is-danger {
  border-color: #ef4444;
  background: #ef4444;
  box-shadow: 0 8px 22px rgba(239, 68, 68, .22);
}

html.jn-light-mode body.page-app .ai-draw-dialog,
html[data-theme="light"] body.page-app .ai-draw-dialog,
body.page-app.jn-light-mode .ai-draw-dialog {
  background: rgba(248, 250, 252, .88) ;
  background-image: none ;
  color: #0f172a ;
  -webkit-backdrop-filter: none ;
  backdrop-filter: none ;
}

html.jn-light-mode body.page-app .ai-draw-dialog-panel,
html[data-theme="light"] body.page-app .ai-draw-dialog-panel,
body.page-app.jn-light-mode .ai-draw-dialog-panel {
  border: 1px solid rgba(15, 23, 42, .12) ;
  background: #fff ;
  background-image: none ;
  color: #0f172a ;
  box-shadow: 0 26px 80px rgba(15, 23, 42, .16) ;
  color-scheme: light ;
}

html.jn-light-mode body.page-app .ai-draw-dialog-head,
html[data-theme="light"] body.page-app .ai-draw-dialog-head,
body.page-app.jn-light-mode .ai-draw-dialog-head {
  border-color: rgba(15, 23, 42, .10) ;
  background: #fff ;
}

html.jn-light-mode body.page-app .ai-draw-dialog-head button,
html.jn-light-mode body.page-app .ai-draw-dialog-cancel,
html[data-theme="light"] body.page-app .ai-draw-dialog-head button,
html[data-theme="light"] body.page-app .ai-draw-dialog-cancel,
body.page-app.jn-light-mode .ai-draw-dialog-head button,
body.page-app.jn-light-mode .ai-draw-dialog-cancel {
  border-color: rgba(15, 23, 42, .12) ;
  background: #eef2f7 ;
  background-image: none ;
  color: #0f172a ;
  -webkit-text-fill-color: #0f172a ;
  box-shadow: none ;
}

html.jn-light-mode body.page-app .ai-draw-dialog-body :is(h3, p, span),
html[data-theme="light"] body.page-app .ai-draw-dialog-body :is(h3, p, span),
body.page-app.jn-light-mode .ai-draw-dialog-body :is(h3, p, span) {
  color: #0f172a ;
  -webkit-text-fill-color: #0f172a ;
}

html.jn-light-mode body.page-app .ai-draw-dialog-head span,
html[data-theme="light"] body.page-app .ai-draw-dialog-head span,
body.page-app.jn-light-mode .ai-draw-dialog-head span {
  color: #64748b ;
}

html.jn-light-mode body.page-app .ai-draw-dialog-confirm:not(.is-danger),
html[data-theme="light"] body.page-app .ai-draw-dialog-confirm:not(.is-danger),
body.page-app.jn-light-mode .ai-draw-dialog-confirm:not(.is-danger) {
  border-color: #2563eb ;
  background: #2563eb ;
  color: #fff ;
  -webkit-text-fill-color: #fff ;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .22) ;
}

@media (max-width: 820px) {
  .ai-draw-dialog {
    padding: 16px;
  }

  .ai-draw-dialog-panel {
    border-radius: 16px;
  }

  .ai-draw-dialog-foot {
    justify-content: stretch;
  }

  .ai-draw-dialog-foot button {
    flex: 1;
    min-width: 0;
  }
}

.page-app .workspace-stage,
.page-app .workspace-main,
.page-app .workspace-module,
.page-app .image-workspace,
.page-app .image-result {
  background: var(--front-video-chat-bg);
}

.page-app .workspace-main {
  min-height: 100dvh;
  display: block;
  padding: 0;
}

.page-app .workspace-module {
  width: 100%;
  height: 100dvh;
  min-height: 0;
  display: block;
}

.page-app .workspace-module__heading {
  display: none;
}

.page-app .image-workspace {
  position: relative;
  width: 100%;
  height: 100dvh;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  color: var(--front-composer-text);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
}

.page-app .image-result {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: block;
  padding: 56px 24px 232px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 0;
  box-shadow: none;
  scrollbar-width: none;
}

.page-app .image-result::-webkit-scrollbar {
  display: none;
}

.page-app .ai-draw-empty {
  box-sizing: border-box;
  width: min(985px, calc(100% - 32px));
  min-height: calc(100dvh - 396px);
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
  transform: translateY(-18px);
}

.page-app .ai-draw-empty[hidden] {
  display: none;
}

.page-app .ai-draw-openai {
  width: 84px;
  height: 84px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: #2563eb;
  box-shadow: none;
}

.page-app .ai-draw-openai svg,
.page-app .ai-draw-openai img {
  width: 84px;
  height: 84px;
  display: block;
  object-fit: contain;
}

.page-app .ai-draw-openai.is-text-icon {
  font-size: 38px;
  line-height: 1;
}

.page-app .ai-draw-intro-card {
  box-sizing: border-box;
  width: min(560px, 100%);
  min-height: 91px;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--lz-front-guide-border);
  border-radius: 16px;
  background: var(--lz-front-guide-panel);
  color: var(--lz-front-guide-text);
  box-shadow: var(--lz-front-guide-shadow);
  font-size: 14px;
  line-height: 1.72;
  white-space: normal;
}

.page-app .ai-draw-stream {
  box-sizing: border-box;
  width: min(560px, 100%);
  max-width: min(560px, 100%);
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 0 0 max(24px, calc((100% - 980px) / 2 + 24px));
  padding: 0 0 24px;
  overflow: visible;
}

@media (min-width: 861px) {
  .page-app .ai-draw-stream {
    width: min(560px, calc(100% - var(--draw-stream-left, 0px)));
    max-width: min(560px, calc(100% - var(--draw-stream-left, 0px)));
    align-items: flex-start;
    margin-left: var(--draw-stream-left, 0px);
    margin-right: 0;
  }

  .page-app .ai-draw-stream.has-batch-results {
    width: calc(100% - var(--draw-stream-left, 0px));
    max-width: calc(100% - var(--draw-stream-left, 0px));
  }
}

.page-app .ai-draw-top-spacer {
  display: block;
  height: var(--draw-top-spacer, 0px);
  min-height: 0;
  flex: 0 0 var(--draw-top-spacer, 0px);
  pointer-events: none;
}

.page-app .ai-draw-bottom-spacer {
  height: calc(var(--composer-safe, 180px) + 8px);
  flex: 0 0 auto;
  pointer-events: none;
}

.page-app .image-result__status {
  box-sizing: border-box;
  width: min(560px, 100%);
  min-height: 48px;
  margin: 0 0 18px max(24px, calc((100% - 980px) / 2 + 24px));
  padding: 13px 16px;
  border: 1px solid rgba(15, 23, 42, .1);
  border-radius: 12px;
  background: rgba(255, 255, 255, .82);
  color: #475569;
  font-size: 13px;
  line-height: 1.6;
}

.page-app .image-result__status.is-error {
  border-color: rgba(220, 38, 38, .2);
  color: #b91c1c;
}

.page-app .image-result__status[hidden] {
  display: none;
}

.page-app .ai-draw-message-block {
  position: relative;
  box-sizing: border-box;
  width: min(var(--draw-result-row-width, 432px), calc(100vw - 24px));
  max-width: min(var(--draw-result-row-width, 432px), calc(100vw - 24px));
  display: grid;
  align-items: flex-start;
  gap: 6px;
  margin: 0;
  padding: 0;
  color: var(--front-composer-text);
}

.page-app .ai-draw-message-block.is-batch-item {
  width: 194px;
  max-width: 194px;
  display: block;
  transform: none;
}

.page-app .ai-draw-user-message {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
}

.page-app .ai-draw-message-block.is-batch-item > .ai-draw-user-message {
  display: none;
}

.page-app .ai-draw-prompt-box {
  box-sizing: border-box;
  width: min(var(--draw-prompt-actual-width, 100%), 100%);
  max-width: 100%;
  min-width: 228px;
  min-height: 52px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  line-height: normal;
}

.page-app .ai-draw-user-prompt {
  width: auto;
  min-width: 0;
  max-height: 38px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #28282d;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 19px;
  white-space: normal;
  word-break: break-word;
}

.page-app .ai-draw-prompt-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(4px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
  line-height: normal;
}

.page-app .ai-draw-result-prompt:is(:hover, :focus-within) .ai-draw-prompt-actions {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

.page-app .ai-draw-prompt-actions button {
  min-width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 3px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #0f172a;
  box-shadow: none;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.page-app .ai-draw-prompt-actions button span {
  display: inline;
}

.page-app .ai-draw-image-tools button {
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  background: rgba(12, 12, 12, .68);
  color: #fff;
  -webkit-text-fill-color: #fff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  font-size: 0;
  cursor: pointer;
}

.page-app .ai-draw-prompt-actions svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-app .ai-draw-prompt-actions svg {
  flex: 0 0 15px;
}

.page-app .ai-draw-image-tools svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-app .ai-draw-tags {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.page-app .ai-draw-tags span {
  height: 28px;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  padding: 0 4px;
  border: 1px solid rgba(32, 34, 39, .16);
  border-radius: 7px;
  background: rgba(255, 255, 255, .96);
  color: #34363c;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(24, 26, 31, .05);
  font: 500 11px/16px "Microsoft YaHei UI", "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.page-app .ai-draw-result-card {
  width: min(var(--draw-result-card-size, 194px), 100%);
  max-width: min(var(--draw-result-card-size, 194px), 100%);
  display: grid;
  align-content: start;
  gap: 6px;
}

.page-app .ai-draw-result-image {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 0;
  background: var(--front-video-chat-bg);
  box-shadow: none;
}

.page-app .ai-draw-result-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  background: transparent;
}

.page-app .ai-draw-image-tools {
  position: absolute;
  left: auto;
  right: 8px;
  top: auto;
  bottom: 8px;
  z-index: 12;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
}

.page-app .ai-draw-result-image:hover .ai-draw-image-tools,
.page-app .ai-draw-result-image:focus-within .ai-draw-image-tools {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.page-app .ai-draw-image-tools button:hover {
  border-color: rgba(37, 132, 255, .92);
  background: rgba(37, 132, 255, .92);
  color: #fff;
  -webkit-text-fill-color: #fff;
  box-shadow: 0 10px 24px rgba(37, 132, 255, .25);
}

.page-app .ai-draw-image-tools .ai-draw-share-plaza {
  border-color: rgba(255, 218, 102, .72);
  background: rgba(255, 199, 70, .86);
  color: #16110a;
  -webkit-text-fill-color: #16110a;
}

:is(html.jn-light-mode, html[data-theme=light]) body.page-app:not(.page-admin) .ai-draw-image-tools button,
body.page-app.jn-light-mode:not(.page-admin) .ai-draw-image-tools button,
body.page-app[data-theme=light]:not(.page-admin) .ai-draw-image-tools button {
  border-color: rgba(15, 23, 42, .14);
  background: rgba(255, 255, 255, .84);
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
}

:is(html.jn-light-mode, html[data-theme=light]) body.page-app:not(.page-admin) .ai-draw-image-tools .ai-draw-share-plaza,
body.page-app.jn-light-mode:not(.page-admin) .ai-draw-image-tools .ai-draw-share-plaza,
body.page-app[data-theme=light]:not(.page-admin) .ai-draw-image-tools .ai-draw-share-plaza {
  border-color: rgba(245, 158, 11, .28);
  background: rgba(255, 251, 235, .88);
  color: #92400e;
  -webkit-text-fill-color: #92400e;
}

@media (max-width: 820px) {
  .page-app .ai-draw-image-tools {
    right: 6px;
    bottom: 6px;
    height: 28px;
  }
}

body.page-app .ai-draw-preview-modal {
  position: fixed ;
  inset: 0 ;
  z-index: 99999 ;
  display: flex ;
  align-items: center ;
  justify-content: center ;
  padding: 22px ;
  background: rgba(0, 0, 0, .88) ;
  opacity: 0;
  transition: opacity .16s ease ;
  backdrop-filter: blur(12px) ;
  -webkit-backdrop-filter: blur(12px) ;
}

body.page-app .ai-draw-preview-modal.is-open {
  opacity: 1 ;
}

body.page-app .ai-draw-preview-panel {
  position: relative ;
  box-sizing: border-box ;
  width: fit-content ;
  height: fit-content ;
  max-width: calc(100vw - 44px) ;
  max-height: calc(100dvh - 44px) ;
  display: inline-block ;
  font-size: 16px ;
  line-height: normal ;
  background: rgba(10, 10, 10, .72) ;
  border: 1px solid rgba(255, 255, 255, .12) ;
  border-radius: 18px ;
  padding: 0 ;
  overflow: hidden ;
  box-shadow: 0 30px 100px rgba(0, 0, 0, .62) ;
}

body.page-app .ai-draw-preview-close {
  position: absolute ;
  right: 10px ;
  top: 10px ;
  z-index: 8 ;
  width: 40px ;
  height: 40px ;
  min-width: 40px ;
  min-height: 40px ;
  display: grid ;
  place-items: center ;
  padding: 0 ;
  border: 1px solid rgba(255, 255, 255, .16) ;
  border-radius: 999px ;
  background: #151515 ;
  color: #fff ;
  font-size: 24px ;
  line-height: 1 ;
  cursor: pointer ;
  backdrop-filter: blur(14px) ;
  -webkit-backdrop-filter: blur(14px) ;
}

body.page-app .ai-draw-preview-zoom {
  position: absolute ;
  width: 1px ;
  height: 1px ;
  min-height: 38px ;
  display: flex ;
  align-items: center ;
  justify-content: center ;
  gap: 8px ;
  padding: 0 ;
  margin: 0 ;
  border: 0 ;
  border-radius: 999px ;
  background: rgba(20, 20, 20, .88) ;
  color: #fff ;
  opacity: 0 ;
  pointer-events: none ;
  overflow: hidden ;
}

body.page-app .ai-draw-preview-stage {
  position: relative ;
  box-sizing: border-box ;
  width: fit-content ;
  height: fit-content ;
  max-width: calc(100vw - 46px) ;
  max-height: calc(100dvh - 46px) ;
  display: inline-block ;
  font-size: 16px ;
  line-height: normal ;
  padding: 0 ;
  overflow: hidden ;
  background: #050505 ;
  border-radius: 14px ;
  box-shadow: none ;
}

body.page-app .ai-draw-preview-stage img[data-preview-image] {
  width: auto ;
  height: auto ;
  max-width: calc(100vw - 48px) ;
  max-height: calc(100dvh - 48px) ;
  display: block ;
  aspect-ratio: auto ;
  object-fit: contain ;
  border-radius: 10px ;
  background: #050505 ;
  border: 1px solid rgba(255, 255, 255, .16) ;
  backdrop-filter: blur(18px) ;
  -webkit-backdrop-filter: blur(18px) ;
  transform-origin: center center ;
  transition: transform .12s ease ;
  box-shadow: 0 18px 60px rgba(0, 0, 0, .48) ;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools {
  position: absolute ;
  right: 16px ;
  bottom: 16px ;
  left: auto ;
  top: auto ;
  z-index: 7 ;
  display: flex ;
  gap: 7px ;
  width: auto ;
  max-width: none ;
  height: auto ;
  padding: 0 ;
  border: 0 ;
  border-radius: 0 ;
  background: transparent ;
  box-shadow: none ;
  backdrop-filter: none ;
  -webkit-backdrop-filter: none ;
  opacity: 1 ;
  visibility: visible ;
  pointer-events: auto ;
  transform: none ;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button {
  width: 30px ;
  height: 40px ;
  min-width: 30px ;
  min-height: 40px ;
  flex: 0 0 30px ;
  border-radius: 9px ;
  border: 1px solid rgba(255, 255, 255, .18) ;
  background: rgba(10, 10, 10, .72) ;
  color: #fff ;
  -webkit-text-fill-color: #fff ;
  line-height: normal ;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .34) ;
  backdrop-filter: blur(10px) ;
  -webkit-backdrop-filter: blur(10px) ;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button:hover {
  background: #2584ff ;
  border-color: #2584ff ;
  transform: translateY(-1px) ;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools svg {
  width: 16px ;
  height: 16px ;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-share-plaza {
  background: rgba(255, 199, 70, .82) ;
  color: #16110a ;
  -webkit-text-fill-color: #16110a ;
  border-color: rgba(255, 218, 102, .8) ;
}

body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-share-plaza:hover {
  background: #ffd24d ;
  color: #111 ;
  -webkit-text-fill-color: #111 ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button,
body.page-app.jn-light-mode .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button,
body.page-app[data-theme="light"] .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button {
  background: rgba(255, 255, 255, .78) ;
  background-image: none ;
  border: 1px solid rgba(15, 23, 42, .14) ;
  color: #0f172a ;
  -webkit-text-fill-color: #0f172a ;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .12) ;
  backdrop-filter: none ;
  -webkit-backdrop-filter: none ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button:hover,
body.page-app.jn-light-mode .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button:hover,
body.page-app[data-theme="light"] .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button:hover {
  background: #2563eb ;
  border-color: #2563eb ;
  color: #fff ;
  -webkit-text-fill-color: #fff ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button.ai-draw-share-plaza,
body.page-app.jn-light-mode .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button.ai-draw-share-plaza,
body.page-app[data-theme="light"] .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button.ai-draw-share-plaza {
  background: rgba(255, 251, 235, .84) ;
  border-color: rgba(245, 158, 11, .26) ;
  color: #92400e ;
  -webkit-text-fill-color: #92400e ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-modal,
body.page-app.jn-light-mode .ai-draw-preview-modal,
body.page-app[data-theme="light"] .ai-draw-preview-modal {
  background: rgba(248, 250, 252, .88) ;
  color: #0f172a ;
  backdrop-filter: none ;
  -webkit-backdrop-filter: none ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-panel,
body.page-app.jn-light-mode .ai-draw-preview-panel,
body.page-app[data-theme="light"] .ai-draw-preview-panel {
  background: #fff ;
  border-color: rgba(15, 23, 42, .12) ;
  color: #0f172a ;
  box-shadow: 0 26px 80px rgba(15, 23, 42, .16) ;
  color-scheme: light ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-stage,
body.page-app.jn-light-mode .ai-draw-preview-stage,
body.page-app[data-theme="light"] .ai-draw-preview-stage {
  background: #fff ;
  border: 1px solid rgba(15, 23, 42, .1) ;
  border-radius: 18px ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-stage img,
body.page-app.jn-light-mode .ai-draw-preview-stage img,
body.page-app[data-theme="light"] .ai-draw-preview-stage img {
  box-shadow: 0 18px 48px rgba(15, 23, 42, .14) ;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app .ai-draw-preview-close,
body.page-app.jn-light-mode .ai-draw-preview-close,
body.page-app[data-theme="light"] .ai-draw-preview-close {
  background: #eef2f7 ;
  border-color: rgba(15, 23, 42, .12) ;
  color: #0f172a ;
  -webkit-text-fill-color: #0f172a ;
  box-shadow: none ;
}

@media (max-width: 700px) {
  body.page-app .ai-draw-preview-modal {
    padding: 10px ;
  }

  body.page-app .ai-draw-preview-panel {
    width: fit-content ;
    height: fit-content ;
    max-width: calc(100vw - 20px) ;
    max-height: calc(100dvh - 20px) ;
    border-radius: 14px ;
    gap: 0 ;
    padding: 0 ;
  }

  body.page-app .ai-draw-preview-stage {
    max-width: calc(100vw - 22px) ;
    max-height: calc(100dvh - 22px) ;
    padding: 0 ;
  }

  body.page-app .ai-draw-preview-stage img[data-preview-image] {
    max-width: calc(100vw - 24px) ;
    max-height: calc(100dvh - 24px) ;
  }

  body.page-app .ai-draw-preview-close {
    width: 36px ;
    height: 36px ;
    min-width: 36px ;
    min-height: 36px ;
  }

  body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools {
    right: 12px ;
    bottom: 12px ;
  }

  body.page-app .ai-draw-preview-modal .ai-draw-preview-stage .ai-draw-image-tools button {
    width: 32px ;
    height: 32px ;
    min-width: 32px ;
    min-height: 34px ;
    flex-basis: 32px ;
  }
}

.page-app .ai-draw-result-actions,
.page-app .ai-draw-batch-actions {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 5px;
}

.page-app .ai-draw-result-actions button,
.page-app .ai-draw-batch-actions button {
  min-width: 0;
  height: 28px;
  padding: 0 7px;
  border: 1px solid rgba(32, 34, 39, .16);
  border-radius: 8px;
  background: rgba(255, 255, 255, .96);
  color: #34363c;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(24, 26, 31, .05);
  font: 11px/1 var(--lz-font-sans);
  white-space: nowrap;
  cursor: pointer;
}

.page-app .ai-draw-result-actions button:hover,
.page-app .ai-draw-batch-actions button:hover {
  background: #f1f5f9;
  color: #0f172a;
}

.page-app .ai-draw-success-time,
.page-app .ai-draw-result-card time,
.page-app .ai-draw-batch-time {
  padding: 0 1px;
  color: #77777e;
  font-size: 10.5px;
  font-weight: 500;
  line-height: 15px;
}

.page-app .ai-draw-generated-art {
  width: 100%;
  height: 100%;
}

.page-app .ai-draw-failed-art {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  padding: 16px;
  color: #64748b;
  text-align: center;
  font-size: 12px;
  line-height: 1.55;
}

.page-app .ai-draw-failed-art {
  background: #fff7f7;
  color: #b91c1c;
}

.page-app .ai-draw-batch-shell {
  position: relative;
  box-sizing: border-box;
  --draw-batch-shell-gap: 12px;
  width: min(var(--draw-batch-width, 100%), 100%) ;
  max-width: 100% ;
  display: grid ;
  gap: var(--draw-batch-shell-gap) ;
  align-self: flex-start ;
  margin-left: 0 ;
  margin-right: auto ;
  padding-bottom: 54px ;
}

body.page-app:not(#aiDrawBatchOuterA):not(#aiDrawBatchOuterB) .ai-draw-batch-shell .ai-draw-batch-user-message {
  width: min(var(--draw-result-row-width, 100%), calc(100vw - 24px)) ;
  max-width: none ;
  background: transparent ;
  background-image: none ;
  border: 0 ;
  border-radius: 0 ;
  box-shadow: none ;
}

body.page-app .ai-draw-batch-grid {
  width: min(var(--draw-batch-width, 100%), 100%) ;
  max-width: 100% ;
  display: grid ;
  grid-template-columns: repeat(var(--draw-batch-columns, 1), minmax(0, var(--draw-batch-card, 182px))) ;
  gap: 2px ;
  align-items: start ;
  justify-content: start ;
  background: transparent ;
  overflow: visible ;
  border-radius: 0 ;
}

body.page-app .ai-draw-batch-grid .ai-draw-message-block {
  width: 100% ;
  max-width: none ;
  margin: 0 ;
}

body.page-app .ai-draw-batch-grid .ai-draw-message-block .ai-draw-user-message {
  display: none ;
}

body.page-app .ai-draw-batch-grid .ai-draw-message-block .ai-draw-result-card {
  width: 100% ;
  max-width: none ;
  margin: 0 ;
  background: transparent ;
  border: 0 ;
  border-radius: 0 ;
  box-shadow: none ;
  padding: 0 ;
  box-sizing: border-box ;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-grid .ai-draw-message-block.is-batch-item > .ai-draw-result-card {
  width: 100% ;
  max-width: none ;
}

body.page-app .ai-draw-batch-grid .ai-draw-result-status,
body.page-app .ai-draw-batch-grid .ai-draw-result-card time,
body.page-app .ai-draw-batch-grid .ai-draw-result-actions {
  display: none ;
}

@media (min-width: 861px) {
  .page-app .ai-draw-message-block:not(.is-batch-item),
  .page-app .ai-draw-batch-shell {
    left: calc(-1 * var(--draw-success-shift, 0px));
    transform: none;
  }
}

body.page-app .ai-draw-batch-actions {
  width: auto;
  display: flex ;
  flex-wrap: wrap ;
  gap: 7px ;
  align-items: center ;
  margin-top: 4px ;
  padding-bottom: 0 ;
  position: relative ;
  z-index: 8 ;
}

body.page-app .ai-draw-batch-actions button {
  height: 34px ;
  border: 1px solid rgba(255, 255, 255, .08) ;
  border-radius: 8px ;
  background: rgba(255, 255, 255, .045) ;
  color: #d8dbe3 ;
  display: inline-flex ;
  align-items: center ;
  justify-content: center ;
  gap: 6px ;
  min-width: 0 ;
  padding: 0 13px ;
  font-size: 13px ;
  font-weight: 650 ;
  cursor: pointer ;
}

html.jn-light-mode body.page-app .ai-draw-batch-actions button,
body.page-app.jn-light-mode .ai-draw-batch-actions button {
  background: rgba(255, 255, 255, .72) ;
  border-color: rgba(15, 23, 42, .12) ;
  color: #334155 ;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message {
  grid-column: 1 ;
  grid-row: 1 ;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-grid {
  grid-column: 1 ;
  grid-row: 2 ;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-actions {
  grid-column: 1 ;
  grid-row: 3 ;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-success-time,
html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]) {
  position: static;
  left: 0;
  right: auto;
  align-self: start;
  justify-self: stretch;
  display: block;
  width: min(var(--draw-result-row-width, 100%), calc(100vw - 24px));
  min-width: 0;
  min-height: 15px;
  height: 15px;
  margin: 0;
  padding: 0 1px;
  color: #929297;
  -webkit-text-fill-color: #929297;
  font-size: 10.5px;
  font-weight: 500;
  line-height: 15px;
  letter-spacing: 0;
  text-align: right;
  white-space: nowrap;
  box-sizing: border-box;
  pointer-events: none;
  z-index: 9;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]) {
  grid-column: 1;
  grid-row: 4;
  margin-top: calc(6px - var(--draw-batch-shell-gap));
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]),
body.page-app.front-creative-page:is(.jn-light-mode, [data-theme="light"]) .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]) {
  color: #77777e;
  -webkit-text-fill-color: #77777e;
}

@media (max-width: 640px) {
  body.page-app .ai-draw-stream.has-batch-results {
    width: 100% ;
    max-width: 100% ;
    margin-left: 0 ;
  }

  body.page-app .ai-draw-batch-shell {
    --draw-batch-shell-gap: 8px;
    width: 100% ;
    max-width: 100% ;
    gap: var(--draw-batch-shell-gap) ;
    padding-bottom: 86px ;
  }

  body.page-app:not(#aiDrawBatchOuterA):not(#aiDrawBatchOuterB) .ai-draw-batch-shell .ai-draw-batch-user-message {
    width: 100% ;
  }

  body.page-app .ai-draw-batch-grid {
    gap: 2px ;
    overflow: visible ;
  }

  body.page-app .ai-draw-batch-actions {
    display: grid ;
    grid-template-columns: repeat(5, minmax(0, 1fr)) ;
    gap: 4px ;
    flex-wrap: nowrap ;
    padding-bottom: 0 ;
  }

  body.page-app .ai-draw-batch-actions button {
    width: 100% ;
    min-width: 0 ;
    height: 30px ;
    padding: 0 3px ;
    font-size: 11px ;
    border-radius: 7px ;
    white-space: nowrap ;
  }

  html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-time:not([hidden]) {
    width: calc(100vw - 24px);
  }
}

.page-app .front-creative-composer-image {
  position: fixed;
  left: var(--front-menu-width);
  right: 0;
  bottom: 0;
  z-index: 70;
  box-sizing: border-box;
  width: auto;
  height: var(--lz-creative-composer-shell-height);
  min-height: var(--lz-creative-composer-shell-height);
  display: block;
  padding: 0 38px 14px;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--front-composer-text);
  box-shadow: none;
}

.page-app .front-video-composer-frame {
  position: relative;
  box-sizing: border-box;
  width: min(980px, 100%);
  height: 208px;
  min-height: 208px;
  margin: 4px auto 0;
  padding: 22px 22px 64px;
  overflow: visible;
  border: 1px solid var(--front-composer-line);
  border-radius: 18px;
  background: var(--front-composer-panel);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}

.page-app .front-creative-composer-tools {
  position: absolute;
  left: 50%;
  top: var(--lz-creative-composer-tools-offset);
  z-index: 3;
  width: min(980px, calc(100% - 76px));
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  transform: translateX(-50%);
}

.page-app .front-creative-tool-chip,
.page-app .front-creative-billing-pill {
  box-sizing: border-box;
  height: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--front-composer-control-line);
  background: var(--lz-front-floating-control);
  color: var(--front-composer-text);
  box-shadow: none;
}

.page-app .front-creative-tool-chip {
  width: 34px;
  min-width: 34px;
  padding: 0;
  border-radius: 10px;
  cursor: pointer;
}

.page-app .front-creative-tool-chip span {
  display: none;
}

.page-app .front-creative-tool-chip svg,
.page-app .front-creative-billing-pill svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-app .front-creative-billing-pill {
  gap: 6px;
  padding: 0 12px;
  border-color: rgba(15, 23, 42, .12);
  border-radius: 999px;
  background: #fff;
  color: #92400e;
  font: 900 12px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  white-space: nowrap;
}

.page-app .front-creative-billing-pill svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
  stroke: currentColor;
}

.page-app .front-creative-composer-left-image {
  position: absolute;
  left: var(--front-reference-left, 14px);
  top: 22px;
  z-index: 4;
  width: 92px;
  height: 116px;
}

.page-app .front-creative-composer-main-image,
.page-app .front-creative-image-prompt {
  position: static;
  box-sizing: border-box;
  width: 100%;
  height: 120px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.page-app .front-creative-image-prompt textarea {
  position: absolute;
  left: 22px;
  right: 22px;
  top: 22px;
  box-sizing: border-box;
  width: auto;
  height: 120px;
  min-height: 120px;
  margin: 0;
  padding: 0 4px 0 112px;
  resize: none;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: var(--front-composer-text);
  box-shadow: none;
  font: 14px/1.62 var(--lz-font-sans);
}

.page-app .front-creative-image-prompt textarea::placeholder {
  color: var(--front-composer-muted);
  opacity: 1;
}

.page-app .ai-draw-inner-controls {
  position: absolute;
  left: 22px;
  right: 76px;
  bottom: 18px;
  z-index: 7;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
}

.page-app .ai-draw-selects {
  box-sizing: border-box;
  width: 100%;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 6px;
  overflow: visible;
}

.page-app .ai-draw-select {
  display: flex;
  flex: 0 0 auto;
}

.page-app .front-creative-composer-image .front-param-trigger {
  border-color: rgba(15, 23, 42, .12);
  background: #f8fafc;
  color: #475569;
  font: 900 13px/13px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.page-app .ai-draw-model-select .front-param-trigger {
  width: 141.734375px;
}

.page-app [data-image-param="count"] .front-param-trigger {
  width: 67.03125px;
}

.page-app [data-image-param="size"] .front-param-trigger,
.page-app [data-image-param="quality"] .front-param-trigger {
  width: 86px;
}

.page-app .front-param-draw-popover[data-param="model"] {
  box-sizing: border-box ;
  max-height: min(336px, calc(100dvh - 24px)) ;
  padding: 8px ;
  gap: 6px ;
  overflow: auto ;
  border: 1px solid rgba(15, 23, 42, .12) ;
  border-radius: 10px ;
  background: rgba(246, 248, 252, .82) ;
  color: #50627a ;
  box-shadow: 0 18px 44px rgba(15, 23, 42, .14) ;
  backdrop-filter: blur(22px) saturate(132%) ;
  -webkit-backdrop-filter: blur(22px) saturate(132%) ;
  z-index: 2147483647 ;
}

.page-app .front-param-draw-popover[data-param="model"]::before {
  content: "选择模型" ;
  display: block ;
  width: auto ;
  height: 16px ;
  margin: 0 4px 5px ;
  color: #64748b ;
  font: 600 11px/16px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif ;
  text-align: center ;
  white-space: pre-line ;
  background-image: linear-gradient(to right, rgba(15, 23, 42, .12) 0, rgba(15, 23, 42, .12) calc(50% - 38px), transparent calc(50% - 38px), transparent calc(50% + 38px), rgba(15, 23, 42, .12) calc(50% + 38px), rgba(15, 23, 42, .12) 100%) ;
  background-repeat: no-repeat ;
  background-size: 100% 1px ;
  background-position: center ;
}

.page-app .front-param-draw-popover[data-param="model"] .front-chat-model-option {
  box-sizing: border-box ;
  width: 100% ;
  height: 40px ;
  min-height: 40px ;
  display: flex ;
  align-items: center ;
  justify-content: flex-start ;
  gap: 10px ;
  padding: 0 12px ;
  overflow: hidden ;
  border: 1px solid rgba(15, 23, 42, .12) ;
  border-radius: 8px ;
  background: #eef2f7 ;
  color: #50627a ;
  font: 800 13px/13px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif ;
  text-align: left ;
  white-space: nowrap ;
  transform: none ;
  box-shadow: none ;
}

.page-app .front-param-draw-popover[data-param="model"] .front-chat-model-copy,
.page-app .front-param-draw-popover[data-param="model"] .front-chat-model-title {
  min-width: 0 ;
  overflow: hidden ;
  color: inherit ;
  font: inherit ;
  text-overflow: ellipsis ;
  white-space: nowrap ;
}

.page-app .front-param-draw-popover[data-param="model"] .front-chat-model-option.is-selected::after {
  content: "" ;
  box-sizing: border-box ;
  width: 7px ;
  height: 12px ;
  margin-left: auto ;
  flex: 0 0 7px ;
  border-right: 2px solid currentColor ;
  border-bottom: 2px solid currentColor ;
  color: #64748b ;
  transform: translateY(-1px) rotate(45deg) ;
}

.page-app .front-creative-composer-side-image {
  position: absolute;
  right: 18px;
  bottom: 18px;
  z-index: 8;
  width: 46px;
  height: 46px;
}

.page-app .front-creative-send {
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--front-composer-control-line);
  border-radius: 999px;
  background: var(--front-composer-control);
  color: var(--front-composer-text);
  box-shadow: none;
  cursor: pointer;
}

.page-app .front-creative-send:disabled,
.page-app .front-creative-send.is-empty {
  background: #f8fafc;
  color: #64748b;
  opacity: .72;
  cursor: default;
}

.page-app .front-creative-send.has-prompt:not(:disabled) {
  border-color: rgba(37, 99, 235, .72);
  background: #2563eb;
  color: #fff;
  opacity: 1;
  box-shadow: 0 12px 26px rgba(37, 99, 235, .26);
}

.page-app .front-creative-send svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Shared image reference uploader copied from the source visual baseline. */

html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-prompt{
  transition:border-color .16s,background-color .16s,box-shadow .16s;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-batch-user-message,.ai-draw-tags){
  color:#f7f8fb;
  border-color:#f7f8fb;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-app.front-creative-page .ai-draw-page .ai-draw-result-prompt{
  color:#f7f8fb;
  border-color:transparent;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell .ai-draw-result-prompt .ai-draw-prompt-actions button{
  color:#a9a9af;
  border-color:#a9a9af;
  -webkit-text-fill-color:#a9a9af;
  transition:color .16s ease,transform .16s ease;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-prompt .ai-draw-prompt-actions button{
  color:#d9d9de;
  border-color:#d9d9de;
  -webkit-text-fill-color:#d9d9de;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-image > img{
  border-color:transparent;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
  transition:background-color .16s,border-color .16s;
}
body.page-app .ai-draw-message-block,
body.page-app .ai-draw-user-message,
body.page-app .ai-draw-result-card{
  align-self:flex-start;
}

.page-app.is-sidebar-collapsed .front-creative-composer-image {
  left: var(--front-menu-offset);
}

@media (max-width: 760px) {
  .page-app .workspace-mobile-header {
    display: none;
  }

  .page-app .image-result {
    padding: 42px 18px var(--lz-creative-mobile-content-clearance);
  }

  .page-app .ai-draw-empty {
    width: 354px;
    max-width: 100%;
    min-height: 450px;
    transform: none;
  }

  .page-app .ai-draw-openai,
  .page-app .ai-draw-openai svg,
  .page-app .ai-draw-openai img {
    width: 64px;
    height: 64px;
  }

  .page-app .ai-draw-intro-card {
    width: 354px;
    max-width: 100%;
    min-height: 104px;
    padding: 16px 18px;
    font-size: 13px;
  }

  .page-app .ai-draw-stream {
    width: calc(100% - 8px);
    max-width: 100%;
    gap: 24px;
    margin: 0;
    padding-bottom: 48px;
  }

  .page-app .image-result__status {
    width: 100%;
    margin: 0 0 16px;
  }

  .page-app .ai-draw-message-block:not(.is-batch-item) {
    width: min(var(--draw-result-row-width, 432px), calc(100vw - 24px));
    max-width: min(var(--draw-result-row-width, 432px), calc(100vw - 24px));
    transform: none;
  }

  .page-app .ai-draw-message-block:not(.is-batch-item) > .ai-draw-user-message {
    width: min(var(--draw-result-row-width, 100%), calc(100vw - 24px));
    max-width: none;
  }

  .page-app .ai-draw-batch-shell {
    width: min(var(--draw-batch-width, 100%), 100%);
    max-width: 100%;
    transform: none;
  }

  .page-app .ai-draw-prompt-box {
    min-width: 0;
  }

  .page-app .ai-draw-message-block:not(.is-batch-item) .ai-draw-success-prompt {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .page-app .ai-draw-message-block:not(.is-batch-item) .ai-draw-success-prompt .ai-draw-prompt-actions {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }

  .page-app .ai-draw-message-block:not(.is-batch-item) .ai-draw-success-prompt .ai-draw-prompt-actions button {
    flex: 1 1 0;
  }

  .page-app .ai-draw-result-card {
    width: min(var(--draw-result-card-size, 182px), 100%);
    max-width: min(var(--draw-result-card-size, 182px), 100%);
  }

  .page-app .front-creative-composer-image,
  .page-app.is-sidebar-collapsed .front-creative-composer-image {
    left: 0;
    right: 0;
    width: 100%;
    height: var(--lz-creative-mobile-composer-shell-height);
    min-height: var(--lz-image-mobile-composer-shell-height);
    padding: 38px 10px 10px;
  }

  .page-app .front-video-composer-frame {
    width: 100%;
    height: 190px;
    min-height: 190px;
    margin: 0;
    padding: 13px 10px 57px;
    border-radius: 16px;
  }

  .page-app .front-creative-composer-tools {
    top: calc((30px + var(--lz-creative-composer-tools-gap)) * -1);
    width: 100%;
    height: 30px;
    justify-content: center;
    gap: 5px;
  }

  .page-app .front-creative-tool-chip,
  .page-app .front-creative-billing-pill {
    height: 30px;
    min-height: 30px;
  }

  .page-app .front-creative-tool-chip {
    width: 30px;
    min-width: 30px;
  }

  .page-app .front-creative-composer-left-image {
    left: var(--front-reference-mobile-left, 3px);
    top: 13px;
    width: 82px;
    height: 116px;
    transform: scale(.82);
    transform-origin: left top;
  }

  .page-app .front-creative-image-prompt textarea {
    left: 10px;
    right: 10px;
    top: 13px;
    width: auto;
    height: 116px;
    min-height: 116px;
    padding: 0 0 0 102px;
  }

  .page-app .ai-draw-inner-controls {
    left: 10px;
    right: 56px;
    bottom: 13px;
    height: 34px;
    overflow: hidden;
  }

  .page-app .ai-draw-selects {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .page-app .ai-draw-selects::-webkit-scrollbar {
    display: none;
  }

  .page-app .front-creative-composer-side-image {
    right: 10px;
    bottom: 13px;
    width: 40px;
    height: 40px;
  }

  .page-app .front-creative-send {
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
  }
}

@media (min-width: 861px) {
  html body.page-app.front-creative-page .ai-draw-page .ai-draw-stream {
    margin-left: var(--draw-stream-left, 0px);
    margin-right: 0;
    align-items: flex-start;
    width: min(560px, calc(100% - var(--draw-stream-left, 0px)));
    max-width: min(560px, calc(100% - var(--draw-stream-left, 0px)));
  }

  html body.page-app.front-creative-page:not(.page-admin) .ai-draw-page .ai-draw-stream .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-image[data-image-frame] {
    width: 194px;
    min-width: 194px;
    max-width: 194px;
    height: 194px;
    min-height: 194px;
    max-height: 194px;
    aspect-ratio: 1 / 1;
  }
}

html body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-tags, .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions, .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-tags, .ai-draw-batch-shell > .ai-draw-batch-actions) {
  width: max-content;
  max-width: 100%;
  display: inline-flex;
  grid-template-columns: none;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  flex-wrap: nowrap;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card {
  position: relative;
  min-height: 0;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-status {
  height: auto;
  min-height: 18px;
  max-width: 258px;
  font-size: 11px;
  line-height: 1.45;
  white-space: normal;
  color: #cfcfcf;
  -webkit-text-fill-color: currentColor;
}

html.jn-light-mode body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-status,
html[data-theme=light] body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-status,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-status,
body.page-app.front-creative-page[data-theme=light] .ai-draw-page .ai-draw-message-block > .ai-draw-result-card > .ai-draw-result-status {
  color: #64748b;
  -webkit-text-fill-color: currentColor;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block[data-status=failed] > .ai-draw-result-card > .ai-draw-result-status,
body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block[data-status=failed] > .ai-draw-result-card > .ai-draw-result-status {
  color: #ff9b9b;
  -webkit-text-fill-color: currentColor;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-message-block:not(.is-batch-item) > .ai-draw-result-card > .ai-draw-result-actions {
  position: relative;
  width: 100%;
  max-width: 100%;
}

html body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-tags span, .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-tags span, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]) {
  width: auto;
  height: 28px;
  min-width: max-content;
  min-height: 28px;
  max-width: none;
  margin: 0;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 7px;
  background: rgba(42, 42, 45, .92);
  color: #dedee2;
  -webkit-text-fill-color: #dedee2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
  backdrop-filter: none;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0;
  text-shadow: none;
  white-space: nowrap;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-tags span {
  min-width: 0;
  padding-inline: 4px;
  font-size: 10.5px;
  white-space: nowrap;
}

html body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-tags span, .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-tags span, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]) {
  min-width: max-content;
}

html body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]) {
  display: inline-flex;
  padding: 0 9px;
  cursor: pointer;
  transition: background-color .16s, border-color .16s, color .16s, transform .16s;
}

html body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]):hover {
  border-color: rgba(255, 255, 255, .18);
  background: rgba(52, 52, 56, .96);
  color: #f4f4f5;
  -webkit-text-fill-color: #f4f4f5;
  transform: translateY(-1px);
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-tags span, .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-tags span, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]),
body.page-app.front-creative-page:is(.jn-light-mode, [data-theme="light"]) .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-tags span, .ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-user-message > .ai-draw-tags span, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]) {
  border-color: rgba(32, 34, 39, .16);
  background: rgba(255, 255, 255, .96);
  color: #34363c;
  -webkit-text-fill-color: #34363c;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(24, 26, 31, .05);
  backdrop-filter: none;
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  text-shadow: none;
  opacity: 1;
}

:is(html.jn-light-mode, html[data-theme="light"]) body.page-app.front-creative-page .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]):hover,
body.page-app.front-creative-page:is(.jn-light-mode, [data-theme="light"]) .ai-draw-page :is(.ai-draw-message-block:not(.is-batch-item) .ai-draw-result-actions button, .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action]):hover {
  border-color: rgba(32, 34, 39, .24);
  background: #f1f2f4;
  color: #202126;
  -webkit-text-fill-color: #202126;
}

@media (max-width: 640px) {
  html body.page-app.front-creative-page .ai-draw-page .ai-draw-batch-shell > .ai-draw-batch-actions button[data-draw-batch-action] {
    height: 28px;
    min-height: 28px;
    padding: 0 3px;
    font-size: 11px;
    border-radius: 7px;
  }
}

.page-video {
  --front-video-chat-bg: var(--lz-front-workspace-bg);
  --front-composer-panel: var(--lz-front-composer-panel);
  --front-composer-line: var(--lz-front-composer-border);
  --front-composer-control: var(--lz-front-composer-control);
  --front-composer-control-line: var(--lz-front-composer-control-border);
  --front-composer-text: var(--lz-front-composer-text);
  --front-composer-muted: var(--lz-front-composer-muted);
  overflow: hidden;
  background: var(--front-video-chat-bg);
}

.page-video .main-area,
.page-video .workspace-main,
.page-video .workspace-module {
  background: var(--front-video-chat-bg);
}

.page-video .ai-video-page {
  background: var(--lz-front-video-stage-bg);
}

.ai-video-page {
  position: relative;
  width: 100%;
  height: 100dvh;
  min-height: 0;
  display: block;
  grid-template-rows: 72px minmax(0, 1fr);
  overflow: hidden;
  padding: 0;
}

.ai-video-stage {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  min-height: 0;
  display: block;
  overflow: auto;
  padding: 34px clamp(22px, 4vw, 72px) 246px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.ai-video-stage::-webkit-scrollbar {
  width: 8px;
}

.ai-video-stage::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #2a2c34;
}

.workspace-page .ai-video-empty {
  position: static;
  width: 100%;
  min-height: calc(100dvh - 280px);
  display: grid;
  place-items: center;
  margin: 0;
  color: var(--front-composer-muted);
  text-align: center;
  transform: none;
}

.workspace-page .front-creation-guide-frame {
  --front-creation-guide-icon-color: var(--creation-guide-accent, #f8fafc);
  --front-creation-guide-text-color: var(--creation-guide-content, #e4e4e7);
  --front-creation-guide-panel: var(--lz-front-guide-panel);
  --front-creation-guide-panel-image: var(--lz-front-guide-gradient);
  --front-creation-guide-line: var(--lz-front-guide-border);
  --front-creation-guide-shadow: var(--lz-front-guide-shadow);
  width: min(985px, calc(100% - 32px));
  max-width: min(985px, calc(100% - 32px));
  min-height: calc(100dvh - 396px);
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  text-align: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: translateY(-18px);
  overflow: visible;
}

html.jn-light-mode .workspace-page .front-creation-guide-frame,
html[data-theme="light"] .workspace-page .front-creation-guide-frame,
.workspace-page.jn-light-mode .front-creation-guide-frame,
.workspace-page[data-theme="light"] .front-creation-guide-frame {
  --front-creation-guide-icon-color: #2563eb;
  --front-creation-guide-text-color: var(--lz-front-guide-text);
}

.workspace-page .ai-video-empty-mark {
  width: 84px;
  height: 84px;
  min-width: 84px;
  min-height: 84px;
  max-width: 84px;
  max-height: 84px;
  flex: 0 0 84px;
  display: grid;
  place-items: center;
  padding: 0;
  margin: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--front-creation-guide-icon-color);
  box-shadow: none;
}

.workspace-page .ai-video-empty-mark img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  display: block;
  border-radius: 0;
  object-fit: contain;
}

.workspace-page .ai-video-empty-mark.is-text-icon {
  font-size: 38px;
  line-height: 1;
}

.workspace-page .ai-video-empty-mark.is-default-video-icon img,
.workspace-page .ai-video-empty-mark.is-video-grok-icon img {
  width: 72px;
  height: 72px;
  max-width: 72px;
  max-height: 72px;
}

.workspace-page .ai-video-intro-card {
  box-sizing: border-box;
  width: min(560px, 100%);
  max-width: min(560px, 100%);
  min-height: 91px;
  margin: 0;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--front-creation-guide-line);
  border-radius: 16px;
  background: var(--front-creation-guide-panel);
  background-image: var(--front-creation-guide-panel-image);
  color: var(--front-creation-guide-text-color);
  box-shadow: var(--front-creation-guide-shadow);
  font-size: var(--creation-guide-font-size, 15px);
  font-weight: 500;
  line-height: 1.75;
  text-align: center;
}

.workspace-page .ai-video-empty[hidden],
.ai-video-toast[hidden],
.ai-video-stream[hidden] {
  display: none;
}

.ai-video-stream {
  width: min(1060px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 64px;
}

.ai-video-stream.is-initializing-results {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.ai-video-composer {
  position: fixed;
  left: var(--front-menu-width);
  right: 0;
  bottom: 0;
  z-index: 70;
  box-sizing: border-box;
  width: auto;
  height: 222px;
  min-height: 0;
  display: block;
  padding: 0 38px 14px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--front-composer-text);
  box-shadow: none;
}

.front-video-composer-frame {
  position: relative;
  box-sizing: border-box;
  width: min(980px, 100%);
  height: 208px;
  min-height: 208px;
  grid-template-columns: 78px minmax(0, 1fr) 224px;
  margin: 0 auto;
  padding: 22px 22px 64px;
  overflow: visible;
  border: 1px solid var(--front-composer-line);
  border-radius: 18px;
  background: var(--front-composer-panel);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.front-creative-composer-tools {
  position: absolute;
  left: 50%;
  right: auto;
  top: var(--lz-creative-composer-tools-offset);
  z-index: 3;
  width: min(980px, calc(100% - 76px));
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  transform: translateX(-50%);
}

.front-creative-tool-chip,
.front-creative-billing-pill {
  box-sizing: border-box;
  height: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--front-composer-line);
  background: var(--lz-front-floating-control);
  color: var(--front-composer-text);
  box-shadow: none;
}

body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill span {
  min-height: 0;
}

.front-creative-tool-chip {
  width: 34px;
  min-width: 34px;
  padding: 0;
  border-radius: 10px;
  cursor: pointer;
}

.front-creative-tool-chip:hover {
  background: var(--lz-front-floating-control-hover);
}

.front-creative-tool-chip span {
  display: none;
}

.front-creative-tool-chip svg,
.front-creative-billing-pill svg {
  width: 16px;
  height: 16px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.front-creative-billing-pill {
  gap: 5px;
  padding: 0 12px;
  border-color: var(--lz-front-billing-border);
  border-radius: var(--lz-radius-pill);
  color: var(--lz-front-billing-text);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

.front-creative-billing-pill svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
  stroke: currentColor;
}

.front-creative-composer-left-video {
  position: absolute;
  left: 22px;
  top: 22px;
  z-index: 2;
  width: 92px;
  height: 116px;
}

.front-creative-composer-main-video,
.ai-video-prompt-panel,
.ai-video-prompt-wrap {
  position: static;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.ai-video-composer textarea {
  position: absolute;
  left: 22px;
  right: 22px;
  top: 22px;
  bottom: 64px;
  box-sizing: border-box;
  width: auto;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0 4px 0 112px;
  resize: none;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: var(--front-composer-text);
  box-shadow: none;
  font: 14px/1.62 var(--lz-font-sans);
}

.ai-video-composer textarea::placeholder {
  color: var(--front-composer-muted);
  opacity: 1;
}

.ai-video-hint {
  position: absolute;
  left: 134px;
  right: 78px;
  top: 24px;
  margin: 0;
  color: var(--front-composer-muted);
  font-size: var(--lz-font-size-md);
  line-height: 1.62;
  pointer-events: none;
}

.ai-video-composer textarea:not(:placeholder-shown) + .ai-video-hint,
.ai-video-composer textarea:focus + .ai-video-hint {
  display: none;
}

.ai-video-controls {
  position: absolute;
  left: 22px;
  right: 76px;
  bottom: 18px;
  z-index: 4;
  width: auto;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  overflow: visible;
}

.ai-video-controls > .ai-draw-selects {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 34px;
  min-height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scrollbar-color: var(--draw-param-scroll, rgba(174, 180, 192, 0.42)) transparent;
}

body.page-video.front-creative-page [data-front-creative-composer=video] [data-frame-pick] {
  flex-direction: column;
}

.ai-video-controls > .ai-draw-selects::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  display: block;
}

.ai-video-controls > .ai-draw-selects::-webkit-scrollbar-track {
  background: transparent;
}

.ai-video-controls > .ai-draw-selects::-webkit-scrollbar-thumb {
  border: 0;
  border-radius: 999px;
  background: var(--draw-param-scroll, rgba(174, 180, 192, 0.42));
}

.ai-video-composer .front-param-select {
  display: flex;
  flex: 0 0 auto;
}

.front-creative-composer-side-video {
  position: absolute;
  right: 18px;
  bottom: 18px;
  z-index: 5;
  width: 46px;
  height: 46px;
}

.workspace-page .ai-video-send {
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--front-composer-line);
  border-radius: var(--lz-radius-pill);
  background: rgba(42, 43, 45, 0.96);
  color: var(--front-composer-text);
  box-shadow: none;
  cursor: pointer;
}

.workspace-page .ai-video-send:disabled,
.workspace-page .ai-video-send.is-empty {
  color: rgba(246, 247, 251, 0.42);
  cursor: default;
}

.workspace-page .ai-video-send svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.workspace-page.is-sidebar-collapsed .ai-video-composer {
  left: var(--front-menu-offset);
  right: 0;
  width: auto;
}

html body.page-video.front-creative-page:not(.page-admin) [data-front-creative-composer=video] .front-chat-input:focus-visible{
  outline-offset:0;
}
html body.page-video.front-creative-page:not(.page-admin) [data-front-creative-composer=video] [data-front-param-select] > [data-select-trigger]:focus-visible{
  outline:1px auto rgb(229,151,0);
  outline-offset:0;
}
html body.page-video.front-creative-page:not(.page-admin) [data-front-creative-composer=video] [data-front-composer-keyboard]:focus-visible{
  outline-offset:0;
}
html body.page-video.front-creative-page:not(.page-admin) .ai-video-frame-scan-close:focus-visible{
  outline:1px auto rgb(229,151,0);
  outline-offset:0;
}

/* Authoritative source desktop video computed-style parity. */
@media(min-width:861px){
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-stream{
    background:#1b1c20;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-stream{
    background:#f4f6fa;
  }
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .front-video-composer-frame.ai-video-composer-inner{
    margin:0 auto;
  }
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .front-param-select.ai-draw-select{
    cursor:pointer;
    white-space:nowrap;
  }
  html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param] .front-param-check{
    opacity:1;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-draw-popover:is([data-param=model],[data-param=count]){
    box-shadow:0 18px 44px rgba(15,23,42,.14);
  }
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-hint{
    position:static;
    inset:auto;
    pointer-events:auto;
  }
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-control>select{
    border-radius:14px;
    font-size:15px;
    line-height:15px;
  }
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-control>select>option{
    column-gap:7.5px;
    font-size:15px;
    gap:7.5px;
    line-height:15px;
    row-gap:7.5px;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page :is(#aiVideoReferenceStore,#aiVideoReference){
    background:#242424;
    border-color:#2d2d2d;
  }
}

/* Keep video reference controls in exact desktop parity with the image workspace. */
@media (min-width: 861px) {
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page [data-front-creative-composer="video"] .front-creative-composer-left.front-creative-composer-left-video {
    left: var(--front-reference-left, 14px);
  }
}

[data-workspace-payment-ledger] {
  position: fixed;
  inset: 0;
  z-index: 100045;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(0, 0, 0, .62);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

[data-workspace-payment-ledger][hidden] {
  display: none;
}

[data-workspace-payment-ledger],
[data-workspace-payment-ledger] .front-ledger-modal,
[data-workspace-payment-ledger] .front-ledger-shell {
  box-sizing: border-box;
}

[data-workspace-payment-ledger] .front-ledger-modal.is-payment-mode {
  width: min(564px, calc(100vw - 28px));
  max-width: 100%;
  max-height: min(614px, calc(100dvh - 28px));
  overflow: hidden;
  padding: 0;
  border: 1px solid #1f2128;
  border-radius: 18px;
  background: #111217;
  color: #e7eaf0;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .62);
}

[data-workspace-payment-ledger] .front-ledger-shell {
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: min(614px, calc(100dvh - 28px));
  background: #111217;
}

[data-workspace-payment-ledger] .front-ledger-head {
  flex: 0 0 auto;
  height: 98px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 20px 20px 28px;
  border-bottom: 1px solid #25272f;
  background: #15161b;
}

[data-workspace-payment-ledger] .front-ledger-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 14px;
}

[data-workspace-payment-ledger] .front-ledger-icon {
  width: 51px;
  height: 51px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 14px;
  background: #14264a;
  color: #2f89ff;
}

[data-workspace-payment-ledger] .front-ledger-icon svg {
  width: 29px;
  height: 29px;
}

[data-workspace-payment-ledger] .front-ledger-title h2 {
  margin: 0;
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-size: 24px;
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: 0;
}

[data-workspace-payment-ledger] .front-ledger-title p {
  margin: 7px 0 0;
  color: #8b8f99;
  -webkit-text-fill-color: #8b8f99;
  font-size: 13px;
  line-height: 1.4;
}

[data-workspace-payment-ledger] .front-ledger-close {
  width: 36px;
  height: 36px;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: #25272e;
  color: #a6abb5;
  -webkit-text-fill-color: #a6abb5;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

[data-workspace-payment-ledger] .front-ledger-close:hover {
  background: #31343d;
  color: #fff;
  -webkit-text-fill-color: #fff;
}

[data-workspace-payment-ledger] .front-ledger-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 20px 0 24px;
  background: #101116;
}

[data-workspace-payment-ledger] .front-ledger-pane {
  display: block;
}

[data-workspace-payment-ledger] .front-ledger-other-list {
  display: grid;
  gap: 10px;
  padding: 0 28px;
}

[data-workspace-payment-ledger] .front-ledger-other-row {
  min-height: 128px;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  grid-template-rows: 1fr auto;
  gap: 0 14px;
  align-items: start;
  padding: 20px 18px 18px;
  border: 1px solid #2a2d36;
  border-radius: 13px;
  background: #15161b;
}

[data-workspace-payment-ledger] .front-pay-record-icon {
  grid-row: 1 / span 2;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 13px;
  background: #fff;
  color: #111827;
}

[data-workspace-payment-ledger] .front-pay-record-icon svg {
  width: 30px;
  height: 30px;
  display: block;
}

[data-workspace-payment-ledger] .front-pay-record-main {
  min-width: 0;
  display: grid;
  align-content: start;
}

[data-workspace-payment-ledger] .front-pay-record-title {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

[data-workspace-payment-ledger] .front-ledger-other-row strong {
  margin: 0;
  overflow: hidden;
  color: #fff;
  -webkit-text-fill-color: #fff;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-workspace-payment-ledger] .front-pay-record-status {
  height: 22px;
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0 8px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

[data-workspace-payment-ledger] .front-pay-record-status.paid,
[data-workspace-payment-ledger] .front-pay-record-status.success {
  border-color: rgba(16, 185, 129, .24);
  background: rgba(16, 185, 129, .13);
  color: #34d399;
  -webkit-text-fill-color: #34d399;
}

[data-workspace-payment-ledger] .front-pay-record-status.pending {
  border-color: rgba(245, 158, 11, .25);
  background: rgba(245, 158, 11, .14);
  color: #fbbf24;
  -webkit-text-fill-color: #fbbf24;
}

[data-workspace-payment-ledger] .front-pay-record-status.refunded,
[data-workspace-payment-ledger] .front-pay-record-status.refund {
  border-color: rgba(96, 165, 250, .25);
  background: rgba(96, 165, 250, .14);
  color: #93c5fd;
  -webkit-text-fill-color: #93c5fd;
}

[data-workspace-payment-ledger] .front-pay-record-status.failed {
  border-color: rgba(248, 113, 113, .25);
  background: rgba(248, 113, 113, .13);
  color: #fb7185;
  -webkit-text-fill-color: #fb7185;
}

[data-workspace-payment-ledger] .front-pay-record-meta {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
  color: #5f6570;
  -webkit-text-fill-color: #5f6570;
  font-size: 11px;
  line-height: 1.3;
}

[data-workspace-payment-ledger] .front-pay-record-meta b {
  height: 22px;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0 8px;
  border-radius: 4px;
  background: #0b7a45;
  color: #8dffc2;
  -webkit-text-fill-color: #8dffc2;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

[data-workspace-payment-ledger] .front-pay-record-meta code {
  min-width: 0;
  overflow: hidden;
  color: #636a75;
  -webkit-text-fill-color: #636a75;
  font-family: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-workspace-payment-ledger] .front-ledger-other-row em {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
  justify-self: end;
  color: #2f89ff;
  -webkit-text-fill-color: #2f89ff;
  font-size: 19px;
  font-style: normal;
  font-weight: 1000;
  line-height: 1.1;
  white-space: nowrap;
}

[data-workspace-payment-ledger] .front-ledger-other-row time {
  grid-column: 2 / 4;
  align-self: end;
  margin-top: 17px;
  padding-top: 13px;
  border-top: 1px solid #24262d;
  color: #7d838e;
  -webkit-text-fill-color: #7d838e;
  font-size: 13px;
  line-height: 1.2;
}

[data-workspace-payment-ledger] .front-ledger-other-row time::before {
  content: "";
  width: 13px;
  height: 13px;
  display: inline-block;
  box-sizing: border-box;
  margin-right: 7px;
  vertical-align: -2px;
  border: 1.8px solid #727884;
  border-radius: 50%;
}

[data-workspace-payment-ledger] .front-ledger-other-row time::after {
  content: "";
  position: relative;
  width: 4px;
  height: 4px;
  display: inline-block;
  margin-right: 54px;
  margin-left: -58px;
  transform: translate(6px, -4px);
  border-bottom: 1.6px solid #727884;
  border-left: 1.6px solid #727884;
  vertical-align: 1px;
}

[data-workspace-payment-ledger] .front-pay-record-end {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 22px auto 0;
  color: #858489;
  -webkit-text-fill-color: #858489;
  font-size: 12px;
}

[data-workspace-payment-ledger] .front-pay-record-end::before,
[data-workspace-payment-ledger] .front-pay-record-end::after {
  content: "";
  width: 86px;
  height: 1px;
  background: rgba(255, 255, 255, .10);
}

[data-workspace-payment-ledger] .front-ledger-empty {
  min-height: 260px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: #7d8390;
  text-align: center;
}

[data-workspace-payment-ledger] .front-ledger-empty-inner strong {
  display: block;
  margin: 0;
  color: #626873;
  -webkit-text-fill-color: #626873;
  font-size: 13px;
  font-weight: 700;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-modal.is-payment-mode,
body.jn-light-mode:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-modal.is-payment-mode,
body[data-theme="light"]:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-modal.is-payment-mode {
  border-color: #dededf;
  background: #f7f7f8;
  color: #2f2f31;
  box-shadow: 0 28px 72px rgba(32, 32, 34, .16);
  color-scheme: light;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] :is(.front-ledger-shell, .front-ledger-body),
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] :is(.front-ledger-shell, .front-ledger-body) {
  background: #f7f7f8;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-head,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-head {
  border-color: #dededf;
  background: #fff;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-icon,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-icon {
  background: #ededee;
  color: #555458;
  box-shadow: none;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-title h2,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-title h2 {
  color: #2a2a2c;
  -webkit-text-fill-color: #2a2a2c;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-title p,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-title p {
  color: #737276;
  -webkit-text-fill-color: #737276;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-close,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-close {
  background: #eeeeef;
  color: #626165;
  -webkit-text-fill-color: #626165;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row {
  border-color: #dededf;
  background: #fff;
  color: #2f2f31;
  -webkit-text-fill-color: #2f2f31;
  box-shadow: 0 6px 18px rgba(32, 32, 34, .05);
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row strong,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row strong {
  color: #2f2f31;
  -webkit-text-fill-color: #2f2f31;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] :is(.front-pay-record-meta, .front-pay-record-meta code),
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] :is(.front-pay-record-meta, .front-pay-record-meta code) {
  color: #77767a;
  -webkit-text-fill-color: #77767a;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-meta b,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-meta b {
  background: #e8f8f1;
  color: #137657;
  -webkit-text-fill-color: #137657;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row em,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row em {
  color: #936525;
  -webkit-text-fill-color: #936525;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row time,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-ledger-other-row time {
  border-color: #e4e4e5;
  color: #77767a;
  -webkit-text-fill-color: #77767a;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-end,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-end {
  color: #929195;
  -webkit-text-fill-color: #929195;
}

:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-end::before,
:is(html.jn-light-mode, html[data-theme="light"]) body:not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-end::after,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-end::before,
:is(body.jn-light-mode, body[data-theme="light"]):not(.page-admin) [data-workspace-payment-ledger] .front-pay-record-end::after {
  background: #dededf;
}

@media (max-width: 760px) {
  [data-workspace-payment-ledger] {
    padding: 10px;
  }

  [data-workspace-payment-ledger] .front-ledger-modal.is-payment-mode {
    width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
    border-radius: 12px;
  }

  [data-workspace-payment-ledger] .front-ledger-shell {
    max-height: calc(100dvh - 20px);
  }

  [data-workspace-payment-ledger] .front-ledger-head {
    height: 78px;
    padding: 14px 14px 13px 16px;
  }

  [data-workspace-payment-ledger] .front-ledger-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
  }

  [data-workspace-payment-ledger] .front-ledger-title h2 {
    font-size: 19px;
  }

  [data-workspace-payment-ledger] .front-ledger-body {
    padding: 12px 0 16px;
  }

  [data-workspace-payment-ledger] .front-ledger-other-list {
    gap: 8px;
    padding: 0 10px;
  }

  [data-workspace-payment-ledger] .front-ledger-other-row {
    min-height: 110px;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    gap: 0 10px;
    padding: 13px 12px;
  }

  [data-workspace-payment-ledger] .front-pay-record-icon {
    width: 38px;
    height: 38px;
  }

  [data-workspace-payment-ledger] .front-pay-record-icon svg {
    width: 27px;
    height: 27px;
  }

  [data-workspace-payment-ledger] .front-ledger-other-row strong {
    font-size: 14px;
  }

  [data-workspace-payment-ledger] .front-ledger-other-row em {
    font-size: 16px;
  }

  [data-workspace-payment-ledger] .front-ledger-other-row time {
    margin-top: 12px;
    padding-top: 10px;
    font-size: 12px;
  }

  [data-workspace-payment-ledger] .front-pay-record-meta {
    gap: 5px;
    margin-top: 6px;
  }

  [data-workspace-payment-ledger] .front-pay-record-meta b {
    height: 20px;
    padding: 0 6px;
    font-size: 10px;
  }

  [data-workspace-payment-ledger] .front-ledger-empty {
    min-height: 250px;
  }
}

/* Canonical account-service status card shared by recharge, membership and redemption. */
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service{
  --jn-account-balance-bg:#f4f5ff;
  --jn-account-balance-border:#cbd0f6;
  --jn-account-balance-label:#6570b8;
  --jn-account-balance-value:#39447e;
  --jn-account-balance-unit:#7b83b5;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership{
  --jn-account-balance-bg:#fff9eb;
  --jn-account-balance-border:#ead7a8;
  --jn-account-balance-label:#8b6b2e;
  --jn-account-balance-value:#5f471d;
  --jn-account-balance-unit:#8b6b2e;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --jn-account-balance-bg:#effaf6;
  --jn-account-balance-border:#bfe5d9;
  --jn-account-balance-label:#3f8d76;
  --jn-account-balance-value:#246653;
  --jn-account-balance-unit:#5f9888;
}
html[data-theme="dark"]:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service{
  --jn-account-balance-bg:#262936;
  --jn-account-balance-border:#424966;
  --jn-account-balance-label:#a7afe8;
  --jn-account-balance-value:#e0e4ff;
  --jn-account-balance-unit:#aab2e8;
}
html[data-theme="dark"]:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership{
  --jn-account-balance-bg:#2d2a23;
  --jn-account-balance-border:#4b4230;
  --jn-account-balance-label:#bda66f;
  --jn-account-balance-value:#f0d79f;
  --jn-account-balance-unit:#bda66f;
}
html[data-theme="dark"]:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --jn-account-balance-bg:#22302d;
  --jn-account-balance-border:#36554e;
  --jn-account-balance-label:#86b9aa;
  --jn-account-balance-value:#d0f1e7;
  --jn-account-balance-unit:#91c5b5;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  width:100%;
  height:60px;
  min-height:60px;
  max-height:60px;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:center;
  gap:0;
  padding:8px 10px;
  border:1px solid var(--jn-account-balance-border);
  border-radius:8px;
  background:var(--jn-account-balance-bg);
  background-image:none;
  color:var(--jn-account-balance-value);
  box-shadow:none;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>.is-balance-copy{
  width:100%;
  min-width:0;
  display:block;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>.is-member-copy{
  width:100%;
  min-width:0;
  display:none;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-balance-copy{
  display:none;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy{
  display:block;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance :is(.is-balance-copy,.is-member-copy)>small{
  display:block;
  margin:0 0 3px;
  color:var(--jn-account-balance-label);
  -webkit-text-fill-color:var(--jn-account-balance-label);
  font-size:9.5px;
  font-weight:700;
  line-height:13px;
  letter-spacing:0;
  white-space:nowrap;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance :is(.is-balance-copy,.is-member-copy)>span{
  width:100%;
  min-width:0;
  display:flex;
  align-items:baseline;
  gap:3px;
  margin:0;
  white-space:nowrap;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance :is(.is-balance-copy,.is-member-copy) strong{
  width:auto;
  min-width:max-content;
  max-width:none;
  overflow:visible;
  color:var(--jn-account-balance-value);
  -webkit-text-fill-color:var(--jn-account-balance-value);
  font-size:12.5px;
  font-weight:850;
  line-height:16px;
  letter-spacing:0;
  text-overflow:clip;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance .is-member-copy strong{
  font-size:11px;
}
html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance .is-balance-copy em{
  flex:0 0 auto;
  color:var(--jn-account-balance-unit);
  -webkit-text-fill-color:var(--jn-account-balance-unit);
  font-size:9.5px;
  font-style:normal;
  line-height:13px;
  letter-spacing:0;
  white-space:nowrap;
}

/* Keep the compact mobile status card aligned across all account-service tabs. */
@media (max-width:760px){
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
    height:114px;
    min-height:114px;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
    grid-column:1 / -1;
    grid-row:2;
    height:50px;
    min-height:50px;
    max-height:50px;
    padding:6px 10px;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>:is(.is-balance-copy,.is-member-copy){
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>.is-balance-copy{
    display:flex;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-balance-copy{
    display:none;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy{
    display:flex;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance :is(.is-balance-copy,.is-member-copy)>small{
    flex:0 0 auto;
    margin:0;
    font-size:10.5px;
    line-height:15px;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance :is(.is-balance-copy,.is-member-copy)>span{
    width:auto;
    margin-left:auto;
    justify-content:flex-end;
  }
  html:not(#jnAccountBalanceUnifiedA#jnAccountBalanceUnifiedB#jnAccountBalanceUnifiedC#jnAccountBalanceUnifiedD#jnAccountBalanceUnifiedE#jnAccountBalanceUnifiedF#jnAccountBalanceUnifiedG#jnAccountBalanceUnifiedH#jnAccountBalanceUnifiedI#jnAccountBalanceUnifiedJ#jnAccountBalanceUnifiedK#jnAccountBalanceUnifiedL#jnAccountBalanceUnifiedM#jnAccountBalanceUnifiedN#jnAccountBalanceUnifiedO#jnAccountBalanceUnifiedP#jnAccountBalanceUnifiedQ#jnAccountBalanceUnifiedR#jnAccountBalanceUnifiedS#jnAccountBalanceUnifiedT#jnAccountBalanceUnifiedU#jnAccountBalanceUnifiedV#jnAccountBalanceUnifiedW#jnAccountBalanceUnifiedX#jnAccountBalanceUnifiedY#jnAccountBalanceUnifiedZ#jnAccountBalanceUnifiedAA#jnAccountBalanceUnifiedAB#jnAccountBalanceUnifiedAC#jnAccountBalanceUnifiedAD#jnAccountBalanceUnifiedAE#jnAccountBalanceUnifiedAF#jnAccountBalanceUnifiedAG#jnAccountBalanceUnifiedAH#jnAccountBalanceUnifiedAI#jnAccountBalanceUnifiedAJ#jnAccountBalanceUnifiedAK#jnAccountBalanceUnifiedAL#jnAccountBalanceUnifiedAM#jnAccountBalanceUnifiedAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance .is-member-copy strong{
    font-size:11.5px;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online{
    --jn-mobile-balance-bg:#f4f5ff;
    --jn-mobile-balance-border:#cbd0f6;
    --jn-mobile-balance-label:#6570b8;
    --jn-mobile-balance-value:#39447e;
    --jn-mobile-balance-unit:#7b83b5;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
    --jn-mobile-balance-bg:#effaf6;
    --jn-mobile-balance-border:#bfe5d9;
    --jn-mobile-balance-label:#3f8d76;
    --jn-mobile-balance-value:#246653;
    --jn-mobile-balance-unit:#5f9888;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online{
    --jn-mobile-balance-bg:#262936;
    --jn-mobile-balance-border:#424966;
    --jn-mobile-balance-label:#a7afe8;
    --jn-mobile-balance-value:#e0e4ff;
    --jn-mobile-balance-unit:#aab2e8;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
    --jn-mobile-balance-bg:#22302d;
    --jn-mobile-balance-border:#36554e;
    --jn-mobile-balance-label:#86b9aa;
    --jn-mobile-balance-value:#d0f1e7;
    --jn-mobile-balance-unit:#91c5b5;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav{
    height:114px;
    min-height:114px;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance{
    height:50px;
    min-height:50px;
    grid-template-columns:minmax(0,1fr);
    align-items:center;
    gap:0;
    padding:6px 10px;
    border:1px solid var(--jn-mobile-balance-border);
    border-radius:8px;
    background:var(--jn-mobile-balance-bg);
    box-shadow:none;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>:is(.is-balance-icon,.is-member-icon,.is-member-copy){
    display:none;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy{
    width:100%;
    min-width:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy small{
    flex:0 0 auto;
    margin:0;
    color:var(--jn-mobile-balance-label);
    -webkit-text-fill-color:var(--jn-mobile-balance-label);
    font-size:10.5px;
    font-weight:700;
    line-height:15px;
    white-space:nowrap;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy>span{
    width:auto;
    min-width:0;
    margin-left:auto;
    display:flex;
    align-items:baseline;
    justify-content:flex-end;
    gap:3px;
    white-space:nowrap;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy strong{
    width:auto;
    min-width:max-content;
    max-width:none;
    color:var(--jn-mobile-balance-value);
    -webkit-text-fill-color:var(--jn-mobile-balance-value);
    font-size:12.5px;
    line-height:16px;
    font-variant-numeric:tabular-nums;
  }
  html:not(#jnMobileBalanceFinalA#jnMobileBalanceFinalB#jnMobileBalanceFinalC#jnMobileBalanceFinalD#jnMobileBalanceFinalE#jnMobileBalanceFinalF#jnMobileBalanceFinalG#jnMobileBalanceFinalH#jnMobileBalanceFinalI#jnMobileBalanceFinalJ#jnMobileBalanceFinalK#jnMobileBalanceFinalL#jnMobileBalanceFinalM#jnMobileBalanceFinalN#jnMobileBalanceFinalO#jnMobileBalanceFinalP#jnMobileBalanceFinalQ#jnMobileBalanceFinalR#jnMobileBalanceFinalS#jnMobileBalanceFinalT#jnMobileBalanceFinalU#jnMobileBalanceFinalV#jnMobileBalanceFinalW#jnMobileBalanceFinalX#jnMobileBalanceFinalY#jnMobileBalanceFinalZ#jnMobileBalanceFinalAA#jnMobileBalanceFinalAB#jnMobileBalanceFinalAC#jnMobileBalanceFinalAD#jnMobileBalanceFinalAE#jnMobileBalanceFinalAF#jnMobileBalanceFinalAG#jnMobileBalanceFinalAH#jnMobileBalanceFinalAI#jnMobileBalanceFinalAJ#jnMobileBalanceFinalAK#jnMobileBalanceFinalAL#jnMobileBalanceFinalAM#jnMobileBalanceFinalAN) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy em{
    color:var(--jn-mobile-balance-unit);
    -webkit-text-fill-color:var(--jn-mobile-balance-unit);
    font-size:9.5px;
    line-height:13px;
  }
}

/* Redeem center: a dedicated account-service layout shared by desktop and mobile. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --redeem-bg:#f4f6fa;
  --redeem-panel:#ffffff;
  --redeem-panel-alt:#f8f9fc;
  --redeem-line:#e1e5ee;
  --redeem-line-strong:#ccd3df;
  --redeem-text:#1d2433;
  --redeem-soft:#4d586b;
  --redeem-muted:#7f899a;
  --redeem-accent:#7068d8;
  --redeem-accent-hover:#625acb;
  --redeem-accent-soft:rgba(112,104,216,.10);
  --redeem-success:#168a67;
  --redeem-success-soft:rgba(22,138,103,.09);
  --redeem-shadow:0 20px 52px rgba(35,42,60,.10);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-scroll{
  overflow:auto;
  background:var(--redeem-bg);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
  min-height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:36px 34px;
  background:var(--redeem-bg);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-shell{
  width:min(920px,100%);
  margin:auto;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-card{
  width:100%;
  min-height:460px;
  display:grid;
  grid-template-columns:minmax(0,1.34fr) minmax(300px,.82fr);
  gap:0;
  padding:0;
  overflow:hidden;
  border:1px solid var(--redeem-line);
  border-radius:18px;
  background:var(--redeem-panel);
  box-shadow:var(--redeem-shadow);
  text-align:left;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v4-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:40px 42px 38px;
  background:var(--redeem-panel);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v4-aside{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:20px;
  padding:38px 30px;
  border-left:1px solid var(--redeem-line);
  background:var(--redeem-panel-alt);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero{
  display:flex;
  align-items:center;
  gap:22px;
  margin:0 0 44px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art{
  position:relative;
  width:150px;
  height:86px;
  display:flex;
  align-items:center;
  gap:13px;
  flex:0 0 auto;
  padding:14px 15px;
  overflow:hidden;
  border:1px solid rgba(112,104,216,.22);
  border-radius:14px;
  background:#292d39;
  box-shadow:0 12px 28px rgba(35,39,54,.18);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art::before,
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art::after{
  content:"";
  position:absolute;
  right:34px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:var(--redeem-panel);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art::before{top:-9px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art::after{bottom:-9px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-mark{
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:rgba(112,104,216,.28);
  color:#c6c2ff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-mark .recharge-v2-icon{
  width:23px;
  height:23px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-copy{
  min-width:0;
  display:grid;
  gap:5px;
  color:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-copy strong{
  font-size:12px;
  font-weight:850;
  line-height:1.25;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-copy small{
  color:#9da4b4;
  font-size:8px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy{
  min-width:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy>span{
  display:block;
  margin-bottom:7px;
  color:var(--redeem-accent);
  font-size:11px;
  font-weight:850;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy h2{
  margin:0;
  color:var(--redeem-text);
  font-size:26px;
  font-weight:900;
  line-height:1.18;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy p{
  margin:9px 0 0;
  color:var(--redeem-muted);
  font-size:12px;
  line-height:1.65;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry{
  display:grid;
  gap:10px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry>label{
  color:var(--redeem-text);
  font-size:13px;
  font-weight:850;
  line-height:1.4;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap{
  height:58px;
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:0 8px 0 16px;
  border:1px solid var(--redeem-line-strong);
  border-radius:12px;
  background:var(--redeem-panel-alt);
  box-shadow:inset 0 1px 2px rgba(29,36,51,.03);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap:focus-within{
  border-color:var(--redeem-accent);
  background:var(--redeem-panel);
  box-shadow:0 0 0 4px var(--redeem-accent-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap>.recharge-v2-icon{
  width:20px;
  height:20px;
  color:var(--redeem-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap>input{
  width:100%;
  min-width:0;
  height:54px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--redeem-text);
  font-size:14px;
  font-weight:700;
  line-height:54px;
  text-align:left;
  letter-spacing:0;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap>input::placeholder{
  color:var(--redeem-muted);
  font-weight:500;
  letter-spacing:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-paste{
  width:auto;
  min-width:74px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 13px;
  border:1px solid var(--redeem-line);
  border-radius:9px;
  background:var(--redeem-panel);
  color:var(--redeem-soft);
  font-size:12px;
  font-weight:800;
  box-shadow:0 3px 9px rgba(35,42,60,.05);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-paste:hover{
  border-color:var(--redeem-accent);
  color:var(--redeem-accent);
  background:var(--redeem-accent-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-paste .recharge-v2-icon{
  width:15px;
  height:15px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry>small{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--redeem-muted);
  font-size:10px;
  line-height:1.5;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry>small .recharge-v2-icon{
  width:14px;
  height:14px;
  flex:0 0 auto;
  color:var(--redeem-success);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-submit{
  width:100%;
  height:52px;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:auto;
  padding:0 20px;
  border:0;
  border-radius:11px;
  background:var(--redeem-accent);
  color:#fff;
  font-size:14px;
  font-weight:900;
  box-shadow:0 12px 24px rgba(112,104,216,.22);
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-submit:hover:not(:disabled){
  background:var(--redeem-accent-hover);
  box-shadow:0 15px 30px rgba(112,104,216,.28);
  transform:translateY(-1px);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-submit:disabled{
  background:var(--redeem-line-strong);
  color:var(--redeem-muted);
  box-shadow:none;
  cursor:not-allowed;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-submit .recharge-v2-icon{
  width:17px;
  height:17px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide{
  min-width:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-head{
  display:grid;
  gap:6px;
  margin-bottom:18px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-head h3{
  margin:0;
  color:var(--redeem-text);
  font-size:16px;
  font-weight:900;
  line-height:1.3;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-head>span{
  color:var(--redeem-muted);
  font-size:10px;
  line-height:1.5;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item{
  min-width:0;
  min-height:68px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:11px;
  padding:11px 12px;
  border:1px solid var(--redeem-line);
  border-radius:11px;
  background:var(--redeem-panel);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item>span{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--redeem-accent-soft);
  color:var(--redeem-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item:nth-child(2)>span{
  background:rgba(205,145,37,.10);
  color:#b47a18;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item:nth-child(3)>span{
  background:var(--redeem-success-soft);
  color:var(--redeem-success);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item>span .recharge-v2-icon{
  width:19px;
  height:19px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item>div{
  min-width:0;
  display:grid;
  gap:4px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item strong{
  color:var(--redeem-text);
  font-size:12px;
  font-weight:850;
  line-height:1.35;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item small{
  color:var(--redeem-muted);
  font-size:10px;
  line-height:1.45;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip{
  min-width:0;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:start;
  gap:10px;
  margin-top:auto;
  padding:13px;
  border:1px solid rgba(22,138,103,.20);
  border-radius:11px;
  background:var(--redeem-success-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:var(--redeem-panel);
  color:var(--redeem-success);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip>span .recharge-v2-icon{
  width:17px;
  height:17px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip>div{
  min-width:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip strong{
  display:block;
  margin-bottom:4px;
  color:var(--redeem-text);
  font-size:11px;
  font-weight:850;
  line-height:1.35;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip p{
  margin:0;
  color:var(--redeem-soft);
  font-size:10px;
  line-height:1.55;
}

html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --redeem-bg:#17181c;
  --redeem-panel:#202228;
  --redeem-panel-alt:#1b1c20;
  --redeem-line:#353840;
  --redeem-line-strong:#484c57;
  --redeem-text:#f0f1f4;
  --redeem-soft:#c1c5ce;
  --redeem-muted:#9298a5;
  --redeem-accent:#8b86e8;
  --redeem-accent-hover:#9a95f2;
  --redeem-accent-soft:rgba(139,134,232,.14);
  --redeem-success:#55c59e;
  --redeem-success-soft:rgba(53,163,126,.12);
  --redeem-shadow:0 22px 56px rgba(0,0,0,.24);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art{
  border-color:#4a4e59;
  background:#2a2d34;
  box-shadow:0 13px 30px rgba(0,0,0,.24);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap{
  box-shadow:inset 0 1px 3px rgba(0,0,0,.16);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-paste{
  box-shadow:none;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item:nth-child(2)>span{
  background:rgba(217,170,75,.13);
  color:#ddb45e;
}

@media (min-width:761px) and (max-width:1120px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
    padding:28px 24px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-card{
    grid-template-columns:minmax(0,1.2fr) minmax(270px,.8fr);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v4-main{
    padding:34px 30px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v4-aside{
    padding:32px 24px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero{
    gap:17px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art{
    width:132px;
  }
}

@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-scroll{
    overflow-y:auto;
    overflow-x:hidden;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-scroll::-webkit-scrollbar{
    width:0;
    height:0;
    display:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
    height:auto;
    min-height:100%;
    display:block;
    padding:12px 10px 16px;
    overflow:visible;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-shell{
    width:100%;
    height:auto;
    min-height:0;
    margin:0;
    overflow:visible;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-card{
    height:auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    overflow:visible;
    border-radius:13px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v4-main{
    padding:18px 15px 16px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v4-aside{
    gap:13px;
    padding:17px 15px;
    border-top:1px solid var(--redeem-line);
    border-left:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero{
    align-items:flex-start;
    gap:13px;
    margin-bottom:20px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art{
    width:92px;
    height:64px;
    gap:8px;
    padding:10px;
    border-radius:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art::before,
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-art::after{
    right:21px;
    width:13px;
    height:13px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-mark{
    width:32px;
    height:32px;
    border-radius:9px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-mark .recharge-v2-icon{
    width:17px;
    height:17px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-copy{
    gap:3px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-copy strong{
    max-width:34px;
    font-size:9px;
    white-space:normal;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-ticket-copy small{
    display:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy>span{
    margin-bottom:4px;
    font-size:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy h2{
    font-size:21px;
    line-height:1.2;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy p{
    margin-top:5px;
    font-size:11px;
    line-height:1.5;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry{
    gap:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry>label{
    font-size:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap{
    height:52px;
    grid-template-columns:19px minmax(0,1fr) auto;
    gap:8px;
    padding:0 6px 0 12px;
    border-radius:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap>.recharge-v2-icon{
    width:17px;
    height:17px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-input-wrap>input{
    height:48px;
    font-size:13px;
    line-height:48px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-paste{
    min-width:62px;
    height:38px;
    padding:0 10px;
    font-size:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-entry>small{
    align-items:flex-start;
    font-size:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-submit{
    height:48px;
    min-height:48px;
    margin-top:18px;
    font-size:13px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-head{
    margin-bottom:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-head h3{
    font-size:14px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-grid{
    gap:7px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item{
    min-height:60px;
    grid-template-columns:34px minmax(0,1fr);
    gap:10px;
    padding:9px 10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item>span{
    width:34px;
    height:34px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item strong{
    font-size:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item small{
    font-size:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip{
    margin-top:0;
  }
}

/* Recharge workspace: online credits and membership use dedicated desktop/mobile layouts. */
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal{
  --recharge-bg:#0f1218;
  --recharge-panel:#151922;
  --recharge-panel-2:#1b202b;
  --recharge-panel-3:#222936;
  --recharge-line:#2a3240;
  --recharge-line-strong:#3a4658;
  --recharge-text:#f7f9fc;
  --recharge-soft:#d5dbe6;
  --recharge-muted:#8e99aa;
  --recharge-blue:#4d8dff;
  --recharge-blue-strong:#3478f6;
  --recharge-blue-soft:rgba(77,141,255,.13);
  --recharge-gold:#e8b84a;
  --recharge-gold-strong:#d69b28;
  --recharge-gold-soft:rgba(232,184,74,.12);
  width:min(1180px,calc(100vw - 40px));
  height:min(760px,calc(100dvh - 40px));
  max-height:calc(100dvh - 40px);
  display:flex;
  flex-direction:column;
  padding:0;
  overflow:hidden;
  border:1px solid var(--recharge-line);
  border-radius:8px;
  background:var(--recharge-bg);
  background-image:none;
  color:var(--recharge-text);
  box-shadow:0 30px 90px rgba(0,0,0,.52);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal *,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal *::before,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal *::after{box-sizing:border-box}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal button{font:inherit;letter-spacing:0}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-head{
  min-height:82px;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0;
  padding:16px 20px;
  border-bottom:1px solid var(--recharge-line);
  background:var(--recharge-panel);
}
body:not(.page-admin) [data-front-app-public-root] .front-shop-title{min-width:0;display:flex;align-items:center;gap:12px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-title-icon{
  width:46px;
  height:46px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid rgba(77,141,255,.3);
  border-radius:8px;
  background:var(--recharge-blue-soft);
  color:#79a9ff;
}
body:not(.page-admin) [data-front-app-public-root] .is-membership .front-shop-title-icon{border-color:rgba(232,184,74,.28);background:var(--recharge-gold-soft);color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-title-icon svg{width:25px;height:25px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-title small{display:block;margin:0 0 2px;color:var(--recharge-blue);font-size:10px;font-weight:800;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .is-membership .front-shop-title small{color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-head h2{margin:0;color:var(--recharge-text);font-size:20px;font-weight:900;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-head p{margin:4px 0 0;color:var(--recharge-muted);font-size:12px;line-height:1.3}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-close{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  padding:0;
  border:1px solid var(--recharge-line);
  border-radius:6px;
  background:var(--recharge-panel-2);
  color:var(--recharge-muted);
  font-size:21px;
  line-height:1;
  cursor:pointer;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-close:hover{border-color:var(--recharge-line-strong);color:var(--recharge-text)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-shell{min-height:0;flex:1 1 auto;display:grid;grid-template-columns:184px minmax(0,1fr)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tabs{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:6px;
  margin:0;
  padding:18px 12px;
  border:0;
  border-right:1px solid var(--recharge-line);
  border-radius:0;
  background:var(--recharge-panel);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tab{
  width:100%;
  height:58px;
  min-width:0;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:0 10px;
  border:1px solid transparent;
  border-radius:6px;
  background:transparent;
  color:var(--recharge-muted);
  text-align:left;
  cursor:pointer;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tab:hover{background:var(--recharge-panel-2);color:var(--recharge-soft)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tab.is-active{border-color:rgba(77,141,255,.28);background:var(--recharge-blue-soft);color:#82adff;box-shadow:inset 3px 0 0 var(--recharge-blue)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal.is-membership .front-shop-tab.is-active{border-color:rgba(232,184,74,.28);background:var(--recharge-gold-soft);color:var(--recharge-gold);box-shadow:inset 3px 0 0 var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-tab-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:6px;background:var(--recharge-panel-2);color:inherit}
body:not(.page-admin) [data-front-app-public-root] .front-shop-tab-icon svg{width:18px;height:18px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-tab>span:last-child{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-tab strong{color:inherit;font-size:13px;font-weight:850;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .front-shop-tab small{color:var(--recharge-muted);font-size:10px;font-weight:600;line-height:1.2;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-shop-content{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;background:var(--recharge-bg)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-pane{min-height:100%}
body:not(.page-admin) [data-front-app-public-root] .front-shop-pane[style*="display: none"]{display:none}
body:not(.page-admin) [data-front-app-public-root] .front-online-layout{min-height:100%;display:grid;grid-template-columns:minmax(0,1fr) 286px}
body:not(.page-admin) [data-front-app-public-root] .front-online-main{min-width:0;padding:22px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:16px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head>div{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head small{display:block;margin:0 0 4px;color:var(--recharge-blue);font-size:10px;font-weight:850;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-member-view .front-shop-section-head small{color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head h3{margin:0;color:var(--recharge-text);font-size:17px;font-weight:900;line-height:1.25}
body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head>span{color:var(--recharge-muted);font-size:11px;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card{
  position:relative;
  min-width:0;
  min-height:208px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:15px;
  overflow:hidden;
  border:1px solid var(--recharge-line);
  border-radius:8px;
  background:var(--recharge-panel);
  background-image:none;
  color:var(--recharge-text);
  text-align:left;
  cursor:pointer;
  box-shadow:none;
  transition:transform .16s ease,border-color .16s ease,background-color .16s ease;
}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card:hover{transform:translateY(-2px);border-color:var(--recharge-line-strong);background:var(--recharge-panel-2)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card.featured{border-color:rgba(77,141,255,.75);box-shadow:inset 0 0 0 1px rgba(77,141,255,.13)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card.featured::after{content:none;display:none}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card-badge,
body:not(.page-admin) [data-front-app-public-root] .front-member-badge{position:absolute;top:0;right:0;padding:5px 9px;border-radius:0 0 0 6px;background:var(--recharge-blue);color:#fff;font-size:10px;font-weight:850;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card-icon{width:34px;height:34px;display:grid;place-items:center;margin-bottom:11px;border-radius:6px;background:var(--recharge-blue-soft);color:#77a7ff}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card-icon svg{width:19px;height:19px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card-copy{min-width:0;width:100%;display:grid;gap:4px;margin-bottom:10px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card-copy strong{overflow:hidden;color:var(--recharge-text);font-size:14px;font-weight:850;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-shop-card-copy small{overflow:hidden;color:var(--recharge-muted);font-size:10px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-shop-price{display:flex;align-items:flex-start;margin:0;color:var(--recharge-text);font-weight:900;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .front-shop-price small{margin:3px 3px 0 0;color:var(--recharge-muted);font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-price strong{color:var(--recharge-text);font-size:27px;font-weight:950;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .front-shop-credits{display:block;margin:7px 0 13px;padding:0;border:0;color:#83adfc;font-size:11px;font-weight:750;line-height:1.3}
body:not(.page-admin) [data-front-app-public-root] .front-shop-credits b{margin-right:1px;color:var(--recharge-blue);font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-buy,
body:not(.page-admin) [data-front-app-public-root] .front-member-buy{width:100%;height:34px;display:flex;align-items:center;justify-content:center;gap:5px;margin-top:auto;border-radius:6px;background:var(--recharge-blue-strong);color:#fff;font-size:11px;font-weight:850;line-height:1;box-shadow:none}
body:not(.page-admin) [data-front-app-public-root] .front-shop-buy svg,
body:not(.page-admin) [data-front-app-public-root] .front-member-buy svg{width:13px;height:13px}
body:not(.page-admin) [data-front-app-public-root] .front-online-aside{min-width:0;padding:22px 18px;border-left:1px solid var(--recharge-line);background:var(--recharge-panel)}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual{position:relative;height:152px;display:grid;place-items:center;margin-bottom:16px;overflow:hidden;border:1px solid rgba(77,141,255,.2);border-radius:8px;background:#121a28}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual::before{content:"";position:absolute;width:150px;height:150px;border:1px solid rgba(77,141,255,.13);border-radius:50%}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>span{position:relative;z-index:1;width:84px;height:68px;display:grid;place-items:center;border:1px solid rgba(120,167,255,.5);border-radius:8px;background:#1c3764;color:#a8c6ff;box-shadow:0 18px 34px rgba(0,0,0,.28)}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>span svg{width:42px;height:42px;stroke-width:1.45}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>i{position:absolute;width:22px;height:22px;border:2px solid #e6bc58;border-radius:50%;background:#594618;box-shadow:inset 0 0 0 3px #c69225}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>i:nth-of-type(1){top:27px;right:48px}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>i:nth-of-type(2){bottom:25px;left:43px;width:16px;height:16px}
body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>i:nth-of-type(3){bottom:30px;right:32px;width:12px;height:12px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-balance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 17px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
body:not(.page-admin) [data-front-app-public-root] .front-shop-balance-card{min-width:0;padding:10px;border:1px solid var(--recharge-line);border-radius:6px;background:var(--recharge-panel-2)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-balance-card span{display:block;color:var(--recharge-muted);font-size:10px;font-weight:700;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .front-shop-balance-card strong{display:block;max-width:100%;margin-top:6px;overflow:hidden;color:var(--recharge-text);font-size:16px;font-weight:900;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-shop-balance-card.is-member strong{color:#8ab4ff}
body:not(.page-admin) [data-front-app-public-root] .front-shop-guide{padding-top:15px;border-top:1px solid var(--recharge-line)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-guide h3{margin:0 0 11px;color:var(--recharge-text);font-size:12px;font-weight:850}
body:not(.page-admin) [data-front-app-public-root] .front-shop-guide p{display:flex;align-items:center;gap:8px;margin:0 0 9px;color:var(--recharge-muted);font-size:10px;line-height:1.35}
body:not(.page-admin) [data-front-app-public-root] .front-shop-guide p>span{width:22px;height:22px;display:grid;place-items:center;flex:0 0 auto;border:1px solid rgba(77,141,255,.18);border-radius:5px;background:var(--recharge-blue-soft);color:#79a9ff}
body:not(.page-admin) [data-front-app-public-root] .front-shop-guide p>span svg{width:13px;height:13px;stroke-width:1.9}
body:not(.page-admin) [data-front-app-public-root] .front-shop-pay-support{display:grid;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--recharge-line)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-pay-support>span{color:var(--recharge-muted);font-size:10px;font-weight:700}
body:not(.page-admin) [data-front-app-public-root] .front-shop-pay-support>div{display:flex;flex-wrap:wrap;gap:6px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-pay-support b{min-height:30px;display:inline-flex;align-items:center;gap:6px;padding:3px 8px 3px 4px;border:1px solid var(--recharge-line);border-radius:6px;background:var(--recharge-panel-2);color:var(--recharge-soft);font-size:9px;font-weight:800;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon{width:22px;height:22px;display:grid;place-items:center;flex:0 0 auto;border-radius:5px;background:#667085;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon.is-alipay{background:#1677ff;color:#fff}
body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon.is-wechat{background:#07c160;color:#fff}
body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon svg{width:15px;height:15px;fill:currentColor;stroke:none;stroke-width:0}
body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon.is-wechat svg{width:17px;height:17px}
body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon.is-card svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero{min-height:126px;display:flex;align-items:center;gap:18px;padding:20px 24px;border-bottom:1px solid rgba(232,184,74,.2);background:#17160f;color:#f8e7b5}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero-mark{width:68px;height:68px;display:grid;place-items:center;flex:0 0 auto;border:1px solid rgba(232,184,74,.38);border-radius:8px;background:#2d2615;color:var(--recharge-gold);box-shadow:inset 0 0 24px rgba(232,184,74,.08)}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero-mark svg{width:40px;height:40px;stroke-width:1.5}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy small{display:block;margin-bottom:5px;color:var(--recharge-gold);font-size:9px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy h3{margin:0;color:#fff4d2;font-size:19px;font-weight:900;line-height:1.25}
body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy p{margin:6px 0 0;color:#a99c78;font-size:11px;line-height:1.4}
body:not(.page-admin) [data-front-app-public-root] .front-member-current{min-width:190px;min-height:0;display:grid;gap:3px;margin:0 0 0 auto;padding:12px 14px;border:1px solid rgba(232,184,74,.28);border-left:1px solid rgba(232,184,74,.28);border-radius:6px;background:rgba(232,184,74,.08)}
body:not(.page-admin) [data-front-app-public-root] .front-member-current span{color:#b8a76f;font-size:9px;font-weight:800}
body:not(.page-admin) [data-front-app-public-root] .front-member-current strong{color:#fff0bf;font-size:13px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-member-current small{display:block;margin:0;color:#a99c78;font-size:9px;line-height:1.25}
body:not(.page-admin) [data-front-app-public-root] .front-member-layout{display:grid;grid-template-columns:minmax(0,1fr) 255px}
body:not(.page-admin) [data-front-app-public-root] .front-member-main{min-width:0;padding:20px 22px}
body:not(.page-admin) [data-front-app-public-root] .front-member-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;overflow:visible;padding:0}
body:not(.page-admin) [data-front-app-public-root] .front-member-card{
  position:relative;
  min-width:0;
  min-height:312px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  padding:15px;
  overflow:hidden;
  border:1px solid var(--recharge-line);
  border-radius:8px;
  background:var(--recharge-panel);
  background-image:none;
  color:var(--recharge-text);
  text-align:left;
  cursor:pointer;
  box-shadow:none;
  transition:transform .16s ease,border-color .16s ease,background-color .16s ease;
}
body:not(.page-admin) [data-front-app-public-root] .front-member-card:hover{transform:translateY(-2px);border-color:#6f6140;background:var(--recharge-panel-2)}
body:not(.page-admin) [data-front-app-public-root] .front-member-card.featured{border-color:rgba(232,184,74,.7);box-shadow:inset 0 0 0 1px rgba(232,184,74,.1)}
body:not(.page-admin) [data-front-app-public-root] .front-member-card.is-current{border-color:#7f9fd6}
body:not(.page-admin) [data-front-app-public-root] .front-member-card .front-member-badge{background:var(--recharge-gold-strong);color:#17120a}
body:not(.page-admin) [data-front-app-public-root] .front-member-card.is-current .front-member-badge{background:#5276ad;color:#fff}
body:not(.page-admin) [data-front-app-public-root] .front-member-card-head{min-width:0;display:grid;gap:5px;padding-right:44px}
body:not(.page-admin) [data-front-app-public-root] .front-member-card-head strong{overflow:hidden;color:var(--recharge-text);font-size:15px;font-weight:900;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-member-card-head small{min-height:29px;display:-webkit-box;overflow:hidden;color:var(--recharge-muted);font-size:10px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}
body:not(.page-admin) [data-front-app-public-root] .front-member-price{min-height:42px;display:flex;align-items:baseline;margin:16px 0 0;color:var(--recharge-text)}
body:not(.page-admin) [data-front-app-public-root] .front-member-price small{margin-right:2px;color:var(--recharge-gold);font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-member-price strong{color:var(--recharge-text);font-size:28px;font-weight:950;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .front-member-price em{margin-left:5px;padding:0;border-radius:0;background:transparent;color:var(--recharge-muted);font-size:9px;font-style:normal;font-weight:700}
body:not(.page-admin) [data-front-app-public-root] .front-member-price-note{margin:3px 0 12px;color:var(--recharge-muted);font-size:9px;line-height:1.35}
body:not(.page-admin) [data-front-app-public-root] .front-member-benefits{display:grid;gap:0;margin:0 0 14px;padding:0;border-top:1px solid var(--recharge-line);list-style:none}
body:not(.page-admin) [data-front-app-public-root] .front-member-benefits li{min-height:35px;display:grid;grid-template-columns:15px minmax(0,1fr) auto;align-items:center;gap:5px;padding:7px 0;border-bottom:1px solid var(--recharge-line);color:var(--recharge-soft);font-size:9px}
body:not(.page-admin) [data-front-app-public-root] .front-member-benefits i{width:14px;height:14px;display:grid;place-items:center;border-radius:50%;background:var(--recharge-gold-soft);color:var(--recharge-gold);font-size:8px;font-style:normal;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-member-benefits span{min-width:0;color:var(--recharge-muted);white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-member-benefits strong{max-width:88px;overflow:hidden;color:var(--recharge-soft);font-size:9px;font-weight:850;text-align:right;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-member-buy{background:var(--recharge-gold-strong);color:#17120a}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks{min-width:0;padding:21px 18px;border-left:1px solid var(--recharge-line);background:var(--recharge-panel)}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks-title{display:flex;align-items:center;gap:10px;margin-bottom:17px}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks-title>span{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:6px;background:var(--recharge-gold-soft);color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks-title svg{width:20px;height:20px}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks-title small{display:block;margin-bottom:2px;color:var(--recharge-gold);font-size:9px;font-weight:850}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks-title h3{margin:0;color:var(--recharge-text);font-size:13px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul li{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:9px;padding:9px;border:1px solid var(--recharge-line);border-radius:6px;background:var(--recharge-panel-2)}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul li>span{width:32px;height:32px;display:grid;place-items:center;border:1px solid rgba(232,184,74,.18);border-radius:6px;background:var(--recharge-gold-soft);color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul li>span svg{width:17px;height:17px;stroke-width:1.75}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul li div{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul strong{color:var(--recharge-soft);font-size:10px;font-weight:850}
body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul small{overflow:hidden;color:var(--recharge-muted);font-size:9px;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-shop-empty{padding:28px;border:1px dashed var(--recharge-line-strong);border-radius:8px;background:var(--recharge-panel);color:var(--recharge-muted);font-size:12px;text-align:center}
body:not(.page-admin) [data-front-app-public-root] .recharge-redeem-view{padding:42px 24px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem{width:min(500px,100%);margin:0 auto;padding:22px;border:1px solid var(--recharge-line);border-radius:8px;background:var(--recharge-panel);background-image:none}
body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem h3{margin:0;color:var(--recharge-text);font-size:17px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem p{margin:7px 0 16px;color:var(--recharge-muted);font-size:11px;line-height:1.6}
body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem input{width:100%;height:43px;padding:0 12px;border:1px solid var(--recharge-line-strong);border-radius:6px;outline:0;background:var(--recharge-bg);color:var(--recharge-text);font:inherit;font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem input:focus{border-color:var(--recharge-blue);box-shadow:0 0 0 3px var(--recharge-blue-soft)}
body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem button{width:100%;height:42px;margin-top:10px;border:0;border-radius:6px;background:var(--recharge-blue-strong);color:#fff;font-size:12px;font-weight:850;cursor:pointer}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel{
  width:min(440px,calc(100vw - 36px));
  padding:22px;
  border:1px solid #343b46;
  border-radius:8px;
  background:#12161c;
  color:#f8fafc;
  box-shadow:0 28px 76px rgba(0,0,0,.5);
}
body:not(.page-admin) [data-front-app-public-root] .front-buy-head{align-items:flex-start;margin-bottom:18px}
body:not(.page-admin) [data-front-app-public-root] .front-buy-head>div>span{display:inline-flex;margin-bottom:7px;padding:3px 7px;border-radius:4px;background:rgba(45,212,191,.12);color:#5eead4;font-size:11px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-buy-head h2{color:#f8fafc;font-size:20px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-buy-head p{margin:5px 0 0;color:#9aa6b5;font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-buy-summary{margin-bottom:18px;border-color:#343b46;border-radius:8px;background:#181d25}
body:not(.page-admin) [data-front-app-public-root] .front-buy-product{display:grid;gap:5px;padding:15px;border-bottom:1px solid #343b46}
body:not(.page-admin) [data-front-app-public-root] .front-buy-product span{color:#9aa6b5;font-size:11px;font-weight:800}
body:not(.page-admin) [data-front-app-public-root] .front-buy-product strong{color:#f8fafc;font-size:17px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .front-buy-product small{color:#9aa6b5;font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-buy-row.total{align-items:baseline;padding:13px 15px;border:0;background:transparent}
body:not(.page-admin) [data-front-app-public-root] .front-buy-row.total strong{color:#fbbf24;font-size:25px}
body:not(.page-admin) [data-front-app-public-root] .front-buy-row.total strong small{margin-right:2px;font-size:13px}
body:not(.page-admin) [data-front-app-public-root] .jn-pay-label{color:#cbd5e1;font-size:12px}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:9px 0 16px}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span{position:relative;height:48px;display:flex;align-items:center;justify-content:flex-start;gap:9px;padding:0 12px 0 8px;border-color:#343b46;border-radius:7px;background:#181d25;color:#cbd5e1;text-align:left}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span>strong{min-width:0;overflow:hidden;color:inherit;font-size:12px;font-weight:850;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span>i{width:16px;height:16px;display:grid;place-items:center;flex:0 0 auto;margin-left:auto;border:1px solid #505866;border-radius:50%;background:transparent}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item input:checked+span{border-color:#2dd4bf;background:rgba(45,212,191,.12);color:#f8fafc;box-shadow:inset 0 0 0 1px rgba(45,212,191,.2)}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item input:checked+span>i{border:4px solid #14b8a6;background:#fff}
body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-confirm-pay{height:44px;border-radius:6px;background:#14b8a6;color:#fff;box-shadow:none}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error{
  width:min(430px,calc(100vw - 28px));
  grid-template-rows:auto auto auto auto auto;
  border-color:#3f3538;
  border-radius:8px;
  background:#12161c;
}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-head{background:#181d25;border-color:#343b46}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-status{border-radius:6px}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state{display:grid;gap:4px;margin:12px 14px 8px;padding:13px;border:1px solid #343b46;border-radius:6px;background:#181d25}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state strong{color:#f8fafc;font-size:14px}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state span{color:#9aa6b5;font-size:12px;line-height:1.55}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-error{display:grid;gap:5px;margin:0 14px 14px;padding:13px;border-radius:6px}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-error strong{font-size:11px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-error span{font-size:13px;line-height:1.55}
body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-actions{display:grid;grid-template-columns:1fr 1fr;background:#181d25}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal{
  --recharge-bg:#f5f7fb;
  --recharge-panel:#fff;
  --recharge-panel-2:#f7f9fc;
  --recharge-panel-3:#edf1f7;
  --recharge-line:#dfe4ec;
  --recharge-line-strong:#cbd3df;
  --recharge-text:#121722;
  --recharge-soft:#344054;
  --recharge-muted:#768195;
  --recharge-blue:#326fe5;
  --recharge-blue-strong:#2f6dde;
  --recharge-blue-soft:rgba(50,111,229,.09);
  --recharge-gold:#b47a17;
  --recharge-gold-strong:#d5a13a;
  --recharge-gold-soft:rgba(180,122,23,.1);
  box-shadow:0 28px 72px rgba(15,23,42,.2);
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual{border-color:#d9e2f1;background:#eef3fb}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>span{border-color:#9db9ed;background:#d8e5fb;color:#315fba;box-shadow:0 16px 32px rgba(64,91,135,.15)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual>i{border-color:#d8a73e;background:#ffe9ad;box-shadow:inset 0 0 0 3px #e9bb51}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-member-hero{border-color:#e4d3a9;background:#242117;color:#f7e7ba}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-member-current{background:rgba(232,184,74,.09)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-panel{border-color:#d9e0e8;background:#fff;color:#111827;box-shadow:0 28px 70px rgba(15,23,42,.18)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-head h2,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-product strong{color:#111827}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-head p,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-product :is(span,small),
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-pay-label{color:#667085}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-summary,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-product,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span{border-color:#d9e0e8;background:#f6f8fb;color:#344054}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item input:checked+span{border-color:#0f9f8f;background:#f0fdfa;color:#0f766e}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span>i{border-color:#b8c0cc;background:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item input:checked+span>i{border-color:#0f9f8f;background:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .front-shop-guide p>span{border-color:rgba(50,111,229,.2);background:rgba(50,111,229,.08);color:#326fe5}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error{border-color:#e4e7ec;background:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-head,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-actions,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state{border-color:#e4e7ec;background:#f8fafc}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state strong{color:#111827}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state span{color:#667085}
@media(min-width:761px) and (max-width:1080px){
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal{width:calc(100vw - 28px)}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-shell{grid-template-columns:160px minmax(0,1fr)}
  body:not(.page-admin) [data-front-app-public-root] .front-online-layout{grid-template-columns:minmax(0,1fr) 240px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.page-admin) [data-front-app-public-root] .front-member-layout{grid-template-columns:minmax(0,1fr) 220px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  html body:not(.page-admin) [data-front-app-public-root] .front-shop-layer.front-shop-layer>.front-recharge-modal.front-recharge-modal{
    width:calc(100vw - 16px);
    height:auto;
    max-height:calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 70px);
    padding:0;
    border-radius:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-head{min-height:68px;padding:10px 12px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-title{gap:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-title-icon{width:38px;height:38px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-title-icon svg{width:21px;height:21px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-title small{display:none}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-head h2{font-size:17px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-head p{margin-top:3px;font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-close{width:31px;height:31px;font-size:19px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-shell{display:flex;flex-direction:column}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tabs{
    flex:0 0 auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px;
    padding:7px;
    border:0;
    border-bottom:1px solid var(--recharge-line);
  }
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tab{
    height:47px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:4px;
    padding:3px;
    text-align:center;
  }
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal .front-shop-tab.is-active{box-shadow:inset 0 -2px 0 var(--recharge-blue)}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-modal.is-membership .front-shop-tab.is-active{box-shadow:inset 0 -2px 0 var(--recharge-gold)}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-tab-icon{width:20px;height:20px;background:transparent}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-tab-icon svg{width:17px;height:17px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-tab>span:last-child{display:block}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-tab strong{display:block;font-size:10px;white-space:nowrap}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-tab small{display:none}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-content{flex:1 1 auto}
  body:not(.page-admin) [data-front-app-public-root] .front-online-layout,
  body:not(.page-admin) [data-front-app-public-root] .front-member-layout{display:flex;flex-direction:column}
  body:not(.page-admin) [data-front-app-public-root] .front-online-main,
  body:not(.page-admin) [data-front-app-public-root] .front-member-main{padding:15px 12px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head{align-items:flex-start;margin-bottom:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head small{margin-bottom:3px;font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head h3{font-size:14px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-section-head>span{max-width:138px;font-size:9px;line-height:1.35;text-align:right;white-space:normal}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible;padding:0}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-card{min-height:180px;padding:11px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-card-icon{width:29px;height:29px;margin-bottom:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-card-icon svg{width:16px;height:16px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-card-copy{gap:2px;margin-bottom:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-card-copy strong{font-size:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-card-copy small{font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-price strong{font-size:23px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-credits{margin:5px 0 9px;font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-buy{height:30px;font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-online-aside{padding:14px 12px 16px;border-top:1px solid var(--recharge-line);border-left:0}
  body:not(.page-admin) [data-front-app-public-root] .front-wallet-visual{display:none}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-balance{margin-bottom:14px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-balance-card{padding:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-balance-card strong{font-size:14px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-guide{padding-top:13px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-guide p{margin-bottom:7px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-pay-support{margin-top:13px;padding-top:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-pay-support b{min-height:32px;padding-right:9px;font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon{width:24px;height:24px}
  body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon svg{width:16px;height:16px}
  body:not(.page-admin) [data-front-app-public-root] .front-pay-brand-icon.is-wechat svg{width:18px;height:18px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-hero{min-height:102px;gap:11px;padding:14px 12px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-hero-mark{width:48px;height:48px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-hero-mark svg{width:28px;height:28px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy small{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy h3{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-hero-copy p{font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-current{min-width:0;max-width:100px;margin-left:auto;padding:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-current span{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-current strong{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
  body:not(.page-admin) [data-front-app-public-root] .front-member-current small{overflow:hidden;font-size:8px;text-overflow:ellipsis;white-space:nowrap}
  body:not(.page-admin) [data-front-app-public-root] .front-member-grid{display:grid;grid-template-columns:1fr;gap:9px;overflow:visible;padding:0}
  body:not(.page-admin) [data-front-app-public-root] .front-member-card{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 10px;padding:13px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-card-head{grid-column:1;padding-right:0}
  body:not(.page-admin) [data-front-app-public-root] .front-member-card-head strong{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-card-head small{min-height:0;font-size:9px;-webkit-line-clamp:1}
  body:not(.page-admin) [data-front-app-public-root] .front-member-price{grid-column:2;grid-row:1;min-height:0;margin:0;padding-right:0;justify-content:flex-end}
  body:not(.page-admin) [data-front-app-public-root] .front-member-price strong{font-size:22px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-price em{display:none}
  body:not(.page-admin) [data-front-app-public-root] .front-member-price-note{grid-column:1 / -1;margin:9px 0 6px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-benefits{grid-column:1 / -1;margin-bottom:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-benefits li{min-height:30px;padding:5px 0;font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-benefits strong{max-width:160px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-buy{grid-column:1 / -1;height:32px;font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-perks{padding:15px 12px;border-top:1px solid var(--recharge-line);border-left:0}
  body:not(.page-admin) [data-front-app-public-root] .front-member-perks-title{margin-bottom:11px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul{grid-template-columns:1fr;gap:6px}
  body:not(.page-admin) [data-front-app-public-root] .front-member-perks>ul li{padding:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-redeem-view{padding:22px 12px}
  body:not(.page-admin) [data-front-app-public-root] .front-shop-redeem{padding:16px}
  body:not(.page-admin) [data-front-app-public-root] .front-buy-panel{width:min(380px,calc(100vw - 20px));padding:17px}
  body:not(.page-admin) [data-front-app-public-root] .front-buy-head{margin-bottom:14px}
  body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span{height:50px;padding-right:9px}
  body:not(.page-admin) [data-front-app-public-root] .front-buy-panel .jn-pay-item span>strong{font-size:11px}
  body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error{width:min(370px,calc(100vw - 20px))}
  body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error .jn-payment-actions{grid-template-columns:1fr 1fr}
}

/* Recharge single-page checkout: packages, payment, action, then recent records. */
body:not(.page-admin) [data-front-app-public-root] .front-shop-layer{
  position:fixed;
  inset:0;
  z-index:100240;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(0,0,0,.58);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace{
  min-height:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) 270px;
  grid-template-areas:
    "packages records"
    "checkout records";
  grid-template-rows:auto auto;
  align-content:start;
  align-items:start;
  gap:14px 18px;
  padding:22px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-packages{grid-area:packages}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-checkout{grid-area:checkout}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-records{grid-area:records;align-self:stretch}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-packages,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-payment,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-records{
  min-width:0;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-section-head{
  min-height:42px;
  align-items:center;
  margin-bottom:13px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance{
  min-width:126px;
  display:flex;
  align-items:baseline;
  justify-content:flex-end;
  gap:8px;
  padding:8px 10px;
  border:1px solid var(--recharge-line);
  border-radius:7px;
  background:var(--recharge-panel);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance span{
  color:var(--recharge-muted);
  font-size:10px;
  font-weight:700;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance strong{
  max-width:150px;
  overflow:hidden;
  color:var(--recharge-text);
  font-size:15px;
  font-weight:900;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance.is-member strong{color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-grid,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-card{
  min-height:132px;
  justify-content:center;
  padding:16px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-card{
  min-height:132px;
  justify-content:center;
  padding:16px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-card.featured{
  border-color:rgba(77,141,255,.38);
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-card.featured{
  border-color:rgba(232,184,74,.4);
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-card.is-selected{
  border-color:var(--recharge-blue);
  background:var(--recharge-blue-soft);
  box-shadow:inset 0 0 0 1px var(--recharge-blue);
  transform:none;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-card.is-selected{
  border-color:var(--recharge-gold);
  background:var(--recharge-gold-soft);
  box-shadow:inset 0 0 0 1px var(--recharge-gold);
  transform:none;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-card-copy{
  margin:0 0 14px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-card-copy strong,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-card-head strong{
  font-size:14px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-credits{
  margin:8px 0 0;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-card-head{
  padding:0;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-price{
  min-height:0;
  margin:16px 0 0;
}
body:not(.page-admin) [data-front-app-public-root] .front-member-meta{
  display:block;
  margin-top:9px;
  overflow:hidden;
  color:var(--recharge-muted);
  font-size:10px;
  font-weight:700;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-checkout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 230px;
  gap:12px;
  margin:0;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-payment,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-records{
  border:1px solid var(--recharge-line);
  border-radius:8px;
  background:var(--recharge-panel);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-payment{padding:15px}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title{
  min-height:35px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title>div{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title small{
  display:block;
  margin:0 0 3px;
  color:var(--recharge-blue);
  font-size:9px;
  font-weight:850;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .is-membership-workspace .front-recharge-section-title small{color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title h3{
  margin:0;
  color:var(--recharge-text);
  font-size:14px;
  font-weight:900;
  line-height:1.25;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title>span{
  color:var(--recharge-muted);
  font-size:10px;
  line-height:1.35;
  text-align:right;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title>button{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:5px 0;
  border:0;
  background:transparent;
  color:var(--recharge-blue);
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}
body:not(.page-admin) [data-front-app-public-root] .is-membership-workspace .front-recharge-section-title>button{color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title>button svg{width:13px;height:13px}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option{min-width:0;cursor:pointer}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>input{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>span{
  min-width:0;
  height:54px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) 16px;
  grid-template-rows:1fr 1fr;
  align-items:center;
  column-gap:9px;
  padding:7px 9px;
  border:1px solid var(--recharge-line);
  border-radius:7px;
  background:var(--recharge-panel-2);
  color:var(--recharge-soft);
  transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option:hover>span{border-color:var(--recharge-line-strong)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option .front-pay-brand-icon{
  grid-column:1;
  grid-row:1 / 3;
  width:28px;
  height:28px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option strong{
  min-width:0;
  align-self:end;
  overflow:hidden;
  color:var(--recharge-soft);
  font-size:11px;
  font-weight:850;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option small{
  min-width:0;
  align-self:start;
  overflow:hidden;
  color:var(--recharge-muted);
  font-size:8px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option i{
  grid-column:3;
  grid-row:1 / 3;
  width:16px;
  height:16px;
  border:1px solid var(--recharge-line-strong);
  border-radius:50%;
  background:var(--recharge-bg);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>input:focus-visible+span{
  outline:2px solid var(--recharge-blue);
  outline-offset:2px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>input:checked+span{
  border-color:var(--recharge-blue);
  background:var(--recharge-blue-soft);
  box-shadow:inset 0 0 0 1px rgba(77,141,255,.2);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>input:checked+span strong{color:var(--recharge-text)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>input:checked+span i{
  border:4px solid var(--recharge-blue);
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .is-membership-checkout .front-recharge-pay-option>input:checked+span{
  border-color:var(--recharge-gold);
  background:var(--recharge-gold-soft);
  box-shadow:inset 0 0 0 1px rgba(232,184,74,.18);
}
body:not(.page-admin) [data-front-app-public-root] .is-membership-checkout .front-recharge-pay-option>input:checked+span i{border-color:var(--recharge-gold)}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  align-items:center;
  gap:10px 16px;
  padding:15px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-summary{
  min-width:0;
  display:grid;
  gap:4px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-summary span{
  overflow:hidden;
  color:var(--recharge-text);
  font-size:12px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-summary small{
  overflow:hidden;
  color:var(--recharge-muted);
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-total{
  min-width:102px;
  display:grid;
  justify-items:end;
  gap:3px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-total>span{
  color:var(--recharge-muted);
  font-size:9px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-total strong{
  color:var(--recharge-text);
  font-size:23px;
  font-weight:950;
  line-height:1;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-total strong small{
  margin-right:2px;
  color:var(--recharge-muted);
  font-size:11px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit-button{
  grid-column:1 / -1;
  width:100%;
  height:38px;
  border:0;
  border-radius:6px;
  background:var(--recharge-blue-strong);
  color:#fff;
  font-size:11px;
  font-weight:850;
  cursor:pointer;
}
body:not(.page-admin) [data-front-app-public-root] .is-membership-checkout .front-recharge-submit-button{
  background:var(--recharge-gold-strong);
  color:#17120a;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit-button:disabled{
  background:var(--recharge-panel-3);
  color:var(--recharge-muted);
  cursor:not-allowed;
  opacity:1;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-records{padding:15px}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-list{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-item{
  min-width:0;
  min-height:58px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:9px;
  padding:9px;
  border:1px solid var(--recharge-line);
  border-radius:7px;
  background:var(--recharge-panel-2);
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-icon{display:grid;place-items:center}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-icon .front-pay-brand-icon{width:28px;height:28px}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-main,
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-end{min-width:0;display:grid;gap:4px}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-main strong{
  overflow:hidden;
  color:var(--recharge-soft);
  font-size:10px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-main small{
  overflow:hidden;
  color:var(--recharge-muted);
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-end{
  grid-column:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-end strong{
  color:var(--recharge-text);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-end span{
  color:#e6b94c;
  font-size:8px;
  font-weight:800;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-end span.is-success{color:#34d399}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-end span.is-refund{color:#93c5fd}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-empty{
  min-height:58px;
  display:grid;
  place-items:center;
  border:1px dashed var(--recharge-line-strong);
  border-radius:7px;
  color:var(--recharge-muted);
  font-size:10px;
  text-align:center;
}
body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-empty.is-error{color:#fb7185}

@media(min-width:761px) and (max-width:1080px){
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace{
    grid-template-columns:minmax(0,1fr) 240px;
    gap:12px 14px;
    padding:18px;
  }
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-grid,
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-checkout{grid-template-columns:1fr}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-list{grid-template-columns:1fr}
}
@media(max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .front-shop-layer{padding:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace{
    grid-template-columns:1fr;
    grid-template-areas:
      "packages"
      "checkout"
      "records";
    grid-template-rows:auto;
    gap:12px;
    padding:13px 11px 16px;
  }
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-section-head{min-height:37px;margin-bottom:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance{min-width:0;max-width:132px;padding:6px 8px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance span{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-balance strong{font-size:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-shop-card{min-height:116px;padding:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-grid{grid-template-columns:1fr}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-workspace .front-member-card{min-height:112px;padding:13px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-checkout{grid-template-columns:1fr;gap:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-payment,
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit,
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-records{padding:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title{margin-bottom:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title h3{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-section-title>span{max-width:145px;font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option>span{height:50px;grid-template-columns:26px minmax(0,1fr) 15px;padding:6px 7px;column-gap:7px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option .front-pay-brand-icon{width:26px;height:26px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-pay-option strong{font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit{grid-template-columns:minmax(0,1fr) auto;padding:12px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-total strong{font-size:21px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-submit-button{height:40px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-list{grid-template-columns:1fr;gap:6px}
  body:not(.page-admin) [data-front-app-public-root] .front-recharge-record-item{min-height:54px;padding:8px}
}

/* 2026-06-14 recharge modal black transparent compact */
.jn-shop-layer,
.jn-buy-layer{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.jn-shop-modal,
.jn-buy-panel{
  background:#111111;
  border:1px solid #2d2d2d;
  box-shadow:0 24px 80px rgba(0,0,0,.56);
  color:#f2f2f2;
}
.jn-shop-head h2,
.jn-buy-head h2,
.jn-shop-card h3,
.jn-shop-redeem h3{color:#f7f7f7}
.jn-shop-head p,
.jn-shop-desc,
.jn-shop-balance span,
.jn-buy-row span,
.jn-pay-label,
.jn-shop-redeem p{color:#949494}
.jn-shop-close,
.jn-buy-head .jn-shop-close{
  background:#1a1a1a;
  border-color:#2d2d2d;
  color:#f2f2f2;
}
.jn-shop-tabs{
  background:#1a1a1a;
  border-color:#2d2d2d;
}
.jn-shop-tab{color:#bdbdbd}
.jn-shop-tab.is-active{
  background:#2584ff;
  color:#fff;
  box-shadow:none;
}
.jn-shop-balance,
.jn-shop-card,
.jn-shop-redeem,
.jn-buy-summary,
.jn-buy-row,
.jn-pay-item span{
  background:#1a1a1a;
  border-color:#2d2d2d;
}
.jn-shop-card.featured{
  border-color:#2584ff;
  box-shadow:0 0 0 1px rgba(37,132,255,.28),0 14px 34px rgba(37,132,255,.10);
}
.jn-shop-card.featured::after{background:#2584ff;color:#fff}
.jn-shop-price,
.jn-buy-row strong{color:#fff}
.jn-shop-credits,
.jn-buy-row.total strong{color:#ffb74d}
.jn-shop-buy,
.jn-confirm-pay,
.jn-shop-redeem button{
  background:#2584ff;
  color:#fff;
  box-shadow:0 10px 24px rgba(37,132,255,.22);
}
.jn-shop-redeem input{
  background:#242424;
  border-color:#2d2d2d;
  color:#f2f2f2;
}
.jn-pay-item input:checked+span{
  border-color:#2584ff;
  background:rgba(37,132,255,.16);
  color:#fff;
}

@media (max-width:760px){
.jn-shop-layer,
.jn-buy-layer{
    padding:14px;
    place-items:center;
  }
  .jn-shop-modal{
    width:min(360px,calc(100vw - 28px));
    max-height:min(620px,calc(100dvh - 44px));
    padding:14px;
    border-radius:18px;
  }
  .jn-shop-head{margin-bottom:10px;gap:10px}
  .jn-shop-head h2{font-size:18px}
  .jn-shop-head p{font-size:11px}
  .jn-shop-close{width:30px;height:30px;border-radius:10px}
  .jn-shop-tabs{margin-bottom:10px}
  .jn-shop-balance{padding:9px 11px;margin-bottom:10px;border-radius:13px}
  .jn-shop-balance strong{font-size:17px}
  .jn-shop-grid{
    display:flex;
    grid-template-columns:none;
    gap:10px;
    overflow-x:auto;
    overflow-y:hidden;
    padding:1px 2px 8px;
    margin:0 -2px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .jn-shop-grid::-webkit-scrollbar{height:0}
  .jn-shop-card{
    flex:0 0 155px;
    min-width:155px;
    display:block;
    padding:12px;
    border-radius:15px;
    scroll-snap-align:start;
  }
  .jn-shop-card.featured::after{display:none}
  .jn-shop-card h3{font-size:13px;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .jn-shop-desc{display:block;height:16px;margin:0 0 8px;font-size:11px}
  .jn-shop-price{font-size:22px;margin:0 0 6px;text-align:left}
  .jn-shop-price small{font-size:11px}
  .jn-shop-credits{border-top:1px solid #2d2d2d;border-bottom:1px solid #2d2d2d;padding:7px 0;margin:0 0 10px;font-size:12px}
  .jn-shop-buy{display:block;height:34px;border-radius:10px;font-size:12px}
  .jn-shop-redeem{padding:13px;border-radius:14px}
  .jn-shop-redeem input,
.jn-shop-redeem button{height:38px}
  .jn-buy-panel{
    width:min(330px,calc(100vw - 28px));
    max-height:calc(100dvh - 44px);
    overflow:auto;
    padding:14px;
    border-radius:18px;
  }
  .jn-pay-grid{grid-template-columns:repeat(3,1fr);gap:7px}
  .jn-pay-item span{height:34px;font-size:12px;border-radius:10px}
}
/* Final recharge acceptance pass: realistic campaign banner, crisp activity corner and larger custom amount field. */
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online{
  width:min(1200px,calc(100vw - 36px));
  height:min(800px,calc(100dvh - 36px));
  max-height:calc(100dvh - 36px);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
  grid-template-columns:minmax(0,1fr) 288px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
  padding:20px 24px 24px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner{
  --recharge-banner-accent:#626ee9;
  --recharge-banner-bg:#f1f4ff;
  position:relative;
  isolation:isolate;
  min-height:136px;
  height:136px;
  display:block;
  margin:0 0 15px;
  padding:0;
  overflow:hidden;
  border:1px solid #dce2f5;
  border-radius:10px;
  background:var(--recharge-banner-bg);
  background-image:none;
  color:#27304d;
  box-shadow:0 8px 22px rgba(58,68,116,.09);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner.theme-red{
  --recharge-banner-accent:#d8596b;
  --recharge-banner-bg:#fff1f3;
  background:var(--recharge-banner-bg);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner.theme-gold{
  --recharge-banner-accent:#b4822f;
  --recharge-banner-bg:#fff8e9;
  background:var(--recharge-banner-bg);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner.theme-blue{
  --recharge-banner-accent:#3979cf;
  --recharge-banner-bg:#eef6ff;
  background:var(--recharge-banner-bg);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner.theme-green{
  --recharge-banner-accent:#378a6c;
  --recharge-banner-bg:#eef9f5;
  background:var(--recharge-banner-bg);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  background:linear-gradient(90deg,var(--recharge-banner-bg) 0%,var(--recharge-banner-bg) 45%,color-mix(in srgb,var(--recharge-banner-bg) 94%,transparent) 54%,color-mix(in srgb,var(--recharge-banner-bg) 42%,transparent) 69%,transparent 81%);
  opacity:1;
  pointer-events:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-photo{
  position:absolute;
  inset:0 0 0 auto;
  z-index:0;
  width:51%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 45%;
  filter:saturate(.94) contrast(1.01);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy{
  position:absolute;
  top:17px;
  left:22px;
  z-index:3;
  width:55%;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy>small{
  width:max-content;
  padding:4px 7px;
  border:1px solid color-mix(in srgb,var(--recharge-banner-accent) 22%,transparent);
  border-radius:5px;
  background:color-mix(in srgb,var(--recharge-banner-accent) 10%,#fff);
  color:var(--recharge-banner-accent);
  -webkit-text-fill-color:var(--recharge-banner-accent);
  font-size:10px;
  font-weight:900;
  line-height:1.1;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy>strong{
  min-width:0;
  overflow:hidden;
  color:#27304d;
  -webkit-text-fill-color:#27304d;
  font-size:21px;
  font-weight:950;
  line-height:1.16;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy>span{
  max-width:94%;
  overflow:hidden;
  color:#68728c;
  -webkit-text-fill-color:#68728c;
  font-size:12px;
  font-weight:650;
  line-height:1.4;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-status{
  position:absolute;
  top:10px;
  right:10px;
  z-index:4;
  display:block;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.75);
  border-radius:6px;
  background:rgba(255,255,255,.9);
  color:var(--recharge-banner-accent);
  -webkit-text-fill-color:var(--recharge-banner-accent);
  font-size:10px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  box-shadow:0 4px 12px rgba(30,42,77,.12);
  backdrop-filter:blur(5px);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-time{
  position:absolute;
  right:9px;
  bottom:8px;
  z-index:4;
  display:block;
  max-width:47%;
  padding:4px 6px;
  overflow:hidden;
  border-radius:4px;
  background:rgba(32,39,61,.68);
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:9px;
  font-style:normal;
  font-weight:650;
  line-height:1;
  text-overflow:ellipsis;
  white-space:nowrap;
  box-shadow:0 3px 9px rgba(20,28,53,.13);
  backdrop-filter:blur(4px);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package-grid{
  grid-auto-rows:96px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package{
  min-height:96px;
  overflow:hidden;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark{
  position:absolute;
  top:0;
  right:0;
  z-index:5;
  width:58px;
  height:27px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  overflow:hidden;
  border:0;
  border-left:1px solid rgba(190,62,55,.17);
  border-bottom:1px solid rgba(190,62,55,.17);
  border-radius:0 7px 0 9px;
  background:#f4554f;
  background-image:linear-gradient(105deg,#e94747 0%,#f45b50 62%,#ff785e 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:12px;
  font-weight:950;
  line-height:1;
  letter-spacing:0;
  text-shadow:0 1px 1px rgba(150,31,31,.2);
  box-shadow:0 5px 13px rgba(211,72,68,.2);
  transform:none;
  animation:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark::before{
  content:"";
  position:relative;
  z-index:2;
  width:5px;
  height:5px;
  flex:0 0 5px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.2);
  animation:recharge-v2-activity-dot 1.7s ease-in-out infinite;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark::after{
  content:none;
  display:none;
  animation:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.has-activity .recharge-v2-tag{
  right:63px;
}
@keyframes recharge-v2-activity-shine{
  0%,58%{left:-65%}
  82%,100%{left:125%}
}
@keyframes recharge-v2-activity-dot{
  0%,100%{opacity:.6;transform:scale(.82)}
  48%{opacity:1;transform:scale(1)}
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom{
  min-height:82px;
  height:82px;
  gap:13px;
  margin-top:12px;
  padding:10px 13px;
  overflow:hidden;
  border:1px solid #dfe4ef;
  border-radius:9px;
  background:#fff;
  background-image:none;
  box-shadow:0 7px 18px rgba(55,65,105,.06);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom::before,
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom::after,
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input::before,
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input::after{
  content:none;
  display:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom:focus-within{
  border-color:#7a83ee;
  box-shadow:0 0 0 3px rgba(103,113,235,.12),0 8px 20px rgba(55,65,105,.07);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-icon{
  position:relative;
  width:60px;
  height:60px;
  display:block;
  flex:0 0 60px;
  overflow:hidden;
  border:1px solid #d8deed;
  border-radius:9px;
  background:#eef2fa;
  box-shadow:0 4px 11px rgba(47,58,98,.1);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-icon>img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  filter:saturate(.96) contrast(1.03);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy{
  gap:5px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy strong{
  color:#353d55;
  -webkit-text-fill-color:#353d55;
  font-size:14px;
  font-weight:900;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy small{
  color:#7d879e;
  -webkit-text-fill-color:#7d879e;
  font-size:11px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input{
  width:240px;
  min-width:240px;
  height:48px;
  margin-left:auto;
  padding:0 11px;
  border:1px solid #dfe4ee;
  border-radius:8px;
  background:#f7f8fc;
  background-image:none;
  color:#727b90;
  box-shadow:inset 0 1px 2px rgba(42,51,82,.03);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input input{
  height:100%;
  padding:0 8px;
  font-size:14px;
}

@media (max-width:760px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
    padding:14px 11px 18px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner{
    min-height:118px;
    height:118px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-photo{
    width:54%;
    object-position:55% center;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy{
    top:14px;
    left:14px;
    width:62%;
    gap:4px 6px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy>small{
    padding:3px 5px;
    font-size:8px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy>strong{
    font-size:16px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-copy>span{
    max-width:88%;
    font-size:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-status{
    top:8px;
    right:8px;
    padding:4px 6px;
    font-size:8px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-banner-time{
    right:7px;
    bottom:7px;
    max-width:58%;
    font-size:8px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark{
    width:52px;
    height:26px;
    font-size:11px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.has-activity .recharge-v2-tag{
    right:57px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.has-activity{
    padding:28px 7px 2px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom{
    min-height:78px;
    height:78px;
    gap:8px;
    padding:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-icon{
    width:52px;
    height:52px;
    flex-basis:52px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy strong{
    font-size:12px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy small{
    font-size:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input{
    width:132px;
    min-width:132px;
    height:42px;
    padding:0 7px;
  }
}

/* Recharge visual acceptance pass: larger proportions, readable balances, and real payment imagery. */
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-online){
  padding:16px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
  width:min(1140px,calc(100vw - 32px));
  height:min(740px,calc(100dvh - 32px));
  max-height:calc(100dvh - 32px);
  border-radius:16px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
  left:152px;
  min-height:70px;
  height:70px;
  padding:11px 21px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
  grid-template-columns:152px minmax(0,1fr);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav{
  padding:82px 11px 15px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift{
  min-height:164px;
  padding:9px 8px 12px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift>img{
  width:120px;
  height:84px;
  border-radius:0;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 8px 12px rgba(76,63,171,.2));
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift>small{
  font-size:9px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
  padding-top:70px;
  overflow:auto;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
  height:auto;
  min-height:100%;
  grid-template-columns:minmax(0,1fr) 272px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  height:auto;
  min-height:100%;
  overflow:visible;
  padding:18px 22px 20px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section{
  margin-bottom:12px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head{
  margin-bottom:9px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head h3{
  font-size:15px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner{
  position:relative;
  isolation:isolate;
  min-height:96px;
  grid-template-columns:50px minmax(0,1fr) auto;
  gap:12px;
  margin-bottom:12px;
  padding:14px 18px;
  border-radius:11px;
  background:var(--rv2-banner-bg);
  box-shadow:0 8px 20px rgba(62,72,119,.08);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,var(--rv2-banner-bg) 0%,var(--rv2-banner-bg) 51%,color-mix(in srgb,var(--rv2-banner-bg) 88%,transparent) 68%,rgba(255,255,255,.12) 100%);
  pointer-events:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-photo{
  position:absolute;
  inset:0 0 0 auto;
  z-index:0;
  width:49%;
  height:100%;
  object-fit:cover;
  object-position:42% 82%;
  filter:saturate(.8) contrast(.94);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon,
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy,
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner>b{
  position:relative;
  z-index:2;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon{
  position:relative;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  overflow:visible;
  border:1px solid rgba(255,255,255,.92);
  border-radius:14px;
  background:linear-gradient(145deg,#fff 0%,#eef2ff 100%);
  color:#5f68e8;
  box-shadow:0 9px 20px rgba(78,88,193,.18),inset 0 1px 0 #fff;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon .recharge-feature-icon{
  width:39px;
  height:39px;
  filter:drop-shadow(0 5px 7px rgba(78,88,193,.16));
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon>i{
  position:absolute;
  right:-6px;
  bottom:-5px;
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border:2px solid #fff;
  border-radius:50%;
  background:linear-gradient(145deg,#ffd36e 0%,#f2a93f 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:11px;
  font-style:normal;
  font-weight:900;
  line-height:1;
  box-shadow:0 5px 10px rgba(203,136,36,.25);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>strong{
  font-size:17px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>span{
  font-size:11px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner>b{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:8px;
  background:rgba(255,255,255,.82);
  box-shadow:0 5px 14px rgba(55,65,105,.08);
  backdrop-filter:blur(5px);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
  grid-auto-rows:92px;
  gap:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
  min-height:92px;
  align-items:center;
  justify-content:center;
  padding:13px 12px;
  text-align:center;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
  justify-content:center;
  font-size:27px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
  justify-content:center;
  gap:5px 7px;
  margin-top:8px;
  color:#566078;
  -webkit-text-fill-color:#566078;
  font-size:14px;
  font-weight:750;
  line-height:1.2;
  text-align:center;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small>span{
  display:inline-flex;
  align-items:center;
  min-height:19px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small em{
  min-height:19px;
  padding:3px 6px;
  border-radius:6px;
  font-size:11px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small,
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small>span{
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small em{
  background:rgba(255,255,255,.2);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
  top:-8px;
  right:10px;
  width:44px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2px solid #fff;
  border-radius:12px;
  background:linear-gradient(135deg,#ff9f43 0%,#f05d69 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
  letter-spacing:0;
  box-shadow:0 7px 16px rgba(224,92,84,.3);
  animation:recharge-v2-activity-badge 1.7s ease-in-out infinite;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::after{
  inset:-3px;
  border-radius:14px;
  animation:recharge-v2-activity-pulse 1.7s ease-out infinite;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity .recharge-v2-tag{
  right:58px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
  min-height:54px;
  margin-top:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-checkout{
  gap:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
  gap:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
  height:78px;
  gap:7px;
  border-radius:11px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:38px;
  height:38px;
  flex-basis:38px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>strong{
  font-size:12px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
  height:58px;
  border-radius:14px;
  font-size:15px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
  height:auto;
  min-height:100%;
  grid-template-rows:212px 70px auto minmax(0,1fr);
  gap:10px;
  overflow:hidden;
  padding:14px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
  width:100%;
  height:212px;
  min-height:212px;
  margin:0;
  border-radius:11px;
  background:#fff;
  box-shadow:0 9px 22px rgba(73,82,132,.09);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual>img{
  width:94%;
  height:94%;
  max-width:none;
  margin:auto;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 10px 18px rgba(67,88,171,.14));
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual-badge{
  left:10px;
  right:10px;
  bottom:10px;
  border:1px solid rgba(255,255,255,.78);
  background:rgba(255,255,255,.9);
  box-shadow:0 7px 18px rgba(31,38,66,.12);
  backdrop-filter:blur(7px);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance{
  min-height:70px;
  gap:11px;
  padding:10px 12px;
  border-radius:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance>span{
  width:40px;
  height:40px;
  border-radius:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance small{
  font-size:11px;
  font-weight:750;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance strong{
  font-size:22px;
  line-height:1.1;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance em{
  font-size:11px;
}

@keyframes recharge-v2-activity-badge{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-3px) scale(1.035)}
}
@keyframes recharge-v2-activity-pulse{
  0%{opacity:.5;transform:scale(.9)}
  72%,100%{opacity:0;transform:scale(1.22)}
}

@media (min-width:761px) and (max-width:1180px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
    width:calc(100vw - 28px);
    height:min(740px,calc(100dvh - 28px));
    max-height:calc(100dvh - 28px);
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    left:146px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
    grid-template-columns:146px minmax(0,1fr);
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    grid-template-columns:minmax(0,1fr) 250px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    padding-right:18px;
    padding-left:18px;
  }
}

@media (max-width:760px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-online){
    padding:6px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
    width:calc(100vw - 12px);
    height:calc(100dvh - 12px);
    max-height:calc(100dvh - 12px);
    border-radius:12px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    position:static;
    min-height:58px;
    height:58px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
    padding-top:0;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    min-height:0;
    display:flex;
    flex-direction:column;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    min-height:0;
    padding:14px 10px 16px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner{
    min-height:78px;
    grid-template-columns:38px minmax(0,1fr);
    gap:8px;
    padding:9px 10px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-photo{
    width:43%;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner::before{
    background:linear-gradient(90deg,var(--rv2-banner-bg) 0%,var(--rv2-banner-bg) 66%,color-mix(in srgb,var(--rv2-banner-bg) 78%,transparent) 84%,rgba(255,255,255,.14) 100%);
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon{
    width:38px;
    height:38px;
    border-radius:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon .recharge-feature-icon{
    width:30px;
    height:30px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon>i{
    right:-5px;
    bottom:-4px;
    width:17px;
    height:17px;
    font-size:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy{
    gap:2px 5px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>strong{
    font-size:12px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>span{
    font-size:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner>b{
    display:none;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
    grid-auto-rows:92px;
    gap:7px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
    min-height:92px;
    padding:10px 7px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
    font-size:21px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
    gap:3px 4px;
    margin-top:7px;
    font-size:11px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small em{
    min-height:17px;
    padding:2px 4px;
    font-size:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
    top:-6px;
    right:5px;
    width:38px;
    height:21px;
    border-radius:11px;
    font-size:9px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity .recharge-v2-tag{
    right:46px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
    height:72px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
    height:54px;
    border-radius:13px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
    min-height:0;
    grid-template-rows:none;
    padding:10px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
    display:none;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance{
    min-height:62px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance strong{
    font-size:19px;
  }
}

/* Recharge acceptance pass: compact proportions, restrained palette, and a fixed-height desktop grid. */
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-online){
  padding:18px;
  background:rgba(35,37,53,.30);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
  --rv2-accent:#6974ee;
  --rv2-accent-strong:#5d68df;
  --rv2-accent-soft:#eef0ff;
  --rv2-text:#202538;
  --rv2-soft:#4b5369;
  --rv2-muted:#858da2;
  --rv2-line:#e1e5ef;
  --rv2-line-strong:#c8cedc;
  width:min(1040px,calc(100vw - 36px));
  height:min(680px,calc(100dvh - 36px));
  max-height:calc(100dvh - 36px);
  border:1px solid #dce1f0;
  border-radius:14px;
  background:#fff;
  background-image:none;
  box-shadow:0 24px 64px rgba(37,44,78,.24),0 0 0 1px rgba(255,255,255,.76);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
  left:144px;
  min-height:64px;
  height:64px;
  padding:10px 18px;
  border-bottom:1px solid #edf0f6;
  background:rgba(255,255,255,.98);
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand-mark{
  width:34px;
  height:34px;
  border:1px solid #dfe4fb;
  background:#f0f2ff;
  color:#6874eb;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand strong{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:17px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand small,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head-status{
  color:#858da2;
  -webkit-text-fill-color:#858da2;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-close{
  width:32px;
  height:32px;
  border-color:#e0e4ee;
  background:#f6f7fb;
  color:#626a7e;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
  height:100%;
  min-height:0;
  grid-template-columns:144px minmax(0,1fr);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav{
  gap:7px;
  padding:75px 10px 14px;
  background:linear-gradient(180deg,#6577ee 0%,#7e90f2 52%,#b4bef8 100%);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button{
  min-height:62px;
  gap:5px;
  padding:7px 6px;
  color:rgba(255,255,255,.88);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button.is-active{
  border-color:rgba(255,255,255,.72);
  background:#fff;
  color:#5d68df;
  -webkit-text-fill-color:#5d68df;
  box-shadow:0 8px 20px rgba(52,62,137,.18);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button>span{
  width:31px;
  height:31px;
  background:rgba(255,255,255,.13);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button.is-active>span{
  background:#eef0ff;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button strong{
  font-size:12px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift{
  position:relative;
  min-height:88px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  padding:34px 7px 10px;
  overflow:visible;
  border-color:rgba(255,255,255,.44);
  border-radius:9px;
  background:rgba(255,255,255,.68);
  box-shadow:0 7px 18px rgba(67,74,145,.11);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift>img{
  position:absolute;
  top:-38px;
  left:50%;
  width:96px;
  height:74px;
  max-width:none;
  transform:translateX(-50%);
  filter:drop-shadow(0 8px 10px rgba(70,70,160,.15));
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift>strong{
  color:#5965d4;
  -webkit-text-fill-color:#5965d4;
  font-size:13px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift>small{
  margin-top:4px;
  color:#737d9d;
  -webkit-text-fill-color:#737d9d;
  font-size:8px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
  height:100%;
  min-height:0;
  padding-top:64px;
  overflow:hidden;
  background:#f7f9ff;
  background-image:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pane,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
  height:100%;
  min-height:0;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
  grid-template-columns:minmax(0,1fr) 238px;
  align-items:stretch;
}
html.jn-light-mode body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  height:100%;
  min-height:0;
  overflow:hidden;
  padding:16px 20px 18px;
  background:#f7f9ff;
  background-image:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row{
  display:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section{
  margin-bottom:12px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head{
  margin-bottom:8px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head h3{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:14px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner{
  --rv2-banner-accent:#6672ed;
  --rv2-banner-bg:#eef1ff;
  --rv2-banner-border:#d9defb;
  --rv2-banner-text:#313a65;
  min-height:72px;
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  margin:0 0 9px;
  padding:10px 12px;
  overflow:hidden;
  border:1px solid var(--rv2-banner-border);
  border-radius:9px;
  background:var(--rv2-banner-bg);
  background-image:none;
  color:var(--rv2-banner-text);
  box-shadow:0 5px 14px rgba(62,72,119,.055);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner.theme-red{
  --rv2-banner-accent:#d95768;
  --rv2-banner-bg:#fff0f2;
  --rv2-banner-border:#f4d4da;
  --rv2-banner-text:#783642;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner.theme-gold{
  --rv2-banner-accent:#b78324;
  --rv2-banner-bg:#fff8e8;
  --rv2-banner-border:#eedeb7;
  --rv2-banner-text:#6c5226;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner.theme-blue{
  --rv2-banner-accent:#337bd8;
  --rv2-banner-bg:#edf5ff;
  --rv2-banner-border:#d4e4f8;
  --rv2-banner-text:#31547c;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner.theme-green{
  --rv2-banner-accent:#2e906d;
  --rv2-banner-bg:#edf9f4;
  --rv2-banner-border:#cfeadd;
  --rv2-banner-text:#315f51;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--rv2-banner-accent);
  color:#fff;
  box-shadow:0 6px 12px color-mix(in srgb,var(--rv2-banner-accent) 24%,transparent);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon .recharge-ui-icon{
  width:21px;
  height:21px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:2px 7px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>small{
  padding:2px 5px;
  border-radius:4px;
  background:color-mix(in srgb,var(--rv2-banner-accent) 12%,transparent);
  color:var(--rv2-banner-accent);
  -webkit-text-fill-color:var(--rv2-banner-accent);
  font-size:9px;
  font-weight:900;
  line-height:1.2;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>strong{
  min-width:0;
  overflow:hidden;
  color:var(--rv2-banner-text);
  -webkit-text-fill-color:var(--rv2-banner-text);
  font-size:14px;
  font-weight:900;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>span{
  grid-column:1 / -1;
  min-width:0;
  overflow:hidden;
  color:color-mix(in srgb,var(--rv2-banner-text) 72%,#fff);
  -webkit-text-fill-color:color-mix(in srgb,var(--rv2-banner-text) 72%,#fff);
  font-size:9px;
  font-weight:600;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner>b{
  padding:6px 8px;
  border:1px solid color-mix(in srgb,var(--rv2-banner-accent) 18%,transparent);
  border-radius:7px;
  background:rgba(255,255,255,.64);
  color:var(--rv2-banner-accent);
  -webkit-text-fill-color:var(--rv2-banner-accent);
  font-size:9px;
  font-weight:900;
  line-height:1.1;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
  grid-auto-rows:84px;
  gap:10px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
  min-height:84px;
  padding:11px 13px;
  border:1px solid #e1e5ef;
  border-radius:9px;
  background:#fff;
  background-image:none;
  color:#202538;
  -webkit-text-fill-color:currentColor;
  box-shadow:0 5px 14px rgba(55,65,105,.05);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package:hover{
  border-color:#bac3e7;
  background:#fbfbff;
  box-shadow:0 8px 18px rgba(62,72,119,.08);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected{
  border-color:#645ee9;
  background:linear-gradient(135deg,#7180f3 0%,#655fe9 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 9px 20px rgba(88,92,214,.24);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:22px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:3px 5px;
  margin-top:7px;
  overflow:visible;
  color:#697186;
  -webkit-text-fill-color:#697186;
  font-size:10px;
  line-height:1.15;
  white-space:normal;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small em{
  display:inline-flex;
  align-items:center;
  min-height:16px;
  margin:0;
  padding:2px 5px;
  border-radius:5px;
  background:#fff1e6;
  color:#d86f2e;
  -webkit-text-fill-color:#d86f2e;
  font-size:8px;
  font-style:normal;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>strong,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>strong i,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small em{
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-tag{
  background:#9a6ef0;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity .recharge-v2-tag{
  right:42px;
  border-radius:0 0 7px 7px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
  position:absolute;
  top:-8px;
  right:8px;
  z-index:3;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:2px solid #fff;
  border-radius:9px;
  background:linear-gradient(145deg,#ffb34f 0%,#f56a68 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 7px 15px rgba(223,104,76,.27);
  transform-origin:50% 80%;
  animation:recharge-v2-gift-float 1.8s ease-in-out infinite;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::after{
  content:"";
  position:absolute;
  inset:-4px;
  border:1px solid rgba(245,106,104,.28);
  border-radius:12px;
  opacity:0;
  animation:recharge-v2-gift-pulse 1.8s ease-out infinite;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark .recharge-ui-icon{
  width:14px;
  height:14px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small em{
  background:rgba(255,255,255,.16);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
  min-height:50px;
  margin-top:9px;
  padding:7px 10px;
  border-color:#e1e5ef;
  background:#fff;
  background-image:none;
  box-shadow:0 5px 14px rgba(55,65,105,.045);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom::before,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom::after,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input::before,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input::after{
  display:none;
  content:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
  width:152px;
  min-width:152px;
  height:34px;
  border:0;
  border-left:1px solid #e5e8f1;
  border-radius:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input input,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input input:hover,
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input input:focus{
  height:100%;
  max-height:100%;
  padding:0 8px;
  border:0;
  border-radius:0;
  outline:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-checkout{
  grid-template-columns:minmax(0,1fr);
  gap:8px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-payment{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
  gap:8px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
  height:76px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 10px;
  border-color:#e0e4ee;
  border-radius:10px;
  background:#fff;
  box-shadow:0 5px 14px rgba(55,65,105,.045);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid input:checked+span{
  border-color:#6974ee;
  background:#f3f4ff;
  color:#333645;
  box-shadow:inset 0 0 0 1px rgba(101,113,233,.11),0 6px 15px rgba(79,88,177,.07);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>strong{
  color:inherit;
  -webkit-text-fill-color:currentColor;
  font-size:11px;
  line-height:1;
  text-align:center;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-alipay>.front-pay-alipay-mark{
  width:100%;
  height:100%;
  fill:#1677ff;
  stroke:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-alipay{
  border:0;
  background:transparent;
  color:#1677ff;
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-alipay::after{
  display:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action{
  display:block;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action strong{
  font-size:22px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
  width:100%;
  height:56px;
  border-radius:14px;
  background:linear-gradient(90deg,#7167f0 0%,#5a78ee 100%);
  box-shadow:0 9px 20px rgba(79,89,211,.22);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
  height:100%;
  min-height:0;
  grid-template-rows:132px 52px auto minmax(0,1fr);
  align-content:start;
  gap:6px;
  overflow:hidden;
  padding:10px 12px 12px;
  border-left:1px solid #e4e7f1;
  background:linear-gradient(180deg,#edf2ff 0%,#f1ecff 56%,#f7f8ff 100%);
  background-image:linear-gradient(180deg,#edf2ff 0%,#f1ecff 56%,#f7f8ff 100%);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
  width:142px;
  height:132px;
  min-height:132px;
  margin:0 auto;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.88);
  border-radius:8px;
  background:rgba(255,255,255,.84);
  background-image:none;
  box-shadow:0 7px 18px rgba(73,82,132,.06);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual>img{
  width:140px;
  height:140px;
  max-width:140px;
  object-fit:contain;
  mix-blend-mode:normal;
  filter:none;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance{
  min-width:0;
  min-height:52px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:7px 9px;
  border:1px solid rgba(224,228,238,.92);
  border-radius:8px;
  background:#fff;
  box-shadow:0 6px 16px rgba(73,82,132,.055);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:8px;
  background:#eef0ff;
  color:#6571e9;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance>span .recharge-ui-icon{
  width:18px;
  height:18px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance>div{
  min-width:0;
  display:grid;
  gap:3px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance small{
  color:#858da1;
  font-size:9px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance strong{
  min-width:0;
  overflow:hidden;
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:17px;
  line-height:1.05;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance em{
  color:#858da1;
  -webkit-text-fill-color:#858da1;
  font-size:9px;
  font-style:normal;
  font-weight:700;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-card{
  padding:8px 9px;
  border:1px solid rgba(224,228,238,.92);
  border-radius:8px;
  background:#fff;
  box-shadow:0 6px 16px rgba(73,82,132,.05);
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card>p{
  margin:4px 0 6px;
  font-size:8px;
  line-height:1.3;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card ul{
  gap:3px;
  padding-top:6px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card li{
  font-size:7.5px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list{
  gap:3px;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-card{
  min-height:0;
  overflow:hidden;
}
html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article{
  min-height:34px;
  padding:3px 0;
}

@keyframes recharge-v2-gift-float{
  0%,100%{transform:translateY(0) rotate(0)}
  45%{transform:translateY(-3px) rotate(-4deg)}
  70%{transform:translateY(-1px) rotate(3deg)}
}
@keyframes recharge-v2-gift-pulse{
  0%,35%{opacity:0;transform:scale(.78)}
  55%{opacity:.65}
  100%{opacity:0;transform:scale(1.2)}
}
@media (prefers-reduced-motion:reduce){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark,
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::after{
    animation:none;
  }
}

@media (min-width:761px) and (max-width:1080px){
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    left:136px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
    grid-template-columns:136px minmax(0,1fr);
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    grid-template-columns:minmax(0,1fr) 220px;
  }
}

@media (max-width:760px){
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-online){
    padding:6px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
    width:calc(100vw - 12px);
    height:calc(100dvh - 12px);
    max-height:calc(100dvh - 12px);
    border-radius:12px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    position:static;
    min-height:58px;
    height:58px;
    padding:8px 10px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
    height:auto;
    display:flex;
    flex-direction:column;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px;
    padding:5px;
    background:linear-gradient(90deg,#687bf0 0%,#98a7f5 100%);
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button{
    min-height:48px;
    padding:3px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav>button>span{
    width:23px;
    height:23px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-nav-gift{
    display:none;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
    height:auto;
    padding-top:0;
    overflow:auto;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pane,
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    height:auto;
    min-height:0;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    display:flex;
    flex-direction:column;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    height:auto;
    overflow:visible;
    padding:12px 10px 14px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner{
    min-height:56px;
    grid-template-columns:30px minmax(0,1fr) auto;
    gap:7px;
    margin-bottom:9px;
    padding:7px 8px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-icon{
    width:30px;
    height:30px;
    border-radius:7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy{
    gap:2px 5px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>small{
    padding:2px 4px;
    font-size:7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>strong{
    font-size:10px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner-copy>span{
    font-size:7.5px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-banner>b{
    padding:4px 5px;
    font-size:7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
    grid-auto-rows:80px;
    gap:6px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
    min-height:80px;
    padding:8px 7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
    font-size:20px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
    gap:2px 3px;
    margin-top:5px;
    font-size:8px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small em{
    min-height:14px;
    padding:2px 4px;
    font-size:7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
    top:-6px;
    right:5px;
    width:23px;
    height:23px;
    border-radius:7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark .recharge-ui-icon{
    width:12px;
    height:12px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity .recharge-v2-tag{
    right:31px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
    width:112px;
    min-width:112px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-checkout{
    display:flex;
    flex-direction:column;
    gap:8px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
    height:68px;
    gap:5px;
    padding:6px 7px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
    width:30px;
    height:30px;
    flex-basis:30px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
    height:52px;
    border-radius:13px;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
    height:auto;
    grid-template-rows:none;
    overflow:visible;
    padding:10px;
    border-top:1px solid #e4e7f1;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
    display:none;
  }
  html body[class^="page-"]:not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance{
    min-height:54px;
  }
}

/* 2026-07-09 unified in-site payment cashier */
.jn-payment-layer{position:fixed;inset:0;z-index:100260;display:grid;place-items:center;padding:14px;background:rgba(0,0,0,.58);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#f8fafc}
.jn-payment-panel{width:min(420px,calc(100vw - 28px));max-height:calc(100dvh - 28px);display:grid;grid-template-rows:auto auto auto auto;overflow:hidden;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:#111;box-shadow:0 24px 72px rgba(0,0,0,.52)}
.jn-payment-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 14px 12px;border-bottom:1px solid #2d2d2d;background:#141414}
.jn-payment-head span{display:inline-flex;align-items:center;height:24px;margin-bottom:8px;padding:0 9px;border-radius:999px;background:rgba(37,132,255,.16);color:#93c5fd;font-size:12px;font-weight:900}
.jn-payment-head h2{margin:0;color:#fff;font-size:18px;line-height:1.2;letter-spacing:0}
.jn-payment-head p{margin:6px 0 0;color:#a3a3a3;font-size:12px;line-height:1.45}
.jn-payment-close{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #2d2d2d;border-radius:10px;background:#1a1a1a;color:#fff;font-size:21px;line-height:1;cursor:pointer}
.jn-payment-status{height:30px;display:flex;align-items:center;justify-content:center;margin:10px 14px 0;border-radius:999px;border:1px solid rgba(37,132,255,.28);background:rgba(37,132,255,.12);color:#bfdbfe;font-size:12px;font-weight:950}
.jn-payment-status.is-success{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.14);color:#bbf7d0}
.jn-payment-status.is-failed{border-color:rgba(248,113,113,.35);background:rgba(248,113,113,.13);color:#fecaca}
.jn-payment-summary{display:grid;grid-template-columns:1fr;gap:8px;margin:10px 14px}
.jn-payment-summary>div{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid #2d2d2d;border-radius:10px;background:#1a1a1a}
.jn-payment-summary span{min-width:max-content;color:#9ca3af;font-size:12px;font-weight:800}
.jn-payment-summary strong{min-width:0;color:#fff;font-size:13px;font-weight:950;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jn-payment-summary .total strong{color:#ffb74d;font-size:15px}
.jn-payment-error,
.jn-payment-notice{margin:0 18px 14px;padding:14px;border-radius:12px;font-size:13px;line-height:1.65}
.jn-payment-error{border:1px solid rgba(248,113,113,.34);background:rgba(127,29,29,.18);color:#fecaca}
.jn-payment-notice{border:1px solid rgba(96,165,250,.32);background:rgba(30,64,175,.16);color:#dbeafe}
.jn-payment-qr-wrap{display:grid;place-items:center;align-content:center;margin:0 14px 12px;padding:4px;border:0;border-radius:0;background:transparent}
.jn-payment-qr{width:212px;height:212px;display:grid;place-items:center;padding:10px;border-radius:10px;background:#fff;color:#111;font-size:12px;text-align:center;word-break:break-all;overflow:hidden}
.jn-payment-qr svg{width:100%;height:100%;display:block}
.jn-payment-qr-wrap p,
.jn-payment-scheme p,
.jn-payment-empty{margin:0;color:#a3a3a3;font-size:13px;line-height:1.6;text-align:center}
.jn-payment-frame-wrap{min-height:360px;height:min(560px,54dvh);margin:0 18px 14px;overflow:hidden;border:1px solid #2d2d2d;border-radius:14px;background:#fff}
.jn-payment-frame-wrap iframe{width:100%;height:100%;display:block;border:0;background:#fff;color-scheme:light}
.jn-payment-scheme,
.jn-payment-empty{display:grid;place-items:center;align-content:center;gap:14px;min-height:220px;margin:0 18px 14px;padding:18px;border:1px solid #2d2d2d;border-radius:14px;background:#171717}
.jn-payment-scheme button,
.jn-payment-primary,
.jn-payment-secondary{height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:0 16px;font-size:13px;font-weight:950;cursor:pointer;white-space:nowrap}
.jn-payment-scheme button,
.jn-payment-primary{border:0;background:#2584ff;color:#fff;box-shadow:0 10px 24px rgba(37,132,255,.22)}
.jn-payment-secondary{border:1px solid #2d2d2d;background:#1a1a1a;color:#f2f2f2}
.jn-payment-primary:disabled,
.jn-payment-secondary:disabled{cursor:wait;opacity:.68;box-shadow:none}
.jn-payment-actions{display:flex;justify-content:flex-end;gap:10px;padding:10px 14px 14px;border-top:1px solid #2d2d2d;background:#141414}
.jn-confirm-pay:disabled{cursor:not-allowed;opacity:.68}
html.jn-light-mode body:not(.page-admin) .jn-payment-layer,
body.jn-light-mode:not(.page-admin) .jn-payment-layer,
html[data-theme="light"] body:not(.page-admin) .jn-payment-layer,
body[data-theme="light"]:not(.page-admin) .jn-payment-layer{background:rgba(241,245,249,.78);color:#0f172a;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
html.jn-light-mode body:not(.page-admin) .jn-payment-panel,
body.jn-light-mode:not(.page-admin) .jn-payment-panel,
html[data-theme="light"] body:not(.page-admin) .jn-payment-panel,
body[data-theme="light"]:not(.page-admin) .jn-payment-panel{background:#fff;color:#0f172a;border-color:rgba(15,23,42,.12);box-shadow:0 28px 80px rgba(15,23,42,.18)}
html.jn-light-mode body:not(.page-admin) .jn-payment-head,
body.jn-light-mode:not(.page-admin) .jn-payment-head,
html[data-theme="light"] body:not(.page-admin) .jn-payment-head,
body[data-theme="light"]:not(.page-admin) .jn-payment-head,
html.jn-light-mode body:not(.page-admin) .jn-payment-actions,
body.jn-light-mode:not(.page-admin) .jn-payment-actions,
html[data-theme="light"] body:not(.page-admin) .jn-payment-actions,
body[data-theme="light"]:not(.page-admin) .jn-payment-actions{background:#f8fafc;border-color:rgba(15,23,42,.10)}
html.jn-light-mode body:not(.page-admin) .jn-payment-head h2,
body.jn-light-mode:not(.page-admin) .jn-payment-head h2,
html[data-theme="light"] body:not(.page-admin) .jn-payment-head h2,
body[data-theme="light"]:not(.page-admin) .jn-payment-head h2,
html.jn-light-mode body:not(.page-admin) .jn-payment-summary strong,
body.jn-light-mode:not(.page-admin) .jn-payment-summary strong,
html[data-theme="light"] body:not(.page-admin) .jn-payment-summary strong,
body[data-theme="light"]:not(.page-admin) .jn-payment-summary strong{color:#0f172a}
html.jn-light-mode body:not(.page-admin) .jn-payment-head p,
body.jn-light-mode:not(.page-admin) .jn-payment-head p,
html[data-theme="light"] body:not(.page-admin) .jn-payment-head p,
body[data-theme="light"]:not(.page-admin) .jn-payment-head p,
html.jn-light-mode body:not(.page-admin) .jn-payment-summary span,
body.jn-light-mode:not(.page-admin) .jn-payment-summary span,
html[data-theme="light"] body:not(.page-admin) .jn-payment-summary span,
body[data-theme="light"]:not(.page-admin) .jn-payment-summary span,
html.jn-light-mode body:not(.page-admin) .jn-payment-qr-wrap p,
body.jn-light-mode:not(.page-admin) .jn-payment-qr-wrap p,
html[data-theme="light"] body:not(.page-admin) .jn-payment-qr-wrap p,
body[data-theme="light"]:not(.page-admin) .jn-payment-qr-wrap p{color:#64748b}
html.jn-light-mode body:not(.page-admin) .jn-payment-close,
body.jn-light-mode:not(.page-admin) .jn-payment-close,
html[data-theme="light"] body:not(.page-admin) .jn-payment-close,
body[data-theme="light"]:not(.page-admin) .jn-payment-close,
html.jn-light-mode body:not(.page-admin) .jn-payment-secondary,
body.jn-light-mode:not(.page-admin) .jn-payment-secondary,
html[data-theme="light"] body:not(.page-admin) .jn-payment-secondary,
body[data-theme="light"]:not(.page-admin) .jn-payment-secondary{background:#fff;color:#0f172a;border-color:rgba(15,23,42,.12);box-shadow:none}
html.jn-light-mode body:not(.page-admin) .jn-payment-summary>div,
body.jn-light-mode:not(.page-admin) .jn-payment-summary>div,
html[data-theme="light"] body:not(.page-admin) .jn-payment-summary>div,
body[data-theme="light"]:not(.page-admin) .jn-payment-summary>div,
html.jn-light-mode body:not(.page-admin) .jn-payment-notice,
body.jn-light-mode:not(.page-admin) .jn-payment-notice,
html[data-theme="light"] body:not(.page-admin) .jn-payment-notice,
body[data-theme="light"]:not(.page-admin) .jn-payment-notice,
html.jn-light-mode body:not(.page-admin) .jn-payment-qr-wrap,
body.jn-light-mode:not(.page-admin) .jn-payment-qr-wrap,
html[data-theme="light"] body:not(.page-admin) .jn-payment-qr-wrap,
body[data-theme="light"]:not(.page-admin) .jn-payment-qr-wrap,
html.jn-light-mode body:not(.page-admin) .jn-payment-scheme,
body.jn-light-mode:not(.page-admin) .jn-payment-scheme,
html[data-theme="light"] body:not(.page-admin) .jn-payment-scheme,
body[data-theme="light"]:not(.page-admin) .jn-payment-scheme{background:#fff;border-color:rgba(15,23,42,.10);color:#0f172a}
html.jn-light-mode body:not(.page-admin) .jn-payment-error,
body.jn-light-mode:not(.page-admin) .jn-payment-error,
html[data-theme="light"] body:not(.page-admin) .jn-payment-error,
body[data-theme="light"]:not(.page-admin) .jn-payment-error{background:#fef2f2;color:#b91c1c;border-color:#fecaca}
html.jn-light-mode body:not(.page-admin) .jn-payment-notice,
body.jn-light-mode:not(.page-admin) .jn-payment-notice,
html[data-theme="light"] body:not(.page-admin) .jn-payment-notice,
body[data-theme="light"]:not(.page-admin) .jn-payment-notice{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe}
@media(max-width:760px){
.jn-payment-layer{padding:10px;place-items:center}
  .jn-payment-panel{width:min(340px,calc(100vw - 20px));max-height:calc(100dvh - 20px);border-radius:16px;grid-template-rows:auto auto auto auto}
  .jn-payment-head{padding:13px 13px 11px}
  .jn-payment-head h2{font-size:18px}
  .jn-payment-head p{font-size:12px}
  .jn-payment-status{margin:10px 13px 0}
  .jn-payment-summary{grid-template-columns:1fr;margin:10px 13px;gap:7px}
  .jn-payment-summary>div{padding:10px;border-radius:10px}
  .jn-payment-qr-wrap,
.jn-payment-frame-wrap,
.jn-payment-scheme,
.jn-payment-empty,
.jn-payment-error,
.jn-payment-notice{margin-left:14px;margin-right:14px;margin-bottom:12px;border-radius:12px}
  .jn-payment-qr-wrap{padding:2px}
  .jn-payment-qr{width:min(204px,66vw);height:min(204px,66vw)}
  .jn-payment-frame-wrap{min-height:330px;height:48dvh}
  .jn-payment-actions{display:grid;grid-template-columns:1fr;padding:12px 14px 14px}
  .jn-payment-primary,
.jn-payment-secondary{width:100%}
}
/* Recharge dialog surface isolated from page shop styles. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer{
  position:fixed;
  inset:0;
  z-index:100240;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(3,8,18,.68);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal{
  --rv2-bg:#111925;
  --rv2-surface:#172131;
  --rv2-surface-2:#1c2738;
  --rv2-surface-3:#222e41;
  --rv2-line:#2c3a4e;
  --rv2-line-strong:#43546d;
  --rv2-text:#f5f8fc;
  --rv2-soft:#d6deea;
  --rv2-muted:#8d9bad;
  --rv2-accent:#3c8df7;
  --rv2-accent-strong:#2677e6;
  --rv2-accent-soft:rgba(60,141,247,.14);
  --rv2-success:#27c98b;
  --rv2-gold:#e5b34d;
  --rv2-gold-strong:#c88d28;
  --rv2-gold-soft:rgba(229,179,77,.13);
  width:min(1160px,calc(100vw - 36px));
  height:min(780px,calc(100dvh - 36px));
  max-height:calc(100dvh - 36px);
  min-height:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--rv2-line);
  border-radius:18px;
  background:var(--rv2-bg);
  background-image:none;
  color:var(--rv2-text);
  box-shadow:0 30px 100px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.03);
  font-family:inherit;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal *{box-sizing:border-box}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal button,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal input{font:inherit;letter-spacing:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal button{cursor:pointer}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-icon{width:20px;height:20px;flex:0 0 auto}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-head{
  min-height:74px;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:18px;
  padding:14px 22px;
  border-bottom:1px solid var(--rv2-line);
  background:var(--rv2-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand{min-width:0;display:flex;align-items:center;gap:11px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand-mark{
  width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;
  border:1px solid rgba(60,141,247,.34);border-radius:12px;background:var(--rv2-accent-soft);color:#79b0ff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand-mark .recharge-v2-icon{width:22px;height:22px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand>div{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand strong{color:var(--rv2-text);font-size:16px;font-weight:900;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand small{color:var(--rv2-muted);font-size:11px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-head-status{display:flex;align-items:center;gap:6px;margin-left:auto;color:var(--rv2-success);font-size:11px;font-weight:800}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-head-status .recharge-v2-icon{width:16px;height:16px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-close{
  width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;padding:0;border:1px solid var(--rv2-line);
  border-radius:9px;background:var(--rv2-surface-2);color:var(--rv2-muted);font-size:22px;line-height:1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-close:hover{border-color:var(--rv2-line-strong);color:var(--rv2-text);background:var(--rv2-surface-3)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-shell{min-height:0;flex:1 1 auto;display:grid;grid-template-columns:178px minmax(0,1fr)}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav{
  min-width:0;display:flex;flex-direction:column;gap:7px;padding:16px 12px;border-right:1px solid var(--rv2-line);background:var(--rv2-surface);
}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button,body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift{
  min-width:0;display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:9px;row-gap:3px;
  padding:10px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--rv2-muted);text-align:left;
}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button:hover{background:var(--rv2-surface-2);color:var(--rv2-soft)}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button.is-active{border-color:rgba(60,141,247,.32);background:var(--rv2-accent-soft);color:#8abbff;box-shadow:inset 3px 0 0 var(--rv2-accent)}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button:nth-child(2).is-active{border-color:rgba(229,179,77,.36);background:var(--rv2-gold-soft);color:var(--rv2-gold);box-shadow:inset 3px 0 0 var(--rv2-gold)}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button>span,body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift>span{width:30px;height:30px;grid-row:1 / 3;display:grid;place-items:center;border-radius:8px;background:var(--rv2-surface-2);color:inherit}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift>img{width:30px;height:30px;grid-row:1 / 3;display:block;object-fit:contain}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button strong,body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift strong{min-width:0;overflow:hidden;color:inherit;font-size:12px;font-weight:900;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button small,body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift small{min-width:0;overflow:hidden;color:var(--rv2-muted);font-size:9px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift{margin-top:auto;border-color:rgba(229,179,77,.22);background:var(--rv2-gold-soft);color:var(--rv2-gold)}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift>span{background:rgba(229,179,77,.12)}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance{
  min-width:0;display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:9px;padding:10px;
  border:1px solid var(--rv2-line);border-radius:10px;background:var(--rv2-surface-2);color:var(--rv2-soft);
}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance>span{
  width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:var(--rv2-accent-soft);color:var(--rv2-accent);
}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance>span .recharge-v2-icon{width:17px;height:17px}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance>div{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance small{
  display:block;margin-bottom:3px;color:var(--rv2-muted);font-size:9px;line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance>div>span{min-width:0;display:flex;align-items:baseline;gap:4px}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance strong{
  min-width:0;overflow:hidden;color:var(--rv2-text);font-size:14px;font-weight:900;line-height:1.15;text-overflow:ellipsis;white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .account-service-nav-balance em{
  flex:0 0 auto;color:var(--rv2-muted);font-size:9px;font-style:normal;line-height:1.2;white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-scroll{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;background:var(--rv2-bg)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pane{min-height:100%}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-content-grid{min-height:100%;display:grid;grid-template-columns:minmax(0,1fr) 278px;align-items:start}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-main{min-width:0;padding:25px 24px 28px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:21px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row>div:first-child{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-eyebrow{display:block;margin-bottom:5px;color:#75aaff;font-size:9px;font-weight:900;letter-spacing:.12em;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row h2{margin:0;color:var(--rv2-text);font-size:22px;font-weight:950;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row p{margin:6px 0 0;color:var(--rv2-muted);font-size:11px;line-height:1.3}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance{min-width:156px;display:grid;grid-template-columns:auto auto;align-items:end;gap:4px 8px;padding:10px 12px;border:1px solid var(--rv2-line);border-radius:10px;background:var(--rv2-surface)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance small{grid-column:1 / -1;color:var(--rv2-muted);font-size:9px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance strong{overflow:hidden;color:var(--rv2-text);font-size:16px;font-weight:950;line-height:1.1;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance span{align-self:end;color:var(--rv2-muted);font-size:9px;line-height:1.1;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section{min-width:0;margin:0 0 17px;padding:0;border:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head>div{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head h3{margin:0;color:var(--rv2-text);font-size:14px;font-weight:900;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head span{display:block;margin-top:4px;color:var(--rv2-muted);font-size:10px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head>b{color:var(--rv2-muted);font-size:9px;font-weight:700;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package{
  position:relative;min-width:0;min-height:123px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:16px 14px;
  border:1px solid var(--rv2-line);border-radius:11px;background:var(--rv2-surface);color:var(--rv2-text);text-align:left;transition:border-color .16s ease,background-color .16s ease,transform .16s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package:hover{border-color:var(--rv2-line-strong);background:var(--rv2-surface-2);transform:translateY(-1px)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package.is-selected{border-color:var(--rv2-accent);background:var(--rv2-accent-soft);box-shadow:inset 0 0 0 1px rgba(60,141,247,.35)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package.is-recommended{border-color:rgba(60,141,247,.34)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-tag{position:absolute;top:0;right:0;padding:4px 8px;border-radius:0 10px 0 8px;background:var(--rv2-accent);color:#fff;font-size:8px;font-weight:900;line-height:1.1}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>strong{display:flex;align-items:baseline;margin-top:0;color:var(--rv2-text);font-size:25px;font-weight:950;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>strong i,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action strong i{margin-right:2px;color:var(--rv2-muted);font-size:11px;font-style:normal;font-weight:800}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>small{display:block;max-width:100%;margin-top:7px;overflow:hidden;color:#82b3ff;font-size:9px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>small em{margin-left:3px;color:var(--rv2-gold);font-style:normal}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-radio{position:absolute;right:12px;bottom:12px;width:14px;height:14px;border:1px solid var(--rv2-line-strong);border-radius:50%;background:var(--rv2-bg)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package.is-selected .recharge-v2-radio{border:4px solid var(--rv2-accent);background:#fff}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom{min-height:57px;display:flex;align-items:center;gap:10px;margin-top:10px;padding:9px 12px;border:1px solid var(--rv2-line);border-radius:11px;background:var(--rv2-surface);cursor:text}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom:focus-within{border-color:var(--rv2-accent);box-shadow:0 0 0 3px var(--rv2-accent-soft)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-icon{width:29px;height:29px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:var(--rv2-accent-soft);color:#80b5ff}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-icon .recharge-v2-icon{width:16px;height:16px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-copy{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-copy strong{color:var(--rv2-soft);font-size:11px;font-weight:850;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-copy small{color:var(--rv2-muted);font-size:9px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input{display:flex;align-items:center;min-width:112px;height:34px;margin-left:auto;padding:0 8px;border:1px solid var(--rv2-line);border-radius:8px;background:var(--rv2-bg);color:var(--rv2-muted)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input i{font-size:11px;font-style:normal;font-weight:800}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input input{width:100%;min-width:0;padding:0 5px;border:0;outline:0;background:transparent;color:var(--rv2-text);font-size:12px;font-weight:800;text-align:right}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input input::placeholder{color:var(--rv2-muted);font-weight:600}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input button{width:18px;height:18px;padding:0;border:0;background:transparent;color:var(--rv2-muted);font-size:16px;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-field-error{margin:6px 0 0;color:#ff879b;font-size:10px;line-height:1.3}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-checkout{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:11px;align-items:stretch;margin:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-payment{margin:0;padding:14px;border:1px solid var(--rv2-line);border-radius:11px;background:var(--rv2-surface)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-payment .recharge-v2-icon{width:17px;height:17px;color:var(--rv2-success)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label{min-width:0;cursor:pointer}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span{min-width:0;height:53px;display:grid;grid-template-columns:25px minmax(0,1fr) 13px;align-items:center;gap:7px;padding:7px;border:1px solid var(--rv2-line);border-radius:8px;background:var(--rv2-surface-2);color:var(--rv2-soft)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label:hover>span{border-color:var(--rv2-line-strong)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span>.front-pay-brand-icon{width:25px;height:25px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span>strong{min-width:0;overflow:hidden;color:inherit;font-size:10px;font-weight:850;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span>i{width:13px;height:13px;border:1px solid var(--rv2-line-strong);border-radius:50%;background:var(--rv2-bg)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid input:checked+span{border-color:var(--rv2-accent);background:var(--rv2-accent-soft);box-shadow:inset 0 0 0 1px rgba(60,141,247,.28)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid input:checked+span>i{border:4px solid var(--rv2-accent);background:#fff}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action{min-width:0;display:grid;grid-template-columns:1fr;align-content:center;gap:8px;padding:15px;border:1px solid var(--rv2-line);border-radius:11px;background:var(--rv2-surface)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>div{display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action small{color:var(--rv2-muted);font-size:9px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action strong{color:var(--rv2-text);font-size:25px;font-weight:950;line-height:1}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>div>span{color:var(--rv2-muted);font-size:9px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>button,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane button{height:38px;display:flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:8px;background:var(--rv2-accent-strong);color:#fff;font-size:11px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>button .recharge-v2-icon,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane button .recharge-v2-icon{width:14px;height:14px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>button:disabled{background:var(--rv2-surface-3);color:var(--rv2-muted);cursor:not-allowed}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>p{margin:0;color:var(--rv2-muted);font-size:8px;line-height:1.3;text-align:center}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside{min-width:0;display:grid;align-content:start;gap:12px;padding:23px 17px;border-left:1px solid var(--rv2-line);background:var(--rv2-surface)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-card{min-width:0;padding:14px;border:1px solid var(--rv2-line);border-radius:11px;background:var(--rv2-surface-2)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card{padding:15px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-icon{width:44px;height:44px;display:grid;place-items:center;margin-bottom:13px;border:1px solid rgba(60,141,247,.28);border-radius:12px;background:var(--rv2-accent-soft);color:#82b6ff}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-icon .recharge-v2-icon{width:24px;height:24px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card>strong{color:var(--rv2-text);font-size:13px;font-weight:900;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card>p{margin:7px 0 13px;color:var(--rv2-muted);font-size:10px;line-height:1.55}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card ul{display:grid;gap:9px;margin:0;padding:12px 0 0;border-top:1px solid var(--rv2-line);list-style:none}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card li{display:flex;align-items:center;gap:7px;color:var(--rv2-soft);font-size:9px;line-height:1.2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card li .recharge-v2-icon{width:15px;height:15px;color:var(--rv2-accent)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-title>div{display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-title strong{color:var(--rv2-text);font-size:12px;font-weight:900}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-title small{color:var(--rv2-muted);font-size:9px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-title button{display:inline-flex;align-items:center;gap:2px;padding:2px 0;border:0;background:transparent;color:#80b4ff;font-size:9px;font-weight:800}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-title button span{font-size:17px;line-height:10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list{display:grid;gap:7px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article{min-width:0;display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:7px;padding:8px 0;border-top:1px solid var(--rv2-line)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article:first-child{border-top:0;padding-top:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article:last-child{padding-bottom:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article>.front-pay-brand-icon{width:25px;height:25px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article>div{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article strong{overflow:hidden;color:var(--rv2-soft);font-size:9px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article small{overflow:hidden;color:var(--rv2-muted);font-size:8px;text-overflow:ellipsis;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article>span{color:var(--rv2-gold);font-size:8px;font-weight:800;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article>span.is-success{color:var(--rv2-success)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-empty,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-empty{min-height:46px;display:grid;place-items:center;border:1px dashed var(--rv2-line-strong);border-radius:9px;color:var(--rv2-muted);font-size:10px;text-align:center}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-empty.is-error{color:#ff879b}

body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane{display:grid;place-items:center;padding:40px 24px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane form{width:min(430px,100%);display:grid;gap:12px;padding:28px;border:1px solid var(--rv2-line);border-radius:14px;background:var(--rv2-surface);text-align:center}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-icon{width:58px;height:58px;display:grid;place-items:center;margin:0 auto 4px;border:1px solid rgba(60,141,247,.3);border-radius:15px;background:var(--rv2-accent-soft);color:#81b5ff}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-icon .recharge-v2-icon{width:28px;height:28px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane h2{margin:0;color:var(--rv2-text);font-size:19px;font-weight:950}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane p{margin:0 0 7px;color:var(--rv2-muted);font-size:11px;line-height:1.4}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane input{height:42px;padding:0 12px;border:1px solid var(--rv2-line);border-radius:8px;outline:0;background:var(--rv2-bg);color:var(--rv2-text);font-size:12px;text-align:center}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane input:focus{border-color:var(--rv2-accent);box-shadow:0 0 0 3px var(--rv2-accent-soft)}

:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal,body.jn-light-mode:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal{
  --rv2-bg:#f6f8fb;--rv2-surface:#fff;--rv2-surface-2:#f7f9fc;--rv2-surface-3:#edf1f6;--rv2-line:#dfe5ee;--rv2-line-strong:#c6d0de;--rv2-text:#172033;--rv2-soft:#344054;--rv2-muted:#7a8799;--rv2-accent:#3276e6;--rv2-accent-strong:#2d6ddd;--rv2-accent-soft:rgba(50,118,230,.09);--rv2-success:#0b9f75;--rv2-gold:#b87c19;--rv2-gold-strong:#d29b35;--rv2-gold-soft:rgba(184,124,25,.09);box-shadow:0 28px 80px rgba(15,23,42,.22)
}
@media (min-width:761px) and (max-width:1050px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-shell{grid-template-columns:158px minmax(0,1fr)}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-content-grid{grid-template-columns:minmax(0,1fr) 240px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-checkout{grid-template-columns:1fr}
}
@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer{padding:8px;align-items:center}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal{width:calc(100vw - 16px);height:auto;max-height:calc(100dvh - 16px);border-radius:14px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-head{min-height:61px;padding:10px 12px;gap:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand-mark{width:34px;height:34px;border-radius:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand-mark .recharge-v2-icon{width:19px;height:19px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand strong{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-brand small{font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-head-status{font-size:9px;gap:4px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-close{width:29px;height:29px;font-size:18px;border-radius:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-shell{display:flex;flex-direction:column}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:6px;border-right:0;border-bottom:1px solid var(--rv2-line)}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:49px;padding:3px;border-radius:8px;text-align:center}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button.is-active{box-shadow:inset 0 -2px 0 var(--rv2-accent)}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button:nth-child(2).is-active{box-shadow:inset 0 -2px 0 var(--rv2-gold)}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button>span{width:20px;height:20px;background:transparent}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button>span .recharge-v2-icon{width:16px;height:16px}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button strong{font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav>button small{display:none}
  body:not(.page-admin) [data-front-app-public-root] .account-service-nav-gift{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-scroll{flex:1 1 auto}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-content-grid{display:flex;flex-direction:column}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-main{width:100%;padding:15px 12px 17px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row{align-items:center;margin-bottom:15px;gap:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-eyebrow{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row h2{font-size:17px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-title-row p{margin-top:4px;font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance{min-width:113px;padding:8px 9px;gap:3px 5px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance strong{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-balance span{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package{min-height:112px;padding:11px 9px;border-radius:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>strong{font-size:20px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>strong i{font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>small{margin-top:5px;font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-radio{right:7px;bottom:7px;width:12px;height:12px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-tag{padding:3px 5px;font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom{min-height:52px;margin-top:8px;padding:8px 9px;gap:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-icon{width:26px;height:26px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-copy strong{font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-copy small{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input{min-width:97px;height:31px;padding:0 6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-input input{font-size:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-checkout{display:flex;flex-direction:column;gap:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-payment{padding:11px;margin-bottom:0}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head{margin-bottom:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head h3{font-size:12px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head span{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-section-head>b{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span{height:45px;grid-template-columns:21px minmax(0,1fr) 11px;gap:4px;padding:5px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span>.front-pay-brand-icon{width:21px;height:21px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span>strong{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-pay-grid label>span>i{width:11px;height:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action{grid-template-columns:1fr auto;gap:5px 10px;padding:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action strong{font-size:22px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>button{width:132px;height:38px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>p{grid-column:1 / -1}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside{width:100%;display:grid;grid-template-columns:1fr;gap:8px;padding:0 12px 15px;border-left:0;border-top:1px solid var(--rv2-line)}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-aside-card{border-radius:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card{padding:12px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-icon{width:32px;height:32px;margin-bottom:8px;border-radius:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card>strong{font-size:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card>p{margin:5px 0 9px;font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding-top:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card li{gap:3px;font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-wallet-card li .recharge-v2-icon{width:13px;height:13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-card{padding:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article{grid-template-columns:21px minmax(0,1fr);gap:5px;padding:6px 0;border-top:0}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article>.front-pay-brand-icon{width:21px;height:21px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article>span{grid-column:2;font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article strong{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-record-list article small{font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane{padding:28px 12px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-redeem-pane form{padding:22px 16px}
}
@media (max-width:380px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-head-status{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package{padding-left:7px;padding-right:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-package>strong{font-size:18px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-action>button{width:119px}
}

/* Online recharge: keep the package page visually focused and independent from the other tabs. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
  --rv2-accent:#3b82f6;
  --rv2-accent-strong:#2563eb;
  --rv2-accent-soft:rgba(59,130,246,.10);
  --rv2-line:#e2e8f0;
  --rv2-line-strong:#cbd5e1;
  --rv2-surface:#fff;
  --rv2-surface-2:#f8fafc;
  --rv2-surface-3:#eef2f7;
  --rv2-text:#172033;
  --rv2-soft:#3b4658;
  --rv2-muted:#8793a5;
  border-radius:20px;
  box-shadow:0 30px 90px rgba(15,23,42,.26),0 0 0 1px rgba(255,255,255,.55);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
  min-height:76px;
  padding:15px 22px;
  background:var(--rv2-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand-mark{
  border-color:rgba(59,130,246,.20);
  border-radius:13px;
  background:#edf5ff;
  color:var(--rv2-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head-status{color:#159a75}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-close{
  border-color:var(--rv2-line);
  background:var(--rv2-surface-2);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
  padding:18px 12px;
  background:var(--rv2-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active{
  border-color:rgba(59,130,246,.22);
  background:#edf5ff;
  color:var(--rv2-accent);
  box-shadow:inset 3px 0 0 var(--rv2-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button>span{
  background:#f1f5f9;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
  background:#f7f9fc;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  padding:28px 26px 30px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row{
  margin-bottom:23px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-eyebrow{
  color:var(--rv2-accent);
  letter-spacing:.15em;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row h2{
  font-size:24px;
  letter-spacing:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row p{
  margin-top:7px;
  font-size:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-balance{
  min-width:164px;
  padding:12px 14px;
  border-color:#dbe7f7;
  border-radius:12px;
  background:#f2f7ff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-balance strong{
  color:#1e5fca;
  font-size:18px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section{
  margin-bottom:19px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head{
  margin-bottom:11px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head h3{
  font-size:15px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
  grid-auto-rows:122px;
  gap:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
  min-height:0;
  padding:17px 16px;
  border-color:var(--rv2-line);
  border-radius:13px;
  background:var(--rv2-surface);
  box-shadow:0 2px 7px rgba(15,23,42,.035);
  transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package:hover{
  border-color:#b8c9e2;
  background:#fbfdff;
  box-shadow:0 7px 17px rgba(15,23,42,.07);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected{
  border-color:var(--rv2-accent);
  background:#f3f8ff;
  box-shadow:inset 0 0 0 1px rgba(59,130,246,.20),0 6px 16px rgba(37,99,235,.10);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
  color:#172033;
  font-size:28px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong i{
  color:#8793a5;
  font-size:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
  margin-top:9px;
  color:#4c86dc;
  font-size:10px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-tag{
  padding:5px 9px;
  border-radius:0 12px 0 9px;
  background:var(--rv2-accent);
  font-size:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-radio{
  right:13px;
  bottom:13px;
  width:15px;
  height:15px;
  border-color:#b9c5d4;
  background:var(--rv2-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected .recharge-v2-radio{
  border-width:4px;
  border-color:var(--rv2-accent);
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
  min-height:60px;
  margin-top:12px;
  padding:10px 13px;
  border-color:var(--rv2-line);
  border-radius:12px;
  background:var(--rv2-surface);
  box-shadow:0 2px 7px rgba(15,23,42,.025);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-icon{
  width:32px;
  height:32px;
  border-radius:9px;
  background:#edf5ff;
  color:var(--rv2-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-copy strong{
  color:var(--rv2-soft);
  font-size:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-copy small{
  font-size:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
  min-width:128px;
  height:36px;
  border-color:var(--rv2-line);
  border-radius:9px;
  background:#f8fafc;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-checkout{
  grid-template-columns:minmax(0,1fr) 238px;
  gap:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-payment,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action{
  border-color:var(--rv2-line);
  border-radius:13px;
  background:var(--rv2-surface);
  box-shadow:0 2px 7px rgba(15,23,42,.025);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-payment{
  padding:15px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
  height:58px;
  grid-template-columns:28px minmax(0,1fr) 14px;
  gap:8px;
  padding:8px 9px;
  border-color:var(--rv2-line);
  border-radius:10px;
  background:var(--rv2-surface-2);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:28px;
  height:28px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>strong{
  font-size:11px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid input:checked+span{
  border-color:var(--rv2-accent);
  background:#f3f8ff;
  box-shadow:inset 0 0 0 1px rgba(59,130,246,.20);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action{
  padding:16px;
  gap:10px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action strong{
  color:#172033;
  font-size:27px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>div>span{
  color:#4c86dc;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
  height:42px;
  border-radius:9px;
  background:var(--rv2-accent-strong);
  font-size:12px;
  box-shadow:0 5px 13px rgba(37,99,235,.18);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
  padding:26px 18px;
  border-left-color:var(--rv2-line);
  background:var(--rv2-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-card{
  border-color:var(--rv2-line);
  border-radius:13px;
  background:var(--rv2-surface-2);
  box-shadow:0 2px 7px rgba(15,23,42,.025);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-icon{
  width:40px;
  height:40px;
  margin-bottom:11px;
  border-color:#dbe7f7;
  border-radius:11px;
  background:#edf5ff;
  color:var(--rv2-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card>strong{
  font-size:14px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card>p{
  margin:8px 0 14px;
  font-size:10px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card li{
  color:var(--rv2-soft);
  font-size:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>span.is-pending{
  color:#d08a19;
}

@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
    border-radius:16px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    min-height:61px;
    padding:10px 12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
    padding:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active{
    box-shadow:inset 0 -2px 0 var(--rv2-accent);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    padding:17px 12px 18px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row{
    margin-bottom:16px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row h2{
    font-size:18px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row p{
    font-size:9px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-balance{
    min-width:112px;
    padding:8px 9px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-balance strong{
    font-size:13px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section{
    margin-bottom:15px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head h3{
    font-size:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
    padding:12px 9px;
    border-radius:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
    font-size:20px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
    margin-top:6px;
    font-size:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
    min-height:54px;
    margin-top:8px;
    padding:8px 9px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-icon{
    width:27px;
    height:27px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-copy strong{
    font-size:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
    min-width:99px;
    height:32px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-checkout{
    gap:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-payment{
    padding:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
    height:49px;
    grid-template-columns:23px minmax(0,1fr) 11px;
    gap:5px;
    padding:5px 6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
    width:23px;
    height:23px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>strong{
    font-size:9px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action{
    grid-template-columns:1fr auto;
    gap:6px 10px;
    padding:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action strong{
    font-size:22px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
    width:132px;
    height:38px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
    padding:0 12px 17px;
    border-top-color:var(--rv2-line);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list{
    gap:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article{
    grid-template-columns:23px minmax(0,1fr) auto;
    gap:7px;
    padding:8px 0;
    border-top:1px solid var(--rv2-line);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article:first-child{
    padding-top:0;
    border-top:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon{
    width:23px;
    height:23px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>span{
    grid-column:auto;
    font-size:8px;
  }
}

@media (max-width:380px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{width:119px}
}

/* Online recharge workspace: one cohesive light workspace with distinct task colors. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-online){
  padding:16px;
  background:rgba(39,44,72,.42);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
  --rv2-bg:#f7f9ff;
  --rv2-surface:#ffffff;
  --rv2-surface-2:#f6f8fd;
  --rv2-surface-3:#edf0f8;
  --rv2-line:#e4e8f2;
  --rv2-line-strong:#cbd2e4;
  --rv2-text:#202536;
  --rv2-soft:#4c5368;
  --rv2-muted:#8a92a8;
  --rv2-accent:#6676f1;
  --rv2-accent-strong:#5b65e8;
  --rv2-accent-soft:#eef0ff;
  --rv2-success:#36b978;
  --rv2-gold:#f19a52;
  --rv2-gold-strong:#df7c32;
  --rv2-gold-soft:#fff1e6;
  position:relative;
  width:min(1400px,calc(100vw - 32px));
  height:min(900px,calc(100dvh - 32px));
  max-height:calc(100dvh - 32px);
  border-color:#e7eaf3;
  border-radius:20px;
  background:#fff;
  box-shadow:0 28px 80px rgba(38,45,84,.25),0 0 0 1px rgba(255,255,255,.72);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
  position:absolute;
  top:0;
  right:0;
  left:196px;
  z-index:5;
  min-height:80px;
  padding:14px 28px;
  border-bottom-color:#edf0f6;
  background:rgba(255,255,255,.96);
  box-shadow:0 8px 24px rgba(72,82,129,.035);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand-mark{
  width:42px;
  height:42px;
  border-color:#e0e5fb;
  border-radius:8px;
  background:#eef1ff;
  color:#6676f1;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand strong{
  color:#202536;
  font-size:20px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand small{
  color:#9098ab;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head-status{
  margin-left:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#8a92a8;
  font-size:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-close{
  width:36px;
  height:36px;
  border-color:#e3e7f0;
  border-radius:8px;
  background:#f7f9fd;
  color:#5d6578;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-close:hover{
  border-color:#cfd5e4;
  background:#eef1f7;
  color:#202536;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
  min-height:100%;
  grid-template-columns:196px minmax(0,1fr);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
  gap:12px;
  padding:96px 18px 20px;
  border-right:0;
  background:linear-gradient(180deg,#6d82f4 0%,#8496f5 46%,#b8c2fa 100%);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button{
  min-height:94px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 10px;
  border:0;
  border-radius:8px;
  color:rgba(255,255,255,.9);
  text-align:center;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:hover{
  background:rgba(255,255,255,.14);
  color:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active{
  border-color:transparent;
  background:#fff;
  color:#5f6de2;
  box-shadow:0 12px 28px rgba(57,68,148,.2);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button>span{
  width:44px;
  height:44px;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.16);
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button strong{
  font-size:14px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button small{
  display:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active small{
  color:#8b93b5;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-gift{
  min-height:184px;
  padding:12px 10px 16px;
  border-color:rgba(255,255,255,.42);
  background:rgba(255,255,255,.58);
  box-shadow:0 12px 28px rgba(72,79,152,.12);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance{
  padding:11px 10px;
  border-color:rgba(255,255,255,.46);
  background:rgba(255,255,255,.72);
  box-shadow:0 8px 20px rgba(57,68,148,.12);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance>span{
  background:#eef1ff;
  color:#6676e8;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance small{color:#7e87a8}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance strong{
  color:#4f5dba;
  font-size:15px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance em{color:#7e87a8}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
  grid-template-columns:minmax(0,1fr) 330px;
  align-items:stretch;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
  padding-top:80px;
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  position:relative;
  display:block;
  padding:28px 32px 30px;
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row{
  position:absolute;
  top:22px;
  right:32px;
  z-index:1;
  margin:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row>div:first-child{
  display:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-eyebrow{
  color:#6676f1;
  letter-spacing:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row h2{
  color:#292638;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row p{
  color:#817b90;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-balance{
  min-width:150px;
  padding:9px 12px;
  border-color:#e2e6f1;
  border-radius:8px;
  background:#f8f9fd;
  box-shadow:inset 3px 0 0 #6676f1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-balance strong{
  color:#202536;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head h3{
  color:#202536;
  font-size:16px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head span,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-section-head>b{
  color:#817b90;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
  grid-auto-rows:116px;
  gap:14px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
  padding:17px 16px;
  border-color:#e4e8f1;
  border-radius:8px;
  background:#fff;
  box-shadow:0 7px 20px rgba(68,78,124,.055);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package:hover{
  border-color:#bfc7e7;
  background:#fff;
  box-shadow:0 12px 26px rgba(68,78,124,.1);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-recommended{
  border-color:#dfe3f0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected{
  border-color:#6676f1;
  background:linear-gradient(135deg,#6d82f4 0%,#625eea 100%);
  box-shadow:0 13px 28px rgba(91,99,221,.25);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
  color:#202536;
  font-size:29px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong i{
  color:#7e879e;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
  color:#687189;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small em{
  color:#df7c32;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>strong,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>strong i,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small em{
  color:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-tag{
  border-radius:0 8px 0 8px;
  background:#9a72f5;
  color:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-radio{
  border-color:#c4cad8;
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected .recharge-v2-radio{
  border-color:#fff;
  background:#6676f1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
  width:min(520px,100%);
  min-height:58px;
  margin-top:14px;
  border-color:#e2e6ef;
  border-radius:8px;
  background:#fff;
  box-shadow:0 7px 20px rgba(68,78,124,.05);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom:focus-within{
  border-color:#7c88ed;
  box-shadow:0 0 0 3px rgba(102,118,241,.11);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-icon{
  border-radius:8px;
  background:#eef1ff;
  color:#6676f1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-copy strong{
  color:#4c5368;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
  width:190px;
  min-width:190px;
  height:38px;
  border-color:#e1e5ee;
  border-radius:8px;
  background:#f8f9fd;
  color:#8a92a8;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-checkout{
  grid-template-columns:minmax(0,1fr);
  gap:22px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  justify-content:start;
  gap:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-payment{
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-payment .recharge-v2-icon{
  color:#9aa2b5;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
  height:78px;
  border-color:#e3e7f0;
  border-radius:8px;
  background:#fff;
  color:#40475a;
  box-shadow:0 7px 20px rgba(68,78,124,.05);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label:hover>span{
  border-color:#bbc4ec;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid input:checked+span{
  border-color:#6676f1;
  background:#f5f6ff;
  color:#313957;
  box-shadow:inset 0 0 0 1px rgba(102,118,241,.13),0 9px 22px rgba(84,94,183,.09);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>i{
  border-color:#c2c9d8;
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid input:checked+span>i{
  border-color:#6676f1;
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action{
  display:block;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>div{
  display:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
  width:100%;
  height:58px;
  border-radius:8px;
  background:linear-gradient(90deg,#7066f2 0%,#5b78f1 100%);
  font-size:15px;
  box-shadow:0 13px 28px rgba(82,92,220,.26);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button:hover:not(:disabled){
  background:linear-gradient(90deg,#7b70f5 0%,#6683f4 100%);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button:disabled{
  background:#dfe3ef;
  color:#9ba3b7;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>p{
  margin-top:12px;
  color:#a0a7b8;
  text-align:center;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
  gap:14px;
  padding:20px 18px 22px;
  border-left:0;
  background:linear-gradient(180deg,#eef3ff 0%,#f3ecff 58%,#f8f9ff 100%);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
  position:relative;
  min-width:0;
  aspect-ratio:1.18 / 1;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:0;
  border-radius:8px;
  background:radial-gradient(circle at 50% 46%,rgba(255,255,255,.98) 0%,rgba(255,255,255,.78) 45%,rgba(226,232,255,.55) 100%);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual>img{
  width:112%;
  max-width:none;
  height:112%;
  display:block;
  object-fit:contain;
  object-position:center;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual-badge{
  display:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual-badge>.recharge-v2-icon{
  width:20px;
  height:20px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual-badge>span{
  display:grid;
  gap:2px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual-badge strong{
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual-badge small{
  color:#b7b1c0;
  font-size:8px;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-card{
  padding:16px;
  border:0;
  border-radius:8px;
  box-shadow:0 10px 28px rgba(82,90,139,.075);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card{
  padding:17px;
  background:rgba(255,255,255,.82);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card>strong{
  color:#242a3b;
  font-size:15px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card>p{
  margin:9px 0 13px;
  color:#737c92;
  line-height:1.55;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card ul{
  border-top-color:#e5e8f1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card li{
  color:#616a80;
  font-size:10px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card li .recharge-v2-icon{
  color:#6676f1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-card{
  background:rgba(255,255,255,.9);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-title{
  margin-bottom:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-title button{
  padding:4px 2px 4px 6px;
  color:#6f56cf;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list{
  gap:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article{
  min-height:50px;
  padding:9px 0;
  border-top-color:#ece9f1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article strong{
  font-size:10px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article small{
  font-size:8px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>span{
  padding:3px 6px;
  border-radius:4px;
  background:#fff3d9;
  color:#a66d16;
  font-size:8px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>span.is-success{
  background:#e4f7ed;
  color:#167b59;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>span:is(.is-failed,.is-error){
  background:#fff0f1;
  color:#c2414d;
}

@media (min-width:761px) and (max-width:1180px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    left:172px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-shell{
    grid-template-columns:172px minmax(0,1fr);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    grid-template-columns:minmax(0,1fr) 286px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    padding:25px 22px 28px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
    padding:94px 12px 18px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button{
    min-height:82px;
    padding:10px 8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-online){
    padding:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online{
    width:calc(100vw - 16px);
    height:calc(100dvh - 16px);
    max-height:calc(100dvh - 16px);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-head{
    position:static;
    min-height:61px;
    padding:10px 12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-brand strong{
    font-size:15px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-scroll{
    padding-top:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
    gap:4px;
    padding:6px;
    border-bottom:0;
    background:linear-gradient(90deg,#7185f3 0%,#9eacf7 100%);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button{
    min-height:52px;
    padding:4px 3px;
    border-radius:6px;
    color:rgba(255,255,255,.9);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active{
    background:#fff;
    color:#5f6de2;
    box-shadow:0 4px 10px rgba(61,71,153,.18);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button>span{
    width:24px;
    height:24px;
    border-radius:6px;
    background:rgba(255,255,255,.72);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button strong{
    font-size:10px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance{
    grid-column:1 / -1;
    grid-template-columns:24px minmax(0,1fr);
    gap:7px;
    padding:6px 8px;
    border:0;
    border-radius:6px;
    background:rgba(255,255,255,.88);
    box-shadow:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance>span{
    width:24px;
    height:24px;
    border-radius:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance small{
    display:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance strong{
    font-size:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-content-grid{
    display:flex;
    flex-direction:column;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    width:100%;
    padding:17px 12px 18px;
    background:#fff;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-title-row{
    display:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package-grid{
    grid-auto-rows:108px;
    gap:7px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
    width:100%;
    gap:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
    width:112px;
    min-width:112px;
    height:34px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action{
    display:block;
    padding:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
    width:100%;
    height:50px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
    width:100%;
    grid-template-columns:1fr;
    gap:8px;
    padding:12px 12px 17px;
    border-left:0;
    border-top:1px solid #e4e7f1;
    background:linear-gradient(180deg,#f0f4ff 0%,#f4efff 100%);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
    display:none;
  }
}

@media (max-width:380px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
    width:100%;
  }
}

/* Recharge visual language: filled service icons, recognizable pay brands and a real gift illustration. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon{
  width:29px;
  height:29px;
  overflow:visible;
  filter:drop-shadow(0 4px 5px rgba(63,87,190,.18));
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon .feature-main{
  fill:#7765d8;
  stroke:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon .feature-shadow{
  fill:#5546b2;
  stroke:none;
  opacity:.82;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon .feature-light{
  fill:#e9e4ff;
  stroke:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon .feature-accent{
  fill:#efb453;
  stroke:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon .feature-highlight{
  fill:none;
  stroke:#fff;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.9;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon.is-crown .feature-main{
  fill:#d2a047;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon.is-crown .feature-shadow{
  fill:#a97a26;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon.is-ticket .feature-main{
  fill:#48a888;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon.is-ticket .feature-shadow{
  fill:#2f7f68;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:not(.is-active) .recharge-feature-icon .feature-main,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:not(.is-active) .recharge-feature-icon .feature-shadow{
  fill:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:not(.is-active) .recharge-feature-icon .feature-light{
  fill:rgba(255,255,255,.55);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:not(.is-active) .recharge-feature-icon .feature-accent{
  fill:#ffe0a3;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button>span{
  width:44px;
  height:44px;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.15);
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active>span{
  border-color:transparent;
  background:#eef1ff;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-gift{
  min-height:184px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
  padding:12px 10px 16px;
  overflow:hidden;
  border-color:rgba(255,255,255,.42);
  border-radius:8px;
  background:rgba(255,255,255,.58);
  box-shadow:0 12px 28px rgba(72,79,152,.12);
  text-align:center;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-gift>img{
  width:138px;
  max-width:100%;
  height:104px;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 9px 12px rgba(70,70,160,.15));
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-gift>strong{
  color:#5d68d8;
  font-size:15px;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-gift>small{
  max-width:100%;
  color:#7982a5;
  font-size:9px;
  line-height:1.35;
  white-space:normal;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon{
  position:relative;
  isolation:isolate;
  border:1px solid rgba(255,255,255,.55);
  border-radius:8px;
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 5px 11px rgba(30,64,175,.16);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon::after{
  content:"";
  position:absolute;
  inset:2px;
  z-index:-1;
  border-radius:inherit;
  background:rgba(255,255,255,.1);
  pointer-events:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-alipay{
  background:#1677ff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-wechat{
  border-radius:50%;
  background:#20c875;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 5px 11px rgba(22,163,74,.18);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-bank{
  background:#ff7d59;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 5px 11px rgba(234,88,12,.17);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-balance{
  border-radius:50%;
  background:#ffb34f;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 5px 11px rgba(217,119,6,.16);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-card{
  background:#7864ed;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 5px 11px rgba(91,65,201,.17);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-membership{
  background:#8b5cf6;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 5px 11px rgba(109,40,217,.17);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-success{
  border-radius:50%;
  background:#45c982;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),0 5px 11px rgba(22,163,74,.16);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon>svg{
  width:62%;
  height:62%;
  fill:none;
  stroke:#fff;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-wechat>svg{
  width:72%;
  height:72%;
  fill:#fff;
  stroke:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-icon.is-membership>svg{
  fill:#fff;
  stroke:#fff;
  stroke-width:1.4;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-glyph{
  color:#fff;
  font-family:"Microsoft YaHei","PingFang SC",sans-serif;
  font-size:19px;
  font-weight:900;
  line-height:1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-glyph.is-yen{
  font-size:18px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
  height:78px;
  grid-template-columns:38px minmax(0,1fr) 15px;
  gap:11px;
  padding:10px 12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:38px;
  height:38px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>strong{
  font-size:12px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article{
  grid-template-columns:30px minmax(0,1fr) auto;
  gap:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon{
  width:30px;
  height:30px;
  border-radius:8px;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon.is-wechat,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon.is-success,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon.is-balance{
  border-radius:50%;
}

@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-gift{
    display:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button>span{
    width:24px;
    height:24px;
    border:0;
    border-radius:6px;
    background:rgba(255,255,255,.14);
    box-shadow:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active>span{
    background:#eef1ff;
    box-shadow:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-feature-icon{
    width:20px;
    height:20px;
    filter:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span{
    height:58px;
    grid-template-columns:30px minmax(0,1fr) 13px;
    gap:7px;
    padding:7px 8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
    width:30px;
    height:30px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .front-pay-brand-glyph{
    font-size:15px;
  }
}

/* Reference-aligned online recharge layout. The boosted selector isolates it from source page button rules. */
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal#frontRechargeModal.is-online){
  padding:18px;
  background:rgba(36,42,70,.38);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}

html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online{
  width:min(1160px,calc(100vw - 36px));
  height:min(760px,calc(100dvh - 36px));
  max-height:calc(100dvh - 36px);
  border:1px solid rgba(220,225,240,.92);
  border-radius:18px;
  background:#fff;
  background-image:none;
  box-shadow:0 28px 76px rgba(37,44,78,.24),0 0 0 1px rgba(255,255,255,.78);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-head{
  left:164px;
  min-height:72px;
  height:72px;
  padding:12px 22px;
  border-bottom:1px solid #edf0f6;
  background:rgba(255,255,255,.98);
  box-shadow:0 7px 20px rgba(72,82,129,.035);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-brand-mark{
  width:38px;
  height:38px;
  border:1px solid #dfe4fb;
  border-radius:8px;
  background:#f0f2ff;
  color:#6874eb;
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-brand strong{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:18px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-brand small,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-head-status{
  color:#858da2;
  -webkit-text-fill-color:#858da2;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-close{
  width:34px;
  height:34px;
  border:1px solid #e0e4ee;
  border-radius:8px;
  background:#f6f7fb;
  background-image:none;
  color:#626a7e;
  -webkit-text-fill-color:#626a7e;
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-shell{
  grid-template-columns:164px minmax(0,1fr);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav{
  gap:8px;
  padding:86px 12px 16px;
  border:0;
  background:linear-gradient(180deg,#6577ee 0%,#7e90f2 52%,#b4bef8 100%);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button{
  min-height:72px;
  padding:9px 7px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  background-image:none;
  color:rgba(255,255,255,.9);
  -webkit-text-fill-color:currentColor;
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button:hover{
  background:rgba(255,255,255,.12);
  color:#fff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button.is-active{
  border-color:rgba(255,255,255,.82);
  background:#fff;
  background-image:none;
  color:#5d68df;
  -webkit-text-fill-color:#5d68df;
  box-shadow:0 10px 24px rgba(52,62,137,.18);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button>span{
  width:36px;
  height:36px;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.14);
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button.is-active>span{
  background:#eef0ff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button strong{
  color:inherit;
  -webkit-text-fill-color:currentColor;
  font-size:13px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-scroll{
  padding-top:72px;
  background:#fff;
  background-image:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
  grid-template-columns:minmax(0,1fr) 276px;
  align-items:stretch;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
  padding:20px 24px 22px;
  background:#fff;
  background-image:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-title-row{
  position:static;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin:0 0 13px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-balance{
  min-width:144px;
  padding:7px 11px;
  border:1px solid #e1e5f0;
  border-radius:8px;
  background:#f7f8fd;
  background-image:none;
  box-shadow:inset 3px 0 0 #6874ee;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-balance strong{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:15px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-section{
  margin-bottom:14px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-section-head{
  margin-bottom:10px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-section-head h3{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:15px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-section-head span{
  color:#838ba0;
  -webkit-text-fill-color:#838ba0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package-grid{
  grid-auto-rows:100px;
  gap:12px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package{
  min-height:0;
  padding:14px;
  border:1px solid #e1e5ef;
  border-radius:8px;
  background:#fff;
  background-image:none;
  color:#202538;
  -webkit-text-fill-color:currentColor;
  box-shadow:0 6px 17px rgba(55,65,105,.055);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package:hover{
  border-color:#bac3e7;
  background:#fbfbff;
  box-shadow:0 10px 22px rgba(62,72,119,.09);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-recommended{
  border-color:#d9def0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected{
  border-color:#645ee9;
  background:linear-gradient(135deg,#7180f3 0%,#655fe9 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 12px 25px rgba(88,92,214,.24);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>strong{
  color:#202538;
  -webkit-text-fill-color:#202538;
  font-size:26px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>strong i{
  color:#7c8499;
  -webkit-text-fill-color:#7c8499;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>small{
  color:#697186;
  -webkit-text-fill-color:#697186;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>small em{
  color:#df7f38;
  -webkit-text-fill-color:#df7f38;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected>strong,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected>strong i,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected>small,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected>small em{
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-tag{
  background:#9a6ef0;
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-radio{
  border-color:#c8cedc;
  background:#fff;
  background-image:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected .recharge-v2-radio{
  border:4px solid #fff;
  background:#6765ec;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom{
  width:100%;
  min-height:56px;
  margin-top:12px;
  padding:8px 11px;
  border:1px solid #e1e5ef;
  border-radius:8px;
  background:#fff;
  background-image:none;
  box-shadow:0 6px 17px rgba(55,65,105,.05);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-icon{
  background:#eef0ff;
  color:#6571e9;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy strong{
  color:#42495d;
  -webkit-text-fill-color:#42495d;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy small{
  color:#848ca0;
  -webkit-text-fill-color:#848ca0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input{
  width:178px;
  min-width:178px;
  height:36px;
  border:1px solid #e1e5ee;
  border-radius:8px;
  background:#f7f8fc;
  color:#858da1;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-checkout{
  gap:14px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-payment,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-action{
  border:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span{
  height:64px;
  grid-template-columns:34px minmax(0,1fr) 14px;
  gap:9px;
  padding:8px 11px;
  border:1px solid #e0e4ee;
  border-radius:8px;
  background:#fff;
  background-image:none;
  color:#3f4659;
  -webkit-text-fill-color:currentColor;
  box-shadow:0 6px 17px rgba(55,65,105,.05);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid input:checked+span{
  border-color:#6974ee;
  background:#f3f4ff;
  color:#313854;
  box-shadow:inset 0 0 0 1px rgba(101,113,233,.11),0 7px 18px rgba(79,88,177,.08);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:34px;
  height:34px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span>strong{
  color:inherit;
  -webkit-text-fill-color:currentColor;
  font-size:12px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-action>button{
  width:100%;
  height:50px;
  border:0;
  border-radius:8px;
  background:linear-gradient(90deg,#7167f0 0%,#5a78ee 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 11px 24px rgba(79,89,211,.23);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-action>p{
  margin-top:9px;
  color:#9aa1b2;
  -webkit-text-fill-color:#9aa1b2;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
  gap:10px;
  padding:16px 14px 18px;
  border:0;
  background:linear-gradient(180deg,#edf2ff 0%,#f1ecff 56%,#f7f8ff 100%);
  background-image:linear-gradient(180deg,#edf2ff 0%,#f1ecff 56%,#f7f8ff 100%);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual{
  height:210px;
  min-height:210px;
  aspect-ratio:auto;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.86);
  background-image:none;
  box-shadow:0 8px 22px rgba(73,82,132,.06);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual>img{
  width:106%;
  height:106%;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-card{
  padding:13px;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.9);
  background-image:none;
  box-shadow:0 8px 22px rgba(73,82,132,.065);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card>strong,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title strong{
  color:#252b3d;
  -webkit-text-fill-color:#252b3d;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card>p{
  margin:7px 0 10px;
  color:#70798f;
  -webkit-text-fill-color:#70798f;
  line-height:1.45;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card ul{
  gap:7px;
  padding-top:10px;
  border-top:1px solid #e5e8f1;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card li{
  color:#5f687e;
  -webkit-text-fill-color:#5f687e;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title{
  margin-bottom:8px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title small{
  color:#858da1;
  -webkit-text-fill-color:#858da1;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title button{
  border:0;
  background:transparent;
  background-image:none;
  color:#6958d5;
  -webkit-text-fill-color:#6958d5;
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article{
  min-height:44px;
  padding:7px 0;
  border-top:1px solid #e8e9f0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article strong{
  color:#434a5d;
  -webkit-text-fill-color:#434a5d;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article small{
  color:#8a91a2;
  -webkit-text-fill-color:#8a91a2;
}

@media (min-width:761px) and (max-width:1180px){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-head{
    left:152px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-shell{
    grid-template-columns:152px minmax(0,1fr);
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
    grid-template-columns:minmax(0,1fr) 250px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
    padding-right:20px;
    padding-left:20px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav{
    padding-right:10px;
    padding-left:10px;
  }
}

@media (max-width:760px){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal#frontRechargeModal.is-online){
    padding:8px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online{
    width:calc(100vw - 16px);
    height:calc(100dvh - 16px);
    max-height:calc(100dvh - 16px);
    border-radius:14px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-head{
    position:static;
    min-height:61px;
    height:61px;
    padding:9px 11px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-shell{
    display:flex;
    flex-direction:column;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-scroll{
    padding-top:0;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px;
    padding:6px;
    background:linear-gradient(90deg,#687bf0 0%,#98a7f5 100%);
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button{
    min-height:52px;
    padding:4px 3px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button>span{
    width:24px;
    height:24px;
    border-radius:6px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button strong{
    font-size:10px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
    display:flex;
    flex-direction:column;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
    width:100%;
    padding:16px 12px 18px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-title-row{
    display:none;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package-grid{
    grid-auto-rows:100px;
    gap:7px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package{
    padding:10px 8px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>strong{
    font-size:20px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input{
    width:112px;
    min-width:112px;
    height:34px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span{
    height:58px;
    grid-template-columns:30px minmax(0,1fr) 13px;
    gap:7px;
    padding:7px 8px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
    width:30px;
    height:30px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-action>button{
    height:48px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
    width:100%;
    grid-template-columns:1fr;
    padding:11px 12px 16px;
    border-top:1px solid #e4e7f1;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual{
    display:none;
  }
}

/* Recharge right rail acceptance pass: clearer information hierarchy and amount-only records. */
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
  grid-template-columns:minmax(0,1fr) 300px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
  min-width:0;
  grid-template-rows:184px 68px 166px minmax(174px,1fr);
  align-content:stretch;
  gap:11px;
  padding:15px;
  border-left:1px solid #e5e9f1;
  background:#f4f7fb;
  background-image:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual{
  height:184px;
  min-height:184px;
  overflow:hidden;
  border:1px solid #dfe6f0;
  border-radius:8px;
  background:#edf4ff;
  background-image:none;
  box-shadow:0 8px 20px rgba(50,70,110,.07);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual>img{
  width:96%;
  height:96%;
  object-fit:contain;
  filter:drop-shadow(0 10px 14px rgba(44,75,132,.13));
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual-badge{
  left:10px;
  right:auto;
  bottom:10px;
  min-height:42px;
  gap:8px;
  padding:6px 9px;
  border:1px solid rgba(206,218,236,.94);
  border-radius:8px;
  background:rgba(255,255,255,.94);
  color:#4e6fd8;
  box-shadow:0 7px 18px rgba(46,65,102,.11);
  backdrop-filter:blur(8px);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual-badge>.recharge-v2-icon{
  width:20px;
  height:20px;
  stroke-width:2.2;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual-badge strong{
  color:#273248;
  -webkit-text-fill-color:#273248;
  font-size:11px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual-badge small{
  color:#748096;
  -webkit-text-fill-color:#748096;
  font-size:9px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance{
  min-height:68px;
  gap:11px;
  padding:10px 12px;
  border:1px solid #dfe5ee;
  border-radius:8px;
  background:#fff;
  background-image:none;
  box-shadow:0 7px 18px rgba(48,59,92,.055);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance>span{
  width:40px;
  height:40px;
  border:1px solid #dce5fb;
  border-radius:8px;
  background:#edf3ff;
  color:#4f6fe5;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance>span .recharge-v2-icon{
  width:21px;
  height:21px;
  stroke-width:2.1;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance small{
  color:#707b90;
  -webkit-text-fill-color:#707b90;
  font-size:11px;
  font-weight:800;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance strong{
  margin-top:2px;
  color:#1f293d;
  -webkit-text-fill-color:#1f293d;
  font-size:22px;
  line-height:1.05;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance em{
  color:#69758b;
  -webkit-text-fill-color:#69758b;
  font-size:11px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-card{
  min-width:0;
  padding:14px;
  border:1px solid #e0e5ed;
  border-radius:8px;
  background:#fff;
  background-image:none;
  box-shadow:0 7px 18px rgba(48,59,92,.05);
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card{
  padding:13px 14px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-guide-heading,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-heading{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-guide-heading>span,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-heading>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  border:1px solid #dce5fb;
  border-radius:8px;
  background:#edf3ff;
  color:#4e6fe4;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-guide-heading>span .recharge-v2-icon,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-heading>span .recharge-v2-icon{
  width:19px;
  height:19px;
  stroke-width:2.15;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-guide-heading>div,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-heading>div{
  min-width:0;
  display:grid;
  gap:2px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-guide-heading strong,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-heading strong{
  color:#252e42;
  -webkit-text-fill-color:#252e42;
  font-size:14px;
  font-weight:900;
  line-height:1.2;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-guide-heading small,html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-heading small{
  overflow:hidden;
  color:#7a8599;
  -webkit-text-fill-color:#7a8599;
  font-size:10px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card>p{
  margin:10px 0 11px;
  color:#4f5b70;
  -webkit-text-fill-color:#4f5b70;
  font-size:12px;
  font-weight:600;
  line-height:1.55;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card ul{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  padding-top:10px;
  border-top:1px solid #e7eaf0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card li{
  min-width:0;
  display:grid;
  justify-items:center;
  align-content:start;
  gap:5px;
  color:#505c72;
  -webkit-text-fill-color:#505c72;
  font-size:9px;
  font-weight:700;
  line-height:1.3;
  text-align:center;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card li .recharge-v2-icon{
  width:18px;
  height:18px;
  padding:4px;
  box-sizing:content-box;
  border-radius:7px;
  background:#edf3ff;
  color:#4f70e4;
  stroke-width:2.1;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:9px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title>.recharge-v2-record-heading{
  flex:1 1 auto;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title button{
  min-height:28px;
  display:inline-flex;
  align-items:center;
  gap:3px;
  flex:0 0 auto;
  padding:4px 7px;
  border:1px solid #dfe5f0;
  border-radius:7px;
  background:#f7f9fc;
  color:#536fd5;
  -webkit-text-fill-color:#536fd5;
  font-size:10px;
  font-weight:800;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title button span{
  font-size:15px;
  line-height:1;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list{
  min-width:0;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article{
  min-width:0;
  min-height:48px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:8px 0;
  border-top:1px solid #e7eaf0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article:first-child{
  border-top:0;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>.front-pay-brand-icon{
  width:32px;
  height:32px;
  border-radius:8px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>div{
  min-width:0;
  display:grid;
  gap:3px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article strong{
  overflow:hidden;
  color:#2b3448;
  -webkit-text-fill-color:#2b3448;
  font-size:12px;
  font-weight:850;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article small{
  overflow:hidden;
  color:#8790a2;
  -webkit-text-fill-color:#8790a2;
  font-size:9px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}


html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>span{
  grid-column:auto;
  min-width:46px;
  padding:4px 6px;
  border-radius:6px;
  background:#fff6df;
  color:#b77912;
  -webkit-text-fill-color:#b77912;
  font-size:9px;
  font-weight:850;
  line-height:1;
  text-align:center;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>span.is-success{
  background:#eaf8f0;
  color:#258657;
  -webkit-text-fill-color:#258657;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>span.is-refund{
  background:#eef2f7;
  color:#667085;
  -webkit-text-fill-color:#667085;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-empty{
  min-height:88px;
  display:grid;
  place-items:center;
  color:#7d879a;
  -webkit-text-fill-color:#7d879a;
  font-size:11px;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .front-pay-brand-icon{
  overflow:hidden;
  border:0;
  box-shadow:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .front-pay-brand-icon::after{
  display:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .front-pay-brand-icon.is-alipay{
  border-radius:8px;
  background:#1677ff;
  color:#fff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .front-pay-brand-icon.is-alipay>.front-pay-alipay-mark{
  width:78%;
  height:78%;
  fill:#fff;
  stroke:none;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .front-pay-brand-icon.is-wechat{
  border-radius:50%;
  background:#07c160;
  color:#fff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .front-pay-brand-icon.is-wechat>svg{
  width:76%;
  height:76%;
  fill:#fff;
}
html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:38px;
  height:38px;
  flex-basis:38px;
}

@media (min-width:761px) and (max-width:1180px){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
    grid-template-columns:minmax(0,1fr) 276px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
    padding:13px;
  }
}

@media (max-width:760px){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
    display:flex;
    flex-direction:column;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:150px 66px auto auto;
    gap:9px;
    padding:12px;
    border-top:1px solid #e3e8f0;
    border-left:0;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual{
    display:block;
    height:150px;
    min-height:150px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual>img{
    width:90%;
    height:90%;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card{
    padding:14px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card>p{
    font-size:13px;
    line-height:1.6;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card li{
    font-size:10px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-card{
    padding:14px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list{
    grid-template-columns:1fr;
  }
}

/* Recharge visual refinement: calmer colors, readable guidance and cleaner records. */
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online{
  width:min(1180px,calc(100vw - 36px));
  height:min(840px,calc(100dvh - 36px));
  overflow:hidden;
  border-color:#dce3ee;
  background:#fff;
  box-shadow:0 28px 72px rgba(31,42,68,.22),0 0 0 1px rgba(255,255,255,.85);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-shell{
  min-height:0;
  overflow:hidden;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-scroll{
  min-height:0;
  overflow:hidden;
  overscroll-behavior:none;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-scroll::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-head{
  border-bottom-color:#e7ebf2;
  background:#fff;
  box-shadow:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav{
  background:linear-gradient(180deg,#5570df 0%,#7188e8 58%,#9aabea 100%);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button{
  color:rgba(255,255,255,.96);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav>button.is-active{
  border-color:#fff;
  color:#4f63cf;
  box-shadow:0 10px 22px rgba(31,47,113,.18);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
  background:#f8faff;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
  grid-template-columns:minmax(0,1fr) 310px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
  grid-template-rows:184px minmax(160px,auto) minmax(196px,1fr);
  gap:10px;
  padding:14px;
  border-left:1px solid #e3e8f0;
  background:#f2f5fa;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual{
  height:184px;
  min-height:184px;
  border-color:#dfe6ef;
  background:linear-gradient(145deg,#edf3ff 0%,#f8faff 54%,#edf8f8 100%);
  box-shadow:0 8px 20px rgba(42,61,96,.07),inset 0 1px 0 rgba(255,255,255,.72);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual>img{
  width:96%;
  height:96%;
  object-fit:contain;
  filter:none;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance,html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-card{
  border-color:#dfe5ed;
  background:#fff;
  box-shadow:0 5px 14px rgba(42,55,82,.045);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance{
  min-height:72px;
  padding:11px 13px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-balance>span,html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading)>span{
  border-color:#d9e3f4;
  background:#edf3fb;
  color:#486bce;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card{
  min-height:160px;
  padding:15px 15px 14px;
  overflow:hidden;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading)>span{
  width:38px;
  height:38px;
  flex-basis:38px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading)>span .recharge-v2-icon{
  width:21px;
  height:21px;
  stroke-width:2.25;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading) strong{
  color:#1f293b;
  -webkit-text-fill-color:#1f293b;
  font-size:16px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading) small{
  color:#748096;
  -webkit-text-fill-color:#748096;
  font-size:11px;
  line-height:1.35;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card>p{
  margin:12px 0;
  color:#46546a;
  -webkit-text-fill-color:#46546a;
  font-size:14px;
  font-weight:650;
  line-height:1.65;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card ul{
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
  padding-top:11px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card li{
  min-height:28px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  justify-items:start;
  gap:9px;
  color:#445168;
  -webkit-text-fill-color:#445168;
  font-size:13px;
  font-weight:700;
  line-height:1.45;
  text-align:left;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card li .recharge-v2-icon{
  width:17px;
  height:17px;
  padding:5px;
  border-radius:7px;
  background:#edf3fb;
  color:#4f70d5;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-card{
  min-height:196px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:7px;
  padding:14px 15px;
  overflow:hidden;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title{
  margin-bottom:0;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list{
  min-height:0;
  align-self:stretch;
  align-content:start;
  overflow:hidden;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside-title button{
  min-height:30px;
  color:#4968cc;
  -webkit-text-fill-color:#4968cc;
  font-size:11px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article{
  min-height:50px;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:10px;
  padding:7px 0;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>.front-pay-brand-icon{
  width:34px;
  height:34px;
  min-width:34px;
  max-width:34px;
  flex-basis:34px;
  border-radius:8px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article strong{
  color:#273247;
  -webkit-text-fill-color:#273247;
  font-size:13px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article small{
  color:#7d8798;
  -webkit-text-fill-color:#7d8798;
  font-size:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-list article>span{
  min-width:48px;
  padding:5px 7px;
  font-size:10px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid label>span{
  border-color:#dce3ed;
  box-shadow:0 5px 14px rgba(42,55,82,.04);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-pay-grid input:checked+span{
  border-color:#5c73dc;
  background:#f3f6ff;
  box-shadow:inset 0 0 0 1px rgba(81,103,204,.10),0 7px 18px rgba(69,88,171,.08);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-action>button{
  background:linear-gradient(90deg,#5d69de 0%,#4f78df 100%);
  box-shadow:0 10px 22px rgba(64,84,186,.22);
}

@media (min-width:761px) and (max-width:1180px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
    grid-template-columns:minmax(0,1fr) 288px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
    grid-template-rows:164px minmax(160px,auto) minmax(196px,1fr);
    padding:12px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-visual{
    height:164px;
    min-height:164px;
  }
}

@media (max-width:760px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online{
    width:calc(100vw - 16px);
    height:calc(100dvh - 16px);
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal .account-service-nav{
    flex:0 0 auto;
    grid-template-rows:52px 38px;
    padding:6px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-scroll{
    flex:1 1 0;
    height:auto;
    padding-top:0;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-content-grid{
    height:100%;
    min-height:0;
    overflow:hidden;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
    height:100%;
    min-height:0;
    overflow:hidden;
    padding:10px 12px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-section{
    margin-bottom:10px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-section-head{
    margin-bottom:8px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-auto-rows:92px;
    gap:8px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package{
    min-height:92px;
    padding:11px 10px 10px;
    border-radius:10px;
    justify-content:center;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-aside{
    display:none;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-wallet-card{
    min-height:0;
    padding:15px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-record-card{
    min-height:0;
  }
}

@media (max-width:760px) and (max-height:800px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-main{
    padding-top:8px;
    padding-bottom:8px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package-grid{
    grid-auto-rows:86px;
    gap:7px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package{
    min-height:86px;
    padding:8px 9px;
  }
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark{
  top:-1px;
  right:-1px;
  min-width:56px;
  height:25px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  overflow:hidden;
  padding:0 9px;
  border:0;
  border-radius:0 8px 0 11px;
  background:linear-gradient(135deg,#7762df 0%,#469fda 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 6px 14px rgba(79,86,187,.22);
  font-size:11px;
  font-weight:900;
  line-height:1;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark::before{
  content:"";
  position:static;
  width:5px;
  height:5px;
  flex:0 0 auto;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.18);
  animation:rechargeActivityBadgePulseV2 1.9s ease-in-out infinite;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark::after{
  content:"";
  position:absolute;
  top:-10px;
  left:-28px;
  width:16px;
  height:46px;
  background:rgba(255,255,255,.3);
  transform:rotate(22deg);
  animation:rechargeActivityBadgeSweepV2 2.8s ease-in-out infinite;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>small em{
  display:inline-flex;
  align-items:center;
  margin-left:5px;
  padding:3px 6px;
  border-radius:5px;
  background:linear-gradient(135deg,#efeaff 0%,#e6f4ff 100%);
  color:#6556c7;
  -webkit-text-fill-color:#6556c7;
  font-size:10px;
  font-weight:850;
  line-height:1;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.is-selected>small em{
  background:rgba(255,255,255,.18);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom{
  min-height:68px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 190px;
  align-items:center;
  gap:12px;
  margin-top:12px;
  padding:9px 11px;
  border:1px solid #dce3ee;
  border-radius:9px;
  background:#fff;
  background-image:none;
  box-shadow:0 7px 18px rgba(49,62,91,.055);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom:focus-within{
  border-color:#7888df;
  background:#fcfdff;
  box-shadow:0 0 0 3px rgba(91,112,211,.1),0 8px 20px rgba(49,62,91,.06);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  overflow:visible;
  border:1px solid #dce4f5;
  border-radius:10px;
  background:#eef3ff;
  color:#5a72d9;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art{width:39px;height:39px;display:block;overflow:visible}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-coin{fill:#f2bd55;stroke:#fff5d5;stroke-width:2}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-plus{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-card{fill:#fff;stroke:#cfd9ee;stroke-width:1.5}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-wallet{fill:#6078dd}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-wallet-line{fill:none;stroke:#a8dce0;stroke-width:3;stroke-linecap:round}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-clasp{fill:#fff;stroke:#d7deef;stroke-width:1.5}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-dot{fill:#6078dd}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy{
  min-width:0;
  display:grid;
  gap:4px;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy strong{
  color:#263248;
  -webkit-text-fill-color:#263248;
  font-size:15px;
  font-weight:900;
  line-height:1.2;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy small{
  color:#6e798e;
  -webkit-text-fill-color:#6e798e;
  font-size:12px;
  font-weight:650;
  line-height:1.35;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input{
  width:190px;
  min-width:190px;
  height:42px;
  margin-left:0;
  padding:0 10px;
  border:1px solid #d9e1ec;
  border-radius:8px;
  background:#f3f6fb;
  color:#66738b;
  box-shadow:inset 0 1px 2px rgba(41,56,84,.035);
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input:focus-within{
  border-color:#7787dd;
  background:#fff;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input i{
  color:#64718a;
  -webkit-text-fill-color:#64718a;
  font-size:14px;
  font-weight:850;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input input{
  color:#263248;
  -webkit-text-fill-color:#263248;
  font-size:14px;
  font-weight:800;
}
html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input input::placeholder{
  color:#8a95a8;
  -webkit-text-fill-color:#8a95a8;
}

@keyframes rechargeActivityBadgePulseV2{
  0%,100%{opacity:.65;transform:scale(.82)}
  50%{opacity:1;transform:scale(1)}
}
@keyframes rechargeActivityBadgeSweepV2{
  0%,58%{left:-28px;opacity:0}
  67%{opacity:1}
  86%,100%{left:76px;opacity:0}
}

@media (max-width:760px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom{
    height:62px;
    min-height:62px;
    grid-template-columns:38px minmax(0,1fr) 110px;
    gap:8px;
    margin-top:8px;
    padding:6px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-icon{
    width:38px;
    height:38px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art{
    width:33px;
    height:33px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy strong{
    font-size:13px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-copy small{
    font-size:10px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-custom-input{
    width:110px;
    min-width:110px;
    height:36px;
    padding:0 7px;
  }
}

@media (prefers-reduced-motion:reduce){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-activity-mark::before,body:not(.page-admin) [data-front-app-public-root] .recharge-v2-activity-mark::after{
    animation:none;
  }
}
@keyframes rechargeActivityToken{
  0%,100%{transform:translateY(0) rotate(0)}
  50%{transform:translateY(-3px) rotate(2deg)}
}
@keyframes rechargeCampaignTokenV3{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-3px)}
}

/* Shared account-service gift card: contained 3D reward scene and reference layout. */
html body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard{
  position:relative;
  box-sizing:border-box;
  min-height:184px;
  height:184px;
  flex:0 0 184px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:0;
  margin-top:auto;
  padding:8px 8px 11px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.78);
  border-radius:10px;
  background:linear-gradient(180deg,#dce4ff 0%,#edf1ff 58%,#f8f9ff 100%);
  box-shadow:0 12px 28px rgba(70,78,157,.16),inset 0 1px 0 rgba(255,255,255,.72);
  isolation:isolate;
  text-align:center;
}
html body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard::after{
  content:"";
  position:absolute;
  z-index:0;
  left:7px;
  right:7px;
  bottom:7px;
  height:57px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:10px;
  background:rgba(255,255,255,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
html body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>img{
  position:relative;
  z-index:1;
  top:auto;
  left:auto;
  width:124px;
  max-width:124px;
  height:105px;
  flex:0 0 105px;
  margin:-3px 0 0;
  object-fit:contain;
  object-position:center;
  transform:none;
  filter:drop-shadow(0 8px 10px rgba(76,58,166,.16));
}
html body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>strong{
  position:relative;
  z-index:1;
  margin:1px 0 0;
  color:#6658da;
  -webkit-text-fill-color:#6658da;
  font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:15px;
  font-weight:800;
  line-height:20px;
  letter-spacing:0;
  white-space:nowrap;
}
html body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>small{
  position:relative;
  z-index:1;
  max-width:112px;
  min-height:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  margin:4px 0 0;
  overflow:hidden;
  color:#8791b5;
  -webkit-text-fill-color:#8791b5;
  font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  font-size:9px;
  font-weight:500;
  line-height:15px;
  letter-spacing:0;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>small::after{
  content:"\203A ";
  width:12px;
  height:12px;
  flex:0 0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#8994e7;
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:10px;
  font-weight:800;
  line-height:12px;
}

/* Recharge public component: complete dark-theme compatibility. */
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer{
  background:rgba(2,6,14,.78);
  color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal{
  --rv2-bg:#101722;
  --rv2-surface:#182131;
  --rv2-surface-2:#1d293b;
  --rv2-surface-3:#253247;
  --rv2-line:rgba(148,163,184,.20);
  --rv2-line-strong:rgba(160,176,199,.38);
  --rv2-text:#f3f6fb;
  --rv2-soft:#d8e0ec;
  --rv2-muted:#96a4b8;
  --rv2-accent:#8092ff;
  --rv2-accent-strong:#6478ed;
  --rv2-accent-soft:rgba(128,146,255,.15);
  --rv2-success:#42d3a0;
  --rv2-gold:#f1c96b;
  --rv2-gold-strong:#d9a93f;
  --rv2-gold-soft:rgba(241,201,107,.13);
  border-color:#2a3548;
  background:#101722;
  background-image:none;
  color:#f3f6fb;
  box-shadow:0 32px 90px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.035);
  color-scheme:dark;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-head{
  border-bottom-color:#29364a;
  background:#151d2b;
  color:#f3f6fb;
  box-shadow:0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal :is(.recharge-v2-brand strong,.recharge-v2-section-head h3,.recharge-v2-title-row h2){
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal :is(.recharge-v2-brand small,.recharge-v2-section-head span,.recharge-v2-section-head>b,.recharge-v2-title-row p){
  color:#96a4b8;
  -webkit-text-fill-color:#96a4b8;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-brand-mark{
  border-color:rgba(128,146,255,.34);
  background:#202b48;
  color:#9dacff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-head-status{
  color:#55d6aa;
  -webkit-text-fill-color:#55d6aa;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-close{
  border-color:#303d51;
  background:#202a3a;
  color:#aeb9ca;
  -webkit-text-fill-color:#aeb9ca;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-close:hover{
  border-color:#52627a;
  background:#29364a;
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-shell{
  background:#101722;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
  border-color:#29364a;
  background:linear-gradient(180deg,#1a2333 0%,#151d2a 58%,#121925 100%);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.018);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button{
  border-color:transparent;
  background:transparent;
  color:#aab6c8;
  -webkit-text-fill-color:#aab6c8;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:hover{
  background:#202a3b;
  color:#e5eaf3;
  -webkit-text-fill-color:#e5eaf3;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active{
  border-color:rgba(128,146,255,.42);
  background:linear-gradient(135deg,#2b365d 0%,#242e50 100%);
  color:#eef0ff;
  -webkit-text-fill-color:#eef0ff;
  box-shadow:inset 3px 0 0 #8d9cff,0 10px 22px rgba(0,0,0,.18);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:nth-child(2).is-active{
  border-color:rgba(241,201,107,.38);
  background:linear-gradient(135deg,#3b3325 0%,#2c291f 100%);
  color:#ffe6a3;
  -webkit-text-fill-color:#ffe6a3;
  box-shadow:inset 3px 0 0 #e0b957,0 10px 22px rgba(0,0,0,.18);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button>span{
  background:#222d40;
  color:inherit;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button small{
  color:#8290a5;
  -webkit-text-fill-color:#8290a5;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance{
  border-color:#303d51;
  background:#1b2535;
  color:#d8e0ec;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance>span{
  background:#263250;
  color:#9dacff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance :is(small,em){
  color:#8d9aae;
  -webkit-text-fill-color:#8d9aae;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav-balance strong{
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard{
  border-color:rgba(142,155,217,.24);
  background:linear-gradient(180deg,#262c4b 0%,#222842 58%,#1b2234 100%);
  box-shadow:0 14px 30px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard::after{
  border-color:rgba(151,164,222,.16);
  background:rgba(14,20,34,.54);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>strong{
  color:#b4adff;
  -webkit-text-fill-color:#b4adff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>small{
  color:#9ba6c9;
  -webkit-text-fill-color:#9ba6c9;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] #accountServiceGiftCard>small::after{
  background:#7e8be5;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-scroll{
  background:#101722;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  background:#101722;
  color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
  border-left-color:#29364a;
  border-top-color:#29364a;
  background:#0d141f;
  color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-visual{
  border-color:#2b394d;
  background:linear-gradient(145deg,#1a2535 0%,#151d2b 100%);
  box-shadow:0 8px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online :is(.recharge-v2-aside-balance,.recharge-v2-aside-card){
  border-color:#2b384b;
  background:#182131;
  color:#f3f6fb;
  box-shadow:0 7px 18px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-balance>span{
  border-color:rgba(128,146,255,.26);
  background:#242f4e;
  color:#a9b5ff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading) strong{
  color:#eef2f8;
  -webkit-text-fill-color:#eef2f8;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online :is(.recharge-v2-guide-heading,.recharge-v2-record-heading) small{
  color:#91a0b5;
  -webkit-text-fill-color:#91a0b5;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card>p{
  color:#c3ccda;
  -webkit-text-fill-color:#c3ccda;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card ul{
  border-top-color:#2c394c;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card li{
  color:#bec8d7;
  -webkit-text-fill-color:#bec8d7;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-wallet-card li .recharge-v2-icon{
  background:#24304d;
  color:#a3b0ff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside-title button{
  color:#9dacff;
  -webkit-text-fill-color:#9dacff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article{
  border-top-color:#2b384b;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article strong{
  color:#e3e9f2;
  -webkit-text-fill-color:#e3e9f2;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article small{
  color:#93a1b5;
  -webkit-text-fill-color:#93a1b5;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-record-empty,
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-empty{
  border-color:#3b485b;
  background:rgba(255,255,255,.015);
  color:#96a4b8;
  -webkit-text-fill-color:#96a4b8;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package{
  border-color:#2d3a4e;
  background:#182131;
  color:#f3f6fb;
  box-shadow:0 5px 14px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.02);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package:hover{
  border-color:#52627b;
  background:#202b3d;
  box-shadow:0 9px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.03);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected{
  border-color:#8796ff;
  background:linear-gradient(145deg,#4e5fc5 0%,#3f52b2 100%);
  color:#fff;
  box-shadow:0 10px 24px rgba(48,62,153,.34),inset 0 1px 0 rgba(255,255,255,.13);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong{
  color:#f5f7fb;
  -webkit-text-fill-color:#f5f7fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>strong i{
  color:#9daabe;
  -webkit-text-fill-color:#9daabe;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small{
  color:#aebdf0;
  -webkit-text-fill-color:#aebdf0;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected :is(strong,strong i,small){
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package>small em{
  background:linear-gradient(135deg,#312d52 0%,#223b51 100%);
  color:#c6c0ff;
  -webkit-text-fill-color:#c6c0ff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.is-selected>small em{
  background:rgba(255,255,255,.16);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom{
  border-color:#2e3b4f;
  background:#182131;
  background-image:none;
  color:#f3f6fb;
  box-shadow:0 7px 18px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.02);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom:focus-within{
  border-color:#8796ff;
  background:#1b2638;
  box-shadow:0 0 0 3px rgba(128,146,255,.13),0 9px 20px rgba(0,0,0,.17);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-icon{
  border-color:#334362;
  background:#202c49;
  color:#a6b2ff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-card{
  fill:#e8edf6;
  stroke:#8898b3;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-custom-art .custom-art-clasp{
  fill:#f5f7fb;
  stroke:#8999b4;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-copy strong{
  color:#edf1f7;
  -webkit-text-fill-color:#edf1f7;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-copy small{
  color:#99a7ba;
  -webkit-text-fill-color:#99a7ba;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input{
  border-color:#354359;
  background:#111925;
  color:#a6b1c2;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.22);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input:focus-within{
  border-color:#8796ff;
  background:#0e1622;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input i{
  color:#aab5c5;
  -webkit-text-fill-color:#aab5c5;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input input{
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-custom-input input::placeholder{
  color:#74839a;
  -webkit-text-fill-color:#74839a;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal :is(.recharge-v2-payment,.recharge-v2-action){
  border-color:#2d3a4e;
  background:#182131;
  color:#f3f6fb;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-pay-grid label>span{
  border-color:#344258;
  background:#1d293b;
  color:#dbe3ee;
  -webkit-text-fill-color:#dbe3ee;
  box-shadow:0 5px 14px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.02);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-pay-grid label:hover>span{
  border-color:#53647d;
  background:#222f43;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-pay-grid input:checked+span{
  border-color:#8393ff;
  background:linear-gradient(145deg,#283554 0%,#242f4e 100%);
  color:#f5f7ff;
  -webkit-text-fill-color:#f5f7ff;
  box-shadow:inset 0 0 0 1px rgba(137,153,255,.16),0 8px 18px rgba(0,0,0,.16);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-pay-grid label>span>i{
  border-color:#607089;
  background:#111925;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-pay-grid input:checked+span>i{
  border-color:#8796ff;
  background:#f5f7ff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-action :is(small,div>span){
  color:#96a4b8;
  -webkit-text-fill-color:#96a4b8;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-action strong{
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-action>button{
  background:linear-gradient(90deg,#6b74e8 0%,#587edf 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 11px 24px rgba(62,78,183,.32);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal :is(.recharge-v2-action>button,.recharge-v2-redeem-pane button):disabled{
  background:#293548;
  color:#7f8da2;
  -webkit-text-fill-color:#7f8da2;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane{
  background:#101722;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane form:not(.redeem-reference-form){
  border-color:#303d51;
  background:#182131;
  box-shadow:0 18px 42px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane :is(h2,p){
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane p{
  color:#96a4b8;
  -webkit-text-fill-color:#96a4b8;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-icon{
  border-color:rgba(128,146,255,.34);
  background:#242f4e;
  color:#a9b5ff;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane input:not(#frontRedeemCode){
  border-color:#354359;
  background:#111925;
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.20);
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane input:not(#frontRedeemCode)::placeholder{
  color:#74839a;
  -webkit-text-fill-color:#74839a;
}
html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .recharge-v2-redeem-pane input:not(#frontRedeemCode):focus{
  border-color:#8796ff;
  box-shadow:0 0 0 3px rgba(128,146,255,.14),inset 0 1px 3px rgba(0,0,0,.18);
}

@media (max-width:760px){
  html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav{
    border-bottom-color:#29364a;
    background:#151d2a;
    box-shadow:inset 0 -1px 0 rgba(255,255,255,.018);
  }
  html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button.is-active{
    box-shadow:inset 0 -2px 0 #8d9cff;
  }
  html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal .account-service-nav>button:nth-child(2).is-active{
    box-shadow:inset 0 -2px 0 #e0b957;
  }
  html[data-theme="dark"]:not(#jnRechargeDarkA#jnRechargeDarkB#jnRechargeDarkC#jnRechargeDarkD#jnRechargeDarkE#jnRechargeDarkF#jnRechargeDarkG#jnRechargeDarkH#jnRechargeDarkI#jnRechargeDarkJ#jnRechargeDarkK#jnRechargeDarkL#jnRechargeDarkM#jnRechargeDarkN#jnRechargeDarkO#jnRechargeDarkP#jnRechargeDarkQ#jnRechargeDarkR#jnRechargeDarkS#jnRechargeDarkT) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
    background:#101722;
  }
}

/* Keep mobile activity badges independent from centered package amounts. */
@media (max-width:760px){
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>strong{
    width:100%;
    max-width:100%;
    flex:0 0 auto;
    overflow:visible;
    white-space:nowrap;
    text-overflow:clip;
    font-size:22px;
    line-height:1;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>small{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    justify-items:center;
    gap:4px;
    margin-top:6px;
    font-size:10px;
    line-height:1.1;
    white-space:nowrap;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>small>span{
    min-height:0;
    white-space:nowrap;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package>small em{
    min-height:17px;
    margin-left:0;
    padding:3px 7px;
    font-size:10px;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-activity-mark{
    top:-1px;
    right:-1px;
    min-width:48px;
    width:auto;
    height:21px;
    gap:4px;
    padding:0 7px;
    border-radius:0 9px 0 9px;
    font-size:10px;
    font-weight:850;
  }
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.has-activity>strong,
  html body[class^="page-"]:not(#jnRechargeVisualA):not(#jnRechargeVisualB):not(#jnRechargeVisualC):not(#jnRechargeVisualD):not(#jnRechargeVisualE):not(#jnRechargeVisualF):not(#jnRechargeVisualG):not(#jnRechargeVisualH):not(#jnRechargeCompactA):not(#jnRechargeCompactB):not(#jnRechargeCompactC):not(#jnRechargeCompactD):not(#jnRechargeCompactE):not(#jnRechargeCompactF):not(#jnRechargeCompactG):not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-online .recharge-v2-package.has-activity>small{
    transform:none;
  }
}

/* Member shop: one maintained implementation shared with the recharge shell. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership{
  --member-accent:#6675ea;
  --member-accent-strong:#5262dd;
  --member-accent-soft:rgba(102,117,234,.10);
  --member-cyan:#29b8cc;
  --member-gold:#e7ad46;
  --member-bg:#f4f7fb;
  --member-surface:#fff;
  --member-surface-2:#f8faff;
  --member-line:#dfe5ef;
  --member-line-strong:#c9d2e1;
  --member-text:#182238;
  --member-soft:#45536a;
  --member-muted:#7b8799;
  --member-shadow:0 14px 34px rgba(27,39,68,.10);
  width:min(1160px,calc(100vw - 48px));
  height:min(780px,calc(100dvh - 48px));
  max-height:none;
  color:var(--member-text);
  background:var(--member-bg);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-head{
  flex:0 0 74px;
  min-height:74px;
  border-bottom:1px solid var(--member-line);
  background:var(--member-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-brand-mark{
  border-color:rgba(102,117,234,.24);
  background:var(--member-accent-soft);
  color:var(--member-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.recharge-v2-brand strong,.recharge-v2-brand small,.recharge-v2-head-status){
  color:var(--member-text);
  -webkit-text-fill-color:var(--member-text);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-brand small{color:var(--member-muted);-webkit-text-fill-color:var(--member-muted)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-head-status{color:#168b78;-webkit-text-fill-color:#168b78}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-close{
  border-color:var(--member-line);
  background:var(--member-surface-2);
  color:var(--member-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-shell{
  min-height:0;
  grid-template-columns:178px minmax(0,1fr);
  background:var(--member-bg);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav{
  border-right:1px solid var(--member-line);
  background:var(--member-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button{
  color:var(--member-muted);
  -webkit-text-fill-color:var(--member-muted);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button:hover{
  background:var(--member-surface-2);
  color:var(--member-soft);
  -webkit-text-fill-color:var(--member-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button.is-active{
  border-color:rgba(102,117,234,.28);
  background:var(--member-accent-soft);
  color:var(--member-accent);
  -webkit-text-fill-color:var(--member-accent);
  box-shadow:inset 3px 0 0 var(--member-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button>span{
  background:rgba(102,117,234,.08);
  color:var(--member-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav-gift{
  border-color:var(--member-line);
  background:var(--member-surface-2);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-scroll{
  min-width:0;
  min-height:0;
  overflow:hidden;
  overscroll-behavior:none;
  background:var(--member-bg);
  scrollbar-width:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-scroll::-webkit-scrollbar{display:none}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-member-pane{
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  background:var(--member-bg);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-layout{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 268px;
  overflow:hidden;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-main{
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:154px 238px minmax(0,1fr);
  gap:14px;
  padding:16px;
  overflow:hidden;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero{
  position:relative;
  min-width:0;
  min-height:0;
  display:flex;
  align-items:center;
  overflow:hidden;
  padding:21px 250px 21px 24px;
  border:1px solid #d9dff4;
  border-radius:8px;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,255,255,.72) 0 2px,transparent 3px),
    radial-gradient(circle at 90% 68%,rgba(255,255,255,.58) 0 3px,transparent 4px),
    linear-gradient(120deg,#eef1ff 0%,#e8ecff 52%,#e1f4f7 100%);
  box-shadow:var(--member-shadow);
  isolation:isolate;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(255,255,255,.64),rgba(255,255,255,0) 62%);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#5967cf;
  font-size:9px;
  font-weight:800;
  line-height:1;
  letter-spacing:.08em;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-eyebrow .recharge-v2-icon{width:14px;height:14px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero h2{
  max-width:430px;
  margin:10px 0 0;
  color:#202b55;
  font-family:"Microsoft YaHei UI","PingFang SC","Noto Sans CJK SC",sans-serif;
  font-size:24px;
  font-weight:800;
  line-height:1.22;
  letter-spacing:0;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero p{
  max-width:430px;
  margin:9px 0 0;
  color:#63708c;
  font-size:11px;
  line-height:1.55;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current{
  max-width:100%;
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:10px;
  padding:5px 9px;
  border:1px solid rgba(102,117,234,.18);
  border-radius:6px;
  background:rgba(255,255,255,.58);
  color:#66718a;
  font-size:9px;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current span{color:#7a869c}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current strong{
  overflow:hidden;
  color:#5262ca;
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current small{color:#7a869c;white-space:nowrap}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero>img{
  position:absolute;
  right:5px;
  bottom:-14px;
  width:260px;
  height:166px;
  object-fit:contain;
  pointer-events:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plans{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  padding:15px;
  border:1px solid var(--member-line);
  border-radius:8px;
  background:var(--member-surface);
  box-shadow:0 8px 24px rgba(35,48,78,.06);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:11px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head>div{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head h3{
  margin:0;
  color:var(--member-text);
  font-size:14px;
  font-weight:800;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head span{
  display:block;
  margin-top:4px;
  color:var(--member-muted);
  font-size:9px;
  line-height:1.25;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head>b{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:5px;
  background:var(--member-accent-soft);
  color:var(--member-accent);
  font-size:9px;
  font-weight:800;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid{
  min-width:0;
  min-height:0;
  flex:1 1 auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:minmax(0,1fr);
  gap:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid.has-1{grid-template-columns:minmax(0,270px)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid.has-2{grid-template-columns:repeat(2,minmax(0,1fr))}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.member-shop-plan-grid.has-1,.member-shop-plan-grid.has-2){
  align-content:center;
  grid-auto-rows:128px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan{
  position:relative;
  min-width:0;
  min-height:76px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto 1fr;
  align-content:start;
  gap:5px 8px;
  padding:12px 13px;
  overflow:hidden;
  border:1px solid var(--member-line);
  border-radius:7px;
  outline:0;
  background:var(--member-surface-2);
  color:var(--member-text);
  text-align:left;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan:hover{
  border-color:#b8c2ee;
  background:#f5f6ff;
  transform:translateY(-1px);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan.is-selected{
  border-color:var(--member-accent);
  background:linear-gradient(145deg,#f3f4ff 0%,#eef4ff 100%);
  box-shadow:inset 0 0 0 1px rgba(102,117,234,.14),0 8px 18px rgba(82,98,221,.10);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name{
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name strong{
  overflow:hidden;
  color:var(--member-text);
  font-size:12px;
  font-weight:800;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name small{
  flex:0 0 auto;
  padding:2px 5px;
  border-radius:4px;
  background:#edf0f6;
  color:#788398;
  font-size:8px;
  line-height:1.2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price{
  grid-column:2;
  grid-row:1 / 3;
  display:flex;
  align-items:baseline;
  align-self:center;
  color:#5364db;
  line-height:1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price i{
  margin-right:2px;
  font-size:10px;
  font-style:normal;
  font-weight:700;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price strong{font-size:22px;font-weight:850}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-credit{
  grid-column:1;
  color:#56657a;
  font-size:9px;
  font-weight:700;
  line-height:1.25;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-desc{
  grid-column:1 / -1;
  align-self:end;
  overflow:hidden;
  color:#8a94a5;
  font-size:8px;
  line-height:1.3;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-check{
  position:absolute;
  right:-16px;
  bottom:-16px;
  width:36px;
  height:36px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  padding:5px 0 0 7px;
  border-radius:50%;
  background:var(--member-accent);
  color:#fff;
  font-size:10px;
  font-weight:900;
  opacity:0;
  transform:scale(.72);
  transition:opacity .18s ease,transform .18s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan.is-selected .member-shop-plan-check{opacity:1;transform:scale(1)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits{display:none}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout{
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 225px;
  gap:10px;
  margin:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-payment{
  min-width:0;
  min-height:0;
  margin:0;
  padding:14px;
  border:1px solid var(--member-line);
  border-radius:8px;
  background:var(--member-surface);
  box-shadow:0 8px 24px rgba(35,48,78,.06);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-section-head{margin-bottom:10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-section-head h3{
  color:var(--member-text);
  font-size:14px;
  font-weight:800;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-section-head span{
  color:var(--member-muted);
  font-size:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span{
  height:96px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 6px;
  border:1px solid var(--member-line);
  border-radius:7px;
  background:var(--member-surface-2);
  color:var(--member-soft);
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label:hover>span{
  border-color:#bac4ef;
  background:#f5f6ff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span{
  border-color:var(--member-accent);
  background:var(--member-accent-soft);
  color:#4f5bc1;
  box-shadow:inset 0 0 0 1px rgba(102,117,234,.12);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>.front-pay-brand-icon{width:31px;height:31px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>strong{
  max-width:100%;
  overflow:hidden;
  font-size:10px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>i{
  position:absolute;
  top:7px;
  right:7px;
  width:12px;
  height:12px;
  border:1px solid #aeb9c9;
  border-radius:50%;
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span>i{
  border:3px solid var(--member-accent);
  background:#fff;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:space-between;
  gap:12px;
  margin:0;
  padding:16px;
  border:1px solid var(--member-line);
  border-radius:8px;
  background:var(--member-surface);
  box-shadow:0 8px 24px rgba(35,48,78,.06);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>div{
  min-width:0;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:4px 8px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action small{
  grid-column:1;
  color:var(--member-muted);
  font-size:9px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action strong{
  grid-column:2;
  grid-row:1 / 3;
  color:var(--member-text);
  font-size:24px;
  font-weight:850;
  line-height:1;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action strong i{
  margin-right:2px;
  color:#7b8799;
  font-size:11px;
  font-style:normal;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>div>span{
  grid-column:1;
  max-width:105px;
  overflow:hidden;
  color:var(--member-muted);
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button{
  width:100%;
  height:45px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0;
  border-radius:8px;
  background:linear-gradient(90deg,#6f78ed 0%,#5f7be6 52%,#35b5c9 100%);
  color:#fff;
  font-size:12px;
  font-weight:800;
  box-shadow:0 10px 20px rgba(82,98,221,.24);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button .recharge-v2-icon{width:16px;height:16px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button:disabled{
  background:#d7dde8;
  color:#8b96a8;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  padding:20px 17px;
  overflow:hidden;
  border-left:1px solid var(--member-line);
  background:var(--member-surface);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding-bottom:15px;
  border-bottom:1px solid var(--member-line);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title>span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(102,117,234,.22);
  border-radius:8px;
  background:var(--member-accent-soft);
  color:var(--member-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title>span .recharge-v2-icon{width:23px;height:23px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title>div{min-width:0}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title small{
  color:#6876d9;
  font-size:8px;
  font-weight:800;
  letter-spacing:.07em;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title h3{
  margin:4px 0 0;
  color:var(--member-text);
  font-size:15px;
  font-weight:850;
  line-height:1.2;
}


body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-title p{
  margin:5px 0 0;
  color:var(--member-muted);
  font-size:8px;
  line-height:1.45;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:14px 0 11px;
  padding:10px 11px;
  border:1px solid rgba(102,117,234,.18);
  border-radius:7px;
  background:var(--member-accent-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary>div{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary small{color:var(--member-muted);font-size:8px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary strong{
  overflow:hidden;
  color:#4f5fcf;
  font-size:11px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary>span{
  flex:0 0 auto;
  padding:4px 6px;
  border-radius:5px;
  background:rgba(255,255,255,.75);
  color:#66738a;
  font-size:8px;
  font-weight:800;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit-list{
  min-height:0;
  display:grid;
  gap:7px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside>.member-shop-benefit-list{
  flex:1 1 auto;
  grid-auto-rows:minmax(0,1fr);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit{
  min-width:0;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  padding:7px 8px;
  border:1px solid var(--member-line);
  border-radius:7px;
  background:var(--member-surface-2);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit>span{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:var(--member-accent-soft);
  color:var(--member-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit>span .recharge-v2-icon{width:17px;height:17px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit>div{min-width:0;display:grid;gap:3px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit strong{
  overflow:hidden;
  color:var(--member-text);
  font-size:9px;
  font-weight:800;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit small{
  overflow:hidden;
  color:var(--member-muted);
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit>i{
  color:#21a783;
  font-size:11px;
  font-style:normal;
  font-weight:900;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit.is-disabled{opacity:.48}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit.is-disabled>span{background:#edf0f5;color:#9ba5b4}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit.is-disabled>i{color:#9ba5b4}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-note{
  display:flex;
  align-items:center;
  gap:6px;
  margin:12px 0 0;
  padding-top:11px;
  border-top:1px solid var(--member-line);
  color:var(--member-muted);
  font-size:8px;
  line-height:1.45;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside-note .recharge-v2-icon{
  width:15px;
  height:15px;
  flex:0 0 auto;
  color:#22a782;
}

html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership{
  --member-bg:#101722;
  --member-surface:#182131;
  --member-surface-2:#1d293b;
  --member-line:#2d3a4e;
  --member-line-strong:#3b4a61;
  --member-text:#f2f5fa;
  --member-soft:#d7dfea;
  --member-muted:#96a4b8;
  --member-accent:#8796ff;
  --member-accent-strong:#7484f2;
  --member-accent-soft:rgba(135,150,255,.13);
  --member-shadow:0 16px 36px rgba(0,0,0,.22);
  background:var(--member-bg);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.recharge-v2-head,.account-service-nav,.member-shop-aside){
  background:var(--member-surface);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.recharge-v2-shell,.recharge-v2-scroll,.recharge-v2-member-pane){
  background:var(--member-bg);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-close{
  border-color:#344258;
  background:#1f2a3d;
  color:#d6deea;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero{
  border-color:#36435b;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,255,255,.28) 0 2px,transparent 3px),
    radial-gradient(circle at 90% 68%,rgba(255,255,255,.20) 0 3px,transparent 4px),
    linear-gradient(120deg,#222d4c 0%,#253257 52%,#183d4b 100%);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero::before{
  background:linear-gradient(90deg,rgba(16,23,34,.26),rgba(16,23,34,0) 64%);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero h2{color:#f5f7ff}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero p{color:#b6c1d3}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-eyebrow{color:#aab5ff}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current{
  border-color:rgba(152,166,255,.25);
  background:rgba(16,23,34,.35);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current :is(span,small){color:#aeb9ca}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current strong{color:#c1c9ff}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.member-shop-plans,.member-shop-checkout .recharge-v2-payment,.member-shop-checkout .recharge-v2-action){
  border-color:var(--member-line);
  background:var(--member-surface);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head>b{
  background:rgba(135,150,255,.13);
  color:#aeb9ff;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan{
  border-color:#344258;
  background:#1d293b;
  color:var(--member-text);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan:hover{
  border-color:#566682;
  background:#223047;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan.is-selected{
  border-color:#8796ff;
  background:linear-gradient(145deg,#293654 0%,#25334e 100%);
  box-shadow:inset 0 0 0 1px rgba(135,150,255,.16),0 8px 20px rgba(0,0,0,.17);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name small{
  background:#29364a;
  color:#a4b0c2;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price{color:#b4beff}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-credit{color:#b3bfd0}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-desc{color:#8795a9}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span{
  border-color:#344258;
  background:#1d293b;
  color:#dbe3ee;
  -webkit-text-fill-color:#dbe3ee;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label:hover>span{
  border-color:#566682;
  background:#223047;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span{
  border-color:#8796ff;
  background:#293654;
  color:#f4f6ff;
  -webkit-text-fill-color:#f4f6ff;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>i{
  border-color:#607089;
  background:#111925;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span>i{
  border-color:#8796ff;
  background:#f5f7ff;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action strong{color:#f3f6fb;-webkit-text-fill-color:#f3f6fb}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button{
  background:linear-gradient(90deg,#6b74e8 0%,#587edf 54%,#25a9bc 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button:disabled{
  background:#293548;
  color:#7f8da2;
  -webkit-text-fill-color:#7f8da2;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary{
  border-color:rgba(135,150,255,.22);
  background:rgba(135,150,255,.10);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary strong{color:#bac3ff}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-selected-summary>span{
  background:#222f43;
  color:#b9c4d4;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit{
  border-color:#344258;
  background:#1d293b;
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit.is-disabled>span{
  background:#273346;
  color:#738197;
}

@media (min-width:761px) and (max-width:1050px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership{
    width:calc(100vw - 32px);
    height:min(720px,calc(100dvh - 32px));
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-shell{grid-template-columns:144px minmax(0,1fr)}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-layout{grid-template-columns:minmax(0,1fr) 238px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-main{
    grid-template-rows:138px minmax(168px,1fr) 178px;
    gap:10px;
    padding:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero{padding:17px 205px 17px 19px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero h2{font-size:20px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero>img{right:-2px;width:220px;height:145px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plans{padding:12px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid{gap:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan{padding:9px 10px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price strong{font-size:18px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout{grid-template-columns:minmax(0,1fr) 190px;gap:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-payment{padding:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span{height:68px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside{padding:15px 13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit{grid-template-columns:28px minmax(0,1fr) auto;padding:6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-benefit>span{width:28px;height:28px}
}

@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-membership){
    padding:8px;
    align-items:center;
    overflow:hidden;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership{
    width:calc(100vw - 16px);
    height:min(740px,calc(100dvh - 16px));
    min-height:0;
    max-height:none;
    border-radius:14px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-head{
    flex:0 0 58px;
    min-height:58px;
    padding:8px 11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-brand-mark{width:34px;height:34px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-brand strong{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-brand small{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-head-status{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-close{width:30px;height:30px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-shell{
    min-height:0;
    display:flex;
    flex-direction:column;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav{
    flex:0 0 53px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px;
    padding:5px;
    border-right:0;
    border-bottom:1px solid var(--member-line);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button{
    height:43px;
    min-height:43px;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:4px 5px;
    border-radius:7px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button.is-active{
    box-shadow:inset 0 -2px 0 var(--member-accent);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button>span{
    width:19px;
    height:19px;
    background:transparent;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button>span .recharge-v2-icon{width:15px;height:15px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button strong{font-size:9px;white-space:nowrap}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav>button small,
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .account-service-nav-gift{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-scroll{
    flex:1 1 auto;
    min-height:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-layout{
    display:block;
    height:100%;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-main{
    height:100%;
    display:grid;
    grid-template-rows:84px 138px 120px 202px;
    gap:6px;
    padding:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero{
    padding:10px 123px 10px 12px;
    border-radius:7px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-eyebrow{font-size:7px;letter-spacing:.04em}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-eyebrow .recharge-v2-icon{width:11px;height:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero h2{
    max-width:100%;
    margin-top:5px;
    font-size:14px;
    line-height:1.2;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero p{
    display:-webkit-box;
    max-width:100%;
    margin-top:4px;
    overflow:hidden;
    font-size:8px;
    line-height:1.35;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-current{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero>img{
    right:-4px;
    bottom:-7px;
    width:128px;
    height:88px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plans{
    padding:9px;
    border-radius:7px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head{margin-bottom:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head h3{font-size:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head span{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-section-head>b{padding:3px 5px;font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid,
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid.has-1,
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid.has-2{
    grid-auto-rows:minmax(0,1fr);
    gap:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-grid.has-1{
    grid-template-columns:minmax(0,220px);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.member-shop-plan-grid.has-2,.member-shop-plan-grid.has-4){
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership :is(.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-5,.member-shop-plan-grid.has-6){
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan{
    min-height:60px;
    grid-template-rows:auto auto;
    align-content:center;
    gap:3px 5px;
    padding:8px;
    border-radius:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name{gap:4px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name strong{font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name small{padding:1px 3px;font-size:6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price strong{font-size:16px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price i{font-size:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-credit{font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-desc{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits{
    min-width:0;
    min-height:0;
    display:flex;
    flex-direction:column;
    padding:8px 9px;
    overflow:hidden;
    border:1px solid var(--member-line);
    border-radius:7px;
    background:var(--member-surface);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin-bottom:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits-head>div{min-width:0}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits-head strong{
    display:block;
    overflow:hidden;
    color:var(--member-text);
    font-size:9px;
    font-weight:850;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits-head small{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits-head>span{
    flex:0 0 auto;
    color:var(--member-accent);
    font-size:7px;
    font-weight:800;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit-list{
    flex:1 1 auto;
    grid-template-columns:repeat(4,minmax(0,1fr));
    grid-template-rows:repeat(2,minmax(0,1fr));
    gap:4px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    padding:3px 2px;
    text-align:center;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit>span{width:22px;height:22px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit>span .recharge-v2-icon{width:13px;height:13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit>div{width:100%;gap:1px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit strong{font-size:7px;text-align:center}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-mobile-benefits .member-shop-benefit small{font-size:6.5px;text-align:center}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 126px;
    gap:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-payment{padding:8px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-section-head{margin-bottom:6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-section-head h3{font-size:10px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-section-head span{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid{gap:4px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span{
    height:139px;
    gap:5px;
    padding:5px 2px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>.front-pay-brand-icon{width:25px;height:25px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>strong{font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>i{top:4px;right:4px;width:9px;height:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span>i{border-width:2px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action{
    gap:7px;
    padding:9px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>div{display:block}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action small{display:block;font-size:7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action strong{display:block;margin-top:4px;font-size:19px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>div>span{display:block;max-width:100%;margin-top:4px;font-size:6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button{
    height:37px;
    padding:0 5px;
    gap:3px;
    font-size:8px;
    white-space:nowrap;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout .recharge-v2-action>button .recharge-v2-icon{width:12px;height:12px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-aside{display:none}
}

@media (max-width:380px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .recharge-v2-brand small{display:none}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-main{
    grid-template-rows:84px 138px 120px 202px;
    gap:6px;
    padding:6px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero{padding-right:108px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero h2{font-size:13px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-hero>img{width:116px;height:82px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan{padding:7px 6px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-name strong{font-size:9px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-plan-price strong{font-size:15px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-membership .member-shop-checkout{grid-template-columns:minmax(0,1fr) 112px}
}

/* Account service chrome: all tabs share the online recharge header and navigation. */
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-brand-mark{
  width:34px;
  height:34px;
  border-radius:8px;
}
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-brand strong{
  font-size:17px;
}
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head-status{
  display:flex;
  font-size:12px;
}
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-close{
  width:32px;
  height:32px;
  border-radius:8px;
}
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:not(.is-active)>span{
  border:1px solid rgba(255,255,255,.34);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
}
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:not(.is-active) .recharge-feature-icon{
  filter:drop-shadow(0 1px 1px rgba(43,58,138,.24));
}
html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:not(.is-active):hover>span{
  border-color:rgba(255,255,255,.5);
  background:rgba(255,255,255,.1);
}

html:not([data-theme="dark"]):not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
  border-bottom:1px solid #e7ebf2;
  background:#fff;
  background-image:none;
  color:#202538;
  box-shadow:none;
}
html:not([data-theme="dark"]):not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-brand-mark{
  border:1px solid #dfe4fb;
  background:#f0f2ff;
  color:#6874eb;
  box-shadow:none;
}
html:not([data-theme="dark"]):not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-brand strong{
  color:#202538;
  -webkit-text-fill-color:#202538;
}
html:not([data-theme="dark"]):not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-brand small,.recharge-v2-head-status){
  color:#858da2;
  -webkit-text-fill-color:#858da2;
}
html:not([data-theme="dark"]):not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-close{
  border:1px solid #e0e4ee;
  background:#f6f7fb;
  background-image:none;
  color:#626a7e;
  -webkit-text-fill-color:#626a7e;
  box-shadow:none;
}

@media (min-width:761px){
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
    position:absolute;
    top:0;
    right:0;
    left:152px;
    z-index:5;
    flex:0 0 auto;
    min-height:70px;
    height:70px;
    gap:18px;
    padding:11px 21px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-shell{
    height:100%;
    min-height:0;
    grid-template-columns:152px minmax(0,1fr);
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
    gap:8px;
    padding:86px 12px 16px;
    border:0;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-scroll{
    padding-top:70px;
  }
}

@media (max-width:760px){
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
    position:static;
    flex:0 0 58px;
    min-height:58px;
    height:58px;
    gap:9px;
    padding:11px 21px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-brand small{
    display:block;
    font-size:9px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head-status{
    gap:4px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-shell{
    height:auto;
    min-height:0;
    display:flex;
    flex:1 1 auto;
    flex-direction:column;
    grid-template-columns:152px minmax(0,1fr);
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
    flex:0 0 auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    grid-template-rows:52px 38px 36px;
    gap:4px;
    padding:6px;
    border:0;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button{
    height:52px;
    min-height:52px;
    flex-direction:column;
    gap:6px;
    padding:4px 3px;
    border-radius:8px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button>span{
    flex:0 0 24px;
    width:24px;
    height:24px;
    border-radius:6px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button strong{
    font-size:10px;
    white-space:nowrap;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button small{
    display:none;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-gift{
    grid-column:1 / -1;
    grid-row:2;
    min-height:38px;
    height:38px;
    display:grid;
    grid-template-columns:24px minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:center;
    column-gap:7px;
    row-gap:1px;
    margin:0;
    padding:4px 8px;
    border-radius:6px;
    text-align:left;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-gift>img{
    width:24px;
    height:24px;
    grid-row:1 / 3;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-gift>strong{
    font-size:10px;
    line-height:1.1;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-gift>small{
    font-size:8px;
    line-height:1.1;
    white-space:nowrap;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
    grid-column:1 / -1;
    grid-row:3;
    min-height:36px;
    height:36px;
  }
  html:not(#jnAccountServiceChromeA#jnAccountServiceChromeB#jnAccountServiceChromeC#jnAccountServiceChromeD#jnAccountServiceChromeE#jnAccountServiceChromeF#jnAccountServiceChromeG#jnAccountServiceChromeH#jnAccountServiceChromeI#jnAccountServiceChromeJ#jnAccountServiceChromeK#jnAccountServiceChromeL#jnAccountServiceChromeM#jnAccountServiceChromeN#jnAccountServiceChromeO#jnAccountServiceChromeP#jnAccountServiceChromeQ#jnAccountServiceChromeR#jnAccountServiceChromeS#jnAccountServiceChromeT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-scroll{
    flex:1 1 0;
    min-height:0;
    padding-top:0;
  }
}

/* Recharge visual polish: continuous content background and a clearer shared gift card. */
html:not([data-theme="dark"]):not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online :is(.recharge-v2-scroll,.recharge-v2-pane,.recharge-v2-content-grid,.recharge-v2-main,.recharge-v2-aside){
  background:#f7f9ff;
  background-image:none;
}
html:not([data-theme="dark"]):not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-aside{
  border-left-color:#e3e8f0;
}

@media (min-width:761px){
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
    min-height:216px;
    height:216px;
    justify-content:flex-start;
    gap:0;
    padding:8px 6px;
    overflow:visible;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard::after{
    content:none;
    display:none;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard>img{
    width:126px;
    max-width:126px;
    height:126px;
    flex:0 0 126px;
    position:relative;
    left:-7px;
    z-index:2;
    margin:1px auto -64px;
    filter:drop-shadow(0 10px 14px rgba(76,58,166,.16)) saturate(.96) brightness(1.02);
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard>.account-service-nav-gift-copy{
    width:100%;
    min-height:132px;
    position:relative;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:0;
    margin:0;
    padding:46px 10px 12px;
    border:1px solid rgba(182,192,255,.24);
    border-top-color:rgba(182,192,255,.08);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(24,30,50,.14) 0%,rgba(24,30,50,.46) 32%,rgba(24,30,50,.64) 100%);
    box-shadow:0 12px 24px rgba(9,12,25,.12),inset 0 -1px 0 rgba(255,255,255,.08);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    text-align:center;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text{
    min-width:0;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>strong{
    margin:0;
    color:#fff;
    -webkit-text-fill-color:#fff;
    font-size:16px;
    font-weight:800;
    line-height:21px;
    white-space:nowrap;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>small{
    width:100%;
    min-height:14px;
    display:block;
    margin:3px 0 0;
    padding:0;
    color:rgba(238,241,255,.82);
    -webkit-text-fill-color:rgba(238,241,255,.82);
    font-size:10.5px;
    font-weight:700;
    line-height:15px;
    white-space:normal;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>small>span{
    display:block;
    min-width:0;
    max-width:100%;
    overflow-wrap:anywhere;
  }
  html:not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-arrow{
    width:18px;
    height:18px;
    flex:0 0 18px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#8b97e7;
    color:#fff;
    -webkit-text-fill-color:#fff;
    font-size:13px;
    font-style:normal;
    font-weight:800;
    line-height:18px;
  }
  html:not([data-theme="dark"]):not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
    border:0;
    background:transparent;
    box-shadow:none;
  }
  html:not([data-theme="dark"]):not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard>.account-service-nav-gift-copy{
    border-color:rgba(255,255,255,.48);
    border-top-color:rgba(255,255,255,.14);
    background:linear-gradient(180deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.46) 32%,rgba(255,255,255,.68) 100%);
    box-shadow:0 12px 24px rgba(81,96,169,.08),inset 0 -1px 0 rgba(255,255,255,.54);
  }
  html:not([data-theme="dark"]):not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>strong{
    color:#4054cf;
    -webkit-text-fill-color:#4054cf;
  }
  html:not([data-theme="dark"]):not(#jnRechargePolishA#jnRechargePolishB#jnRechargePolishC#jnRechargePolishD#jnRechargePolishE#jnRechargePolishF#jnRechargePolishG#jnRechargePolishH#jnRechargePolishI#jnRechargePolishJ#jnRechargePolishK#jnRechargePolishL#jnRechargePolishM#jnRechargePolishN#jnRechargePolishO#jnRechargePolishP#jnRechargePolishQ#jnRechargePolishR#jnRechargePolishS#jnRechargePolishT) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>small{
    color:#53618a;
    -webkit-text-fill-color:#53618a;
  }
}

@media (max-width:760px){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
    border-color:rgba(255,255,255,.46);
    background:rgba(255,255,255,.16);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard>.account-service-nav-gift-copy{
    min-width:0;
    width:100%;
    height:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    overflow:hidden;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text{
    min-width:0;
    display:flex;
    flex:1 1 auto;
    align-items:baseline;
    gap:6px;
    overflow:hidden;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>strong{
    flex:0 0 auto;
    color:#eef1ff;
    -webkit-text-fill-color:#eef1ff;
    font-size:11px;
    font-weight:850;
    line-height:14px;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>small{
    min-width:0;
    display:block;
    flex:1 1 auto;
    overflow:hidden;
    color:#dbe1ff;
    -webkit-text-fill-color:#dbe1ff;
    font-size:9px;
    font-weight:650;
    line-height:12px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>small>span{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-arrow{
    width:18px;
    height:18px;
    display:inline-flex;
    flex:0 0 18px;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:rgba(255,255,255,.22);
    color:#fff;
    -webkit-text-fill-color:#fff;
    font-size:13px;
    font-style:normal;
    font-weight:800;
    line-height:18px;
  }
  html:not([data-theme="dark"]) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
    border-color:#e1e6f6;
    background:#f7f9ff;
    box-shadow:inset 0 1px 0 #fff;
  }
  html:not([data-theme="dark"]) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>strong{
    color:#5663dc;
    -webkit-text-fill-color:#5663dc;
  }
  html:not([data-theme="dark"]) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-text>small{
    color:#65759d;
    -webkit-text-fill-color:#65759d;
  }
  html:not([data-theme="dark"]) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard .account-service-nav-gift-arrow{
    background:#8794e4;
  }
}

/* Recharge activity badge: warm capsule with restrained ambient motion. */
html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
  top:7px;
  right:8px;
  z-index:5;
  width:auto;
  min-width:52px;
  height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  overflow:hidden;
  isolation:isolate;
  padding:0 10px 0 19px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:999px;
  background:linear-gradient(105deg,#ffb34d 0%,#ff7867 48%,#f65d82 100%);
  background-size:180% 100%;
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 4px 10px rgba(216,83,93,.22),inset 0 1px 0 rgba(255,255,255,.3);
  font-size:10px;
  font-weight:900;
  line-height:1;
  letter-spacing:0;
  text-shadow:0 1px 2px rgba(151,43,59,.22);
  transform:none;
  transform-origin:center;
  animation:rechargeActivityBadgeFlowV4 3.2s ease-in-out infinite;
}
html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::before{
  content:"";
  position:absolute;
  left:8px;
  top:50%;
  z-index:2;
  width:6px;
  height:6px;
  flex:none;
  border-radius:50%;
  background:#fff8dc;
  box-shadow:0 0 0 0 rgba(255,248,220,.6);
  transform:translateY(-50%) scale(.8);
  animation:rechargeActivityBadgeDotV4 1.7s ease-in-out infinite;
}
html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::after{
  content:"";
  position:absolute;
  top:-9px;
  left:-24px;
  z-index:1;
  width:11px;
  height:40px;
  display:block;
  border:0;
  border-radius:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
  opacity:1;
  transform:skewX(-18deg);
  animation:rechargeActivityBadgeSweepV4 3.2s ease-in-out infinite;
}
@keyframes rechargeActivityBadgeFlowV4{
  0%,100%{
    filter:brightness(1) saturate(1);
  }
  50%{
    filter:brightness(1.08) saturate(1.12) drop-shadow(0 2px 4px rgba(224,90,83,.22));
  }
}
@keyframes rechargeActivityBadgeDotV4{
  0%,100%{
    scale:.76;
    filter:brightness(.96);
  }
  50%{
    scale:1.12;
    filter:brightness(1.24) drop-shadow(0 0 3px rgba(255,248,220,.86));
  }
}
@keyframes rechargeActivityBadgeSweepV4{
  0%,55%{
    translate:0 0;
    filter:opacity(0);
  }
  64%{
    filter:opacity(.9);
  }
  84%,100%{
    translate:100px 0;
    filter:opacity(0);
  }
}
@media (max-width:1080px){
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
    top:6px;
    right:6px;
    min-width:46px;
    height:20px;
    padding:0 8px 0 17px;
    font-size:9px;
  }
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::before{
    left:7px;
    width:5px;
    height:5px;
  }
}
@media (prefers-reduced-motion:reduce){
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark,
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::before,
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::after{
    animation:none;
    opacity:0;
  }
}

@media (max-width:480px){
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity{
    padding-top:31px;
  }
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
    top:5px;
    right:5px;
    min-width:46px;
    height:20px;
    padding:0 8px 0 17px;
    border-color:rgba(255,255,255,.82);
    background-size:240% 100%;
    font-size:10px;
    font-weight:700;
    text-shadow:0 1px 1px rgba(151,43,59,.18);
    box-shadow:0 4px 10px rgba(216,83,93,.24),inset 0 1px 0 rgba(255,255,255,.36);
    animation-duration:2.8s;
  }
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::before{
    content:"";
    left:7px;
    width:5px;
    height:5px;
    display:block;
    animation:rechargeActivityBadgeDotV4 1.6s ease-in-out infinite;
  }
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::after{
    top:-6px;
    width:10px;
    height:32px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.56),transparent);
    animation-duration:2.8s;
  }
}

@media (max-width:340px){
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity{
    padding-top:32px;
  }
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark{
    top:4px;
    right:4px;
    min-width:44px;
    height:19px;
    padding:0 7px 0 15px;
    font-size:9.5px;
  }
  html:not(#jnRechargeActivityV4A#jnRechargeActivityV4B#jnRechargeActivityV4C#jnRechargeActivityV4D#jnRechargeActivityV4E#jnRechargeActivityV4F#jnRechargeActivityV4G#jnRechargeActivityV4H#jnRechargeActivityV4I#jnRechargeActivityV4J#jnRechargeActivityV4K#jnRechargeActivityV4L#jnRechargeActivityV4M#jnRechargeActivityV4N#jnRechargeActivityV4O#jnRechargeActivityV4P#jnRechargeActivityV4Q#jnRechargeActivityV4R#jnRechargeActivityV4S#jnRechargeActivityV4T) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-activity-mark::before{
    left:6px;
    width:4px;
    height:4px;
  }
}

/* Account service final responsive fixes: amount safety, records, balance and mobile placement. */
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  grid-template-columns:28px minmax(0,1fr);
  gap:7px;
  padding:8px;
  border:1px solid rgba(255,255,255,.62);
  border-radius:8px;
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(240,244,255,.88));
  color:#252b48;
  box-shadow:0 9px 20px rgba(43,55,132,.14),inset 0 1px 0 rgba(255,255,255,.86);
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>span{
  width:28px;
  height:28px;
  border-radius:7px;
  background:linear-gradient(145deg,#7183ee,#536bd5);
  color:#fff;
  box-shadow:0 5px 12px rgba(69,87,185,.24),inset 0 1px 0 rgba(255,255,255,.28);
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>span .recharge-v2-icon{
  width:16px;
  height:16px;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance small{
  display:block;
  margin:0 0 2px;
  color:#6f7898;
  -webkit-text-fill-color:#6f7898;
  font-size:9.5px;
  font-weight:750;
  line-height:1.1;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>div>span{
  min-width:0;
  gap:3px;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance strong{
  color:#252b48;
  -webkit-text-fill-color:#252b48;
  font-size:14px;
  font-weight:850;
  font-variant-numeric:tabular-nums;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance em{
  padding:0;
  border-radius:0;
  background:transparent;
  color:#7a84a4;
  -webkit-text-fill-color:#7a84a4;
  font-size:9px;
  font-weight:700;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article{
  grid-template-columns:36px minmax(0,1fr) auto;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon{
  width:36px;
  height:36px;
  min-width:36px;
  max-width:36px;
  flex-basis:36px;
  padding:0;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon>svg{
  width:23px;
  height:23px;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon.is-alipay>.front-pay-alipay-mark{
  width:25px;
  height:25px;
}
html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list article>.front-pay-brand-icon.is-wechat>svg{
  width:24px;
  height:24px;
}

@media (min-width:761px){
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-activity>strong{
    width:calc(100% - 52px);
    max-width:calc(100% - 52px);
    align-self:flex-start;
    justify-content:center;
    white-space:nowrap;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-long-amount>strong{
    font-size:23px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-package.has-extra-long-amount>strong{
    font-size:20px;
  }
}

@media (max-width:760px){
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-account-service){
    align-items:flex-start;
    justify-items:center;
    padding:64px 8px 8px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service{
    width:calc(100vw - 16px);
    height:calc(100dvh - 72px);
    max-height:calc(100dvh - 72px);
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
    padding-right:48px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-close{
    position:absolute;
    top:8px;
    right:8px;
    z-index:8;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
    grid-template-rows:52px 40px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
    display:none;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
    grid-column:1 / -1;
    grid-row:2;
    min-height:40px;
    height:40px;
    grid-template-columns:28px minmax(0,1fr);
    gap:8px;
    padding:5px 8px;
    border-color:rgba(255,255,255,.7);
    background:rgba(255,255,255,.93);
    box-shadow:0 5px 13px rgba(46,61,144,.11),inset 0 1px 0 #fff;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>span{
    width:28px;
    height:28px;
    border-radius:7px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>span .recharge-v2-icon{
    width:16px;
    height:16px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>div{
    min-width:0;
    display:flex;
    align-items:center;
    gap:8px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance small{
    flex:0 0 auto;
    margin:0;
    font-size:10px;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>div>span{
    margin-left:auto;
  }
  html:not(#jnRechargeLatestA#jnRechargeLatestB#jnRechargeLatestC#jnRechargeLatestD#jnRechargeLatestE#jnRechargeLatestF#jnRechargeLatestG#jnRechargeLatestH#jnRechargeLatestI#jnRechargeLatestJ#jnRechargeLatestK#jnRechargeLatestL#jnRechargeLatestM#jnRechargeLatestN#jnRechargeLatestO#jnRechargeLatestP#jnRechargeLatestQ#jnRechargeLatestR#jnRechargeLatestS#jnRechargeLatestT#jnRechargeLatestU#jnRechargeLatestV#jnRechargeLatestW#jnRechargeLatestX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance strong{
    font-size:14px;
  }
}

html[data-theme="dark"] body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  border-color:#36445a;
  background:linear-gradient(145deg,#202b3d,#182334);
  color:#f3f6fb;
  box-shadow:0 9px 20px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.04);
}
html[data-theme="dark"] body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance small{
  color:#9aa7bb;
  -webkit-text-fill-color:#9aa7bb;
}
html[data-theme="dark"] body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance strong{
  color:#f3f6fb;
  -webkit-text-fill-color:#f3f6fb;
}
html[data-theme="dark"] body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance em{
  background:transparent;
  color:#aebcff;
  -webkit-text-fill-color:#aebcff;
}

/* Account service final theme fixes: transparent page, dark navigation colors and mobile membership status. */
html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(.recharge-v2-modal.is-account-service){
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance :is(.is-member-icon,.is-member-copy){
  display:none;
}

html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  border-color:#35435b;
  background:linear-gradient(145deg,#202b3d 0%,#182334 100%);
  color:#f4f7fb;
  box-shadow:0 9px 20px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>span{
  border:1px solid rgba(142,157,255,.32);
  background:linear-gradient(145deg,#42558b,#2c3d6c);
  color:#cbd3ff;
  box-shadow:0 5px 12px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.1);
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance small{
  color:#96a4ba;
  -webkit-text-fill-color:#96a4ba;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance strong{
  color:#f4f7fb;
  -webkit-text-fill-color:#f4f7fb;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance em{
  color:#aebcff;
  -webkit-text-fill-color:#aebcff;
}

html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="online"]>span{
  border-color:rgba(140,156,255,.3);
  background:#273254;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"]>span{
  border-color:rgba(241,201,107,.3);
  background:#3a3223;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"]>span{
  border-color:rgba(100,214,178,.28);
  background:#193934;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:not(.is-active) .recharge-feature-icon{
  opacity:.94;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.22));
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="online"] .recharge-feature-icon :is(.feature-main,.feature-shadow){
  fill:#8c9cff;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="online"] .recharge-feature-icon .feature-shadow{
  fill:#6074dc;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="online"] .recharge-feature-icon .feature-light{
  fill:#e1e5ff;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"] .recharge-feature-icon .feature-main{
  fill:#f1c96b;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"] .recharge-feature-icon .feature-shadow{
  fill:#b88935;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"] .recharge-feature-icon :is(.feature-light,.feature-accent){
  fill:#ffe9a8;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"] .recharge-feature-icon .feature-main{
  fill:#64d6b2;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"] .recharge-feature-icon .feature-shadow{
  fill:#369578;
}
html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"] .recharge-feature-icon .feature-light{
  fill:#d9fff2;
}

@media (max-width:760px){
  html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-balance-icon,
  html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-balance-copy{
    display:none;
  }
  html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-icon{
    display:grid;
    border-color:rgba(208,166,70,.28);
    background:linear-gradient(145deg,#f2c96c,#d4a641);
    color:#574018;
  }
  html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy{
    min-width:0;
    display:flex;
    align-items:center;
    gap:8px;
  }
  html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy>span{
    min-width:0;
    margin-left:auto;
  }
  html:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy strong{
    display:block;
    max-width:190px;
    overflow:hidden;
    color:#5c471e;
    -webkit-text-fill-color:#5c471e;
    font-size:12.5px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-icon{
    border-color:rgba(241,201,107,.28);
    background:linear-gradient(145deg,#5a4828,#3f3422);
    color:#f2cd73;
  }
  html[data-theme="dark"]:not(#jnRechargeThemeFinalA#jnRechargeThemeFinalB#jnRechargeThemeFinalC#jnRechargeThemeFinalD#jnRechargeThemeFinalE#jnRechargeThemeFinalF#jnRechargeThemeFinalG#jnRechargeThemeFinalH#jnRechargeThemeFinalI#jnRechargeThemeFinalJ#jnRechargeThemeFinalK#jnRechargeThemeFinalL#jnRechargeThemeFinalM#jnRechargeThemeFinalN#jnRechargeThemeFinalO#jnRechargeThemeFinalP#jnRechargeThemeFinalQ#jnRechargeThemeFinalR#jnRechargeThemeFinalS#jnRechargeThemeFinalT#jnRechargeThemeFinalU#jnRechargeThemeFinalV#jnRechargeThemeFinalW#jnRechargeThemeFinalX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy strong{
    color:#f5dfaa;
    -webkit-text-fill-color:#f5dfaa;
  }
}

/* Account service dark palette: neutral charcoal surfaces. */
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service{
  --rv2-bg:#1b1c20;
  --rv2-surface:#202228;
  --rv2-surface-2:#24272d;
  --rv2-surface-3:#2a2d34;
  --rv2-line:#34373e;
  --rv2-line-strong:#484c56;
  --member-bg:#1b1c20;
  --member-surface:#202228;
  --member-surface-2:#24272d;
  --member-line:#34373e;
  --member-line-strong:#484c56;
  border-color:#34373e;
  background:#1b1c20;
  background-image:none;
  box-shadow:0 32px 90px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.035);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
  border-bottom-color:#34373e;
  background:#202228;
  box-shadow:0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-brand-mark{
  border-color:#3c4049;
  background:#292c33;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-close{
  border-color:#393c44;
  background:#292c32;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-close:hover{
  border-color:#50545e;
  background:#32353c;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-shell,.recharge-v2-scroll,.recharge-v2-main,.recharge-v2-member-pane,.recharge-v2-redeem-pane){
  background:#202228;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
  border-color:#34373e;
  background:#1b1c20;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:hover{
  background:#272a30;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button.is-active{
  background:#25272d;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="online"].is-active{
  border-color:rgba(135,150,255,.42);
  box-shadow:inset 3px 0 0 #8796ff;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"].is-active{
  border-color:rgba(241,201,107,.38);
  box-shadow:inset 3px 0 0 #e0b957;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"].is-active{
  border-color:rgba(100,214,178,.36);
  box-shadow:inset 3px 0 0 #64d6b2;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="online"]>span{
  border-color:#424650;
  background:#2a2d35;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"]>span{
  border-color:#484238;
  background:#302d27;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"]>span{
  border-color:#354840;
  background:#24302c;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  border-color:#3a3e46;
  background:linear-gradient(145deg,#262930,#202228);
  box-shadow:0 9px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>span{
  border-color:#464b56;
  background:linear-gradient(145deg,#343841,#2b2e35);
  box-shadow:0 5px 12px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.06);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
  border-color:#3a3e46;
  background:linear-gradient(180deg,#282b32 0%,#23252b 58%,#1e2025 100%);
  box-shadow:0 14px 30px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard::after{
  border-color:#34373e;
  background:rgba(24,25,29,.72);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-aside{
  border-color:#34373e;
  background:#202228;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online :is(.recharge-v2-visual,.recharge-v2-aside-balance,.recharge-v2-aside-card,.recharge-v2-package,.recharge-v2-custom,.recharge-v2-payment,.recharge-v2-action){
  border-color:#373a42;
  background:#202228;
  background-image:none;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-package:hover{
  border-color:#50545e;
  background:#202228;
}


html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-custom:focus-within{
  background:#202228;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-custom-icon{
  border-color:#424650;
  background:#2b2e36;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-custom-input,.recharge-v2-redeem-pane input){
  border-color:#383c44;
  background:#18191d;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.22);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-custom-input:focus-within,.recharge-v2-redeem-pane input:focus){
  background:#1d1f24;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-pay-grid label>span{
  border-color:#3a3e46;
  background:#202228;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-pay-grid label:hover>span{
  border-color:#50545e;
  background:#202228;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-pay-grid input:checked+span{
  background:#202228;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-pay-grid label>span>i{
  border-color:#5a5f6a;
  background:#18191d;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-redeem-pane form:not(.redeem-reference-form){
  border-color:#3a3e46;
  background:#202228;
  box-shadow:0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-redeem-icon{
  border-color:#454956;
  background:#2b2e36;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-main{
  background:#1b1c20;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside{
  border-color:#34373e;
  background:#18191d;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-hero{
  border-color:#3b3f47;
  background:linear-gradient(120deg,#292c32 0%,#24272d 56%,#20292a 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-hero::before{
  background:linear-gradient(90deg,rgba(27,28,32,.32),rgba(27,28,32,0) 64%);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-current{
  border-color:#41454f;
  background:rgba(27,28,32,.64);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plans,.member-shop-checkout .recharge-v2-payment,.member-shop-checkout .recharge-v2-action,.member-shop-mobile-benefits){
  border-color:#373a42;
  background:#202228;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan,.member-shop-benefit){
  border-color:#3a3e46;
  background:#24272d;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan:hover{
  border-color:#50545e;
  background:#292c33;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan.is-selected{
  background:linear-gradient(145deg,#2d3038 0%,#282b32 100%);
  box-shadow:inset 0 0 0 1px rgba(135,150,255,.16),0 8px 20px rgba(0,0,0,.17);
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name small{
  background:#2d3037;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary{
  border-color:#41454f;
  background:#292c33;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary>span{
  background:#23262c;
}
html[data-theme="dark"]:not(#jnRechargeNeutralA#jnRechargeNeutralB#jnRechargeNeutralC#jnRechargeNeutralD#jnRechargeNeutralE#jnRechargeNeutralF#jnRechargeNeutralG#jnRechargeNeutralH#jnRechargeNeutralI#jnRechargeNeutralJ#jnRechargeNeutralK#jnRechargeNeutralL#jnRechargeNeutralM#jnRechargeNeutralN#jnRechargeNeutralO#jnRechargeNeutralP#jnRechargeNeutralQ#jnRechargeNeutralR#jnRechargeNeutralS#jnRechargeNeutralT#jnRechargeNeutralU#jnRechargeNeutralV#jnRechargeNeutralW#jnRechargeNeutralX#jnRechargeNeutralY#jnRechargeNeutralZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-action>button,.recharge-v2-redeem-pane button):disabled{
  background:#2d3036;
  box-shadow:none;
}

/* Dark account-service color completion: remove the remaining blue-gray blocks. */
html[data-theme="dark"]:not(#jnRechargeNeutralCompleteA#jnRechargeNeutralCompleteB#jnRechargeNeutralCompleteC#jnRechargeNeutralCompleteD#jnRechargeNeutralCompleteE#jnRechargeNeutralCompleteF#jnRechargeNeutralCompleteG#jnRechargeNeutralCompleteH#jnRechargeNeutralCompleteI#jnRechargeNeutralCompleteJ#jnRechargeNeutralCompleteK#jnRechargeNeutralCompleteL#jnRechargeNeutralCompleteM#jnRechargeNeutralCompleteN#jnRechargeNeutralCompleteO#jnRechargeNeutralCompleteP#jnRechargeNeutralCompleteQ#jnRechargeNeutralCompleteR#jnRechargeNeutralCompleteS#jnRechargeNeutralCompleteT#jnRechargeNeutralCompleteU#jnRechargeNeutralCompleteV#jnRechargeNeutralCompleteW#jnRechargeNeutralCompleteX#jnRechargeNeutralCompleteY#jnRechargeNeutralCompleteZ#jnRechargeNeutralCompleteAA#jnRechargeNeutralCompleteAB) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online :is(.recharge-v2-payment,.recharge-v2-action){
  border-color:transparent;
  background:transparent;
  background-image:none;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralCompleteA#jnRechargeNeutralCompleteB#jnRechargeNeutralCompleteC#jnRechargeNeutralCompleteD#jnRechargeNeutralCompleteE#jnRechargeNeutralCompleteF#jnRechargeNeutralCompleteG#jnRechargeNeutralCompleteH#jnRechargeNeutralCompleteI#jnRechargeNeutralCompleteJ#jnRechargeNeutralCompleteK#jnRechargeNeutralCompleteL#jnRechargeNeutralCompleteM#jnRechargeNeutralCompleteN#jnRechargeNeutralCompleteO#jnRechargeNeutralCompleteP#jnRechargeNeutralCompleteQ#jnRechargeNeutralCompleteR#jnRechargeNeutralCompleteS#jnRechargeNeutralCompleteT#jnRechargeNeutralCompleteU#jnRechargeNeutralCompleteV#jnRechargeNeutralCompleteW#jnRechargeNeutralCompleteX#jnRechargeNeutralCompleteY#jnRechargeNeutralCompleteZ#jnRechargeNeutralCompleteAA#jnRechargeNeutralCompleteAB) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-pay-grid label>span{
  border-color:#373a42;
  background:#202228;
  background-image:none;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNeutralCompleteA#jnRechargeNeutralCompleteB#jnRechargeNeutralCompleteC#jnRechargeNeutralCompleteD#jnRechargeNeutralCompleteE#jnRechargeNeutralCompleteF#jnRechargeNeutralCompleteG#jnRechargeNeutralCompleteH#jnRechargeNeutralCompleteI#jnRechargeNeutralCompleteJ#jnRechargeNeutralCompleteK#jnRechargeNeutralCompleteL#jnRechargeNeutralCompleteM#jnRechargeNeutralCompleteN#jnRechargeNeutralCompleteO#jnRechargeNeutralCompleteP#jnRechargeNeutralCompleteQ#jnRechargeNeutralCompleteR#jnRechargeNeutralCompleteS#jnRechargeNeutralCompleteT#jnRechargeNeutralCompleteU#jnRechargeNeutralCompleteV#jnRechargeNeutralCompleteW#jnRechargeNeutralCompleteX#jnRechargeNeutralCompleteY#jnRechargeNeutralCompleteZ#jnRechargeNeutralCompleteAA#jnRechargeNeutralCompleteAB) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-pay-grid input:checked+span{
  background:#202228;
  box-shadow:none;
}
@media (min-width:761px){
  html[data-theme="dark"]:not(#jnRechargeNeutralCompleteA#jnRechargeNeutralCompleteB#jnRechargeNeutralCompleteC#jnRechargeNeutralCompleteD#jnRechargeNeutralCompleteE#jnRechargeNeutralCompleteF#jnRechargeNeutralCompleteG#jnRechargeNeutralCompleteH#jnRechargeNeutralCompleteI#jnRechargeNeutralCompleteJ#jnRechargeNeutralCompleteK#jnRechargeNeutralCompleteL#jnRechargeNeutralCompleteM#jnRechargeNeutralCompleteN#jnRechargeNeutralCompleteO#jnRechargeNeutralCompleteP#jnRechargeNeutralCompleteQ#jnRechargeNeutralCompleteR#jnRechargeNeutralCompleteS#jnRechargeNeutralCompleteT#jnRechargeNeutralCompleteU#jnRechargeNeutralCompleteV#jnRechargeNeutralCompleteW#jnRechargeNeutralCompleteX#jnRechargeNeutralCompleteY#jnRechargeNeutralCompleteZ#jnRechargeNeutralCompleteAA#jnRechargeNeutralCompleteAB) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard{
    border-color:transparent;
    background:transparent;
    background-image:none;
    box-shadow:none;
  }
  html[data-theme="dark"]:not(#jnRechargeNeutralCompleteA#jnRechargeNeutralCompleteB#jnRechargeNeutralCompleteC#jnRechargeNeutralCompleteD#jnRechargeNeutralCompleteE#jnRechargeNeutralCompleteF#jnRechargeNeutralCompleteG#jnRechargeNeutralCompleteH#jnRechargeNeutralCompleteI#jnRechargeNeutralCompleteJ#jnRechargeNeutralCompleteK#jnRechargeNeutralCompleteL#jnRechargeNeutralCompleteM#jnRechargeNeutralCompleteN#jnRechargeNeutralCompleteO#jnRechargeNeutralCompleteP#jnRechargeNeutralCompleteQ#jnRechargeNeutralCompleteR#jnRechargeNeutralCompleteS#jnRechargeNeutralCompleteT#jnRechargeNeutralCompleteU#jnRechargeNeutralCompleteV#jnRechargeNeutralCompleteW#jnRechargeNeutralCompleteX#jnRechargeNeutralCompleteY#jnRechargeNeutralCompleteZ#jnRechargeNeutralCompleteAA#jnRechargeNeutralCompleteAB) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard>.account-service-nav-gift-copy{
    border-color:#3a3e46;
    border-top-color:#30333a;
    background:linear-gradient(180deg,rgba(32,34,40,.16) 0%,rgba(32,34,40,.76) 32%,rgba(27,28,32,.94) 100%);
    box-shadow:0 12px 24px rgba(0,0,0,.18),inset 0 -1px 0 rgba(255,255,255,.055);
  }
}

/* Dark quick drawer palette: align with account-service charcoal surfaces. */















/* Payment cashier: match the account-service modal surfaces and keep the page unobscured. */
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-layer{
  background:transparent;
  background-image:none;
  color:#172033;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel{
  width:min(440px,calc(100vw - 28px));
  max-height:calc(100dvh - 28px);
  grid-template-rows:auto auto auto minmax(0,1fr) auto;
  border:1px solid #dfe3ea;
  border-radius:8px;
  background:#f4f6f9;
  background-image:none;
  color:#172033;
  box-shadow:0 24px 70px rgba(20,28,42,.22),inset 0 1px 0 rgba(255,255,255,.9);
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head{
  padding:18px 18px 15px;
  border-bottom:1px solid #dfe3ea;
  background:#fff;
  background-image:none;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head>div{
  min-width:0;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head span{
  height:25px;
  gap:7px;
  margin-bottom:8px;
  padding:0 9px;
  border:1px solid #dfe3ea;
  border-radius:999px;
  background:#f1f3f6;
  background-image:none;
  color:#667085;
  font-size:11px;
  font-weight:800;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head span::before{
  width:6px;
  height:6px;
  flex:0 0 auto;
  border-radius:50%;
  background:#737b88;
  content:"";
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head h2{
  color:#172033;
  font-size:19px;
  line-height:1.25;
  letter-spacing:0;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head p{
  margin-top:7px;
  color:#788294;
  font-size:12px;
  line-height:1.55;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-close{
  width:34px;
  height:34px;
  border:1px solid #dfe3ea;
  border-radius:8px;
  background:#f5f7fa;
  background-image:none;
  color:#596273;
  box-shadow:none;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-close:hover{
  border-color:#c9ced8;
  background:#eceff4;
  color:#222936;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status{
  height:32px;
  margin:12px 16px 0;
  border:1px solid #d8dde5;
  border-radius:6px;
  background:#eceff3;
  background-image:none;
  color:#646d7b;
  font-size:12px;
  font-weight:850;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status.is-success{
  border-color:#b9dfca;
  background:#e8f6ee;
  color:#237b4b;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status.is-failed{
  border-color:#efc6ca;
  background:#fff0f1;
  color:#ad3f49;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary{
  grid-template-columns:minmax(0,1.35fr) minmax(138px,.65fr);
  gap:9px;
  margin:10px 16px;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary>div{
  min-height:49px;
  padding:9px 11px;
  border:1px solid #dfe3ea;
  border-radius:7px;
  background:#fff;
  background-image:none;
  box-shadow:0 5px 14px rgba(30,41,59,.05);
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary span{
  color:#7a8494;
  font-size:11px;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary strong{
  color:#202735;
  font-size:12px;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary .total strong{
  color:#b67822;
  font-size:16px;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-qr-wrap{
  min-height:244px;
  margin:0 16px 13px;
  padding:15px;
  border:1px solid #dfe3ea;
  border-radius:8px;
  background:#fff;
  background-image:none;
  box-shadow:0 8px 20px rgba(30,41,59,.055);
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-qr{
  width:212px;
  height:212px;
  padding:10px;
  border:1px solid #e3e6eb;
  border-radius:7px;
  background:#fff;
  color:#252a33;
  box-shadow:0 8px 22px rgba(30,41,59,.08);
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-notice,.jn-payment-error,.jn-payment-empty-state){
  margin:0 16px 13px;
  padding:13px;
  border-radius:7px;
  font-size:12px;
  line-height:1.6;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-notice{
  border:1px solid #d8dde5;
  background:#fff;
  color:#646d7b;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-error,.jn-payment-empty-state){
  border:1px solid #efc6ca;
  background:#fff0f1;
  color:#ad3f49;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state strong{
  color:#913740;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state span{
  color:#a75760;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:9px;
  padding:12px 16px 15px;
  border-top:1px solid #dfe3ea;
  background:#fff;
  background-image:none;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-primary,.jn-payment-secondary){
  min-width:132px;
  height:42px;
  border-radius:7px;
  padding:0 16px;
  font-size:13px;
  font-weight:850;
  box-shadow:none;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-primary{
  border:0;
  background:linear-gradient(90deg,#5d69de 0%,#4f78df 100%);
  color:#fff;
  box-shadow:0 9px 20px rgba(64,84,186,.21);
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-secondary{
  border:1px solid #d8dde5;
  background:#f3f5f8;
  background-image:none;
  color:#566071;
}
html:not(#jnPaymentUnifiedA#jnPaymentUnifiedB#jnPaymentUnifiedC#jnPaymentUnifiedD#jnPaymentUnifiedE#jnPaymentUnifiedF#jnPaymentUnifiedG#jnPaymentUnifiedH#jnPaymentUnifiedI#jnPaymentUnifiedJ#jnPaymentUnifiedK#jnPaymentUnifiedL#jnPaymentUnifiedM#jnPaymentUnifiedN#jnPaymentUnifiedO#jnPaymentUnifiedP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error{
  width:min(440px,calc(100vw - 28px));
  grid-template-rows:auto auto auto auto auto;
  border-color:#e2d0d3;
  border-radius:8px;
  background:#f4f6f9;
}

html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-layer{
  color:#f0f1f3;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel{
  border-color:#373a42;
  background:#1b1c20;
  background-image:none;
  color:#f0f1f3;
  box-shadow:0 30px 86px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-head,.jn-payment-actions){
  border-color:#34373e;
  background:#202228;
  background-image:none;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head span{
  border-color:#3a3e46;
  background:#24272d;
  color:#a2a6ae;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head span::before{
  background:#8b9099;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head h2{
  color:#f0f1f3;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head p{
  color:#969ba5;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-close{
  border-color:#3a3e46;
  background:#24272d;
  color:#d7d9de;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-close:hover{
  border-color:#50545e;
  background:#2b2e35;
  color:#fff;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status{
  border-color:#3a3e46;
  background:#24272d;
  color:#aeb2ba;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status.is-success{
  border-color:rgba(84,190,132,.32);
  background:#203128;
  color:#9ed8b8;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status.is-failed{
  border-color:rgba(242,125,142,.28);
  background:#292326;
  color:#f2b8c0;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary>div{
  border-color:#373a42;
  background:#24272d;
  box-shadow:0 6px 16px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary span{
  color:#969ba5;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary strong{
  color:#f0f1f3;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary .total strong{
  color:#f0c479;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-qr-wrap{
  border-color:#34373e;
  background:#18191d;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-qr{
  border-color:#3a3e46;
  box-shadow:0 10px 28px rgba(0,0,0,.24);
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-notice{
  border-color:#373a42;
  background:#24272d;
  color:#b5b9c1;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-error,.jn-payment-empty-state){
  border-color:rgba(242,125,142,.24);
  background:#292326;
  color:#f2b8c0;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state strong{
  color:#f5c4ca;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-empty-state span{
  color:#dca8af;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-secondary{
  border-color:#3a3e46;
  background:#24272d;
  color:#d7d9de;
}
html[data-theme="dark"]:not(#jnPaymentUnifiedDarkA#jnPaymentUnifiedDarkB#jnPaymentUnifiedDarkC#jnPaymentUnifiedDarkD#jnPaymentUnifiedDarkE#jnPaymentUnifiedDarkF#jnPaymentUnifiedDarkG#jnPaymentUnifiedDarkH#jnPaymentUnifiedDarkI#jnPaymentUnifiedDarkJ#jnPaymentUnifiedDarkK#jnPaymentUnifiedDarkL#jnPaymentUnifiedDarkM#jnPaymentUnifiedDarkN#jnPaymentUnifiedDarkO#jnPaymentUnifiedDarkP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error{
  border-color:#45363b;
  background:#1b1c20;
}

@media (max-width:760px){
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel,
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-panel.is-error{
    width:min(340px,calc(100vw - 24px));
    max-width:calc(100vw - 24px);
    max-height:calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px);
    border-radius:8px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head{
    padding:14px 14px 12px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-head h2{
    font-size:17px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-status{
    margin:10px 13px 0;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary{
    grid-template-columns:1fr;
    margin:9px 13px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-summary>div{
    min-height:42px;
    padding:7px 9px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-qr-wrap{
    min-height:0;
    margin:0 13px 10px;
    padding:11px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-qr{
    width:min(184px,50vw);
    height:min(184px,50vw);
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-notice,.jn-payment-error,.jn-payment-empty-state){
    margin:0 13px 10px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] .jn-payment-actions{
    grid-template-columns:1fr;
    padding:10px 13px 13px;
  }
  html:not(#jnPaymentUnifiedMobileA#jnPaymentUnifiedMobileB#jnPaymentUnifiedMobileC#jnPaymentUnifiedMobileD#jnPaymentUnifiedMobileE#jnPaymentUnifiedMobileF#jnPaymentUnifiedMobileG#jnPaymentUnifiedMobileH#jnPaymentUnifiedMobileI#jnPaymentUnifiedMobileJ#jnPaymentUnifiedMobileK#jnPaymentUnifiedMobileL#jnPaymentUnifiedMobileM#jnPaymentUnifiedMobileN#jnPaymentUnifiedMobileO#jnPaymentUnifiedMobileP) body:not(.page-admin) [data-front-app-public-root] :is(.jn-payment-primary,.jn-payment-secondary){
    width:100%;
    min-width:0;
    height:39px;
  }
}

/* Dark account-service chrome: join the shared header and navigation into one tall surface. */
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-shell{
  background:#25272d;
  background-image:none;
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.account-service-nav,.recharge-v2-head){
  background:#25272d;
  background-image:none;
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
  border-right:1px solid #3a3d45;
  box-shadow:inset -1px 0 0 rgba(255,255,255,.025);
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
  border-bottom-color:#3a3d45;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.02);
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-scroll{
  background:#202228;
  background-image:none;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button{
  color:#aeb3bd;
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:not(.is-active)>span{
  border-color:#41444c;
  background:#2d3037;
  background-image:none;
  color:#aeb3bd;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button:not(.is-active):hover{
  border-color:#464a54;
  background:#2b2e35;
  color:#e0e2e7;
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button.is-active{
  border-color:#5b606c;
  background:#30333b;
  background-image:none;
  color:#f3f4f7;
  box-shadow:inset 3px 0 0 #7b84de,inset 0 1px 0 rgba(255,255,255,.055);
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button.is-active>span{
  border-color:#646b81;
  background:#383c49;
  background-image:none;
  color:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="membership"].is-active{
  box-shadow:inset 3px 0 0 #d2ad57,inset 0 1px 0 rgba(255,255,255,.055);
}
html[data-theme="dark"]:not(#jnRechargeNavPaletteA#jnRechargeNavPaletteB#jnRechargeNavPaletteC#jnRechargeNavPaletteD#jnRechargeNavPaletteE#jnRechargeNavPaletteF#jnRechargeNavPaletteG#jnRechargeNavPaletteH#jnRechargeNavPaletteI#jnRechargeNavPaletteJ#jnRechargeNavPaletteK#jnRechargeNavPaletteL#jnRechargeNavPaletteM#jnRechargeNavPaletteN#jnRechargeNavPaletteO#jnRechargeNavPaletteP#jnRechargeNavPaletteQ#jnRechargeNavPaletteR#jnRechargeNavPaletteS#jnRechargeNavPaletteT#jnRechargeNavPaletteU#jnRechargeNavPaletteV#jnRechargeNavPaletteW#jnRechargeNavPaletteX#jnRechargeNavPaletteY#jnRechargeNavPaletteZ#jnRechargeNavPaletteAA#jnRechargeNavPaletteAB#jnRechargeNavPaletteAC#jnRechargeNavPaletteAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav>button[data-account-service-tab="redeem"].is-active{
  box-shadow:inset 3px 0 0 #61c7a7,inset 0 1px 0 rgba(255,255,255,.055);
}

/* Dark account-service hierarchy: lift the shared workspace, not its controls. */
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-shell{
  background:#1b1c20;
  background-image:none;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-scroll,.recharge-v2-head,.recharge-v2-pane,.recharge-v2-content-grid,.recharge-v2-main,.recharge-v2-aside,.recharge-v2-member-pane,.recharge-v2-redeem-pane){
  background:#202228;
  background-image:none;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-scroll{
  position:relative;
  z-index:2;
  box-shadow:inset 1px 0 0 rgba(255,255,255,.045);
}
@media (min-width:761px){
  html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-scroll{
    box-shadow:-14px 0 30px rgba(0,0,0,.26),inset 1px 0 0 rgba(255,255,255,.045);
  }
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-pane,.recharge-v2-content-grid){
  height:100%;
  min-height:0;
  overflow:hidden;
  box-sizing:border-box;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-content-grid{
  align-items:stretch;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.recharge-v2-main,.recharge-v2-aside){
  height:100%;
  min-height:0;
  box-sizing:border-box;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .recharge-v2-aside{
  border:0;
  border-left:1px solid #383b44;
  background:#202228;
  background-image:none;
}

/* Keep the sidebar recessed while controls stay flush with the shared workspace. */
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
  background:#1b1c20;
  background-image:none;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-head{
  border-bottom:1px solid #383b44;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav{
  border-right:0;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.account-service-nav button,.account-service-nav-balance,.recharge-v2-package,.recharge-v2-custom,.recharge-v2-custom-input,.recharge-v2-payment label>span,.recharge-v2-visual,.recharge-v2-aside-card,.recharge-v2-action button){
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service :is(.account-service-nav-balance,.recharge-v2-package,.recharge-v2-custom,.recharge-v2-payment label>span,.recharge-v2-visual,.recharge-v2-aside-card){
  background:#202228;
  background-image:none;
}
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-package.is-selected,
html[data-theme="dark"]:not(#jnRechargeSurfaceA#jnRechargeSurfaceB#jnRechargeSurfaceC#jnRechargeSurfaceD#jnRechargeSurfaceE#jnRechargeSurfaceF#jnRechargeSurfaceG#jnRechargeSurfaceH#jnRechargeSurfaceI#jnRechargeSurfaceJ#jnRechargeSurfaceK#jnRechargeSurfaceL#jnRechargeSurfaceM#jnRechargeSurfaceN#jnRechargeSurfaceO#jnRechargeSurfaceP#jnRechargeSurfaceQ#jnRechargeSurfaceR#jnRechargeSurfaceS#jnRechargeSurfaceT#jnRechargeSurfaceU#jnRechargeSurfaceV#jnRechargeSurfaceW#jnRechargeSurfaceX#jnRechargeSurfaceY#jnRechargeSurfaceZ) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-payment label:has(input:checked)>span{
  border-color:#737cdf;
  background:#202228;
  background-image:none;
  box-shadow:none;
}

/* Account-service detail polish: aligned dark cards, full balance values and clear pay selection. */
html:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  grid-template-columns:28px minmax(0,1fr);
  column-gap:4px;
  padding:7px;
}
html:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>.is-balance-copy>span{
  gap:2px;
}
html:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>.is-balance-copy strong{
  flex:0 0 auto;
  min-width:max-content;
  max-width:none;
  overflow:visible;
  text-overflow:clip;
  font-size:13px;
  letter-spacing:0;
}
html:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-pay-grid input:checked+span{
  border-color:#7d85ed;
  box-shadow:inset 0 0 0 1px rgba(125,133,237,.42);
}
html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance{
  border-color:#3a3e46;
  background:#202228;
  background-image:none;
  color:#f4f5f7;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance>.is-balance-icon{
  border-color:#454a54;
  background:#292c33;
  background-image:none;
  color:#d0d4dc;
  box-shadow:none;
}
html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance small{
  color:#9ea4ae;
  -webkit-text-fill-color:#9ea4ae;
}
html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance strong{
  color:#f4f5f7;
  -webkit-text-fill-color:#f4f5f7;
}
html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance em{
  color:#aeb3bd;
  -webkit-text-fill-color:#aeb3bd;
}
@media (min-width:761px){
  html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service #accountServiceGiftCard>.account-service-nav-gift-copy{
    border-color:#3a3e46;
    border-top-color:#34373e;
    background:linear-gradient(180deg,rgba(32,34,40,.08) 0%,rgba(32,34,40,.82) 30%,#202228 100%);
    box-shadow:0 12px 24px rgba(0,0,0,.16),inset 0 -1px 0 rgba(255,255,255,.04);
  }
}
html[data-theme="dark"]:not(#jnRechargeDetailA#jnRechargeDetailB#jnRechargeDetailC#jnRechargeDetailD#jnRechargeDetailE#jnRechargeDetailF#jnRechargeDetailG#jnRechargeDetailH#jnRechargeDetailI#jnRechargeDetailJ#jnRechargeDetailK#jnRechargeDetailL#jnRechargeDetailM#jnRechargeDetailN#jnRechargeDetailO#jnRechargeDetailP#jnRechargeDetailQ#jnRechargeDetailR#jnRechargeDetailS#jnRechargeDetailT#jnRechargeDetailU#jnRechargeDetailV#jnRechargeDetailW#jnRechargeDetailX#jnRechargeDetailY#jnRechargeDetailZ#jnRechargeDetailAA#jnRechargeDetailAB#jnRechargeDetailAC#jnRechargeDetailAD#jnRechargeDetailAE#jnRechargeDetailAF#jnRechargeDetailAG#jnRechargeDetailAH) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-pay-grid input:checked+span{
  background:#24262d;
  background-image:none;
  color:#f7f8ff;
}

/* Membership shop final alignment with the shared online recharge shell. */
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership{
  --member-final-bg:#f7f9ff;
  --member-final-surface:#fff;
  --member-final-control:#fff;
  --member-final-line:#e1e6ef;
  --member-final-line-strong:#cfd6e3;
  --member-final-text:#24293a;
  --member-final-soft:#566078;
  --member-final-muted:#81899d;
  --member-final-accent:#6974e8;
  --member-final-accent-soft:#eef0ff;
  --member-final-selected:#f7f7ff;
  --member-final-aside:#f7f9ff;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.recharge-v2-scroll,.recharge-v2-member-pane,.member-shop-layout){
  background:var(--member-final-bg);
  background-image:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .recharge-v2-member-pane{
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-layout{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  overflow:hidden;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-main{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:20px 24px 24px;
  overflow:auto;
  background:var(--member-final-bg);
  background-image:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-hero{
  display:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plans,.member-shop-checkout .recharge-v2-payment,.member-shop-checkout .recharge-v2-action){
  min-width:0;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plans{
  flex:0 0 auto;
  display:flex;
  flex-direction:column;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-section-head{
  min-height:27px;
  align-items:flex-start;
  margin:0 0 10px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-section-head h3,.member-shop-checkout .recharge-v2-section-head h3){
  margin:0;
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:15px;
  font-weight:800;
  line-height:20px;
  letter-spacing:0;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-section-head span{
  display:block;
  margin-top:3px;
  color:var(--member-final-muted);
  -webkit-text-fill-color:var(--member-final-muted);
  font-size:10.5px;
  font-weight:500;
  line-height:15px;
  letter-spacing:0;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-section-head>b{
  padding:4px 7px;
  border:1px solid rgba(105,116,232,.18);
  border-radius:5px;
  background:var(--member-final-accent-soft);
  color:var(--member-final-accent);
  -webkit-text-fill-color:var(--member-final-accent);
  font-size:10px;
  font-weight:750;
  line-height:14px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-grid,
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid.has-1,.member-shop-plan-grid.has-2){
  flex:none;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:126px;
  align-content:start;
  gap:10px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan{
  min-width:0;
  min-height:126px;
  height:126px;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto 1fr;
  align-content:start;
  gap:6px 8px;
  padding:13px 14px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  background-image:none;
  color:var(--member-final-text);
  box-shadow:none;
  transform:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan:hover{
  border-color:var(--member-final-line-strong);
  background:var(--member-final-surface);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan.is-selected{
  border-color:#7d85ed;
  background:var(--member-final-selected);
  background-image:none;
  box-shadow:inset 0 0 0 1px rgba(125,133,237,.32);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name strong{
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:13px;
  font-weight:800;
  line-height:18px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name small{
  padding:2px 5px;
  background:var(--member-final-accent-soft);
  color:var(--member-final-soft);
  -webkit-text-fill-color:var(--member-final-soft);
  font-size:9px;
  line-height:13px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price{
  color:var(--member-final-accent);
  -webkit-text-fill-color:var(--member-final-accent);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price strong{
  font-size:22px;
  font-weight:850;
  line-height:24px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-credit,.member-shop-plan-desc){
  color:var(--member-final-soft);
  -webkit-text-fill-color:var(--member-final-soft);
  font-size:10px;
  line-height:15px;
  letter-spacing:0;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-check{
  right:8px;
  bottom:8px;
  width:18px;
  height:18px;
  padding:0;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--member-final-accent);
  font-size:10px;
  line-height:18px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits{
  display:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
  margin:0;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-section-head{
  margin:0 0 10px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span{
  height:78px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 15px;
  align-items:center;
  gap:11px;
  padding:10px 12px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  background-image:none;
  color:var(--member-final-text);
  box-shadow:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label:hover>span{
  border-color:var(--member-final-line-strong);
  background:var(--member-final-surface);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span{
  border-color:#7d85ed;
  background:var(--member-final-selected);
  background-image:none;
  color:var(--member-final-text);
  box-shadow:inset 0 0 0 1px rgba(125,133,237,.42);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
  width:38px;
  height:38px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>strong{
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:12px;
  font-weight:750;
  line-height:17px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>i{
  position:static;
  width:14px;
  height:14px;
  border:1px solid #aab2c2;
  border-radius:50%;
  background:transparent;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span>i{
  border:4px solid #7d85ed;
  background:#fff;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action{
  display:block;
  height:58px;
  min-height:58px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>div{
  display:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>button{
  width:100%;
  height:58px;
  min-height:58px;
  margin:0;
  border-radius:8px;
  font-size:13px;
  font-weight:800;
  letter-spacing:0;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px;
  overflow:auto;
  border:0;
  border-left:1px solid var(--member-final-line);
  background:var(--member-final-aside);
  background-image:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title{
  min-height:58px;
  gap:10px;
  padding:0 0 11px;
  border-bottom:1px solid var(--member-final-line);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title::before{
  content:none;
  display:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title>span{
  width:40px;
  height:40px;
  border:1px solid rgba(105,116,232,.18);
  border-radius:8px;
  background:var(--member-final-accent-soft);
  color:var(--member-final-accent);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title h3{
  margin:0;
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:16px;
  font-weight:800;
  line-height:21px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title p{
  margin:3px 0 0;
  color:var(--member-final-muted);
  -webkit-text-fill-color:var(--member-final-muted);
  font-size:10px;
  line-height:14px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary{
  min-height:50px;
  padding:9px 10px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  background-image:none;
  box-shadow:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary :is(small,strong){
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary small{
  font-size:9px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary strong{
  font-size:12px;
}


html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary>span{
  padding:4px 7px;
  border-radius:5px;
  background:var(--member-final-accent-soft);
  color:var(--member-final-accent);
  -webkit-text-fill-color:var(--member-final-accent);
  font-size:9px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-list{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:7px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit{
  min-width:0;
  min-height:58px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:8px 9px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  background-image:none;
  box-shadow:none;
  opacity:1;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit>span{
  width:34px;
  height:34px;
  border:0;
  border-radius:7px;
  background:var(--member-final-accent-soft);
  color:var(--member-final-accent);
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit>div{
  min-width:0;
  display:grid;
  gap:2px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit strong{
  overflow:hidden;
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:11.5px;
  font-weight:750;
  line-height:16px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit small{
  overflow:hidden;
  color:var(--member-final-muted);
  -webkit-text-fill-color:var(--member-final-muted);
  font-size:9.5px;
  font-weight:500;
  line-height:14px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status{
  min-width:42px;
  padding:4px 6px;
  border:1px solid transparent;
  border-radius:5px;
  font-size:9px;
  font-style:normal;
  font-weight:800;
  line-height:12px;
  text-align:center;
  white-space:nowrap;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-included{
  border-color:#bce8d6;
  background:#eaf8f2;
  color:#16815d;
  -webkit-text-fill-color:#16815d;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-disabled{
  border-color:#dfe3ea;
  background:#f0f2f5;
  color:#858d9c;
  -webkit-text-fill-color:#858d9c;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-metric{
  border-color:#d5d8fb;
  background:#eff0ff;
  color:#5965d4;
  -webkit-text-fill-color:#5965d4;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-info{
  border-color:#cce9ef;
  background:#edf9fb;
  color:#247c8b;
  -webkit-text-fill-color:#247c8b;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-note{
  margin:0;
  padding:9px 10px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  color:var(--member-final-muted);
  -webkit-text-fill-color:var(--member-final-muted);
  font-size:9px;
  line-height:14px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-balance-icon,
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-balance-copy{
  display:none;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-icon{
  display:grid;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy{
  min-width:0;
  display:block;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context{
  min-height:58px;
  height:auto;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:7px;
  padding:7px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy small{
  display:block;
  margin:0 0 2px;
  font-size:9px;
  line-height:12px;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy>span{
  min-width:0;
  display:block;
}
html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy strong{
  min-width:0;
  max-width:none;
  display:block;
  overflow:visible;
  color:inherit;
  -webkit-text-fill-color:currentColor;
  font-size:10.5px;
  font-weight:750;
  line-height:14px;
  letter-spacing:0;
  text-overflow:clip;
  white-space:normal;
  overflow-wrap:anywhere;
}

html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership{
  --member-final-bg:#202228;
  --member-final-surface:#24272d;
  --member-final-control:#24272d;
  --member-final-line:#3a3e46;
  --member-final-line-strong:#50545e;
  --member-final-text:#f0f1f3;
  --member-final-soft:#c4c8cf;
  --member-final-muted:#9da2ab;
  --member-final-accent:#8a92f3;
  --member-final-accent-soft:#2c2f3c;
  --member-final-selected:#24262d;
  --member-final-aside:#202228;
}
html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-included{
  border-color:rgba(72,201,145,.28);
  background:rgba(42,159,113,.14);
  color:#6ed5aa;
  -webkit-text-fill-color:#6ed5aa;
}
html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-disabled{
  border-color:#454952;
  background:#2d3036;
  color:#a0a5ae;
  -webkit-text-fill-color:#a0a5ae;
}
html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-metric{
  border-color:rgba(138,146,243,.30);
  background:rgba(113,122,230,.15);
  color:#aab0ff;
  -webkit-text-fill-color:#aab0ff;
}
html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status.is-info{
  border-color:rgba(75,181,199,.28);
  background:rgba(47,151,171,.14);
  color:#86d3df;
  -webkit-text-fill-color:#86d3df;
}
html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit.is-disabled>span{
  background:#2d3036;
  color:#8f949e;
}
html[data-theme="dark"]:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid input:checked+span>i{
  background:#24272d;
}

@media (max-width:760px){
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .recharge-v2-scroll{
    overflow-y:auto;
    overflow-x:hidden;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .recharge-v2-member-pane{
    height:auto;
    min-height:100%;
    overflow:visible;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-layout{
    height:auto;
    min-height:100%;
    display:block;
    overflow:visible;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-main{
    height:auto;
    min-height:100%;
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:14px 12px 18px;
    overflow:visible;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-section-head{
    min-height:0;
    margin-bottom:9px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-section-head h3,.member-shop-checkout .recharge-v2-section-head h3){
    font-size:14px;
    line-height:19px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-section-head span{
    display:block;
    font-size:10px;
    line-height:14px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-section-head>b{
    padding:3px 6px;
    font-size:9px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-grid,
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid.has-1,.member-shop-plan-grid.has-2,.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-4,.member-shop-plan-grid.has-5,.member-shop-plan-grid.has-6){
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-auto-rows:auto;
    gap:8px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-grid.has-1{
    grid-template-columns:minmax(0,1fr);
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan{
    min-height:116px;
    height:auto;
    padding:11px 10px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name{
    gap:4px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name strong{
    font-size:12px;
    line-height:17px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name small{
    font-size:9.5px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price strong{
    font-size:19px;
    line-height:21px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-credit,.member-shop-plan-desc){
    display:block;
    font-size:10px;
    line-height:14px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-desc{
    max-height:26px;
    overflow:hidden;
    text-overflow:clip;
    white-space:normal;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits{
    min-width:0;
    display:flex;
    flex-direction:column;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head{
    min-height:34px;
    margin:0 0 9px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head strong{
    color:var(--member-final-text);
    -webkit-text-fill-color:var(--member-final-text);
    font-size:13px;
    line-height:18px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head small{
    display:block;
    color:var(--member-final-muted);
    -webkit-text-fill-color:var(--member-final-muted);
    font-size:10px;
    line-height:14px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head>span{
    color:var(--member-final-accent);
    -webkit-text-fill-color:var(--member-final-accent);
    font-size:10px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:none;
    gap:7px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit{
    min-height:76px;
    display:grid;
    grid-template-columns:30px minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:center;
    gap:3px 7px;
    padding:8px;
    text-align:left;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit>span{
    grid-row:1 / 3;
    width:30px;
    height:30px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit>div{
    width:auto;
    min-width:0;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit strong{
    font-size:12px;
    line-height:16px;
    text-align:left;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit small{
    font-size:10px;
    line-height:14px;
    text-align:left;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit-status{
    grid-column:2;
    justify-self:start;
    min-width:0;
    padding:2px 5px;
    font-size:9px;
    line-height:12px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout{
    grid-template-columns:minmax(0,1fr);
    gap:12px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-payment{
    padding:0;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span{
    height:58px;
    grid-template-columns:30px minmax(0,1fr) 13px;
    gap:7px;
    padding:7px 8px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>.front-pay-brand-icon{
    width:30px;
    height:30px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-pay-grid label>span>strong{
    font-size:11px;
    line-height:15px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action{
    height:52px;
    min-height:52px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>button{
    height:52px;
    min-height:52px;
    font-size:13px;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside{
    display:none;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context{
    min-height:42px;
    height:auto;
  }
  html:not(#jnMemberUnifiedA#jnMemberUnifiedB#jnMemberUnifiedC#jnMemberUnifiedD#jnMemberUnifiedE#jnMemberUnifiedF#jnMemberUnifiedG#jnMemberUnifiedH#jnMemberUnifiedI#jnMemberUnifiedJ#jnMemberUnifiedK#jnMemberUnifiedL#jnMemberUnifiedM#jnMemberUnifiedN#jnMemberUnifiedO#jnMemberUnifiedP#jnMemberUnifiedQ#jnMemberUnifiedR#jnMemberUnifiedS#jnMemberUnifiedT#jnMemberUnifiedU#jnMemberUnifiedV#jnMemberUnifiedW#jnMemberUnifiedX#jnMemberUnifiedY#jnMemberUnifiedZ#jnMemberUnifiedAA#jnMemberUnifiedAB#jnMemberUnifiedAC#jnMemberUnifiedAD#jnMemberUnifiedAE#jnMemberUnifiedAF#jnMemberUnifiedAG#jnMemberUnifiedAH#jnMemberUnifiedAI#jnMemberUnifiedAJ#jnMemberUnifiedAK#jnMemberUnifiedAL) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .account-service-nav-balance.is-membership-context>.is-member-copy strong{
    font-size:10px;
    line-height:13px;
  }
}

/* Redeem center final pass: readable theme colors and unconstrained mobile scrolling. */
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --redeem-bg:#f3f5f8;
  --redeem-panel:#ffffff;
  --redeem-panel-alt:#f7f8fb;
  --redeem-line:#dce1ea;
  --redeem-line-strong:#c5cdd9;
  --redeem-text:#172033;
  --redeem-soft:#354258;
  --redeem-muted:#66738a;
}
html[data-theme="dark"]:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --redeem-bg:#17181c;
  --redeem-panel:#202228;
  --redeem-panel-alt:#1b1c20;
  --redeem-line:#3a3d46;
  --redeem-line-strong:#50545f;
  --redeem-text:#f4f5f7;
  --redeem-soft:#d4d7de;
  --redeem-muted:#aeb4c0;
}
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy p{
  font-size:13px;
  color:var(--redeem-muted);
}
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.redeem-v3-entry>small,.redeem-v3-guide-head>span){
  font-size:11px;
  color:var(--redeem-muted);
}
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item strong{
  font-size:13px;
  color:var(--redeem-text);
}
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item small{
  font-size:11px;
  color:var(--redeem-muted);
}
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip strong{
  font-size:12px;
  color:var(--redeem-text);
}
html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip p{
  font-size:11px;
  color:var(--redeem-soft);
}

@media (max-width:760px){
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-scroll{
    overflow-y:auto;
    overflow-x:hidden;
    background:var(--redeem-bg);
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
    height:auto;
    min-height:100%;
    display:block;
    padding:12px 10px 18px;
    overflow:visible;
    background:var(--redeem-bg);
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.redeem-v3-shell,.redeem-v3-card){
    height:auto;
    min-height:0;
    overflow:visible;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-hero-copy p{
    font-size:12px;
    line-height:1.55;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.redeem-v3-entry>small,.redeem-v3-guide-head>span){
    font-size:11px;
    line-height:1.55;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-head h3{
    font-size:16px;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item{
    min-height:64px;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item strong{
    font-size:13px;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-guide-item small{
    font-size:11px;
    line-height:1.5;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip strong{
    font-size:13px;
  }
  html:not(#jnRedeemFinalA#jnRedeemFinalB#jnRedeemFinalC#jnRedeemFinalD#jnRedeemFinalE#jnRedeemFinalF#jnRedeemFinalG#jnRedeemFinalH#jnRedeemFinalI#jnRedeemFinalJ#jnRedeemFinalK#jnRedeemFinalL#jnRedeemFinalM#jnRedeemFinalN#jnRedeemFinalO#jnRedeemFinalP#jnRedeemFinalQ#jnRedeemFinalR#jnRedeemFinalS#jnRedeemFinalT#jnRedeemFinalU#jnRedeemFinalV#jnRedeemFinalW#jnRedeemFinalX#jnRedeemFinalY#jnRedeemFinalZ#jnRedeemFinalAA#jnRedeemFinalAB#jnRedeemFinalAC#jnRedeemFinalAD) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-v3-tip p{
    font-size:11px;
    line-height:1.55;
  }
}

/* Reference-style redeem center: one visual system for desktop, mobile, light and dark. */
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --redeem-ref-workspace:#f6f7fc;
  --redeem-ref-surface:#ffffff;
  --redeem-ref-control:#fafaff;
  --redeem-ref-text:#25263a;
  --redeem-ref-soft:#55586f;
  --redeem-ref-muted:#8b8ea4;
  --redeem-ref-line:#e7e7f1;
  --redeem-ref-line-strong:#d8d9e8;
  --redeem-ref-accent:#6675f5;
  --redeem-ref-accent-end:#8b5de8;
  --redeem-ref-accent-soft:rgba(105,112,242,.10);
  --redeem-ref-tip:#f4f2ff;
  --redeem-ref-tip-line:#e6e0ff;
  --redeem-ref-shadow:0 16px 38px rgba(48,51,86,.08);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem{
  --redeem-ref-workspace:#202228;
  --redeem-ref-surface:#25272e;
  --redeem-ref-control:#1d1f25;
  --redeem-ref-text:#f5f5fa;
  --redeem-ref-soft:#d2d3dd;
  --redeem-ref-muted:#a5a8b8;
  --redeem-ref-line:#3a3d47;
  --redeem-ref-line-strong:#4a4e5a;
  --redeem-ref-accent:#8490ff;
  --redeem-ref-accent-end:#a176f5;
  --redeem-ref-accent-soft:rgba(132,144,255,.14);
  --redeem-ref-tip:#2b2938;
  --redeem-ref-tip-line:#45405d;
  --redeem-ref-shadow:0 18px 42px rgba(0,0,0,.18);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-scroll,
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
  background:var(--redeem-ref-workspace);
  background-image:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-shell{
  width:100%;
  min-width:0;
  min-height:100%;
  display:flex;
  margin:auto;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-form{
  width:100%;
  min-width:0;
  min-height:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-content:center;
  gap:0;
  margin:0 auto;
  padding:30px 64px 28px;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:var(--redeem-ref-surface);
  background-image:none;
  box-shadow:none;
  color:var(--redeem-ref-text);
  text-align:left;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-hero{
  display:block;
  margin:0;
  text-align:center;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-scene{
  position:relative;
  width:100%;
  height:146px;
  margin:0 auto 2px;
  overflow:hidden;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket{
  position:absolute;
  left:50%;
  top:50%;
  width:198px;
  height:96px;
  overflow:visible;
  border:1px solid rgba(255,255,255,.32);
  border-radius:18px;
  background:linear-gradient(135deg,#6579f7 0%,#7669f1 48%,#985be2 100%);
  box-shadow:0 18px 28px rgba(72,80,118,.12);
  transform:translate(-50%,-48%) rotate(-3deg);
}
html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket{
  box-shadow:0 18px 28px rgba(0,0,0,.28);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::before,
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::after{
  content:"";
  position:absolute;
  top:50%;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--redeem-ref-surface);
  transform:translateY(-50%);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::before{left:-10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::after{right:-10px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-gift{
  position:absolute;
  left:22px;
  top:18px;
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.26);
  border-radius:8px;
  background:rgba(255,255,255,.16);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-gift .recharge-v2-icon{
  width:31px;
  height:31px;
  stroke-width:1.8;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-code{
  position:absolute;
  left:90px;
  top:24px;
  color:rgba(255,255,255,.96);
  font-size:11px;
  font-weight:900;
  line-height:1;
  letter-spacing:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-line{
  position:absolute;
  left:89px;
  top:46px;
  width:66px;
  height:1px;
  background:rgba(255,255,255,.38);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-dots{
  position:absolute;
  left:91px;
  top:59px;
  display:flex;
  gap:6px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-dots i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:rgba(255,255,255,.64);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift{
  position:absolute;
  width:66px;
  height:66px;
  color:rgba(116,111,224,.10);
  transform:rotate(-12deg);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift .recharge-v2-icon{
  width:100%;
  height:100%;
  stroke-width:1.25;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift.is-left{left:calc(50% - 190px);top:43px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift.is-right{right:calc(50% - 191px);top:27px;transform:rotate(14deg)}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star{
  position:absolute;
  color:#817af2;
  opacity:.54;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star .recharge-v2-icon{width:100%;height:100%;stroke-width:1.5}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star.is-one{left:calc(50% - 148px);top:18px;width:20px;height:20px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star.is-two{right:calc(50% - 153px);top:72px;width:16px;height:16px}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star.is-three{right:calc(50% - 113px);top:8px;width:12px;height:12px;opacity:.34}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-hero h2{
  margin:0;
  color:var(--redeem-ref-text);
  -webkit-text-fill-color:var(--redeem-ref-text);
  font-size:28px;
  font-weight:850;
  line-height:1.3;
  letter-spacing:0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-hero p{
  margin:6px 0 0;
  color:var(--redeem-ref-muted);
  -webkit-text-fill-color:var(--redeem-ref-muted);
  font-size:13px;
  font-weight:500;
  line-height:1.55;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-entry{
  width:min(760px,100%);
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:8px;
  margin:22px auto 0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-entry>label{
  color:var(--redeem-ref-text);
  -webkit-text-fill-color:var(--redeem-ref-text);
  font-size:14px;
  font-weight:800;
  line-height:1.4;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input{
  width:100%;
  min-width:0;
  height:60px;
  display:grid;
  grid-template-columns:23px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:0 9px 0 17px;
  border:1px solid var(--redeem-ref-line-strong);
  border-radius:8px;
  background:var(--redeem-ref-control);
  box-shadow:inset 0 1px 2px rgba(37,38,58,.035);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input:focus-within{
  border-color:var(--redeem-ref-accent);
  background:var(--redeem-ref-surface);
  box-shadow:0 0 0 3px var(--redeem-ref-accent-soft);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input>.recharge-v2-icon{
  width:23px;
  height:23px;
  color:var(--redeem-ref-accent);
  stroke-width:1.8;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem #frontRedeemCode{
  width:100%;
  min-width:0;
  height:56px;
  padding:0;
  border:0;
  border-radius:0;
  outline:0;
  background:transparent;
  color:var(--redeem-ref-text);
  -webkit-text-fill-color:var(--redeem-ref-text);
  font-size:15px;
  font-weight:650;
  line-height:56px;
  text-align:left;
  letter-spacing:0;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem #frontRedeemCode::placeholder{
  color:var(--redeem-ref-muted);
  -webkit-text-fill-color:var(--redeem-ref-muted);
  font-weight:500;
  opacity:1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste{
  width:auto;
  min-width:82px;
  height:42px;
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 14px;
  border:0;
  border-radius:7px;
  background:var(--redeem-ref-accent-soft);
  color:var(--redeem-ref-accent);
  -webkit-text-fill-color:var(--redeem-ref-accent);
  font-size:13px;
  font-weight:800;
  line-height:1;
  box-shadow:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste:hover{
  background:rgba(105,112,242,.17);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste .recharge-v2-icon{
  width:17px;
  height:17px;
  stroke-width:1.8;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-entry>small{
  color:var(--redeem-ref-muted);
  -webkit-text-fill-color:var(--redeem-ref-muted);
  font-size:11px;
  font-weight:500;
  line-height:1.5;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit{
  width:min(760px,100%);
  height:56px;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin:14px auto 0;
  padding:0 20px;
  border:0;
  border-radius:8px;
  background:linear-gradient(90deg,var(--redeem-ref-accent) 0%,var(--redeem-ref-accent-end) 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:15px;
  font-weight:850;
  line-height:1;
  box-shadow:0 10px 22px rgba(110,101,229,.22);
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit:hover:not(:disabled){
  filter:brightness(1.035);
  transform:translateY(-1px);
  box-shadow:0 13px 25px rgba(110,101,229,.28);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit:disabled{
  color:var(--redeem-ref-muted);
  -webkit-text-fill-color:var(--redeem-ref-muted);
  cursor:not-allowed;
  filter:none;
  transform:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit .recharge-v2-icon{
  width:19px;
  height:19px;
  stroke-width:2;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide{
  width:min(820px,100%);
  margin:23px auto 0;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:14px;
  color:var(--redeem-ref-soft);
  -webkit-text-fill-color:var(--redeem-ref-soft);
  font-size:12px;
  font-weight:800;
  line-height:1;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider::before,
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider::after{
  content:"";
  height:1px;
  background:var(--redeem-ref-line);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
  margin-top:18px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article{
  min-width:0;
  display:grid;
  justify-items:center;
  align-content:start;
  gap:6px;
  padding:0 10px;
  border:0;
  background:transparent;
  text-align:center;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>span{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  margin-bottom:2px;
  border:1px solid rgba(105,112,242,.12);
  border-radius:50%;
  background:var(--redeem-ref-accent-soft);
  color:var(--redeem-ref-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>span .recharge-v2-icon{
  width:24px;
  height:24px;
  stroke-width:1.75;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>strong{
  color:var(--redeem-ref-text);
  -webkit-text-fill-color:var(--redeem-ref-text);
  font-size:13px;
  font-weight:800;
  line-height:1.35;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>small{
  color:var(--redeem-ref-muted);
  -webkit-text-fill-color:var(--redeem-ref-muted);
  font-size:11px;
  font-weight:500;
  line-height:1.45;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip{
  width:min(820px,100%);
  min-width:0;
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  align-items:center;
  gap:13px;
  margin:21px auto 0;
  padding:13px 16px;
  border:1px solid var(--redeem-ref-tip-line);
  border-radius:8px;
  background:var(--redeem-ref-tip);
  background-image:none;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip>span{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--redeem-ref-accent-soft);
  color:var(--redeem-ref-accent);
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip>span .recharge-v2-icon{
  width:22px;
  height:22px;
  stroke-width:1.8;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip>div{
  min-width:0;
  display:grid;
  gap:2px;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip strong{
  color:var(--redeem-ref-text);
  -webkit-text-fill-color:var(--redeem-ref-text);
  font-size:12px;
  font-weight:800;
  line-height:1.35;
}
body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip p{
  margin:0;
  color:var(--redeem-ref-muted);
  -webkit-text-fill-color:var(--redeem-ref-muted);
  font-size:11px;
  font-weight:500;
  line-height:1.5;
}

@media (min-width:761px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
    min-height:100%;
    height:100%;
    display:flex;
    padding:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-shell,
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-form{
    height:100%;
  }
}

@media (max-width:760px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-scroll{
    overflow-y:auto;
    overflow-x:hidden;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
    min-height:100%;
    display:block;
    padding:10px 9px 18px;
    overflow:visible;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-shell{
    width:100%;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-form{
    width:100%;
    min-height:0;
    align-content:start;
    padding:10px 6px 16px;
    overflow:visible;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-scene{
    height:92px;
    margin-bottom:1px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket{
    width:136px;
    height:66px;
    border-radius:13px;
    box-shadow:0 10px 19px rgba(72,80,118,.11);
  }
  html[data-theme="dark"] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket{
    box-shadow:0 10px 19px rgba(0,0,0,.26);
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::before,
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::after{
    width:13px;
    height:13px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::before{left:-7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket::after{right:-7px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-gift{
    left:15px;
    top:13px;
    width:38px;
    height:38px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-gift .recharge-v2-icon{
    width:22px;
    height:22px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-code{
    left:61px;
    top:16px;
    font-size:8px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-line{
    left:61px;
    top:31px;
    width:45px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-dots{
    left:62px;
    top:41px;
    gap:4px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ticket-dots i{
    width:5px;
    height:5px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift{
    width:39px;
    height:39px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift.is-left{left:calc(50% - 122px);top:31px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-ghost-gift.is-right{right:calc(50% - 124px);top:20px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star.is-one{left:calc(50% - 91px);top:11px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star.is-two{right:calc(50% - 92px);top:48px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-star.is-three{right:calc(50% - 69px);top:4px}
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-hero h2{
    font-size:23px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-hero p{
    margin-top:4px;
    font-size:12px;
    line-height:1.5;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-entry{
    gap:7px;
    margin-top:16px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-entry>label{
    font-size:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input{
    height:54px;
    grid-template-columns:20px minmax(0,1fr) auto;
    gap:8px;
    padding:0 6px 0 12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input>.recharge-v2-icon{
    width:20px;
    height:20px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem #frontRedeemCode{
    height:50px;
    font-size:14px;
    line-height:50px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste{
    min-width:68px;
    height:38px;
    min-height:38px;
    padding:0 10px;
    font-size:12px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-entry>small{
    font-size:9.5px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit{
    height:52px;
    min-height:52px;
    margin-top:12px;
    font-size:14px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide{
    margin-top:17px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider{
    gap:10px;
    font-size:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid{
    gap:4px;
    margin-top:13px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article{
    gap:4px;
    padding:0 2px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>span{
    width:42px;
    height:42px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>span .recharge-v2-icon{
    width:20px;
    height:20px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>strong{
    font-size:11.5px;
    line-height:1.3;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>small{
    font-size:10px;
    line-height:1.4;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip{
    grid-template-columns:40px minmax(0,1fr);
    gap:10px;
    margin-top:15px;
    padding:10px 11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip>span{
    width:40px;
    height:40px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip strong{
    font-size:11px;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip p{
    font-size:10px;
    line-height:1.45;
  }
}

@media (max-width:360px){
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste{
    min-width:38px;
    width:38px;
    padding:0;
  }
  body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste>span{
    display:none;
  }
}

/* Keep the redeem action and key text readable above global light-mode modal rules. */
html:not(#jnRedeemContrastA#jnRedeemContrastB#jnRedeemContrastC#jnRedeemContrastD) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit{
  border-color:transparent;
  background:linear-gradient(90deg,var(--redeem-ref-accent) 0%,var(--redeem-ref-accent-end) 100%);
  background-image:linear-gradient(90deg,var(--redeem-ref-accent) 0%,var(--redeem-ref-accent-end) 100%);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html:not(#jnRedeemContrastA#jnRedeemContrastB#jnRedeemContrastC#jnRedeemContrastD) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit>span,
html:not(#jnRedeemContrastA#jnRedeemContrastB#jnRedeemContrastC#jnRedeemContrastD) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit>.recharge-v2-icon{
  color:#fff;
  -webkit-text-fill-color:#fff;
  opacity:1;
  text-shadow:0 1px 2px rgba(45,38,118,.22);
}
html:not(#jnRedeemContrastA#jnRedeemContrastB#jnRedeemContrastC#jnRedeemContrastD) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.redeem-reference-hero h2,.redeem-reference-entry>label,.redeem-reference-divider,.redeem-reference-guide-grid article>strong,.redeem-reference-tip strong){
  color:var(--redeem-ref-text);
  -webkit-text-fill-color:var(--redeem-ref-text);
}

/* Final redeem fill and color alignment with the shared recharge workspace. */
html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.recharge-v2-scroll,.recharge-v2-redeem-pane,.redeem-reference-form){
  background:var(--redeem-ref-workspace);
  background-image:none;
}
html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-form{
  width:100%;
  min-width:0;
  min-height:100%;
  margin:0;
  padding:28px 48px 26px;
  border:0;
  border-radius:0;
  box-shadow:none;
}
html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.redeem-reference-ticket::before,.redeem-reference-ticket::after){
  background:var(--redeem-ref-workspace);
}
html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem :is(.redeem-reference-entry,.redeem-reference-submit,.redeem-reference-guide,.redeem-reference-tip){
  width:min(860px,100%);
}

@media (max-width:760px){
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .recharge-v2-redeem-pane{
    width:100%;
    min-width:0;
    padding:0;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-shell{
    width:100%;
    min-width:0;
    margin:0;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-form{
    min-height:0;
    padding:22px 16px 20px;
    overflow:visible;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input{
    height:58px;
    grid-template-columns:22px minmax(0,1fr) auto;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-input>.recharge-v2-icon{
    width:22px;
    height:22px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem #frontRedeemCode{
    height:54px;
    font-size:15px;
    line-height:54px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste{
    min-width:74px;
    height:42px;
    min-height:42px;
    font-size:12.5px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-paste .recharge-v2-icon{
    width:18px;
    height:18px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit{
    width:min(280px,84%);
    height:46px;
    min-height:46px;
    margin-left:auto;
    margin-right:auto;
    font-size:14px;
    font-weight:850;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-submit .recharge-v2-icon{
    width:17px;
    height:17px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>span{
    width:46px;
    height:46px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-guide-grid article>span .recharge-v2-icon{
    width:23px;
    height:23px;
  }
  html:not(#jnRedeemFillA#jnRedeemFillB#jnRedeemFillC#jnRedeemFillD#jnRedeemFillE#jnRedeemFillF#jnRedeemFillG#jnRedeemFillH#jnRedeemFillI#jnRedeemFillJ#jnRedeemFillK#jnRedeemFillL#jnRedeemFillM#jnRedeemFillN#jnRedeemFillO#jnRedeemFillP#jnRedeemFillQ#jnRedeemFillR#jnRedeemFillS#jnRedeemFillT#jnRedeemFillU#jnRedeemFillV#jnRedeemFillW#jnRedeemFillX#jnRedeemFillY#jnRedeemFillZ#jnRedeemFillAA#jnRedeemFillAB#jnRedeemFillAC#jnRedeemFillAD#jnRedeemFillAE#jnRedeemFillAF) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-tip>span{
    width:42px;
    height:42px;
  }
}

/* Membership shop polish: shared payment cards, clearer plans and one-piece benefits. */
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership{
  --member-polish-gold:#c99026;
  --member-polish-gold-soft:#fff6df;
  --member-polish-shadow:0 8px 22px rgba(54,63,101,.065);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-layout{
  grid-template-columns:minmax(0,1fr) 328px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-main{
  gap:18px;
  padding:20px 24px 24px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid,.member-shop-plan-grid.has-1,.member-shop-plan-grid.has-2,.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-4,.member-shop-plan-grid.has-5,.member-shop-plan-grid.has-6){
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:auto;
  gap:12px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-grid.has-1{
  grid-template-columns:minmax(0,1fr);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-5,.member-shop-plan-grid.has-6){
  grid-template-columns:repeat(3,minmax(0,1fr));
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan{
  position:relative;
  min-height:146px;
  height:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto auto auto;
  grid-template-areas:"head" "price" "credit";
  align-content:start;
  gap:0;
  padding:14px 15px 13px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  box-shadow:var(--member-polish-shadow);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan:hover{
  border-color:var(--member-final-line-strong);
  background:var(--member-final-surface);
  box-shadow:0 10px 24px rgba(54,63,101,.09);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan.is-selected{
  border-color:#7d85ed;
  background:var(--member-final-selected);
  box-shadow:inset 0 0 0 1px rgba(125,133,237,.32),0 9px 22px rgba(83,91,184,.10);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-top{
  grid-area:head;
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
  padding-right:24px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-symbol{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border:1px solid rgba(201,144,38,.22);
  border-radius:8px;
  background:var(--member-polish-gold-soft);
  color:var(--member-polish-gold);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-symbol .recharge-v2-icon{
  width:20px;
  height:20px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name{
  min-width:0;
  display:grid;
  gap:2px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name strong{
  overflow:hidden;
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:14px;
  font-weight:850;
  line-height:19px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name small{
  width:max-content;
  max-width:100%;
  padding:0;
  border:0;
  background:transparent;
  color:var(--member-final-muted);
  -webkit-text-fill-color:var(--member-final-muted);
  font-size:10.5px;
  font-weight:600;
  line-height:15px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price{
  grid-area:price;
  min-width:0;
  display:flex;
  align-items:flex-end;
  gap:3px;
  margin:11px 0 9px;
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price i{
  margin-bottom:3px;
  color:var(--member-final-soft);
  -webkit-text-fill-color:var(--member-final-soft);
  font-size:13px;
  font-style:normal;
  line-height:17px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price strong{
  color:var(--member-final-text);
  -webkit-text-fill-color:var(--member-final-text);
  font-size:27px;
  font-weight:900;
  line-height:29px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price small{
  margin:0 0 3px 5px;
  color:var(--member-final-muted);
  -webkit-text-fill-color:var(--member-final-muted);
  font-size:10px;
  font-weight:600;
  line-height:15px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-credit{
  grid-area:credit;
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px;
  padding-top:9px;
  border-top:1px solid var(--member-final-line);
  color:var(--member-final-soft);
  -webkit-text-fill-color:var(--member-final-soft);
  font-size:11px;
  font-weight:650;
  line-height:16px;
  white-space:nowrap;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-credit .recharge-v2-icon{
  width:15px;
  height:15px;
  flex:0 0 15px;
  color:var(--member-final-accent);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-check{
  position:absolute;
  top:12px;
  right:12px;
  bottom:auto;
  width:21px;
  height:21px;
  display:none;
  place-items:center;
  border-radius:50%;
  background:var(--member-final-accent);
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:11px;
  line-height:21px;
}


html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan.is-selected .member-shop-plan-check{
  display:grid;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout{
  gap:14px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid label>span{
  height:78px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 10px;
  border:1px solid var(--member-final-line);
  border-radius:11px;
  background:var(--member-final-control);
  color:var(--member-final-text);
  box-shadow:0 5px 14px rgba(55,65,105,.045);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid label:hover>span{
  border-color:var(--member-final-line-strong);
  background:var(--member-final-surface);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid input:checked+span{
  border-color:#7d85ed;
  background:#f3f6ff;
  color:#333645;
  box-shadow:inset 0 0 0 1px rgba(125,133,237,.42);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid label>span>.front-pay-brand-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid label>span>strong{
  color:inherit;
  -webkit-text-fill-color:currentColor;
  font-size:12px;
  font-weight:850;
  line-height:12px;
  text-align:center;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid .front-pay-brand-icon.is-alipay{
  border:0;
  border-radius:8px;
  background:transparent;
  color:#1677ff;
  box-shadow:none;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid .front-pay-brand-icon.is-alipay::after{
  display:none;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid .front-pay-brand-icon.is-alipay>.front-pay-alipay-mark{
  width:100%;
  height:100%;
  fill:#1677ff;
  stroke:none;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid .front-pay-brand-icon.is-wechat{
  border:0;
  border-radius:50%;
  background:#07c160;
  color:#fff;
  box-shadow:none;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid .front-pay-brand-icon.is-wechat>svg{
  width:76%;
  height:76%;
  fill:#fff;
  color:#fff;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action{
  height:58px;
  min-height:58px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>button{
  height:58px;
  min-height:58px;
  border-radius:14px;
  font-size:14px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside{
  gap:11px;
  padding:15px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title{
  min-height:60px;
  padding-bottom:12px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-title p{
  font-size:11px;
  line-height:16px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary{
  min-height:54px;
  padding:9px 11px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary small{
  font-size:10px;
  line-height:14px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-selected-summary strong{
  font-size:13px;
  line-height:18px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-list{
  display:block;
  overflow:hidden;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  box-shadow:var(--member-polish-shadow);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit{
  min-height:50px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:7px 10px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit+.member-shop-benefit{
  border-top:1px solid var(--member-final-line);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit>span{
  width:32px;
  height:32px;
  border:0;
  border-radius:7px;
  background:var(--member-final-accent-soft);
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit>span .recharge-v2-icon{
  width:17px;
  height:17px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit strong{
  font-size:12px;
  line-height:17px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit small{
  font-size:10.5px;
  line-height:15px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-benefit-status{
  min-width:46px;
  padding:4px 7px;
  font-size:10px;
  line-height:13px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-note{
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin:0;
  padding:10px 11px;
  border:1px solid var(--member-final-line);
  border-radius:8px;
  background:var(--member-final-control);
  color:var(--member-final-soft);
  -webkit-text-fill-color:var(--member-final-soft);
  font-size:11.5px;
  font-weight:600;
  line-height:18px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-aside-note .recharge-v2-icon{
  width:16px;
  height:16px;
  flex:0 0 16px;
  margin-top:1px;
  color:#32a887;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context{
  min-height:60px;
  height:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  padding:8px 10px;
  border-color:#ead7a8;
  background:#fff9eb;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-icon{
  display:none;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy{
  min-width:0;
  width:100%;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy small{
  margin:0 0 3px;
  color:#8b6b2e;
  -webkit-text-fill-color:#8b6b2e;
  font-size:9.5px;
  font-weight:700;
  line-height:13px;
}
html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy strong{
  width:100%;
  max-width:100%;
  overflow:hidden;
  color:#5f471d;
  -webkit-text-fill-color:#5f471d;
  font-size:11px;
  font-weight:850;
  line-height:16px;
  text-overflow:clip;
  white-space:nowrap;
  overflow-wrap:normal;
}

html[data-theme="dark"]:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership{
  --member-polish-gold:#dfb65f;
  --member-polish-gold-soft:#343024;
  --member-polish-shadow:0 8px 20px rgba(0,0,0,.12);
}
html[data-theme="dark"]:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid input:checked+span{
  border-color:#858df0;
  background:#292c34;
  color:#f7f8ff;
  box-shadow:inset 0 0 0 1px rgba(133,141,240,.36);
}
html[data-theme="dark"]:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context{
  border-color:#4b4230;
  background:#2d2a23;
}
html[data-theme="dark"]:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy small{
  color:#bda66f;
  -webkit-text-fill-color:#bda66f;
}
html[data-theme="dark"]:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy strong{
  color:#f0d79f;
  -webkit-text-fill-color:#f0d79f;
}

@media (max-width:760px){
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-main{
    gap:18px;
    padding:16px 12px 22px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid,.member-shop-plan-grid.has-1,.member-shop-plan-grid.has-2,.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-4,.member-shop-plan-grid.has-5,.member-shop-plan-grid.has-6){
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-grid.has-1{
    grid-template-columns:minmax(0,1fr);
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-5){
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-5)>.member-shop-plan{
    grid-column:span 2;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership :is(.member-shop-plan-grid.has-3,.member-shop-plan-grid.has-5)>.member-shop-plan:last-child{
    grid-column:2/span 2;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan{
    min-height:142px;
    padding:11px 10px 10px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-top{
    gap:7px;
    padding-right:20px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-symbol{
    width:31px;
    height:31px;
    flex-basis:31px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-symbol .recharge-v2-icon{
    width:17px;
    height:17px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name strong{
    font-size:12.5px;
    line-height:17px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-name small{
    font-size:9.5px;
    line-height:14px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price{
    margin:10px 0 8px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price strong{
    font-size:23px;
    line-height:25px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-price small{
    display:none;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-credit{
    gap:4px;
    font-size:10px;
    line-height:15px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-plan-check{
    top:9px;
    right:9px;
    width:19px;
    height:19px;
    font-size:10px;
    line-height:19px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits{
    display:block;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head{
    margin-bottom:10px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head strong{
    font-size:14px;
    line-height:19px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits-head small{
    font-size:10.5px;
    line-height:15px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit-list{
    display:block;
    grid-template-columns:none;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit{
    min-height:54px;
    grid-template-columns:34px minmax(0,1fr) auto;
    grid-template-rows:auto;
    gap:9px;
    padding:8px 10px;
    text-align:left;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit>span{
    grid-row:auto;
    width:34px;
    height:34px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit>div{
    width:auto;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit strong{
    font-size:12.5px;
    line-height:17px;
    text-align:left;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit small{
    font-size:10.5px;
    line-height:15px;
    text-align:left;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-benefits .member-shop-benefit-status{
    grid-column:auto;
    justify-self:end;
    min-width:46px;
    padding:4px 6px;
    font-size:10px;
    line-height:13px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-mobile-note{
    margin-top:10px;
    font-size:12.5px;
    line-height:19px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid{
    gap:10px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-pay-grid label>span{
    height:72px;
    padding:6px 7px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action{
    height:54px;
    min-height:54px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>button{
    height:54px;
    min-height:54px;
    border-radius:13px;
    font-size:14px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav{
    height:114px;
    min-height:114px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context{
    min-height:50px;
    padding:6px 10px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy small{
    margin:0;
    font-size:10.5px;
    line-height:15px;
    white-space:nowrap;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy>span{
    min-width:0;
    width:auto;
  }
  html:not(#jnMemberPolishA#jnMemberPolishB#jnMemberPolishC#jnMemberPolishD#jnMemberPolishE#jnMemberPolishF#jnMemberPolishG#jnMemberPolishH#jnMemberPolishI#jnMemberPolishJ#jnMemberPolishK#jnMemberPolishL#jnMemberPolishM#jnMemberPolishN#jnMemberPolishO#jnMemberPolishP#jnMemberPolishQ#jnMemberPolishR#jnMemberPolishS#jnMemberPolishT#jnMemberPolishU#jnMemberPolishV#jnMemberPolishW#jnMemberPolishX#jnMemberPolishY#jnMemberPolishZ#jnMemberPolishAA#jnMemberPolishAB#jnMemberPolishAC#jnMemberPolishAD#jnMemberPolishAE#jnMemberPolishAF#jnMemberPolishAG#jnMemberPolishAH#jnMemberPolishAI#jnMemberPolishAJ#jnMemberPolishAK#jnMemberPolishAL#jnMemberPolishAM) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .account-service-nav-balance.is-membership-context>.is-member-copy strong{
    width:auto;
    max-width:none;
    font-size:11.5px;
    line-height:16px;
  }
}

/* Mobile account balance cards share the membership status layout and follow each tab accent. */
@media (max-width:760px){
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav{
    height:114px;
    min-height:114px;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance{
    height:50px;
    min-height:50px;
    grid-template-columns:minmax(0,1fr);
    gap:0;
    padding:6px 10px;
    border-radius:8px;
    box-shadow:none;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-icon{
    display:none;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy{
    min-width:0;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy small{
    flex:0 0 auto;
    margin:0;
    font-size:10.5px;
    font-weight:700;
    line-height:15px;
    white-space:nowrap;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy>span{
    min-width:0;
    width:auto;
    margin-left:auto;
    display:flex;
    align-items:baseline;
    justify-content:flex-end;
    gap:3px;
    white-space:nowrap;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy strong{
    width:auto;
    max-width:none;
    font-size:12.5px;
    line-height:16px;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:is(.is-online,.is-redeem) .account-service-nav-balance>.is-balance-copy em{
    font-size:9.5px;
    line-height:13px;
  }

  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance{
    border-color:#cbd0f6;
    background:#f4f5ff;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance>.is-balance-copy small{
    color:#6570b8;
    -webkit-text-fill-color:#6570b8;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance>.is-balance-copy strong{
    color:#39447e;
    -webkit-text-fill-color:#39447e;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance>.is-balance-copy em{
    color:#7b83b5;
    -webkit-text-fill-color:#7b83b5;
  }

  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance{
    border-color:#bfe5d9;
    background:#effaf6;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance>.is-balance-copy small{
    color:#3f8d76;
    -webkit-text-fill-color:#3f8d76;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance>.is-balance-copy strong{
    color:#246653;
    -webkit-text-fill-color:#246653;
  }
  html:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance>.is-balance-copy em{
    color:#5f9888;
    -webkit-text-fill-color:#5f9888;
  }

  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance{
    border-color:#424966;
    background:#262936;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance>.is-balance-copy small{
    color:#a7afe8;
    -webkit-text-fill-color:#a7afe8;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance>.is-balance-copy strong{
    color:#e0e4ff;
    -webkit-text-fill-color:#e0e4ff;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-online .account-service-nav-balance>.is-balance-copy em{
    color:#aab2e8;
    -webkit-text-fill-color:#aab2e8;
  }

  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance{
    border-color:#36554e;
    background:#22302d;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance>.is-balance-copy small{
    color:#86b9aa;
    -webkit-text-fill-color:#86b9aa;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance>.is-balance-copy strong{
    color:#d0f1e7;
    -webkit-text-fill-color:#d0f1e7;
  }
  html[data-theme="dark"]:not(#jnMobileBalanceSyncA#jnMobileBalanceSyncB#jnMobileBalanceSyncC#jnMobileBalanceSyncD#jnMobileBalanceSyncE#jnMobileBalanceSyncF#jnMobileBalanceSyncG#jnMobileBalanceSyncH#jnMobileBalanceSyncI#jnMobileBalanceSyncJ#jnMobileBalanceSyncK#jnMobileBalanceSyncL#jnMobileBalanceSyncM#jnMobileBalanceSyncN#jnMobileBalanceSyncO#jnMobileBalanceSyncP#jnMobileBalanceSyncQ#jnMobileBalanceSyncR#jnMobileBalanceSyncS#jnMobileBalanceSyncT#jnMobileBalanceSyncU#jnMobileBalanceSyncV#jnMobileBalanceSyncW#jnMobileBalanceSyncX) body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .account-service-nav-balance>.is-balance-copy em{
    color:#91c5b5;
    -webkit-text-fill-color:#91c5b5;
  }
}

/* Keep the mobile recharge body naturally tall so the outer pane can scroll. */
@media (max-width:760px){
  html body[class^="page-"]:not(.page-admin)
  [data-front-app-public-root] .recharge-v2-modal.is-account-service
  .recharge-v2-shell .recharge-v2-scroll > .recharge-v2-pane,
  html body[class^="page-"]:not(.page-admin)
  [data-front-app-public-root] .recharge-v2-modal.is-account-service
  .recharge-v2-shell .recharge-v2-scroll .recharge-v2-content-grid,
  html body[class^="page-"]:not(.page-admin)
  [data-front-app-public-root] .recharge-v2-modal.is-account-service
  .recharge-v2-shell .recharge-v2-scroll .recharge-v2-main{
    height:auto;
    min-height:max-content;
    max-height:none;
    overflow:visible;
  }
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options {
  box-sizing: border-box;
  grid-auto-rows: min-content;
  gap: 4px;
  overflow: auto;
  padding: 9px 8px;
  border: 1px solid var(--front-param-panel-border);
  border-radius: 10px;
  background: var(--front-param-panel-bg);
  color: var(--front-param-panel-text);
  box-shadow: var(--front-param-shadow);
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options::before {
  display: block;
  margin: 0 4px 6px;
  white-space: pre-line;
  color: var(--front-param-panel-title, var(--front-param-panel-text));
  font-size: 13px;
  line-height: 1.45;
  font-weight: 900;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param="count"]::before {
  content: "数量\A选择生成内容的数量";
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param="resolution"]::before {
  content: "分辨率\A选择视频清晰度";
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param="duration"]::before {
  content: "时长\A选择视频生成时长";
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param="size"]::before {
  content: "尺寸\A选择生成内容的比例";
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal .front-param-option {
  box-sizing: border-box;
  width: 100%;
  height: 34px;
  min-height: 34px;
  gap: 10px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--front-param-panel-text);
  box-shadow: none;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal .front-param-option-main {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal .front-param-option-icon {
  width: 14px;
  height: 14px;
  flex: none;
  stroke-width: 1.9;
  opacity: .86;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param=size] .front-param-size-icon {
  flex: 0 0 14px;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal[data-param=count] .front-param-custom-count input {
  font-size: 13px;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal .front-param-check {
  width: 15px;
  height: 15px;
  display: none;
  flex: none;
  color: var(--front-param-panel-text);
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal .front-param-option.is-selected .front-param-check {
  display: block;
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-video-popover:is([data-param="resolution"], [data-param="duration"], [data-param="size"]) {
  width: 176px;
  min-width: min(176px, calc(100vw - 18px));
  max-width: min(176px, calc(100vw - 18px));
  max-height: min(var(--front-video-param-max-height, 210px), calc(100dvh - 24px));
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] {
  --front-param-portal-width: 244px;
  --front-param-portal-min-width: 244px;
  --front-param-portal-max-width: min(260px, calc(100vw - 24px));
  max-height: min(336px, calc(100dvh - 24px));
  padding: 8px;
  gap: 6px;
  box-shadow: var(--front-video-model-param-shadow);
}

html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"]::before {
  content: "选择模型";
  display: block;
  margin: 0 4px 5px;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  color: var(--front-param-control-muted);
  background-image: linear-gradient(to right, var(--front-param-panel-border) 0, var(--front-param-panel-border) calc(50% - 38px), transparent calc(50% - 38px), transparent calc(50% + 38px), var(--front-param-panel-border) calc(50% + 38px), var(--front-param-panel-border) 100%);
}

body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option {
  min-width: 0;
  height: 40px;
  min-height: 40px;
  padding: 0 12px;
  justify-content: flex-start;
  border: 1px solid transparent;
  border-radius: 8px;
  white-space: normal;
  overflow: visible;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-copy {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  line-height: 1;
  text-align: left;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title {
  display: block;
  overflow: hidden;
  font-size: 14px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] {
  --front-param-portal-width: max-content;
  --front-param-portal-min-width: 132px;
  --front-param-portal-max-width: min(260px, calc(100vw - 24px));
  max-height: min(248px, calc(100dvh - 24px));
  padding: 8px;
  gap: 4px;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] .front-param-option {
  min-width: max-content;
  padding: 0 9px;
  border-radius: 9px;
  font-weight: 600;
  line-height: 1.2;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] .front-param-custom-count {
  min-width: 0;
  margin: 7px 2px 0;
  padding: 8px 2px 2px;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] .front-param-custom-count > span {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] .front-param-custom-count > div {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] .front-param-custom-count input {
  flex: 0 0 54px;
  width: 54px;
  min-width: 54px;
  max-width: 54px;
  padding: 0 6px;
  border-radius: 8px;
}

html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="count"] .front-param-custom-count button {
  flex: 0 0 auto;
  width: auto;
  min-width: 46px;
  padding: 0 10px;
  border-radius: 8px;
}

@media (max-width: 860px) {
  html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] {
    max-height: min(190px, calc(100dvh - 24px));
    padding: 6px;
    gap: 2px;
  }

  html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="count"] .front-param-option {
    height: 30px;
    min-height: 30px;
    padding: 0 8px;
    border-radius: 8px;
    font-size: 13px;
  }

  html body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"] {
    --front-param-portal-width: min(220px, calc(100vw - 24px));
    --front-param-portal-min-width: min(220px, calc(100vw - 24px));
    --front-param-portal-max-width: min(220px, calc(100vw - 24px));
    max-height: min(190px, calc(100dvh - 24px));
    padding: 6px;
    gap: 4px;
  }

  body.page-video.front-creative-page:not(.page-admin) .front-param-portal.front-param-options.front-param-draw-popover[data-param="model"]::before {
    margin-bottom: 6px;
  }

  body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-option {
    height: 36px;
    min-height: 36px;
    padding: 0 10px;
  }

  html body.page-video.front-creative-page .front-param-portal.front-param-draw-popover[data-param="model"] .front-chat-model-title {
    font-size: 13px;
  }
}

.page-chat {
  --front-video-chat-bg: var(--lz-front-workspace-bg);
  --front-composer-panel: var(--lz-front-composer-panel);
  --front-composer-line: var(--lz-front-composer-border);
  --front-composer-control: var(--lz-front-composer-control);
  --front-composer-control-line: var(--lz-front-composer-control-border);
  --front-composer-text: var(--lz-front-composer-text);
  --front-composer-muted: var(--lz-front-composer-muted);
  --chat-guide-icon: #f8fafc;
  --chat-guide-text: #e4e4e7;
  --chat-guide-panel: rgba(31, 34, 40, .74);
  --chat-guide-line: rgba(255, 255, 255, .12);
  --chat-guide-shadow: 0 18px 46px rgba(12, 16, 24, .20), inset 0 1px 0 rgba(255, 255, 255, .07);
  --chat-history-panel: #20232a;
  --chat-history-control: #292d35;
  --chat-history-item: #262a32;
  --chat-history-item-hover: #303641;
  --chat-history-active: rgba(7, 101, 144, .22);
  --chat-history-active-border: rgba(62, 187, 241, .50);
  --chat-history-accent: #3ebbf1;
  --chat-history-border: rgba(255, 255, 255, .12);
  --chat-history-text: #f8fafc;
  --chat-history-muted: #a1a1aa;
  --chat-history-shadow: 0 16px 38px rgba(0, 0, 0, .28);
  overflow: hidden;
  background: var(--front-video-chat-bg);
}

html.jn-light-mode .page-chat,
html[data-theme="light"] .page-chat,
.page-chat.jn-light-mode,
.page-chat[data-theme="light"] {
  --front-composer-control: #f8fafc;
  --chat-guide-icon: #2563eb;
  --chat-guide-text: #475569;
  --chat-guide-panel: #fff;
  --chat-guide-line: rgba(15, 23, 42, .10);
  --chat-guide-shadow: 0 12px 28px rgba(15, 23, 42, .07);
  --chat-history-panel: #fff;
  --chat-history-control: #f8fafc;
  --chat-history-item: #f8fafc;
  --chat-history-item-hover: #f1f5f9;
  --chat-history-active: #ecfeff;
  --chat-history-active-border: rgba(8, 145, 178, .38);
  --chat-history-accent: #0891b2;
  --chat-history-border: rgba(15, 23, 42, .11);
  --chat-history-text: #0f172a;
  --chat-history-muted: #64748b;
  --chat-history-shadow: 0 16px 38px rgba(15, 23, 42, .10);
}

.page-chat .main-area,
.page-chat .workspace-main,
.page-chat .workspace-module,
.page-chat .oc-chat-page,
.page-chat .oc-chat-main,
.page-chat .oc-chat-canvas {
  background: var(--front-video-chat-bg);
}

.chat-workspace,
.oc-chat-page {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
  color: var(--front-composer-text);
}

.workspace-page .workspace-module > .oc-chat-page,
.workspace-page .oc-chat-page.chat-workspace {
  display: block;
  border: 0;
  border-radius: 0;
  background: var(--front-video-chat-bg);
  box-shadow: none;
}

.oc-chat-main {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.front-chat-history-frame,
.oc-chat-history-zone {
  position: absolute;
  left: 20px;
  top: 27px;
  z-index: 95;
  box-sizing: border-box;
  width: 358px;
  max-width: calc(100% - 40px);
  min-height: 322px;
  pointer-events: none;
}

.front-chat-history-frame.is-history-open,
.oc-chat-history-zone.is-history-open {
  pointer-events: auto;
}

.front-chat-history-actions,
.oc-chat-history-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  pointer-events: auto;
}

.front-chat-history-top,
.oc-chat-history-top {
  display: block;
  height: 32px;
}

.front-chat-new-btn,
.oc-chat-new-btn,
.front-chat-history-toggle,
.oc-chat-history-toggle {
  box-sizing: border-box;
  width: 94px;
  height: 32px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  line-height: 12px;
  white-space: nowrap;
}

.front-chat-new-btn,
.oc-chat-new-btn {
  border: 1px solid rgba(255, 209, 31, .90);
  background: linear-gradient(135deg, #ffd84f, #ffb516);
  color: #070707;
  box-shadow: 0 10px 26px rgba(245, 164, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .28);
}

.front-chat-history-toggle,
.oc-chat-history-toggle {
  border: 1px solid var(--chat-history-active-border);
  background: var(--chat-history-active);
  color: var(--chat-history-accent);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
}

.front-chat-new-btn svg,
.oc-chat-new-btn svg,
.front-chat-history-toggle svg,
.oc-chat-history-toggle svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.front-chat-history-panel,
.oc-chat-history-panel {
  box-sizing: border-box;
  width: 358px;
  max-width: 100%;
  min-height: 205px;
  margin-top: 7px;
  padding: 14px;
  overflow: visible;
  border: 1px solid var(--chat-history-border);
  border-radius: 10px;
  background: var(--chat-history-panel);
  color: var(--chat-history-text);
  box-shadow: var(--chat-history-shadow);
  opacity: 0;
  transform: translateY(-5px);
  visibility: hidden;
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}

.front-chat-history-panel.is-open,
.oc-chat-history-panel.is-open {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}

.chat-library__search {
  display: block;
}

.chat-library__search input {
  box-sizing: border-box;
  width: 100%;
  height: 36px;
  padding: 0 12px;
  border: 1px solid var(--chat-history-border);
  border-radius: 9px;
  outline: 0;
  background: var(--chat-history-control);
  color: var(--chat-history-text);
  font: 13px/1 var(--lz-font-sans);
}

.chat-conversations {
  max-height: 190px;
  margin-top: 10px;
  display: grid;
  gap: 6px;
  overflow: auto;
}

.chat-conversation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 30px;
  gap: 5px;
  border-radius: 8px;
  background: var(--chat-history-item);
}

.chat-conversation:hover,
.chat-conversation.is-active {
  background: var(--chat-history-item-hover);
}

.chat-conversation__open,
.chat-conversation__delete {
  min-width: 0;
  border: 0;
  background: transparent;
  color: inherit;
}

.chat-conversation__open {
  display: grid;
  gap: 3px;
  padding: 9px 10px;
  text-align: left;
}

.chat-conversation__open strong,
.chat-conversation__open small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-conversation__open strong {
  font-size: 13px;
}

.chat-conversation__open small,
.chat-library__status {
  color: var(--chat-history-muted);
  font-size: 11px;
}

.chat-library__status {
  margin: 9px 2px 0;
}

.oc-chat-canvas {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  min-height: 0;
  flex: 1 1 auto;
  overflow: hidden auto;
  padding: 54px 18px 0;
}

.front-creation-guide-frame,
.front-creation-guide-frame *,
.front-creation-guide-frame *::before,
.front-creation-guide-frame *::after {
  box-sizing: border-box;
}

.page-chat .front-creation-guide-frame.oc-chat-welcome {
  width: min(985px, calc(100% - 32px));
  max-width: min(985px, calc(100% - 32px));
  min-height: calc(100dvh - 396px);
  margin: 0 auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
  transform: translateY(-18px);
}

.page-chat .front-creation-guide-icon.oc-chat-logo {
  width: 84px;
  height: 84px;
  min-width: 84px;
  min-height: 84px;
  flex: 0 0 84px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--chat-guide-icon);
  box-shadow: none;
}

.page-chat .front-creation-guide-icon.oc-chat-logo svg {
  width: 100%;
  height: 100%;
  display: block;
}

.page-chat .front-creation-guide-card.oc-chat-intro {
  box-sizing: border-box;
  width: min(560px, 100%);
  height: 91px;
  min-height: 91px;
  margin: 0;
  padding: 18px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--chat-guide-line);
  border-radius: 16px;
  background: var(--chat-guide-panel);
  color: var(--chat-guide-text);
  box-shadow: var(--chat-guide-shadow);
  font-size: 14px;
  line-height: 1.75;
  text-align: left;
}

.oc-chat-stream,
.chat-messages {
  box-sizing: border-box;
  width: min(1080px, 100%);
  min-height: 22px;
  margin: 0 auto;
  padding: 4px 0 18px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow: visible;
}

.oc-chat-composer {
  position: fixed;
  left: var(--front-menu-width);
  right: 0;
  bottom: 0;
  z-index: 70;
  box-sizing: border-box;
  width: auto;
  height: 222px;
  min-height: 222px;
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0 38px 14px;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--front-composer-text);
  box-shadow: none;
}

.workspace-page.is-sidebar-collapsed .oc-chat-composer {
  left: var(--front-menu-offset);
}

.oc-chat-composer-actions {
  position: absolute;
  left: 50%;
  top: var(--lz-creative-composer-tools-offset);
  z-index: 3;
  box-sizing: border-box;
  width: min(980px, calc(100% - 76px));
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  transform: translateX(-50%);
}

.oc-chat-composer .front-creative-tool-chip,
.oc-chat-composer .front-creative-billing-pill {
  box-sizing: border-box;
  height: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--front-composer-line);
  background: var(--lz-front-floating-control);
  color: var(--front-composer-text);
  box-shadow: none;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.oc-chat-composer .front-creative-tool-chip {
  width: 32px;
  min-width: 32px;
  padding: 0;
  border-radius: 10px;
}

.oc-chat-composer .front-creative-tool-chip span {
  display: none;
}

.oc-chat-composer .front-creative-tool-chip svg,
.oc-chat-composer .front-creative-billing-pill svg {
  width: 16px;
  height: 16px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.oc-chat-composer .front-creative-billing-pill {
  gap: 6px;
  padding: 0 14px;
  border-radius: 999px;
  color: var(--lz-front-billing-text);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.oc-chat-composer .front-creative-billing-pill svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
}

.front-chat-input-frame {
  position: relative;
  box-sizing: border-box;
  width: min(980px, 100%);
  height: 208px;
  min-height: 208px;
  margin: 0 auto;
  padding: 22px 22px 64px;
  overflow: visible;
  border: 1px solid var(--front-composer-line);
  border-radius: 18px;
  background: var(--front-composer-panel);
  box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
}

.front-chat-input-main,
.front-chat-prompt-panel,
.front-chat-prompt-wrap {
  position: static;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.front-chat-input {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: 120px;
  min-height: 120px;
  max-height: 120px;
  margin: 0;
  padding: 0 4px;
  resize: none;
  overflow: hidden auto;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: var(--front-composer-text);
  box-shadow: none;
  font: 15px/24px var(--lz-font-sans);
}

.front-chat-input::placeholder {
  color: var(--front-composer-muted);
  opacity: 1;
}

.front-chat-controls {
  position: absolute;
  left: 44px;
  bottom: 20px;
  z-index: 4;
  box-sizing: border-box;
  width: max-content;
  max-width: calc(100% - 132px);
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 7px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}

.front-chat-controls::-webkit-scrollbar {
  display: none;
}

.front-chat-upload {
  position: relative;
  box-sizing: border-box;
  width: 92px;
  min-width: 92px;
  height: 34px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid rgba(148, 163, 184, .26);
  border-radius: 13px;
  background: var(--front-composer-control);
  color: #475569;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
  font-size: 13px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 800;
  line-height: 13px;
  white-space: nowrap;
}

.front-chat-upload svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.front-model-select {
  position: relative;
  box-sizing: border-box;
  min-width: 0;
  height: 34px;
  display: flex;
  flex: 0 0 auto;
  overflow: visible;
  border: 0;
  border-radius: 12px;
  background: var(--front-composer-control);
}

.front-model-select .front-param-trigger {
  box-sizing: border-box;
  width: max-content;
  min-width: 0;
  max-width: min(236px, calc(100vw - 44px));
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 0 24px 0 14px;
  border: 1px solid var(--front-composer-line);
  border-radius: 12px;
  background: var(--front-composer-control);
  color: #475569;
  font-size: 13px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 820;
  line-height: 13px;
  white-space: nowrap;
}

.front-model-select .front-param-trigger > svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.front-model-select .front-param-trigger::after {
  content: none;
  display: none;
}

.front-model-select .front-param-value {
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.oc-chat-native-select {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  opacity: 0;
  pointer-events: none;
}

.front-chat-input-side {
  position: absolute;
  right: 18px;
  bottom: 18px;
  z-index: 5;
  width: 46px;
  height: 46px;
}

.workspace-page .front-chat-send {
  box-sizing: border-box;
  width: 46px;
  min-width: 46px;
  height: 46px;
  min-height: 46px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--front-composer-line);
  border-radius: 999px;
  background: var(--front-composer-control);
  color: var(--front-composer-muted);
  box-shadow: none;
}

html.jn-light-mode .page-chat .oc-chat-composer .front-creative-tool-chip,
html[data-theme="light"] .page-chat .oc-chat-composer .front-creative-tool-chip,
.page-chat.jn-light-mode .oc-chat-composer .front-creative-tool-chip {
  background: #f8fafc;
}

html.jn-light-mode .page-chat .oc-chat-composer .front-creative-billing-pill,
html[data-theme="light"] .page-chat .oc-chat-composer .front-creative-billing-pill,
.page-chat.jn-light-mode .oc-chat-composer .front-creative-billing-pill {
  background: #fff;
  color: #92400e;
}

.workspace-page .front-chat-send.is-empty,
.workspace-page .front-chat-send:disabled {
  color: var(--front-composer-muted);
  cursor: default;
}

.workspace-page .front-chat-send.has-prompt:not(:disabled) {
  background: #2563eb;
  color: #fff;
  cursor: pointer;
}

.workspace-page .front-chat-send svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.front-chat-stop[hidden] {
  display: none;
}

.chat-notice {
  position: fixed;
  left: 50%;
  bottom: 232px;
  z-index: 96;
  max-width: min(620px, calc(100vw - 32px));
  margin: 0;
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .86);
  color: #fff;
  font-size: 12px;
  opacity: 0;
  transform: translateX(-50%);
  pointer-events: none;
}

.chat-notice:not(:empty) {
  opacity: 1;
}

.chat-message {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
}

.chat-message__avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--front-composer-control);
  color: var(--front-composer-text);
  font-size: 13px;
  font-weight: 900;
}

.chat-message__body {
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid var(--front-composer-line);
  border-radius: 16px;
  background: var(--front-composer-panel);
  color: var(--front-composer-text);
}

.chat-message__head,
.chat-message__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.chat-message__head small,
.chat-message__actions {
  color: var(--front-composer-muted);
  font-size: 12px;
}

.chat-message__content {
  margin-top: 9px;
  line-height: 1.75;
}

.chat-message__actions {
  margin-top: 10px;
  justify-content: flex-start;
}

.chat-delete-dialog {
  width: min(420px, calc(100vw - 32px));
  padding: 22px;
  border: 1px solid var(--front-composer-line);
  border-radius: 16px;
  background: var(--front-composer-panel);
  color: var(--front-composer-text);
}

.chat-delete-dialog::backdrop {
  background: rgba(15, 23, 42, .52);
}

.front-chat-model-portal {
  box-sizing: border-box;
  width: 244px;
  max-width: calc(100vw - 24px);
  max-height: min(420px, calc(100dvh - 24px));
  display: grid;
  gap: 7px;
  padding: 10px;
  overflow: auto;
  border: 1px solid var(--front-composer-line);
  border-radius: 14px;
  background: var(--front-composer-panel);
  color: var(--front-composer-text);
  box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
}

.front-chat-model-portal .front-chat-model-option {
  box-sizing: border-box;
  width: 100%;
  min-height: 72px;
  display: flex;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: transparent;
  color: inherit;
  text-align: left;
}

.front-chat-model-portal .front-chat-model-option:hover,
.front-chat-model-portal .front-chat-model-option.is-selected {
  border-color: rgba(37, 99, 235, .28);
  background: rgba(37, 99, 235, .08);
}

.front-chat-model-copy {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.front-chat-model-title {
  overflow: hidden;
  color: var(--front-composer-text);
  font-size: 13px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.front-chat-model-price {
  color: var(--front-composer-muted);
  font-size: 11px;
}

.front-chat-model-bolt {
  color: #f59e0b;
}

@media (max-width: 760px) {
  .front-chat-history-frame,
  .oc-chat-history-zone {
    left: 12px;
    top: 56px;
    width: 300px;
    max-width: calc(100vw - 24px);
    min-height: 312px;
  }

  .front-chat-history-panel,
  .oc-chat-history-panel {
    width: 100%;
    min-height: 196px;
    padding: 13px;
  }

  .oc-chat-canvas {
    padding: 54px 18px 0;
  }

  .page-chat .front-creation-guide-frame.oc-chat-welcome {
    width: 100%;
    max-width: 100%;
    min-height: 450px;
    gap: 12px;
    transform: translateY(-12px);
  }

  .page-chat .front-creation-guide-icon.oc-chat-logo {
    width: 64px;
    height: 64px;
    min-width: 64px;
    min-height: 64px;
    flex-basis: 64px;
  }

  .page-chat .front-creation-guide-card.oc-chat-intro {
    width: 100%;
    height: 104.25px;
    min-height: 104.25px;
    padding: 14px 15px;
    font-size: 13px;
    line-height: 1.95;
  }

  .oc-chat-stream,
  .chat-messages {
    width: 100%;
    min-height: 20px;
    padding: 2px 0 18px;
  }

  .oc-chat-composer,
  .workspace-page.is-sidebar-collapsed .oc-chat-composer {
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 238px;
    min-height: 238px;
    padding: 0 10px 10px;
    overflow: hidden;
  }

  .oc-chat-composer-actions {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    height: 30px;
    gap: 6px;
    margin-bottom: var(--lz-creative-composer-tools-gap);
    transform: none;
  }

  .oc-chat-composer .front-creative-tool-chip {
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
  }

  .oc-chat-composer .front-creative-billing-pill {
    height: 30px;
    min-height: 30px;
    padding: 0 11px;
    font-size: 11px;
  }

  .front-chat-input-frame {
    width: auto;
    height: 190px;
    min-height: 190px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    grid-template-rows: minmax(0, 1fr) 40px;
    gap: 8px 10px;
    padding: 12px 10px;
    overflow: hidden;
  }

  .front-chat-input-main {
    grid-column: 1 / -1;
    grid-row: 1 / -1;
  }

  .front-chat-input {
    width: 100%;
    height: 116px;
    min-height: 116px;
    max-height: 116px;
  }

  .front-chat-controls {
    left: 10px;
    bottom: 12px;
    max-width: calc(100% - 106px);
    height: 34px;
    gap: 6px;
  }

  .front-chat-upload {
    width: 88px;
    min-width: 88px;
    height: 32px;
    min-height: 32px;
  }

  .front-chat-input-side {
    right: 10px;
    bottom: 12px;
    width: 40px;
    height: 40px;
  }

  .workspace-page .front-chat-send {
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
  }

  .chat-notice {
    bottom: 244px;
  }

  .chat-message {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
  }

  .chat-message__avatar {
    width: 30px;
    height: 30px;
  }
}

.workspace-model-navigation {
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 23px 0 10px;
  overflow: hidden;
  contain: paint;
  isolation: isolate;
}

.workspace-model-navigation svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.workspace-model-navigation__primary {
  display: flex;
  gap: 8px;
  margin-bottom: 20px;
}

.workspace-model-navigation__primary-item {
  position: relative;
  width: var(--front-model-nav-primary-width);
  height: var(--front-model-nav-primary-height);
  min-width: 0;
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  overflow: visible;
  padding: 10px 4px;
  border: 0;
  border-radius: var(--front-model-nav-radius-large);
  background: var(--front-model-nav-primary-surface);
  color: var(--front-model-nav-primary-text);
  text-decoration: none;
  box-shadow: none;
  cursor: pointer;
  transition: background-color .3s cubic-bezier(.4,0,.2,1),color .3s cubic-bezier(.4,0,.2,1);
}

.workspace-model-navigation__primary-item:hover:not(.is-active) {
  background: var(--front-model-nav-primary-hover-surface);
  color: var(--front-model-nav-primary-hover-text);
}

.workspace-model-navigation__primary-item[data-primary-kind="model"].is-active {
  background: var(--front-model-nav-model-active-surface);
  color: var(--front-model-nav-model-active-text);
}

.workspace-model-navigation__primary-item[data-primary-kind="records"].is-active {
  background: var(--front-model-nav-records-active-surface);
  color: var(--front-model-nav-records-active-text);
}

.workspace-model-navigation__primary-item[data-primary-kind="gallery"].is-active {
  background: var(--front-model-nav-gallery-active-surface);
  color: var(--front-model-nav-gallery-active-text);
}

.workspace-model-navigation__primary-icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  transition: color .3s ease;
}

.workspace-model-navigation__primary-icon svg {
  width: 100%;
  height: 100%;
}

.workspace-model-navigation__primary-label {
  max-width: calc(var(--front-model-nav-primary-width) - 8px);
  overflow: hidden;
  color: var(--front-model-nav-description-text);
  font-size: 11px;
  font-weight: 500;
  line-height: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: color .3s ease;
}

.workspace-model-navigation__primary-item.is-active .workspace-model-navigation__primary-label {
  font-weight: 600;
}

.workspace-model-navigation__primary-indicator {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 32px;
  height: 2px;
  border-radius: 1px;
  background: linear-gradient(90deg,transparent,currentColor,transparent);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}

.workspace-model-navigation__primary-item.is-active .workspace-model-navigation__primary-indicator {
  transform: translateX(-50%) scaleX(1);
}
.workspace-model-navigation__types {
  display: flex;
  align-items: center;
  gap: 0;
  margin: 0 0 17px;
  padding: 0 1px;
}

.workspace-model-navigation__type {
  width: var(--front-model-nav-type-width);
  height: var(--front-model-nav-type-height);
  min-width: var(--front-model-nav-type-width);
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--front-menu-muted);
  cursor: pointer;
  font: inherit;
}

.workspace-model-navigation__type svg {
  display: none;
}

.workspace-model-navigation__type span {
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  white-space: nowrap;
}

.workspace-model-navigation__type:hover,
.workspace-model-navigation__type.is-active {
  color: var(--front-model-nav-type-active);
}

.workspace-model-navigation__search {
  width: var(--front-model-nav-search-width);
  height: var(--front-model-nav-search-height);
  min-height: var(--front-model-nav-search-height);
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 15px;
  padding: 0 11px;
  overflow: hidden;
  border: 1px solid var(--front-model-nav-search-line);
  border-radius: var(--front-model-nav-radius-small);
  background: var(--front-model-nav-search-surface);
  color: var(--front-menu-muted);
}

.workspace-model-navigation__search:focus-within {
  box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--front-model-nav-type-active) 46%,transparent);
}

.workspace-model-navigation__search > svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}

.workspace-model-navigation__search input {
  width: 0;
  height: 100%;
  min-height: 0;
  min-width: 0;
  flex: 1 1 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
  color: var(--front-menu-text);
  font: inherit;
  font-size: 11px;
  line-height: 16px;
}

.workspace-model-navigation__search input::placeholder {
  color: var(--front-menu-muted);
}

.workspace-model-navigation__search input::-webkit-search-cancel-button {
  display: none;
}

.workspace-model-navigation__search button[hidden] {
  display: none;
}

.workspace-model-navigation__search button {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-size: 16px;
}

.workspace-model-navigation__body {
  max-width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.workspace-model-navigation__body::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

.workspace-model-navigation__list {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: grid;
  gap: 0;
  overflow: hidden;
}

.workspace-model-navigation__status[hidden],
.workspace-model-navigation__model[hidden] {
  display: none;
}

.workspace-model-navigation__status {
  width: var(--front-model-nav-card-width);
  padding: 22px 10px;
  color: var(--front-menu-muted);
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

.workspace-model-navigation__model {
  position: relative;
  width: var(--front-model-nav-card-width);
  height: var(--front-model-nav-card-height);
  max-width: 100%;
  min-width: 0;
  display: block;
  margin: 0 0 4px;
  padding: 11px 14px 10px 65px;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: var(--front-model-nav-radius-large);
  background: transparent;
  color: var(--front-menu-item);
  text-decoration: none;
  contain: layout paint;
  isolation: isolate;
}

.workspace-model-navigation__model:hover {
  border-color: transparent;
  background: var(--front-model-nav-hover-surface);
  color: var(--front-menu-text);
}

.workspace-model-navigation__model.is-active {
  border-color: transparent;
  background: var(--front-model-nav-active-surface);
  color: var(--front-model-nav-active-accent);
}

.workspace-model-navigation__model.is-active::before {
  position: absolute;
  inset: 8px auto 8px 0;
  width: 3px;
  border-radius: 999px;
  background: var(--front-model-nav-active-accent);
  content: '';
}

.workspace-model-navigation__model-icon {
  position: absolute;
  top: 18px;
  left: 16px;
  width: var(--front-model-nav-icon-size);
  height: var(--front-model-nav-icon-size);
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--front-menu-line);
  border-radius: 10px;
  background: var(--front-model-nav-icon-surface);
  color: var(--front-model-nav-active-accent);
  contain: strict;
  isolation: isolate;
}

.workspace-model-navigation__model-icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  image-rendering: auto;
}

.workspace-model-navigation__model-icon svg {
  width: 20px;
  height: 20px;
}

html.jn-light-mode .workspace-model-navigation__model-icon img.is-light-monochrome-icon,
html[data-theme="light"] .workspace-model-navigation__model-icon img.is-light-monochrome-icon,
body.jn-light-mode .workspace-model-navigation__model-icon img.is-light-monochrome-icon,
body[data-theme="light"] .workspace-model-navigation__model-icon img.is-light-monochrome-icon {
  filter: brightness(0) saturate(100%);
  opacity: var(--front-model-nav-monochrome-opacity);
}

.workspace-model-navigation__model-copy {
  max-width: 100%;
  min-width: 0;
  display: block;
}

.workspace-model-navigation__model-copy strong {
  max-width: 116px;
  display: inline-block;
  overflow: hidden;
  color: var(--front-model-nav-title-text);
  font-size: 12.5px;
  font-weight: 800;
  line-height: 19px;
  text-overflow: ellipsis;
  vertical-align: top;
  white-space: nowrap;
}

.workspace-model-navigation__model-copy small {
  height: 29px;
  display: -webkit-box;
  margin-top: 4px;
  overflow: hidden;
  color: inherit;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.workspace-model-navigation__model:hover .workspace-model-navigation__model-copy strong,
.workspace-model-navigation__model.is-active .workspace-model-navigation__model-copy strong,
.workspace-model-navigation__model:hover .workspace-model-navigation__model-copy small,
.workspace-model-navigation__model.is-active .workspace-model-navigation__model-copy small {
  color: currentColor;
}

.workspace-model-navigation__add {
  border: 1px solid var(--front-menu-line);
  background: var(--front-model-nav-hover-surface);
  color: var(--front-model-nav-active-accent);
}

.workspace-model-navigation__add:hover {
  border-color: var(--front-model-nav-active-accent);
  background: var(--front-model-nav-active-surface);
  color: var(--front-model-nav-active-accent);
}

.workspace-model-navigation__model em {
  position: absolute;
  top: 10px;
  right: 12px;
  min-width: 34px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 7px;
  border: 1px solid var(--front-model-nav-tag-line);
  border-radius: 999px;
  background: var(--front-model-nav-tag-surface);
  color: var(--front-menu-item);
  font-size: 9.5px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.workspace-model-navigation__model[data-model-type="chat"] em {
  border-color: var(--front-model-nav-tag-chat-line);
  background: var(--front-model-nav-tag-chat-surface);
  color: var(--front-model-nav-tag-chat-text);
}

.workspace-model-navigation__model[data-model-type="image"] em {
  border-color: var(--front-model-nav-tag-image-line);
  background: var(--front-model-nav-tag-image-surface);
  color: var(--front-model-nav-tag-image-text);
}

.workspace-model-navigation__model[data-model-type="video"] em {
  border-color: var(--front-model-nav-tag-video-line);
  background: var(--front-model-nav-tag-video-surface);
  color: var(--front-model-nav-tag-video-text);
}

.workspace-model-navigation__model[data-model-type="audio"] em {
  border-color: var(--front-model-nav-tag-audio-line);
  background: var(--front-model-nav-tag-audio-surface);
  color: var(--front-model-nav-tag-audio-text);
}

body.front-creative-page.front-creative-menu-collapsed .workspace-model-navigation,
body.front-creative-page.is-sidebar-collapsed .workspace-model-navigation {
  display: none;
}

@media (max-width: 767px) {
  body.front-creative-page:not(.front-creative-menu-expanded) .workspace-model-navigation {
    display: none;
  }

  .workspace-model-navigation {
    padding-top: 18px;
  }

  .workspace-model-navigation__body {
    padding-bottom: 8px;
  }
}

.public-home-page {
  min-height: 100dvh;
  background: #050814;
  color: #f7f8fb;
}

.public-home-page .home-header {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: 20;
  height: 72px;
  border: 0;
  background: transparent;
}

.public-home-page .home-header__inner {
  width: 100%;
  max-width: none;
  height: 72px;
  padding: 0 31px;
}

.public-home-page .home-brand {
  gap: 8px;
  color: #2ed6ef;
  font-size: 18px;
}

.public-home-page .home-brand img {
  width: 34px;
  height: 34px;
}

.public-home-page .home-header__actions {
  gap: 7px;
}

.public-home-page .home-icon-button,
.public-home-page .home-header__start,
.public-home-page .home-language {
  height: 34px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 18px;
  background: rgba(8, 12, 24, .55);
  color: #f1f2f5;
}

.public-home-page .home-header__start {
  min-width: 82px;
  padding: 0 18px;
}

.public-home-page .home-language {
  min-width: 68px;
  display: grid;
  place-items: center;
  padding: 0 12px;
}

.public-home-page .home-main {
  background: #050814;
}

.public-home-page .home-hero {
  min-height: 900px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 42%, rgba(11, 108, 134, .09), transparent 37%),
    #050814;
}

.public-home-page .home-model-cloud {
  position: absolute;
  inset: 0;
  opacity: 1;
}

.public-home-page .home-model-tag {
  width: 12px;
  height: 12px;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 50%;
  background: rgba(114, 123, 155, .5);
  color: transparent;
  box-shadow: 0 0 5px rgba(85, 192, 218, .22);
}

.public-home-page .home-model-tag--2,
.public-home-page .home-model-tag--5,
.public-home-page .home-model-tag--8,
.public-home-page .home-model-tag--11 {
  background: rgba(0, 171, 190, .5);
}

.public-home-page .home-model-tag--3,
.public-home-page .home-model-tag--6,
.public-home-page .home-model-tag--10 {
  width: 10px;
  height: 10px;
  background: rgba(104, 75, 170, .45);
}

.public-home-page .home-hero__content {
  width: 100%;
  max-width: none;
  min-height: 900px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 235px;
  text-align: center;
}

.public-home-page .home-eyebrow {
  height: 31px;
  display: grid;
  place-items: center;
  margin: 0 0 31px;
  padding: 0 18px;
  border: 1px solid rgba(24, 143, 166, .28);
  border-radius: 18px;
  background: rgba(8, 52, 67, .28);
  color: #25d5e8;
  font-size: 13px;
}

.public-home-page .home-hero h1 {
  margin: 0;
  color: #f4f5f7;
  font-size: clamp(54px, 5.4vw, 76px);
  line-height: 1.05;
  letter-spacing: -.04em;
}

.public-home-page .home-hero h1 span {
  display: none;
}

.public-home-page .home-hero__content > p {
  width: min(620px, calc(100vw - 40px));
  margin: 98px 0 0;
  color: #9197a5;
  font-size: 16px;
  line-height: 1.8;
}

.public-home-page .home-hero__actions {
  margin-top: 38px;
  gap: 12px;
}

.public-home-page .home-button {
  height: 51px;
  min-width: 136px;
  border-radius: 26px;
}

.public-home-page .home-button--primary {
  background: #ffbd19;
  color: #151515;
}

.public-home-page .home-button--secondary {
  border: 1px solid rgba(255, 255, 255, .12);
  background: #1a1d25;
  color: #f0f1f3;
}

.public-home-page .home-stats {
  margin-top: 60px;
  gap: 10px;
}

.public-home-page .home-stats > div {
  width: 124px;
  height: 63px;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 12px;
  background: rgba(20, 25, 39, .72);
}

.public-home-page .home-stats strong {
  font-size: 23px;
}

.public-home-page .home-section,
.public-home-page .home-footer {
  background: #050814;
}

@media (max-width: 680px) {
  .public-home-page .home-header__inner {
    padding: 0 10px;
  }

  .public-home-page .home-brand span {
    display: inline;
    color: #28d4eb;
    font-size: 14px;
  }

  .public-home-page .home-brand img {
    width: 32px;
    height: 32px;
  }

  .public-home-page .home-header__actions {
    margin-left: auto;
  }

  .public-home-page .home-hero {
    min-height: 560px;
  }

  .public-home-page .home-hero__content {
    min-height: 560px;
    padding-top: 143px;
  }

  .public-home-page .home-model-tag {
    width: auto;
    height: auto;
    overflow: visible;
    border-radius: 0;
    background: transparent;
    color: #8991a6;
    font-size: 5px;
    line-height: 1;
    box-shadow: none;
  }

  .public-home-page .home-eyebrow {
    order: 1;
    height: 25px;
    margin-bottom: 10px;
    padding: 0 14px;
    font-size: 12px;
  }

  .public-home-page .home-hero h1 {
    order: 2;
    font-size: 39px;
    line-height: 1.08;
  }

  .public-home-page .home-hero h1 span {
    display: block;
    min-height: 43px;
    color: #16df9b;
  }

  .public-home-page .home-stats {
    order: 3;
    margin-top: 4px;
    gap: 5px;
  }

  .public-home-page .home-hero__actions {
    order: 4;
    width: calc(100% - 32px);
    margin-top: 9px;
    gap: 6px;
  }

  .public-home-page .home-hero__actions .home-button {
    width: 50%;
    min-width: 0;
    height: 34px;
  }

  .public-home-page .home-hero__content > p {
    display: none;
  }

  .public-home-page .home-stats > div {
    width: 74px;
    height: 41px;
  }

  .public-home-page .home-stats strong {
    font-size: 16px;
  }

  .public-home-page .home-stats span {
    font-size: 9px;
  }

  .public-home-page .home-section--workflow,
  .public-home-page .home-section--capabilities {
    display: none;
  }

  .public-home-page .home-section--inspiration {
    padding-top: 28px;
  }

  .public-home-page .home-section--inspiration .home-section__heading span {
    display: inline-flex;
  }

  .public-home-page .home-gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

html.workspace-model-picker-open,
html.workspace-model-picker-open body {
  overflow: hidden;
}

.workspace-model-navigation__add {
  width: var(--front-model-nav-card-width);
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 5px 0 8px;
  padding: 0 14px;
  border: 1px dashed var(--front-menu-line);
  border-radius: var(--front-model-nav-radius-small);
  background: var(--front-model-nav-search-surface);
  color: var(--front-menu-item);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.workspace-model-navigation__add[hidden] {
  display: none;
}

.workspace-model-navigation__add:hover {
  border-color: var(--front-menu-accent);
  color: var(--front-menu-accent);
}

.workspace-model-navigation__add svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.8;
}

.workspace-model-picker[hidden] {
  display: none;
}

.workspace-model-picker {
  position: fixed;
  inset: 0;
  z-index: var(--lz-workspace-model-picker-layer);
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(2, 6, 23, .48);
}

.workspace-model-picker__dialog {
  width: min(640px, calc(100vw - 48px));
  max-height: min(720px, calc(100vh - 48px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--lz-front-line);
  border-radius: 16px;
  outline: none;
  background: var(--lz-front-surface);
  color: var(--lz-front-text);
  box-shadow: var(--lz-front-shadow);
}

.workspace-model-picker__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 17px;
  border-bottom: 1px solid var(--lz-front-line);
}

.workspace-model-picker__header h2 {
  margin: 0;
  color: var(--lz-front-text);
  font-size: 18px;
  font-weight: 750;
  line-height: 1.35;
}

.workspace-model-picker__header p {
  margin: 5px 0 0;
  color: var(--lz-front-muted);
  font-size: 12px;
  line-height: 1.5;
}

.workspace-model-picker__close {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--lz-front-muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.workspace-model-picker__close:hover {
  background: var(--lz-front-surface-3);
  color: var(--lz-front-text);
}

.workspace-model-picker__search {
  height: 38px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 18px 24px 12px;
  padding: 0 12px;
  border: 1px solid var(--lz-front-line);
  border-radius: 9px;
  background: var(--lz-front-surface-2);
  color: var(--lz-front-muted);
}

.workspace-model-picker__search:focus-within {
  border-color: var(--lz-front-accent);
  box-shadow: 0 0 0 3px var(--lz-front-accent-soft);
}

.workspace-model-picker__search svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.8;
}

.workspace-model-picker .workspace-model-picker__search > input[type="search"] {
  width: 100%;
  height: 100%;
  min-width: 0;
  flex: 1 1 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  appearance: none;
  background: transparent;
  box-shadow: none;
  color: var(--lz-front-text);
  font: inherit;
  font-size: 13px;
}

.workspace-model-picker .workspace-model-picker__search > input[type="search"]::-webkit-search-decoration,
.workspace-model-picker .workspace-model-picker__search > input[type="search"]::-webkit-search-cancel-button {
  display: none;
}

.workspace-model-picker .workspace-model-picker__search > input[type="search"]::placeholder {
  color: var(--lz-front-muted);
}

.workspace-model-picker__status {
  padding: 18px 24px 25px;
  color: var(--lz-front-muted);
  font-size: 13px;
  text-align: center;
}

.workspace-model-picker__list {
  min-height: 0;
  flex: 1 1 auto;
  display: grid;
  align-content: start;
  gap: 7px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0 18px 20px 24px;
  scrollbar-width: thin;
  scrollbar-color: var(--lz-front-line-strong) transparent;
}

.workspace-model-picker__list::-webkit-scrollbar {
  width: 4px;
}

.workspace-model-picker__list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: var(--lz-front-line-strong);
}

.workspace-model-picker__item {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto 64px;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid transparent;
  border-radius: 11px;
  background: var(--lz-front-surface-2);
}

.workspace-model-picker__item:hover {
  border-color: var(--lz-front-line);
  background: var(--lz-front-surface-3);
}

.workspace-model-picker__icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 10px;
  background: var(--lz-front-surface-3);
  color: var(--lz-front-muted);
}

.workspace-model-picker__icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.workspace-model-picker__icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}

html.jn-light-mode .workspace-model-picker__icon img.is-light-monochrome-icon,
html[data-theme="light"] .workspace-model-picker__icon img.is-light-monochrome-icon {
  filter: brightness(0) saturate(100%);
}

.workspace-model-picker__copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.workspace-model-picker__copy strong,
.workspace-model-picker__copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-model-picker__copy strong {
  color: var(--lz-front-text);
  font-size: 13px;
  font-weight: 750;
}

.workspace-model-picker__copy small {
  color: var(--lz-front-muted);
  font-size: 11px;
}

.workspace-model-picker__tag {
  padding: 3px 7px;
  border: 1px solid var(--front-model-nav-tag-line);
  border-radius: 999px;
  background: var(--front-model-nav-tag-surface);
  color: var(--lz-front-muted);
  font-size: 10px;
  font-style: normal;
  white-space: nowrap;
}

.workspace-model-picker__tag.is-chat {
  border-color: var(--front-model-nav-tag-chat-line);
  background: var(--front-model-nav-tag-chat-surface);
  color: var(--front-model-nav-tag-chat-text);
}

.workspace-model-picker__tag.is-image {
  border-color: var(--front-model-nav-tag-image-line);
  background: var(--front-model-nav-tag-image-surface);
  color: var(--front-model-nav-tag-image-text);
}

.workspace-model-picker__tag.is-video {
  border-color: var(--front-model-nav-tag-video-line);
  background: var(--front-model-nav-tag-video-surface);
  color: var(--front-model-nav-tag-video-text);
}

.workspace-model-picker__tag.is-audio {
  border-color: var(--front-model-nav-tag-audio-line);
  background: var(--front-model-nav-tag-audio-surface);
  color: var(--front-model-nav-tag-audio-text);
}

.workspace-model-picker__action {
  min-width: 64px;
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--lz-front-accent);
  border-radius: 8px;
  background: var(--lz-front-accent);
  color: #fff;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.workspace-model-picker__action.is-added {
  border-color: var(--lz-front-line-strong);
  background: transparent;
  color: var(--lz-front-soft);
}

.workspace-model-picker__action:disabled {
  cursor: wait;
  opacity: .62;
}

@media (max-width: 640px) {
  .workspace-model-picker {
    align-items: end;
    padding: 0;
  }

  .workspace-model-picker__dialog {
    width: 100%;
    max-height: 88vh;
    border-radius: 16px 16px 0 0;
  }

  .workspace-model-picker__item {
    grid-template-columns: 42px minmax(0, 1fr) 60px;
  }

  .workspace-model-picker__tag {
    display: none;
  }
}

.workspace-model-picker.is-compact .workspace-model-picker__dialog { width: min(var(--lz-workspace-model-picker-compact-width), calc(100vw - var(--lz-workspace-model-picker-compact-screen-gap))); max-height: min(var(--lz-workspace-model-picker-compact-height), calc(100vh - var(--lz-workspace-model-picker-compact-screen-gap))); }
.workspace-model-picker.is-compact .workspace-model-picker__header { padding: var(--lz-workspace-model-picker-compact-header-padding); }
.workspace-model-picker.is-compact .workspace-model-picker__search { margin: var(--lz-workspace-model-picker-compact-search-margin); }
.workspace-model-picker.is-compact .workspace-model-picker__list { max-height: var(--lz-workspace-model-picker-compact-list-height); padding: var(--lz-workspace-model-picker-compact-list-padding); }
.workspace-model-picker.is-compact .workspace-model-picker__item { grid-template-columns: var(--lz-workspace-model-picker-compact-icon-size) minmax(0, 1fr) auto var(--lz-workspace-model-picker-compact-action-width); gap: var(--lz-workspace-model-picker-compact-gap); padding: var(--lz-workspace-model-picker-compact-item-padding); }
.workspace-model-picker.is-compact .workspace-model-picker__icon { width: var(--lz-workspace-model-picker-compact-icon-size); height: var(--lz-workspace-model-picker-compact-icon-size); }

.workspace-model-picker.is-compact.is-popover {
  display: block;
  padding: 0;
  background: transparent;
  pointer-events: none;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__dialog {
  position: fixed;
  top: var(--lz-workspace-model-picker-popover-top);
  left: var(--lz-workspace-model-picker-popover-left);
  pointer-events: auto;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__header h2 {
  font-size: var(--lz-workspace-model-picker-popover-title-size);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__header p {
  font-size: var(--lz-workspace-model-picker-popover-description-size);
  white-space: nowrap;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__close,
.workspace-model-picker.is-compact.is-popover .workspace-model-picker__search {
  display: none;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__list {
  gap: 0;
  padding: var(--lz-workspace-model-picker-popover-list-padding);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__item {
  position: relative;
  min-height: var(--lz-workspace-model-picker-popover-item-min-height);
  grid-template-columns: var(--lz-workspace-model-picker-compact-icon-size) minmax(0, 1fr);
  gap: var(--lz-workspace-model-picker-compact-gap);
  padding: var(--lz-workspace-model-picker-popover-item-padding);
  border-radius: var(--lz-workspace-model-picker-popover-item-radius);
  background: transparent;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__item:hover,
.workspace-model-picker.is-compact.is-popover .workspace-model-picker__item.is-selected {
  border-color: var(--lz-front-billing-border);
  background: var(--lz-front-billing-surface);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__copy {
  gap: var(--lz-workspace-model-picker-popover-copy-gap);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__copy strong {
  font-size: var(--lz-workspace-model-picker-popover-model-title-size);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__copy small {
  display: -webkit-box;
  overflow: hidden;
  font-size: var(--lz-workspace-model-picker-popover-model-description-size);
  line-height: var(--lz-workspace-model-picker-popover-description-line);
  text-overflow: ellipsis;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__tag {
  position: absolute;
  top: var(--lz-workspace-model-picker-popover-status-inset);
  right: var(--lz-workspace-model-picker-popover-status-inset);
  padding: var(--lz-workspace-model-picker-popover-status-padding);
  border-color: color-mix(in srgb, var(--lz-color-success) 55%, transparent);
  border-radius: var(--lz-workspace-model-picker-popover-status-radius);
  background: color-mix(in srgb, var(--lz-color-success) 10%, transparent);
  color: var(--lz-color-success);
  font-size: var(--lz-workspace-model-picker-popover-status-size);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__tag.is-empty {
  border-color: var(--lz-front-line);
  background: var(--lz-front-control);
  color: var(--lz-front-muted);
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__action {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: inherit;
  background: transparent;
  color: transparent;
  font-size: 0;
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__action:focus-visible {
  outline: var(--lz-border-width-lg) solid var(--lz-front-accent);
  outline-offset: calc(-1 * var(--lz-border-width-lg));
}

.workspace-model-picker.is-compact.is-popover .workspace-model-picker__item.is-selected::after {
  position: absolute;
  right: var(--lz-workspace-model-picker-popover-check-inset);
  bottom: var(--lz-workspace-model-picker-popover-check-inset);
  color: var(--lz-front-billing-text);
  content: "✓";
  font-size: var(--lz-workspace-model-picker-popover-check-size);
  font-weight: 700;
}

/* Shared generation progress component for image/video creation */
.lz-generation-progress{
  --lz-progress:28;
  --lz-progress-deg:101deg;
  width:100%;
  height:100%;
  min-height:132px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:16px 10px;
  color:rgba(216,216,223,.72);
  background:linear-gradient(180deg,#121218 0%,#101116 100%);
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.lz-generation-progress::before{
  content:"";
  position:absolute;
  width:92px;
  height:92px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(124,92,255,.16) 0%,rgba(59,130,246,.08) 28%,rgba(17,18,24,0) 66%);
  filter:blur(2px);
  transform:translateY(-12px);
  z-index:-1;
}
.lz-generation-orbit{
  width:68px;
  height:68px;
  aspect-ratio:1/1;
  flex:0 0 auto;
  position:relative;
  display:grid;
  place-items:center;
}
.lz-generation-ring{
  position:absolute;
  inset:0;
  border-radius:50%;
  display:block;
  box-sizing:border-box;
  font-weight:700;
  will-change:transform;
  transform-origin:50% 50%;
  backface-visibility:hidden;
}
.lz-generation-ring-outer{
  background:conic-gradient(from 90deg,transparent 0 28deg,rgba(86,122,255,.34) 70deg,#765cff 150deg,rgba(37,99,235,.58) 245deg,transparent 328deg 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));
  filter:drop-shadow(0 0 8px rgba(117,92,255,.28));
  animation:lzGenerationSpin 1.55s linear infinite;
  animation-delay:var(--lz-spin-outer-delay,0s);
  animation-play-state:running;
}
.lz-generation-ring-inner{
  inset:12px;
  background:conic-gradient(from 250deg,transparent 0 44deg,rgba(124,92,255,.82) 104deg,rgba(37,99,235,.58) 215deg,transparent 326deg 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 2.5px),#000 calc(100% - 2px));
  opacity:.78;
  animation:lzGenerationSpinReverse 2.45s linear infinite;
  animation-delay:var(--lz-spin-inner-delay,0s);
  animation-play-state:running;
}
.lz-generation-core{
  width:8px;
  height:8px;
  border-radius:50%;
  background:radial-gradient(circle,#9b76ff 0%,#754ce8 56%,#4f46e5 100%);
  color:#a7a7a7;
  border-color:#a7a7a7;
  font-weight:700;
  box-shadow:0 0 10px rgba(139,92,246,.64),0 0 22px rgba(79,70,229,.24);
}
.lz-generation-label{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:21px;
  color:rgba(215,215,222,.68);
  font-size:13px;
  line-height:1.2;
  font-weight:500;
  letter-spacing:0;
  white-space:nowrap;
  text-align:center;
  text-shadow:0 1px 0 rgba(255,255,255,.03);
}
.lz-generation-label span,
.lz-generation-label strong{
  color:inherit;
  font:inherit;
  letter-spacing:0;
  line-height:inherit;
  -webkit-text-fill-color:currentColor;
}
.lz-generation-label strong{font-weight:inherit}
.lz-generation-dots{
  display:inline-flex;
  align-items:center;
  gap:4.5px;
  margin-left:1px;
  transform:translateY(1px);
}
.lz-generation-dots i{
  width:4px;
  height:4px;
  border-radius:50%;
  background:rgba(139,92,246,.88);
  opacity:.42;
  animation:lzGenerationDot 1s ease-in-out infinite;
  animation-delay:var(--lz-dot-delay,0s);
  animation-play-state:running;
}
.lz-generation-dots i:nth-child(2){animation-delay:calc(var(--lz-dot-delay,0s) + .16s)}
.lz-generation-dots i:nth-child(3){animation-delay:calc(var(--lz-dot-delay,0s) + .32s)}
body.page-app .ai-draw-generated-art.is-loading{
  background:transparent;
  display:grid;
  place-items:stretch;
  justify-items:center;
}
body.page-app .ai-draw-generated-art.is-loading::before{
  content:none;
  display:none;
}
body.page-video .ai-video-status-card.has-generation-progress{
  padding:0;
  overflow:hidden;
  background:transparent;
  border-color:rgba(255,255,255,.07);
}
body.page-video .ai-video-status-card.has-generation-progress > div{
  width:100%;
  height:100%;
}
html.jn-light-mode .lz-generation-progress,
body.jn-light-mode .lz-generation-progress,
body.page-app.jn-light-mode .lz-generation-progress,
body.page-video.jn-light-mode .lz-generation-progress{
  background:linear-gradient(180deg,#f8fafc 0%,#eef2f7 100%);
  color:rgba(51,65,85,.72);
}
html.jn-light-mode .lz-generation-progress::before,
body.jn-light-mode .lz-generation-progress::before{
  background:radial-gradient(circle,rgba(124,92,255,.18) 0%,rgba(37,99,235,.1) 34%,rgba(248,250,252,0) 68%);
}
@keyframes lzGenerationSpin{from{transform:translateZ(0) rotate(0deg)}to{transform:translateZ(0) rotate(360deg)}}
@keyframes lzGenerationSpinReverse{from{transform:translateZ(0) rotate(0deg)}to{transform:translateZ(0) rotate(-360deg)}}
@keyframes lzGenerationDot{0%,100%{opacity:.42;transform:translateY(0)}45%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion: reduce){
.lz-generation-ring-outer{
    animation:lzGenerationSpin 1.55s linear infinite;
    animation-delay:var(--lz-spin-outer-delay,0s);
    animation-play-state:running;
  }
  .lz-generation-ring-inner{
    animation:lzGenerationSpinReverse 2.45s linear infinite;
    animation-delay:var(--lz-spin-inner-delay,0s);
    animation-play-state:running;
  }
  .lz-generation-dots i{
    animation:lzGenerationDot 1s ease-in-out infinite;
    animation-delay:var(--lz-dot-delay,0s);
    animation-play-state:running;
  }
}
@media(max-width:640px){
.lz-generation-progress{min-height:118px;gap:8px;padding:14px 9px}
  .lz-generation-orbit{width:62px;height:62px}
  .lz-generation-ring-inner{inset:12px}
  .lz-generation-label{font-size:12.5px}
}
body.page-app .ai-draw-generated-art .lz-generation-label span,
body.page-app .ai-draw-generated-art .lz-generation-label strong,
body.page-video .ai-video-status-card .lz-generation-label span,
body.page-video .ai-video-status-card .lz-generation-label strong{
  color:inherit;
  font-size:inherit;
  font-weight:inherit;
  letter-spacing:0;
  line-height:inherit;
  position:static;
  bottom:auto;
  -webkit-text-fill-color:currentColor;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-ring,
body.page-video .ai-video-status-card .lz-generation-progress .lz-generation-ring{
  position:absolute;
  display:block;
  box-sizing:border-box;
  bottom:auto;
  width:auto;
  height:auto;
  color:inherit;
  font-size:0;
  letter-spacing:0;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-ring-outer,
body.page-video .ai-video-status-card .lz-generation-progress .lz-generation-ring-outer{
  inset:0;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-ring-inner,
body.page-video .ai-video-status-card .lz-generation-progress .lz-generation-ring-inner{
  inset:12px;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-core,
body.page-video .ai-video-status-card .lz-generation-progress .lz-generation-core{
  position:relative;
  display:block;
  bottom:auto;
  width:8px;
  height:8px;
  font-size:0;
  letter-spacing:0;
}
body.page-app .ai-draw-generated-art .lz-generation-label,
body.page-video .ai-video-status-card .lz-generation-label{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:500;
  line-height:1;
  gap:5px;
}
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-phase],
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-percent],
body.page-video .ai-video-status-card .lz-generation-label [data-lz-phase],
body.page-video .ai-video-status-card .lz-generation-label [data-lz-percent]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  margin:0;
  padding:0;
  border:0;
  color:inherit;
  font-family:inherit;
  font-size:13px;
  line-height:1;
  font-weight:500;
  letter-spacing:0;
  white-space:nowrap;
  vertical-align:baseline;
  position:static;
  bottom:auto;
  transform:none;
  -webkit-text-fill-color:currentColor;
}
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-percent][hidden],
body.page-video .ai-video-status-card .lz-generation-label [data-lz-percent][hidden]{
  display:none;
}
body.page-app .ai-draw-generated-art .lz-generation-dots,
body.page-video .ai-video-status-card .lz-generation-dots{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  margin:0 0 0 1px;
  transform:none;
}
body.page-app .ai-draw-generated-art .lz-generation-dots i,
body.page-video .ai-video-status-card .lz-generation-dots i{
  display:block;
  width:4px;
  height:4px;
}
body.page-app .ai-draw-generated-art .lz-generation-label > span[data-lz-phase],
body.page-app .ai-draw-generated-art .lz-generation-label > strong[data-lz-percent],
body.page-video .ai-video-status-card.has-generation-progress .lz-generation-label > span[data-lz-phase],
body.page-video .ai-video-status-card.has-generation-progress .lz-generation-label > strong[data-lz-percent]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  height:16px;
  min-height:16px;
  margin:0;
  padding:0;
  color:inherit;
  font-family:inherit;
  font-size:13px;
  line-height:16px;
  font-weight:500;
  letter-spacing:0;
  white-space:nowrap;
  vertical-align:middle;
  position:static;
  inset:auto;
  transform:none;
}
body.page-video:not(#jnVideoFinalPolishA):not(#jnVideoFinalPolishB) .ai-video-status-card.has-generation-progress .lz-generation-label > span[data-lz-phase],
body.page-video:not(#jnVideoFinalPolishA):not(#jnVideoFinalPolishB) .ai-video-status-card.has-generation-progress .lz-generation-label > strong[data-lz-percent]{
  display:inline-flex;
  height:16px;
  min-height:16px;
  margin:0;
  color:inherit;
  font-size:13px;
  line-height:16px;
  font-weight:500;
  letter-spacing:0;
  vertical-align:middle;
}
body.page-app .ai-draw-generated-art .lz-generation-label > strong[data-lz-percent][hidden],
body.page-video .ai-video-status-card.has-generation-progress .lz-generation-label > strong[data-lz-percent][hidden]{
  display:none;
}
body.page-app .ai-draw-generated-art .lz-generation-label > .lz-generation-dots,
body.page-video .ai-video-status-card.has-generation-progress .lz-generation-label > .lz-generation-dots{
  height:16px;
  min-height:16px;
  display:inline-flex;
  align-items:center;
  align-self:center;
  margin:0 0 0 1px;
  transform:none;
}
@media(max-width:640px){
body.page-app .ai-draw-generated-art .lz-generation-label,
body.page-video .ai-video-status-card .lz-generation-label{font-size:12.5px}
  body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-phase],
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-percent],
body.page-video .ai-video-status-card .lz-generation-label [data-lz-phase],
body.page-video .ai-video-status-card .lz-generation-label [data-lz-percent]{font-size:12.5px}
}

/* Refined loading orbit: soft concentric glow,
closer to the requested reference. */
.lz-generation-progress{
  gap:13px;
  background:radial-gradient(circle at 50% 42%,rgba(28,31,45,.44) 0%,rgba(17,18,25,.98) 46%,#101116 100%);
}
.lz-generation-progress::before{
  width:118px;
  height:118px;
  background:radial-gradient(circle,rgba(124,92,255,.18) 0 7%,rgba(73,115,255,.14) 18%,rgba(30,44,92,.10) 34%,rgba(17,18,24,0) 68%);
  filter:blur(8px);
  opacity:.84;
  transform:translateY(-17px);
  z-index:0;
}
.lz-generation-orbit{
  width:74px;
  height:74px;
  isolation:isolate;
}
.lz-generation-orbit::before,
.lz-generation-orbit::after{
  content:"";
  position:absolute;
  pointer-events:none;
  border-radius:50%;
  z-index:0;
}
.lz-generation-orbit::before{
  inset:7px;
  background:radial-gradient(circle,rgba(125,92,255,.18) 0 7%,rgba(29,31,45,.80) 8% 42%,rgba(13,16,28,.34) 64%,rgba(13,16,28,0) 72%);
  box-shadow:inset 0 0 18px rgba(78,91,208,.24),0 0 20px rgba(99,102,241,.18);
}
.lz-generation-orbit::after{
  inset:13px;
  border:1px solid rgba(42,100,211,.42);
  box-shadow:inset 0 0 14px rgba(24,68,163,.30),0 0 9px rgba(29,78,216,.20);
  opacity:.88;
}
.lz-generation-ring{
  z-index:1;
}

.lz-generation-ring-outer{
  inset:3px;
  background:conic-gradient(from 72deg,rgba(54,94,218,.34) 0deg,rgba(102,87,255,.96) 58deg,rgba(145,98,255,.92) 122deg,rgba(65,116,236,.55) 214deg,rgba(43,74,168,.20) 292deg,rgba(54,94,218,.34) 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));
  filter:drop-shadow(0 0 6px rgba(119,92,255,.58)) drop-shadow(0 0 12px rgba(37,99,235,.26));
  opacity:.96;
  animation-duration:1.18s;
}
.lz-generation-ring-inner{
  inset:17px;
  background:conic-gradient(from 250deg,rgba(28,85,190,.22) 0deg,rgba(37,99,235,.72) 80deg,rgba(91,95,255,.58) 160deg,rgba(18,45,112,.24) 252deg,rgba(28,85,190,.22) 360deg);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#000 calc(100% - .75px));
  mask:radial-gradient(farthest-side,transparent calc(100% - 1.5px),#000 calc(100% - .75px));
  filter:drop-shadow(0 0 5px rgba(37,99,235,.30));
  opacity:.82;
  animation-duration:2.1s;
}
.lz-generation-core{
  position:relative;
  z-index:2;
  width:8px;
  height:8px;
  background:radial-gradient(circle,#d6c6ff 0 10%,#9c70ff 38%,#7149ee 72%,rgba(79,70,229,.88) 100%);
  box-shadow:0 0 8px rgba(166,128,255,.88),0 0 18px rgba(103,76,238,.50),0 0 34px rgba(59,130,246,.18);
}
.lz-generation-label{
  color:rgba(219,224,235,.80);
  text-shadow:none;
}
.lz-generation-dots i{
  width:3px;
  height:3px;
  background:rgba(124,92,255,.78);
  box-shadow:0 0 7px rgba(124,92,255,.52);
}

/* Light-mode orbit tuning: keep the same refined shape without the dark-mode haze. */
html.jn-light-mode .lz-generation-progress,
body.jn-light-mode .lz-generation-progress,
.jn-light-mode .lz-generation-progress,
html[data-theme="light"] .lz-generation-progress,
body[data-theme="light"] .lz-generation-progress,
[data-theme="light"] .lz-generation-progress{
  background:radial-gradient(circle at 50% 42%,rgba(219,234,254,.88) 0%,rgba(248,250,252,.98) 48%,#f8fafc 100%);
  color:rgba(51,65,85,.78);
}
html.jn-light-mode .lz-generation-progress::before,
body.jn-light-mode .lz-generation-progress::before,
.jn-light-mode .lz-generation-progress::before,
html[data-theme="light"] .lz-generation-progress::before,
body[data-theme="light"] .lz-generation-progress::before,
[data-theme="light"] .lz-generation-progress::before{
  background:radial-gradient(circle,rgba(124,92,255,.16) 0 8%,rgba(59,130,246,.12) 20%,rgba(186,230,253,.26) 42%,rgba(248,250,252,0) 70%);
  filter:blur(9px);
  opacity:.82;
}
html.jn-light-mode .lz-generation-orbit::before,
body.jn-light-mode .lz-generation-orbit::before,
.jn-light-mode .lz-generation-orbit::before,
html[data-theme="light"] .lz-generation-orbit::before,
body[data-theme="light"] .lz-generation-orbit::before,
[data-theme="light"] .lz-generation-orbit::before{
  background:radial-gradient(circle,rgba(124,92,255,.14) 0 8%,rgba(255,255,255,.88) 9% 40%,rgba(226,232,240,.60) 62%,rgba(219,234,254,0) 74%);
  box-shadow:inset 0 0 16px rgba(96,165,250,.20),0 0 18px rgba(99,102,241,.16);
}
html.jn-light-mode .lz-generation-orbit::after,
body.jn-light-mode .lz-generation-orbit::after,
.jn-light-mode .lz-generation-orbit::after,
html[data-theme="light"] .lz-generation-orbit::after,
body[data-theme="light"] .lz-generation-orbit::after,
[data-theme="light"] .lz-generation-orbit::after{
  border-color:rgba(37,99,235,.30);
  box-shadow:inset 0 0 13px rgba(59,130,246,.18),0 0 10px rgba(59,130,246,.15);
  opacity:.92;
}
html.jn-light-mode .lz-generation-ring-outer,
body.jn-light-mode .lz-generation-ring-outer,
.jn-light-mode .lz-generation-ring-outer,
html[data-theme="light"] .lz-generation-ring-outer,
body[data-theme="light"] .lz-generation-ring-outer,
[data-theme="light"] .lz-generation-ring-outer{
  background:conic-gradient(from 72deg,rgba(37,99,235,.32) 0deg,rgba(99,102,241,.90) 58deg,rgba(139,92,246,.84) 122deg,rgba(59,130,246,.50) 214deg,rgba(147,197,253,.28) 292deg,rgba(37,99,235,.32) 360deg);
  filter:drop-shadow(0 0 5px rgba(99,102,241,.34)) drop-shadow(0 0 10px rgba(59,130,246,.18));
  opacity:.94;
}
html.jn-light-mode .lz-generation-ring-inner,
body.jn-light-mode .lz-generation-ring-inner,
.jn-light-mode .lz-generation-ring-inner,
html[data-theme="light"] .lz-generation-ring-inner,
body[data-theme="light"] .lz-generation-ring-inner,
[data-theme="light"] .lz-generation-ring-inner{
  background:conic-gradient(from 250deg,rgba(147,197,253,.32) 0deg,rgba(37,99,235,.64) 80deg,rgba(99,102,241,.52) 160deg,rgba(191,219,254,.28) 252deg,rgba(147,197,253,.32) 360deg);
  filter:drop-shadow(0 0 5px rgba(59,130,246,.20));
  opacity:.86;
}
html.jn-light-mode .lz-generation-core,
body.jn-light-mode .lz-generation-core,
.jn-light-mode .lz-generation-core,
html[data-theme="light"] .lz-generation-core,
body[data-theme="light"] .lz-generation-core,
[data-theme="light"] .lz-generation-core{
  background:radial-gradient(circle,#f5f3ff 0 10%,#a78bfa 38%,#7c3aed 72%,rgba(79,70,229,.88) 100%);
  box-shadow:0 0 7px rgba(124,58,237,.56),0 0 16px rgba(99,102,241,.34),0 0 28px rgba(59,130,246,.18);
}
html.jn-light-mode .lz-generation-label,
body.jn-light-mode .lz-generation-label,
.jn-light-mode .lz-generation-label,
html[data-theme="light"] .lz-generation-label,
body[data-theme="light"] .lz-generation-label,
[data-theme="light"] .lz-generation-label{
  color:rgba(51,65,85,.78);
}
html.jn-light-mode .lz-generation-dots i,
body.jn-light-mode .lz-generation-dots i,
.jn-light-mode .lz-generation-dots i,
html[data-theme="light"] .lz-generation-dots i,
body[data-theme="light"] .lz-generation-dots i,
[data-theme="light"] .lz-generation-dots i{
  background:rgba(99,102,241,.70);
  box-shadow:0 0 6px rgba(99,102,241,.34);
}

body.page-app .ai-draw-generated-art.is-loading{
  display:grid;
  place-items:center;
  align-items:center;
  justify-content:stretch;
  background:transparent;
}
body.page-app .ai-draw-generated-art.is-loading::before{
  content:none;
  display:none;
}
body.page-app .ai-draw-generated-art .lz-generation-progress{
  min-height:100%;
}
body.page-app .ai-draw-generated-art .lz-generation-label span,
body.page-app .ai-draw-generated-art .lz-generation-label strong{
  position:static;
  bottom:auto;
  color:inherit;
  font-size:inherit;
  font-weight:inherit;
  letter-spacing:0;
  -webkit-text-fill-color:currentColor;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-ring{
  position:absolute;
  display:block;
  bottom:auto;
  width:auto;
  height:auto;
  font-size:0;
  letter-spacing:0;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-ring-outer{
  inset:0;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-ring-inner{
  inset:12px;
}
body.page-app .ai-draw-generated-art.is-loading .lz-generation-progress .lz-generation-core{
  position:relative;
  display:block;
  bottom:auto;
  width:8px;
  height:8px;
  font-size:0;
  letter-spacing:0;
}
body.page-app .ai-draw-generated-art .lz-generation-label{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:center;
  gap:5px;
  font-size:13px;
  font-weight:500;
  line-height:1;
}
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-phase],
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-percent]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  margin:0;
  padding:0;
  color:inherit;
  font-family:inherit;
  font-size:13px;
  line-height:1;
  font-weight:500;
  letter-spacing:0;
  white-space:nowrap;
  vertical-align:baseline;
  position:static;
  bottom:auto;
  transform:none;
  -webkit-text-fill-color:currentColor;
}
body.page-app .ai-draw-generated-art .lz-generation-label [data-lz-percent][hidden]{
  display:none;
}
body.page-app .ai-draw-generated-art .lz-generation-dots{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  margin:0 0 0 1px;
  transform:none;
}
body.page-app .ai-draw-generated-art .lz-generation-label > span[data-lz-phase],
body.page-app .ai-draw-generated-art .lz-generation-label > strong[data-lz-percent]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  height:16px;
  min-height:16px;
  margin:0;
  padding:0;
  color:inherit;
  font-family:inherit;
  font-size:13px;
  line-height:16px;
  font-weight:500;
  letter-spacing:0;
  white-space:nowrap;
  vertical-align:middle;
  position:static;
  inset:auto;
  transform:none;
}
body.page-app .ai-draw-generated-art .lz-generation-label > strong[data-lz-percent][hidden]{
  display:none;
}
body.page-app .ai-draw-generated-art .lz-generation-label > .lz-generation-dots{
  height:16px;
  min-height:16px;
  display:inline-flex;
  align-items:center;
  align-self:center;
  margin:0 0 0 1px;
  transform:none;
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-progress,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-progress,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-progress,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-progress{
  background:radial-gradient(circle at 50% 42%,rgba(219,234,254,.90) 0%,rgba(248,250,252,.98) 48%,#f8fafc 100%);
  color:rgba(51,65,85,.76);
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-progress::before,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-progress::before,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-progress::before,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-progress::before{
  background:radial-gradient(circle,rgba(124,92,255,.14) 0 8%,rgba(59,130,246,.12) 22%,rgba(186,230,253,.30) 44%,rgba(248,250,252,0) 72%);
  filter:blur(9px);
  opacity:.82;
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-orbit::before,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-orbit::before,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-orbit::before,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-orbit::before{
  background:radial-gradient(circle,rgba(124,92,255,.13) 0 8%,rgba(255,255,255,.90) 9% 40%,rgba(226,232,240,.62) 62%,rgba(219,234,254,0) 74%);
  box-shadow:inset 0 0 16px rgba(96,165,250,.20),0 0 18px rgba(99,102,241,.15);
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-orbit::after,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-orbit::after,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-orbit::after,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-orbit::after{
  border-color:rgba(37,99,235,.30);
  box-shadow:inset 0 0 13px rgba(59,130,246,.18),0 0 10px rgba(59,130,246,.14);
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-outer,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-outer,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-outer,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-outer{
  background:conic-gradient(from 72deg,rgba(37,99,235,.32) 0deg,rgba(99,102,241,.88) 58deg,rgba(139,92,246,.82) 122deg,rgba(59,130,246,.50) 214deg,rgba(147,197,253,.28) 292deg,rgba(37,99,235,.32) 360deg);
  color:rgba(51,65,85,.76);
  border-color:rgba(51,65,85,.76);
  font-weight:700;
  filter:drop-shadow(0 0 5px rgba(99,102,241,.32)) drop-shadow(0 0 10px rgba(59,130,246,.16));
  opacity:.94;
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-inner,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-inner,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-inner,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-progress .lz-generation-orbit > .lz-generation-ring-inner{
  background:conic-gradient(from 250deg,rgba(147,197,253,.32) 0deg,rgba(37,99,235,.62) 80deg,rgba(99,102,241,.50) 160deg,rgba(191,219,254,.28) 252deg,rgba(147,197,253,.32) 360deg);
  color:rgba(51,65,85,.76);
  border-color:rgba(51,65,85,.76);
  font-weight:700;
  filter:drop-shadow(0 0 5px rgba(59,130,246,.18));
  opacity:.86;
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-core,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-core,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-core,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-core{
  background:radial-gradient(circle,#f5f3ff 0 10%,#a78bfa 38%,#7c3aed 72%,rgba(79,70,229,.88) 100%);
  border-color:#64748b;
  font-weight:700;
  box-shadow:0 0 7px rgba(124,58,237,.54),0 0 16px rgba(99,102,241,.32),0 0 28px rgba(59,130,246,.16);
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-label,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-label,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-label,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-label{
  color:rgba(51,65,85,.76);
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-label > span[data-lz-phase],
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-label > span[data-lz-phase],
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-label > span[data-lz-phase],
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-label > span[data-lz-phase]{
  color:rgba(51,65,85,.76);
}
html.jn-light-mode body.page-app .ai-draw-generated-art .lz-generation-dots i,
body.page-app.jn-light-mode .ai-draw-generated-art .lz-generation-dots i,
html[data-theme="light"] body.page-app .ai-draw-generated-art .lz-generation-dots i,
body.page-app[data-theme="light"] .ai-draw-generated-art .lz-generation-dots i{
  background:rgba(99,102,241,.68);
  box-shadow:0 0 6px rgba(99,102,241,.32);
}
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame]{
  position:relative;
  width:100%;
  height:auto;
  aspect-ratio:var(--ai-draw-ratio,1 / 1);
  overflow:hidden;
  display:block;
  place-items:unset;
  background:var(--front-workspace-bg,var(--lz-front-workspace-bg,#1b1c20));
}
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > img[data-generated-media],
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > img[data-image-preview],
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > video,
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > canvas{
  width:100%;
  height:100%;
  min-width:100%;
  min-height:100%;
  max-width:100%;
  max-height:none;
  aspect-ratio:auto;
  object-fit:cover;
  object-position:center center;
  display:block;
  background:transparent;
  opacity:1;
  visibility:visible;
  transition:opacity .14s ease;
}
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame].is-media-error > .ai-draw-image-tools{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > .ai-draw-generated-art{
  position:relative;
  inset:0;
  width:100%;
  height:100%;
  min-width:100%;
  min-height:100%;
  max-width:100%;
  max-height:none;
  aspect-ratio:auto;
  display:block;
  border:0;
  border-radius:0;
  box-shadow:none;
  outline:0;
  overflow:hidden;
}
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > .ai-draw-generated-art.is-media-loading{
  position:absolute;
  inset:0;
  z-index:3;
}
body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame] > .ai-draw-generated-art.is-error{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-items:center;
  justify-content:center;
  gap:7px;
  padding:16px;
  box-sizing:border-box;
  background:#252427;
  color:#e9e8eb;
  border-color:transparent;
  box-shadow:none;
}
body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  font-size:15px;
  font-weight:900;
  letter-spacing:0;
  border:1px solid rgba(225,119,119,.24);
  border-radius:50%;
  background:rgba(225,119,119,.09);
  color:#e49191;
  -webkit-text-fill-color:#e49191;
}

body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title{
  margin:1px 0 0;
  color:#ededee;
  -webkit-text-fill-color:#ededee;
  font-size:14px;
  font-weight:600;
  line-height:20px;
  letter-spacing:0;
}
body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint{
  max-width:100%;
  color:#aaa8ad;
  -webkit-text-fill-color:#aaa8ad;
  font-size:11px;
  font-weight:400;
  line-height:16px;
  letter-spacing:0;
  text-align:center;
}
html.jn-light-mode body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error,
html[data-theme="light"] body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error,
body.page-app.jn-light-mode .ai-draw-message-block .ai-draw-generated-art.is-error,
body.page-app[data-theme="light"] .ai-draw-message-block .ai-draw-generated-art.is-error{
  background:#fff;
  color:#27272a;
  box-shadow:inset 0 0 0 1px #d4d4d8;
}
html.jn-light-mode body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon,
html[data-theme="light"] body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon,
body.page-app.jn-light-mode .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon,
body.page-app[data-theme="light"] .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon{
  border-color:#d4d4d8;
  background:#f4f4f5;
  color:#71717a;
  -webkit-text-fill-color:#71717a;
}
html.jn-light-mode body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title,
html[data-theme="light"] body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title,
body.page-app.jn-light-mode .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title,
body.page-app[data-theme="light"] .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title{
  color:#27272a;
  -webkit-text-fill-color:#27272a;
}
html.jn-light-mode body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint,
html[data-theme="light"] body.page-app .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint,
body.page-app.jn-light-mode .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint,
body.page-app[data-theme="light"] .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint{
  color:#71717a;
  -webkit-text-fill-color:#71717a;
}
:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page:not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error,
body.page-app.front-creative-page:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error{
  background:#fff;
  color:#27272a;
  box-shadow:inset 0 0 0 1px #d4d4d8;
}
:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page:not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon,
body.page-app.front-creative-page:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-icon{
  border-color:#d4d4d8;
  background:#f4f4f5;
  color:#71717a;
  -webkit-text-fill-color:#71717a;
}
:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page:not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title,
body.page-app.front-creative-page:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-title{
  color:#27272a;
  -webkit-text-fill-color:#27272a;
}
:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page:not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint,
body.page-app.front-creative-page:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .ai-draw-message-block .ai-draw-generated-art.is-error .ai-draw-error-hint{
  color:#71717a;
  -webkit-text-fill-color:#71717a;
}
html.jn-light-mode body.page-app .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame],
body.page-app.jn-light-mode .ai-draw-message-block .ai-draw-result-card .ai-draw-result-image[data-image-frame]{
  background:#f1f5f9;
}

@media(max-width:560px){
  body.page-app .ai-draw-batch-grid .ai-draw-generated-art.is-error{
    gap:5px;
    padding:8px;
  }
  body.page-app .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-icon{
    width:28px;
    height:28px;
    flex-basis:28px;
  }
  body.page-app .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-icon svg{
    width:15px;
    height:15px;
  }
  body.page-app .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-title{
    font-size:12px;
    line-height:17px;
  }
  body.page-app .ai-draw-batch-grid .ai-draw-generated-art.is-error .ai-draw-error-hint{
    display:none;
  }
}

.media-player-dialog {
  position: fixed;
  inset: 0;
  z-index: var(--lz-media-player-layer);
  box-sizing: border-box;
  display: grid;
  place-items: center;
  padding: var(--lz-space-5);
  background: var(--lz-media-player-overlay);
  color: var(--lz-front-composer-text);
  opacity: 0;
  transition: opacity 160ms ease;
}
.media-player-dialog.is-open { opacity: 1; }
.media-player-panel {
  box-sizing: border-box;
  width: min(100%, var(--lz-media-player-width));
  max-height: calc(100dvh - (var(--lz-space-5) * 2));
  padding: var(--lz-space-5);
  display: grid;
  gap: var(--lz-space-4);
  overflow: auto;
  border: 1px solid var(--lz-front-composer-border);
  border-radius: var(--lz-radius-xl);
  outline: 0;
  background: var(--lz-front-param-panel);
  box-shadow: var(--lz-front-param-shadow);
}
.media-player-header,
.media-player-controls,
.media-player-volume,
.media-player-actions,
.media-player-timeline > div {
  display: flex;
  align-items: center;
}
.media-player-header { justify-content: space-between; gap: var(--lz-space-4); }
.media-player-header > div,
.media-player-copy { min-width: 0; display: grid; gap: var(--lz-space-1); }
.media-player-kicker,
.media-player-copy span,
.media-player-timeline time { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); }
.media-player-header strong,
.media-player-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-player-close,
.media-player-volume button {
  width: var(--lz-control-height-sm);
  height: var(--lz-control-height-sm);
  min-width: var(--lz-control-height-sm);
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--lz-front-composer-border);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-front-composer-control);
  color: var(--lz-front-composer-text);
  cursor: pointer;
}
.media-player-close svg,
.media-player-volume svg,
.media-player-actions svg,
.media-player-toggle svg {
  width: var(--lz-icon-size-md);
  height: var(--lz-icon-size-md);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.media-player-art {
  position: relative;
  width: var(--lz-media-player-art-size);
  height: var(--lz-media-player-art-size);
  margin: 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--lz-front-composer-border);
  border-radius: var(--lz-radius-xl);
  background: var(--lz-front-composer-control);
  overflow: hidden;
}
.media-player-disc {
  width: var(--lz-media-player-disc-size);
  height: var(--lz-media-player-disc-size);
  display: grid;
  place-items: center;
  border-radius: var(--lz-radius-pill);
  border: 1px solid var(--lz-front-composer-border);
  background: var(--lz-front-workspace-bg);
  box-shadow: var(--lz-front-param-shadow);
}
.media-player-disc::before,
.media-player-disc::after { content: ''; position: absolute; border: 1px solid var(--lz-front-composer-border); border-radius: var(--lz-radius-pill); }
.media-player-disc::before { width: 74%; height: 74%; }
.media-player-disc::after { width: 42%; height: 42%; }
.media-player-disc i { z-index: 1; width: var(--lz-space-4); height: var(--lz-space-4); border-radius: var(--lz-radius-pill); background: var(--lz-color-primary); }
.media-player-panel.is-playing .media-player-disc { animation: mediaPlayerRotate 7s linear infinite; }
.media-player-wave { position: absolute; inset: auto var(--lz-space-3) var(--lz-space-3); height: var(--lz-space-6); display: flex; align-items: end; justify-content: center; gap: var(--lz-space-1); }
.media-player-wave i { width: var(--lz-space-1); height: 35%; border-radius: var(--lz-radius-pill); background: var(--lz-color-primary); opacity: .7; }
.media-player-wave i:nth-child(2n) { height: 70%; }
.media-player-wave i:nth-child(3n) { height: 100%; }
.media-player-panel.is-playing .media-player-wave i { animation: mediaPlayerWave .8s ease-in-out infinite alternate; }
.media-player-panel.is-playing .media-player-wave i:nth-child(2n) { animation-delay: 160ms; }
.media-player-panel.is-playing .media-player-wave i:nth-child(3n) { animation-delay: 320ms; }
.media-player-copy { text-align: center; }
.media-player-copy strong { font-size: var(--lz-font-size-lg); }
.media-player-timeline { display: grid; gap: var(--lz-space-2); }
.media-player-timeline > div { justify-content: space-between; }
.media-player-range,
.media-player-timeline input,
.media-player-volume input {
  --media-range-progress: 0%;
  height: var(--lz-media-player-thumb-size);
  margin: 0;
  appearance: none;
  background: transparent;
  cursor: pointer;
}
.media-player-timeline input { width: 100%; }
.media-player-volume input { width: var(--lz-media-player-volume-width); min-width: 0; }
.media-player-timeline input::-webkit-slider-runnable-track,
.media-player-volume input::-webkit-slider-runnable-track { height: var(--lz-media-player-track-height); border-radius: var(--lz-radius-pill); background: linear-gradient(to right, var(--lz-color-primary) 0 var(--media-range-progress), var(--lz-front-composer-border) var(--media-range-progress) 100%); }
.media-player-timeline input::-webkit-slider-thumb,
.media-player-volume input::-webkit-slider-thumb { width: var(--lz-media-player-thumb-size); height: var(--lz-media-player-thumb-size); margin-top: calc((var(--lz-media-player-track-height) - var(--lz-media-player-thumb-size)) / 2); appearance: none; border: 0; border-radius: var(--lz-radius-pill); background: var(--lz-color-primary); box-shadow: var(--lz-shadow-sm); }
.media-player-timeline input::-moz-range-track,
.media-player-volume input::-moz-range-track { height: var(--lz-media-player-track-height); border: 0; border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-border); }
.media-player-timeline input::-moz-range-progress,
.media-player-volume input::-moz-range-progress { height: var(--lz-media-player-track-height); border-radius: var(--lz-radius-pill); background: var(--lz-color-primary); }
.media-player-timeline input::-moz-range-thumb,
.media-player-volume input::-moz-range-thumb { width: var(--lz-media-player-thumb-size); height: var(--lz-media-player-thumb-size); border: 0; border-radius: var(--lz-radius-pill); background: var(--lz-color-primary); box-shadow: var(--lz-shadow-sm); }
.media-player-controls { min-height: var(--lz-media-player-toggle-size); justify-content: space-between; gap: var(--lz-space-3); }
.media-player-volume { flex: 1 1 0; gap: var(--lz-space-2); }
.media-player-toggle {
  width: var(--lz-media-player-toggle-size);
  height: var(--lz-media-player-toggle-size);
  min-width: var(--lz-media-player-toggle-size);
  padding: 0;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: var(--lz-radius-pill);
  background: var(--lz-color-primary);
  color: var(--lz-color-surface);
  cursor: pointer;
}
.media-player-toggle svg { width: var(--lz-space-6); height: var(--lz-space-6); }
.media-player-actions { flex: 1 1 0; justify-content: flex-end; gap: var(--lz-space-2); }
.media-player-actions button {
  height: var(--lz-media-player-action-height);
  min-width: max-content;
  padding: 0 var(--lz-space-3);
  display: inline-flex;
  align-items: center;
  gap: var(--lz-space-2);
  border: 1px solid var(--lz-front-composer-border);
  border-radius: var(--lz-radius-md);
  background: var(--lz-front-composer-control);
  color: var(--lz-front-composer-text);
  font-size: var(--lz-font-size-xs);
  cursor: pointer;
}
.media-player-actions button:hover,
.media-player-close:hover,
.media-player-volume button:hover { background: var(--lz-front-param-panel-hover); }
.media-player-panel audio { display: none; }
@keyframes mediaPlayerRotate { to { transform: rotate(360deg); } }
@keyframes mediaPlayerWave { to { height: 30%; opacity: .42; } }
@media (max-width: 600px) {
  .media-player-dialog { padding: var(--lz-space-3); }
  .media-player-panel { max-height: calc(100dvh - (var(--lz-space-3) * 2)); padding: var(--lz-space-4); }
  .media-player-art { width: min(var(--lz-media-player-art-size), 54vw); height: min(var(--lz-media-player-art-size), 54vw); }
  .media-player-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .media-player-volume input { display: block; width: min(100%, var(--lz-media-player-volume-width)); }
  .media-player-actions { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; }
  .media-player-actions button { width: 100%; min-width: 0; justify-content: center; white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
  .media-player-dialog,
  .media-player-disc,
  .media-player-wave i { transition: none; animation: none; }
}

body.page-gallery,
body.page-records {
  --front-work-page-bg: #111;
  --front-work-shell-bg: #181818;
  --front-work-card-bg: #1b1b1d;
  --front-work-card-hover: #1f1f21;
  --front-work-media-bg: #0f0f10;
  --front-work-text: #f2f2f2;
  --front-work-strong: #f4f4f5;
  --front-work-muted: #8a8a8e;
  --front-work-line: rgba(255,255,255,.08);
  --front-work-line-strong: rgba(255,255,255,.12);
  --front-work-control-bg: #121212;
  --front-work-menu-bg: #242426;
  --front-work-shadow: 0 14px 34px rgba(0,0,0,.20);
  --front-work-detail-shadow: 0 30px 80px rgba(0,0,0,.42);
}

html.jn-light-mode body.page-gallery,
html.jn-light-mode body.page-records,
html[data-theme="light"] body.page-gallery,
html[data-theme="light"] body.page-records,
body.page-gallery.jn-light-mode,
body.page-records.jn-light-mode {
  --front-work-page-bg: #f5f7fb;
  --front-work-shell-bg: #fff;
  --front-work-card-bg: #fff;
  --front-work-card-hover: #fff;
  --front-work-media-bg: #f1f5f9;
  --front-work-text: #0f172a;
  --front-work-strong: #0f172a;
  --front-work-muted: #64748b;
  --front-work-line: rgba(15,23,42,.10);
  --front-work-line-strong: rgba(15,23,42,.14);
  --front-work-control-bg: #fff;
  --front-work-menu-bg: #fff;
  --front-work-shadow: 0 14px 34px rgba(15,23,42,.10);
  --front-work-detail-shadow: 0 26px 70px rgba(15,23,42,.16);
}

body.page-gallery .front-work-library,
body.page-records .front-work-library {
  position: relative;
  height: 100dvh;
  min-height: 0;
  max-height: none;
  padding: 0;
  overflow: hidden;
  background: var(--front-work-page-bg);
  color: var(--front-work-text);
}

body.page-gallery .front-work-shell,
body.page-records .front-work-shell {
  position: absolute;
  inset: 18px;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  border: 1px solid var(--front-work-line);
  border-radius: 18px;
  background: var(--front-work-shell-bg);
  color: var(--front-work-text);
  overflow: hidden;
  box-shadow: none;
}

body.page-gallery .front-work-toolbar,
body.page-records .front-work-toolbar {
  position: relative;
  z-index: 20;
  display: grid;
  gap: 12px;
  padding: 15px 16px 12px;
  border-bottom: 1px solid var(--front-work-line);
  background: var(--front-work-shell-bg);
}

body.page-gallery .front-work-tools,
body.page-records .front-work-tools {
  display: grid;
  grid-template-columns: 160px 170px minmax(170px,340px) 146px;
  gap: 10px;
  align-items: center;
}

body.page-gallery .front-work-scroll,
body.page-records .front-work-scroll {
  min-height: 0;
  overflow: auto;
  padding: 16px;
  background: var(--front-work-page-bg);
  scrollbar-width: none;
}

body.page-gallery .front-work-scroll::-webkit-scrollbar,
body.page-records .front-work-scroll::-webkit-scrollbar,
.front-work-detail-body::-webkit-scrollbar,
.front-work-detail-prompt::-webkit-scrollbar,
.front-work-detail-actions::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

body.page-gallery .front-work-grid,
body.page-records .front-work-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(238px,1fr));
  gap: 14px;
  align-content: start;
}

body.page-gallery .front-work-card,
body.page-records .front-work-card {
  position: relative;
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-rows: auto 118px;
  border: 1px solid var(--front-work-line);
  border-radius: 16px;
  background: var(--front-work-card-bg);
  color: var(--front-work-text);
  overflow: visible;
  box-shadow: none;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease, background .16s ease;
}

body.page-gallery .front-work-card[hidden],
body.page-records .front-work-card[hidden] {
  display: none;
}

body.page-gallery .front-work-card:hover,
body.page-records .front-work-card:hover {
  border-color: var(--front-work-line-strong);
  background: var(--front-work-card-hover);
  transform: translateY(-1px);
  box-shadow: var(--front-work-shadow);
}

body.page-gallery .front-work-card.is-selected,
body.page-records .front-work-card.is-selected {
  border-color: rgba(250,204,21,.7);
  box-shadow: 0 0 0 2px rgba(250,204,21,.14);
}

body.page-gallery .front-work-media,
body.page-records .front-work-media {
  position: relative;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  color: #fff;
  border-radius: 15px 15px 0 0;
  background: var(--front-work-media-bg);
  overflow: hidden;
  cursor: pointer;
}

body.page-gallery .front-work-media > img,
body.page-gallery .front-work-media > video,
body.page-records .front-work-media > img,
body.page-records .front-work-media > video {
  width: 100%;
  height: 100%;
  display: block;
  background: var(--front-work-media-bg);
}

body.page-gallery .front-work-media > img,
body.page-records .front-work-media > img {
  object-fit: cover;
}

body.page-gallery .front-work-media > video,
body.page-records .front-work-media > video {
  object-fit: contain;
}

body.page-gallery .front-work-card-body,
body.page-records .front-work-card-body {
  position: relative;
  min-height: 118px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 10px 12px 11px;
  border-top: 1px solid var(--front-work-line);
  border-radius: 0 0 15px 15px;
  background: var(--front-work-card-bg);
  color: var(--front-work-text);
  overflow: visible;
}

body.page-gallery .front-work-empty,
body.page-records .front-work-empty {
  min-height: 220px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--front-work-line-strong);
  border-radius: 14px;
  background: var(--front-work-shell-bg);
  color: var(--front-work-muted);
  text-align: center;
  padding: 24px;
}

body.page-gallery .front-work-footer,
body.page-records .front-work-footer {
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding: 10px 16px;
  border-top: 1px solid var(--front-work-line);
  background: var(--front-work-shell-bg);
}

.front-work-detail-layer {
  position: fixed;
  inset: 0;
  z-index: 100050;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(0,0,0,.42);
}

html.jn-light-mode .front-work-detail-layer,
html[data-theme="light"] .front-work-detail-layer,
body.jn-light-mode .front-work-detail-layer {
  background: rgba(226,232,240,.62);
}

.front-work-detail-modal {
  width: min(1080px,calc(100vw - 36px));
  max-height: min(640px,calc(100dvh - 36px));
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(430px,.72fr);
  overflow: hidden;
  border: 1px solid var(--front-work-line-strong,rgba(255,255,255,.10));
  border-radius: 18px;
  background: var(--front-work-shell-bg,#171719);
  color: var(--front-work-strong,#f4f4f5);
  box-shadow: var(--front-work-detail-shadow,0 30px 80px rgba(0,0,0,.42));
}

.front-work-detail-media {
  min-height: 0;
  display: grid;
  place-items: center;
  background: var(--front-work-media-bg,#0f0f10);
  overflow: hidden;
}

.front-work-detail-media img,
.front-work-detail-media video {
  width: 100%;
  height: 100%;
  max-height: min(640px,calc(100dvh - 36px));
  object-fit: contain;
  background: var(--front-work-media-bg,#0f0f10);
}

.front-work-detail-side {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  border-left: 1px solid var(--front-work-line,rgba(255,255,255,.08));
  background: var(--front-work-card-bg,#1b1b1d);
}

.front-work-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--front-work-line,rgba(255,255,255,.08));
}

.front-work-detail-title {
  min-width: 0;
}

.front-work-detail-head h2,
.front-work-detail-head strong {
  margin: 0;
  color: var(--front-work-strong,#f4f4f5);
  font-size: 17px;
  font-weight: 950;
  line-height: 1.25;
}

.front-work-detail-head p {
  margin: 4px 0 0;
  color: var(--front-work-muted,#8a8a8e);
  font-size: 12px;
}

.front-work-detail-author {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.front-work-detail-close {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  flex: none;
  border: 1px solid var(--front-work-line-strong,rgba(255,255,255,.10));
  border-radius: 10px;
  background: var(--front-work-menu-bg,#242426);
  color: var(--front-work-strong,#d4d4d8);
  cursor: pointer;
}

.front-work-detail-close:hover {
  background: var(--front-work-strong,#fff);
  color: var(--front-work-page-bg,#111);
}

.front-work-detail-body {
  min-height: 0;
  overflow: auto;
  padding: 14px 16px;
  scrollbar-width: none;
}

.front-work-detail-prompt {
  margin: 0 0 12px;
  padding: 11px 12px;
  border: 1px solid var(--front-work-line,rgba(255,255,255,.08));
  border-radius: 12px;
  background: var(--front-work-control-bg,#121212);
  color: var(--front-work-strong,#f4f4f5);
  font-size: 12.5px;
  line-height: 1.65;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 6.8em;
  overflow: auto;
  scrollbar-width: none;
}

.front-work-detail-list {
  display: grid;
  gap: 8px;
}

.front-work-detail-row {
  display: grid;
  grid-template-columns: 72px minmax(0,1fr);
  gap: 10px;
  align-items: start;
  color: var(--front-work-text,#d4d4d8);
  font-size: 12px;
  line-height: 1.45;
}

.front-work-detail-row span:first-child {
  color: var(--front-work-muted,#858585);
  font-weight: 850;
}

.front-work-detail-row strong {
  min-width: 0;
  color: var(--front-work-strong,#e7e7ea);
  font-weight: 850;
  overflow: hidden;
  text-overflow: ellipsis;
}

.front-work-detail-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(104px,1fr));
  gap: 7px;
  padding: 12px 16px;
  border-top: 1px solid var(--front-work-line,rgba(255,255,255,.08));
  overflow-x: auto;
  scrollbar-width: none;
}

.front-work-detail-actions form {
  display: contents;
}

.front-work-detail-actions a,
.front-work-detail-actions button {
  height: 34px;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid var(--front-work-line-strong,rgba(255,255,255,.10));
  border-radius: 10px;
  background: transparent;
  color: var(--front-work-strong,#f4f4f5);
  padding: 0 9px;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: none;
  overflow: hidden;
  text-overflow: ellipsis;
}

.front-work-detail-actions a:hover,
.front-work-detail-actions button:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
}

html.jn-light-mode .front-work-detail-actions a:hover,
html.jn-light-mode .front-work-detail-actions button:hover,
html[data-theme="light"] .front-work-detail-actions a:hover,
html[data-theme="light"] .front-work-detail-actions button:hover,
body.jn-light-mode .front-work-detail-actions a:hover,
body.jn-light-mode .front-work-detail-actions button:hover {
  background: #f1f5f9;
  border-color: rgba(15,23,42,.18);
  color: #0f172a;
}

.front-work-detail-actions svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.page-gallery .front-work-detail-layer,
body.page-records .front-work-detail-layer {
  position: fixed;
  inset: 0;
  z-index: 100050;
  display: grid;
  place-items: center;
  padding: 18px;
}

body.page-gallery .front-work-detail-modal,
body.page-records .front-work-detail-modal {
  width: min(1080px,calc(100vw - 36px));
  height: auto;
  max-height: min(640px,calc(100dvh - 36px));
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(430px,.72fr);
  grid-template-rows: none;
  border-radius: 18px;
}

body.page-gallery .front-work-detail-media,
body.page-records .front-work-detail-media {
  min-height: 0;
  padding: 0;
}

body.page-gallery .front-work-detail-side,
body.page-records .front-work-detail-side {
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  border-left: 1px solid var(--front-work-line,rgba(255,255,255,.08));
}

body.page-gallery .front-work-detail-head,
body.page-records .front-work-detail-head {
  height: auto;
  align-items: flex-start;
  padding: 16px 16px 12px;
}

body.page-gallery .front-work-detail-body,
body.page-records .front-work-detail-body {
  display: block;
  min-height: 0;
  padding: 14px 16px;
  gap: 0;
}

body.page-gallery .front-work-detail-row,
body.page-records .front-work-detail-row {
  grid-template-columns: 72px minmax(0,1fr);
  gap: 10px;
}

body.page-gallery .front-work-detail-actions,
body.page-records .front-work-detail-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(104px,1fr));
  gap: 7px;
  padding: 12px 16px;
  flex-wrap: initial;
}

body.page-gallery .front-work-detail-actions form,
body.page-records .front-work-detail-actions form {
  display: contents;
}

body.page-gallery .front-work-detail-actions a,
body.page-gallery .front-work-detail-actions button,
body.page-records .front-work-detail-actions a,
body.page-records .front-work-detail-actions button,
body.page-records .front-work-detail-actions form button {
  height: 34px;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
  padding: 0 9px;
  font-size: 12px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

@media (max-width: 760px) {
  body.page-gallery .front-work-shell,
  body.page-records .front-work-shell {
    inset: 10px;
    border-radius: 14px;
  }

  body.page-gallery .front-work-toolbar,
  body.page-records .front-work-toolbar {
    padding: 12px 12px 10px;
    gap: 10px;
  }

  body.page-gallery .front-work-tools,
  body.page-records .front-work-tools {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  body.page-gallery .front-work-scroll,
  body.page-records .front-work-scroll {
    padding: 12px;
  }

  body.page-gallery .front-work-grid,
  body.page-records .front-work-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
  }

  body.page-gallery .front-work-card,
  body.page-records .front-work-card {
    grid-template-rows: auto 96px;
    border-radius: 14px;
  }

  body.page-gallery .front-work-media,
  body.page-records .front-work-media {
    border-radius: 13px 13px 0 0;
  }

  body.page-gallery .front-work-card-body,
  body.page-records .front-work-card-body {
    min-height: 96px;
    padding: 7px 8px 8px;
    border-radius: 0 0 13px 13px;
    gap: 4px;
  }

  .front-work-detail-layer {
    padding: 10px;
  }

  .front-work-detail-modal {
    width: min(370px,calc(100vw - 20px));
    max-height: calc(100dvh - 20px);
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0,1fr);
    border-radius: 16px;
  }

  .front-work-detail-media {
    height: min(42dvh,280px);
    min-height: 180px;
  }

  .front-work-detail-media img,
  .front-work-detail-media video {
    height: 100%;
    max-height: none;
  }

  .front-work-detail-side {
    border-left: 0;
    border-top: 1px solid var(--front-work-line,rgba(255,255,255,.08));
    min-height: 0;
  }

  .front-work-detail-head {
    padding: 12px 12px 10px;
  }

  .front-work-detail-head h2,
  .front-work-detail-head strong {
    font-size: 15px;
  }

  .front-work-detail-body {
    padding: 12px;
    max-height: 240px;
  }

  .front-work-detail-row {
    grid-template-columns: 64px minmax(0,1fr);
    font-size: 11.5px;
  }

  .front-work-detail-actions {
    grid-template-columns: repeat(3,minmax(0,1fr));
    padding: 10px 12px;
    gap: 6px;
  }

  .front-work-detail-actions a,
  .front-work-detail-actions button {
    height: 32px;
    padding: 0 8px;
    font-size: 11px;
  }

  body.page-gallery .front-work-detail-layer,
  body.page-records .front-work-detail-layer {
    padding: 10px;
    place-items: center;
  }

  body.page-gallery .front-work-detail-modal,
  body.page-records .front-work-detail-modal {
    width: min(370px,calc(100vw - 20px));
    max-height: calc(100dvh - 20px);
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0,1fr);
    border-radius: 16px;
  }

  body.page-gallery .front-work-detail-media,
  body.page-records .front-work-detail-media {
    height: min(42dvh,280px);
    min-height: 180px;
  }

  body.page-gallery .front-work-detail-side,
  body.page-records .front-work-detail-side {
    border-left: 0;
    border-top: 1px solid var(--front-work-line,rgba(255,255,255,.08));
  }

  body.page-gallery .front-work-detail-head,
  body.page-records .front-work-detail-head {
    padding: 12px 12px 10px;
  }

  body.page-gallery .front-work-detail-body,
  body.page-records .front-work-detail-body {
    padding: 12px;
    max-height: 240px;
  }

  body.page-gallery .front-work-detail-row,
  body.page-records .front-work-detail-row {
    grid-template-columns: 64px minmax(0,1fr);
    font-size: 11.5px;
  }

  body.page-gallery .front-work-detail-actions,
  body.page-records .front-work-detail-actions {
    grid-template-columns: repeat(3,minmax(0,1fr));
    padding: 10px 12px;
    gap: 6px;
  }

  body.page-gallery .front-work-detail-actions a,
  body.page-gallery .front-work-detail-actions button,
  body.page-records .front-work-detail-actions a,
  body.page-records .front-work-detail-actions button,
  body.page-records .front-work-detail-actions form button {
    height: 32px;
    padding: 0 8px;
    font-size: 11px;
  }
}

@media (max-width: 420px) {
  body.page-gallery .front-work-shell,
  body.page-records .front-work-shell {
    inset: 8px;
  }

  body.page-gallery .front-work-toolbar,
  body.page-records .front-work-toolbar {
    padding: 10px;
  }

  body.page-gallery .front-work-scroll,
  body.page-records .front-work-scroll {
    padding: 10px;
  }
}

.public-page:has(.public-login) {
  min-height: 100dvh;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 56%, rgba(35, 49, 80, .18), transparent 22%),
    radial-gradient(circle at 72% 25%, rgba(17, 54, 78, .12), transparent 24%),
    #02050a;
  color: #f1f3f7;
}

.public-page:has(.public-login) .public-header,
.public-page:has(.public-login) .public-footer {
  display: none;
}

.public-login {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0, 0, 0, .22);
}

.public-login__card {
  position: relative;
  width: min(406px, calc(100vw - 28px));
  min-height: 490px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 28px 22px 18px;
  border: 1px solid rgba(143, 165, 203, .2);
  border-radius: 17px;
  background: rgba(7, 13, 24, .94);
  color: #f3f4f7;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .5);
}

.public-login__close {
  position: absolute;
  right: 11px;
  top: 10px;
  width: 33px;
  height: 33px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 11px;
  background: #151c28;
  color: #8e96a5;
  font-size: 24px;
  line-height: 1;
  text-decoration: none;
}

.public-login__brand {
  display: grid;
  place-items: center;
  gap: 5px;
  margin-top: 2px;
}

.public-login__brand img {
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.public-login__brand strong {
  color: #f4f5f7;
  font-size: 25px;
}

.public-login__card h1 {
  margin: 0 0 12px;
  color: #f4f5f7;
  font-size: 26px;
  text-align: center;
}

.public-login__intro,
.public-login__status {
  color: #8f97a5;
  text-align: center;
}

.public-login__intro {
  margin: 6px 0 12px;
  font-size: 12px;
}

.public-login__tabs {
  height: 40px;
  display: flex;
  margin-bottom: 10px;
  padding: 3px;
  border: 1px solid rgba(137, 157, 190, .2);
  border-radius: 9px;
  background: #070c15;
}

.public-login__tabs button {
  min-width: 0;
  flex: 1;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #8790a0;
  font: 12px/1 inherit;
}

.public-login__tabs button.is-active {
  border: 1px solid rgba(25, 164, 202, .4);
  background: rgba(10, 77, 99, .28);
  color: #eaf9ff;
}

.public-login__tabs button[hidden],
.public-login__code-fields[hidden],
.public-login__password-fields[hidden],
.public-form__field[hidden],
.public-login__social[hidden] {
  display: none;
}

.public-login .public-form {
  display: grid;
  gap: 10px;
  margin-top: 0;
}

.public-login__code-fields,
.public-login__password-fields {
  display: grid;
  gap: 10px;
}

.public-login .public-form__field {
  color: #aab0bb;
  font-size: 12px;
}

.public-login .lz-field {
  height: 40px;
  margin-top: 6px;
  border: 1px solid rgba(137, 157, 190, .2);
  border-radius: 8px;
  background: #070d16;
  color: #eef0f4;
}

.public-login__code-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 90px;
  gap: 8px;
}

.public-login__code-row .lz-field {
  margin: 0;
}

.public-login__code-row button {
  border: 1px solid rgba(137, 157, 190, .2);
  border-radius: 8px;
  background: #0b111b;
  color: #dce1e8;
  font-size: 12px;
}

.public-login__code-row button:disabled {
  color: #727b89;
}

.public-login .public-form__captcha {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 98px;
  gap: 8px;
}

.public-login .public-captcha-code {
  min-height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(137, 157, 190, .2);
  border-radius: 8px;
  background: #f5f5f3;
  color: #273142;
  font-weight: 800;
  letter-spacing: 5px;
}

.public-login .lz-button {
  height: 40px;
  border: 1px solid rgba(28, 152, 197, .38);
  border-radius: 8px;
  background: #0a1b28;
  color: #ecf8ff;
}

.public-login__agree {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: #8e96a4;
  font-size: 10px;
}

.public-login__agree input {
  margin: 0;
  accent-color: #27a9d1;
}

.public-login__agree a {
  color: #aab5c8;
}

.public-login .public-form__error {
  margin: 0;
  color: #ff9292;
  font-size: 11px;
  text-align: center;
}

.public-login__status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.public-login__social {
  margin-top: 8px;
  color: #8e96a4;
  font-size: 11px;
  text-align: center;
}

.public-login .lz-button--secondary {
  border-color: rgba(255, 255, 255, .12);
  background: #151b25;
  color: #e6e8ec;
}

.public-login .public-hero__actions {
  justify-content: center;
}

@media (max-width: 520px) {
  .public-login {
    padding: 14px;
  }

  .public-login__card {
    min-height: 464px;
    padding: 26px 20px 16px;
  }
}

body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-tool {
  width: fit-content;
  min-width: 0;
  max-width: var(--lz-audio-voice-trigger-max-width);
  margin-right: auto;
  flex: 0 1 auto;
}
body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-tool[hidden] { display: none; }
body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-trigger {
  width: max-content;
  min-width: 0;
  max-width: 100%;
  height: var(--lz-audio-voice-trigger-height);
  padding: 0 var(--lz-space-3);
  display: inline-flex;
  align-items: center;
  gap: var(--lz-space-1);
  border: 1px solid var(--lz-front-composer-control-border);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-front-floating-control);
  color: var(--lz-front-composer-text);
  box-shadow: var(--lz-shadow-sm);
  font: 600 var(--lz-font-size-sm)/var(--lz-line-height-tight) var(--lz-font-sans);
  cursor: pointer;
  transition: border-color var(--lz-duration-fast) var(--lz-ease-standard), background var(--lz-duration-fast) var(--lz-ease-standard);
}
body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-trigger:not(:disabled):hover {
  border-color: var(--lz-color-primary);
  background: var(--lz-front-floating-control-hover);
}
body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-trigger:disabled { cursor: default; opacity: var(--lz-opacity-disabled); }
.audio-voice-picker-trigger-icon {
  width: var(--lz-icon-size-md);
  min-width: var(--lz-icon-size-md);
  height: var(--lz-icon-size-md);
  display: grid;
  place-items: center;
  color: var(--lz-front-composer-text);
}
.audio-voice-picker-trigger-icon svg,
.audio-voice-picker-head svg,
.audio-voice-preview svg,
.audio-voice-card-icon svg,
.audio-voice-card-check svg {
  width: var(--lz-icon-size-md);
  height: var(--lz-icon-size-md);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.audio-voice-picker-trigger-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audio-voice-picker-layer {
  position: fixed;
  z-index: var(--lz-audio-voice-dialog-layer);
  inset: 0;
  padding: var(--lz-space-5);
  display: grid;
  place-items: center;
  background: var(--lz-audio-voice-overlay);
  opacity: 0;
  transition: opacity var(--lz-duration-normal) var(--lz-ease-standard);
}
.audio-voice-picker-layer.is-open { opacity: 1; }
.audio-voice-picker-dialog {
  width: min(100%, var(--lz-audio-voice-dialog-width));
  max-height: var(--lz-audio-voice-dialog-max-height);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid var(--lz-front-param-panel-border);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-front-param-panel);
  color: var(--lz-front-composer-text);
  box-shadow: var(--lz-front-param-shadow);
  transform: translateY(var(--lz-space-2));
  transition: transform var(--lz-duration-normal) var(--lz-ease-standard);
}
.audio-voice-picker-layer.is-open .audio-voice-picker-dialog { transform: none; }
.audio-voice-picker-head {
  min-width: 0;
  padding: var(--lz-space-5) var(--lz-space-6) var(--lz-space-4);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--lz-space-4);
}
.audio-voice-picker-head > div { min-width: 0; display: grid; gap: var(--lz-space-1); }
.audio-voice-picker-head strong { font-size: var(--lz-font-size-xl); line-height: var(--lz-line-height-tight); }
.audio-voice-picker-head span { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-sm); line-height: var(--lz-line-height-normal); }
.audio-voice-picker-head > button {
  width: var(--lz-control-height-sm);
  min-width: var(--lz-control-height-sm);
  height: var(--lz-control-height-sm);
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid var(--lz-front-composer-control-border);
  border-radius: var(--lz-radius-sm);
  background: var(--lz-front-composer-control);
  color: var(--lz-front-composer-text);
  cursor: pointer;
}
.audio-voice-filters {
  margin: 0 var(--lz-space-6);
  padding: var(--lz-space-3) 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--lz-space-4);
  border-top: 1px solid var(--lz-front-param-panel-border);
  border-bottom: 1px solid var(--lz-front-param-panel-border);
}
.audio-voice-filters > span { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-sm); font-weight: 600; }
.audio-voice-filters > div { padding: var(--lz-space-1); display: flex; gap: var(--lz-space-1); border-radius: var(--lz-radius-md); background: var(--lz-front-composer-control); }
.audio-voice-filters button {
  min-width: var(--lz-control-width-sm);
  height: var(--lz-control-height-sm);
  padding: 0 var(--lz-space-3);
  border: 0;
  border-radius: var(--lz-radius-sm);
  background: transparent;
  color: var(--lz-front-composer-muted);
  font-size: var(--lz-font-size-sm);
  font-weight: 600;
  cursor: pointer;
}
.audio-voice-filters button.is-active { background: var(--lz-color-primary); color: var(--lz-color-surface); box-shadow: var(--lz-shadow-sm); }
.audio-voice-picker-body { min-height: 0; padding: var(--lz-space-5) var(--lz-space-6); overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--lz-front-composer-control-border) transparent; }
.audio-voice-picker-body::-webkit-scrollbar { width: var(--lz-scrollbar-size); }
.audio-voice-picker-body::-webkit-scrollbar-track { background: transparent; }
.audio-voice-picker-body::-webkit-scrollbar-thumb { border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-control-border); }
.audio-voice-group + .audio-voice-group { margin-top: var(--lz-space-6); }
.audio-voice-group > header { margin-bottom: var(--lz-space-3); padding-bottom: var(--lz-space-2); display: flex; align-items: center; gap: var(--lz-space-2); border-bottom: 1px solid var(--lz-front-param-panel-border); }
.audio-voice-group > header strong { font-size: var(--lz-font-size-md); }
.audio-voice-group > header span { min-width: var(--lz-icon-size-md); height: var(--lz-icon-size-md); padding: 0 var(--lz-space-1); display: inline-grid; place-items: center; border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-control); color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); }
.audio-voice-grid { display: grid; grid-template-columns: repeat(5, minmax(var(--lz-audio-voice-card-min-width), 1fr)); gap: var(--lz-space-3); }
.audio-voice-card {
  position: relative;
  min-width: 0;
  min-height: var(--lz-audio-voice-card-min-height);
  padding: var(--lz-space-3);
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
  justify-items: center;
  gap: var(--lz-space-2);
  overflow: hidden;
  border: 1px solid var(--lz-front-param-panel-border);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-audio-voice-neutral-surface);
  color: var(--lz-front-composer-text);
  cursor: pointer;
  outline: 0;
  transition: border-color var(--lz-duration-fast) var(--lz-ease-standard), background var(--lz-duration-fast) var(--lz-ease-standard);
}
.audio-voice-card:hover,
.audio-voice-card:focus-visible { border-color: var(--lz-color-primary); }
.audio-voice-card.is-selected { border-color: var(--lz-color-primary); box-shadow: inset 0 0 0 var(--lz-focus-ring-size) var(--lz-color-primary-soft); }
.audio-voice-card.is-male { background: var(--lz-audio-voice-male-surface); }
.audio-voice-card.is-female { background: var(--lz-audio-voice-female-surface); }
.audio-voice-card-icon { width: var(--lz-audio-voice-card-icon-size); height: var(--lz-audio-voice-card-icon-size); display: grid; place-items: center; border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-control); color: var(--lz-color-primary); }
.audio-voice-card-name { width: 100%; overflow: hidden; text-align: center; font-size: var(--lz-font-size-sm); text-overflow: ellipsis; white-space: nowrap; }
.audio-voice-card-tags { width: 100%; display: flex; justify-content: center; gap: var(--lz-space-1); overflow: hidden; }
.audio-voice-card-tags span { min-width: 0; max-width: 70%; padding: var(--lz-space-1) var(--lz-space-2); overflow: hidden; border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-control); color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); line-height: var(--lz-line-height-tight); text-overflow: ellipsis; white-space: nowrap; }
.audio-voice-card-tags .audio-voice-gender-tag { max-width: none; color: var(--lz-color-primary); }
.audio-voice-card-description { width: 100%; margin: 0; overflow: hidden; color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); line-height: var(--lz-line-height-normal); text-align: center; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.audio-voice-preview { height: var(--lz-audio-voice-preview-size); padding: 0 var(--lz-space-2); display: inline-flex; align-items: center; gap: var(--lz-space-1); border: 1px solid var(--lz-front-composer-control-border); border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-control); color: var(--lz-front-composer-text); font-size: var(--lz-font-size-xs); cursor: pointer; }
.audio-voice-preview svg { width: var(--lz-icon-size-sm); height: var(--lz-icon-size-sm); }
.audio-voice-preview:disabled { color: var(--lz-front-composer-muted); cursor: not-allowed; opacity: var(--lz-opacity-disabled); }
.audio-voice-card.is-playing .audio-voice-preview { background: var(--lz-color-primary); border-color: var(--lz-color-primary); color: var(--lz-color-surface); }
.audio-voice-card-check { position: absolute; right: var(--lz-space-2); top: var(--lz-space-2); color: var(--lz-color-primary); opacity: 0; }
.audio-voice-card.is-selected .audio-voice-card-check { opacity: 1; }
.audio-voice-empty { padding: var(--lz-space-8); color: var(--lz-front-composer-muted); text-align: center; font-size: var(--lz-font-size-sm); }
.audio-voice-picker-foot { padding: var(--lz-space-4) var(--lz-space-6); display: flex; align-items: center; justify-content: space-between; gap: var(--lz-space-4); border-top: 1px solid var(--lz-front-param-panel-border); }
.audio-voice-picker-foot > div { min-width: 0; display: grid; gap: var(--lz-space-1); }
.audio-voice-picker-foot > div span { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); }
.audio-voice-picker-foot > div strong { overflow: hidden; font-size: var(--lz-font-size-sm); text-overflow: ellipsis; white-space: nowrap; }
.audio-voice-picker-foot > button { height: var(--lz-control-height-md); padding: 0 var(--lz-space-5); border: 1px solid var(--lz-color-primary); border-radius: var(--lz-radius-sm); background: var(--lz-color-primary); color: var(--lz-color-surface); font-size: var(--lz-font-size-sm); font-weight: 600; cursor: pointer; }
.audio-voice-picker-foot > button:disabled { cursor: not-allowed; opacity: var(--lz-opacity-disabled); }
@media (max-width: 767px) {
  body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-workspace-floating-tools { flex-wrap: nowrap; }
  body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-tool { width: fit-content; max-width: min(var(--lz-audio-voice-trigger-max-width), 48%); flex-basis: auto; }
  body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-trigger { width: max-content; max-width: 100%; height: 30px; min-height: 30px; max-height: 30px; }
  .audio-voice-picker-layer { padding: var(--lz-space-3); align-items: end; }
  .audio-voice-picker-dialog { max-height: calc(100dvh - (var(--lz-space-3) * 2)); border-radius: var(--lz-radius-lg) var(--lz-radius-lg) 0 0; }
  .audio-voice-picker-head { padding: var(--lz-space-4); }
  .audio-voice-picker-head strong { font-size: var(--lz-font-size-lg); }
  .audio-voice-picker-head span { font-size: var(--lz-font-size-xs); }
  .audio-voice-filters { margin: 0 var(--lz-space-4); gap: var(--lz-space-2); }
  .audio-voice-filters button { min-width: 0; padding: 0 var(--lz-space-2); }
  .audio-voice-picker-body { padding: var(--lz-space-4); }
  .audio-voice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--lz-space-2); }
  .audio-voice-card { min-height: var(--lz-audio-voice-card-min-height); padding: var(--lz-space-2); }
  .audio-voice-picker-foot { padding: var(--lz-space-3) var(--lz-space-4); }
  .audio-voice-picker-foot > button { padding: 0 var(--lz-space-3); }
}
@media (max-width: 420px) {
  .audio-voice-picker-trigger-label { font-size: var(--lz-font-size-xs); }
}
@media (prefers-reduced-motion: reduce) {
  .audio-voice-picker-layer,
  .audio-voice-picker-dialog,
  .audio-voice-card,
  body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-voice-picker-trigger { transition: none; }
}

body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-lyrics-generator-tool {
  width: fit-content;
  min-width: 0;
  max-width: var(--lz-audio-lyrics-trigger-max-width);
  margin-right: auto;
  flex: 0 1 auto;
}
body.page-audio.front-creative-page [data-front-creative-composer="audio"] .audio-lyrics-generator-tool[hidden],
.audio-lyrics-layer[hidden],
.audio-lyrics-input-state[hidden],
.audio-lyrics-loading-state[hidden],
.audio-lyrics-result-state[hidden] { display: none; }
.audio-lyrics-generator-trigger {
  width: max-content;
  min-width: 0;
  max-width: 100%;
  height: var(--lz-audio-voice-trigger-height);
  padding: 0 var(--lz-space-3);
  display: inline-flex;
  align-items: center;
  gap: var(--lz-space-1);
  border: 1px solid var(--lz-front-composer-control-border);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-front-floating-control);
  color: var(--lz-front-composer-text);
  box-shadow: var(--lz-shadow-sm);
  font: 600 var(--lz-font-size-sm)/var(--lz-line-height-tight) var(--lz-font-sans);
  cursor: pointer;
  transition: border-color var(--lz-duration-fast) var(--lz-ease-standard), background var(--lz-duration-fast) var(--lz-ease-standard), color var(--lz-duration-fast) var(--lz-ease-standard);
}
.audio-lyrics-generator-trigger:hover,
.audio-lyrics-generator-trigger:focus-visible { border-color: var(--lz-audio-lyrics-primary); background: var(--lz-front-floating-control-hover); color: var(--lz-audio-lyrics-primary); }
.audio-lyrics-generator-trigger > span { width: var(--lz-icon-size-md); height: var(--lz-icon-size-md); display: grid; place-items: center; }
.audio-lyrics-generator-trigger svg,
.audio-lyrics-head svg { width: var(--lz-icon-size-md); height: var(--lz-icon-size-md); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.audio-lyrics-generator-trigger strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.audio-lyrics-layer {
  position: fixed;
  z-index: var(--lz-audio-lyrics-layer);
  inset: 0;
  padding: var(--lz-space-4);
  display: grid;
  place-items: center;
  overflow: auto;
  overscroll-behavior: contain;
  background: var(--lz-audio-lyrics-overlay);
  opacity: 0;
  transition: opacity var(--lz-duration-normal) var(--lz-ease-standard);
}
.audio-lyrics-layer.is-open { opacity: 1; }
.audio-lyrics-dialog {
  width: min(100%, var(--lz-audio-lyrics-dialog-width));
  max-height: min(var(--lz-audio-lyrics-dialog-max-height), calc(100dvh - (var(--lz-space-4) * 2)));
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--lz-front-param-panel-border);
  border-radius: var(--lz-radius-xl);
  background: var(--lz-front-param-panel);
  color: var(--lz-front-composer-text);
  box-shadow: var(--lz-audio-lyrics-shadow);
  font-family: var(--lz-font-sans);
  transform: translateY(var(--lz-space-2)) scale(0.99);
  transition: transform var(--lz-duration-normal) var(--lz-ease-standard);
}
.audio-lyrics-layer.is-open .audio-lyrics-dialog { transform: none; }
.audio-lyrics-head { padding: var(--lz-space-4) var(--lz-space-5) var(--lz-space-3); display: flex; align-items: flex-start; justify-content: space-between; gap: var(--lz-space-4); }
.audio-lyrics-head > div { min-width: 0; display: flex; align-items: flex-start; gap: var(--lz-space-3); }
.audio-lyrics-head > div > div { min-width: 0; display: grid; gap: var(--lz-space-1); }
.audio-lyrics-head strong { font-size: var(--lz-font-size-xl); line-height: var(--lz-line-height-tight); }
.audio-lyrics-head small { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-sm); line-height: var(--lz-line-height-normal); }
.audio-lyrics-mark { width: var(--lz-control-height-sm); min-width: var(--lz-control-height-sm); height: var(--lz-control-height-sm); display: grid; place-items: center; border-radius: var(--lz-radius-md); background: var(--lz-audio-lyrics-primary-soft); color: var(--lz-audio-lyrics-primary); font-size: var(--lz-font-size-xl); font-weight: 700; }
.audio-lyrics-head > button { width: var(--lz-control-height-sm); min-width: var(--lz-control-height-sm); height: var(--lz-control-height-sm); padding: 0; display: grid; place-items: center; border: 1px solid var(--lz-front-composer-control-border); border-radius: var(--lz-radius-md); background: var(--lz-front-composer-control); color: var(--lz-front-composer-muted); cursor: pointer; }
.audio-lyrics-head > button:not(:disabled):hover { color: var(--lz-front-composer-text); background: var(--lz-front-param-panel-hover); }
.audio-lyrics-head > button:disabled { cursor: not-allowed; opacity: var(--lz-opacity-disabled); }
.audio-lyrics-price { margin: 0 var(--lz-space-5); padding: var(--lz-space-2) var(--lz-space-3); display: flex; align-items: center; justify-content: space-between; gap: var(--lz-space-3); border: 1px solid var(--lz-audio-lyrics-result-line); border-radius: var(--lz-radius-md); background: var(--lz-audio-lyrics-primary-soft); }
.audio-lyrics-price > span { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-sm); }
.audio-lyrics-price strong { color: var(--lz-front-composer-text); font-size: var(--lz-font-size-sm); }
.audio-lyrics-price i { color: var(--lz-audio-lyrics-warning); font-style: normal; }
.audio-lyrics-input-state { min-height: 0; padding: var(--lz-space-4) var(--lz-space-5) var(--lz-space-5); display: grid; gap: var(--lz-space-3); overflow: auto; }
.audio-lyrics-input-state label { display: grid; gap: var(--lz-space-1); }
.audio-lyrics-input-state label > span { display: flex; align-items: center; gap: var(--lz-space-2); color: var(--lz-front-composer-text); font-size: var(--lz-font-size-sm); font-weight: 600; }
.audio-lyrics-input-state em { padding: var(--lz-space-1) var(--lz-space-2); border-radius: var(--lz-radius-pill); background: var(--lz-front-composer-control); color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-xs); font-style: normal; font-weight: 400; }
.audio-lyrics-input-state input,
.audio-lyrics-input-state textarea { width: 100%; padding: var(--lz-space-2) var(--lz-space-3); border: 1px solid var(--lz-front-composer-control-border); border-radius: var(--lz-radius-md); outline: none; background: var(--lz-front-composer-control); color: var(--lz-front-composer-text); font: 400 var(--lz-font-size-sm)/var(--lz-line-height-normal) var(--lz-font-sans); resize: vertical; transition: border-color var(--lz-duration-fast) var(--lz-ease-standard), box-shadow var(--lz-duration-fast) var(--lz-ease-standard); }
.audio-lyrics-input-state input { height: var(--lz-control-height-md); }
.audio-lyrics-input-state input::placeholder,
.audio-lyrics-input-state textarea::placeholder { color: var(--lz-front-composer-muted); }
.audio-lyrics-input-state input:focus,
.audio-lyrics-input-state textarea:focus { border-color: var(--lz-audio-lyrics-primary); box-shadow: 0 0 0 var(--lz-focus-ring-size) var(--lz-audio-lyrics-primary-soft); }
.audio-lyrics-primary { min-height: var(--lz-control-height-md); padding: var(--lz-space-2) var(--lz-space-4); display: flex; align-items: center; justify-content: center; gap: var(--lz-space-3); border: 1px solid var(--lz-audio-lyrics-primary); border-radius: var(--lz-radius-md); background: var(--lz-audio-lyrics-primary); color: var(--lz-audio-lyrics-primary-contrast); font: 600 var(--lz-font-size-md)/var(--lz-line-height-tight) var(--lz-font-sans); cursor: pointer; }
.audio-lyrics-primary:hover { border-color: var(--lz-audio-lyrics-primary-hover); background: var(--lz-audio-lyrics-primary-hover); }
.audio-lyrics-primary small { padding-left: var(--lz-space-3); border-left: 1px solid color-mix(in srgb, var(--lz-audio-lyrics-primary-contrast) 34%, transparent); font-size: var(--lz-font-size-xs); }
.audio-lyrics-loading-state { min-height: var(--lz-audio-lyrics-result-min-height); padding: var(--lz-space-6) var(--lz-space-5); place-content: center; justify-items: center; gap: var(--lz-space-3); text-align: center; }
.audio-lyrics-loading-state:not([hidden]) { display: grid; }
.audio-lyrics-loading-state strong { font-size: var(--lz-font-size-lg); }
.audio-lyrics-loading-state small { color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-sm); }
.audio-lyrics-loading-state p { margin: var(--lz-space-2) 0 0; color: var(--lz-audio-lyrics-warning); font-size: var(--lz-font-size-xs); }
.audio-lyrics-spinner { width: var(--lz-control-height-md); height: var(--lz-control-height-md); border: var(--lz-space-1) solid var(--lz-audio-lyrics-spinner-track); border-top-color: var(--lz-audio-lyrics-primary); border-radius: var(--lz-radius-pill); animation: audio-lyrics-spin 0.8s linear infinite; }
.audio-lyrics-result-state { min-height: 0; padding: var(--lz-space-4) var(--lz-space-5) var(--lz-space-5); grid-template-rows: auto minmax(0, 1fr) auto; gap: var(--lz-space-3); overflow: hidden; }
.audio-lyrics-result-state:not([hidden]) { display: grid; }
.audio-lyrics-result-heading { display: grid; gap: var(--lz-space-1); }
.audio-lyrics-result-heading > span { width: fit-content; padding: var(--lz-space-1) var(--lz-space-2); border-radius: var(--lz-radius-pill); background: color-mix(in srgb, var(--lz-audio-lyrics-success) 14%, transparent); color: var(--lz-audio-lyrics-success); font-size: var(--lz-font-size-xs); font-weight: 600; }
.audio-lyrics-result-heading h3 { margin: var(--lz-space-1) 0 0; font-size: var(--lz-font-size-xl); line-height: var(--lz-line-height-tight); }
.audio-lyrics-result-heading p { margin: 0; color: var(--lz-front-composer-muted); font-size: var(--lz-font-size-sm); line-height: var(--lz-line-height-normal); }
.audio-lyrics-result-state pre { min-height: var(--lz-audio-lyrics-result-min-height); margin: 0; padding: var(--lz-space-3); overflow: auto; border: 1px solid var(--lz-front-param-panel-border); border-radius: var(--lz-radius-md); background: var(--lz-audio-lyrics-result-surface); color: var(--lz-front-composer-text); font: 400 var(--lz-font-size-sm)/var(--lz-line-height-normal) var(--lz-font-sans); white-space: pre-wrap; word-break: break-word; }
.audio-lyrics-result-state footer { display: flex; justify-content: flex-end; gap: var(--lz-space-2); }
.audio-lyrics-result-state footer button { min-height: var(--lz-control-height-md); padding: 0 var(--lz-space-4); border: 1px solid var(--lz-front-composer-control-border); border-radius: var(--lz-radius-md); background: var(--lz-front-composer-control); color: var(--lz-front-composer-text); font: 600 var(--lz-font-size-sm)/var(--lz-line-height-tight) var(--lz-font-sans); cursor: pointer; }
.audio-lyrics-result-state footer button:hover { background: var(--lz-front-param-panel-hover); }
.audio-lyrics-result-state footer .audio-lyrics-use { border-color: var(--lz-audio-lyrics-primary); background: var(--lz-audio-lyrics-primary); color: var(--lz-audio-lyrics-primary-contrast); }
.audio-lyrics-result-state footer .audio-lyrics-use:hover { border-color: var(--lz-audio-lyrics-primary-hover); background: var(--lz-audio-lyrics-primary-hover); }
@keyframes audio-lyrics-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .audio-lyrics-layer, .audio-lyrics-dialog, .audio-lyrics-generator-trigger { transition: none; } .audio-lyrics-spinner { animation-duration: 1.6s; } }
@media (max-width: 680px) {
  .audio-lyrics-layer { padding: var(--lz-space-3); align-items: end; }
  .audio-lyrics-dialog { width: 100%; max-height: min(var(--lz-audio-lyrics-dialog-max-height), calc(100dvh - var(--lz-space-6))); border-radius: var(--lz-radius-xl) var(--lz-radius-xl) 0 0; }
  .audio-lyrics-head { padding: var(--lz-space-4); }
  .audio-lyrics-price { margin: 0 var(--lz-space-4); }
  .audio-lyrics-input-state,
  .audio-lyrics-result-state { padding: var(--lz-space-4); }
  .audio-lyrics-result-state footer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audio-lyrics-result-state footer .audio-lyrics-use { grid-column: 1 / -1; }
}

body.page-gallery{
  --gallery-canvas:#1b1c20;
  --gallery-shell:#202126;
  --gallery-panel:#25262b;
  --gallery-panel-hover:#2b2d33;
  --gallery-media:#23242a;
  --gallery-control:#282a30;
  --gallery-control-hover:#2f3138;
  --gallery-line:rgba(255,255,255,.10);
  --gallery-text:#f4f4f5;
  --gallery-muted:#a8b0bd;
  --gallery-accent:var(--lz-front-accent,#3b82f6);
  --gallery-accent-soft:var(--lz-front-accent-soft,rgba(59,130,246,.16));
  --gallery-overlay:rgba(27,28,32,.88);
  --gallery-shadow:rgba(12,13,16,.28);
}
html:has(body.page-gallery),body.page-gallery{overflow:hidden;height:100%;}
body.page-gallery{margin:0;}
body.page-gallery .main-area,body.page-gallery .content,body.page-gallery .content-area{overflow:hidden;}
body.page-gallery main.gallery-library,.gallery-library{position:relative;height:100dvh;min-height:0;overflow:hidden;background:var(--gallery-canvas);color:var(--gallery-text);}
.gallery-shell{position:absolute;inset:18px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border:1px solid var(--gallery-line);border-radius:18px;background:var(--gallery-shell);overflow:hidden;box-shadow:0 16px 42px var(--gallery-shadow);}
.gallery-toolbar{position:relative;z-index:20;display:grid;gap:12px;padding:15px 16px 12px;border-bottom:1px solid var(--gallery-line);background:var(--gallery-shell);}
.gallery-toolbar-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;}
.gallery-title{min-width:0;display:grid;gap:4px;}
.gallery-title h1{margin:0;color:#f4f4f5;font-size:22px;line-height:1.2;font-weight:950;letter-spacing:0;}
.gallery-title p{margin:0;color:var(--gallery-muted);font-size:12px;line-height:1.5;}
.gallery-count{height:30px;display:inline-flex;align-items:center;gap:7px;margin-right:72px;padding:0 10px;border:1px solid var(--gallery-line);border-radius:999px;background:var(--gallery-panel);color:#dce3e9;font-size:12px;font-weight:850;white-space:nowrap;}
.gallery-tools{display:grid;grid-template-columns:160px 170px minmax(170px,340px) 146px;gap:10px;align-items:center;}
.gallery-filter{position:relative;z-index:24;min-width:0;}
.gallery-filter.is-open{z-index:100;}
.gallery-filter-trigger,.gallery-search{height:38px;border:1px solid var(--gallery-line);border-radius:12px;background:var(--gallery-control);color:#e5e7eb;box-shadow:none;}
.gallery-filter-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:9px;padding:0 11px;font-size:12px;font-weight:900;cursor:pointer;}
.gallery-filter-trigger span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gallery-filter-trigger svg,.gallery-search svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.gallery-filter-trigger svg{transition:transform .16s ease;}
.gallery-filter.is-open .gallery-filter-trigger svg{transform:rotate(180deg);}
.gallery-filter-trigger:hover,.gallery-filter.is-open .gallery-filter-trigger{border-color:var(--gallery-accent);background:var(--gallery-control-hover);color:#fff;}
.gallery-filter-trigger:focus-visible{outline:1px auto rgb(229,151,0);outline-offset:0;}
.gallery-filter-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:120;width:max-content;min-width:100%;max-width:min(260px,calc(100vw - 40px));display:none;padding:6px;border:1px solid var(--gallery-line);border-radius:13px;background:var(--gallery-panel-hover);box-shadow:0 18px 45px var(--gallery-shadow);}
.gallery-filter.is-open .gallery-filter-menu{display:grid;gap:3px;}
.gallery-filter-menu a,.gallery-filter-menu button{width:100%;height:34px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-radius:9px;background:transparent;color:#e4e4e7;padding:0 10px;font-size:12px;font-weight:850;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;}
.gallery-filter-menu a:hover,.gallery-filter-menu button:hover{background:rgba(255,255,255,.08);color:#fff;}
.gallery-filter-menu .is-active{background:rgba(255,255,255,.12);color:#fff;}
.gallery-filter-menu .is-active:after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gallery-accent);flex:none;}
.gallery-search{position:relative;display:flex;align-items:center;gap:8px;min-width:0;max-width:340px;padding:0 12px;color:#949494;overflow:hidden;background-image:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;}
.gallery-search:before,.gallery-search:after,.gallery-search input:before,.gallery-search input:after{content:none;display:none;background:none;background-image:none;box-shadow:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;}
.gallery-search input{width:100%;min-width:0;height:38px;border:0;background:transparent;color:#f2f2f2;-webkit-text-fill-color:#f2f2f2;box-shadow:none;outline:0;outline-offset:0;padding:0;font-size:13px;transition:border-color .15s cubic-bezier(.16,1,.3,1),box-shadow .15s cubic-bezier(.16,1,.3,1);}
.gallery-search input::placeholder{color:#71717a;}
body.page-gallery #galleryLibraryPage .gallery-search input[data-gallery-search],
html body.page-gallery #galleryLibraryPage label.gallery-search input[type="search"][data-gallery-search]{
  -webkit-appearance:none;
  appearance:none;
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  filter:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
body.page-gallery #galleryLibraryPage .gallery-search input[data-gallery-search]::-webkit-search-decoration,
body.page-gallery #galleryLibraryPage .gallery-search input[data-gallery-search]::-webkit-search-cancel-button,
body.page-gallery #galleryLibraryPage .gallery-search input[data-gallery-search]::-webkit-search-results-button,
body.page-gallery #galleryLibraryPage .gallery-search input[data-gallery-search]::-webkit-search-results-decoration{
  display:none;
  -webkit-appearance:none;
  appearance:none;
}
.gallery-search,
.gallery-filter-trigger{
  position:relative;
  isolation:isolate;
}
.gallery-search > *,
.gallery-filter-trigger > *{
  position:relative;
  z-index:1;
}
.gallery-search::before,
.gallery-search::after,
.gallery-filter-trigger::before,
.gallery-filter-trigger::after{
  content:none;
  display:none;
  background:none;
  background-image:none;
  box-shadow:none;
  filter:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.gallery-scroll{min-height:0;overflow:auto;padding:16px;background:var(--gallery-canvas);scrollbar-width:none;}
.gallery-scroll::-webkit-scrollbar{display:none;width:0;height:0;}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:14px;align-content:start;}
.gallery-card{position:relative;width:100%;min-width:0;display:grid;grid-template-rows:auto 118px;border:1px solid var(--gallery-line);border-radius:16px;background:var(--gallery-panel);color:var(--gallery-text);overflow:visible;box-shadow:none;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease,background .16s ease;}
.gallery-card[hidden]{display:none;}
.gallery-card:hover,.gallery-card:focus-within{border-color:rgba(59,130,246,.42);background:var(--gallery-panel-hover);transform:translateY(-1px);box-shadow:0 14px 34px var(--gallery-shadow);}
.gallery-card:focus-visible{outline:2px solid var(--gallery-accent);outline-offset:2px;}
.gallery-media{position:relative;width:100%;min-width:0;max-width:100%;aspect-ratio:4/3;background:var(--gallery-media);border-radius:15px 15px 0 0;overflow:hidden;cursor:pointer;}
.gallery-card > .gallery-media,.gallery-card > .gallery-card-body{width:100%;min-width:0;max-width:100%;}
.gallery-media img,.gallery-media video{width:100%;height:100%;display:block;object-fit:cover;background:var(--gallery-media);}
.gallery-media video{pointer-events:none;}
body.page-gallery #galleryLibraryPage .gallery-media > video{width:100%;height:100%;object-fit:cover;object-position:center;}
.gallery-grid[data-media-stage="loading"] .gallery-media > :is(img,video),.gallery-media.is-media-error > :is(img,video){visibility:hidden;}
.gallery-media.is-media-error{cursor:default;}
.gallery-media.is-media-error img,.gallery-media.is-media-error video{visibility:hidden;}
.gallery-media.is-media-error:before{content:"";position:absolute;left:50%;top:44%;width:28px;height:22px;border:2px solid #7f8a96;border-radius:5px;transform:translate(-50%,-50%);}
.gallery-media.is-media-error:after{content:attr(data-media-error-label);position:absolute;left:12px;right:12px;top:58%;color:var(--gallery-muted);font-size:11px;font-weight:800;text-align:center;}
.gallery-kind{position:absolute;z-index:3;height:24px;display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:var(--gallery-overlay);color:#f4f4f5;padding:0 8px;font-size:11px;font-weight:900;backdrop-filter:none;-webkit-backdrop-filter:none;}
.gallery-kind{left:10px;top:10px;}
.gallery-likes{display:none;}
.gallery-play{position:absolute;left:50%;top:50%;z-index:4;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:0;background:transparent;color:rgba(255,255,255,.96);transform:translate(-50%,-50%);filter:drop-shadow(0 2px 5px rgba(12,13,16,.72));}
.gallery-play svg{width:24px;height:24px;margin-left:2px;}
.gallery-card-actions{position:absolute;right:10px;bottom:10px;z-index:5;display:flex;align-items:center;gap:6px;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .16s ease,transform .16s ease;}
.gallery-card:hover .gallery-card-actions,.gallery-card:focus-within .gallery-card-actions,.gallery-card.is-menu-open .gallery-card-actions{opacity:1;pointer-events:auto;transform:translateY(0);}
.gallery-icon-btn{width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:10px;background:var(--gallery-overlay);color:#f4f4f5;cursor:pointer;text-decoration:none;}
.gallery-icon-btn:hover{background:var(--gallery-accent-soft);color:var(--gallery-accent);border-color:rgba(59,130,246,.34);}
.gallery-icon-btn.is-liked{background:var(--gallery-accent-soft);color:var(--gallery-accent);border-color:rgba(59,130,246,.34);}
.gallery-icon-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;}
.gallery-card-body{position:relative;min-height:118px;display:flex;flex-direction:column;gap:7px;padding:10px 12px 11px;border-top:1px solid var(--gallery-line);background:var(--gallery-panel);border-radius:0 0 15px 15px;overflow:visible;}
.gallery-prompt{min-width:0;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f2f2f2;font-size:12.5px;font-weight:900;line-height:1.5;min-height:19px;}
.gallery-meta{min-width:0;display:flex;align-items:center;justify-content:space-between;gap:8px;color:#858585;font-size:11px;font-weight:750;}
.gallery-meta span,.gallery-meta time{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gallery-author{min-width:0;display:flex;align-items:center;gap:6px;color:#b9b9bd;font-size:11px;font-weight:850;}
.gallery-author span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gallery-avatar-wrap{position:relative;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;flex:none;overflow:visible;}
.gallery-avatar{width:18px;height:18px;border-radius:50%;background:#414a55;object-fit:cover;flex:none;}
.gallery-avatar-wrap .gallery-avatar{width:100%;height:100%;}
.gallery-avatar-wrap.has-frame:after{content:"";position:absolute;inset:-6px;background-image:var(--jn-avatar-frame-image);background-size:100% 100%;background-position:center;background-repeat:no-repeat;pointer-events:none;}
.gallery-avatar-fallback{display:grid;place-items:center;color:#a1a1aa;font-size:10px;font-weight:900;}
.gallery-stats{min-width:0;display:flex;align-items:center;gap:7px;color:#9ca3af;font-size:11px;font-weight:850;}
.gallery-stat{display:inline-flex;align-items:center;gap:4px;min-width:0;white-space:nowrap;}
.gallery-stat svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.gallery-stat-like{color:#d7d7dc;}
.gallery-card.is-liked .gallery-stat-like{color:#f4f4f5;}
.gallery-meta{margin-top:auto;}
.gallery-more-menu{position:absolute;right:10px;bottom:42px;z-index:40;width:128px;display:none;padding:4px;border:1px solid var(--gallery-line);border-radius:11px;background:var(--gallery-panel-hover);background-image:none;box-shadow:0 16px 38px var(--gallery-shadow);}
.gallery-card.is-menu-open .gallery-more-menu{display:grid;gap:3px;}
.gallery-more-menu button,.gallery-more-menu a{width:100%;height:29px;display:flex;align-items:center;justify-content:flex-start;gap:7px;border:0;border-radius:8px;background:transparent;background-image:none;color:#e4e4e7;padding:0 7px;font-size:11px;font-weight:850;text-decoration:none;cursor:pointer;box-shadow:none;}
.gallery-more-menu button:hover,.gallery-more-menu a:hover{background:rgba(255,255,255,.08);color:#fff;}
.gallery-more-menu .is-disabled{opacity:.48;pointer-events:none;}
.gallery-more-menu svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;}
.gallery-empty{min-height:260px;display:grid;place-items:center;border:1px dashed rgba(167,177,190,.34);border-radius:16px;background:var(--gallery-shell);color:var(--gallery-muted);text-align:center;padding:24px;}
body.page-gallery #galleryLibraryPage .gallery-empty[hidden]{display:none;}
.gallery-empty strong{display:block;margin-bottom:6px;color:#f4f4f5;font-size:15px;}
.gallery-footer{min-height:54px;display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:10px 16px;border-top:1px solid var(--gallery-line);background:var(--gallery-shell);}
.gallery-page-nav{display:flex;align-items:center;gap:8px;}
.gallery-page-nav a,.gallery-page-nav span{height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--gallery-line);border-radius:999px;background:var(--gallery-control);color:#dce3e9;padding:0 12px;font-size:12px;font-weight:850;text-decoration:none;white-space:nowrap;}
.gallery-page-nav a:hover{border-color:var(--gallery-accent);color:#fff;background:var(--gallery-control-hover);}
.gallery-page-nav a.is-disabled{opacity:.45;pointer-events:none;}
.gallery-toast{position:fixed;left:50%;bottom:24px;z-index:100080;min-width:140px;max-width:min(360px,calc(100vw - 32px));padding:10px 13px;border:1px solid var(--gallery-line);border-radius:12px;background:var(--gallery-panel-hover);color:#f4f4f5;box-shadow:0 18px 45px var(--gallery-shadow);font-size:12px;font-weight:850;text-align:center;transform:translateX(-50%) translateY(10px);opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;}
.gallery-toast.is-show{opacity:1;transform:translateX(-50%) translateY(0);}
.gallery-detail-layer{position:fixed;inset:0;z-index:100050;display:grid;place-items:center;padding:18px;background:rgba(27,28,32,.74);backdrop-filter:none;-webkit-backdrop-filter:none;}
.gallery-detail-layer[hidden]{display:none;}
.gallery-detail-modal{width:min(1080px,calc(100vw - 36px));max-height:min(640px,calc(100dvh - 36px));display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.72fr);overflow:hidden;border:1px solid var(--gallery-line);border-radius:18px;background:var(--gallery-shell);color:#f4f4f5;box-shadow:0 30px 80px rgba(12,13,16,.38);}
.gallery-detail-media{min-height:0;background:var(--gallery-media);display:grid;place-items:center;overflow:hidden;}
.gallery-detail-media img,.gallery-detail-media video{width:100%;height:100%;max-height:min(640px,calc(100dvh - 36px));object-fit:contain;background:var(--gallery-media);}
body.page-gallery #galleryDetailLayer .gallery-detail-media > video{object-fit:contain;object-position:center;}
.gallery-detail-side{min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border-left:1px solid var(--gallery-line);background:var(--gallery-panel);}
.gallery-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:16px 16px 12px;border-bottom:1px solid rgba(255,255,255,.08);}
.gallery-detail-author{display:flex;align-items:center;gap:10px;min-width:0;}
.gallery-detail-head h2{margin:0;color:#f4f4f5;font-size:17px;font-weight:950;line-height:1.25;}
.gallery-detail-head p{margin:4px 0 0;color:#8a8a8e;font-size:12px;}
.gallery-detail-avatar-wrap{position:relative;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;overflow:visible;}
.gallery-detail-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#414a55;}
.gallery-detail-avatar-wrap .gallery-detail-avatar{width:100%;height:100%;}
.gallery-detail-avatar-fallback{display:grid;place-items:center;color:#a1a1aa;font-size:14px;font-weight:950;}
.gallery-detail-avatar-wrap.has-frame:after{content:"";position:absolute;inset:-10px;background-image:var(--jn-avatar-frame-image);background-size:100% 100%;background-position:center;background-repeat:no-repeat;pointer-events:none;}
.gallery-detail-close{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--gallery-line);border-radius:10px;background:var(--gallery-control-hover);color:#d4d4d8;cursor:pointer;flex:none;}
.gallery-detail-close:hover{background:var(--gallery-accent-soft);color:var(--gallery-accent);}
.gallery-detail-body{min-height:0;overflow:auto;padding:14px 16px;scrollbar-width:none;}
.gallery-detail-body::-webkit-scrollbar{display:none;width:0;height:0;}
.gallery-detail-prompt{margin:0 0 12px;padding:11px 12px;border:1px solid var(--gallery-line);border-radius:12px;background:var(--gallery-control);color:#f4f4f5;font-size:12.5px;line-height:1.65;white-space:pre-wrap;word-break:break-word;max-height:6.8em;overflow:auto;scrollbar-width:none;}
.gallery-detail-prompt::-webkit-scrollbar{display:none;width:0;height:0;}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer{
  --front-work-shell-bg:var(--gallery-panel);
  --front-work-card-bg:var(--gallery-panel);
  --front-work-media-bg:var(--gallery-shell);
  --front-work-control-bg:var(--gallery-control);
  --front-work-menu-bg:var(--gallery-control);
  --front-work-line:var(--gallery-line);
  --front-work-line-strong:var(--gallery-line);
  --front-work-strong:var(--gallery-text);
  --front-work-text:#d4d4d8;
  --front-work-muted:var(--gallery-muted);
}
body.page-gallery #galleryDetailLayer .gallery-detail-modal{height:auto;max-height:min(640px,calc(100dvh - 36px));min-height:0;}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-modal,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-modal{background:var(--gallery-panel);border-color:var(--gallery-line);}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-media,
html[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-media :is(img,video),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-media,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-media :is(img,video){background:var(--gallery-shell);background-color:var(--gallery-shell);}
body.page-gallery #galleryDetailLayer .gallery-detail-side{min-height:0;max-height:min(640px,calc(100dvh - 36px));overflow:hidden;}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-side,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer .gallery-detail-side{background:var(--gallery-panel);border-color:var(--gallery-line);}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer :is(.gallery-detail-head,.gallery-detail-actions),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer :is(.gallery-detail-head,.gallery-detail-actions){background:transparent;border-color:var(--gallery-line);}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer :is(.gallery-detail-prompt,.gallery-detail-close),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer :is(.gallery-detail-prompt,.gallery-detail-close){background:var(--gallery-control);border-color:var(--gallery-line);}
body.page-gallery #galleryDetailLayer .gallery-detail-body{min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;}
body.page-gallery #galleryDetailLayer .gallery-detail-prompt{box-sizing:border-box;width:100%;min-width:0;max-height:112px;overflow-y:auto;overflow-x:hidden;overflow-wrap:anywhere;word-break:break-word;overscroll-behavior:contain;}
.gallery-detail-list{display:grid;gap:8px;}
.gallery-detail-row{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;align-items:start;color:#d4d4d8;font-size:12px;line-height:1.45;}
.gallery-detail-row span:first-child{color:#858585;font-weight:850;}
.gallery-detail-row strong{min-width:0;color:#e7e7ea;font-weight:850;overflow:hidden;text-overflow:ellipsis;}
.gallery-detail-actions{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;padding:12px 16px;border-top:1px solid rgba(255,255,255,.08);}
.gallery-detail-actions a,.gallery-detail-actions button{height:34px;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:0;border:1px solid rgba(255,255,255,.10);border-radius:10px;background:transparent;color:#f4f4f5;padding:0 9px;font-size:12px;font-weight:900;text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:none;overflow:hidden;text-overflow:ellipsis;}
.gallery-detail-actions a:hover,.gallery-detail-actions button:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);}
.gallery-detail-actions .is-liked{background:var(--gallery-accent-soft);color:var(--gallery-accent);border-color:rgba(59,130,246,.34);}
.gallery-detail-actions svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;}
html:not(.jn-light-mode) body.page-gallery #galleryLibraryPage .gallery-filter-trigger,
body.page-gallery:not(.jn-light-mode) #galleryLibraryPage .gallery-filter-trigger,
html:not(.jn-light-mode) body.page-gallery #galleryLibraryPage .gallery-search,
body.page-gallery:not(.jn-light-mode) #galleryLibraryPage .gallery-search{
  background:var(--gallery-control);
  background-color:var(--gallery-control);
  background-image:none;
  border-color:rgba(255,255,255,.10);
  color:#e5e7eb;
  box-shadow:none;
  filter:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html:not(.jn-light-mode) body.page-gallery #galleryLibraryPage .gallery-filter-trigger:hover,
html:not(.jn-light-mode) body.page-gallery #galleryLibraryPage .gallery-filter.is-open .gallery-filter-trigger,
body.page-gallery:not(.jn-light-mode) #galleryLibraryPage .gallery-filter-trigger:hover,
body.page-gallery:not(.jn-light-mode) #galleryLibraryPage .gallery-filter.is-open .gallery-filter-trigger{
  background:var(--gallery-control-hover);
  background-color:var(--gallery-control-hover);
  border-color:rgba(255,255,255,.18);
}
html.jn-light-mode body.page-gallery,body.page-gallery.jn-light-mode{background:#f7f8fb;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-library,body.page-gallery.jn-light-mode .gallery-library{background:#f7f8fb;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-shell,body.page-gallery.jn-light-mode .gallery-shell,
html.jn-light-mode body.page-gallery .gallery-toolbar,body.page-gallery.jn-light-mode .gallery-toolbar,
html.jn-light-mode body.page-gallery .gallery-footer,body.page-gallery.jn-light-mode .gallery-footer,
html.jn-light-mode body.page-gallery .gallery-card,body.page-gallery.jn-light-mode .gallery-card,
html.jn-light-mode body.page-gallery .gallery-card-body,body.page-gallery.jn-light-mode .gallery-card-body{background:#fff;border-color:rgba(15,23,42,.10);color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-scroll,body.page-gallery.jn-light-mode .gallery-scroll{background:#f7f8fb;}
html.jn-light-mode body.page-gallery .gallery-title h1,body.page-gallery.jn-light-mode .gallery-title h1,
html.jn-light-mode body.page-gallery .gallery-prompt,body.page-gallery.jn-light-mode .gallery-prompt{color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-title p,body.page-gallery.jn-light-mode .gallery-title p,
html.jn-light-mode body.page-gallery .gallery-meta,body.page-gallery.jn-light-mode .gallery-meta{color:#64748b;}
html.jn-light-mode body.page-gallery .gallery-count,body.page-gallery.jn-light-mode .gallery-count,
html.jn-light-mode body.page-gallery .gallery-filter-trigger,body.page-gallery.jn-light-mode .gallery-filter-trigger,
html.jn-light-mode body.page-gallery .gallery-filter-menu,body.page-gallery.jn-light-mode .gallery-filter-menu,
html.jn-light-mode body.page-gallery .gallery-search,body.page-gallery.jn-light-mode .gallery-search,
html.jn-light-mode body.page-gallery .gallery-page-nav a,body.page-gallery.jn-light-mode .gallery-page-nav a,
html.jn-light-mode body.page-gallery .gallery-page-nav span,body.page-gallery.jn-light-mode .gallery-page-nav span{background:#fff;background-image:none;border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:0 1px 2px rgba(15,23,42,.04);}
html.jn-light-mode body.page-gallery .gallery-filter-menu a,body.page-gallery.jn-light-mode .gallery-filter-menu a,
html.jn-light-mode body.page-gallery .gallery-filter-menu button,body.page-gallery.jn-light-mode .gallery-filter-menu button{background:transparent;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-filter-menu a:hover,body.page-gallery.jn-light-mode .gallery-filter-menu a:hover,
html.jn-light-mode body.page-gallery .gallery-filter-menu button:hover,body.page-gallery.jn-light-mode .gallery-filter-menu button:hover,
html.jn-light-mode body.page-gallery .gallery-filter-menu .is-active,body.page-gallery.jn-light-mode .gallery-filter-menu .is-active{background:#eef2f7;color:#0f172a;}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-filter-menu,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-filter-menu{
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:0 14px 34px rgba(15,23,42,.14);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-filter-menu :is(a,button),
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-filter-menu :is(a,button){
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-filter-menu :is(a,button):hover,
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-filter-menu .is-active,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-filter-menu :is(a,button):hover,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-filter-menu .is-active{
  background:#eef2f7;
  background-color:#eef2f7;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-search input,body.page-gallery.jn-light-mode .gallery-search input{color:#0f172a;-webkit-text-fill-color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-search input::placeholder,body.page-gallery.jn-light-mode .gallery-search input::placeholder{color:#94a3b8;}
html.jn-light-mode body.page-gallery .gallery-card:hover,body.page-gallery.jn-light-mode .gallery-card:hover{background:#fff;border-color:rgba(15,23,42,.16);box-shadow:0 14px 34px rgba(15,23,42,.10);}
html.jn-light-mode body.page-gallery .gallery-media,body.page-gallery.jn-light-mode .gallery-media{background:#f1f5f9;}
html.jn-light-mode body.page-gallery .gallery-media :is(img,video),body.page-gallery.jn-light-mode .gallery-media :is(img,video),
html.jn-light-mode body.page-gallery .gallery-detail-media,body.page-gallery.jn-light-mode .gallery-detail-media,
html.jn-light-mode body.page-gallery .gallery-detail-media :is(img,video),body.page-gallery.jn-light-mode .gallery-detail-media :is(img,video){background:#e8edf3;}
html.jn-light-mode body.page-gallery .gallery-kind,body.page-gallery.jn-light-mode .gallery-kind{
  background:rgba(255,255,255,.88);
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  box-shadow:0 8px 22px rgba(15,23,42,.12);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery .gallery-play,body.page-gallery.jn-light-mode .gallery-play{
  background:transparent;
  background-image:none;
  border:0;
  color:rgba(255,255,255,.96);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery .gallery-icon-btn,
body.page-gallery.jn-light-mode .gallery-icon-btn{
  background:rgba(255,255,255,.88);
  background-image:none;
  border-color:rgba(15,23,42,.14);
  color:#0f172a;
  box-shadow:0 8px 22px rgba(15,23,42,.12);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery .gallery-icon-btn:hover,
body.page-gallery.jn-light-mode .gallery-icon-btn:hover{
  background:#f8fafc;
  border-color:rgba(15,23,42,.22);
  color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-author,body.page-gallery.jn-light-mode .gallery-author{color:#334155;}
html.jn-light-mode body.page-gallery .gallery-stats,body.page-gallery.jn-light-mode .gallery-stats{color:#64748b;}
html.jn-light-mode body.page-gallery .gallery-card.is-liked .gallery-stat-like,body.page-gallery.jn-light-mode .gallery-card.is-liked .gallery-stat-like{color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-icon-btn.is-liked,body.page-gallery.jn-light-mode .gallery-icon-btn.is-liked{background:#eef2f7;color:#0f172a;border-color:rgba(15,23,42,.22);}
html.jn-light-mode body.page-gallery .gallery-more-menu,body.page-gallery.jn-light-mode .gallery-more-menu{background:#fff;background-image:none;border-color:rgba(15,23,42,.12);box-shadow:0 14px 34px rgba(15,23,42,.14);}
html.jn-light-mode body.page-gallery .gallery-more-menu button,body.page-gallery.jn-light-mode .gallery-more-menu button,
html.jn-light-mode body.page-gallery .gallery-more-menu a,body.page-gallery.jn-light-mode .gallery-more-menu a{background:transparent;background-image:none;border:0;box-shadow:none;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-more-menu button:hover,body.page-gallery.jn-light-mode .gallery-more-menu button:hover,
html.jn-light-mode body.page-gallery .gallery-more-menu a:hover,body.page-gallery.jn-light-mode .gallery-more-menu a:hover{background:#f1f5f9;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-empty,body.page-gallery.jn-light-mode .gallery-empty{background:#fff;border-color:rgba(15,23,42,.12);color:#64748b;}
html.jn-light-mode body.page-gallery .gallery-empty strong,body.page-gallery.jn-light-mode .gallery-empty strong{color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-detail-layer,body.page-gallery.jn-light-mode .gallery-detail-layer{background:rgba(226,232,240,.62);}
html.jn-light-mode body.page-gallery .gallery-detail-modal,body.page-gallery.jn-light-mode .gallery-detail-modal,
html.jn-light-mode body.page-gallery .gallery-detail-side,body.page-gallery.jn-light-mode .gallery-detail-side,
html.jn-light-mode body.page-gallery .gallery-detail-prompt,body.page-gallery.jn-light-mode .gallery-detail-prompt{background:#fff;border-color:rgba(15,23,42,.10);color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-detail-avatar,body.page-gallery.jn-light-mode .gallery-detail-avatar,
html.jn-light-mode body.page-gallery .gallery-avatar,body.page-gallery.jn-light-mode .gallery-avatar{background:#e2e8f0;}
html.jn-light-mode body.page-gallery .gallery-detail-head h2,body.page-gallery.jn-light-mode .gallery-detail-head h2,
html.jn-light-mode body.page-gallery .gallery-detail-row strong,body.page-gallery.jn-light-mode .gallery-detail-row strong{color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-detail-head p,body.page-gallery.jn-light-mode .gallery-detail-head p,
html.jn-light-mode body.page-gallery .gallery-detail-row span:first-child,body.page-gallery.jn-light-mode .gallery-detail-row span:first-child{color:#64748b;}
html.jn-light-mode body.page-gallery .gallery-detail-close,body.page-gallery.jn-light-mode .gallery-detail-close{background:#f8fafc;border-color:rgba(15,23,42,.12);color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-detail-close:hover,body.page-gallery.jn-light-mode .gallery-detail-close:hover{background:#eef2f7;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-detail-actions a,body.page-gallery.jn-light-mode .gallery-detail-actions a,
html.jn-light-mode body.page-gallery .gallery-detail-actions button,body.page-gallery.jn-light-mode .gallery-detail-actions button{background:transparent;border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:none;}
html.jn-light-mode body.page-gallery .gallery-detail-actions .is-liked,body.page-gallery.jn-light-mode .gallery-detail-actions .is-liked{background:#eef2f7;color:#0f172a;border-color:rgba(15,23,42,.22);}
html.jn-light-mode body.page-gallery .gallery-detail-actions a:hover,body.page-gallery.jn-light-mode .gallery-detail-actions a:hover,
html.jn-light-mode body.page-gallery .gallery-detail-actions button:hover,body.page-gallery.jn-light-mode .gallery-detail-actions button:hover{background:#f1f5f9;color:#0f172a;}
html.jn-light-mode body.page-gallery .gallery-detail-actions .is-liked,body.page-gallery.jn-light-mode .gallery-detail-actions .is-liked{background:#eef2f7;color:#0f172a;border-color:rgba(15,23,42,.20);}
html.jn-light-mode body.page-gallery .gallery-detail-actions button[data-detail-like-toggle],
body.page-gallery.jn-light-mode .gallery-detail-actions button[data-detail-like-toggle]{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-detail-actions a,
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-detail-actions button,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-detail-actions a,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-detail-actions button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-detail-actions a:hover,
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-detail-actions button:hover,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-detail-actions a:hover,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-detail-actions button:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-detail-actions button[data-detail-like-toggle].is-liked,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-detail-actions button[data-detail-like-toggle].is-liked{
  background:#eef2f7;
  background-color:#eef2f7;
  border-color:rgba(15,23,42,.22);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions a,
html.jn-light-mode body.page-gallery .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions button,
body.page-gallery.jn-light-mode .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions a,
body.page-gallery.jn-light-mode .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions a:hover,
html.jn-light-mode body.page-gallery .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions button:hover,
body.page-gallery.jn-light-mode .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions a:hover,
body.page-gallery.jn-light-mode .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions button:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions button[data-detail-like-toggle].is-liked,
body.page-gallery.jn-light-mode .gallery-detail-layer .gallery-detail-modal .gallery-detail-actions button[data-detail-like-toggle].is-liked{
  background:#eef2f7;
  background-color:#eef2f7;
  border-color:rgba(15,23,42,.22);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html:not(.jn-light-mode) body.page-gallery::before,
html:not(.jn-light-mode) body.page-gallery::after,
body.page-gallery:not(.jn-light-mode)::before,
body.page-gallery:not(.jn-light-mode)::after{
  display:none;
  content:none;
  background:none;
  background-image:none;
  filter:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html:not(.jn-light-mode) body.page-gallery #galleryLibraryPage .gallery-filter-trigger,
html:not(.jn-light-mode) body.page-gallery #galleryLibraryPage .gallery-search,
body.page-gallery:not(.jn-light-mode) #galleryLibraryPage .gallery-filter-trigger,
body.page-gallery:not(.jn-light-mode) #galleryLibraryPage .gallery-search{
  background:var(--gallery-control);
  background-color:var(--gallery-control);
  background-image:none;
  box-shadow:none;
  filter:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery .gallery-filter .gallery-filter-trigger,
body.page-gallery.jn-light-mode .gallery-filter .gallery-filter-trigger,
html.jn-light-mode body.page-gallery button.gallery-filter-trigger,
body.page-gallery.jn-light-mode button.gallery-filter-trigger{
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
html.jn-light-mode body.page-gallery .gallery-filter .gallery-filter-trigger:hover,
html.jn-light-mode body.page-gallery .gallery-filter.is-open .gallery-filter-trigger,
body.page-gallery.jn-light-mode .gallery-filter .gallery-filter-trigger:hover,
body.page-gallery.jn-light-mode .gallery-filter.is-open .gallery-filter-trigger{
  background:#f8fafc;
  background-color:#f8fafc;
  border-color:rgba(15,23,42,.18);
}
html.jn-light-mode body.page-gallery .gallery-filter-trigger svg,
body.page-gallery.jn-light-mode .gallery-filter-trigger svg{color:#475569;stroke:#475569;}
html.jn-light-mode body.page-gallery .gallery-card .gallery-more-menu,
body.page-gallery.jn-light-mode .gallery-card .gallery-more-menu{
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  box-shadow:0 14px 34px rgba(15,23,42,.14);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery .gallery-card .gallery-more-menu button,
html.jn-light-mode body.page-gallery .gallery-card .gallery-more-menu a,
body.page-gallery.jn-light-mode .gallery-card .gallery-more-menu button,
body.page-gallery.jn-light-mode .gallery-card .gallery-more-menu a{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:none;
}
html.jn-light-mode body.page-gallery .gallery-card .gallery-more-menu button:hover,
html.jn-light-mode body.page-gallery .gallery-card .gallery-more-menu a:hover,
body.page-gallery.jn-light-mode .gallery-card .gallery-more-menu button:hover,
body.page-gallery.jn-light-mode .gallery-card .gallery-more-menu a:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-filter button.gallery-filter-trigger,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-filter button.gallery-filter-trigger{
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-card .gallery-more-menu button,
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-card .gallery-more-menu a,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-card .gallery-more-menu button,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-card .gallery-more-menu a{
  background:transparent;
  background-color:transparent;
  background-image:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  border:0;
  box-shadow:none;
}
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-card .gallery-more-menu button:hover,
html.jn-light-mode body.page-gallery #galleryLibraryPage .gallery-card .gallery-more-menu a:hover,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-card .gallery-more-menu button:hover,
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-card .gallery-more-menu a:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-modal .gallery-detail-actions button,
html.jn-light-mode body.page-gallery .gallery-detail-modal .gallery-detail-actions a,
body.page-gallery.jn-light-mode .gallery-detail-modal .gallery-detail-actions button,
body.page-gallery.jn-light-mode .gallery-detail-modal .gallery-detail-actions a{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:none;
}
html.jn-light-mode body.page-gallery .gallery-detail-modal .gallery-detail-actions button:hover,
html.jn-light-mode body.page-gallery .gallery-detail-modal .gallery-detail-actions a:hover,
body.page-gallery.jn-light-mode .gallery-detail-modal .gallery-detail-actions button:hover,
body.page-gallery.jn-light-mode .gallery-detail-modal .gallery-detail-actions a:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
@media(max-width:760px){
  .gallery-library{height:100dvh;min-height:0;}
  .gallery-shell{inset:10px;border-radius:14px;}
  .gallery-toolbar{padding:12px 12px 10px;gap:10px;}
  #galleryLibraryPage .gallery-toolbar-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:10px;padding:0 52px;box-sizing:border-box;}
  #galleryLibraryPage .gallery-title h1,
  #galleryLibraryPage .gallery-title p{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .gallery-title h1{font-size:18px;}
  .gallery-title p{font-size:11px;}
  .gallery-count{height:28px;margin-right:0;padding:0 8px;font-size:11px;max-width:min(44vw,160px);justify-self:end;overflow:hidden;text-overflow:ellipsis;}
  .gallery-tools{grid-template-columns:1fr 1fr;gap:8px;}
  .gallery-tools,.gallery-filter,.gallery-search{min-width:0;}
  .gallery-filter-trigger,.gallery-search{height:36px;border-radius:11px;}
  .gallery-filter-menu{width:100%;min-width:0;max-width:calc(100vw - 40px);}
  .gallery-search{grid-column:1 / 2;max-width:none;}
  .gallery-filter[data-sort-filter]{grid-column:2 / 3;}
  .gallery-scroll{padding:12px;}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .gallery-card{grid-template-rows:auto 96px;border-radius:14px;}
  .gallery-media{border-radius:13px 13px 0 0;}
  .gallery-card-body{min-height:96px;padding:7px 8px 8px;border-radius:0 0 13px 13px;gap:4px;}
  .gallery-prompt{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;-webkit-line-clamp:unset;-webkit-box-orient:initial;}
  .gallery-meta{font-size:10px;}
  .gallery-author{font-size:10.5px;}
  .gallery-icon-btn{width:28px;height:28px;border-radius:9px;background:var(--gallery-overlay);}
  .gallery-kind{height:22px;padding:0 7px;font-size:10px;}
  .gallery-stats{font-size:10px;gap:6px;}
  .gallery-more-menu{right:6px;bottom:38px;width:124px;max-width:calc(100vw - 32px);padding:4px;}
  .gallery-more-menu button,.gallery-more-menu a{height:28px;font-size:10.5px;padding:0 7px;}
  .gallery-footer{min-height:50px;padding:8px 12px;}
  .gallery-page-nav{justify-content:flex-end;}
  .gallery-page-nav a,.gallery-page-nav span{height:32px;padding:0 10px;font-size:11px;}
  .gallery-detail-layer{padding:10px;place-items:center;}
  .gallery-detail-modal{width:min(370px,calc(100vw - 20px));max-height:calc(100dvh - 20px);display:grid;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);border-radius:16px;}
  .gallery-detail-media{height:min(42dvh,280px);min-height:180px;}
  .gallery-detail-media img,.gallery-detail-media video{height:100%;max-height:none;}
  .gallery-detail-side{border-left:0;border-top:1px solid rgba(255,255,255,.08);min-height:0;}
  .gallery-detail-head{padding:12px 12px 10px;}
  .gallery-detail-head h2{font-size:15px;}
  .gallery-detail-body{padding:12px;max-height:240px;}
  .gallery-detail-row{grid-template-columns:64px minmax(0,1fr);font-size:11.5px;}
  .gallery-detail-actions{padding:10px 12px;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
  .gallery-detail-actions a,.gallery-detail-actions button{height:32px;padding:0 8px;font-size:11px;}
  .gallery-detail-prompt{max-height:5.9em;font-size:11.5px;line-height:1.55;}
  body.page-gallery #galleryDetailLayer .gallery-detail-modal{height:auto;max-height:calc(100dvh - 20px);}
  body.page-gallery #galleryDetailLayer .gallery-detail-side{max-height:none;}
  body.page-gallery #galleryDetailLayer .gallery-detail-prompt{max-height:92px;}
}
@media(max-width:520px){
  #galleryLibraryPage .gallery-toolbar-top{grid-template-columns:1fr;gap:6px;min-height:42px;text-align:center;}
  #galleryLibraryPage .gallery-title{justify-items:center;min-width:0;}
  #galleryLibraryPage .gallery-count{justify-self:center;max-width:100%;}
}
@media(max-width:420px){
  .gallery-shell{inset:8px;}
  .gallery-toolbar{padding:10px;}
  .gallery-scroll{padding:10px;}
  .gallery-count{display:none;}
  .gallery-tools{gap:7px;}
}
body.page-gallery #galleryDetailLayer .gallery-detail-actions a,
body.page-gallery #galleryDetailLayer .gallery-detail-actions button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(255,255,255,.10);
  box-shadow:none;
  color:#f4f4f5;
  -webkit-text-fill-color:#f4f4f5;
}
body.page-gallery #galleryDetailLayer .gallery-detail-actions a:hover,
body.page-gallery #galleryDetailLayer .gallery-detail-actions button:hover{
  background:rgba(255,255,255,.08);
  background-color:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
  color:#f4f4f5;
  -webkit-text-fill-color:#f4f4f5;
}
body.page-gallery #galleryDetailLayer .gallery-detail-actions button[data-detail-like-toggle].is-liked{
  background:var(--gallery-accent-soft);
  background-color:var(--gallery-accent-soft);
  border-color:rgba(59,130,246,.34);
  color:var(--gallery-accent);
  -webkit-text-fill-color:var(--gallery-accent);
}
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-actions a,
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-actions button,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-actions a,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-actions button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-actions a:hover,
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-actions button:hover,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-actions a:hover,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-actions button:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-actions button[data-detail-like-toggle].is-liked,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-actions button[data-detail-like-toggle].is-liked{
  background:#eef2f7;
  background-color:#eef2f7;
  border-color:rgba(15,23,42,.22);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-theme-booting[data-theme="light"] body.page-gallery,
html[data-theme="light"] body.page-gallery,
body.page-gallery.jn-light-mode{
  background:#f7f8fb;
  background-color:#f7f8fb;
  background-image:none;
  color:#0f172a;
  color-scheme:light;
}
html.jn-theme-booting[data-theme="light"] body.page-gallery :is(.main-area,.content,.content-area,main.gallery-library,.gallery-library,.gallery-scroll),
html[data-theme="light"] body.page-gallery :is(.main-area,.content,.content-area,main.gallery-library,.gallery-library,.gallery-scroll),
body.page-gallery.jn-light-mode :is(.main-area,.content,.content-area,main.gallery-library,.gallery-library,.gallery-scroll){
  background:#f7f8fb;
  background-color:#f7f8fb;
  background-image:none;
  color:#0f172a;
}
html.jn-theme-booting[data-theme="light"] body.page-gallery :is(.gallery-shell,.gallery-toolbar,.gallery-footer,.gallery-card,.gallery-card-body,.gallery-filter-trigger,.gallery-search,.gallery-filter-menu,.gallery-empty),
html[data-theme="light"] body.page-gallery :is(.gallery-shell,.gallery-toolbar,.gallery-footer,.gallery-card,.gallery-card-body,.gallery-filter-trigger,.gallery-search,.gallery-filter-menu,.gallery-empty),
body.page-gallery.jn-light-mode :is(.gallery-shell,.gallery-toolbar,.gallery-footer,.gallery-card,.gallery-card-body,.gallery-filter-trigger,.gallery-search,.gallery-filter-menu,.gallery-empty){
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  box-shadow:none;
}
html.jn-theme-booting[data-theme="dark"] body.page-gallery,
html[data-theme="dark"] body.page-gallery{
  background:var(--gallery-canvas);
  background-color:var(--gallery-canvas);
  background-image:none;
  color:#f2f2f2;
  color-scheme:dark;
}
html.jn-theme-booting[data-theme="dark"] body.page-gallery :is(.main-area,.content,.content-area,main.gallery-library,.gallery-library,.gallery-scroll),
html[data-theme="dark"] body.page-gallery :is(.main-area,.content,.content-area,main.gallery-library,.gallery-library,.gallery-scroll){
  background:var(--gallery-canvas);
  background-color:var(--gallery-canvas);
  background-image:none;
  color:#f2f2f2;
}

html.jn-light-mode body.page-gallery .gallery-filter-menu,
body.page-gallery.jn-light-mode .gallery-filter-menu{
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:0 14px 34px rgba(15,23,42,.14);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-gallery .gallery-filter-menu a,
html.jn-light-mode body.page-gallery .gallery-filter-menu button,
body.page-gallery.jn-light-mode .gallery-filter-menu a,
body.page-gallery.jn-light-mode .gallery-filter-menu button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-filter-menu a:hover,
html.jn-light-mode body.page-gallery .gallery-filter-menu button:hover,
html.jn-light-mode body.page-gallery .gallery-filter-menu .is-active,
body.page-gallery.jn-light-mode .gallery-filter-menu a:hover,
body.page-gallery.jn-light-mode .gallery-filter-menu button:hover,
body.page-gallery.jn-light-mode .gallery-filter-menu .is-active{
  background:#eef2f7;
  background-color:#eef2f7;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-actions a,
html.jn-light-mode body.page-gallery .gallery-detail-actions button,
body.page-gallery.jn-light-mode .gallery-detail-actions a,
body.page-gallery.jn-light-mode .gallery-detail-actions button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-actions a:hover,
html.jn-light-mode body.page-gallery .gallery-detail-actions button:hover,
body.page-gallery.jn-light-mode .gallery-detail-actions a:hover,
body.page-gallery.jn-light-mode .gallery-detail-actions button:hover{
  background:#f1f5f9;
  background-color:#f1f5f9;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery .gallery-detail-actions button[data-detail-like-toggle].is-liked,
body.page-gallery.jn-light-mode .gallery-detail-actions button[data-detail-like-toggle].is-liked{
  background:#eef2f7;
  background-color:#eef2f7;
  border-color:rgba(15,23,42,.22);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-close,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-close{
  background:#f8fafc;
  background-color:#f8fafc;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-gallery #galleryDetailLayer .gallery-detail-close:hover,
body.page-gallery.jn-light-mode #galleryDetailLayer .gallery-detail-close:hover{
  background:#eef2f7;
  background-color:#eef2f7;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html[data-theme="dark"] body.page-gallery,
html.jn-theme-booting[data-theme="dark"] body.page-gallery{
  background:var(--gallery-canvas);
  background-color:var(--gallery-canvas);
  background-image:none;
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage,
html[data-theme="dark"] body.page-gallery #galleryLibraryPage .gallery-scroll,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage .gallery-scroll{
  background:var(--gallery-canvas);
  background-color:var(--gallery-canvas);
  background-image:none;
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-shell,.gallery-toolbar,.gallery-footer,.gallery-empty,.gallery-detail-modal),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-shell,.gallery-toolbar,.gallery-footer,.gallery-empty,.gallery-detail-modal){
  background:var(--gallery-shell);
  background-color:var(--gallery-shell);
  background-image:none;
  border-color:var(--gallery-line);
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-card,.gallery-card-body,.gallery-detail-side),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-card,.gallery-card-body,.gallery-detail-side){
  background:var(--gallery-panel);
  background-color:var(--gallery-panel);
  background-image:none;
  border-color:var(--gallery-line);
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage .gallery-card:hover,
html[data-theme="dark"] body.page-gallery #galleryLibraryPage .gallery-card:focus-within,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage .gallery-card:hover,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage .gallery-card:focus-within{
  background:var(--gallery-panel-hover);
  background-color:var(--gallery-panel-hover);
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-media,.gallery-media img,.gallery-media video,.gallery-detail-media,.gallery-detail-media img,.gallery-detail-media video),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-media,.gallery-media img,.gallery-media video,.gallery-detail-media,.gallery-detail-media img,.gallery-detail-media video){
  background:var(--gallery-media);
  background-color:var(--gallery-media);
  background-image:none;
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-filter-trigger,.gallery-search,.gallery-page-nav a,.gallery-page-nav span,.gallery-detail-prompt),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-filter-trigger,.gallery-search,.gallery-page-nav a,.gallery-page-nav span,.gallery-detail-prompt){
  background:var(--gallery-control);
  background-color:var(--gallery-control);
  background-image:none;
  border-color:var(--gallery-line);
}
html[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-filter-menu,.gallery-more-menu,.gallery-toast),
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryLibraryPage :is(.gallery-filter-menu,.gallery-more-menu,.gallery-toast){
  background:var(--gallery-panel-hover);
  background-color:var(--gallery-panel-hover);
  background-image:none;
  border-color:var(--gallery-line);
}
html[data-theme="dark"] body.page-gallery #galleryDetailLayer,
html.jn-theme-booting[data-theme="dark"] body.page-gallery #galleryDetailLayer{
  background:rgba(27,28,32,.76);
  background-color:rgba(27,28,32,.76);
  background-image:none;
}
body.page-gallery #galleryLibraryPage{
  display:block;
  grid-template-rows:72px minmax(0,1fr);
  gap:0;
}
body.page-gallery.jn-light-mode #galleryLibraryPage .gallery-scroll{
  background:#f5f7fb;
  background-color:#f5f7fb;
  background-image:none;
}
body.page-gallery.jn-light-mode .main-area{
  border-bottom-color:#0f172a;
}
body.page-gallery #galleryLibraryPage .gallery-card-actions{
  pointer-events:none;
}
body.page-gallery #galleryLibraryPage .gallery-card:hover .gallery-card-actions,
body.page-gallery #galleryLibraryPage .gallery-card:focus-within .gallery-card-actions,
body.page-gallery #galleryLibraryPage .gallery-card.is-menu-open .gallery-card-actions{
  pointer-events:auto;
}
@media(max-width:760px){
  body.page-gallery #galleryLibraryPage .gallery-card-actions{
    display:none;
    opacity:0;
    pointer-events:none;
    visibility:hidden;
  }
  body.page-gallery #galleryLibraryPage .gallery-more-menu{
    display:none;
  }
}

html:has(body.page-records),body.page-records{height:100%;max-height:100%;overflow:hidden;overscroll-behavior:none;background:#1b1c20;}
body.page-records{--records-bg:#1b1c20;--records-shell:#202126;--records-surface:#25262b;--records-surface-hover:#2b2d33;--records-raised:#2b2d33;--records-media:#23242a;--records-media-deep:#282a30;--records-control-hover:#2f3138;--records-border:rgba(255,255,255,.10);--records-border-strong:rgba(255,255,255,.18);--records-text:#f4f4f5;--records-muted:#a8b0bd;--records-accent:var(--lz-front-accent,#3b82f6);--records-accent-soft:var(--lz-front-accent-soft,rgba(59,130,246,.16));--records-overlay:rgba(27,28,32,.88);--records-detail-overlay:rgba(27,28,32,.74);--records-shadow:rgba(12,13,16,.28);--front-work-page-bg:var(--records-bg);--front-work-shell-bg:var(--records-surface);--front-work-card-bg:var(--records-surface);--front-work-card-hover:var(--records-surface-hover);--front-work-media-bg:var(--records-shell);--front-work-text:#d4d4d8;--front-work-strong:var(--records-text);--front-work-muted:var(--records-muted);--front-work-line:var(--records-border);--front-work-line-strong:var(--records-border);--front-work-control-bg:var(--records-media-deep);--front-work-menu-bg:var(--records-media-deep);--front-work-shadow:0 14px 34px var(--records-shadow);--front-work-detail-shadow:0 30px 80px rgba(12,13,16,.38);position:fixed;inset:0;width:100%;}
body.page-records.has-dialog{overflow:hidden;}
body.page-records .main-area{height:100vh;height:100dvh;min-height:100vh;min-height:100dvh;overflow:hidden;background:var(--records-bg);}
body.page-records .main-area>.content{height:100%;min-height:0;overflow:hidden;padding:0;}
.records-library{position:relative;height:calc(100vh - 16px);height:calc(100dvh - 16px);max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);min-height:0;padding:18px;background:var(--records-bg);color:var(--records-text);overflow:hidden;}
.records-shell{position:absolute;inset:18px;height:auto;max-height:none;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border:1px solid var(--records-border);border-radius:18px;background:var(--records-shell);overflow:hidden;box-shadow:none;}
.records-toolbar{position:relative;z-index:5;display:grid;gap:12px;padding:15px 16px 12px;border-bottom:1px solid var(--records-border);background:var(--records-shell);}
.records-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-right:64px;}
.records-title{display:grid;gap:3px;min-width:0;}
.records-title h1{margin:0;color:var(--records-text);font-size:22px;line-height:1.1;font-weight:950;letter-spacing:0;}
.records-title p{margin:0;color:var(--records-muted);font-size:12.5px;line-height:1.35;}
.records-count{height:30px;display:inline-flex;align-items:center;gap:7px;margin-right:0;padding:0 10px;border:1px solid var(--records-border);border-radius:999px;background:var(--records-surface);color:#dce3e9;font-size:12px;font-weight:850;white-space:nowrap;}
.records-tools{display:grid;grid-template-columns:minmax(128px,150px) minmax(128px,150px) minmax(180px,340px) minmax(118px,138px);align-items:center;gap:10px;}
.records-filter{position:relative;z-index:20;min-width:0;}
.records-filter.is-open{z-index:95;}
.records-filter-trigger{width:100%;height:38px;display:flex;align-items:center;justify-content:space-between;gap:9px;border:1px solid var(--records-border);border-radius:12px;background:var(--records-media-deep);color:#e5e7eb;padding:0 11px;font-size:12px;font-weight:900;cursor:pointer;}
.records-filter-trigger span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.records-filter-trigger svg{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s ease;}
.records-filter.is-open .records-filter-trigger svg{transform:rotate(180deg);}
.records-filter-trigger:hover,.records-filter.is-open .records-filter-trigger{border-color:var(--records-accent);background:var(--records-control-hover);color:#fff;}
.records-filter-trigger:focus-visible{outline:1px auto rgb(229,151,0);outline-offset:0;}
.records-filter-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:110;width:max-content;min-width:100%;max-width:min(260px,calc(100vw - 40px));display:none;padding:6px;border:1px solid var(--records-border);border-radius:13px;background:var(--records-raised);box-shadow:0 18px 45px var(--records-shadow);}
.records-filter.is-open .records-filter-menu{display:grid;gap:3px;}
.records-filter-menu a,.records-filter-menu button{width:100%;height:34px;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-radius:9px;background:transparent;color:#e4e4e7;padding:0 10px;font-size:12px;font-weight:850;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer;}
.records-filter-menu a:hover,.records-filter-menu button:hover{background:rgba(255,255,255,.08);color:#fff;}
.records-filter-menu .is-active{background:rgba(255,255,255,.12);color:#fff;}
.records-filter-menu .is-active:after{content:"";width:6px;height:6px;border-radius:50%;background:var(--records-accent);flex:none;}
.records-search{position:relative;z-index:1;height:38px;min-width:0;max-width:340px;display:flex;align-items:center;gap:8px;border:1px solid var(--records-border);border-radius:12px;background:var(--records-media-deep);background-image:none;box-shadow:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:hidden;padding:0 12px;color:var(--records-muted);isolation:isolate;}
.records-search:focus-within{border-color:rgba(59,130,246,.55);box-shadow:0 0 0 3px rgba(59,130,246,.10);}
.records-search:before,.records-search:after,.records-search input:before,.records-search input:after{content:none;display:none;background:none;background-image:none;box-shadow:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;}
.records-search svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}
.records-search input{width:100%;min-width:0;height:38px;border:0;background:transparent;color:var(--records-text);box-shadow:none;outline:0;outline-offset:0;padding:0;font-size:13px;transition:border-color .15s cubic-bezier(.16,1,.3,1),box-shadow .15s cubic-bezier(.16,1,.3,1);}
#recordsLibraryPage .records-search input{appearance:none;-webkit-appearance:none;background:transparent;background-color:transparent;background-image:none;box-shadow:none;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:0;border-radius:0;}
.records-search input::placeholder{color:#71717a;}
.records-scroll{min-height:0;overflow:auto;padding:16px;background:var(--records-bg);scrollbar-width:none;}
.records-scroll::-webkit-scrollbar{display:none;width:0;height:0;}
.records-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:14px;align-content:start;}
.records-empty{min-height:220px;display:grid;place-items:center;border:1px dashed var(--records-border-strong);border-radius:14px;background:var(--records-shell);color:var(--records-muted);text-align:center;padding:24px;}
.records-empty[hidden]{display:none;}
.records-empty strong{display:block;color:#f2f2f2;font-size:18px;margin-bottom:8px;}
.records-card{position:relative;min-width:0;display:grid;grid-template-rows:auto 86px;border:1px solid var(--records-border);border-radius:16px;background:var(--records-surface);color:var(--records-text);overflow:visible;box-shadow:none;transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease,background .16s ease;}
.records-card[hidden]{display:none;}
.records-card:hover{border-color:rgba(59,130,246,.42);background:var(--records-surface-hover);transform:translateY(-1px);box-shadow:0 14px 34px var(--records-shadow);}
.records-card:focus-visible{outline:2px solid var(--records-accent);outline-offset:2px;}
.records-card.is-selected{border-color:rgba(59,130,246,.72);box-shadow:0 0 0 2px rgba(59,130,246,.14);}
.records-check{position:absolute;left:10px;top:10px;z-index:4;width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--records-border-strong);border-radius:9px;background:var(--records-overlay);}
.records-check:hover{border-color:rgba(59,130,246,.58);background:var(--records-control-hover);}
.records-check input{width:16px;height:16px;accent-color:var(--records-accent);}
.records-media{position:relative;aspect-ratio:1;display:grid;place-items:center;background:var(--records-media);overflow:hidden;cursor:pointer;border-radius:15px 15px 0 0;}
.records-media:after{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;z-index:1;background:linear-gradient(180deg,rgba(27,28,32,0),rgba(27,28,32,.58));pointer-events:none;}
.records-media img,.records-media video{width:100%;height:100%;display:block;background:var(--records-media);}
.records-media img{object-fit:cover;}
.records-media video{object-fit:cover;pointer-events:none;}
.records-audio-preview{width:100%;height:100%;display:grid;grid-template-rows:minmax(0,1fr) auto;place-items:center;gap:14px;padding:24px;background:var(--records-media);color:var(--records-text);}
.records-audio-preview>svg{width:64px;height:64px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;color:var(--records-accent);}
.records-audio-preview>audio{width:min(100%,320px);height:42px;display:block;accent-color:var(--records-accent);}
.records-detail-audio{width:100%;min-height:100%;display:grid;grid-template-rows:auto auto auto;place-content:center;justify-items:center;gap:16px;padding:32px;color:var(--records-text);background:var(--records-media);}
.records-detail-audio>svg{width:88px;height:88px;fill:none;stroke:var(--records-accent);stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;}
.records-detail-audio>strong{font-size:15px;font-weight:900;}
.records-detail-audio>audio{width:min(420px,100%);height:46px;display:block;accent-color:var(--records-accent);}
.records-media-placeholder{width:100%;height:100%;display:grid;place-items:center;padding:22px;text-align:center;color:var(--records-muted);background:var(--records-media);}
.records-status-visual{width:min(78%,220px);display:grid;gap:8px;place-items:center;padding:18px 14px;border:1px solid var(--records-border);border-radius:14px;background:var(--records-media-deep);}
.records-status-visual strong{color:#d4d4d8;font-size:15px;letter-spacing:0;}
.records-status-visual small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9ca3af;font-size:12px;}
.records-spinner{width:30px;height:30px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:var(--records-accent);animation:recordsSpin .8s linear infinite;}
@keyframes recordsSpin{to{transform:rotate(360deg)}}
.records-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--records-overlay);border:1px solid rgba(255,255,255,.16);color:#f4f4f5;}
.records-play svg{width:20px;height:20px;margin-left:2px;}
.records-type-badge{position:absolute;right:10px;top:10px;z-index:3;height:24px;display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:var(--records-overlay);color:#f4f4f5;padding:0 8px;font-size:10.5px;font-weight:900;}
.records-media>.records-status{position:absolute;left:10px;bottom:10px;z-index:3;backdrop-filter:none;-webkit-backdrop-filter:none;}
.records-hover-actions{position:absolute;right:10px;bottom:10px;z-index:4;display:flex;align-items:center;gap:6px;opacity:0;transform:translateY(6px);transition:opacity .16s ease,transform .16s ease;}
.records-card:hover .records-hover-actions,.records-card.is-menu-open .records-hover-actions{opacity:1;transform:translateY(0);}
.records-hover-actions button{width:32px;height:32px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:var(--records-overlay);color:#f4f4f5;padding:0;cursor:pointer;}
.records-hover-actions button:hover{background:var(--records-accent-soft);color:var(--records-accent);border-color:rgba(59,130,246,.34);}
.records-hover-actions svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;}
.records-card-body{position:relative;min-height:82px;display:grid;grid-template-rows:auto minmax(16px,1fr) auto;gap:5px;padding:9px 12px 10px;border-top:1px solid var(--records-border);background:var(--records-surface);border-radius:0 0 15px 15px;}
.records-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.records-card-head strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f2f2f2;font-size:12.5px;font-weight:900;}
.records-status{height:23px;display:inline-flex;align-items:center;border:1px solid var(--records-border-strong);border-radius:999px;background:var(--records-media-deep);color:#d4dce0;padding:0 7px;font-size:10.5px;font-weight:900;white-space:nowrap;}
.records-status.succeeded{background:rgba(59,130,246,.14);border-color:rgba(59,130,246,.38);color:#bfdbfe;}
.records-status.failed{background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.36);color:#fca5a5;}
.records-status.queued,.records-status.running{background:rgba(59,130,246,.09);border-color:rgba(59,130,246,.28);color:#93c5fd;}
.records-time{color:var(--records-muted);font-size:11px;white-space:nowrap;}
.records-prompt{display:block;height:18px;max-height:18px;overflow:hidden;color:#d8d8df;font-size:12.5px;line-height:18px;word-break:normal;white-space:nowrap;text-overflow:ellipsis;}
.records-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--records-muted);font-size:11px;min-width:0;}
.records-meta span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.records-more-menu{position:absolute;right:10px;bottom:40px;z-index:35;width:132px;display:none;padding:4px;border:1px solid var(--records-border);border-radius:11px;background:var(--records-raised);background-image:none;box-shadow:0 16px 38px var(--records-shadow);}
.records-card.is-menu-open .records-more-menu{display:grid;gap:3px;}
.records-more-menu button,.records-more-menu a{width:100%;height:29px;display:flex;align-items:center;justify-content:flex-start;gap:7px;border:0;border-radius:8px;background:transparent;color:#e4e4e7;padding:0 7px;font-size:11px;font-weight:850;text-decoration:none;cursor:pointer;}
#recordsLibraryPage .records-more-menu button,#recordsLibraryPage .records-more-menu a,#recordsLibraryPage .records-more-menu form button{background:transparent;background-image:none;border:0;box-shadow:none;color:#e4e4e7;}
#recordsLibraryPage .records-more-menu button:not(:hover),#recordsLibraryPage .records-more-menu a:not(:hover),#recordsLibraryPage .records-more-menu form button:not(:hover){background:transparent;background-image:none;}
.records-more-menu form{margin:0;}
.records-more-menu button:hover,.records-more-menu a:hover{background:rgba(255,255,255,.08);color:#fff;}
#recordsLibraryPage .records-more-menu button:hover,#recordsLibraryPage .records-more-menu a:hover,#recordsLibraryPage .records-more-menu form button:hover{background:rgba(255,255,255,.08);color:#fff;}
.records-more-menu .is-danger,#recordsLibraryPage .records-more-menu .is-danger{color:#fca5a5;}
.records-more-menu .is-danger:hover,#recordsLibraryPage .records-more-menu .is-danger:hover{background:rgba(239,68,68,.12);color:#fecaca;}
.records-more-menu svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;}
.records-footer{position:relative;z-index:4;min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 16px;border-top:1px solid var(--records-border);background:var(--records-shell);}
.records-page-nav{display:flex;align-items:center;gap:8px;}
.records-page-nav a,.records-page-nav span{height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--records-border);border-radius:999px;background:var(--records-media-deep);color:#dce3e9;padding:0 12px;font-size:12px;font-weight:850;text-decoration:none;white-space:nowrap;}
.records-page-nav a:hover{border-color:var(--records-accent);color:#fff;background:var(--records-control-hover);}
.records-page-nav a.is-disabled{opacity:.45;pointer-events:none;}
.records-bulk-dock{display:none;align-items:center;gap:9px;}
.records-bulk-dock.is-open{display:flex;}
.records-bulk-info{height:34px;display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(59,130,246,.28);border-radius:999px;background:rgba(59,130,246,.11);color:#bfdbfe;padding:0 10px;font-size:12px;font-weight:900;}
.records-bulk-dock button{height:34px;border:1px solid var(--records-border);border-radius:10px;background:var(--records-surface);color:var(--records-text);padding:0 12px;font-size:12px;font-weight:900;cursor:pointer;}
.records-bulk-dock button:hover{border-color:rgba(59,130,246,.58);background:var(--records-raised);}
.records-bulk-dock .records-bulk-delete{border-color:rgba(239,68,68,.28);color:#fca5a5;}
@media(min-width:901px){
  .records-page-nav{order:2;justify-content:flex-end;margin-left:auto;}
  .records-bulk-dock{order:1;}
}
.records-detail-layer,.record-delete-confirm-layer{position:fixed;inset:0;z-index:100050;display:grid;place-items:center;padding:18px;background:var(--records-detail-overlay);backdrop-filter:none;-webkit-backdrop-filter:none;}
body.page-records .front-work-detail-layer{background:var(--records-detail-overlay);backdrop-filter:none;-webkit-backdrop-filter:none;}
.records-detail{width:min(1040px,calc(100vw - 36px));height:min(76vh,660px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(330px,.72fr);border:1px solid var(--records-border);border-radius:20px;background:var(--records-surface);color:var(--records-text);overflow:hidden;box-shadow:0 30px 80px rgba(12,13,16,.38);}
.records-detail-media{min-width:0;display:grid;place-items:center;background:var(--records-shell);overflow:hidden;padding:14px;}
.records-detail-media img,.records-detail-media video{width:100%;height:100%;object-fit:contain;background:var(--records-shell);}
.records-detail-side{min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border-left:1px solid var(--records-border);background:var(--records-surface);}
.records-detail-head{height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 12px 0 16px;border-bottom:1px solid rgba(255,255,255,.09);}
.records-detail-head strong{font-size:15px;}
.records-detail-close{width:32px;height:32px;border:1px solid var(--records-border);border-radius:10px;background:var(--records-media-deep);color:#d4d4d8;font-size:19px;cursor:pointer;}
.records-detail-close:hover{background:var(--records-accent-soft);color:var(--records-accent);}
.records-detail-body{min-height:0;overflow:auto;padding:14px 16px;display:grid;gap:12px;scrollbar-width:none;}
.records-detail-body::-webkit-scrollbar{display:none;width:0;height:0;}
.records-detail-prompt{max-height:150px;overflow:auto;border:1px solid var(--records-border);border-radius:14px;background:var(--records-media-deep);padding:12px;color:#f4f4f5;font-size:13px;line-height:1.6;white-space:pre-wrap;word-break:break-word;scrollbar-width:none;}
.records-detail-prompt::-webkit-scrollbar{display:none;width:0;height:0;}
.records-detail-list{display:grid;gap:7px;}
.records-detail-row{display:grid;grid-template-columns:78px minmax(0,1fr);gap:9px;align-items:start;font-size:12.5px;line-height:1.45;}
.records-detail-row span{color:var(--records-muted);}
.records-detail-row strong{color:var(--records-text);font-weight:850;word-break:break-word;}
.records-detail-actions{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;padding:12px 16px;border-top:1px solid rgba(255,255,255,.09);overflow-x:auto;scrollbar-width:none;}
.records-detail-actions::-webkit-scrollbar{display:none;width:0;height:0;}
.records-detail-actions form{margin:0;display:flex;flex:0 0 auto;}
.records-detail-actions button,.records-detail-actions a{height:32px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--records-border);border-radius:10px;background:transparent;color:var(--records-text);padding:0 9px;font-size:11.5px;font-weight:900;text-decoration:none;white-space:nowrap;cursor:pointer;}
#recordsLibraryPage ~ .records-detail-layer .records-detail-actions button,
#recordsLibraryPage ~ .records-detail-layer .records-detail-actions a,
.records-detail-layer .records-detail-actions button,
.records-detail-layer .records-detail-actions a{height:32px;min-width:0;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--records-border);border-radius:10px;background:transparent;background-image:none;color:var(--records-text);box-shadow:none;padding:0 9px;font-size:11.5px;font-weight:900;line-height:1;text-decoration:none;white-space:nowrap;}
.records-detail-actions button:hover,.records-detail-actions a:hover{background:rgba(255,255,255,.08);color:#fff;border-color:var(--records-border-strong);}
.records-detail-layer .records-detail-actions button:hover,.records-detail-layer .records-detail-actions a:hover{background:rgba(255,255,255,.08);color:#fff;border-color:var(--records-border-strong);}
.record-delete-confirm{width:min(380px,calc(100vw - 34px));border:1px solid var(--records-border);border-radius:18px;background:var(--records-surface);color:var(--records-text);padding:22px;text-align:center;box-shadow:0 30px 80px rgba(12,13,16,.38);}
.record-delete-confirm-icon{width:42px;height:42px;margin:0 auto 12px;border-radius:50%;display:grid;place-items:center;background:rgba(239,68,68,.14);color:#fca5a5;font-weight:1000;}
.record-delete-confirm h3{margin:0 0 8px;font-size:18px;}
.record-delete-confirm p{margin:0;color:#d4d4d8;font-size:13px;line-height:1.65;}
.record-delete-confirm-actions{display:flex;justify-content:center;gap:10px;margin-top:18px;}
.record-delete-confirm-actions button{height:36px;min-width:92px;border-radius:999px;font-size:13px;font-weight:900;cursor:pointer;}
.record-delete-cancel{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#f4f4f5;}
.record-delete-ok{border:1px solid rgba(239,68,68,.32);background:rgba(239,68,68,.20);color:#fecaca;}
.records-toast{position:fixed;left:50%;bottom:24px;z-index:100070;transform:translate(-50%,16px);opacity:0;pointer-events:none;border:1px solid var(--records-border);border-radius:999px;background:var(--records-surface-hover);color:var(--records-text);padding:10px 14px;font-size:13px;font-weight:900;box-shadow:0 18px 45px var(--records-shadow);transition:opacity .16s ease,transform .16s ease;}
.records-toast.is-open{opacity:1;transform:translate(-50%,0);}
html.jn-light-mode:has(body.page-records),html.jn-light-mode body.page-records,body.page-records.jn-light-mode{background:#f5f7fb;color:#0f172a;}
html.jn-light-mode body.page-records,body.page-records.jn-light-mode{--front-work-page-bg:#f5f7fb;--front-work-shell-bg:#fff;--front-work-card-bg:#fff;--front-work-card-hover:#fff;--front-work-media-bg:#e8edf3;--front-work-text:#0f172a;--front-work-strong:#0f172a;--front-work-muted:#64748b;--front-work-line:rgba(15,23,42,.10);--front-work-line-strong:rgba(15,23,42,.12);--front-work-control-bg:#fff;--front-work-menu-bg:#f8fafc;--front-work-shadow:0 14px 34px rgba(15,23,42,.10);--front-work-detail-shadow:0 26px 70px rgba(15,23,42,.16);}
html.jn-light-mode body.page-records .main-area,body.page-records.jn-light-mode .main-area,
html.jn-light-mode body.page-records .records-library,body.page-records.jn-light-mode .records-library,
html.jn-light-mode body.page-records .records-scroll,body.page-records.jn-light-mode .records-scroll{background:#f5f7fb;color:#0f172a;}
html.jn-light-mode body.page-records .records-shell,body.page-records.jn-light-mode .records-shell,
html.jn-light-mode body.page-records .records-toolbar,body.page-records.jn-light-mode .records-toolbar,
html.jn-light-mode body.page-records .records-footer,body.page-records.jn-light-mode .records-footer,
html.jn-light-mode body.page-records .records-card,body.page-records.jn-light-mode .records-card,
html.jn-light-mode body.page-records .records-card-body,body.page-records.jn-light-mode .records-card-body{background:#fff;border-color:rgba(15,23,42,.10);color:#0f172a;}
html.jn-light-mode body.page-records .records-card:hover,body.page-records.jn-light-mode .records-card:hover{background:#fff;border-color:rgba(15,23,42,.16);box-shadow:0 14px 34px rgba(15,23,42,.10);}
html.jn-light-mode body.page-records .records-media,body.page-records.jn-light-mode .records-media{background:#f1f5f9;}
html.jn-light-mode body.page-records .records-media img,body.page-records.jn-light-mode .records-media img,
html.jn-light-mode body.page-records .records-media video,body.page-records.jn-light-mode .records-media video,
html.jn-light-mode body.page-records .records-audio-preview,body.page-records.jn-light-mode .records-audio-preview,
html.jn-light-mode body.page-records .records-detail-audio,body.page-records.jn-light-mode .records-detail-audio{background:#e8edf3;color:#0f172a;}
html.jn-light-mode body.page-records .records-empty,body.page-records.jn-light-mode .records-empty{background:#fff;border-color:rgba(15,23,42,.12);color:#64748b;}
html.jn-light-mode body.page-records .records-media-placeholder,body.page-records.jn-light-mode .records-media-placeholder{background:#e8edf3;border-color:rgba(15,23,42,.12);color:#64748b;}
html.jn-light-mode body.page-records .records-status-visual,body.page-records.jn-light-mode .records-status-visual{background:#f1f5f9;border-color:rgba(15,23,42,.10);}
html.jn-light-mode body.page-records .records-status-visual strong,body.page-records.jn-light-mode .records-status-visual strong{color:#0f172a;}
html.jn-light-mode body.page-records .records-title h1,body.page-records.jn-light-mode .records-title h1,
html.jn-light-mode body.page-records .records-prompt,body.page-records.jn-light-mode .records-prompt{color:#0f172a;}
html.jn-light-mode body.page-records .records-title p,body.page-records.jn-light-mode .records-title p,
html.jn-light-mode body.page-records .records-time,body.page-records.jn-light-mode .records-time,
html.jn-light-mode body.page-records .records-meta,body.page-records.jn-light-mode .records-meta{color:#64748b;}
html.jn-light-mode body.page-records .records-filter-trigger,body.page-records.jn-light-mode .records-filter-trigger,
html.jn-light-mode body.page-records .records-filter-menu,body.page-records.jn-light-mode .records-filter-menu,
html.jn-light-mode body.page-records .records-search,body.page-records.jn-light-mode .records-search,
html.jn-light-mode body.page-records .records-page-nav a,body.page-records.jn-light-mode .records-page-nav a,
html.jn-light-mode body.page-records .records-page-nav span,body.page-records.jn-light-mode .records-page-nav span{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a;}
html.jn-light-mode body.page-records .records-filter .records-filter-trigger,body.page-records.jn-light-mode .records-filter .records-filter-trigger{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:0 1px 2px rgba(15,23,42,.04);}
html.jn-light-mode body.page-records .records-filter .records-filter-trigger svg,body.page-records.jn-light-mode .records-filter .records-filter-trigger svg{color:#475569;stroke:#475569;}
#recordsLibraryPage .records-filter .records-filter-trigger{background:var(--records-media-deep);border-color:var(--records-border);color:#e5e7eb;}
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-trigger,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-trigger{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:0 1px 2px rgba(15,23,42,.04);}
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-trigger svg,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-trigger svg{color:#475569;stroke:#475569;}
html.jn-light-mode #recordsLibraryPage .records-search,body.jn-light-mode #recordsLibraryPage .records-search{background:#fff;background-image:none;border-color:rgba(15,23,42,.12);box-shadow:0 1px 2px rgba(15,23,42,.04);color:#64748b;}
html.jn-light-mode #recordsLibraryPage .records-search:before,body.jn-light-mode #recordsLibraryPage .records-search:before,
html.jn-light-mode #recordsLibraryPage .records-search:after,body.jn-light-mode #recordsLibraryPage .records-search:after{content:none;display:none;background:none;box-shadow:none;filter:none;}
html.jn-light-mode body.page-records .records-count,body.page-records.jn-light-mode .records-count{background:#fff;border-color:rgba(15,23,42,.12);color:#475569;box-shadow:0 1px 2px rgba(15,23,42,.04);}
html.jn-light-mode body.page-records .records-filter-trigger:hover,body.page-records.jn-light-mode .records-filter-trigger:hover,
html.jn-light-mode body.page-records .records-filter.is-open .records-filter-trigger,body.page-records.jn-light-mode .records-filter.is-open .records-filter-trigger{background:#fff;border-color:rgba(15,23,42,.18);color:#0f172a;}
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu,
html.jn-light-mode body.page-records .records-filter-menu,body.page-records.jn-light-mode .records-filter-menu{background:#fff;background-image:none;border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:0 18px 45px rgba(15,23,42,.14);}
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu a,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu a,
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu button,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu button,
html.jn-light-mode body.page-records .records-filter-menu a,body.page-records.jn-light-mode .records-filter-menu a,
html.jn-light-mode body.page-records .records-filter-menu button,body.page-records.jn-light-mode .records-filter-menu button{background:transparent;background-image:none;color:#0f172a;border:0;box-shadow:none;}
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu a:hover,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu a:hover,
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu button:hover,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu button:hover,
html.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu .is-active,body.jn-light-mode #recordsLibraryPage .records-filter .records-filter-menu .is-active{background:#eef2f7;color:#0f172a;}
html.jn-light-mode body.page-records .records-filter-menu a:hover,body.page-records.jn-light-mode .records-filter-menu a:hover,
html.jn-light-mode body.page-records .records-filter-menu button:hover,body.page-records.jn-light-mode .records-filter-menu button:hover,
html.jn-light-mode body.page-records .records-filter-menu .is-active,body.page-records.jn-light-mode .records-filter-menu .is-active{background:#eef2f7;color:#0f172a;}
html.jn-light-mode body.page-records .records-check,body.page-records.jn-light-mode .records-check,
html.jn-light-mode body.page-records .records-type-badge,body.page-records.jn-light-mode .records-type-badge{background:rgba(255,255,255,.88);border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:0 8px 22px rgba(15,23,42,.12);}
html.jn-light-mode body.page-records .records-status.succeeded,body.page-records.jn-light-mode .records-status.succeeded{background:rgba(37,99,235,.10);border-color:rgba(37,99,235,.24);color:#1d4ed8;}
html.jn-light-mode body.page-records .records-status.failed,body.page-records.jn-light-mode .records-status.failed{background:rgba(220,38,38,.10);border-color:rgba(220,38,38,.24);color:#b91c1c;}
html.jn-light-mode body.page-records .records-status.queued,body.page-records.jn-light-mode .records-status.queued,
html.jn-light-mode body.page-records .records-status.running,body.page-records.jn-light-mode .records-status.running{background:rgba(37,99,235,.07);border-color:rgba(37,99,235,.18);color:#2563eb;}
html.jn-light-mode body.page-records .records-hover-actions button,body.page-records.jn-light-mode .records-hover-actions button{background:rgba(255,255,255,.88);background-image:none;border-color:rgba(15,23,42,.14);color:#0f172a;box-shadow:0 8px 22px rgba(15,23,42,.12);}
html.jn-light-mode body.page-records .records-hover-actions button:hover,body.page-records.jn-light-mode .records-hover-actions button:hover{background:#f8fafc;color:#0f172a;border-color:rgba(15,23,42,.22);}
html.jn-light-mode body.page-records .records-more-menu,body.page-records.jn-light-mode .records-more-menu{background:#fff;background-color:#fff;background-image:none;border-color:rgba(15,23,42,.12);box-shadow:0 14px 34px rgba(15,23,42,.14);backdrop-filter:none;-webkit-backdrop-filter:none;}
html.jn-light-mode body.page-records .records-more-menu button,body.page-records.jn-light-mode .records-more-menu button,
html.jn-light-mode body.page-records .records-more-menu a,body.page-records.jn-light-mode .records-more-menu a,
html.jn-light-mode #recordsLibraryPage .records-more-menu button,body.jn-light-mode #recordsLibraryPage .records-more-menu button,
html.jn-light-mode #recordsLibraryPage .records-more-menu a,body.jn-light-mode #recordsLibraryPage .records-more-menu a,
html.jn-light-mode #recordsLibraryPage .records-more-menu form button,body.jn-light-mode #recordsLibraryPage .records-more-menu form button{background:transparent;background-color:transparent;background-image:none;border:0;box-shadow:none;color:#0f172a;}
html.jn-light-mode #recordsLibraryPage .records-more-menu button:not(:hover),body.jn-light-mode #recordsLibraryPage .records-more-menu button:not(:hover),
html.jn-light-mode #recordsLibraryPage .records-more-menu a:not(:hover),body.jn-light-mode #recordsLibraryPage .records-more-menu a:not(:hover),
html.jn-light-mode #recordsLibraryPage .records-more-menu form button:not(:hover),body.jn-light-mode #recordsLibraryPage .records-more-menu form button:not(:hover){background:transparent;background-color:transparent;background-image:none;}
html.jn-light-mode body.page-records .records-more-menu button:hover,body.page-records.jn-light-mode .records-more-menu button:hover,
html.jn-light-mode body.page-records .records-more-menu a:hover,body.page-records.jn-light-mode .records-more-menu a:hover,
html.jn-light-mode #recordsLibraryPage .records-more-menu button:hover,body.jn-light-mode #recordsLibraryPage .records-more-menu button:hover,
html.jn-light-mode #recordsLibraryPage .records-more-menu a:hover,body.jn-light-mode #recordsLibraryPage .records-more-menu a:hover,
html.jn-light-mode #recordsLibraryPage .records-more-menu form button:hover,body.jn-light-mode #recordsLibraryPage .records-more-menu form button:hover{background:#f1f5f9;color:#0f172a;}
html.jn-light-mode body.page-records .records-more-menu .is-danger,body.page-records.jn-light-mode .records-more-menu .is-danger{color:#b91c1c;}
html.jn-light-mode body.page-records .records-more-menu .is-danger:hover,body.page-records.jn-light-mode .records-more-menu .is-danger:hover{background:#fee2e2;color:#991b1b;}
html.jn-light-mode #recordsLibraryPage .records-more-menu button.is-danger,body.jn-light-mode #recordsLibraryPage .records-more-menu button.is-danger{color:#b91c1c;}
html.jn-light-mode #recordsLibraryPage .records-more-menu button.is-danger:hover,body.jn-light-mode #recordsLibraryPage .records-more-menu button.is-danger:hover{background:#fee2e2;color:#991b1b;}
html.jn-light-mode body.page-records .records-search input,body.page-records.jn-light-mode .records-search input{color:#0f172a;-webkit-text-fill-color:#0f172a;}
html.jn-light-mode body.page-records .records-search input::placeholder,body.page-records.jn-light-mode .records-search input::placeholder{color:#94a3b8;}
html.jn-light-mode body.page-records .records-detail-layer,body.page-records.jn-light-mode .records-detail-layer,
html.jn-light-mode body.page-records .record-delete-confirm-layer,body.page-records.jn-light-mode .record-delete-confirm-layer{background:rgba(226,232,240,.62);}
html.jn-light-mode body.page-records .front-work-detail-layer,body.page-records.jn-light-mode .front-work-detail-layer{background:rgba(226,232,240,.62);}
html.jn-light-mode body.page-records .records-detail,body.page-records.jn-light-mode .records-detail,
html.jn-light-mode body.page-records .records-detail-side,body.page-records.jn-light-mode .records-detail-side,
html.jn-light-mode body.page-records .record-delete-confirm,body.page-records.jn-light-mode .record-delete-confirm{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a;}
html.jn-light-mode body.page-records .records-detail-media,body.page-records.jn-light-mode .records-detail-media,
html.jn-light-mode body.page-records .records-detail-media img,body.page-records.jn-light-mode .records-detail-media img,
html.jn-light-mode body.page-records .records-detail-media video,body.page-records.jn-light-mode .records-detail-media video{background:#e8edf3;}
html.jn-light-mode body.page-records .records-detail-prompt,body.page-records.jn-light-mode .records-detail-prompt{background:#fff;border-color:rgba(15,23,42,.10);color:#0f172a;}
html.jn-light-mode body.page-records .records-detail-close,body.page-records.jn-light-mode .records-detail-close{background:#f8fafc;border-color:rgba(15,23,42,.12);color:#0f172a;}
html.jn-light-mode body.page-records .records-detail-close:hover,body.page-records.jn-light-mode .records-detail-close:hover{background:#eef2f7;color:#0f172a;}
html.jn-light-mode body.page-records .records-detail-actions button,body.page-records.jn-light-mode .records-detail-actions button,
html.jn-light-mode body.page-records .records-detail-actions a,body.page-records.jn-light-mode .records-detail-actions a{background:transparent;background-color:transparent;background-image:none;border-color:rgba(15,23,42,.14);color:#0f172a;box-shadow:none;}
html.jn-light-mode .records-detail-layer .records-detail-actions button,body.jn-light-mode .records-detail-layer .records-detail-actions button,
html.jn-light-mode .records-detail-layer .records-detail-actions a,body.jn-light-mode .records-detail-layer .records-detail-actions a{background:transparent;background-color:transparent;background-image:none;border-color:rgba(15,23,42,.14);color:#0f172a;box-shadow:none;}
html.jn-light-mode .records-detail-layer .records-detail-actions button:not(:hover),body.jn-light-mode .records-detail-layer .records-detail-actions button:not(:hover),
html.jn-light-mode .records-detail-layer .records-detail-actions a:not(:hover),body.jn-light-mode .records-detail-layer .records-detail-actions a:not(:hover){background:transparent;background-color:transparent;background-image:none;color:#0f172a;}
html.jn-light-mode body.page-records .records-detail-actions button:hover,body.page-records.jn-light-mode .records-detail-actions button:hover,
html.jn-light-mode body.page-records .records-detail-actions a:hover,body.page-records.jn-light-mode .records-detail-actions a:hover{background:#f1f5f9;border-color:rgba(15,23,42,.18);color:#0f172a;}
html.jn-light-mode .records-detail-layer .records-detail-actions button:hover,body.jn-light-mode .records-detail-layer .records-detail-actions button:hover,
html.jn-light-mode .records-detail-layer .records-detail-actions a:hover,body.jn-light-mode .records-detail-layer .records-detail-actions a:hover{background:#f1f5f9;border-color:rgba(15,23,42,.18);color:#0f172a;}
html.jn-light-mode body.page-records .records-detail-row span,body.page-records.jn-light-mode .records-detail-row span,
html.jn-light-mode body.page-records .record-delete-confirm p,body.page-records.jn-light-mode .record-delete-confirm p{color:#64748b;}
html.jn-light-mode body.page-records .records-detail-row strong,body.page-records.jn-light-mode .records-detail-row strong,
html.jn-light-mode body.page-records .record-delete-confirm h3,body.page-records.jn-light-mode .record-delete-confirm h3{color:#0f172a;}
html.jn-light-mode body.page-records .record-delete-cancel,body.page-records.jn-light-mode .record-delete-cancel{background:#f8fafc;border-color:rgba(15,23,42,.12);color:#0f172a;}
html.jn-light-mode body.page-records .record-delete-cancel:hover,body.page-records.jn-light-mode .record-delete-cancel:hover{background:#f1f5f9;border-color:rgba(15,23,42,.18);}
html.jn-light-mode body.page-records .records-toast,body.page-records.jn-light-mode .records-toast{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a;box-shadow:0 18px 45px rgba(15,23,42,.14);}
@media(max-width:900px){
  body.page-records{overflow:hidden;}
  .records-library{padding:10px;}
  .records-shell{inset:10px;}
  .records-shell{border-radius:14px;}
  .records-toolbar{padding:12px 12px 10px;gap:10px;}
  #recordsLibraryPage .records-title-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;padding:0 52px;box-sizing:border-box;}
  #recordsLibraryPage .records-title h1{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .records-title h1{font-size:20px;}
  .records-title p{display:none;}
  .records-count{height:28px;margin-right:0;padding:0 8px;font-size:11px;max-width:min(44vw,160px);justify-self:end;overflow:hidden;text-overflow:ellipsis;}
  .records-tools{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;}
  .records-tools,.records-filter,.records-search{min-width:0;}
  .records-filter{z-index:20;}
  .records-filter.is-open{z-index:220;}
  .records-filter.is-open .records-filter-menu{z-index:240;}
  .records-filter-trigger,.records-search{height:36px;border-radius:11px;}
  .records-filter-menu{width:100%;min-width:0;}
  .records-search{grid-column:1 / 2;max-width:none;}
  .records-filter[data-sort-filter]{grid-column:2 / 3;}
  .records-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .records-card{grid-template-rows:auto 74px;border-radius:14px;}
  .records-card-body{min-height:74px;padding:7px 8px 8px;border-radius:0 0 13px 13px;}
  .records-media{border-radius:13px 13px 0 0;}
  .records-card-head strong{font-size:11.5px;}
  .records-time{display:none;}
  .records-prompt{display:block;height:16px;max-height:16px;font-size:11.5px;line-height:16px;white-space:nowrap;text-overflow:ellipsis;-webkit-line-clamp:unset;}
  .records-meta{font-size:10.5px;gap:6px;}
  .records-meta span:last-child{display:none;}
  .records-hover-actions{display:none;}
  .records-check{left:8px;top:8px;width:26px;height:26px;}
  .records-type-badge,.records-media>.records-status{display:none;}
  .records-play{background:transparent;border:0;box-shadow:none;}
  .records-scroll{padding:12px;}
  .records-footer{min-height:58px;padding:10px 12px;align-items:stretch;flex-direction:column;}
  .records-page-nav{justify-content:space-between;}
  .records-page-nav a,.records-page-nav span{height:32px;padding:0 10px;}
  .records-bulk-dock{width:100%;justify-content:space-between;gap:7px;}
  .records-bulk-dock button{padding:0 10px;}
  .records-detail-layer{padding:10px;place-items:center;background:var(--records-detail-overlay);}
  .records-detail{width:min(100%,370px);height:min(82vh,690px);max-height:690px;grid-template-columns:1fr;grid-template-rows:minmax(180px,30%) minmax(0,70%);border-radius:16px;}
  .records-detail-side{border-left:0;border-top:1px solid rgba(255,255,255,.10);}
  .records-detail-media{padding:9px;max-height:230px;}
  .records-detail-media img,.records-detail-media video{max-height:210px;}
  .records-detail-head{height:48px;padding:0 10px 0 13px;}
  .records-detail-body{padding:11px 13px;gap:9px;}
  .records-detail-prompt{max-height:82px;font-size:12.5px;}
  .records-detail-row{grid-template-columns:70px minmax(0,1fr);font-size:12px;}
  .records-detail-actions{padding:10px 13px;gap:7px;flex-wrap:nowrap;overflow-x:auto;}
  .records-detail-actions button,.records-detail-actions a{height:32px;font-size:11.5px;padding:0 9px;flex:0 0 auto;}
}
@media(max-width:560px){
  .records-library{padding:8px;}
  .records-shell{inset:8px;}
  .records-toolbar{padding:10px 10px;}
  .records-scroll{padding:10px;}
  #recordsLibraryPage .records-title-row{grid-template-columns:1fr;gap:6px;min-height:42px;padding:0 42px;text-align:center;}
  #recordsLibraryPage .records-title{justify-items:center;min-width:0;}
  .records-title h1{font-size:19px;}
  #recordsLibraryPage .records-count{max-width:100%;justify-self:center;}
  .records-tools{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .records-filter-menu{max-width:calc(100vw - 40px);}
  .records-more-menu{right:6px;bottom:36px;width:126px;max-width:calc(100vw - 32px);padding:4px;}
  .records-more-menu button,.records-more-menu a{height:28px;font-size:10.5px;padding:0 7px;}
  .records-detail-layer{padding:8px;}
  .records-detail{width:100%;height:min(82vh,690px);}
  .records-footer{gap:8px;}
}
html.jn-light-mode #recordsLibraryPage .records-hover-actions button,
body.jn-light-mode #recordsLibraryPage .records-hover-actions button,
html.jn-light-mode #recordsLibraryPage [data-more-toggle],
body.jn-light-mode #recordsLibraryPage [data-more-toggle]{
  background:rgba(255,255,255,.88);
  background-color:rgba(255,255,255,.88);
  background-image:none;
  border-color:rgba(15,23,42,.14);
  color:#0f172a;
  box-shadow:0 8px 22px rgba(15,23,42,.12);
}
html.jn-light-mode #recordsLibraryPage .records-hover-actions button:hover,
body.jn-light-mode #recordsLibraryPage .records-hover-actions button:hover,
html.jn-light-mode #recordsLibraryPage .records-card.is-menu-open [data-more-toggle],
body.jn-light-mode #recordsLibraryPage .records-card.is-menu-open [data-more-toggle],
html.jn-light-mode #recordsLibraryPage [data-more-toggle]:hover,
body.jn-light-mode #recordsLibraryPage [data-more-toggle]:hover{
  background:#f8fafc;
  background-image:none;
  border-color:rgba(15,23,42,.22);
  color:#0f172a;
}
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu{
  background:#fff;
  background-color:#fff;
  background-image:none;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 14px 34px rgba(15,23,42,.14);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu button,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu button,
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu a,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu a,
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu form button,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu form button{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  color:#0f172a;
}
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu button:hover,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu button:hover,
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu a:hover,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu a:hover,
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu form button:hover,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu form button:hover{
  background:#f1f5f9;
  background-image:none;
  color:#0f172a;
}
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu .is-danger,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu .is-danger{
  color:#b91c1c;
}
html.jn-light-mode #recordsLibraryPage .records-card .records-more-menu .is-danger:hover,
body.jn-light-mode #recordsLibraryPage .records-card .records-more-menu .is-danger:hover{
  background:#fee2e2;
  color:#991b1b;
}
html.jn-light-mode .records-detail-layer .records-detail .records-detail-actions button,
body.jn-light-mode .records-detail-layer .records-detail .records-detail-actions button,
html.jn-light-mode .records-detail-layer .records-detail .records-detail-actions form button,
body.jn-light-mode .records-detail-layer .records-detail .records-detail-actions form button,
html.jn-light-mode .records-detail-layer .records-detail .records-detail-actions a,
body.jn-light-mode .records-detail-layer .records-detail .records-detail-actions a{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:1px solid rgba(15,23,42,.14);
  color:#0f172a;
  box-shadow:none;
}
html.jn-light-mode .records-detail-layer .records-detail .records-detail-actions button:hover,
body.jn-light-mode .records-detail-layer .records-detail .records-detail-actions button:hover,
html.jn-light-mode .records-detail-layer .records-detail .records-detail-actions form button:hover,
body.jn-light-mode .records-detail-layer .records-detail .records-detail-actions form button:hover,
html.jn-light-mode .records-detail-layer .records-detail .records-detail-actions a:hover,
body.jn-light-mode .records-detail-layer .records-detail .records-detail-actions a:hover{
  background:#f1f5f9;
  background-image:none;
  border-color:rgba(15,23,42,.18);
  color:#0f172a;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage{
  background:#1b1c20;
  color:#f4f4f5;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-shell,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-toolbar,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-footer{
  background:#202126;
  border-color:rgba(255,255,255,.10);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-scroll{
  background:#1b1c20;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-card,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-card-body{
  background:#25262b;
  border-color:rgba(255,255,255,.10);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-card-body{
  display:grid;
  height:auto;
  min-height:82px;
  grid-template-rows:auto minmax(16px,1fr) auto;
}
body.page-records #recordsLibraryPage .records-card{
  grid-template-rows:auto 86px;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-media,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-media img,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-media video{
  background:#23242a;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-search,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-filter-trigger,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-page-nav a,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-page-nav span{
  background:#282a30;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-empty{
  background:#202126;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-filter-menu,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage .records-more-menu{
  background:#2b2d33;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .records-detail,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .records-detail-side,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .record-delete-confirm{
  background:#25262b;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .records-detail-media{
  background:#202126;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .records-detail-prompt{
  background:#282a30;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .records-detail-media img,
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) .records-detail-media video{
  background:#202126;
}
body.page-records #recordsLibraryPage .records-empty[hidden]{
  display:none;
}
html.jn-light-mode body.page-records .records-detail-layer .records-detail-media,
html.jn-light-mode body.page-records .records-detail-layer .records-detail-media img,
html.jn-light-mode body.page-records .records-detail-layer .records-detail-media video,
body.jn-light-mode.page-records .records-detail-layer .records-detail-media,
body.jn-light-mode.page-records .records-detail-layer .records-detail-media img,
body.jn-light-mode.page-records .records-detail-layer .records-detail-media video{
  background:#e8edf3;
}
body.page-records .records-detail-layer .records-detail-share,
body.page-records .front-work-detail-layer .records-detail-share{
  color:var(--front-work-strong,var(--records-text));
  font-size:11.5px;
  text-indent:0;
  -webkit-text-fill-color:var(--front-work-strong,var(--records-text));
}
body.page-records .records-detail-layer .records-detail-share span,
body.page-records .front-work-detail-layer .records-detail-share span{
  display:inline;
  visibility:visible;
  opacity:1;
  color:var(--front-work-strong,var(--records-text));
  -webkit-text-fill-color:var(--front-work-strong,var(--records-text));
  font-size:inherit;
}
@media(max-width:900px){
  body.page-records #recordsLibraryPage .records-card{
    grid-template-rows:auto 74px;
  }
  body.page-records #recordsLibraryPage .records-card-body{
    display:grid;
    height:auto;
    min-height:74px;
    grid-template-rows:auto minmax(16px,1fr) auto;
  }
  body.page-records .records-detail-layer .records-detail-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    overflow:visible;
  }
  body.page-records .records-detail-layer .records-detail-actions form{
    display:contents;
  }
  body.page-records .records-detail-layer .records-detail-actions button,
  body.page-records .records-detail-layer .records-detail-actions a{
    width:100%;
    min-width:0;
  }
}

/* Keep this page on the same color system as the inspiration gallery. */
body.page-records{
  --records-bg:#1b1c20;
  --records-shell:#202126;
  --records-surface:#25262b;
  --records-surface-hover:#2b2d33;
  --records-raised:#2b2d33;
  --records-media:#23242a;
  --records-media-deep:#282a30;
  --records-control-hover:#2f3138;
  --records-border:rgba(255,255,255,.10);
  --records-border-strong:rgba(255,255,255,.18);
  --records-text:#f4f4f5;
  --records-muted:#a8b0bd;
  --records-overlay:rgba(27,28,32,.88);
  --records-detail-overlay:rgba(27,28,32,.74);
  --records-shadow:rgba(12,13,16,.28);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll),
html.jn-theme-booting[data-theme="dark"] body.page-records :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll),
html[data-theme="dark"] body.page-records :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll){
  background:var(--records-bg);
  background-color:var(--records-bg);
  background-image:none;
  color:var(--records-text);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) #recordsLibraryPage :is(.records-shell,.records-toolbar,.records-footer,.records-empty),
html.jn-theme-booting[data-theme="dark"] body.page-records #recordsLibraryPage :is(.records-shell,.records-toolbar,.records-footer,.records-empty),
html[data-theme="dark"] body.page-records #recordsLibraryPage :is(.records-shell,.records-toolbar,.records-footer,.records-empty){
  background:var(--records-shell);
  background-color:var(--records-shell);
  background-image:none;
  border-color:var(--records-border);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) :is(.records-card,.records-card-body,.records-detail,.records-detail-side,.record-delete-confirm),
html.jn-theme-booting[data-theme="dark"] body.page-records :is(.records-card,.records-card-body,.records-detail,.records-detail-side,.record-delete-confirm),
html[data-theme="dark"] body.page-records :is(.records-card,.records-card-body,.records-detail,.records-detail-side,.record-delete-confirm){
  background:var(--records-surface);
  background-color:var(--records-surface);
  background-image:none;
  border-color:var(--records-border);
  color:var(--records-text);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) :is(.records-media,.records-media img,.records-media video),
html.jn-theme-booting[data-theme="dark"] body.page-records :is(.records-media,.records-media img,.records-media video),
html[data-theme="dark"] body.page-records :is(.records-media,.records-media img,.records-media video){
  background:var(--records-media);
  background-color:var(--records-media);
  background-image:none;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) :is(.records-detail-media,.records-detail-media img,.records-detail-media video),
html.jn-theme-booting[data-theme="dark"] body.page-records :is(.records-detail-media,.records-detail-media img,.records-detail-media video),
html[data-theme="dark"] body.page-records :is(.records-detail-media,.records-detail-media img,.records-detail-media video){
  background:var(--records-shell);
  background-color:var(--records-shell);
  background-image:none;
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) :is(.records-search,.records-filter-trigger,.records-page-nav a,.records-page-nav span,.records-detail-prompt,.records-detail-close),
html.jn-theme-booting[data-theme="dark"] body.page-records :is(.records-search,.records-filter-trigger,.records-page-nav a,.records-page-nav span,.records-detail-prompt,.records-detail-close),
html[data-theme="dark"] body.page-records :is(.records-search,.records-filter-trigger,.records-page-nav a,.records-page-nav span,.records-detail-prompt,.records-detail-close){
  background:var(--records-media-deep);
  background-color:var(--records-media-deep);
  background-image:none;
  border-color:var(--records-border);
}
html:not(.jn-light-mode) body.page-records:not(.jn-light-mode) :is(.records-filter-menu,.records-more-menu),
html.jn-theme-booting[data-theme="dark"] body.page-records :is(.records-filter-menu,.records-more-menu),
html[data-theme="dark"] body.page-records :is(.records-filter-menu,.records-more-menu){
  background:var(--records-surface-hover);
  background-color:var(--records-surface-hover);
  background-image:none;
  border-color:var(--records-border);
}
body.page-records #recordsLibraryPage .records-media:after{
  content:none;
  display:none;
  background:none;
}
body.page-records #recordsLibraryPage .records-media > video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
body.page-records #recordsLibraryPage .records-grid[data-media-stage="loading"] .records-media > :is(img,video,.records-audio-preview){
  visibility:hidden;
}
body.page-records #recordsLibraryPage .records-play{
  background:transparent;
  background-image:none;
  border:0;
  color:rgba(255,255,255,.96);
  box-shadow:none;
  filter:drop-shadow(0 2px 5px rgba(12,13,16,.72));
}
body.page-records #recordsLibraryPage :is(.records-check,.records-type-badge,.records-hover-actions button){
  background:var(--records-overlay);
  background-color:var(--records-overlay);
  background-image:none;
  border-color:rgba(255,255,255,.16);
  color:var(--records-text);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
body.page-records #recordsLibraryPage :is(.records-card-head strong,.records-prompt){color:#f2f2f2;}
body.page-records #recordsLibraryPage :is(.records-time,.records-meta){color:#858585;}
body.page-records .records-detail-row span{color:#858585;}
body.page-records .records-detail-row strong{color:#e7e7ea;}

html.jn-theme-booting[data-theme="light"] body.page-records,
html[data-theme="light"] body.page-records,
html.jn-light-mode body.page-records,
body.page-records.jn-light-mode{
  --records-bg:#f5f7fb;
  --records-shell:#fff;
  --records-surface:#fff;
  --records-surface-hover:#fff;
  --records-raised:#fff;
  --records-media:#e8edf3;
  --records-media-deep:#fff;
  --records-control-hover:#f1f5f9;
  --records-border:rgba(15,23,42,.10);
  --records-border-strong:rgba(15,23,42,.12);
  --records-text:#0f172a;
  --records-muted:#64748b;
  --records-detail-overlay:rgba(226,232,240,.62);
  --records-shadow:rgba(15,23,42,.14);
  background:#f5f7fb;
  background-color:#f5f7fb;
  background-image:none;
  color:#0f172a;
  color-scheme:light;
}
html.jn-theme-booting[data-theme="light"] body.page-records :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll),
html[data-theme="light"] body.page-records :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll),
html.jn-light-mode body.page-records :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll),
body.page-records.jn-light-mode :is(.main-area,.content,.content-area,#recordsLibraryPage,.records-library,.records-scroll){
  background:#f5f7fb;
  background-color:#f5f7fb;
  background-image:none;
  color:#0f172a;
}
html.jn-theme-booting[data-theme="light"] body.page-records :is(.records-shell,.records-toolbar,.records-footer,.records-card,.records-card-body,.records-filter-trigger,.records-search,.records-filter-menu,.records-empty,.records-detail,.records-detail-side,.records-detail-prompt,.record-delete-confirm),
html[data-theme="light"] body.page-records :is(.records-shell,.records-toolbar,.records-footer,.records-card,.records-card-body,.records-filter-trigger,.records-search,.records-filter-menu,.records-empty,.records-detail,.records-detail-side,.records-detail-prompt,.record-delete-confirm),
html.jn-light-mode body.page-records :is(.records-shell,.records-toolbar,.records-footer,.records-card,.records-card-body,.records-filter-trigger,.records-search,.records-filter-menu,.records-empty,.records-detail,.records-detail-side,.records-detail-prompt,.record-delete-confirm),
body.page-records.jn-light-mode :is(.records-shell,.records-toolbar,.records-footer,.records-card,.records-card-body,.records-filter-trigger,.records-search,.records-filter-menu,.records-empty,.records-detail,.records-detail-side,.records-detail-prompt,.record-delete-confirm){
  background:#fff;
  background-color:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
}
html.jn-theme-booting[data-theme="light"] body.page-records :is(.records-media,.records-media img,.records-media video,.records-detail-media,.records-detail-media img,.records-detail-media video),
html[data-theme="light"] body.page-records :is(.records-media,.records-media img,.records-media video,.records-detail-media,.records-detail-media img,.records-detail-media video),
html.jn-light-mode body.page-records :is(.records-media,.records-media img,.records-media video,.records-detail-media,.records-detail-media img,.records-detail-media video),
body.page-records.jn-light-mode :is(.records-media,.records-media img,.records-media video,.records-detail-media,.records-detail-media img,.records-detail-media video){
  background:#e8edf3;
  background-color:#e8edf3;
  background-image:none;
}
html.jn-theme-booting[data-theme="light"] body.page-records #recordsLibraryPage :is(.records-check,.records-type-badge,.records-hover-actions button),
html[data-theme="light"] body.page-records #recordsLibraryPage :is(.records-check,.records-type-badge,.records-hover-actions button),
html.jn-light-mode body.page-records #recordsLibraryPage :is(.records-check,.records-type-badge,.records-hover-actions button),
body.page-records.jn-light-mode #recordsLibraryPage :is(.records-check,.records-type-badge,.records-hover-actions button){
  background:rgba(255,255,255,.88);
  background-color:rgba(255,255,255,.88);
  border-color:rgba(15,23,42,.14);
  color:#0f172a;
  box-shadow:0 8px 22px rgba(15,23,42,.12);
}
html.jn-theme-booting[data-theme="light"] body.page-records #recordsLibraryPage :is(.records-card-head strong,.records-prompt),
html[data-theme="light"] body.page-records #recordsLibraryPage :is(.records-card-head strong,.records-prompt),
html.jn-light-mode body.page-records #recordsLibraryPage :is(.records-card-head strong,.records-prompt),
body.page-records.jn-light-mode #recordsLibraryPage :is(.records-card-head strong,.records-prompt){color:#0f172a;}
html.jn-theme-booting[data-theme="light"] body.page-records #recordsLibraryPage :is(.records-time,.records-meta),
html[data-theme="light"] body.page-records #recordsLibraryPage :is(.records-time,.records-meta),
html.jn-light-mode body.page-records #recordsLibraryPage :is(.records-time,.records-meta),
body.page-records.jn-light-mode #recordsLibraryPage :is(.records-time,.records-meta),
html.jn-theme-booting[data-theme="light"] body.page-records .records-detail-row span,
html[data-theme="light"] body.page-records .records-detail-row span,
html.jn-light-mode body.page-records .records-detail-row span,
body.page-records.jn-light-mode .records-detail-row span{color:#64748b;}
html.jn-theme-booting[data-theme="light"] body.page-records .records-detail-row strong,
html[data-theme="light"] body.page-records .records-detail-row strong,
html.jn-light-mode body.page-records .records-detail-row strong,
body.page-records.jn-light-mode .records-detail-row strong{color:#0f172a;}

/* Records narrow-screen source parity owned by the records module. */
@media(max-width:860px){
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #mainArea,
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    background:#f7f8fb;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    grid-template-rows:72px minmax(0,1fr);
    gap:0;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-shell{
    color:#0f172a;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-shell{
    color:#d4d4d8;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media,
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media > :is(img,video){
    color:#0f172a;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media,
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media > :is(img,video){
    color:#f4f4f5;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-check > input[type=checkbox]{
    background:#f8fafc;
  }
  html body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media > :is(img,video){
    width:100%;
    height:100%;
    min-height:auto;
    max-height:none;
  }
}

/* Records desktop source parity owned by the records module. */
/* Authoritative source desktop records computed-style parity. */
body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage input[type=hidden]{
  width:auto;
  inline-size:auto;
  border:0;
}
body.page-records.front-creative-page:not(.page-admin) .records-detail-layer input[type=hidden]{
  width:auto;
  inline-size:auto;
  height:auto;
  padding:0;
  border-width:medium;
  border-style:none;
  box-shadow:none;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-footer{
  color:#d4d4d8;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage input[type=hidden],
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .records-detail-layer input[type=hidden]{
  border-color:rgba(255,255,255,.2);
}
html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage input[type=hidden],
html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .records-detail-layer input[type=hidden]{
  border-color:rgba(15,23,42,.12);
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .records-detail-layer .records-detail-share{
  border-color:#2563eb;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-status.failed{
  color:#fb7185;
  -webkit-text-fill-color:#fb7185;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-info strong{
  color:#ffb74d;
}
html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-info strong{
  color:#0f172a;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-delete:disabled{
  border-color:#2563eb;
  background:linear-gradient(135deg,#2563eb,#06b6d4);
  background-color:#2563eb;
  color:#fff;
  box-shadow:0 12px 26px rgba(37,99,235,.24);
  cursor:not-allowed;
  filter:grayscale(.35);
}
html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-delete:disabled{
  border-color:#2563eb;
  background:#2563eb;
  color:#fff;
  box-shadow:0 8px 22px rgba(37,99,235,.2);
  cursor:not-allowed;
  filter:grayscale(.35);
}
@media(min-width:861px){
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #mainArea,
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    background:#f7f8fb;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    grid-template-rows:72px minmax(0,1fr);
    gap:0;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-check > input[type=checkbox]{
    background:#f8fafc;
  }
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media,
  html:is(.jn-light-mode,[data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media > :is(img,video){
    color:#0f172a;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media,
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-media > :is(img,video){
    color:#f4f4f5;
  }
  body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-info{
    min-width:92px;
    justify-content:center;
  }
  body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-info strong{
    font-size:16px;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-dock{
    color:#d4d4d8;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-delete:not(:disabled){
    border-color:#2563eb;
    background:linear-gradient(135deg,#2563eb,#06b6d4);
    color:#fff;
    box-shadow:0 12px 26px rgba(37,99,235,.24);
  }
  body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .front-work-card.is-selected{
    box-shadow:0 0 0 2px rgba(250,204,21,.14);
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-modal.records-detail{
    box-shadow:0 30px 80px rgba(12,13,16,.38);
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-head.records-detail-head{
    gap:12px;
    border-bottom-color:rgba(255,255,255,.09);
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .front-work-detail-close.records-detail-close{
    color:#d4d4d8;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-prompt.records-detail-prompt{
    max-height:150px;
    padding:12px;
    font-size:13px;
    line-height:1.6;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-list.records-detail-list{
    gap:7px;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-row.records-detail-row{
    font-size:12.5px;
    line-height:1.45;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .front-work-detail-row.records-detail-row{
    color:#d4d4d8;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-actions.records-detail-actions{
    border-top-color:rgba(255,255,255,.09);
  }
}

/* Authoritative source narrow records computed-style parity. */
@media(max-width:860px){
  body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-info{
    min-width:92px;
    justify-content:center;
    font-size:11px;
  }
  body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-info strong{
    font-size:14px;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-dock{
    color:#d4d4d8;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-bulk-delete:not(:disabled){
    border-color:#2563eb;
    background:linear-gradient(135deg,#2563eb,#06b6d4);
    color:#fff;
    box-shadow:0 12px 26px rgba(37,99,235,.24);
  }
  body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .front-work-card.is-selected{
    box-shadow:0 0 0 2px rgba(250,204,21,.14);
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-modal.records-detail{
    box-shadow:0 30px 80px rgba(12,13,16,.38);
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-media.records-detail-media > :is(img,video){
    height:100%;
    max-height:210px;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-head.records-detail-head{
    gap:12px;
    border-bottom-color:rgba(255,255,255,.09);
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-head.records-detail-head strong{
    font-size:15px;
    line-height:1.25;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .front-work-detail-close.records-detail-close{
    color:#d4d4d8;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-prompt.records-detail-prompt{
    max-height:82px;
    border-radius:14px;
    padding:12px;
    font-size:12.5px;
    line-height:1.6;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-list.records-detail-list{
    gap:7px;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-row.records-detail-row{
    grid-template-columns:64px minmax(0,1fr);
    font-size:11.5px;
    line-height:1.45;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) .front-work-detail-row.records-detail-row{
    color:#d4d4d8;
  }
  body.page-records.front-creative-page:not(.page-admin) .front-work-detail-actions.records-detail-actions{
    border-top-color:rgba(255,255,255,.09);
  }
}

@media(min-width:861px){
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #mainArea,
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    color:#f2f2f2;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    gap:0;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage .records-shell{
    color:#d4d4d8;
  }
}
@media(max-width:860px){
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #mainArea,
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    color:#f2f2f2;
  }
  html:not(.jn-light-mode):not([data-theme=light]) body.page-records.front-creative-page:not(.page-admin) #recordsLibraryPage{
    grid-template-rows:72px minmax(0,1fr);
    gap:0;
  }
}


/* Each records-library asset owns its loading state; an unloaded video never exposes the native black surface. */
@keyframes lz-records-media-pulse {
  0%,100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
body.page-records #recordsLibraryPage .records-media.is-media-loading,
body.page-records :is(.front-work-detail-media,.records-detail-media).is-media-loading {
  background: linear-gradient(115deg, #20242b 18%, #303640 36%, #20242b 54%);
  background-size: 220% 100%;
  animation: lz-records-media-pulse 1.35s ease-in-out infinite;
}
body.page-records #recordsLibraryPage .records-media.is-media-loading > :is(img,video,.records-audio-preview),
body.page-records :is(.front-work-detail-media,.records-detail-media).is-media-loading > :is(img,video,.records-detail-audio),
body.page-records #recordsLibraryPage .records-media.is-media-error > :is(img,video,.records-audio-preview),
body.page-records :is(.front-work-detail-media,.records-detail-media).is-media-error > :is(img,video,.records-detail-audio) {
  opacity: 0 !important;
  visibility: hidden !important;
}
body.page-records #recordsLibraryPage .records-media.is-media-ready > :is(img,video,.records-audio-preview),
body.page-records #recordsLibraryPage .records-grid[data-media-stage="loading"] .records-media.is-media-ready > :is(img,video,.records-audio-preview),
body.page-records :is(.front-work-detail-media,.records-detail-media).is-media-ready > :is(img,video,.records-detail-audio) {
  opacity: 1 !important;
  visibility: visible !important;
  transition: opacity .18s ease;
}
body.page-records #recordsLibraryPage .records-media:not(.is-media-ready) > .records-play {
  opacity: 0 !important;
  visibility: hidden !important;
}
body.page-records #recordsLibraryPage .records-media.is-media-ready > .records-play {
  opacity: 1;
  visibility: visible;
}
html:is(.jn-light-mode,[data-theme="light"]) body.page-records #recordsLibraryPage .records-media.is-media-loading,
html:is(.jn-light-mode,[data-theme="light"]) body.page-records :is(.front-work-detail-media,.records-detail-media).is-media-loading {
  background: linear-gradient(115deg, #e8edf3 18%, #f7f9fc 36%, #e8edf3 54%);
  background-size: 220% 100%;
}
@media (prefers-reduced-motion: reduce) {
  body.page-records #recordsLibraryPage .records-media.is-media-loading,
  body.page-records :is(.front-work-detail-media,.records-detail-media).is-media-loading { animation: none; }
}

html {
  line-height: normal;
  text-rendering: optimizeLegibility;
}

html:not(.jn-light-mode):not([data-theme=light]) {
  background: #1b1c20;
  color: #e5e7eb;
  border-color: #e5e7eb;
}

html.jn-light-mode,
html.jn-light-mode body.front-creative-page,
html[data-theme=light],
html[data-theme=light] body.front-creative-page {
  background: #f7f8fb;
}

html.jn-light-mode body.front-creative-page:not(.page-admin) .front-creative-menu,
html[data-theme=light] body.front-creative-page:not(.page-admin) .front-creative-menu,
body.front-creative-page.jn-light-mode:not(.page-admin) .front-creative-menu,
body.front-creative-page[data-theme=light]:not(.page-admin) .front-creative-menu {
  background: #fff;
  border-right-color: rgba(15,23,42,.12);
}

html,
body,
body.front-creative-page {
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

body.front-creative-page {
  font-size: 16px;
  line-height: normal;
}

body.front-creative-page [data-front-app-public-root] {
  display: contents;
}

body.front-creative-page .front-creative-avatar.has-avatar-frame {
  position: relative;
  overflow: visible;
  isolation: isolate;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}

body.front-creative-page .front-creative-avatar.has-avatar-frame > .front-creative-avatar-frame {
  position: absolute;
  inset: -6px;
  z-index: 2;
  width: calc(100% + 12px);
  height: calc(100% + 12px);
  display: block;
  max-width: none;
  pointer-events: none;
  object-fit: contain;
  border-radius: 0;
  filter: drop-shadow(0 6px 10px rgba(65,96,255,.22));
  backface-visibility: hidden;
}



















body.page-app.front-creative-page .ai-draw-conversation {
  position: absolute;
  inset: 0;
  overflow: hidden auto;
  padding: 56px 24px 232px;
  background: var(--front-video-chat-bg,#1b1c20);
  scrollbar-width: auto;
}

body.page-app.front-creative-page .ai-draw-conversation::-webkit-scrollbar {
  width: 8px;
}

body.page-app.front-creative-page .ai-draw-conversation::-webkit-scrollbar-thumb {
  background: #222;
  border-radius: 999px;
}

body.page-app.front-creative-page .app-layout {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-height: 100dvh;
  display: block;
  overflow: hidden;
  background: var(--front-video-chat-bg);
}

body.page-app.front-creative-page #mainArea.main-area {
  width: calc(100% - var(--front-menu-offset,0px));
  max-width: calc(100% - var(--front-menu-offset,0px));
  min-width: 0;
  min-height: 100dvh;
  margin-left: var(--front-menu-offset,0px);
  padding: 0;
  overflow: hidden;
  background: var(--front-video-chat-bg);
}

body.page-app.front-creative-page #mainArea .ai-draw-page {
  position: relative;
  width: 100%;
  height: 100dvh;
  min-height: 100dvh;
  overflow: hidden;
  background: var(--front-video-chat-bg,#1b1c20);
}

html body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-composer {
  position: fixed;
  left: var(--front-menu-offset,0px);
  right: 0;
  bottom: var(--front-composer-keyboard-offset,0px);
  width: calc(100vw - var(--front-menu-offset,0px));
  max-width: calc(100vw - var(--front-menu-offset,0px));
  height: var(--lz-creative-composer-shell-height);
  min-height: var(--lz-creative-composer-shell-height);
  max-height: var(--lz-creative-composer-shell-height);
  margin: 0;
  padding: 0 clamp(18px,3vw,38px) max(14px,env(safe-area-inset-bottom,0px));
  display: flex;
  gap: 0;
  align-items: flex-end;
  justify-content: center;
  overflow: visible;
  pointer-events: none;
  transform: none;
  z-index: 70;
  background: transparent;
  border: 0;
  box-shadow: none;
  box-sizing: border-box;
}

html body.page-app.front-creative-page #mainArea .ai-draw-page .front-video-composer-frame {
  max-height: 208px;
  margin: 0 auto;
  gap: 8px;
  flex-shrink: 0;
  pointer-events: auto;
}

body.page-app .ai-draw-floating-tools > *,
body.page-app .ai-draw-composer button,
body.page-app .ai-draw-composer textarea,
body.page-app .ai-draw-composer input,
body.page-app .ai-draw-composer select,
body.page-app .ai-draw-composer .ai-draw-select {
  pointer-events: auto;
}

html.jn-light-mode body.page-app.front-creative-page #mainArea .ai-draw-page .front-video-composer-frame,
html[data-theme="light"] body.page-app.front-creative-page #mainArea .ai-draw-page .front-video-composer-frame,
body.page-app.front-creative-page.jn-light-mode #mainArea .ai-draw-page .front-video-composer-frame {
  box-shadow: 0 14px 34px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.42);
}

html body.page-app.front-creative-page #mainArea .ai-draw-page .ai-video-prompt-panel {
  max-width: 100%;
}

html body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-inner-controls {
  scrollbar-width: none;
}

html body.page-app.front-creative-page #mainArea .ai-draw-page .ai-draw-stream {
  justify-content: flex-start;
  background: var(--front-video-chat-bg,#1b1c20);
}

html body.page-app.front-creative-page .ai-draw-page .ai-draw-result-prompt .ai-draw-user-prompt {
  max-width: 100%;
  color: #e8e8eb;
  -webkit-text-fill-color: #e8e8eb;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .ai-draw-page .ai-draw-result-prompt .ai-draw-user-prompt,
body.page-app.front-creative-page.jn-light-mode .ai-draw-page .ai-draw-result-prompt .ai-draw-user-prompt,
body.page-app.front-creative-page[data-theme=light] .ai-draw-page .ai-draw-result-prompt .ai-draw-user-prompt {
  color: #303034;
  -webkit-text-fill-color: #303034;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .front-creative-nav-label,
:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page [data-front-balance],
:is(html.jn-light-mode,html[data-theme=light]) body.front-creative-page .front-creative-account .front-creative-recharge-copy strong {
  color: #64748b;
  -webkit-text-fill-color: #64748b;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page [data-front-balance-label] {
  font-weight: 700;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .front-creative-recharge {
  font-weight: 900;
  line-height: 16px;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .ai-draw-success-time {
  color: #77777e;
  -webkit-text-fill-color: #77777e;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .front-param-trigger {
  color: #475569;
  background: #f8fafc;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .front-param-value {
  color: #475569;
  -webkit-text-fill-color: #475569;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page .front-chat-input {
  font-size: 15px;
  line-height: 24.3px;
}

:is(html.jn-light-mode,html[data-theme=light]) body.page-app.front-creative-page [data-image-cost] {
  color: #92400e;
  fill: #92400e;
}

html body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-recharge-icon,
body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-recharge-icon {
  color: inherit;
  -webkit-text-fill-color: currentcolor;
}

html body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-recharge-badge,
body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-recharge-badge {
  color: #fff4d2;
  -webkit-text-fill-color: #fff4d2;
}

html body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-profile-balance > b > span,
body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-profile-balance > b > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

html body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-profile-balance em,
body.front-creative-page:not(.page-admin) .front-creative-account .front-creative-profile-balance em {
  flex: 0 0 auto;
  color: var(--front-menu-muted);
  -webkit-text-fill-color: var(--front-menu-muted);
  font-size: 9px;
  font-style: normal;
  font-weight: 700;
}

body.page-video .main-area,
body.page-records .main-area,
body.page-gallery .main-area,
body.page-video .ai-video-page,
body.page-video .ai-video-stage,
body.page-records .records-page,
body.page-gallery .gallery-page {
  border-bottom: 0;
  box-shadow: none;
}

body.page-video .main-area::before,
body.page-video .main-area::after,
body.page-records .main-area::before,
body.page-records .main-area::after,
body.page-gallery .main-area::before,
body.page-gallery .main-area::after,
body.page-records .records-page::before,
body.page-records .records-page::after,
body.page-gallery .gallery-page::before,
body.page-gallery .gallery-page::after {
  border: 0;
  box-shadow: none;
}

body.page-records .records-status.succeeded {
  color: #bfdbfe;
  -webkit-text-fill-color: #bfdbfe;
}

body.page-records .records-status.failed {
  color: #fca5a5;
  -webkit-text-fill-color: #fca5a5;
}

body.page-records .records-status.queued,
body.page-records .records-status.running {
  color: #93c5fd;
  -webkit-text-fill-color: #93c5fd;
}

html.jn-light-mode body.page-records .records-status.succeeded,
html[data-theme="light"] body.page-records .records-status.succeeded,
body.page-records.jn-light-mode .records-status.succeeded {
  color: #1d4ed8;
  -webkit-text-fill-color: #1d4ed8;
}

html.jn-light-mode body.page-records .records-status.failed,
html[data-theme="light"] body.page-records .records-status.failed,
body.page-records.jn-light-mode .records-status.failed {
  color: #b91c1c;
  -webkit-text-fill-color: #b91c1c;
}

html.jn-light-mode body.page-records .records-status.queued,
html.jn-light-mode body.page-records .records-status.running,
html[data-theme="light"] body.page-records .records-status.queued,
html[data-theme="light"] body.page-records .records-status.running,
body.page-records.jn-light-mode .records-status.queued,
body.page-records.jn-light-mode .records-status.running {
  color: #2563eb;
  -webkit-text-fill-color: #2563eb;
}

/* The public surface contract also targets .ai-draw-empty. The image workspace
   owns this container and keeps only the inner guide card surfaced. */
html body.page-app.front-creative-page:not(.page-admin)
#mainArea .ai-draw-page .ai-draw-empty {
    background: transparent;
    background-image: none;
}
/* Keep the image result loader above the fixed composer and match the workspace surface. */
html body.page-app.front-creative-page:not(.page-admin)
#mainArea .ai-draw-page
.ai-draw-conversation[data-front-creative-loader-surface]
> [data-front-creative-page-loader] {
    inset: 0 0 var(--lz-creative-composer-shell-height) 0;
    background: var(--front-video-chat-bg);
    background-image: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

@media (max-width: 860px) {
    html body.page-app.front-creative-page:not(.page-admin)
    #mainArea .ai-draw-page
    .ai-draw-conversation[data-front-creative-loader-surface]
    > [data-front-creative-page-loader] {
        inset: 0 0 calc(var(--lz-creative-mobile-composer-shell-height) + var(--lz-safe-bottom)) 0;
    }
}
.ai-draw-page.is-initializing .ai-draw-conversation *,
.ai-draw-page.is-initializing .ai-draw-stream *,
.ai-draw-stream.is-initializing-results *,
.ai-draw-page.is-initializing [data-front-creative-composer="image"] [data-draw-select],
.ai-draw-page.is-initializing [data-front-creative-composer="image"] [data-draw-select] *{
    animation:none;
    transition:none;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
    width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
    max-width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
    min-width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
    flex-basis:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .ai-draw-inner-controls{
    position:absolute;
    left:22px;
    right:76px;
    bottom:18px;
    width:auto;
    max-width:none;
    min-width:0;
    height:34px;
    min-height:34px;
    max-height:34px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    overflow:visible;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .ai-draw-selects{
    width:100%;
    max-width:100%;
    min-width:0;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:6px;
    overflow-x:auto;
    overflow-y:hidden;
}
html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select{
    --draw-param-bg:var(--front-param-control-bg);
    --draw-param-bg-hover:var(--front-param-control-bg);
    --draw-param-line:var(--front-param-control-border);
    --draw-param-text:var(--front-param-control-text);
    --draw-param-muted:var(--front-param-control-muted);
    --front-param-width:auto;
    position:relative;
    flex:0 0 auto;
    width:max-content;
    min-width:max-content;
    max-width:min(236px,calc(100vw - 44px));
    height:34px;
    min-height:34px;
    max-height:34px;
    margin:0;
    padding:0;
    background:transparent;
    background-image:none;
    border:0;
    box-shadow:none;
    color:var(--draw-param-text);
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select:not(.ai-draw-model-select){
    max-width:none;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
    position:relative;
    inset:auto;
    box-sizing:border-box;
    width:max-content;
    min-width:max-content;
    max-width:100%;
    height:34px;
    min-height:34px;
    max-height:34px;
    margin:0;
    padding:0 12px;
    display:inline-flex;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    border:1px solid var(--draw-param-line);
    border-radius:12px;
    background:var(--draw-param-bg);
    background-image:none;
    color:var(--draw-param-text);
    -webkit-text-fill-color:var(--draw-param-text);
    box-shadow:none;
    filter:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    font:12px/1 inherit;
    font-weight:900;
    white-space:nowrap;
    overflow:hidden;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-model-select.ai-draw-model-select>.front-param-trigger.ai-param-trigger{
    width:max-content;
    min-width:0;
    max-width:min(236px,calc(100vw - 44px));
    padding:0 24px 0 14px;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] div.front-model-select.ai-video-control.ai-draw-model-select{
    background:transparent;
    background-color:transparent;
    background-image:none;
    border-color:transparent;
    box-shadow:none;
    filter:none;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] div.front-model-select.ai-video-control.ai-draw-model-select::before,
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] div.front-model-select.ai-video-control.ai-draw-model-select::after{
    content:none;
    display:none;
    background:transparent;
    border:0;
    box-shadow:none;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger [data-select-value]{
    width:auto;
    min-width:0;
    max-width:174px;
    color:inherit;
    -webkit-text-fill-color:inherit;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select:not(.ai-draw-model-select) .front-param-trigger.ai-param-trigger [data-select-value]{
    max-width:none;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger svg{
    width:14px;
    height:14px;
    flex:0 0 14px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    color:var(--draw-param-muted);
}
body.page-app.front-creative-page [data-front-creative-composer="image"] [data-param="size"] .front-param-trigger.ai-param-trigger svg,
body.page-app.front-creative-page [data-front-creative-composer="image"] [data-param="quality"] .front-param-trigger.ai-param-trigger svg{
    width:15px;
    height:15px;
    flex-basis:15px;
    stroke-width:1.85;
    stroke-linecap:round;
    stroke-linejoin:round;
    color:var(--draw-param-text);
    opacity:.78;
}
@media(max-width:860px){
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"].ai-draw-composer{
        padding:0 10px 10px;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
        width:100%;
        max-width:100%;
        min-width:0;
        flex-basis:auto;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .ai-draw-inner-controls{
        left:12px;
        right:72px;
        bottom:16px;
    }
    body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select,
    body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
        min-width:max-content;
        height:30px;
        min-height:30px;
        max-height:30px;
    }
    body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
        padding:0 9px;
        gap:5px;
        border-radius:10px;
        font-size:13px;
        font-weight:800;
    }
    body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger svg{
        width:13px;
        height:13px;
        flex-basis:13px;
    }
    body.page-app.front-creative-page [data-front-creative-composer="image"] .ai-draw-model-select,
    body.page-app.front-creative-page [data-front-creative-composer="image"] .ai-draw-model-select>.front-param-trigger.ai-param-trigger{
        width:max-content;
        min-width:max-content;
        max-width:min(168px,calc(100vw - 44px));
    }
    html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-model-select.ai-draw-model-select>.front-param-trigger.ai-param-trigger{
        padding:0 20px 0 10px;
    }
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-result-image{
    background-clip:padding-box;
}
@media(max-width:860px){
    html body.page-app.front-creative-page.has-front-creative-menu:not(.page-admin) #mainArea .ai-draw-page .ai-draw-message-block:not(.is-batch-item)>.ai-draw-result-card>.ai-draw-result-image[data-image-frame]{
        background-clip:padding-box;
    }
}
@media(min-width:861px){
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page{
        grid-template-rows:54px minmax(0,1fr) 236px;
        gap:0;
        row-gap:0;
        column-gap:0;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-message-block{
        flex-direction:column;
        min-height:0;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-result-card{
        align-content:normal;
        flex-direction:column;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-result-image{
        background-color:var(--front-video-chat-bg);
        cursor:zoom-in;
        flex:0 0 auto;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-result-image>img{
        position:relative;
        inset:0;
        align-items:center;
        justify-items:center;
        cursor:zoom-in;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-result-actions{
        flex:0 0 auto;
        z-index:2;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-success-time{
        left:0;
        bottom:6px;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer=image].ai-draw-composer{
        align-content:start;
        justify-items:center;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer=image] .ai-draw-selects{
        flex:1 1 auto;
    }
    html body.page-app.front-creative-page:not(.page-admin) #mainArea [data-front-creative-composer=image] .front-creative-send.is-empty{
        cursor:pointer;
    }
    html[data-theme=light] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-success-time,
    html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-success-time{
        color:#77777e;
    }
    html[data-theme=light] body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-message-block:not(.is-batch-item) .ai-draw-user-prompt,
    html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-message-block:not(.is-batch-item) .ai-draw-user-prompt{
        color:#28282d;
    }
}

/* Extracted completely through paged browser CSSOM from old /assets/app.css; source order preserved. */
.jn-message-layer { position: fixed; inset: 0px; z-index: 100320; display: grid; place-items: center; padding: 18px; background: rgba(2, 6, 23, 0.68); backdrop-filter: blur(14px); }

.jn-message-modal { width: min(560px, -32px + 100vw); max-height: calc(-32px + 100dvh); overflow: hidden; display: flex; flex-direction: column; border: 1px solid rgba(148, 163, 184, 0.24); border-radius: 18px; background: rgb(5, 8, 22); color: rgb(248, 250, 252); box-shadow: rgba(0, 0, 0, 0.45) 0px 28px 90px; }

.jn-message-modal header:not(.jn-message-head) { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; padding: 18px; border-bottom: 1px solid rgba(148, 163, 184, 0.16); }

.jn-message-modal h2 { margin: 0px; font-size: 20px; color: rgb(255, 255, 255); }

.jn-message-modal p { margin: 5px 0px 0px; color: rgb(148, 163, 184); font-size: 12px; line-height: 1.5; }

.jn-message-modal header button { width: 34px; height: 34px; border: 1px solid rgba(148, 163, 184, 0.22); border-radius: 10px; background: rgba(15, 23, 42, 0.72); color: rgb(203, 213, 225); font-size: 22px; line-height: 1; cursor: pointer; }

.jn-message-list { padding: 14px; overflow: auto; display: grid; gap: 10px; }

.jn-message-item { position: relative; border: 1px solid rgba(148, 163, 184, 0.18); border-radius: 14px; background: rgba(15, 23, 42, 0.58); padding: 12px; }

.jn-message-item.is-unread { border-color: rgba(34, 211, 238, 0.36); box-shadow: rgb(34, 211, 238) 3px 0px 0px inset; }

.jn-message-item span { display: inline-flex; height: 22px; align-items: center; padding: 0px 8px; border-radius: 999px; background: rgba(34, 211, 238, 0.12); color: rgb(103, 232, 249); font-size: 11px; font-weight: 900; }

.jn-message-item strong { display: block; margin-top: 8px; color: rgb(255, 255, 255); font-size: 14px; }

.jn-message-item p { margin: 5px 0px 8px; color: rgb(203, 213, 225); font-size: 12px; line-height: 1.55; }

.jn-message-item time { color: rgb(100, 116, 139); font-size: 11px; }

.jn-message-empty { padding: 30px; border: 1px dashed rgba(148, 163, 184, 0.24); border-radius: 14px; color: rgb(148, 163, 184); text-align: center; }

.jn-message-modal footer { padding: 12px 14px; border-top: 1px solid rgba(148, 163, 184, 0.16); display: flex; justify-content: flex-end; }

.jn-message-modal footer button { height: 36px; border: 0px; border-radius: 11px; background: linear-gradient(135deg, rgb(34, 211, 238), rgb(34, 197, 94)); color: rgb(2, 16, 28); font-weight: 900; padding: 0px 14px; cursor: pointer; }

.jn-light-mode .main-area, .jn-light-mode .content, .jn-light-mode .card, .jn-light-mode .workspace-card, .jn-light-mode .media-card, .jn-light-mode .jn-resource-modal, .jn-light-mode .jn-profile-modal, .jn-light-mode .jn-shop-modal, .jn-light-mode .jn-message-modal { background: rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); }

.jn-light-mode .sidebar-brand-text h1, .jn-light-mode .sidebar-user-info strong, .jn-light-mode .jn-resource-head h2, .jn-light-mode .jn-profile-title h2, .jn-light-mode .jn-message-modal h2, .jn-light-mode .jn-resource-row strong, .jn-light-mode .jn-stat-card strong { color: rgb(15, 23, 42); }

.jn-light-mode .sidebar-brand-text small, .jn-light-mode .sidebar-user-info span, .jn-light-mode .jn-resource-head p, .jn-light-mode .jn-profile-title p, .jn-light-mode .jn-message-modal p, .jn-light-mode .jn-resource-row span { color: rgb(100, 116, 139); }

.jn-light-mode .jn-stat-card,
.jn-light-mode .jn-message-item,
.jn-light-mode .jn-profile-secure { background: rgb(248, 250, 252); border-color: rgba(15, 23, 42, 0.1); }

.jn-light-mode .jn-message-item strong { color: rgb(15, 23, 42); }

.jn-light-mode .jn-message-item p { color: rgb(71, 85, 105); }

@media (max-width: 760px) {
.jn-message-layer { padding: 10px; place-items: end center; }

.jn-message-modal { width: min(360px, -20px + 100vw); max-height: calc(-20px + 100dvh); border-radius: 16px; }

.jn-message-modal header:not(.jn-message-head) { padding: 14px; }

.jn-message-list { padding: 11px; }
}

.jn-checkin-layer { position: fixed; inset: 0px; z-index: 100340; display: grid; place-items: center; padding: 18px; background: rgba(2, 6, 23, 0.72); backdrop-filter: blur(16px); }

.jn-checkin-modal { position: relative; width: min(430px, -28px + 100vw); max-height: calc(-28px + 100dvh); overflow: auto; padding: 18px; border: 1px solid rgba(251, 191, 36, 0.24); border-radius: 22px; background: radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.22), transparent 32%), radial-gradient(circle at 92% 10%, rgba(168, 85, 247, 0.14), transparent 30%), linear-gradient(rgba(17, 20, 29, 0.98), rgba(5, 8, 16, 0.98)); color: rgb(255, 247, 237); box-shadow: rgba(0, 0, 0, 0.58) 0px 34px 110px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset; }

.jn-checkin-modal::-webkit-scrollbar { width: 0px; height: 0px; }

.jn-checkin-close { position: absolute; right: 14px; top: 14px; width: 32px; height: 32px; border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 11px; background: rgba(15, 23, 42, 0.62); color: rgb(253, 230, 138); font-size: 22px; line-height: 1; cursor: pointer; }

.jn-checkin-head { display: flex; align-items: center; gap: 12px; padding-right: 38px; margin-bottom: 14px; }

.jn-checkin-icon { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(145deg, rgb(245, 158, 11), rgb(249, 115, 22)); color: rgb(31, 19, 4); font-size: 24px; font-weight: 900; box-shadow: rgba(245, 158, 11, 0.34) 0px 14px 34px, rgba(245, 158, 11, 0.1) 0px 0px 0px 6px; }

.jn-checkin-head h2 { margin: 0px; color: rgb(255, 255, 255); font-size: 23px; line-height: 1.18; letter-spacing: 0px; }

.jn-checkin-head p { margin: 5px 0px 0px; color: rgb(252, 217, 168); font-size: 12px; line-height: 1.35; }

.jn-checkin-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 11px; }

.jn-checkin-stats div { padding: 13px 12px; border: 1px solid rgba(251, 191, 36, 0.18); border-radius: 16px; background: linear-gradient(rgba(251, 191, 36, 0.12), rgba(15, 23, 42, 0.34)); }

.jn-checkin-stats strong { display: block; color: rgb(255, 255, 255); font-size: 24px; line-height: 1.1; }

.jn-checkin-stats span { display: block; margin-top: 5px; color: rgb(245, 201, 134); font-size: 12px; font-weight: 800; }

.jn-checkin-progress { padding: 11px; border: 1px solid rgba(251, 191, 36, 0.18); border-radius: 15px; background: rgba(251, 191, 36, 0.08); margin-bottom: 11px; }

.jn-checkin-progress div { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: rgb(253, 230, 138); font-size: 12px; font-weight: 900; }

.jn-checkin-progress em { font-style: normal; color: rgb(251, 191, 36); white-space: nowrap; }

.jn-checkin-progress i { display: block; height: 7px; margin-top: 9px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); overflow: hidden; }

.jn-checkin-progress b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgb(245, 158, 11), rgb(251, 113, 133)); box-shadow: rgba(245, 158, 11, 0.5) 0px 0px 18px; }

.jn-checkin-milestones { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 8px; margin-bottom: 12px; }

.jn-checkin-milestones div { min-height: 73px; padding: 9px 7px; text-align: center; border: 1px solid rgba(251, 191, 36, 0.18); border-radius: 14px; background: rgba(15, 23, 42, 0.46); }

.jn-checkin-milestones div.is-done { border-color: rgba(34, 197, 94, 0.4); background: rgba(34, 197, 94, 0.1); }

.jn-checkin-milestones b { display: grid; place-items: center; width: 26px; height: 26px; margin: 0px auto 5px; border-radius: 50%; background: rgba(251, 191, 36, 0.16); color: rgb(253, 230, 138); font-size: 13px; }

.jn-checkin-milestones span { display: block; color: rgb(255, 247, 237); font-size: 11px; font-weight: 900; line-height: 1.2; }

.jn-checkin-milestones em { display: block; margin-top: 4px; color: rgb(196, 181, 253); font-size: 11px; font-style: normal; font-weight: 900; }

.jn-checkin-primary { width: 100%; height: 48px; border: 0px; border-radius: 999px; background: linear-gradient(135deg, rgb(245, 158, 11), rgb(251, 146, 60) 54%, rgb(249, 115, 22)); color: rgb(31, 19, 4); font-size: 15px; font-weight: 1000; cursor: pointer; box-shadow: rgba(249, 115, 22, 0.34) 0px 18px 42px; }

.jn-checkin-primary:disabled { cursor: not-allowed; opacity: 0.62; background: linear-gradient(135deg, rgb(51, 65, 85), rgb(31, 41, 55)); color: rgb(203, 213, 225); box-shadow: none; }

.jn-checkin-tomorrow { margin: 9px 0px 0px; text-align: center; color: rgb(248, 210, 142); font-size: 12px; font-weight: 900; }

.jn-checkin-note { width: max-content; max-width: 100%; margin: 9px auto 12px; padding: 6px 10px; border-radius: 999px; background: rgba(245, 158, 11, 0.11); border: 1px solid rgba(245, 158, 11, 0.2); color: rgb(252, 217, 168); font-size: 11px; line-height: 1.35; }

.jn-checkin-calendar { border: 1px solid rgba(148, 163, 184, 0.16); border-radius: 17px; background: rgba(2, 6, 23, 0.38); padding: 12px; }

.jn-checkin-calendar-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 9px; }

.jn-checkin-calendar-head strong { color: rgb(255, 255, 255); font-size: 15px; }

.jn-checkin-calendar-head div { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; justify-content: flex-end; }

.jn-checkin-calendar-head span { position: relative; color: rgb(168, 179, 199); font-size: 10px; font-weight: 900; }

.jn-checkin-calendar-head span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 4px; border-radius: 50%; vertical-align: 1px; background: rgb(100, 116, 139); }

.jn-checkin-calendar-head .signed::before { background: rgb(34, 197, 94); }

.jn-checkin-calendar-head .today::before { background: rgb(245, 158, 11); }

.jn-checkin-calendar-head .milestone::before { background: rgb(167, 139, 250); }

.jn-checkin-weekdays, .jn-checkin-days { display: grid; grid-template-columns: repeat(7, minmax(0px, 1fr)); gap: 6px; }

.jn-checkin-weekdays { margin-bottom: 6px; }

.jn-checkin-weekdays span { height: 18px; display: grid; place-items: center; color: rgb(124, 135, 152); font-size: 10px; font-weight: 900; }

.jn-checkin-days span { position: relative; aspect-ratio: 1 / 1; min-width: 0px; display: grid; place-items: center; border: 1px solid rgba(148, 163, 184, 0.13); border-radius: 11px; background: rgba(15, 23, 42, 0.72); color: rgb(203, 213, 225); font-size: 12px; font-weight: 900; }

.jn-checkin-days span.is-blank { visibility: hidden; }

.jn-checkin-days span.is-signed { border-color: rgba(34, 197, 94, 0.42); background: linear-gradient(rgba(34, 197, 94, 0.24), rgba(22, 101, 52, 0.22)); color: rgb(220, 252, 231); }

.jn-checkin-days span.is-today { border-color: rgb(245, 158, 11); box-shadow: rgba(245, 158, 11, 0.16) 0px 0px 0px 2px inset; color: rgb(255, 247, 237); }

.jn-checkin-days span.is-milestone:not(.is-signed) { border-color: rgba(167, 139, 250, 0.4); background: rgba(88, 28, 135, 0.24); color: rgb(221, 214, 254); }

.jn-checkin-days i { position: absolute; right: 4px; top: 3px; color: rgb(134, 239, 172); font-size: 9px; font-style: normal; }

.jn-checkin-foot { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }

.jn-checkin-foot div { padding: 11px; border: 1px solid rgba(251, 191, 36, 0.15); border-radius: 14px; background: rgba(251, 191, 36, 0.07); }

.jn-checkin-foot span { display: block; color: rgb(246, 201, 133); font-size: 11px; font-weight: 900; }

.jn-checkin-foot strong { display: block; margin-top: 5px; color: rgb(255, 255, 255); font-size: 18px; line-height: 1.1; }

.jn-checkin-loading { min-height: 320px; display: grid; place-items: center; color: rgb(253, 230, 138); font-size: 14px; font-weight: 900; text-align: center; }

.jn-checkin-loading.is-error { color: rgb(254, 202, 202); }

@media (max-width: 760px) {
.jn-checkin-layer { padding: 10px; place-items: center; }

.jn-checkin-modal { width: min(380px, -20px + 100vw); max-height: calc(-20px + 100dvh); padding: 14px; border-radius: 19px; }

.jn-checkin-close { right: 11px; top: 11px; width: 30px; height: 30px; border-radius: 10px; }

.jn-checkin-head { gap: 10px; margin-bottom: 11px; padding-right: 34px; }

.jn-checkin-icon { width: 40px; height: 40px; font-size: 21px; }

.jn-checkin-head h2 { font-size: 20px; }

.jn-checkin-head p { font-size: 11px; }

.jn-checkin-stats { gap: 8px; margin-bottom: 9px; }

.jn-checkin-stats div { padding: 10px; border-radius: 14px; }

.jn-checkin-stats strong { font-size: 21px; }

.jn-checkin-stats span { font-size: 11px; }

.jn-checkin-progress { padding: 10px; margin-bottom: 9px; }

.jn-checkin-progress div { font-size: 11px; }

.jn-checkin-milestones { gap: 6px; margin-bottom: 10px; }

.jn-checkin-milestones div { min-height: 66px; padding: 8px 5px; border-radius: 12px; }

.jn-checkin-milestones b { width: 24px; height: 24px; font-size: 12px; }

.jn-checkin-milestones span, .jn-checkin-milestones em { font-size: 10px; }

.jn-checkin-primary { height: 44px; font-size: 14px; }

.jn-checkin-note { font-size: 10px; padding: 5px 8px; margin-bottom: 10px; }

.jn-checkin-calendar { padding: 10px; border-radius: 15px; }

.jn-checkin-calendar-head { display: grid; gap: 6px; }

.jn-checkin-calendar-head div { justify-content: flex-start; }

.jn-checkin-weekdays, .jn-checkin-days { gap: 4px; }

.jn-checkin-days span { border-radius: 9px; font-size: 11px; }

.jn-checkin-foot { gap: 8px; margin-top: 10px; }

.jn-checkin-foot div { padding: 9px; border-radius: 12px; }

.jn-checkin-foot strong { font-size: 16px; }
}

.jn-message-layer { position: fixed; inset: 0px; z-index: 100320; display: grid; place-items: center; padding: 22px; background: rgba(0, 0, 0, 0.82); backdrop-filter: blur(12px); }

.jn-message-modal { position: relative; width: min(840px, -36px + 100vw); min-height: min(800px, -44px + 100dvh); max-height: calc(-44px + 100dvh); overflow: hidden; display: flex; flex-direction: column; padding: 20px 22px 24px; border: 1px solid rgba(36, 45, 58, 0.95); border-radius: 22px; background: rgb(23, 24, 30); color: rgb(248, 250, 252); box-shadow: rgba(0, 0, 0, 0.55) 0px 34px 90px, rgba(255, 255, 255, 0.04) 0px 1px 0px inset; }

.jn-message-close { position: absolute; right: 18px; top: 14px; width: 36px; height: 36px; border: 0px; border-radius: 12px; background: rgb(52, 54, 61); color: rgb(209, 213, 219); font-size: 26px; line-height: 1; cursor: pointer; }

.jn-message-modal .jn-message-close { top: 18px; right: 18px; z-index: 5; display: grid; place-items: center; flex: 0 0 auto; }

.jn-message-close:hover { background: rgb(63, 66, 75); color: rgb(255, 255, 255); }

.jn-message-head { display: flex; align-items: center; justify-content: flex-start; gap: 14px; padding: 0px 58px 12px 0px; border: 0px; }

.jn-message-icon { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 15px; display: grid; place-items: center; background: linear-gradient(135deg, rgb(31, 46, 88), rgb(37, 59, 114)); box-shadow: none; }

.jn-message-icon span { width: 18px; height: 14px; display: block; border-radius: 4px; background: linear-gradient(135deg, rgb(99, 102, 241), rgb(6, 182, 212)); position: relative; }

.jn-message-icon span::before, .jn-message-icon span::after { content: ""; position: absolute; left: 4px; right: 4px; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, 0.62); }

.jn-message-icon span::before { top: 4px; }

.jn-message-icon span::after { top: 8px; width: 7px; right: auto; }

.jn-message-head h2 { margin: 0px; color: rgb(255, 255, 255); font-size: 23px; line-height: 1.12; font-weight: 1000; letter-spacing: 0px; }

.jn-message-head p { margin: 6px 0px 0px; color: rgb(165, 168, 177); font-size: 12px; line-height: 1.35; }

.jn-message-tools { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0px 16px; }

.jn-message-filter, .jn-message-read { border: 0px; cursor: pointer; font-weight: 900; white-space: nowrap; }

.jn-message-filter { height: 31px; min-width: 68px; padding: 0px 19px; border-radius: 999px; background: linear-gradient(135deg, rgb(79, 124, 255), rgb(6, 189, 215)); color: rgb(234, 246, 255); box-shadow: rgba(79, 124, 255, 0.2) 0px 0px 0px 3px, rgba(6, 189, 215, 0.18) 0px 8px 20px; }

.jn-message-read { height: 29px; padding: 0px 14px; border-radius: 999px; background: rgb(32, 38, 51); color: rgb(126, 135, 152); font-size: 12px; }

.jn-message-read:hover { color: rgb(219, 234, 254); background: rgb(38, 48, 68); }

.jn-message-list { flex: 1 1 auto; min-height: 0px; overflow: auto; display: grid; align-content: start; gap: 10px; padding: 0px; }

.jn-message-list::-webkit-scrollbar { width: 0px; height: 0px; }

.jn-message-item { position: relative; display: grid; grid-template-columns: minmax(0px, 1fr) auto; align-items: center; gap: 14px; min-height: 56px; padding: 10px 14px 10px 13px; border: 1px solid rgb(58, 60, 67); border-radius: 11px; background: rgb(39, 40, 46); box-shadow: none; cursor: pointer; transition: border-color 0.16s, background 0.16s, transform 0.16s; }

.jn-message-item:hover { border-color: rgb(75, 85, 101); background: rgb(43, 45, 52); transform: translateY(-1px); }

.jn-message-item.is-unread { border-color: rgb(71, 74, 84); box-shadow: rgba(6, 182, 212, 0.82) 3px 0px 0px inset; }

.jn-message-main { min-width: 0px; }

.jn-message-main strong { display: block; margin: 0px; color: rgb(255, 255, 255); font-size: 13px; line-height: 1.25; font-weight: 1000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.jn-message-main time { display: block; margin-top: 5px; color: rgb(167, 170, 179); font-size: 11px; line-height: 1.2; }

.jn-message-main p { display: none; margin: 8px 0px 0px; color: rgb(203, 213, 225); font-size: 12px; line-height: 1.55; }

.jn-message-item.is-expanded .jn-message-main p { display: block; }

.jn-message-side { display: flex; align-items: center; gap: 12px; justify-content: flex-end; }

.jn-message-side span { display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 40px; padding: 0px 8px; border-radius: 999px; background: rgba(6, 182, 212, 0.16); color: rgb(0, 215, 239); font-size: 11px; line-height: 1; font-weight: 1000; }

.jn-message-side i { display: block; color: rgb(127, 135, 148); font-style: normal; font-size: 18px; line-height: 1; transition: transform 0.16s; }

.jn-message-item.is-expanded .jn-message-side i { transform: rotate(180deg); }

.jn-message-empty { min-height: 132px; display: grid; place-items: center; padding: 28px; border: 1px dashed rgb(58, 60, 67); border-radius: 13px; background: rgb(32, 33, 38); color: rgb(139, 147, 163); text-align: center; font-size: 13px; }

.jn-light-mode .jn-message-modal { background: rgb(23, 24, 30); color: rgb(248, 250, 252); border-color: rgba(36, 45, 58, 0.95); }

.jn-light-mode .jn-message-head h2, .jn-light-mode .jn-message-main strong, .jn-light-mode .jn-message-foot strong { color: rgb(255, 255, 255); }

.jn-light-mode .jn-message-head p, .jn-light-mode .jn-message-main time { color: rgb(165, 168, 177); }

.jn-light-mode .jn-message-main p { color: rgb(203, 213, 225); }

.jn-light-mode .jn-message-item { background: rgb(39, 40, 46); border-color: rgb(58, 60, 67); }

@media (max-width: 760px) {
.jn-message-layer { padding: 10px; place-items: center; }

.jn-message-modal { width: min(390px, -20px + 100vw); min-height: min(720px, -20px + 100dvh); max-height: calc(-20px + 100dvh); padding: 16px 13px; border-radius: 19px; }

.jn-message-close { right: 12px; top: 12px; width: 34px; height: 34px; border-radius: 11px; }

.jn-message-head { gap: 11px; padding: 0px 44px 10px 0px; }

.jn-message-icon { width: 38px; height: 38px; flex-basis: 38px; border-radius: 13px; }

.jn-message-head h2 { font-size: 20px; }

.jn-message-head p { font-size: 11px; }

.jn-message-tools { padding: 5px 0px 13px; }

.jn-message-filter { height: 30px; min-width: 62px; padding: 0px 16px; font-size: 12px; }

.jn-message-read { height: 28px; padding: 0px 12px; font-size: 11px; }

.jn-message-list { gap: 9px; }

.jn-message-item { min-height: 58px; padding: 10px; border-radius: 11px; gap: 9px; }

.jn-message-main strong { font-size: 12px; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.jn-message-main time { font-size: 10px; }


.jn-message-side span { height: 22px; min-width: 36px; font-size: 10px; }
}

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-shop-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-buy-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .record-detail-layer, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .customer-modal-overlay[data-customer-overlay], html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-auth-overlay, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .account-bind-overlay, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .modal-backdrop, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .dialog-backdrop, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .ai-draw-dialog-backdrop, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .ai-draw-preview-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .records-preview-modal { background: rgba(226, 232, 240, 0.72); color: rgb(15, 23, 42); backdrop-filter: blur(12px); }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-modal-api, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-shop-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-buy-panel, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .customer-modal.replica-customer-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-auth-modal.replica-login-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .account-bind-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .record-detail-modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .modal, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .dialog, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .resource-dialog-panel, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .share-dialog, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .image-preview-panel, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .preview-panel, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .ai-draw-dialog, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .ai-draw-preview-panel, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .admin-modal-panel { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; backdrop-filter: none; }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-head, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-head, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-shop-head, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-modal header, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-head, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-modal-head, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .replica-login-modal .jn-auth-logo, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .replica-login-modal .jn-auth-subtitle, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .account-bind-modal .bind-head { background: linear-gradient(rgb(255, 255, 255), rgb(238, 246, 255)); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-item, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-empty, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-row, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-stat-card, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-row, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-inline-panel, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-api-create, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-api-note, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-shop-card, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-buy-row, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-stats > div, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-progress, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-calendar, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-day, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-online-card, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-card, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-qr-frame, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .record-detail-info, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .record-detail-media { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-head h2, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-main strong, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-head h2, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-row strong, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-title h2, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-row-value, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-shop-head h2, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-modal h2, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-modal-head h2, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-online-card strong, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .replica-login-modal .jn-auth-logo span, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .account-bind-modal .bind-head strong { color: rgb(15, 23, 42); }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-head p, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-main p, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-main time, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-head p, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-resource-row span, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-row-label, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-shop-head p, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-modal p, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .service-modal-head p, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .replica-login-modal .jn-auth-subtitle, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .account-bind-modal .bind-head p { color: rgb(100, 116, 139); }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-message-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .customer-modal-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-modal-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-close-btn, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .dialog-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .modal-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .record-dialog-close, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .ai-draw-preview-close { background: rgb(238, 242, 247); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-checkin-primary, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-profile-primary, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .jn-auth-submit, html.jn-light-mode body:not(#jnLightBoostA):not(#jnLightBoostB) .replica-customer-modal .service-actions-single a { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)); border-color: transparent; color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.22) 0px 14px 30px; }

.jn-message-layer, .jn-message-modal, .jn-profile-layer, .jn-profile-modal, .customer-modal-overlay, .customer-modal { box-sizing: border-box; }

@media (max-width: 760px) {
.jn-message-layer, .jn-profile-layer, .customer-modal-overlay[data-customer-overlay] { padding: 10px; overflow: hidden; }

.jn-message-modal, .jn-profile-modal { width: min(390px, 100%); max-width: 100%; }
}

html.jn-light-mode .jn-message-modal, body.jn-light-mode .jn-message-modal { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; }

html.jn-light-mode .jn-message-modal header, body.jn-light-mode .jn-message-modal header, html.jn-light-mode .jn-message-head, body.jn-light-mode .jn-message-head { background: linear-gradient(rgb(255, 255, 255), rgb(241, 247, 255)); border-color: rgba(15, 23, 42, 0.08); box-shadow: none; }

html.jn-light-mode .jn-message-head h2, html.jn-light-mode .jn-message-main strong, body.jn-light-mode .jn-message-head h2, body.jn-light-mode .jn-message-main strong { color: rgb(15, 23, 42); }

html.jn-light-mode .jn-message-head p, html.jn-light-mode .jn-message-main time, html.jn-light-mode .jn-message-main p, body.jn-light-mode .jn-message-head p, body.jn-light-mode .jn-message-main time, body.jn-light-mode .jn-message-main p { color: rgb(100, 116, 139); }

html.jn-light-mode .jn-message-item, html.jn-light-mode .jn-message-empty, body.jn-light-mode .jn-message-item, body.jn-light-mode .jn-message-empty { background: rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode .jn-message-close, body.jn-light-mode .jn-message-close { background: rgb(238, 242, 247); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay, .front-recharge-backdrop), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay, .front-recharge-backdrop) { background: none rgba(241, 245, 249, 0.82); color: rgb(15, 23, 42); }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; color-scheme: light; backdrop-filter: none; }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .bind-form), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .bind-form) { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong) { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(p, small, time, em, li, span, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(p, small, time, em, li, span, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span) { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button) { background: none rgb(238, 242, 247); color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active), body.jn-light-mode:not(#jnFrontLightTrueFinalA):not(#jnFrontLightTrueFinalB):not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active) { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)) rgb(37, 99, 235); border-color: transparent; color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.22) 0px 14px 30px; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay, .front-recharge-backdrop), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay, .front-recharge-backdrop) { background: none rgba(241, 245, 249, 0.82); color: rgb(15, 23, 42); }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; color-scheme: light; backdrop-filter: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.replica-customer-modal, .jn-checkin-modal, .jn-message-modal, .replica-login-modal, .account-bind-modal)::before, body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.replica-customer-modal, .jn-checkin-modal, .jn-message-modal, .replica-login-modal, .account-bind-modal)::before { background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(6, 182, 212, 0.1), rgba(16, 185, 129, 0.08)); opacity: 1; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .jn-third-reserved, .third-unconfigured, .bind-form), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .jn-third-reserved, .third-unconfigured, .bind-form) { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-head, .jn-buy-head, .jn-checkin-head, .jn-message-head, .jn-message-modal header, .jn-resource-head, .jn-profile-top, .jn-profile-head, .service-modal-head, .record-detail-head, .bind-head, .jn-credit-head, .jn-credit-tabs, .jn-credit-table-head, .replica-login-modal .jn-auth-logo, .replica-login-modal .jn-auth-subtitle), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-head, .jn-buy-head, .jn-checkin-head, .jn-message-head, .jn-message-modal header, .jn-resource-head, .jn-profile-top, .jn-profile-head, .service-modal-head, .record-detail-head, .bind-head, .jn-credit-head, .jn-credit-tabs, .jn-credit-table-head, .replica-login-modal .jn-auth-logo, .replica-login-modal .jn-auth-subtitle) { background: linear-gradient(rgb(255, 255, 255), rgb(241, 247, 255)) rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong, .front-recharge-dialog h2), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong, .front-recharge-dialog h2) { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(p, small, time, em, li, span, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .front-recharge-dialog) :is(p, small, time, em, li, span, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span) { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button, .front-recharge-close), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button, .front-recharge-close) { background: none rgb(238, 242, 247); color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active, .front-recharge-trigger, .front-recharge-dialog button[type="submit"]), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active, .front-recharge-trigger, .front-recharge-dialog button[type="submit"]) { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)) rgb(37, 99, 235); border-color: transparent; color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.22) 0px 14px 30px; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-buy[disabled], .jn-checkin-primary:disabled), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-shop-buy[disabled], .jn-checkin-primary:disabled) { background: none rgb(226, 232, 240); color: rgb(100, 116, 139); -webkit-text-fill-color: rgb(100, 116, 139); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-pay-item input:checked + span, .jn-message-side span, .jn-token-badge, .jn-profile-id, .status-badge, .jn-credit-icon), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-pay-item input:checked + span, .jn-message-side span, .jn-token-badge, .jn-profile-id, .status-badge, .jn-credit-icon) { background: rgb(224, 242, 254); color: rgb(3, 105, 161); -webkit-text-fill-color: currentcolor; border-color: rgb(125, 211, 252); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-credit-status.success, .jn-checkin-days span.is-signed), body.jn-light-mode:not(#jnFrontLightModalEndA):not(#jnFrontLightModalEndB):not(.page-admin) :is(.jn-credit-status.success, .jn-checkin-days span.is-signed) { background: rgb(220, 252, 231); color: rgb(22, 101, 52); -webkit-text-fill-color: currentcolor; border-color: rgb(134, 239, 172); }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay), body.jn-light-mode:not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay) { background: none rgba(241, 245, 249, 0.82); color: rgb(15, 23, 42); backdrop-filter: blur(10px); }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel), body.jn-light-mode:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; color-scheme: light; backdrop-filter: none; }

html.jn-light-mode body:not(.page-admin) :is(.replica-customer-modal, .jn-checkin-modal, .jn-message-modal, .replica-login-modal, .account-bind-modal)::before, body.jn-light-mode:not(.page-admin) :is(.replica-customer-modal, .jn-checkin-modal, .jn-message-modal, .replica-login-modal, .account-bind-modal)::before { background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(6, 182, 212, 0.1), rgba(16, 185, 129, 0.08)); opacity: 1; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .jn-third-reserved, .third-unconfigured, .bind-form), body.jn-light-mode:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .jn-third-reserved, .third-unconfigured, .bind-form) { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; text-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-head, .jn-buy-head, .jn-checkin-head, .jn-message-head, .jn-message-modal header, .jn-resource-head, .jn-profile-top, .jn-profile-head, .service-modal-head, .record-detail-head, .bind-head, .jn-credit-head, .jn-credit-tabs, .jn-credit-table-head, .replica-login-modal .jn-auth-logo, .replica-login-modal .jn-auth-subtitle), body.jn-light-mode:not(.page-admin) :is(.jn-shop-head, .jn-buy-head, .jn-checkin-head, .jn-message-head, .jn-message-modal header, .jn-resource-head, .jn-profile-top, .jn-profile-head, .service-modal-head, .record-detail-head, .bind-head, .jn-credit-head, .jn-credit-tabs, .jn-credit-table-head, .replica-login-modal .jn-auth-logo, .replica-login-modal .jn-auth-subtitle) { background: linear-gradient(rgb(255, 255, 255), rgb(241, 247, 255)); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong), body.jn-light-mode:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong) { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(p, small, time, em, li, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span), body.jn-light-mode:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(p, small, time, em, li, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span) { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button), body.jn-light-mode:not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button) { background: none rgb(238, 242, 247); color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active), body.jn-light-mode:not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active) { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)); border-color: transparent; color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.22) 0px 14px 30px; }

html.jn-light-mode body:not(.page-admin) :is(.jn-checkin-icon, .jn-message-icon, .jn-credit-icon, .service-avatar, .jn-auth-logo img), body.jn-light-mode:not(.page-admin) :is(.jn-checkin-icon, .jn-message-icon, .jn-credit-icon, .service-avatar, .jn-auth-logo img) { background: linear-gradient(135deg, rgb(224, 242, 254), rgb(248, 250, 252)); color: rgb(3, 105, 161); border-color: rgba(14, 165, 233, 0.24); box-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal) { background: none rgba(241, 245, 249, 0.78); color: rgb(15, 23, 42); backdrop-filter: blur(10px); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; color-scheme: light; backdrop-filter: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.replica-customer-modal, .jn-checkin-modal, .jn-message-modal)::before, body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.replica-customer-modal, .jn-checkin-modal, .jn-message-modal)::before { background: linear-gradient(135deg, rgba(37, 99, 235, 0.12), rgba(6, 182, 212, 0.1), rgba(16, 185, 129, 0.08)); opacity: 1; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row) { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; text-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-head, .jn-buy-head, .jn-checkin-head, .jn-message-head, .jn-message-modal header, .jn-resource-head, .jn-profile-top, .jn-profile-head, .service-modal-head, .record-detail-head, .bind-head, .jn-credit-head, .jn-credit-tabs, .jn-credit-table-head), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-head, .jn-buy-head, .jn-checkin-head, .jn-message-head, .jn-message-modal header, .jn-resource-head, .jn-profile-top, .jn-profile-head, .service-modal-head, .record-detail-head, .bind-head, .jn-credit-head, .jn-credit-tabs, .jn-credit-table-head) { background: linear-gradient(rgb(255, 255, 255), rgb(241, 247, 255)); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span) { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(p, small, time, em, li, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(p, small, time, em, li, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span) { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn) { background: none rgb(238, 242, 247); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active) { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)); border-color: transparent; color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.22) 0px 14px 30px; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-buy[disabled], .jn-checkin-primary:disabled), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-buy[disabled], .jn-checkin-primary:disabled) { background: rgb(226, 232, 240); color: rgb(100, 116, 139); -webkit-text-fill-color: rgb(100, 116, 139); box-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-shop-credits, .jn-buy-row.total strong, .jn-shop-price small, .jn-checkin-progress em, .jn-checkin-tomorrow, .jn-checkin-foot strong, .jn-profile-balance strong), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-shop-credits, .jn-buy-row.total strong, .jn-shop-price small, .jn-checkin-progress em, .jn-checkin-tomorrow, .jn-checkin-foot strong, .jn-profile-balance strong) { color: rgb(217, 119, 6); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-pay-item input:checked + span, .jn-message-side span, .jn-token-badge, .jn-profile-id, .status-badge, .jn-credit-icon), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-pay-item input:checked + span, .jn-message-side span, .jn-token-badge, .jn-profile-id, .status-badge, .jn-credit-icon) { background: rgb(224, 242, 254); color: rgb(3, 105, 161); -webkit-text-fill-color: currentcolor; border-color: rgb(125, 211, 252); box-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-credit-status.success, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-credit-status.success, html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-days span.is-signed, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-days span.is-signed { background: rgb(220, 252, 231); color: rgb(22, 101, 52); -webkit-text-fill-color: currentcolor; border-color: rgb(134, 239, 172); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.jn-checkin-note, .jn-checkin-milestones b), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.jn-checkin-note, .jn-checkin-milestones b) { background: rgb(255, 247, 237); color: rgb(180, 83, 9); -webkit-text-fill-color: currentcolor; border-color: rgb(254, 215, 170); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-milestones div.is-done, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-milestones div.is-done { background: rgb(236, 253, 245); border-color: rgb(134, 239, 172); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-milestones span, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-milestones span { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-milestones em, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-milestones em { color: rgb(124, 58, 237); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-progress i, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-progress i { background: rgb(226, 232, 240); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-days span.is-today, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-days span.is-today { background: rgb(255, 247, 237); color: rgb(154, 52, 18); -webkit-text-fill-color: currentcolor; border-color: rgb(245, 158, 11); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-days span.is-milestone:not(.is-signed), body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-days span.is-milestone:not(.is-signed) { background: rgb(243, 232, 255); color: rgb(109, 40, 217); -webkit-text-fill-color: currentcolor; border-color: rgb(196, 181, 253); }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-checkin-loading.is-error, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-checkin-loading.is-error, html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(.record-detail-error, .record-detail-mini-toast.error), body.jn-light-mode[class^="page-"]:not(.page-admin) :is(.record-detail-error, .record-detail-mini-toast.error) { background: rgb(254, 226, 226); color: rgb(185, 28, 28); -webkit-text-fill-color: currentcolor; border-color: rgb(254, 202, 202); box-shadow: none; }

html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-message-item:hover, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-message-item:hover { background: rgb(238, 246, 255); border-color: rgba(37, 99, 235, 0.18); transform: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay) { background: none rgba(241, 245, 249, 0.82); color: rgb(15, 23, 42); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; text-shadow: none; color-scheme: light; backdrop-filter: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .bind-form), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .bind-form) { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .jn-auth-logo span, .bind-head strong) { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(p, small, time, em, li, span, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .jn-auth-modal, .replica-login-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel) :is(p, small, time, em, li, span, .muted, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .jn-auth-subtitle, .jn-agree, .jn-third-title, .jn-forgot, .bind-head p, .bind-head span) { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button) { background: none rgb(238, 242, 247); color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active), body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active) { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)) rgb(37, 99, 235); border-color: transparent; color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.22) 0px 14px 30px; }

.jn-checkin-reward-layer { position: fixed; inset: 0px; z-index: 100360; display: grid; place-items: center; padding: 20px; background: rgba(2, 6, 23, 0.56); backdrop-filter: blur(8px); }

.jn-checkin-reward-modal { position: relative; width: min(356px, -40px + 100vw); max-height: calc(-48px + 100dvh); overflow: auto; padding: 28px 24px 22px; border: 1px solid rgba(148, 163, 184, 0.2); border-radius: 8px; background: rgb(17, 24, 39); color: rgb(248, 250, 252); text-align: center; box-shadow: rgba(2, 6, 23, 0.48) 0px 24px 64px, rgb(16, 185, 129) 0px 3px 0px inset; animation: 0.2s ease-out 0s 1 normal both running jn-checkin-reward-in; }

.jn-checkin-reward-close { position: absolute; right: 10px; top: 10px; width: 32px; height: 32px; padding: 0px; border: 0px; border-radius: 50%; background: transparent; color: rgb(148, 163, 184); font-size: 23px; line-height: 1; cursor: pointer; transition: background-color 0.16s, color 0.16s, transform 0.16s; }

.jn-checkin-reward-close:hover { background: rgb(31, 41, 55); color: rgb(248, 250, 252); }

.jn-checkin-reward-close:active { transform: scale(0.94); }

.jn-checkin-reward-close:focus-visible, .jn-checkin-reward-ok:focus-visible { outline: rgba(45, 212, 191, 0.34) solid 3px; outline-offset: 2px; }

.jn-checkin-reward-icon { width: 52px; height: 52px; margin: 0px auto 14px; display: grid; place-items: center; border: 1px solid rgba(52, 211, 153, 0.44); border-radius: 50%; background: rgb(6, 78, 59); color: rgb(167, 243, 208); font-size: 26px; font-weight: 900; box-shadow: rgba(16, 185, 129, 0.1) 0px 0px 0px 6px; }

.jn-checkin-reward-modal h3 { margin: 0px; color: rgb(255, 255, 255); font-size: 20px; line-height: 1.25; font-weight: 800; letter-spacing: 0px; }

.jn-checkin-reward-modal p { margin: 7px auto 18px; max-width: 280px; color: rgb(148, 163, 184); font-size: 13px; line-height: 1.6; }

.jn-checkin-reward-grid { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 0px 0px 18px; }

.jn-checkin-reward-grid > div { position: relative; padding: 14px 16px 14px 18px; overflow: hidden; border: 1px solid rgba(52, 211, 153, 0.22); border-radius: 6px; background: rgb(11, 34, 48); text-align: left; box-shadow: rgb(16, 185, 129) 3px 0px 0px inset; }

.jn-checkin-reward-grid span, .jn-checkin-reward-grid small { display: block; color: rgb(148, 163, 184); font-size: 11px; line-height: 1.35; font-weight: 600; }

.jn-checkin-reward-grid strong { display: block; margin: 5px 0px 4px; color: rgb(110, 231, 183); font-size: 27px; line-height: 1; font-weight: 850; font-variant-numeric: tabular-nums; }

.jn-checkin-reward-ok { width: 100%; height: 44px; border: 0px; border-radius: 6px; background: rgb(13, 148, 136); color: rgb(255, 255, 255); font-size: 13px; font-weight: 800; cursor: pointer; box-shadow: rgba(13, 148, 136, 0.24) 0px 8px 20px; transition: background-color 0.16s, box-shadow 0.16s, transform 0.16s; }

.jn-checkin-reward-ok:hover { background: rgb(15, 118, 110); box-shadow: rgba(13, 148, 136, 0.3) 0px 10px 24px; }

.jn-checkin-reward-ok:active { transform: translateY(1px); box-shadow: rgba(13, 148, 136, 0.22) 0px 5px 14px; }

@keyframes jn-checkin-reward-in { 
  0% { opacity: 0; transform: translateY(8px) scale(0.98); }
  100% { opacity: 1; transform: translateY(0px) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
.jn-checkin-reward-modal { animation: auto ease 0s 1 normal none running none; }

.jn-checkin-reward-close, .jn-checkin-reward-ok { transition: none; }
}

.jn-message-modal { width: min(940px, -48px + 100vw); height: min(590px, -64px + 100dvh); min-height: 0px; max-height: calc(-64px + 100dvh); }

.jn-message-main small { display: inline-flex; align-items: center; width: max-content; max-width: 100%; height: 20px; margin-top: 7px; padding: 0px 8px; border-radius: 999px; background: rgba(148, 163, 184, 0.1); color: rgb(156, 163, 175); font-size: 10px; line-height: 1; font-weight: 900; }

.jn-message-detail { grid-column: 1 / -1; display: none; margin-top: 2px; padding: 12px 13px; border: 1px solid rgba(34, 211, 238, 0.16); border-radius: 12px; background: linear-gradient(rgba(15, 23, 42, 0.68), rgba(15, 23, 42, 0.42)); color: rgb(219, 234, 254); box-shadow: rgba(255, 255, 255, 0.04) 0px 1px 0px inset; }


.jn-message-detail b { display: block; margin: 0px 0px 7px; color: rgb(224, 242, 254); font-size: 12px; line-height: 1.2; font-weight: 1000; }

.jn-message-detail p { display: block; margin: 0px; color: rgb(203, 213, 225); font-size: 12px; line-height: 1.7; word-break: break-word; }

.jn-message-item.is-expanded { align-items: start; border-color: rgba(34, 211, 238, 0.35); background: rgb(42, 45, 53); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-layer, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-layer { background: rgba(15, 23, 42, 0.28); backdrop-filter: blur(6px); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-modal, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-modal { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: rgba(15, 23, 42, 0.2) 0px 24px 64px, rgb(16, 185, 129) 0px 3px 0px inset; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-modal h3, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-modal h3, html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail b, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail b { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-icon, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-icon { background: rgb(236, 253, 245); color: rgb(4, 120, 87); border-color: rgb(167, 243, 208); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid strong, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid strong { color: rgb(4, 120, 87); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-modal p, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-modal p, html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid span, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid span, html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid small, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid small, html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail p, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail p { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid > div, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-grid > div { background: none rgb(240, 253, 250); border-color: rgb(204, 251, 241); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail { background: none rgb(248, 250, 252); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-close, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-close { background: transparent; color: rgb(100, 116, 139); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-close:hover, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-close:hover { background: rgb(241, 245, 249); color: rgb(15, 23, 42); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-ok, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-ok { background: rgb(13, 148, 136); color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-ok:hover, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-checkin-reward-ok:hover { background: rgb(15, 118, 110); }

@media (max-width: 760px) {
.jn-checkin-reward-layer { padding: 14px; }

.jn-checkin-reward-modal { width: min(324px, -28px + 100vw); max-height: calc(-68px + 100dvh); padding: 24px 18px 18px; border-radius: 8px; }

.jn-checkin-reward-close { right: 8px; top: 8px; width: 30px; height: 30px; font-size: 21px; }

.jn-checkin-reward-icon { width: 48px; height: 48px; margin-bottom: 12px; font-size: 24px; }

.jn-checkin-reward-modal h3 { font-size: 18px; }

.jn-checkin-reward-modal p { margin: 6px auto 15px; font-size: 12px; }

.jn-checkin-reward-grid { gap: 8px; margin-bottom: 15px; }

.jn-checkin-reward-grid > div { padding: 12px 14px 12px 16px; border-radius: 6px; }

.jn-checkin-reward-grid strong { font-size: 24px; }

.jn-checkin-reward-ok { height: 42px; border-radius: 6px; }

.jn-message-layer { padding: 12px; }

.jn-message-modal { width: min(352px, -24px + 100vw); height: min(500px, -92px + 100dvh); min-height: 0px; max-height: calc(-92px + 100dvh); padding: 14px 12px 13px; border-radius: 18px; }

.jn-message-head { gap: 10px; padding: 0px 42px 9px 0px; }




.jn-message-item { grid-template-columns: minmax(0px, 1fr) auto; gap: 8px; min-height: 52px; padding: 9px; }

.jn-message-main small { height: 18px; margin-top: 6px; padding: 0px 7px; font-size: 9px; }

.jn-message-detail { padding: 10px; border-radius: 11px; }

.jn-message-detail b { font-size: 11px; margin-bottom: 6px; }

.jn-message-detail p { font-size: 11px; line-height: 1.6; }
}

.jn-checkin-reward-layer.jn-checkin-reward-layer { padding: 18px; background: rgba(8, 13, 24, 0.68); backdrop-filter: blur(16px) saturate(1.06); }

.jn-checkin-reward-modal.jn-checkin-reward-modal { width: min(360px, -40px + 100vw); padding: 28px 24px 22px; border: 1px solid rgba(251, 191, 36, 0.24); border-radius: 20px; background: radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.2), transparent 34%), radial-gradient(circle at 92% 10%, rgba(168, 85, 247, 0.13), transparent 32%), linear-gradient(rgba(24, 29, 41, 0.98), rgba(13, 18, 30, 0.98)); color: rgb(255, 247, 237); box-shadow: rgba(8, 13, 24, 0.54) 0px 34px 110px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset; }

.jn-checkin-reward-close.jn-checkin-reward-close { right: 13px; top: 13px; width: 32px; height: 32px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 11px; background: rgba(255, 255, 255, 0.08); color: rgb(255, 247, 237); font-size: 21px; }

.jn-checkin-reward-close.jn-checkin-reward-close:hover { background: rgba(255, 255, 255, 0.14); color: rgb(255, 255, 255); }

.jn-checkin-reward-close:focus-visible, .jn-checkin-reward-ok:focus-visible { outline-color: rgba(251, 191, 36, 0.38); }

.jn-checkin-reward-icon.jn-checkin-reward-icon { position: relative; width: 50px; height: 50px; margin-bottom: 14px; border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 15px; background: linear-gradient(135deg, rgb(245, 158, 11), rgb(249, 115, 22)); color: transparent; font-size: 0px; box-shadow: rgba(249, 115, 22, 0.28) 0px 14px 30px, rgba(255, 255, 255, 0.3) 0px 1px 0px inset; }

.jn-checkin-reward-icon.jn-checkin-reward-icon::before { content: ""; display: block; width: 25px; height: 19px; background: rgb(255, 255, 255); clip-path: polygon(7% 43%, 0px 55%, 37% 100%, 100% 13%, 89% 0px, 36% 73%); }

.jn-checkin-reward-modal.jn-checkin-reward-modal h3 { color: rgb(255, 247, 237); font-weight: 900; }

.jn-checkin-reward-modal.jn-checkin-reward-modal p { color: rgba(254, 243, 199, 0.72); }

.jn-checkin-reward-grid.jn-checkin-reward-grid > div { padding: 14px 16px; border: 1px solid rgba(251, 191, 36, 0.18); border-radius: 15px; background: linear-gradient(rgba(251, 191, 36, 0.12), rgba(15, 23, 42, 0.34)); box-shadow: rgba(255, 255, 255, 0.04) 0px 1px 0px inset; }

.jn-checkin-reward-grid.jn-checkin-reward-grid span, .jn-checkin-reward-grid.jn-checkin-reward-grid small { color: rgba(254, 243, 199, 0.7); font-weight: 800; }

.jn-checkin-reward-grid.jn-checkin-reward-grid strong { color: rgb(251, 191, 36); }

.jn-checkin-reward-ok.jn-checkin-reward-ok { border-radius: 15px; background: linear-gradient(135deg, rgb(245, 158, 11), rgb(249, 115, 22)); color: rgb(255, 255, 255); font-size: 14px; font-weight: 900; box-shadow: rgba(249, 115, 22, 0.26) 0px 14px 32px; }

.jn-checkin-reward-ok.jn-checkin-reward-ok:hover { background: linear-gradient(135deg, rgb(251, 191, 36), rgb(251, 146, 60)); box-shadow: rgba(249, 115, 22, 0.32) 0px 16px 36px; }

.jn-checkin-reward-ok.jn-checkin-reward-ok:active { box-shadow: rgba(249, 115, 22, 0.24) 0px 8px 20px; }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-layer.jn-checkin-reward-layer, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-layer.jn-checkin-reward-layer, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-layer.jn-checkin-reward-layer, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-layer.jn-checkin-reward-layer { background: rgba(241, 245, 249, 0.68); backdrop-filter: blur(12px) saturate(1.04); }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal { background: radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.16), transparent 34%), radial-gradient(circle at 92% 10%, rgba(168, 85, 247, 0.1), transparent 32%), linear-gradient(rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)); color: rgb(23, 32, 51); border-color: rgba(251, 191, 36, 0.24); box-shadow: rgba(15, 23, 42, 0.18) 0px 28px 80px, rgba(255, 255, 255, 0.95) 0px 1px 0px inset; }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal h3, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal h3, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal h3, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal h3 { color: rgb(23, 32, 51); }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal p, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal p, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal p, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-modal.jn-checkin-reward-modal p { color: rgb(100, 116, 139); }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid > div, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid > div, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid > div, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid > div { background: linear-gradient(rgba(255, 247, 237, 0.96), rgba(255, 251, 235, 0.88)); border-color: rgba(245, 158, 11, 0.22); box-shadow: rgba(255, 255, 255, 0.9) 0px 1px 0px inset; }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid strong, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid strong, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid strong, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-grid.jn-checkin-reward-grid strong { color: rgb(217, 119, 6); }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close { background: rgba(255, 255, 255, 0.64); color: rgb(100, 116, 139); border-color: rgba(15, 23, 42, 0.1); }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close:hover, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close:hover, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close:hover, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-close.jn-checkin-reward-close:hover { background: rgb(255, 247, 237); color: rgb(23, 32, 51); }

html.jn-light-mode body:not(.page-admin) .jn-checkin-reward-ok.jn-checkin-reward-ok, html[data-theme="light"] body:not(.page-admin) .jn-checkin-reward-ok.jn-checkin-reward-ok, body.jn-light-mode:not(.page-admin) .jn-checkin-reward-ok.jn-checkin-reward-ok, body[data-theme="light"]:not(.page-admin) .jn-checkin-reward-ok.jn-checkin-reward-ok { background: linear-gradient(135deg, rgb(245, 158, 11), rgb(249, 115, 22)); color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); }

@media (max-width: 760px) {
.jn-checkin-reward-layer.jn-checkin-reward-layer { padding: 14px; }

.jn-checkin-reward-modal.jn-checkin-reward-modal { width: min(330px, -28px + 100vw); padding: 24px 18px 18px; border-radius: 19px; }

.jn-checkin-reward-close.jn-checkin-reward-close { right: 10px; top: 10px; width: 30px; height: 30px; border-radius: 10px; }

.jn-checkin-reward-icon.jn-checkin-reward-icon { width: 46px; height: 46px; margin-bottom: 12px; border-radius: 14px; }

.jn-checkin-reward-icon.jn-checkin-reward-icon::before { width: 23px; height: 17px; }

.jn-checkin-reward-grid.jn-checkin-reward-grid > div { padding: 12px 14px; border-radius: 14px; }

.jn-checkin-reward-ok.jn-checkin-reward-ok { height: 42px; border-radius: 14px; }
}

.jn-message-layer { z-index: 100420; padding: 24px; background: rgba(0, 0, 0, 0.78); backdrop-filter: none; }

.jn-message-modal { width: min(920px, -48px + 100vw); height: min(610px, -56px + 100dvh); min-height: 0px; max-height: calc(-56px + 100dvh); padding: 18px 22px 20px; border-radius: 22px; border: 1px solid rgba(55, 65, 81, 0.92); background: rgb(23, 24, 30); color: rgb(248, 250, 252); overflow: hidden; box-shadow: rgba(0, 0, 0, 0.58) 0px 34px 92px, rgba(255, 255, 255, 0.04) 0px 1px 0px inset; }

.jn-message-head { padding: 0px 56px 12px 0px; gap: 13px; }

.jn-message-head h2 { font-size: 22px; line-height: 1.16; }

.jn-message-head p { margin-top: 5px; color: rgb(156, 163, 175); font-size: 12px; }

.jn-message-tools { padding: 7px 0px 15px; }

.jn-message-filter { height: 30px; min-width: 66px; padding: 0px 18px; box-shadow: rgba(34, 211, 238, 0.14) 0px 0px 0px 3px, rgba(6, 182, 212, 0.14) 0px 10px 22px; }

.jn-message-read { height: 30px; padding: 0px 15px; background: rgb(36, 42, 54); color: rgb(156, 163, 175); }

.jn-message-list { flex: 1 1 auto; min-height: 0px; overflow: hidden auto; display: flex; flex-direction: column; align-content: normal; gap: 10px; padding: 0px 2px 24px; scroll-padding: 14px 0px 28px; }

.jn-message-item { position: relative; display: grid; grid-template-columns: minmax(0px, 1fr) auto; align-items: start; gap: 10px 14px; height: auto; min-height: 62px; max-height: none; padding: 12px 14px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, 0.1); background: rgb(38, 40, 46); box-shadow: none; flex: 0 0 auto; overflow: visible; transform: none; }

.jn-message-item:hover { border-color: rgba(34, 211, 238, 0.34); background: rgb(41, 44, 51); transform: none; }

.jn-message-item.is-unread { border-color: rgba(34, 211, 238, 0.26); box-shadow: rgba(6, 182, 212, 0.88) 3px 0px 0px inset; }

.jn-message-item.is-expanded { border-color: rgba(34, 211, 238, 0.78); background: rgb(41, 44, 51); box-shadow: rgba(34, 211, 238, 0.1) 0px 0px 0px 1px, rgba(6, 182, 212, 0.88) 3px 0px 0px inset; }

.jn-message-main { min-width: 0px; padding-top: 1px; }

.jn-message-main strong { margin: 0px; color: rgb(248, 250, 252); font-size: 15px; line-height: 1.25; font-weight: 1000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.jn-message-main time { margin-top: 6px; color: rgb(143, 150, 163); font-size: 11px; line-height: 1.2; }

.jn-message-main small { display: none; }

.jn-message-side { align-self: start; display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding-top: 1px; }

.jn-message-side span { height: 24px; min-width: 42px; padding: 0px 10px; border-radius: 999px; background: rgba(6, 182, 212, 0.16); color: rgb(22, 217, 242); font-size: 11px; font-weight: 1000; line-height: 1; }

.jn-message-side i { color: rgb(138, 147, 162); font-size: 18px; transform-origin: center center; }

.jn-message-detail { grid-column: 1 / -1; display: none; margin: 0px; padding: 12px 2px 1px; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgba(148, 163, 184, 0.18) currentcolor currentcolor; border-image: initial; border-radius: 0px; background: none transparent; box-shadow: none; color: rgb(203, 213, 225); }

.jn-message-item.is-expanded .jn-message-detail { display: block; }

.jn-message-detail b { display: none; }

.jn-message-detail p { display: block; margin: 0px; color: rgb(203, 213, 225); font-size: 13px; line-height: 1.72; word-break: break-word; white-space: normal; -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer, body.jn-light-mode:not(.page-admin) .jn-message-layer { background: rgba(15, 23, 42, 0.26); }

html.jn-light-mode body:not(.page-admin) .jn-message-modal, body.jn-light-mode:not(.page-admin) .jn-message-modal { background: rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.2) 0px 30px 86px; }

html.jn-light-mode body:not(.page-admin) .jn-message-head h2, body.jn-light-mode:not(.page-admin) .jn-message-head h2, html.jn-light-mode body:not(.page-admin) .jn-message-main strong, body.jn-light-mode:not(.page-admin) .jn-message-main strong { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-head p, body.jn-light-mode:not(.page-admin) .jn-message-head p, html.jn-light-mode body:not(.page-admin) .jn-message-main time, body.jn-light-mode:not(.page-admin) .jn-message-main time { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-item, body.jn-light-mode:not(.page-admin) .jn-message-item { background: rgb(248, 250, 252); border-color: rgba(15, 23, 42, 0.1); }

html.jn-light-mode body:not(.page-admin) .jn-message-item:hover, body.jn-light-mode:not(.page-admin) .jn-message-item:hover, html.jn-light-mode body:not(.page-admin) .jn-message-item.is-expanded, body.jn-light-mode:not(.page-admin) .jn-message-item.is-expanded { background: rgb(255, 255, 255); border-color: rgba(6, 182, 212, 0.55); }

html.jn-light-mode body:not(.page-admin) .jn-message-detail, body.jn-light-mode:not(.page-admin) .jn-message-detail { background: none transparent; border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail, body.jn-light-mode:not(#jnFrontLightTailA):not(#jnFrontLightTailB):not(.page-admin) .jn-message-detail, html.jn-light-mode body[class^="page-"]:not(.page-admin) .jn-message-detail, body.jn-light-mode[class^="page-"]:not(.page-admin) .jn-message-detail { background: none transparent; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgba(15, 23, 42, 0.12) currentcolor currentcolor; border-image: initial; border-radius: 0px; box-shadow: none; }

html.jn-light-mode body:not(.page-admin) .jn-message-detail p, body.jn-light-mode:not(.page-admin) .jn-message-detail p { color: rgb(71, 85, 105); -webkit-text-fill-color: currentcolor; }

@media (max-width: 760px) {
.jn-message-layer { padding: 12px; place-items: center; }

.jn-message-modal { width: min(360px, -20px + 100vw); height: min(540px, -74px + 100dvh); max-height: calc(-74px + 100dvh); padding: 14px 12px 13px; border-radius: 18px; }

.jn-message-close { right: 10px; top: 10px; width: 32px; height: 32px; border-radius: 10px; font-size: 22px; }

.jn-message-head { gap: 10px; padding: 0px 40px 10px 0px; }

.jn-message-icon { width: 36px; height: 36px; flex-basis: 36px; border-radius: 12px; }

.jn-message-head h2 { font-size: 18px; }

.jn-message-head p { font-size: 10px; line-height: 1.35; }

.jn-message-tools { gap: 9px; padding: 4px 0px 11px; }

.jn-message-filter { height: 29px; min-width: 60px; padding: 0px 15px; font-size: 12px; }

.jn-message-read { height: 29px; padding: 0px 12px; font-size: 11px; }

.jn-message-list { gap: 9px; padding: 0px 1px 22px; scroll-padding: 10px 0px 24px; }

.jn-message-item { grid-template-columns: minmax(0px, 1fr) auto; gap: 8px; height: auto; min-height: 54px; max-height: none; padding: 10px 9px; border-radius: 13px; }

.jn-message-main strong { font-size: 12px; line-height: 1.32; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.jn-message-main time { margin-top: 5px; font-size: 10px; }

.jn-message-side { gap: 7px; }

.jn-message-side span { height: 22px; min-width: 36px; padding: 0px 8px; font-size: 10px; }

.jn-message-side i { font-size: 16px; }

.jn-message-detail { padding: 10px 1px 0px; }

.jn-message-detail p { font-size: 11px; line-height: 1.65; }
}

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .ai-video-player-panel),
body.jn-light-mode:not(.page-admin) :is(.jn-shop-modal, .jn-buy-panel, .jn-checkin-modal, .jn-message-modal, .jn-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .jn-credit-ledger-modal, .customer-modal, .replica-customer-modal, .account-bind-modal, .record-detail-modal, .record-delete-confirm, .enterprise-alert, .modal, .dialog, .resource-dialog-panel, .share-dialog, .image-preview-panel, .preview-panel, .ai-draw-dialog, .ai-draw-preview-panel, .records-preview-panel, .ai-video-player-panel) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.14) 0px 24px 70px; text-shadow: none; backdrop-filter: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .bind-form, .invite-hero, .invite-stat, .invite-section, .invite-commission-panel, .invite-commission-card, .credit-ledger-card, .credit-ledger-panel, .credit-ledger-stat, .credit-ledger-head, .credit-filter-form, .credit-ledger-row, .credit-detail, .pay-record-card, .pay-record-panel, .pay-record-head, .pay-filter-form, .pay-record-row), body.jn-light-mode:not(.page-admin) :is(.jn-shop-tabs, .jn-shop-balance, .jn-shop-card, .jn-shop-redeem, .jn-shop-empty, .jn-buy-summary, .jn-buy-row, .jn-pay-item span, .jn-checkin-stats > div, .jn-checkin-progress, .jn-checkin-milestones div, .jn-checkin-calendar, .jn-checkin-days span, .jn-checkin-foot div, .jn-message-tools, .jn-message-item, .jn-message-empty, .jn-resource-row, .jn-stat-card, .jn-work-card, .jn-api-create, .jn-api-list, .jn-api-note, .jn-api-created, .jn-api-perms label, .jn-profile-row, .jn-profile-inline-panel, .jn-profile-balance, .jn-profile-hero, .service-online-card, .service-card, .service-qr-frame, .record-detail-info, .record-detail-media, .jn-credit-shell, .jn-credit-body, .jn-credit-pane, .jn-credit-table, .jn-credit-row, .jn-credit-stat, .jn-credit-toolbar, .jn-credit-date-tabs, .jn-credit-filters, .jn-credit-notice, .jn-credit-empty, .jn-credit-empty-inner, .jn-credit-other-list, .jn-credit-other-row, .jn-auth-tabs, .jn-auth-form, .jn-code-row, .jn-captcha-row, .jn-third-grid, .bind-form, .invite-hero, .invite-stat, .invite-section, .invite-commission-panel, .invite-commission-card, .credit-ledger-card, .credit-ledger-panel, .credit-ledger-stat, .credit-ledger-head, .credit-filter-form, .credit-ledger-row, .credit-detail, .pay-record-card, .pay-record-panel, .pay-record-head, .pay-filter-form, .pay-record-row) { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay, .ai-video-player-layer), body.jn-light-mode:not(.page-admin) :is(.jn-shop-layer, .jn-buy-layer, .jn-checkin-layer, .jn-message-layer, .jn-profile-layer, .jn-resource-layer, .customer-modal-overlay, .record-detail-layer, .record-delete-confirm-layer, .enterprise-alert-layer, .modal-backdrop, .dialog-backdrop, .share-dialog-backdrop, .image-preview-modal, .preview-modal, .ai-draw-dialog-backdrop, .ai-draw-preview-modal, .records-preview-modal, .jn-auth-overlay, .account-bind-overlay, .ai-video-player-layer) { background: none rgba(255, 255, 255, 0.82); color: rgb(15, 23, 42); backdrop-filter: none; }

html.jn-light-mode body:not(.page-admin) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .page-hd h1, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .invite-section h3, .invite-stat .num, .invite-commission-copy h3, .invite-commission-card strong, .credit-ledger-title, .credit-ledger-head h2, .credit-ledger-main strong, .credit-detail b, .pay-record-card strong, .pay-record-head h2, .pay-record-title strong, .pay-record-end strong),
body.jn-light-mode:not(.page-admin) :is(h1, h2, h3, h4, strong, b, label, dt, dd, .page-hd h1, .jn-shop-price, .jn-shop-balance strong, .jn-buy-row strong, .jn-checkin-stats strong, .jn-checkin-calendar-head strong, .jn-checkin-foot strong, .jn-message-main strong, .jn-resource-row strong, .jn-stat-card strong, .jn-profile-row-value, .service-online-card strong, .jn-credit-title h2, .jn-credit-stat strong, .jn-credit-stat small, .jn-credit-empty-inner strong, .jn-credit-other-row strong, .jn-credit-cell, .jn-credit-model, .jn-credit-input, .jn-credit-output, .jn-api-form-head strong, .jn-api-perms span, .invite-section h3, .invite-stat .num, .invite-commission-copy h3, .invite-commission-card strong, .credit-ledger-title, .credit-ledger-head h2, .credit-ledger-main strong, .credit-detail b, .pay-record-card strong, .pay-record-head h2, .pay-record-title strong, .pay-record-end strong) { color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.muted, .page-hd p, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .invite-stat .lbl, .invite-commission-copy p, .invite-commission-card span, .invite-rule-list li, .invited-table th, .invited-table td, .credit-ledger-sub, .credit-ledger-head p, .credit-ledger-meta, .credit-filter-form label, .pay-record-card span, .pay-record-card p, .pay-record-head p, .pay-filter-form label, .pay-record-meta),
body.jn-light-mode:not(.page-admin) :is(.muted, .page-hd p, .jn-shop-desc, .jn-shop-balance span, .jn-buy-row span, .jn-pay-label, .jn-checkin-stats span, .jn-checkin-progress div, .jn-checkin-calendar-head span, .jn-checkin-weekdays span, .jn-checkin-foot span, .jn-message-main p, .jn-message-main time, .jn-resource-row span, .jn-resource-row small, .jn-profile-row-label, .jn-profile-inline-panel label, .service-modal-head p, .record-detail-modal p, .record-detail-modal dt, .record-detail-modal dd, .jn-credit-title p, .jn-credit-stat span, .jn-credit-muted, .jn-credit-empty-inner p, .jn-credit-other-row span, .jn-credit-notice span, .jn-api-form-head span, .invite-stat .lbl, .invite-commission-copy p, .invite-commission-card span, .invite-rule-list li, .invited-table th, .invited-table td, .credit-ledger-sub, .credit-ledger-head p, .credit-ledger-meta, .credit-filter-form label, .pay-record-card span, .pay-record-card p, .pay-record-head p, .pay-filter-form label, .pay-record-meta) { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; text-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .ai-video-player-head button, .ai-video-player-actions button, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button, .credit-ledger-tab, .credit-detail-toggle, .credit-export-btn, .pay-record-tab), body.jn-light-mode:not(.page-admin) :is(.jn-shop-tab, .jn-message-read, .jn-api-row-actions button, .jn-profile-panel-actions .secondary, .jn-profile-row-action, .jn-shop-close, .jn-resource-close, .jn-checkin-close, .jn-message-close, .jn-profile-close-btn, .customer-modal-close, .jn-modal-close, .record-dialog-close, .dialog-close, .modal-close, .ai-draw-preview-close, .ai-video-player-head button, .ai-video-player-actions button, .jn-credit-tab, .jn-credit-date-tabs button, .jn-credit-select, .jn-credit-range, .jn-credit-close, .jn-credit-export, .jn-profile-secondary, .jn-profile-edit-btn, .jn-code-row button, .jn-captcha, .bind-skip, .jn-third-grid button, .credit-ledger-tab, .credit-detail-toggle, .credit-export-btn, .pay-record-tab) { background: none rgb(238, 242, 247); color: rgb(15, 23, 42); -webkit-text-fill-color: currentcolor; border-color: rgba(15, 23, 42, 0.12); box-shadow: none; }

html.jn-light-mode body:not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active, .credit-filter-btn, .credit-calendar-actions button:last-child, .pay-filter-btn, .pay-calendar-actions button:last-child, .credit-ledger-tab.is-active, .pay-record-tab.is-active), body.jn-light-mode:not(.page-admin) :is(.jn-shop-tab.is-active, .jn-message-filter, .jn-shop-buy, .jn-confirm-pay, .jn-shop-redeem button, .jn-checkin-primary, .jn-api-primary, .jn-copy-btn, .jn-profile-panel-actions .primary, .jn-profile-primary, .jn-auth-submit, .replica-customer-modal .service-actions-single a, .enterprise-alert button:not([data-confirm-cancel]), .jn-credit-tab.is-active, .jn-credit-date-tabs button.is-active, .credit-filter-btn, .credit-calendar-actions button:last-child, .pay-filter-btn, .pay-calendar-actions button:last-child, .credit-ledger-tab.is-active, .pay-record-tab.is-active) { background: linear-gradient(135deg, rgb(37, 99, 235), rgb(6, 182, 212)) rgb(37, 99, 235); border-color: transparent; color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(37, 99, 235, 0.2) 0px 12px 28px; }

html body:not(.page-admin) :is(.front-profile-layer:not([data-profile-force="1"]), .jn-profile-layer:not([data-profile-force="1"]), .jn-checkin-layer, .jn-message-layer, .jn-system-notice-layer:not(.jn-front-announcement-layer), .front-resource-layer, .jn-resource-layer) { background: none transparent; backdrop-filter: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] { place-items: center; padding: 20px; background: rgba(24, 29, 39, 0.58); backdrop-filter: blur(10px); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { position: relative; width: min(720px, -40px + 100vw); height: auto; min-height: 0px; max-height: calc(-40px + 100dvh); padding: 0px; overflow: hidden; border: 1px solid rgb(59, 67, 81); border-radius: 8px; background: none rgb(32, 37, 46); color: rgb(244, 247, 251); box-shadow: rgba(15, 18, 25, 0.38) 0px 24px 64px; color-scheme: dark; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head { flex: 0 0 auto; min-height: 86px; margin: 0px; padding: 20px 64px 18px 22px; gap: 14px; align-items: center; border-bottom: 1px solid rgb(54, 62, 75); background: rgb(37, 43, 53); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-icon { width: 42px; height: 42px; flex: 0 0 42px; border: 1px solid rgba(45, 212, 191, 0.36); border-radius: 8px; background: rgb(24, 62, 66); box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2 { margin: 0px; color: rgb(248, 250, 252); font-size: 20px; line-height: 1.2; font-weight: 760; letter-spacing: 0px; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p { margin: 5px 0px 0px; color: rgb(170, 180, 194); font-size: 12px; line-height: 1.5; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close { top: 23px; right: 20px; width: 34px; height: 34px; border: 1px solid rgb(65, 74, 88); border-radius: 7px; background: rgb(44, 51, 62); color: rgb(189, 199, 212); box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close:hover { border-color: rgb(89, 100, 116); background: rgb(53, 61, 73); color: rgb(255, 255, 255); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-tools { position: relative; flex: 0 0 auto; display: flex; min-height: 55px; margin: 0px; padding: 11px 22px; align-items: center; gap: 10px; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(54, 62, 75); border-image: initial; border-radius: 0px; background: rgb(32, 37, 46); box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-filter, .jn-message-read) { height: 32px; min-width: 0px; padding: 0px 13px; border-radius: 6px; font-size: 12px; font-weight: 700; line-height: 1; box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter { border: 1px solid rgb(45, 212, 191); background: rgb(45, 212, 191); color: rgb(16, 45, 48); -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read { border: 1px solid rgb(70, 80, 94); background: rgb(43, 50, 61); color: rgb(210, 218, 228); -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read:hover { border-color: rgb(99, 112, 131); background: rgb(52, 60, 72); color: rgb(255, 255, 255); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read:disabled { cursor: wait; opacity: 0.58; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status { margin-left: auto; padding: 6px 10px; border: 1px solid rgba(45, 212, 191, 0.35); border-radius: 6px; background: rgb(24, 59, 61); color: rgb(140, 241, 227); font-size: 12px; font-weight: 650; line-height: 1.35; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status[hidden] { display: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status.is-error { border-color: rgba(251, 113, 133, 0.4); background: rgb(71, 43, 53); color: rgb(254, 205, 211); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { flex: 0 1 auto; min-height: 0px; max-height: min(520px, -201px + 100dvh); margin: 0px; padding: 16px 18px 18px; overflow: hidden auto; display: flex; flex-direction: column; gap: 9px; background: rgb(32, 37, 46); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item { position: relative; flex: 0 0 auto; display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 8px 14px; min-height: 64px; height: auto; margin: 0px; padding: 13px 14px; overflow: visible; border: 1px solid rgb(58, 67, 80); border-radius: 7px; background: rgb(41, 47, 57); box-shadow: none; transform: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover, html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded { border-color: rgb(86, 98, 115); background: rgb(48, 55, 67); transform: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread { border-color: rgb(43, 143, 137); box-shadow: rgb(45, 212, 191) 3px 0px 0px inset; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-marking-read { cursor: progress; opacity: 0.76; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong { margin: 0px; color: rgb(244, 247, 251); font-size: 14px; line-height: 1.4; font-weight: 720; letter-spacing: 0px; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main time { display: block; margin-top: 5px; color: rgb(146, 158, 174); font-size: 11px; line-height: 1.35; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span { height: 23px; min-width: 40px; padding: 0px 8px; border-radius: 5px; background: rgb(59, 52, 64); color: rgb(247, 201, 120); font-size: 10px; font-weight: 700; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side i { color: rgb(155, 167, 182); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail { grid-column: 1 / -1; margin: 3px 0px 0px; padding: 12px 0px 1px; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgb(66, 75, 88) currentcolor currentcolor; border-image: initial; border-radius: 0px; background: transparent; box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p { margin: 0px; color: rgb(195, 204, 216); font-size: 12px; line-height: 1.7; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-empty { flex: 0 0 auto; min-height: 96px; padding: 34px 18px; border: 1px dashed rgb(69, 80, 94); border-radius: 7px; background: rgb(41, 47, 57); color: rgb(157, 169, 184); box-shadow: none; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] { background: rgba(51, 65, 85, 0.25); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { border-color: rgb(215, 222, 232); background: rgb(247, 249, 252); color: rgb(23, 32, 51); box-shadow: rgba(30, 41, 59, 0.18) 0px 24px 64px; color-scheme: light; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-head, .jn-message-tools), html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-head, .jn-message-tools), body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-head, .jn-message-tools), body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-head, .jn-message-tools) { border-color: rgb(225, 231, 239); background: rgb(255, 255, 255); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2, html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong { color: rgb(23, 32, 51); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p, html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main time, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main time, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main time, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main time { color: rgb(100, 116, 139); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { background: rgb(247, 249, 252); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-item, .jn-message-empty), html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-item, .jn-message-empty), body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-item, .jn-message-empty), body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-item, .jn-message-empty) { border-color: rgb(220, 227, 236); background: rgb(255, 255, 255); color: rgb(100, 116, 139); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover, html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded { border-color: rgb(183, 195, 210); background: rgb(251, 252, 254); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread { border-color: rgb(116, 187, 180); box-shadow: rgb(15, 159, 145) 3px 0px 0px inset; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail { border-width: 1px 0px 0px; border-style: solid none none; border-color: rgb(225, 231, 239) currentcolor currentcolor; border-image: initial; background: transparent; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p { color: rgb(71, 85, 105); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close, html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read { border-color: rgb(213, 221, 231); background: rgb(244, 247, 250); color: rgb(71, 85, 105); -webkit-text-fill-color: currentcolor; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status { border-color: rgb(159, 221, 213); background: rgb(233, 248, 245); color: rgb(8, 124, 113); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status.is-error, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status.is-error, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status.is-error, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status.is-error { border-color: rgb(254, 205, 211); background: rgb(255, 241, 242); color: rgb(190, 18, 60); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { width: min(820px, -40px + 100vw); border-color: rgb(65, 74, 89); box-shadow: rgba(10, 14, 22, 0.42) 0px 28px 80px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head { min-height: 94px; padding: 22px 68px 20px 24px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2 { font-size: 22px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p { margin-top: 7px; font-size: 12px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-tools { min-height: 58px; padding: 12px 24px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter { border-color: rgb(70, 80, 94); background: rgb(43, 50, 61); color: rgb(215, 222, 232); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read { margin-left: auto; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status:not([hidden]) { position: absolute; top: 50%; right: 132px; max-width: 320px; transform: translateY(-50%); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { max-height: min(550px, -212px + 100dvh); padding: 18px 20px 20px; gap: 10px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item { min-height: 72px; padding: 15px 16px; border-color: rgb(60, 69, 83); background: rgb(41, 47, 57); transition: border-color 0.18s, background-color 0.18s, box-shadow 0.18s; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread { border-color: rgb(35, 140, 145); background: rgb(40, 53, 61); box-shadow: rgb(35, 183, 195) 3px 0px 0px inset; }


html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong { font-size: 14px; font-weight: 760; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main small { display: inline-flex; margin-top: 8px; color: rgb(141, 153, 169); font-size: 10px; font-style: normal; line-height: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side { display: flex; align-items: center; align-self: center; gap: 10px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span { display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 48px; padding: 0px 9px; border: 1px solid rgb(81, 90, 104); border-radius: 999px; background: rgb(52, 58, 69); color: rgb(174, 184, 197); font-size: 11px; font-weight: 700; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-unread { border-color: rgb(38, 125, 100); background: rgb(22, 63, 53); color: rgb(114, 224, 172); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-read { border-color: rgb(97, 71, 81); background: rgb(67, 47, 55); color: rgb(232, 185, 197); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side i { display: inline-flex; width: 20px; height: 20px; align-items: center; justify-content: center; font-size: 15px; font-style: normal; transform: rotate(0deg); transition: transform 0.18s; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded .jn-message-side i { transform: rotate(180deg); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { border-color: rgb(204, 213, 225); box-shadow: rgba(30, 41, 59, 0.2) 0px 28px 80px; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter { border-color: rgb(214, 222, 233); background: rgb(242, 245, 249); color: rgb(70, 85, 105); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread { border-color: rgb(91, 180, 176); background: rgb(245, 251, 251); box-shadow: rgb(13, 159, 154) 3px 0px 0px inset; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-unread, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-unread, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-unread, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-unread { border-color: rgb(155, 220, 197); background: rgb(232, 248, 241); color: rgb(8, 123, 89); }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-read, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-read, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-read, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span.is-read { border-color: rgb(231, 197, 207); background: rgb(255, 241, 244); color: rgb(155, 77, 98); }

@media (max-width: 760px) {


html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head { min-height: 74px; padding: 14px 52px 14px 14px; }


html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2 { font-size: 17px; }


html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close { top: 19px; right: 12px; width: 30px; height: 30px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-tools { min-height: 50px; padding: 9px 12px; gap: 8px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status { max-width: calc(100% - 150px); padding: 5px 7px; overflow: hidden; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { max-height: calc(-144px + 100dvh); padding: 11px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item { min-height: 58px; padding: 11px 10px; gap: 7px 9px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main strong { font-size: 12px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side span { min-width: 36px; padding: 0px 6px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status:not([hidden]) { position: static; top: auto; right: auto; transform: none; }
}

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] { --message-surface: #24262a; --message-raised: #2b2d32; --message-hover: #303338; --message-detail: #202226; --message-line: rgba(255,255,255,.11); --message-line-strong: rgba(255,255,255,.18); --message-text: #f2f4f3; --message-muted: #a4aaa7; --message-subtle: #7f8783; --message-accent: #3bc0a7; --message-accent-soft: rgba(59,192,167,.13); --message-accent-line: rgba(59,192,167,.42); --message-control: #34373c; padding: 20px; background: none transparent; backdrop-filter: none; color-scheme: dark; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] { --message-surface: #f6f8f7; --message-raised: #fff; --message-hover: #f1f5f3; --message-detail: #f7faf8; --message-line: #dfe5e2; --message-line-strong: #c8d2cd; --message-text: #242927; --message-muted: #69736f; --message-subtle: #89928e; --message-accent: #168d7c; --message-accent-soft: #e7f6f2; --message-accent-line: #8dcfc2; --message-control: #f0f4f2; color-scheme: light; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { width: min(800px, -40px + 100vw); min-height: 0px; max-height: calc(-40px + 100dvh); border: 1px solid var(--message-line-strong); border-radius: 8px; background-image: none; color: var(--message-text); box-shadow: rgba(16, 18, 17, 0.3) 0px 24px 64px; color-scheme: inherit; }

html.jn-light-mode body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, html[data-theme="light"] body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, body.jn-light-mode:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal, body[data-theme="light"]:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { box-shadow: rgba(35, 45, 41, 0.16) 0px 22px 58px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head { min-height: 78px; padding: 17px 64px 16px 20px; gap: 12px; border-bottom: 1px solid var(--message-line); background-image: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-icon { width: 40px; height: 40px; flex: 0 0 40px; border: 1px solid var(--message-accent-line); border-radius: 7px; background: var(--message-accent-soft); box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2 { color: var(--message-text); font-size: 19px; font-weight: 750; letter-spacing: 0px; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p { margin-top: 4px; color: var(--message-muted); font-size: 11px; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close { top: 21px; right: 18px; width: 32px; height: 32px; border: 1px solid var(--message-line); border-radius: 6px; background: var(--message-control); color: var(--message-muted); box-shadow: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close:hover { border-color: var(--message-line-strong); background: var(--message-hover); color: var(--message-text); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-tools { min-height: 50px; padding: 9px 18px; border-bottom: 1px solid var(--message-line); background-image: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-filter, .jn-message-read) { height: 30px; padding: 0px 12px; border-radius: 6px; font-size: 11px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-filter { border: 1px solid var(--message-accent); background: var(--message-accent); color: rgb(247, 255, 253); -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read { margin-left: auto; border: 1px solid var(--message-line); background: var(--message-control); color: var(--message-muted); -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-read:hover { border-color: var(--message-line-strong); background: var(--message-hover); color: var(--message-text); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { max-height: min(540px, -188px + 100dvh); padding: 13px 16px 16px; gap: 8px; background-image: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item { display: block; min-height: 0px; padding: 0px; overflow: hidden; border: 1px solid var(--message-line); border-radius: 7px; background-image: none; color: var(--message-text); box-shadow: none; transform: none; transition: border-color 0.18s, background-color 0.18s, box-shadow 0.18s; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover, html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded { border-color: var(--message-line-strong); background: var(--message-hover); transform: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-unread { border-color: var(--message-accent-line); background: var(--message-raised); box-shadow: inset 3px 0 0 var(--message-accent); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-summary { display: grid; grid-template-columns: minmax(0px, 1fr) auto; min-height: 54px; padding: 10px 12px 10px 14px; align-items: center; gap: 12px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-main { min-width: 0px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row { display: flex; min-width: 0px; align-items: center; gap: 8px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-type { display: inline-flex; flex: 0 0 auto; min-height: 20px; margin: 0px; padding: 0px 7px; align-items: center; border: 1px solid var(--message-accent-line); border-radius: 5px; background: var(--message-accent-soft); color: var(--message-accent); font-size: 10px; font-style: normal; font-weight: 750; line-height: 1; letter-spacing: 0px; white-space: nowrap; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row strong { display: block; flex: 0 1 auto; min-width: 0px; margin: 0px; overflow: hidden; color: var(--message-text); font-size: 13px; font-weight: 700; line-height: 1.35; letter-spacing: 0px; text-overflow: ellipsis; white-space: nowrap; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row time { display: block; flex: 0 0 auto; margin: 0px; color: var(--message-subtle); font-size: 10px; line-height: 1.3; white-space: nowrap; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side { display: flex; align-items: center; align-self: center; gap: 8px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side .jn-message-state { display: inline-flex; min-width: auto; height: 20px; padding: 0px 6px; align-items: center; justify-content: center; border: 1px solid var(--message-line); border-radius: 5px; background: transparent; color: var(--message-subtle); font-size: 9px; font-weight: 650; line-height: 1; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side .jn-message-state.is-unread { border-color: var(--message-accent-line); background: var(--message-accent-soft); color: var(--message-accent); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure { display: inline-flex; height: 28px; min-width: 88px; padding: 0px 5px 0px 9px; align-items: center; justify-content: flex-end; gap: 7px; border: 1px solid var(--message-line); border-radius: 6px; background: var(--message-control); color: var(--message-muted); transition: border-color 0.18s, background-color 0.18s, color 0.18s; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:hover .jn-message-disclosure, html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded .jn-message-disclosure { border-color: var(--message-accent-line); background: var(--message-accent-soft); color: var(--message-accent); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure b { font-size: 10px; font-weight: 700; line-height: 1; letter-spacing: 0px; white-space: nowrap; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure i { position: relative; display: block; width: 18px; height: 18px; flex: 0 0 18px; border: 1px solid; border-radius: 5px; color: currentcolor; font-size: 0px; transform: none; transition: transform 0.18s; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure i::before { content: ""; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: translate(-50%, -66%) rotate(45deg); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded .jn-message-disclosure i { transform: rotate(180deg); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail { display: block; max-height: 0px; margin: 0px 12px; padding: 0px 3px; overflow: hidden; border-width: 1px 0px 0px; border-style: solid none none; border-color: transparent currentcolor currentcolor; border-image: initial; border-radius: 0px; background: transparent; opacity: 0; box-shadow: none; transform: translateY(-3px); transition: max-height 0.28s, padding 0.22s, opacity 0.18s, transform 0.22s, border-color 0.18s; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item.is-expanded .jn-message-detail { max-height: 260px; padding: 11px 3px 13px; border-top-color: var(--message-line); opacity: 1; transform: translateY(0px); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail-head { display: flex; margin: 0px 0px 7px; align-items: center; color: var(--message-accent); font-size: 10px; font-weight: 750; line-height: 1.3; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail-head::before { content: ""; width: 3px; height: 12px; margin-right: 7px; border-radius: 2px; background: var(--message-accent); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p { margin: 0px; color: var(--message-muted); font-size: 12px; line-height: 1.65; -webkit-text-fill-color: currentcolor; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-empty { border-color: var(--message-line); background: var(--message-raised); color: var(--message-muted); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-status { border-color: var(--message-accent-line); background: var(--message-accent-soft); color: var(--message-accent); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-item:focus-visible { outline: 0px; border-color: var(--message-accent); box-shadow: 0 0 0 3px var(--message-accent-soft); }

@media (max-width: 760px) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] { padding: 10px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { width: calc(-20px + 100vw); max-height: calc(-20px + 100dvh); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head { min-height: 68px; padding: 12px 50px 12px 13px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-icon { width: 36px; height: 36px; flex-basis: 36px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head h2 { font-size: 16px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p { font-size: 10px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-close { top: 18px; right: 11px; width: 30px; height: 30px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-tools { min-height: 46px; padding: 8px 10px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { max-height: calc(-134px + 100dvh); padding: 9px; gap: 7px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-summary { grid-template-columns: minmax(0px, 1fr) auto; min-height: 60px; padding: 9px; gap: 8px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row { flex-wrap: wrap; gap: 5px 7px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row strong { flex: 1 1 calc(100% - 72px); font-size: 12px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row time { flex: 0 0 100%; padding-left: 1px; font-size: 9px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side .jn-message-state { display: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure { min-width: 28px; width: 28px; padding: 0px 4px; justify-content: center; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail { margin-inline: 9px; }
}

@media (max-width: 360px) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-type { max-width: 70px; overflow: hidden; text-overflow: ellipsis; }
}

@media (prefers-reduced-motion: reduce) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(.jn-message-item, .jn-message-disclosure, .jn-message-disclosure i, .jn-message-detail) { transition: none; }
}

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"], html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] :is(h2, p, strong, b, time, span, button, i) { text-shadow: none; filter: none; letter-spacing: 0px; -webkit-text-fill-color: currentcolor; font-synthesis: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p { color: var(--message-muted); font-size: 12px; font-weight: 500; line-height: 1.4; opacity: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] small.jn-message-type { min-height: 22px; font-size: 11px; font-weight: 700; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row strong { font-size: 14px; font-weight: 700; line-height: 1.4; opacity: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row time { color: var(--message-muted); font-size: 11px; font-weight: 500; line-height: 1.4; opacity: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-side .jn-message-state { height: 22px; font-size: 11px; font-weight: 600; opacity: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure b { font-size: 11px; font-weight: 650; opacity: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail-head { font-size: 11px; font-weight: 700; opacity: 1; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-detail p { color: var(--message-text); font-size: 13px; font-weight: 450; line-height: 1.7; opacity: 1; }

@media (max-width: 760px) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-head p { font-size: 11px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-summary { gap: 7px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row strong { font-size: 13px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-title-row time { font-size: 11px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure { width: auto; min-width: 76px; padding: 0px 4px 0px 8px; gap: 5px; }


html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure i { width: 16px; height: 16px; flex-basis: 16px; }
}

@media (max-width: 390px) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-summary { grid-template-columns: minmax(0px, 1fr) 68px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure { min-width: 68px; padding-left: 6px; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure b { font-size: 10px; }
}

@media (max-width: 760px) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] { padding: 10px; justify-content: center; place-items: center; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-modal { height: calc(-20px + 100dvh); min-height: 0px; max-height: calc(-20px + 100dvh); }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-list { flex: 1 1 auto; min-height: 0px; max-height: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure b { color: currentcolor; -webkit-text-fill-color: currentcolor; }
}

html body:not(.page-admin):not(#jnSiteMessageClearA):not(#jnSiteMessageClearB) .jn-message-layer.jn-message-layer[data-site-message-runtime="1"], body:not(.page-admin):not(#jnSiteMessageClearA):not(#jnSiteMessageClearB) .jn-message-layer.jn-message-layer[data-site-message-runtime="1"] { background: none transparent; backdrop-filter: none; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure { width: auto; min-width: 0px; height: 28px; padding: 0px 4px; gap: 0px; border: 0px; background: transparent; justify-content: flex-end; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure i, html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure i::before { display: none; content: none; width: 0px; height: 0px; flex: 0 0 0px; }

@media (max-width: 760px) {
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-summary { grid-template-columns: minmax(0px, 1fr) auto; }

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime="1"] .jn-message-disclosure b { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: nowrap; }
}

/* Extracted completely through paged browser CSSOM from old /user/assets/user.css; source order preserved. */




@media (max-width: 760px) {
html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] { position: fixed; inset: 0px; place-content: start flex-end; place-items: start end; padding: calc(max(10px,env(safe-area-inset-top,0px)) + 56px) max(8px,env(safe-area-inset-right,0px)) max(8px,env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px)); overflow: hidden; box-sizing: border-box; }






}

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-layer, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-layer { position: fixed; inset: 0px; z-index: 100360; display: grid; place-items: center; padding: 18px; background: rgba(8, 13, 24, 0.68); backdrop-filter: blur(16px) saturate(1.06); pointer-events: auto; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal { position: relative; z-index: 1; width: min(430px, -28px + 100vw); max-height: calc(-28px + 100dvh); overflow: auto; padding: 18px; border: 1px solid rgba(251, 191, 36, 0.24); border-radius: 22px; background: radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.2), transparent 32%), radial-gradient(circle at 92% 10%, rgba(168, 85, 247, 0.13), transparent 30%), linear-gradient(rgba(24, 29, 41, 0.98), rgba(13, 18, 30, 0.98)); color: rgb(255, 247, 237); box-shadow: rgba(8, 13, 24, 0.54) 0px 34px 110px, rgba(255, 255, 255, 0.08) 0px 1px 0px inset; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal::-webkit-scrollbar, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal::-webkit-scrollbar { width: 0px; height: 0px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-close, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-close { position: absolute; right: 14px; top: 14px; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 11px; background: rgba(255, 255, 255, 0.08); color: rgb(255, 247, 237); font-size: 20px; line-height: 1; cursor: pointer; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-head, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-head { display: flex; align-items: center; gap: 12px; margin: 0px 0px 14px; padding-right: 38px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-icon, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: linear-gradient(135deg, rgb(245, 158, 11), rgb(249, 115, 22)); color: rgb(255, 255, 255); font-size: 24px; font-weight: 900; box-shadow: rgba(249, 115, 22, 0.28) 0px 14px 30px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-head h2, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-head h2 { margin: 0px; color: rgb(255, 247, 237); font-size: 22px; font-weight: 900; letter-spacing: 0px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-head p, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-head p { margin: 4px 0px 0px; color: rgba(254, 243, 199, 0.72); font-size: 12px; line-height: 1.35; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; margin: 0px 0px 12px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats > div, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats > div, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones > div, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones > div, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot > div, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot > div { border: 1px solid rgba(251, 191, 36, 0.16); border-radius: 16px; background: rgba(255, 255, 255, 0.06); padding: 12px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats strong, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats strong, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot strong, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot strong { display: block; color: rgb(251, 191, 36); font-size: 20px; font-weight: 900; line-height: 1.1; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats span, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-stats span, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot span, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot span { display: block; margin-top: 5px; color: rgba(254, 243, 199, 0.7); font-size: 12px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress { margin: 0px 0px 12px; padding: 12px; border: 1px solid rgba(251, 191, 36, 0.16); border-radius: 16px; background: rgba(255, 255, 255, 0.05); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress div, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress div { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: rgb(253, 230, 138); font-size: 12px; font-weight: 800; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress i, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress i { display: block; height: 7px; margin-top: 10px; border-radius: 999px; background: rgba(255, 255, 255, 0.1); overflow: hidden; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress b, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-progress b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, rgb(251, 191, 36), rgb(251, 113, 133)); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 8px; margin: 0px 0px 12px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones b, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones b { display: block; color: rgb(255, 247, 237); font-size: 17px; font-weight: 900; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones span, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones span { display: block; margin-top: 4px; color: rgba(254, 243, 199, 0.7); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones em, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones em { display: block; margin-top: 6px; color: rgb(251, 191, 36); font-style: normal; font-size: 11px; font-weight: 900; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-primary, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-primary { width: 100%; height: 44px; border: 0px; border-radius: 15px; background: linear-gradient(135deg, rgb(245, 158, 11), rgb(249, 115, 22)); color: rgb(255, 255, 255); font-size: 15px; font-weight: 900; cursor: pointer; box-shadow: rgba(249, 115, 22, 0.26) 0px 14px 32px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-primary:disabled, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-primary:disabled { cursor: not-allowed; opacity: 0.62; box-shadow: none; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-tomorrow, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-tomorrow, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-note, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-note { margin: 10px 0px 0px; text-align: center; color: rgba(254, 243, 199, 0.72); font-size: 12px; line-height: 1.35; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar { margin-top: 12px; padding: 12px; border: 1px solid rgba(251, 191, 36, 0.14); border-radius: 17px; background: rgba(255, 255, 255, 0.043); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; color: rgb(255, 247, 237); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head strong, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head strong { font-size: 13px; font-weight: 900; color: rgb(255, 247, 237); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head div, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head div { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head span, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-calendar-head span { font-size: 10px; color: rgba(254, 243, 199, 0.68); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-weekdays, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-weekdays, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days { display: grid; grid-template-columns: repeat(7, minmax(0px, 1fr)); gap: 6px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-weekdays span, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-weekdays span { text-align: center; color: rgba(254, 243, 199, 0.55); font-size: 10px; font-weight: 900; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span { position: relative; min-height: 34px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 10px; background: rgba(255, 255, 255, 0.05); color: rgb(255, 247, 237); font-size: 12px; font-weight: 900; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span.is-blank, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span.is-blank { visibility: hidden; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span.is-signed, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span.is-signed { border-color: rgba(251, 191, 36, 0.42); background: rgba(251, 191, 36, 0.14); color: rgb(254, 243, 199); }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span.is-today, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days span.is-today { box-shadow: rgba(251, 191, 36, 0.28) 0px 0px 0px 2px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days i, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-days i { position: absolute; right: 4px; top: 2px; color: rgb(251, 191, 36); font-style: normal; font-size: 10px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-foot { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; margin-top: 12px; }

html.jn-light-mode body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-layer, html[data-theme="light"] body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-layer, body.jn-light-mode:not(.page-admin) [data-front-app-public-root] .jn-checkin-layer, body[data-theme="light"]:not(.page-admin) [data-front-app-public-root] .jn-checkin-layer { background: rgba(241, 245, 249, 0.68); }

html.jn-light-mode body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal, html[data-theme="light"] body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal, body.jn-light-mode:not(.page-admin) [data-front-app-public-root] .jn-checkin-modal, body[data-theme="light"]:not(.page-admin) [data-front-app-public-root] .jn-checkin-modal { background: radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.16), transparent 32%), radial-gradient(circle at 92% 10%, rgba(168, 85, 247, 0.1), transparent 30%), linear-gradient(rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98)); color: rgb(23, 32, 51); box-shadow: rgba(15, 23, 42, 0.18) 0px 28px 80px, rgba(255, 255, 255, 0.95) 0px 1px 0px inset; }

html.jn-light-mode body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal :is(h2, strong, b), html[data-theme="light"] body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal :is(h2, strong, b), body.jn-light-mode:not(.page-admin) [data-front-app-public-root] .jn-checkin-modal :is(h2, strong, b), body[data-theme="light"]:not(.page-admin) [data-front-app-public-root] .jn-checkin-modal :is(h2, strong, b) { color: rgb(23, 32, 51); }

html.jn-light-mode body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal :is(p, span), html[data-theme="light"] body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal :is(p, span), body.jn-light-mode:not(.page-admin) [data-front-app-public-root] .jn-checkin-modal :is(p, span), body[data-theme="light"]:not(.page-admin) [data-front-app-public-root] .jn-checkin-modal :is(p, span) { color: rgb(100, 116, 139); }

@media (max-width: 760px) {
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-layer, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-layer { padding: 10px; place-items: center; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-modal { width: min(380px, -20px + 100vw); max-height: calc(-20px + 100dvh); padding: 14px; border-radius: 19px; }

html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones, body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-checkin-milestones { grid-template-columns: 1fr; }
}

body:not(.page-admin):not(.installation-page) :is(.front-shop-modal, .front-buy-panel, .front-profile-modal, .front-resource-modal, .front-ledger-modal, .front-ledger-shell, .front-ledger-body, .front-ledger-head, .front-ledger-other-row, .front-ledger-stat, .front-ledger-toolbar, .front-ledger-tabs, .jn-profile-modal, .jn-profile-panel, .jn-profile-hero, .jn-profile-card, .jn-profile-section, .jn-resource-modal, .jn-credit-ledger-modal, .jn-credit-panel, .jn-credit-toolbar, .jn-credit-stats, .jn-message-modal, .jn-checkin-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-detail-side, .record-detail-prompt, .gallery-detail-modal, .gallery-detail-side, .gallery-detail-prompt, .gallery-filter-menu, .oc-chat-options, .oc-chat-history-panel, .oc-chat-code-frame, .oc-chat-table-wrap, .ai-video-player-panel, .ai-video-frame-scan-card, .ai-draw-frame-scan-card, .ai-draw-reference-scan-card) { background: var(--lz-front-surface); background-image: none; border-color: var(--lz-front-line); color: var(--lz-front-text); box-shadow: var(--lz-front-shadow); }

body:not(.page-admin):not(.installation-page) :is(.front-shop-card, .front-shop-balance, .front-shop-redeem, .front-buy-row, .front-buy-summary, .front-profile-inline-panel, .front-profile-balance, .front-resource-row, .front-stat-card, .front-invite-commission-note, .front-invite-commission-grid span, .front-invite-reward, .front-ledger-row:not(.front-ledger-table-head), .front-ledger-other-list, .front-ledger-empty, .jn-credit-row:not(.jn-credit-table-head), .jn-credit-notice, .jn-credit-date-tabs, .jn-credit-filters, .jn-message-item, .jn-checkin-calendar, .jn-checkin-reward, .jn-work-card, .record-card, .records-card, .records-filter, .records-toolbar, .records-empty, .gallery-card, .gallery-toolbar, .gallery-footer, .gallery-empty, .oc-chat-card, .oc-chat-bubble, .oc-chat-rich, .oc-chat-artifact, .oc-chat-asset, .ai-draw-setting-card, .ai-draw-empty, .ai-draw-intro-card, .ai-video-composer-inner, .ai-video-status-card, .ai-video-intro-card, .ai-video-prompt-text, .ai-video-actions) { background: var(--lz-front-surface-2); background-image: none; border-color: var(--lz-front-line); color: var(--lz-front-text); box-shadow: none; }
body:not(.page-admin):not(.installation-page) .front-video-composer-frame { background: var(--lz-front-billing-surface); background-image: none; border-color: var(--lz-front-billing-border); color: var(--lz-front-billing-text); box-shadow: none; }

body:not(.page-admin):not(.installation-page) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer) { background: none rgba(2, 6, 23, 0.68); backdrop-filter: blur(12px); }

html.jn-light-mode body:not(.page-admin):not(.installation-page) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer), html[data-theme="light"] body:not(.page-admin):not(.installation-page) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer), body.jn-light-mode:not(.page-admin) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer), body[data-theme="light"]:not(.page-admin) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer) { background: rgba(226, 232, 240, 0.72); }

body:not(.page-admin):not(.installation-page) :is(h1, h2, h3, h4, .front-shop-head h2, .front-shop-card h3, .front-shop-price, .front-shop-balance strong, .front-buy-head h2, .front-buy-row strong, .front-profile-top h2, .front-profile-row-value, .front-resource-head h2, .front-resource-row strong, .front-stat-card strong, .front-ledger-title h2, .front-ledger-stat strong, .front-ledger-model, .front-ledger-other-row strong, .jn-profile-modal h2, .jn-profile-modal strong, .jn-resource-modal h2, .jn-credit-model, .jn-credit-cost, .jn-message-head h2, .jn-message-main strong, .jn-checkin-head h2, .record-detail-head h2, .record-detail-row strong, .gallery-detail-head h2, .gallery-prompt, .oc-chat-title, .oc-chat-message strong, .oc-chat-rich strong, .ai-draw-page h1, .ai-draw-page h2, .ai-video-page h1, .ai-video-page h2) { color: var(--lz-front-text); -webkit-text-fill-color: currentcolor; text-shadow: none; }

body:not(.page-admin):not(.installation-page) :is(p, .muted, .sub, .meta, .eyebrow, .front-shop-head p, .front-shop-desc, .front-shop-price small, .front-buy-row span, .front-profile-row-label, .front-resource-head p, .front-resource-row span, .front-ledger-title p, .front-ledger-muted, .front-ledger-table-head, .front-ledger-empty-inner p, .jn-profile-modal p, .jn-profile-modal small, .jn-resource-modal p, .jn-credit-cell, .jn-credit-table-head, .jn-message-head p, .jn-message-main time, .jn-checkin-head p, .record-detail-head p, .record-detail-row span:first-child, .gallery-meta, .gallery-stats, .gallery-detail-row span:first-child, .oc-chat-meta, .oc-chat-usage, .oc-chat-empty, .ai-draw-hint, .ai-video-time, .ai-video-meta) { color: var(--lz-front-muted); -webkit-text-fill-color: currentcolor; text-shadow: none; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-layer, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-layer { background: none transparent; backdrop-filter: none; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal { --jn-checkin-light-text: #1f2937; --jn-checkin-light-muted: #64748b; --jn-checkin-light-amber: #d97706; --jn-checkin-light-orange: #ea580c; --jn-checkin-light-line: rgba(245,158,11,.20); background-color: rgb(255, 254, 250); background-image: radial-gradient(circle at 12% 0%, rgba(251, 191, 36, 0.2), transparent 31%), radial-gradient(circle at 95% 7%, rgba(168, 85, 247, 0.09), transparent 27%), linear-gradient(rgb(255, 254, 250) 0%, rgb(255, 255, 255) 43%, rgb(255, 250, 245) 100%); border-color: rgba(245, 158, 11, 0.24); color: var(--jn-checkin-light-text); box-shadow: rgba(51, 65, 85, 0.2) 0px 30px 90px, rgba(255, 255, 255, 0.96) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-close, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-close { border-color: rgba(245, 158, 11, 0.16); background: rgba(255, 255, 255, 0.76); color: rgb(100, 116, 139); box-shadow: rgba(100, 116, 139, 0.1) 0px 5px 14px; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-close:hover, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-close:hover { background: rgb(255, 247, 237); border-color: rgba(234, 88, 12, 0.24); color: rgb(194, 65, 12); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-icon, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-icon { border: 1px solid rgba(255, 255, 255, 0.72); background: linear-gradient(135deg, rgb(251, 191, 36), rgb(249, 115, 22)); color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(249, 115, 22, 0.24) 0px 12px 26px, rgba(255, 255, 255, 0.34) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-head, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-head { background: transparent; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-head h2, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-head h2 { color: rgb(23, 32, 51); -webkit-text-fill-color: rgb(23, 32, 51); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-head p, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-head p { color: rgb(124, 106, 85); -webkit-text-fill-color: rgb(124, 106, 85); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-stats > div, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-stats > div { border-color: rgba(245, 158, 11, 0.2); background: linear-gradient(145deg, rgba(255, 251, 235, 0.96), rgba(255, 247, 237, 0.82)); box-shadow: rgba(180, 83, 9, 0.07) 0px 8px 22px, rgb(255, 255, 255) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-stats strong, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-stats strong { color: rgb(154, 52, 18); -webkit-text-fill-color: rgb(154, 52, 18); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-stats span, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-stats span { color: rgb(154, 106, 58); -webkit-text-fill-color: rgb(154, 106, 58); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress { border-color: rgba(245, 158, 11, 0.18); background: linear-gradient(135deg, rgba(255, 247, 237, 0.94), rgba(255, 251, 235, 0.88)); box-shadow: rgb(255, 255, 255) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress div, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress div { color: rgb(124, 90, 56); -webkit-text-fill-color: rgb(124, 90, 56); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress em, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress em { color: rgb(217, 119, 6); -webkit-text-fill-color: rgb(217, 119, 6); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress i, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress i { background: rgb(254, 215, 170); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress b, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-progress b { background: linear-gradient(90deg, rgb(245, 158, 11), rgb(251, 113, 133)); box-shadow: rgba(249, 115, 22, 0.24) 0px 2px 8px; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones > div, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones > div { border-color: rgba(245, 158, 11, 0.18); background: rgba(255, 255, 255, 0.78); box-shadow: rgba(100, 116, 139, 0.07) 0px 7px 18px, rgb(255, 255, 255) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones > div.is-done, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones > div.is-done { border-color: rgba(34, 197, 94, 0.28); background: rgb(240, 253, 244); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones b, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones b { background: rgb(255, 247, 237); color: rgb(194, 65, 12); -webkit-text-fill-color: rgb(194, 65, 12); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones span, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones span { color: rgb(71, 85, 105); -webkit-text-fill-color: rgb(71, 85, 105); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones em, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-milestones em { color: rgb(217, 119, 6); -webkit-text-fill-color: rgb(217, 119, 6); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-primary, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-primary { border: 0px; background: linear-gradient(135deg, rgb(251, 191, 36), rgb(249, 115, 22)); color: rgb(255, 255, 255); -webkit-text-fill-color: rgb(255, 255, 255); box-shadow: rgba(249, 115, 22, 0.24) 0px 14px 30px; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-primary:hover:not(:disabled), body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-primary:hover:not(:disabled) { background: linear-gradient(135deg, rgb(245, 158, 11), rgb(234, 88, 12)); box-shadow: rgba(249, 115, 22, 0.3) 0px 16px 34px; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-primary:disabled, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-primary:disabled { opacity: 1; background: linear-gradient(135deg, rgb(255, 237, 213), rgb(254, 215, 170)); color: rgb(194, 65, 12); -webkit-text-fill-color: rgb(194, 65, 12); box-shadow: rgba(249, 115, 22, 0.14) 0px 0px 0px 1px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-tomorrow, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-tomorrow { color: rgb(154, 106, 58); -webkit-text-fill-color: rgb(154, 106, 58); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-note, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-note { border-color: rgba(245, 158, 11, 0.22); background: rgb(255, 247, 237); color: rgb(154, 91, 36); -webkit-text-fill-color: rgb(154, 91, 36); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-calendar, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-calendar { border-color: rgba(245, 158, 11, 0.16); background: rgba(255, 255, 255, 0.74); box-shadow: rgba(100, 116, 139, 0.07) 0px 9px 24px, rgb(255, 255, 255) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-calendar-head strong, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-calendar-head strong { color: rgb(51, 65, 85); -webkit-text-fill-color: rgb(51, 65, 85); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-calendar-head span, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-calendar-head span, :is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-weekdays span, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-weekdays span { color: rgb(100, 116, 139); -webkit-text-fill-color: rgb(100, 116, 139); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span { border-color: rgba(148, 163, 184, 0.22); background: linear-gradient(rgb(255, 255, 255), rgb(248, 250, 252)); color: rgb(51, 65, 85); -webkit-text-fill-color: rgb(51, 65, 85); box-shadow: rgba(100, 116, 139, 0.05) 0px 3px 8px; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span.is-signed, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span.is-signed { border-color: rgba(34, 197, 94, 0.3); background: linear-gradient(rgb(240, 253, 244), rgb(220, 252, 231)); color: rgb(21, 128, 61); -webkit-text-fill-color: rgb(21, 128, 61); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span.is-today, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span.is-today { border-color: rgb(245, 158, 11); background: rgb(255, 247, 237); color: rgb(194, 65, 12); -webkit-text-fill-color: rgb(194, 65, 12); box-shadow: rgba(245, 158, 11, 0.14) 0px 0px 0px 2px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span.is-milestone:not(.is-signed), body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days span.is-milestone:not(.is-signed) { border-color: rgba(139, 92, 246, 0.28); background: rgb(245, 243, 255); color: rgb(124, 58, 237); -webkit-text-fill-color: rgb(124, 58, 237); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days i, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-days i { color: rgb(22, 163, 74); -webkit-text-fill-color: rgb(22, 163, 74); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-foot > div, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-foot > div { border-color: rgba(245, 158, 11, 0.18); background: linear-gradient(145deg, rgba(255, 251, 235, 0.92), rgba(255, 247, 237, 0.76)); box-shadow: rgba(180, 83, 9, 0.06) 0px 7px 18px, rgb(255, 255, 255) 0px 1px 0px inset; }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-foot span, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-foot span { color: rgb(154, 106, 58); -webkit-text-fill-color: rgb(154, 106, 58); }

:is(html.jn-light-mode, html[data-theme="light"]) body:not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-foot strong, body:is(.jn-light-mode, [data-theme="light"]):not(#jnCheckinLightA):not(#jnCheckinLightB):not(#jnCheckinLightC):not(.page-admin) .jn-checkin-modal .jn-checkin-foot strong { color: rgb(154, 52, 18); -webkit-text-fill-color: rgb(154, 52, 18); }

html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog],
html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime],
html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"],
html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime],
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime]),
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer,
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer,
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer,
html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog,
html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] { background: none transparent; backdrop-filter: none; }

@media (max-width: 760px) {
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog], html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime], html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"], html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime]), html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer, html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog { position: fixed; inset: 0px; place-content: start flex-end; place-items: start end; padding: calc(max(10px,env(safe-area-inset-top,0px)) + 56px) max(8px,env(safe-area-inset-right,0px)) max(8px,env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px)); overflow: hidden; box-sizing: border-box; }

html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] > .front-profile-modal, html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime] > .jn-checkin-modal, html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime] > .jn-checkin-reward-modal, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"] > .front-resource-modal, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"] > .front-resource-modal, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] > .front-resource-modal, html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime] > .jn-message-modal, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime]) > .jn-system-notice-modal, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer > .front-shop-modal, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer > .front-buy-panel, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer > .jn-payment-panel, html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog] > .jn-payment-panel, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog > .jn-api-key-panel, html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] > .customer-modal { max-height: calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px); }

html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][hidden], html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime][hidden], html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"][hidden], html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime][hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime])[hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer[hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer[hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer[hidden], html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog[hidden], html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime][hidden] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] { display: none; }
}

/* Old browser compatibility and template runtime dialog overrides, original sheet order preserved. */
/* source sheet 4 */
html.jn-browser-compat body:not(.page-admin) .enterprise-alert-layer, html.jn-browser-compat body:not(.page-admin) .front-creative-confirm-layer, html.jn-browser-compat body:not(.page-admin) .front-creative-video-confirm-layer, html.jn-browser-compat body:not(.page-admin) .front-profile-layer, html.jn-browser-compat body:not(.page-admin) .front-resource-layer, html.jn-browser-compat body:not(.page-admin) .front-shop-layer, html.jn-browser-compat body:not(.page-admin) .front-buy-layer, html.jn-browser-compat body:not(.page-admin) .jn-checkin-layer, html.jn-browser-compat body:not(.page-admin) .jn-message-layer, html.jn-browser-compat body:not(.page-admin) .jn-payment-layer, html.jn-browser-compat body:not(.page-admin) .jn-profile-layer, html.jn-browser-compat body:not(.page-admin) .jn-resource-layer, html.jn-browser-compat body:not(.page-admin) .record-detail-layer, html.jn-browser-compat body:not(.page-admin) .gallery-detail-layer, html.jn-browser-compat body:not(.page-admin) .ai-video-player-layer, html.jn-browser-compat body:not(.page-admin) .customer-modal-overlay, html.jn-browser-compat body:not(.page-admin) .modal-layer { box-sizing: border-box; top: var(--jn-compat-viewport-top, 0px); right: auto; bottom: auto; left: var(--jn-compat-viewport-left, 0px); width: var(--jn-compat-viewport-width, 100vw); height: var(--jn-compat-viewport-height, 100vh); max-width: var(--jn-compat-viewport-width, 100vw); max-height: var(--jn-compat-viewport-height, 100vh); padding: calc(8px + var(--jn-compat-safe-top, 0px)) calc(8px + var(--jn-compat-safe-right, 0px)) calc(8px + var(--jn-compat-safe-bottom, 0px)) calc(8px + var(--jn-compat-safe-left, 0px)); overscroll-behavior: contain; }

html.jn-browser-compat body:not(.page-admin) .enterprise-alert, html.jn-browser-compat body:not(.page-admin) .front-profile-modal, html.jn-browser-compat body:not(.page-admin) .front-resource-modal, html.jn-browser-compat body:not(.page-admin) .front-shop-modal, html.jn-browser-compat body:not(.page-admin) .front-ledger-modal, html.jn-browser-compat body:not(.page-admin) .jn-api-manager-modal, html.jn-browser-compat body:not(.page-admin) .jn-checkin-modal, html.jn-browser-compat body:not(.page-admin) .jn-credit-ledger-modal, html.jn-browser-compat body:not(.page-admin) .jn-message-modal, html.jn-browser-compat body:not(.page-admin) .jn-payment-panel, html.jn-browser-compat body:not(.page-admin) .jn-profile-modal, html.jn-browser-compat body:not(.page-admin) .jn-resource-modal, html.jn-browser-compat body:not(.page-admin) .record-detail-modal, html.jn-browser-compat body:not(.page-admin) .gallery-detail-modal, html.jn-browser-compat body:not(.page-admin) .ai-video-player-panel, html.jn-browser-compat body:not(.page-admin) .customer-modal { box-sizing: border-box; min-width: 0px; min-height: 0px; max-width: calc(var(--jn-compat-viewport-width, 100vw) - 16px - var(--jn-compat-safe-left, 0px) - var(--jn-compat-safe-right, 0px)); max-height: calc(var(--jn-compat-viewport-height, 100vh) - 16px - var(--jn-compat-safe-top, 0px) - var(--jn-compat-safe-bottom, 0px)); }

html.jn-browser-compat.jn-no-sticky .jn-profile-top, html.jn-browser-compat.jn-no-sticky .jn-payment-head, html.jn-browser-compat.jn-no-sticky .jn-message-head, html.jn-browser-compat.jn-no-sticky .recharge-v2-head, html.jn-browser-compat.jn-no-sticky .el-dialog__header, html.jn-browser-compat.jn-no-sticky .el-drawer__header { position: relative; top: auto; }

/* source sheet 6 */
html.jn-light-mode .front-resource-modal,
html.jn-light-mode .front-profile-modal,
html.jn-light-mode .front-shop-modal,
html.jn-light-mode .front-buy-panel,
html.jn-light-mode .jn-message-modal,
html.jn-light-mode .jn-checkin-modal,
html.jn-light-mode .customer-modal,
html.jn-light-mode .account-bind-modal,
body.jn-light-mode .front-resource-modal,
body.jn-light-mode .front-profile-modal,
body.jn-light-mode .front-shop-modal,
body.jn-light-mode .front-buy-panel,
body.jn-light-mode .jn-message-modal,
body.jn-light-mode .jn-checkin-modal,
body.jn-light-mode .customer-modal,
body.jn-light-mode .account-bind-modal { background: rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; }

html.jn-light-mode .front-resource-layer,
html.jn-light-mode .front-profile-layer,
html.jn-light-mode .front-shop-layer,
html.jn-light-mode .front-buy-layer,
html.jn-light-mode .jn-message-layer,
html.jn-light-mode .jn-checkin-layer,
html.jn-light-mode .customer-modal-overlay,
body.jn-light-mode .front-resource-layer,
body.jn-light-mode .front-profile-layer,
body.jn-light-mode .front-shop-layer,
body.jn-light-mode .front-buy-layer,
body.jn-light-mode .jn-message-layer,
body.jn-light-mode .jn-checkin-layer,
body.jn-light-mode .customer-modal-overlay { background: rgba(226, 232, 240, 0.72); backdrop-filter: blur(12px); }

html.jn-light-mode h1,
html.jn-light-mode h2,
html.jn-light-mode h3,
html.jn-light-mode h4,
html.jn-light-mode .page-hd h1,
html.jn-light-mode .card-v3-head h3,
html.jn-light-mode .sidebar-brand-text h1,
html.jn-light-mode .sidebar-user-info strong,
html.jn-light-mode .front-resource-head h2,
html.jn-light-mode .front-resource-row strong,
html.jn-light-mode .front-stat-card strong,
html.jn-light-mode .front-profile-top h2,
html.jn-light-mode .front-profile-row-value,
html.jn-light-mode .jn-message-head h2,
html.jn-light-mode .jn-message-main strong,
html.jn-light-mode .chat-sidebar-title,
html.jn-light-mode .chat-conv-title,
html.jn-light-mode .chat-topbar-title,
html.jn-light-mode .chat-welcome-heading,
html.jn-light-mode .media-card .prompt,
body.jn-light-mode h1,
body.jn-light-mode h2,
body.jn-light-mode h3,
body.jn-light-mode h4,
body.jn-light-mode .page-hd h1,
body.jn-light-mode .card-v3-head h3,
body.jn-light-mode .sidebar-brand-text h1,
body.jn-light-mode .sidebar-user-info strong,
body.jn-light-mode .front-resource-head h2,
body.jn-light-mode .front-resource-row strong,
body.jn-light-mode .front-stat-card strong,
body.jn-light-mode .front-profile-top h2,
body.jn-light-mode .front-profile-row-value,
body.jn-light-mode .jn-message-head h2,
body.jn-light-mode .jn-message-main strong,
body.jn-light-mode .chat-sidebar-title,
body.jn-light-mode .chat-conv-title,
body.jn-light-mode .chat-topbar-title,
body.jn-light-mode .chat-welcome-heading,
body.jn-light-mode .media-card .prompt { color: rgb(15, 23, 42); }

html.jn-light-mode p,
html.jn-light-mode .muted,
html.jn-light-mode .sub,
html.jn-light-mode .eyebrow,
html.jn-light-mode .page-hd p,
html.jn-light-mode .sidebar-brand-text small,
html.jn-light-mode .sidebar-user-info span,
html.jn-light-mode .front-resource-head p,
html.jn-light-mode .front-resource-row span,
html.jn-light-mode .front-profile-row-label,
html.jn-light-mode .jn-message-head p,
html.jn-light-mode .jn-message-main time,
html.jn-light-mode .chat-sidebar-empty,
html.jn-light-mode .chat-conv-meta,
html.jn-light-mode .chat-welcome-text,
html.jn-light-mode .media-card .meta,
body.jn-light-mode p,
body.jn-light-mode .muted,
body.jn-light-mode .sub,
body.jn-light-mode .eyebrow,
body.jn-light-mode .page-hd p,
body.jn-light-mode .sidebar-brand-text small,
body.jn-light-mode .sidebar-user-info span,
body.jn-light-mode .front-resource-head p,
body.jn-light-mode .front-resource-row span,
body.jn-light-mode .front-profile-row-label,
body.jn-light-mode .jn-message-head p,
body.jn-light-mode .jn-message-main time,
body.jn-light-mode .chat-sidebar-empty,
body.jn-light-mode .chat-conv-meta,
body.jn-light-mode .chat-welcome-text,
body.jn-light-mode .media-card .meta { color: rgb(100, 116, 139); }

html.jn-light-mode .front-resource-row,
html.jn-light-mode .front-stat-card,
html.jn-light-mode .jn-message-item,
html.jn-light-mode .front-profile-inline-panel,
html.jn-light-mode .jn-work-card,
html.jn-light-mode .front-shop-card,
html.jn-light-mode .front-buy-row,
body.jn-light-mode .front-resource-row,
body.jn-light-mode .front-stat-card,
body.jn-light-mode .jn-message-item,
body.jn-light-mode .front-profile-inline-panel,
body.jn-light-mode .jn-work-card,
body.jn-light-mode .front-shop-card,
body.jn-light-mode .front-buy-row { background: rgb(248, 250, 252); border-color: rgba(15, 23, 42, 0.1); color: rgb(15, 23, 42); box-shadow: none; }

html.jn-light-mode .front-shop-modal,
html.jn-light-mode .front-buy-panel,
html.jn-light-mode .front-profile-modal,
html.jn-light-mode .front-resource-modal,
html.jn-light-mode .jn-message-modal,
html.jn-light-mode .jn-checkin-modal,
html.jn-light-mode .customer-modal,
html.jn-light-mode .account-bind-modal,
body.jn-light-mode .front-shop-modal,
body.jn-light-mode .front-buy-panel,
body.jn-light-mode .front-profile-modal,
body.jn-light-mode .front-resource-modal,
body.jn-light-mode .jn-message-modal,
body.jn-light-mode .jn-checkin-modal,
body.jn-light-mode .customer-modal,
body.jn-light-mode .account-bind-modal { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; }

html.jn-light-mode .front-shop-layer,
html.jn-light-mode .front-buy-layer,
html.jn-light-mode .front-profile-layer,
html.jn-light-mode .front-resource-layer,
html.jn-light-mode .jn-message-layer,
html.jn-light-mode .jn-checkin-layer,
html.jn-light-mode .customer-modal-overlay,
body.jn-light-mode .front-shop-layer,
body.jn-light-mode .front-buy-layer,
body.jn-light-mode .front-profile-layer,
body.jn-light-mode .front-resource-layer,
body.jn-light-mode .jn-message-layer,
body.jn-light-mode .jn-checkin-layer,
body.jn-light-mode .customer-modal-overlay { background: none rgba(226, 232, 240, 0.74); backdrop-filter: blur(12px); }

html.jn-light-mode .front-shop-modal *, html.jn-light-mode .front-buy-panel *, html.jn-light-mode .front-profile-modal *, html.jn-light-mode .front-resource-modal *, html.jn-light-mode .jn-message-modal *, html.jn-light-mode .jn-checkin-modal *, html.jn-light-mode .customer-modal *, html.jn-light-mode .account-bind-modal *, body.jn-light-mode .front-shop-modal *, body.jn-light-mode .front-buy-panel *, body.jn-light-mode .front-profile-modal *, body.jn-light-mode .front-resource-modal *, body.jn-light-mode .jn-message-modal *, body.jn-light-mode .jn-checkin-modal *, body.jn-light-mode .customer-modal *, body.jn-light-mode .account-bind-modal * { text-shadow: none; }

html.jn-light-mode .front-shop-head h2, html.jn-light-mode .front-buy-head h2, html.jn-light-mode .front-profile-top h2, html.jn-light-mode .front-resource-head h2, html.jn-light-mode .jn-message-head h2, html.jn-light-mode .jn-checkin-head h2, html.jn-light-mode .customer-modal h2, html.jn-light-mode .account-bind-modal h2, body.jn-light-mode .front-shop-head h2, body.jn-light-mode .front-buy-head h2, body.jn-light-mode .front-profile-top h2, body.jn-light-mode .front-resource-head h2, body.jn-light-mode .jn-message-head h2, body.jn-light-mode .jn-checkin-head h2, body.jn-light-mode .customer-modal h2, body.jn-light-mode .account-bind-modal h2 { color: rgb(15, 23, 42); }

html.jn-light-mode .front-shop-head p, html.jn-light-mode .front-shop-desc, html.jn-light-mode .front-buy-row span, html.jn-light-mode .front-profile-row-label, html.jn-light-mode .front-resource-head p, html.jn-light-mode .front-resource-row span, html.jn-light-mode .jn-message-head p, html.jn-light-mode .jn-message-main time, html.jn-light-mode .jn-checkin-head p, html.jn-light-mode .customer-modal p, html.jn-light-mode .account-bind-modal p, body.jn-light-mode .front-shop-head p, body.jn-light-mode .front-shop-desc, body.jn-light-mode .front-buy-row span, body.jn-light-mode .front-profile-row-label, body.jn-light-mode .front-resource-head p, body.jn-light-mode .front-resource-row span, body.jn-light-mode .jn-message-head p, body.jn-light-mode .jn-message-main time, body.jn-light-mode .jn-checkin-head p, body.jn-light-mode .customer-modal p, body.jn-light-mode .account-bind-modal p { color: rgb(100, 116, 139); }

html.jn-light-mode .front-shop-card, html.jn-light-mode .front-shop-balance, html.jn-light-mode .front-shop-redeem, html.jn-light-mode .front-buy-row, html.jn-light-mode .front-buy-summary, html.jn-light-mode .front-profile-inline-panel, html.jn-light-mode .front-profile-balance, html.jn-light-mode .front-resource-row, html.jn-light-mode .front-stat-card, html.jn-light-mode .jn-work-card, html.jn-light-mode .jn-message-item, html.jn-light-mode .jn-checkin-calendar, html.jn-light-mode .jn-checkin-reward, body.jn-light-mode .front-shop-card, body.jn-light-mode .front-shop-balance, body.jn-light-mode .front-shop-redeem, body.jn-light-mode .front-buy-row, body.jn-light-mode .front-buy-summary, body.jn-light-mode .front-profile-inline-panel, body.jn-light-mode .front-profile-balance, body.jn-light-mode .front-resource-row, body.jn-light-mode .front-stat-card, body.jn-light-mode .jn-work-card, body.jn-light-mode .jn-message-item, body.jn-light-mode .jn-checkin-calendar, body.jn-light-mode .jn-checkin-reward { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }

/* source sheet 13 */
@media (max-width: 760px) {
html body:not(.page-admin) [data-front-app-public-root] :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer), html body:not(.page-admin) :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer) { z-index: 2147483620; }

html body:not(.page-admin) [data-front-app-public-root] :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer), html body:not(.page-admin) :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer) { position: fixed; inset: 0px; display: flex; align-items: flex-start; justify-content: center; padding: calc(max(10px,env(safe-area-inset-top,0px)) + 56px) max(8px,env(safe-area-inset-right,0px)) 8px 8px; overflow: hidden; box-sizing: border-box; }

html body:not(.page-admin) [data-front-app-public-root] :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer)[hidden], html body:not(.page-admin) :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer)[hidden] { display: none; }

html body:not(.page-admin) [data-front-app-public-root] :is(.customer-modal, .jn-checkin-modal, .jn-checkin-reward-modal, .jn-message-modal, .jn-profile-modal, .front-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .front-resource-modal, .jn-credit-ledger-modal, .jn-system-notice-modal, .jn-front-announcement-modal, .front-shop-modal, .front-buy-panel, .account-bind-modal, .jn-payment-panel, .enterprise-alert, .jn-shop-modal, .jn-buy-panel), html body:not(.page-admin) :is(.customer-modal, .jn-checkin-modal, .jn-checkin-reward-modal, .jn-message-modal, .jn-profile-modal, .front-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .front-resource-modal, .jn-credit-ledger-modal, .jn-system-notice-modal, .jn-front-announcement-modal, .front-shop-modal, .front-buy-panel, .account-bind-modal, .jn-payment-panel, .enterprise-alert, .jn-shop-modal, .jn-buy-panel) { width: min(340px, -24px + 100vw); max-width: calc(-24px + 100vw); max-height: calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px); margin: 0px; box-sizing: border-box; }

html body:not(.page-admin) .jn-message-layer.jn-message-layer[data-site-message-runtime="1"], body:not(.page-admin) .jn-message-layer.jn-message-layer[data-site-message-runtime="1"] { align-items: center; justify-content: center; padding: 10px; background: none transparent; backdrop-filter: none; }
}

html body:not(.page-admin) .jn-message-layer.jn-message-layer[data-site-message-runtime="1"], body:not(.page-admin) .jn-message-layer.jn-message-layer[data-site-message-runtime="1"] { background: none transparent; backdrop-filter: none; }

html[data-theme=dark] body:not(.page-admin),
body[data-theme=dark]:not(.page-admin){
  --lz-front-bg:#101012;
  --lz-front-page:#111216;
  --lz-front-surface:#181a20;
  --lz-front-surface-2:#20232a;
  --lz-front-surface-3:#252832;
  --lz-front-line:rgba(255,255,255,.12);
  --lz-front-line-strong:rgba(255,255,255,.20);
  --lz-front-text:#f5f7fb;
  --lz-front-soft:#d7dce7;
  --lz-front-muted:#9aa3b2;
  --lz-front-accent:#3b82f6;
  --lz-front-accent-soft:rgba(59,130,246,.16);
  --lz-front-success:#34d399;
  --lz-front-warn:#fbbf24;
  --lz-front-danger:#fb7185;
  --lz-front-shadow:0 26px 82px rgba(0,0,0,.46);
  color-scheme:dark;
}

html.jn-light-mode body:not(.page-admin),
html[data-theme=light] body:not(.page-admin),
body.jn-light-mode:not(.page-admin),
body[data-theme=light]:not(.page-admin){
  --lz-front-bg:#f4f6fa;
  --lz-front-page:#f7f8fb;
  --lz-front-surface:#ffffff;
  --lz-front-surface-2:#f8fafc;
  --lz-front-surface-3:#eef2f7;
  --lz-front-line:rgba(15,23,42,.11);
  --lz-front-line-strong:rgba(15,23,42,.18);
  --lz-front-text:#0f172a;
  --lz-front-soft:#334155;
  --lz-front-muted:#64748b;
  --lz-front-accent:#2563eb;
  --lz-front-accent-soft:rgba(37,99,235,.10);
  --lz-front-success:#047857;
  --lz-front-warn:#b45309;
  --lz-front-danger:#dc2626;
  --lz-front-shadow:0 22px 70px rgba(15,23,42,.14);
  color-scheme:light;
}

html[data-theme=dark]:not(.jn-light-mode) body[class^=page-]:not(.page-admin):not(.jn-light-mode),
body[class^=page-][data-theme=dark]:not(.page-admin):not(.jn-light-mode){
  --front-bg:var(--front-video-chat-bg,#1b1c20);
  --front-surface:#171a20;
  --front-soft:#1f232b;
  --front-line:rgba(255,255,255,.10);
  --front-line-strong:rgba(255,255,255,.16);
  --front-text:#f2f2f2;
  --front-text-soft:#d4d4d8;
  --front-text-muted:#a1a1aa;
  --front-control-text:#d4d4d8;
  --main-bg:var(--front-video-chat-bg,#1b1c20);
  --main-surface:#171a20;
  --main-surface-soft:#1f232b;
  --line:rgba(255,255,255,.10);
  --line-strong:rgba(255,255,255,.16);
  --text:#f2f2f2;
  --text-soft:#d4d4d8;
  --text-muted:#a1a1aa;
  --chat-bg:var(--front-video-chat-bg,#1b1c20);
  --footer-bar:#171a20;
  --input-box:#171a20;
  --btn-normal:#1f232b;
  --text-placeholder:#71717a;
  background:var(--front-video-chat-bg,#1b1c20);
  background-image:none;
  color:#f2f2f2;
  color-scheme:dark;
}

html[data-theme=dark]:not(.jn-light-mode) body[class^=page-]:not(.page-admin):not(.jn-light-mode) :is(.sidebar-brand-text h1,.sidebar-user-info strong,.page-hd h1,.card-v3-head h3,.media-card .prompt,.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong),
body[class^=page-][data-theme=dark]:not(.page-admin):not(.jn-light-mode) :is(.sidebar-brand-text h1,.sidebar-user-info strong,.page-hd h1,.card-v3-head h3,.media-card .prompt,.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong){
  color:#f2f2f2;
  -webkit-text-fill-color:#f2f2f2;
  text-shadow:none;
}

html[data-theme=dark]:not(.jn-light-mode) body[class^=page-]:not(.page-admin):not(.jn-light-mode) :is(.sidebar-brand-text small,.sidebar-user-info span,.sidebar-member-badge,.sidebar-member-expire,.page-hd p,.card-v3-head .sub,.card-v3-head .eyebrow,.media-card .meta,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-count,.oc-chat-history-item-meta,.muted,.sub,.eyebrow),
body[class^=page-][data-theme=dark]:not(.page-admin):not(.jn-light-mode) :is(.sidebar-brand-text small,.sidebar-user-info span,.sidebar-member-badge,.sidebar-member-expire,.page-hd p,.card-v3-head .sub,.card-v3-head .eyebrow,.media-card .meta,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-count,.oc-chat-history-item-meta,.muted,.sub,.eyebrow){
  color:#a1a1aa;
  -webkit-text-fill-color:#a1a1aa;
  text-shadow:none;
}

html.jn-light-mode body[class^=page-]:not(.page-admin),
html[data-theme=light] body[class^=page-]:not(.page-admin),
body[class^=page-].jn-light-mode:not(.page-admin),
body[class^=page-][data-theme=light]:not(.page-admin){
  --front-bg:#f7f8fb;
  --front-surface:#ffffff;
  --front-soft:#f8fafc;
  --front-line:rgba(15,23,42,.12);
  --front-line-strong:rgba(15,23,42,.18);
  --front-text:#0f172a;
  --front-text-soft:#334155;
  --front-text-muted:#64748b;
  --front-control-text:#475569;
  --main-bg:#f7f8fb;
  --main-surface:#ffffff;
  --main-surface-soft:#f8fafc;
  --line:rgba(15,23,42,.12);
  --line-strong:rgba(15,23,42,.18);
  --text:#0f172a;
  --text-soft:#334155;
  --text-muted:#64748b;
  --chat-bg:#f7f8fb;
  --footer-bar:#ffffff;
  --input-box:#ffffff;
  --btn-normal:#f8fafc;
  --text-placeholder:#94a3b8;
  background:#f7f8fb;
  background-image:none;
  color:#0f172a;
  color-scheme:light;
}

html.jn-light-mode body[class^=page-]:not(.page-admin) :is(.sidebar-brand-text h1,.sidebar-user-info strong,.page-hd h1,.card-v3-head h3,.media-card .prompt,.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong),
html[data-theme=light] body[class^=page-]:not(.page-admin) :is(.sidebar-brand-text h1,.sidebar-user-info strong,.page-hd h1,.card-v3-head h3,.media-card .prompt,.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong),
body[class^=page-].jn-light-mode:not(.page-admin) :is(.sidebar-brand-text h1,.sidebar-user-info strong,.page-hd h1,.card-v3-head h3,.media-card .prompt,.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong){
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  text-shadow:none;
}

html.jn-light-mode body[class^=page-]:not(.page-admin) :is(.sidebar-brand-text small,.sidebar-user-info span,.sidebar-member-badge,.sidebar-member-expire,.page-hd p,.card-v3-head .sub,.card-v3-head .eyebrow,.media-card .meta,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-count,.oc-chat-history-item-meta,.muted,.sub,.eyebrow),
html[data-theme=light] body[class^=page-]:not(.page-admin) :is(.sidebar-brand-text small,.sidebar-user-info span,.sidebar-member-badge,.sidebar-member-expire,.page-hd p,.card-v3-head .sub,.card-v3-head .eyebrow,.media-card .meta,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-count,.oc-chat-history-item-meta,.muted,.sub,.eyebrow),
body[class^=page-].jn-light-mode:not(.page-admin) :is(.sidebar-brand-text small,.sidebar-user-info span,.sidebar-member-badge,.sidebar-member-expire,.page-hd p,.card-v3-head .sub,.card-v3-head .eyebrow,.media-card .meta,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-count,.oc-chat-history-item-meta,.muted,.sub,.eyebrow){
  color:#64748b;
  -webkit-text-fill-color:#64748b;
  text-shadow:none;
}

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime='1'] .jn-message-modal{
  background:var(--message-surface);
  background-image:none;
}

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime='1'] .jn-message-head{
  background:var(--message-raised);
  background-image:none;
}

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime='1'] .jn-message-tools,
html body:not(.page-admin) .jn-message-layer[data-site-message-runtime='1'] .jn-message-list{
  background:var(--message-surface);
  background-image:none;
}

html body:not(.page-admin) .jn-message-layer[data-site-message-runtime='1'] .jn-message-item{
  background:var(--message-raised);
  background-image:none;
}

body:not(.page-admin) .jn-message-layer :is(.jn-message-filter, .jn-message-read):focus-visible {
  outline: auto 1px -webkit-focus-ring-color;
  outline-offset: 0;
}

.front-resource-layer{position:fixed;inset:0;z-index:100035;display:grid;place-items:center;background:radial-gradient(circle at 52% 12%,rgba(34,211,238,.15),transparent 34%),radial-gradient(circle at 86% 22%,rgba(34,197,94,.10),transparent 30%),rgba(2,6,23,.70);backdrop-filter:blur(14px);padding:16px}
.front-resource-layer[hidden]{display:none}

/* 2026-07-16 invite rewards dialog visual refresh */
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact{
  --invite-surface:#181b21;
  --invite-raised:#20242c;
  --invite-soft:#1c2027;
  --invite-line:rgba(255,255,255,.11);
  --invite-line-strong:rgba(255,255,255,.17);
  --invite-text:#f4f7fb;
  --invite-muted:#98a4b5;
  --invite-blue:#4f8cff;
  --invite-green:#31c49a;
  --invite-amber:#f4b84a;
  position:relative;
  width:min(600px,calc(100vw - 32px));
  max-width:600px;
  max-height:calc(100dvh - 32px);
  padding:20px;
  overflow-x:hidden;
  overflow-y:auto;
  border:1px solid var(--invite-line);
  border-radius:16px;
  background:var(--invite-surface);
  background-image:none;
  color:var(--invite-text);
  box-shadow:0 24px 64px rgba(0,0,0,.38);
  scrollbar-width:thin;
  scrollbar-color:var(--invite-line-strong) transparent;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact::-webkit-scrollbar{width:6px}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact::-webkit-scrollbar-track{background:transparent}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact::-webkit-scrollbar-thumb{border-radius:999px;background:var(--invite-line-strong)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0 0 16px;
  padding:0 0 15px;
  border-bottom:1px solid var(--invite-line);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child{
  position:relative;
  min-width:0;
  padding-left:48px;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:36px;
  height:36px;
  border:1px solid rgba(49,196,154,.28);
  border-radius:10px;
  background:#15332d;
  transform:translateY(-50%);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::after{
  content:"";
  position:absolute;
  left:9px;
  top:50%;
  width:18px;
  height:18px;
  background:var(--invite-green);
  transform:translateY(-50%);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='13' rx='2'/%3E%3Cpath d='M12 8v13M3 12h18M7.5 8a2.5 2.5 0 1 1 0-5C11 3 12 8 12 8s1-5 4.5-5a2.5 2.5 0 1 1 0 5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='13' rx='2'/%3E%3Cpath d='M12 8v13M3 12h18M7.5 8a2.5 2.5 0 1 1 0-5C11 3 12 8 12 8s1-5 4.5-5a2.5 2.5 0 1 1 0 5'/%3E%3C/svg%3E") center/contain no-repeat;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head h2{
  margin:0;
  color:var(--invite-text);
  font-size:20px;
  font-weight:800;
  line-height:1.25;
  letter-spacing:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head p{
  margin:3px 0 0;
  color:var(--invite-muted);
  font-size:12px;
  font-weight:500;
  line-height:1.45;
  letter-spacing:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-close{
  width:34px;
  height:34px;
  min-width:34px;
  flex:0 0 34px;
  padding:0;
  border:1px solid var(--invite-line);
  border-radius:8px;
  background:var(--invite-raised);
  background-image:none;
  color:var(--invite-muted);
  font-size:20px;
  line-height:32px;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-close:hover{
  border-color:var(--invite-line-strong);
  background:#282d36;
  color:var(--invite-text);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward{
  position:relative;
  margin:0 0 12px;
  padding:13px 16px 13px 45px;
  overflow:hidden;
  border:1px solid rgba(49,196,154,.30);
  border-radius:10px;
  background:#15332d;
  background-image:none;
  color:#b7f3df;
  font-size:13px;
  font-weight:700;
  line-height:1.5;
  letter-spacing:0;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward::before{
  content:"";
  position:absolute;
  left:16px;
  top:50%;
  width:18px;
  height:18px;
  background:var(--invite-green);
  transform:translateY(-50%);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='5'/%3E%3Cpath d='M8.21 13.89 7 23l5-3 5 3-1.21-9.12'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='5'/%3E%3Cpath d='M8.21 13.89 7 23l5-3 5 3-1.21-9.12'/%3E%3C/svg%3E") center/contain no-repeat;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-note{
  display:grid;
  grid-template-columns:minmax(0,1fr) 214px;
  align-items:stretch;
  gap:16px;
  margin:0 0 12px;
  padding:16px;
  border:1px solid var(--invite-line);
  border-radius:10px;
  background:var(--invite-soft);
  background-image:none;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-note > div:first-child{
  min-width:0;
  padding-right:2px;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-note strong{
  display:block;
  margin:0 0 6px;
  color:var(--invite-text);
  font-size:14px;
  font-weight:750;
  line-height:1.35;
  letter-spacing:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-note p{
  margin:0;
  color:var(--invite-muted);
  font-size:11.5px;
  font-weight:500;
  line-height:1.65;
  letter-spacing:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid span{
  display:flex;
  min-width:0;
  padding:12px 10px;
  align-items:flex-start;
  justify-content:center;
  flex-direction:column;
  border:1px solid var(--invite-line);
  border-radius:8px;
  background:var(--invite-raised);
  background-image:none;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid span:first-child{border-top:2px solid var(--invite-green)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid span:last-child{border-top:2px solid var(--invite-blue)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid b{
  color:var(--invite-text);
  font-size:21px;
  font-weight:800;
  line-height:1.1;
  letter-spacing:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid small{
  margin-top:6px;
  color:var(--invite-muted);
  font-size:10px;
  font-weight:600;
  line-height:1.3;
  letter-spacing:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:0 0 12px;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card{
  position:relative;
  min-width:0;
  padding:13px 14px;
  overflow:hidden;
  border:1px solid var(--invite-line);
  border-radius:8px;
  background:var(--invite-raised);
  background-image:none;
  text-align:left;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:var(--invite-blue);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card:nth-child(2)::after{background:var(--invite-green)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card:nth-child(3)::after{background:var(--invite-amber)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card span{
  display:block;
  overflow:hidden;
  color:var(--invite-muted);
  font-size:10.5px;
  font-weight:600;
  line-height:1.3;
  letter-spacing:0;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card strong{
  display:block;
  margin-top:7px;
  overflow:hidden;
  color:var(--invite-text);
  font-size:20px;
  font-weight:800;
  line-height:1.1;
  letter-spacing:0;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-link{
  display:grid;
  grid-template-columns:minmax(0,1fr) 128px;
  gap:8px;
  margin:0 0 12px;
  padding:8px;
  border:1px solid var(--invite-line);
  border-radius:10px;
  background:var(--invite-soft);
  background-image:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-link input{
  box-sizing:border-box;
  width:100%;
  min-width:0;
  height:40px;
  padding:0 12px;
  border:1px solid var(--invite-line);
  border-radius:7px;
  outline:none;
  background:var(--invite-surface);
  background-image:none;
  color:var(--invite-text);
  font-size:12px;
  font-weight:500;
  line-height:40px;
  letter-spacing:0;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .jn-copy-btn{
  display:inline-flex;
  width:128px;
  min-width:128px;
  height:40px;
  padding:0 14px;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid transparent;
  border-radius:7px;
  background:#2563eb;
  background-image:none;
  color:#fff;
  -webkit-text-fill-color:#fff;
  font-size:12px;
  font-weight:750;
  line-height:1;
  letter-spacing:0;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .jn-copy-btn::before{
  content:"";
  width:15px;
  height:15px;
  flex:0 0 15px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E") center/contain no-repeat;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .jn-copy-btn:hover{background:#1d4ed8}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-list{
  display:grid;
  gap:7px;
  margin:0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  padding:11px 13px;
  align-items:center;
  border:1px solid var(--invite-line);
  border-radius:8px;
  background:var(--invite-soft);
  background-image:none;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-row strong{color:var(--invite-text);font-size:12px;letter-spacing:0}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-row span{color:var(--invite-muted);font-size:10.5px;letter-spacing:0}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-row em{color:var(--invite-green);font-size:12px;font-style:normal;font-weight:750;letter-spacing:0}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-empty{
  position:relative;
  display:flex;
  min-height:82px;
  margin:0;
  padding:44px 16px 14px;
  align-items:center;
  justify-content:center;
  border:1px dashed var(--invite-line-strong);
  border-radius:10px;
  background:transparent;
  background-image:none;
  color:var(--invite-muted);
  font-size:11.5px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:0;
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-empty::before{
  content:"";
  position:absolute;
  left:50%;
  top:15px;
  width:22px;
  height:22px;
  background:var(--invite-muted);
  opacity:.72;
  transform:translateX(-50%);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M19 8v6M22 11h-6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M19 8v6M22 11h-6'/%3E%3C/svg%3E") center/contain no-repeat;
}
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact,
html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact,
body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact{
  --invite-surface:#fff;
  --invite-raised:#f7f9fc;
  --invite-soft:#f3f6f9;
  --invite-line:#dde4ec;
  --invite-line-strong:#c8d2df;
  --invite-text:#172033;
  --invite-muted:#66758a;
  --invite-blue:#2563eb;
  --invite-green:#0f9f78;
  --invite-amber:#d99419;
  box-shadow:0 22px 60px rgba(25,39,64,.16);
}
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::before,
html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::before,
body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::before,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::before{border-color:#b9eadb;background:#e8f8f3}
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward,
html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward,
body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward{border-color:#b9eadb;background:#eaf9f4;color:#08795c}
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-close:hover,
html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-close:hover,
body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-close:hover,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-close:hover{background:#edf1f6}
@media(max-width:620px){
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"]{padding:14px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-modal.compact{
    width:min(100%,480px);
    max-width:480px;
    max-height:calc(100dvh - 28px);
    padding:16px;
    border-radius:14px;
  }
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head{margin-bottom:13px;padding-bottom:13px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child{padding-left:43px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::before{width:34px;height:34px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head > div:first-child::after{left:8px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head h2{font-size:18px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-head p{font-size:11px;white-space:normal}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-note{grid-template-columns:1fr;gap:12px;padding:14px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-commission-grid span{min-height:72px;padding:10px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card{padding:11px 10px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card strong{font-size:17px}
}
@media(max-width:430px){
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward{padding:11px 12px 11px 40px;font-size:12px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-reward::before{left:13px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-resource-stats{gap:6px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card{padding:10px 8px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card span{font-size:9.5px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-stat-card strong{font-size:16px}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .front-invite-link{grid-template-columns:1fr}
  html body:not(.page-admin) .front-resource-layer[data-resource-dialog="invite"] .jn-copy-btn{width:100%;min-width:0}
}

.front-invite-commission-grid span{gap:4px}
.front-resource-empty{text-align:center}
html.jn-browser-compat input,
html.jn-browser-compat textarea,
html.jn-browser-compat select{max-width:100%}
body:not(.page-admin) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([data-model-navigation-search]):not([data-workspace-model-picker-search]):not(.front-role-field-control),
  textarea:not(.front-creative-prompt-input):not(.front-chat-input):not(.front-role-field-control),
  select,
  .front-ledger-select,.front-ledger-range,.jn-credit-select,.jn-credit-range,
  .front-shop-redeem input,.oc-chat-select-trigger,.oc-chat-upload,
  .ai-draw-control,.ai-video-tool-btn
){
  background:var(--lz-front-surface);
  background-image:none;
  border-color:var(--lz-front-line-strong);
  color:var(--lz-front-text);
  -webkit-text-fill-color:currentColor;
  box-shadow:none;
}
html.jn-light-mode body[class^="page-"]:not(.page-admin) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([data-model-navigation-search]):not([data-workspace-model-picker-search]):not(.front-role-field-control),textarea:not(.front-creative-prompt-input):not(.front-chat-input):not(.front-role-field-control),select,.input-box,.chat-input-wrap,.oc-chat-history-search,.oc-chat-model-search),
html[data-theme="light"] body[class^="page-"]:not(.page-admin) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([data-model-navigation-search]):not([data-workspace-model-picker-search]):not(.front-role-field-control),textarea:not(.front-creative-prompt-input):not(.front-chat-input):not(.front-role-field-control),select,.input-box,.chat-input-wrap,.oc-chat-history-search,.oc-chat-model-search),
body[class^="page-"].jn-light-mode:not(.page-admin) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([data-model-navigation-search]):not([data-workspace-model-picker-search]):not(.front-role-field-control),textarea:not(.front-creative-prompt-input):not(.front-chat-input):not(.front-role-field-control),select,.input-box,.chat-input-wrap,.oc-chat-history-search,.oc-chat-model-search){
  background:#ffffff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#334155;
  -webkit-text-fill-color:#334155;
  box-shadow:0 14px 34px rgba(15,23,42,.08);
  text-shadow:none;
}

@media(max-width:760px){
  html body:not(.page-admin) .front-resource-layer.front-resource-layer > .front-resource-modal.front-resource-modal,
  body:not(.page-admin) .front-resource-layer.front-resource-layer > .front-resource-modal.front-resource-modal,
  html body:not(.page-admin) [data-front-app-public-root] .front-resource-layer.front-resource-layer > .front-resource-modal.front-resource-modal,
  body:not(.page-admin) [data-front-app-public-root] .front-resource-layer.front-resource-layer > .front-resource-modal.front-resource-modal{
    width:min(340px,calc(100vw - 24px));
    min-width:0;
    max-width:calc(100vw - 24px);
    height:auto;
    min-height:0;
    max-height:calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px);
    margin:0;
    box-sizing:border-box;
  }
}

.front-resource-layer[data-resource-dialog=invite] input[data-copy-source=invite-link] {
  transition: border-color .15s cubic-bezier(.16, 1, .3, 1), box-shadow .15s cubic-bezier(.16, 1, .3, 1);
}

@keyframes profileDialogIn{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
html body:not(.page-admin):not(.installation-page) :is(.front-profile-layer:not([data-profile-force="1"]), .jn-profile-layer:not([data-profile-force="1"]), .jn-checkin-layer, .jn-message-layer, .jn-system-notice-layer:not(.jn-front-announcement-layer), .front-resource-layer, .jn-resource-layer) { background: none transparent; backdrop-filter: none; }
html body:not(.page-admin):not(.installation-page):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary { height: 38px; padding: 0px 15px; border: 1px solid var(--api-border); border-radius: 8px; background-image: none; color: var(--api-text); -webkit-text-fill-color: var(--api-text); box-shadow: none; }
html body:not(.page-admin):not(.installation-page):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary { height: 32px; padding: 0px 12px; border-radius: 6px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] { --front-profile-backdrop: transparent; --front-profile-surface: #252b34; --front-profile-raised: #2b323d; --front-profile-hover: #323b47; --front-profile-field: #29313b; --front-profile-text: #edf2f7; --front-profile-muted: #9caaba; --front-profile-border: rgba(166,180,198,.18); --front-profile-border-strong: rgba(166,180,198,.30); --front-profile-accent: #4cc7bb; --front-profile-accent-hover: #64d6cb; --front-profile-accent-soft: rgba(76,199,187,.13); --front-profile-focus: rgba(76,199,187,.24); --front-profile-captcha-width: 128px; --front-profile-captcha-height: 42px; --front-profile-captcha-gap: 0px; --front-profile-captcha-radius: 8px; display: grid; place-items: center; padding: 24px; overflow: auto; background-image: none; -webkit-backdrop-filter: none; backdrop-filter: none; color-scheme: dark; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog][hidden] { display: none; }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog], html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog], body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog], body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] { --front-profile-backdrop: transparent; --front-profile-surface: #f8fafc; --front-profile-raised: #fff; --front-profile-hover: #edf2f7; --front-profile-field: #fff; --front-profile-text: #172033; --front-profile-muted: #64748b; --front-profile-border: rgba(71,85,105,.16); --front-profile-border-strong: rgba(71,85,105,.28); --front-profile-accent: #168f82; --front-profile-accent-hover: #0f7f74; --front-profile-accent-soft: rgba(22,143,130,.10); --front-profile-focus: rgba(22,143,130,.20); color-scheme: light; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal { position: relative; width: min(400px, -48px + 100vw); max-width: 400px; max-height: calc(-48px + 100dvh); margin: 0px; padding: 0px; overflow: hidden auto; border: 1px solid var(--front-profile-border-strong); border-radius: 8px; background-image: none; color: var(--front-profile-text); box-shadow: 0 22px 56px rgba(21,26,35,.32),0 0 0 1px var(--front-profile-border); text-shadow: none; color-scheme: inherit; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-top, .front-profile-hero, .front-profile-list, .front-profile-row, .front-profile-inline-panel, .front-profile-balance, .front-profile-balance-card) { box-sizing: border-box; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top { min-height: 62px; margin: 0px; padding: 14px 16px 14px 20px; border-top: 0px; border-right: 0px; border-left: 0px; border-image: initial; border-bottom: 1px solid var(--front-profile-border); background-image: none; color: var(--front-profile-text); box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top h2 { margin: 0px; color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); font-size: 18px; font-weight: 700; line-height: 1.3; letter-spacing: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top-actions { gap: 8px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero { min-height: 100px; margin: 0px; padding: 18px 20px; gap: 14px; border-top: 0px; border-right: 0px; border-left: 0px; border-image: initial; border-bottom: 1px solid var(--front-profile-border); border-radius: 0px; background-image: none; color: var(--front-profile-text); box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn { width: 62px; height: 62px; flex: 0 0 62px; padding: 0px; overflow: hidden; border: 3px solid var(--front-profile-surface); border-radius: 50%; background-image: none; color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); box-shadow: 0 0 0 2px var(--front-profile-border-strong),0 0 0 6px var(--front-profile-accent-soft); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn:hover { box-shadow: 0 0 0 2px var(--front-profile-accent),0 0 0 6px var(--front-profile-accent-soft); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-img { width: 100%; height: 100%; border: 0px; border-radius: inherit; object-fit: cover; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row { gap: 7px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row strong { color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); font-size: 16px; line-height: 1.35; letter-spacing: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-role { width: max-content; height: auto; margin-top: 4px; padding: 0px; border: 0px; background: none transparent; color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); box-shadow: none; font-size: 12px; line-height: 1.4; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-expire-line { margin-top: 3px; color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); font-size: 11px; line-height: 1.4; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-expire-line.is-active { color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-list { margin: 0px; padding: 4px 20px; border: 0px; border-radius: 0px; background-image: none; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row { min-height: 57px; margin: 0px; padding: 9px 0px; gap: 12px; border-top: 0px; border-right: 0px; border-left: 0px; border-image: initial; border-bottom: 1px solid var(--front-profile-border); border-radius: 0px; background: none transparent; color: var(--front-profile-text); box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row:last-of-type { border-bottom: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row > div { min-width: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-label { margin-bottom: 3px; color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); font-size: 11px; line-height: 1.3; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-value { display: block; max-width: 250px; overflow: hidden; color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); font-size: 13px; font-weight: 650; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-close-btn, .front-profile-edit-btn, .front-profile-row-action, .front-profile-secondary, .front-profile-panel-actions .secondary) { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; margin: 0px; padding: 0px 10px; border: 1px solid var(--front-profile-border); border-radius: 6px; background: var(--front-profile-raised); background-image: none; color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); box-shadow: none; font-size: 12px; font-weight: 600; line-height: 1; letter-spacing: 0px; transition: background-color 0.16s, border-color 0.16s, color 0.16s, transform 0.16s; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-close-btn, .front-profile-edit-btn) { width: 32px; padding: 0px; font-size: 19px; font-weight: 500; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-edit-btn { width: 27px; min-width: 27px; height: 27px; font-size: 14px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action { min-width: 58px; flex: 0 0 auto; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-close-btn, .front-profile-edit-btn, .front-profile-row-action, .front-profile-secondary, .front-profile-panel-actions .secondary):hover { border-color: var(--front-profile-border-strong); background: var(--front-profile-hover); color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-close-btn, .front-profile-edit-btn, .front-profile-row-action, .front-profile-secondary, .front-profile-panel-actions .secondary):active { transform: translateY(1px); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id { display: inline-flex; align-items: center; min-width: 0px; height: 32px; margin: 0px; padding: 0px 10px; overflow: hidden; border: 1px solid var(--front-profile-border); border-radius: 6px; background-image: none; color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); box-shadow: none; font-size: 11px; font-weight: 650; line-height: 1; letter-spacing: 0px; text-overflow: ellipsis; white-space: nowrap; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id:hover { border-color: var(--front-profile-accent); background: var(--front-profile-hover); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel { margin: 8px 0px 12px; padding: 14px; gap: 9px; border: 1px solid var(--front-profile-border); border-radius: 6px; background-image: none; color: var(--front-profile-text); box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel label { color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); font-size: 11px; line-height: 1.35; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-panel-actions { gap: 8px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; margin: 0px; padding: 14px 20px 20px; border-right: 0px; border-bottom: 0px; border-left: 0px; border-image: initial; border-top: 1px solid var(--front-profile-border); border-radius: 0px; background-image: none; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card { min-width: 0px; min-height: 70px; margin: 0px; padding: 12px 13px; border: 1px solid var(--front-profile-border); border-radius: 6px; background-image: none; color: var(--front-profile-text); box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card > span { color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); font-size: 11px; line-height: 1.3; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card :is(strong, b) { color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); font-size: 17px; line-height: 1.35; letter-spacing: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), textarea, select) { width: 100%; min-width: 0px; min-height: 38px; padding: 8px 11px; border: 1px solid var(--front-profile-border); border-radius: 6px; outline: 0px; background-image: none; color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); caret-color: var(--front-profile-accent); box-shadow: none; font-size: 13px; line-height: 1.4; letter-spacing: 0px; color-scheme: inherit; transition: border-color 0.16s, background-color 0.16s, box-shadow 0.16s; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal textarea { min-height: 88px; resize: vertical; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), textarea, select)::placeholder { color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); opacity: 0.82; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), textarea, select):hover { border-color: var(--front-profile-border-strong); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), textarea, select):focus { border-color: var(--front-profile-accent); box-shadow: 0 0 0 3px var(--front-profile-focus); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), textarea, select):disabled { border-color: var(--front-profile-border); background: var(--front-profile-hover); color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); cursor: not-allowed; opacity: 0.72; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal input:-webkit-autofill, html body:not(.page-admin):not(.installation-page) .front-profile-modal input:-webkit-autofill:hover, html body:not(.page-admin):not(.installation-page) .front-profile-modal input:-webkit-autofill:focus { -webkit-text-fill-color: var(--front-profile-text); caret-color: var(--front-profile-accent); box-shadow: 0 0 0 1000px var(--front-profile-field) inset; transition: background-color 9999s ease-out; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(button, input, textarea, select):focus-visible { outline: 0px; border-color: var(--front-profile-accent); box-shadow: 0 0 0 3px var(--front-profile-focus); }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-primary, .front-profile-panel-actions .primary, button.primary) { min-height: 38px; padding: 0px 14px; border: 1px solid var(--front-profile-accent); border-radius: 6px; background-image: none; color: rgb(247, 255, 253); -webkit-text-fill-color: rgb(247, 255, 253); box-shadow: none; font-weight: 700; letter-spacing: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-primary, .front-profile-panel-actions .primary, button.primary):hover { border-color: var(--front-profile-accent-hover); background: var(--front-profile-accent-hover); }
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] { padding: 12px; }}
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal { width: 100%; max-width: 400px; max-height: calc(-24px + 100dvh); }}
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top { padding-inline: 16px; }}
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-modal :is(.front-profile-hero, .front-profile-list) { padding-inline: 16px; }}
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance { padding: 12px 16px 16px; }}
@media (max-width: 360px){html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id { max-width: 118px; }}
@media (max-width: 360px){html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-value { max-width: 180px; }}
@media (prefers-reduced-motion: reduce){html body:not(.page-admin):not(.installation-page) .front-profile-modal * { transition: none; }}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-inline-panel { background-color: var(--front-profile-raised); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-inline-panel :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), textarea, select) { height: 38px; min-height: 38px; background-color: var(--front-profile-field); color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); opacity: 1; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-inline-panel :is(input[readonly], input:disabled, textarea[readonly], textarea:disabled, select:disabled) { background-color: var(--front-profile-hover); color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); opacity: 1; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-panel-actions :is(.primary, .secondary) { height: 38px; min-height: 38px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] { background-color: transparent; background-image: none; backdrop-filter: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] .front-profile-modal .front-profile-panel-actions button.primary { border-color: var(--front-profile-accent); background-color: var(--front-profile-accent); background-image: none; color: rgb(247, 255, 253); -webkit-text-fill-color: rgb(247, 255, 253); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] button.front-profile-avatar-btn.front-profile-avatar-btn { border: 3px solid var(--front-profile-surface); background-color: var(--front-profile-accent-soft); box-shadow: 0 0 0 2px var(--front-profile-border-strong),0 0 0 6px var(--front-profile-accent-soft); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] .front-profile-inline-panel.front-profile-inline-panel input[readonly][readonly] { background-color: var(--front-profile-hover); color: var(--front-profile-muted); -webkit-text-fill-color: var(--front-profile-muted); box-shadow: none; opacity: 1; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] .front-profile-panel-actions.front-profile-panel-actions button.primary.primary { border-color: var(--front-profile-accent); background-color: var(--front-profile-accent); background-image: none; color: rgb(247, 255, 253); -webkit-text-fill-color: rgb(247, 255, 253); box-shadow: none; }
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] { align-items: center; padding: 12px; }}
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] { max-height: calc(-24px + 100dvh); overflow: hidden auto; }}
html body:not(.page-admin):not(.installation-page):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions :is(.front-profile-secondary, .jn-api-primary) { width: auto; height: 32px; min-height: 32px; padding: 0px 13px; border-radius: 5px; box-shadow: none; }
html body:not(.page-admin):not(.installation-page):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions :is(.front-profile-secondary, .jn-api-primary) { height: 31px; min-height: 31px; padding: 0px 12px; font-size: 11.5px; font-weight: 600; }
html body:not(.page-admin):not(.installation-page):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary { border: 1px solid var(--api-line); background: transparent; color: var(--api-muted); -webkit-text-fill-color: var(--api-muted); box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] { --front-profile-backdrop: transparent; --front-profile-surface: rgba(28,29,31,.96); --front-profile-raised: #26282b; --front-profile-hover: #303236; --front-profile-field: #1f2022; --front-profile-text: #f2f3f4; --front-profile-muted: #a7aaae; --front-profile-border: rgba(255,255,255,.10); --front-profile-border-strong: rgba(255,255,255,.18); --front-profile-accent: #4cc7bb; --front-profile-accent-hover: #67d4ca; --front-profile-accent-soft: rgba(76,199,187,.13); --front-profile-focus: rgba(76,199,187,.24); background-image: none; -webkit-backdrop-filter: none; backdrop-filter: none; color-scheme: dark; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] .front-profile-modal { background: var(--front-profile-surface); border-color: var(--front-profile-border-strong); box-shadow: rgba(0, 0, 0, 0.48) 0px 28px 72px, rgba(255, 255, 255, 0.035) 0px 1px 0px inset; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] .front-profile-modal :is(.front-profile-top, .front-profile-hero, .front-profile-list, .front-profile-balance) { background: transparent; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] button.front-profile-avatar-btn.front-profile-avatar-btn.has-avatar-frame { position: relative; display: grid; place-items: center; overflow: visible; isolation: isolate; border: 0px; background: transparent; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-avatar-btn.has-avatar-frame::before { content: ""; position: absolute; inset: -6px; z-index: 2; display: block; border: 0px; border-radius: 50%; background: var(--jn-avatar-frame-image) center/100% 100% no-repeat; box-shadow: none; filter: drop-shadow(rgba(0, 0, 0, 0.26) 0px 8px 14px); pointer-events: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-avatar-btn.has-avatar-frame .front-profile-avatar-img { position: relative; z-index: 1; width: 52px; height: 52px; border-radius: 50%; background: rgb(32, 33, 36); box-shadow: 0 0 0 1px var(--front-profile-border-strong); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) { padding: 0px; border: 0px; background: transparent; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] { display: grid; gap: 7px; padding: 0px; border: 0px; background: transparent; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha][hidden] { display: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha-row { display: grid; grid-template-columns: minmax(0px, 1fr) var(--front-profile-captcha-width); gap: var(--front-profile-captcha-gap); align-items: stretch; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha-row > * { min-width: 0px; box-sizing: border-box; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha-row > input { width: 100%; max-width: 100%; height: var(--front-profile-captcha-height); min-height: var(--front-profile-captcha-height); margin: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) [data-profile-captcha] .jn-captcha { width: 100%; min-width: var(--front-profile-captcha-width); height: var(--front-profile-captcha-height); min-height: var(--front-profile-captcha-height); padding: 0px; overflow: hidden; border: 1px solid var(--front-profile-border-strong); background-image: none; color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); box-shadow: none; font-size: 17px; letter-spacing: 2px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) [data-profile-captcha] .jn-captcha [data-profile-captcha-digits] { display: block; width: 100%; height: 100%; overflow: hidden; white-space: nowrap; line-height: 1; text-align: center; color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) [data-profile-captcha] .jn-captcha [data-profile-captcha-digits] img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] small { min-height: 16px; color: var(--front-profile-muted); font-size: 11px; line-height: 1.4; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] small:empty { display: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha][data-captcha-state="passed"] small { color: var(--front-profile-accent); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha][data-captcha-state="failed"] small { color: rgb(253, 164, 175); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) :is(input:not([type="file"]):not([type="checkbox"]):not([type="radio"]), .jn-captcha), html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) .front-profile-panel-actions :is(.primary, .secondary) { height: 42px; min-height: 42px; border-radius: 8px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) [data-profile-captcha] .jn-captcha-row > input[data-profile-captcha-input] { border-right: 0px; border-radius: var(--front-profile-captcha-radius) 0px 0px var(--front-profile-captcha-radius); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) [data-profile-captcha] .jn-captcha-row > .jn-captcha[data-profile-captcha-refresh] { border-radius: 0px var(--front-profile-captcha-radius) var(--front-profile-captcha-radius) 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) .front-profile-code-actions { grid-template-columns: minmax(0px, 1fr) 104px; gap: 10px; align-items: center; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) .front-profile-code-actions button { width: 100%; padding: 0px 8px; white-space: nowrap; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) .front-profile-code-actions .primary { grid-column: 1 / -1; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 0px; min-height: 0px; margin: 0px 20px; padding: 14px 0px 16px; border-top: 1px solid var(--front-profile-border); border-right: 0px; border-bottom: 0px; border-left: 0px; border-radius: 0px; background: transparent; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card { display: flex; flex-direction: column; justify-content: center; gap: 4px; min-width: 0px; min-height: 48px; margin: 0px; padding: 0px 14px; border: 0px; border-radius: 0px; background: transparent; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card:first-child { padding-left: 0px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card { border-left: 1px solid var(--front-profile-border); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card > span { font-size: 11px; line-height: 1.3; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card :is(strong, b) { font-size: 16px; line-height: 1.25; letter-spacing: 0px; }
@media (max-width: 420px){html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha-row { grid-template-columns: minmax(0px, 1fr) var(--front-profile-captcha-width); }}
@media (max-width: 420px){html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal :is([data-profile-panel="phone"], [data-profile-panel="email"]) .front-profile-code-actions { grid-template-columns: minmax(0px, 1fr) 96px; }}
@media (max-width: 420px){html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance { margin-inline: 16px; padding: 12px 0px 14px; }}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form] { position: relative; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form] .front-profile-toast { position: sticky; left: auto; top: 12px; bottom: auto; z-index: 8; display: flex; align-items: center; gap: 9px; width: max-content; min-width: 0px; max-width: calc(100% - 32px); min-height: 38px; box-sizing: border-box; padding: 8px 13px 8px 11px; border: 1px solid var(--front-profile-border-strong); border-radius: 7px; background: rgba(24, 25, 27, 0.92); color: var(--front-profile-text); box-shadow: rgba(0, 0, 0, 0.38) 0px 12px 32px, rgba(255, 255, 255, 0.04) 0px 1px 0px inset; backdrop-filter: blur(12px) saturate(0.8); margin: 12px auto -50px; transform: none; text-align: left; font-size: 12px; font-weight: 700; line-height: 1.45; white-space: normal; animation: 0.16s ease-out 0s 1 normal none running frontProfileToastIn; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px; border-radius: 50%; background: var(--front-profile-muted); box-shadow: 0 0 0 4px var(--front-profile-border); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast[data-toast-type="success"] { border-color: var(--front-profile-accent); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast[data-toast-type="success"]::before { background: var(--front-profile-accent); box-shadow: 0 0 0 4px var(--front-profile-accent-soft); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast[data-toast-type="error"] { border-color: rgba(251, 113, 133, 0.34); }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast[data-toast-type="error"]::before { background: rgb(251, 113, 133); box-shadow: rgba(251, 113, 133, 0.12) 0px 0px 0px 4px; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast[hidden] { display: none; }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog], html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog], body.jn-light-mode:not(.page-admin) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog], body[data-theme="light"]:not(.page-admin) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] { --front-profile-backdrop: transparent; --front-profile-surface: rgba(249,250,251,.97); --front-profile-raised: #fff; --front-profile-hover: #f0f1f2; --front-profile-field: #fff; --front-profile-text: #202124; --front-profile-muted: #6d7176; --front-profile-border: rgba(32,33,36,.12); --front-profile-border-strong: rgba(32,33,36,.20); --front-profile-accent: #168f82; --front-profile-accent-hover: #0f7f74; --front-profile-accent-soft: rgba(22,143,130,.10); --front-profile-focus: rgba(22,143,130,.18); background-image: none; -webkit-backdrop-filter: none; backdrop-filter: none; color-scheme: light; }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal, html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal, body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal, body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal { background: var(--front-profile-surface); border-color: var(--front-profile-border-strong); box-shadow: rgba(35, 43, 52, 0.22) 0px 24px 64px, rgba(255, 255, 255, 0.72) 0px 1px 0px inset; }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn.has-avatar-frame .front-profile-avatar-img, html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn.has-avatar-frame .front-profile-avatar-img, body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn.has-avatar-frame .front-profile-avatar-img, body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn.has-avatar-frame .front-profile-avatar-img { background: rgb(238, 242, 245); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha, html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha, body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha, body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha { border-color: var(--front-profile-border-strong); background-image: none; color: var(--front-profile-accent); -webkit-text-fill-color: var(--front-profile-accent); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha][data-captcha-state="failed"] small, html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] [data-profile-captcha][data-captcha-state="failed"] small, body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] [data-profile-captcha][data-captcha-state="failed"] small, body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] [data-profile-captcha][data-captcha-state="failed"] small { color: rgb(196, 63, 86); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast, html[data-theme="light"] body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast, body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast, body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-toast { border-color: var(--front-profile-border-strong); background: rgba(255, 255, 255, 0.94); color: var(--front-profile-text); -webkit-text-fill-color: var(--front-profile-text); box-shadow: rgba(42, 50, 60, 0.18) 0px 12px 30px, rgba(255, 255, 255, 0.85) 0px 1px 0px inset; }
html body:not(.page-admin):not(.installation-page) .front-resource-layer[data-resource-dialog="api-tokens"] .front-profile-secondary { border-color: var(--api-line); background: transparent; color: var(--api-text); -webkit-text-fill-color: var(--api-text); box-shadow: none; }


@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form], body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] { width: min(344px, -28px + 100vw); max-width: calc(-28px + 100vw); height: auto; min-height: 0px; max-height: min(620px, -52px + 100dvh); overflow: hidden auto; padding: 0px 14px 14px; border-radius: 18px; overscroll-behavior: contain; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-top, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-top { position: sticky; top: 0px; z-index: 5; height: 50px; min-height: 50px; margin: 0px -14px; padding: 0px 12px; background: rgb(21, 22, 26); border-radius: 18px 18px 0px 0px; box-shadow: rgb(36, 38, 44) 0px 1px 0px; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-top h2, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-top h2 { font-size: 17px; line-height: 20px; white-space: nowrap; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-close-btn, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-close-btn { width: 34px; height: 34px; min-width: 34px; min-height: 34px; border-radius: 12px; font-size: 20px; line-height: 1; position: relative; z-index: 8; touch-action: manipulation; }}
@media (max-width: 760px){html.jn-light-mode body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-top, body.jn-light-mode:not(.page-admin) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-top { background: rgb(255, 255, 255); box-shadow: rgb(226, 232, 240) 0px 1px 0px; }}
html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero { grid-template-columns: 64px minmax(0px, 1fr); gap: 12px; align-items: center; min-height: 106px; margin: 12px 0px 14px; padding: 16px 14px 14px; border: 1px solid rgba(255, 255, 255, 0.09); border-radius: 16px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.027)); box-shadow: rgba(255, 255, 255, 0.07) 0px 1px 0px inset, rgba(0, 0, 0, 0.16) 0px 14px 32px; }
html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-avatar-btn, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-avatar-btn { width: 58px; height: 58px; box-shadow: rgba(255, 255, 255, 0.16) 0px 0px 0px 1px, rgba(255, 255, 255, 0.035) 0px 0px 0px 5px; }
html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero > div:last-child, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero > div:last-child { min-width: 0px; display: grid; grid-template-columns: minmax(0px, 1fr); gap: 6px; align-content: center; justify-items: start; text-align: left; padding: 7px 0px 0px; transform: none; }
html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-name-row, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-name-row { width: 100%; justify-content: flex-start; gap: 7px; transform: none; margin: 0px; }
html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-name-row strong, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-name-row strong, html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero:has(.jn-profile-expire-line.is-active) .jn-profile-name-row strong, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero:has(.jn-profile-expire-line.is-active) .jn-profile-name-row strong { max-width: calc(100% - 30px); color: rgb(248, 250, 252); -webkit-text-fill-color: rgb(248, 250, 252); background: none; text-shadow: none; font-size: 18px; line-height: 22px; }
html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-role, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-role, html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-expire-line, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-expire-line { place-self: start; margin-top: 0px; height: 22px; line-height: 22px; padding: 0px 9px; font-size: 10.5px; text-align: left; white-space: nowrap; }
html.jn-light-mode body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero, body.jn-light-mode:not(.page-admin) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero { background: none rgb(248, 250, 252); border-color: rgba(15, 23, 42, 0.1); box-shadow: rgba(15, 23, 42, 0.06) 0px 10px 26px; }
html.jn-light-mode body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-name-row strong, body.jn-light-mode:not(.page-admin) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-name-row strong { color: rgb(15, 23, 42); -webkit-text-fill-color: rgb(15, 23, 42); }
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-hero { grid-template-columns: 60px minmax(0px, 1fr); gap: 11px; min-height: 100px; padding: 15px 12px 13px; }}
@media (max-width: 520px){html body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-avatar-btn, body:not(.page-admin):not(.installation-page) form.jn-profile-modal[data-profile-dialog-form] .jn-profile-avatar-btn { width: 54px; height: 54px; }}
body:not(.page-admin):not(.installation-page) :is(.front-shop-modal, .front-buy-panel, .front-profile-modal, .front-resource-modal, .front-ledger-modal, .front-ledger-shell, .front-ledger-body, .front-ledger-head, .front-ledger-other-row, .front-ledger-stat, .front-ledger-toolbar, .front-ledger-tabs, .jn-profile-modal, .jn-profile-panel, .jn-profile-hero, .jn-profile-card, .jn-profile-section, .jn-resource-modal, .jn-credit-ledger-modal, .jn-credit-panel, .jn-credit-toolbar, .jn-credit-stats, .jn-message-modal, .jn-checkin-modal, .customer-modal, .account-bind-modal, .record-detail-modal, .record-detail-side, .record-detail-prompt, .gallery-detail-modal, .gallery-detail-side, .gallery-detail-prompt, .gallery-filter-menu, .oc-chat-options, .oc-chat-history-panel, .oc-chat-code-frame, .oc-chat-table-wrap, .ai-video-player-panel, .ai-video-frame-scan-card, .ai-draw-frame-scan-card, .ai-draw-reference-scan-card) { background-image: none; border-color: var(--lz-front-line); color: var(--lz-front-text); box-shadow: var(--lz-front-shadow); }
body:not(.page-admin):not(.installation-page) :is(.front-shop-card, .front-shop-balance, .front-shop-redeem, .front-buy-row, .front-buy-summary, .front-profile-inline-panel, .front-profile-balance, .front-resource-row, .front-stat-card, .front-invite-commission-note, .front-invite-commission-grid span, .front-invite-reward, .front-ledger-row:not(.front-ledger-table-head), .front-ledger-other-list, .front-ledger-empty, .jn-credit-row:not(.jn-credit-table-head), .jn-credit-notice, .jn-credit-date-tabs, .jn-credit-filters, .jn-message-item, .jn-checkin-calendar, .jn-checkin-reward, .jn-work-card, .record-card, .records-card, .records-filter, .records-toolbar, .records-empty, .gallery-card, .gallery-toolbar, .gallery-footer, .gallery-empty, .oc-chat-card, .oc-chat-bubble, .oc-chat-rich, .oc-chat-artifact, .oc-chat-asset, .front-video-composer-frame, .ai-draw-setting-card, .ai-draw-empty, .ai-draw-intro-card, .ai-video-composer-inner, .ai-video-status-card, .ai-video-intro-card, .ai-video-prompt-text, .ai-video-actions) { background-image: none; border-color: var(--lz-front-line); color: var(--lz-front-text); box-shadow: none; }
body:not(.page-admin):not(.installation-page) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer) { background: none rgba(2, 6, 23, 0.68); backdrop-filter: blur(12px); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer), html[data-theme="light"] body:not(.page-admin):not(.installation-page) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer), body.jn-light-mode:not(.page-admin) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer), body[data-theme="light"]:not(.page-admin) :is(.front-shop-layer, .front-buy-layer, .front-profile-layer, .front-resource-layer, .jn-resource-layer, .jn-profile-layer, .jn-message-layer, .jn-checkin-layer, .record-detail-layer, .gallery-detail-layer, .customer-modal-overlay, .account-bind-layer) { background: rgba(226, 232, 240, 0.72); }
html.jn-light-mode body.page-gallery .gallery-detail-layer, body.page-gallery.jn-light-mode .gallery-detail-layer { background: rgba(226, 232, 240, 0.62); }
body:not(.page-admin):not(.installation-page) :is(h1, h2, h3, h4, .front-shop-head h2, .front-shop-card h3, .front-shop-price, .front-shop-balance strong, .front-buy-head h2, .front-buy-row strong, .front-profile-top h2, .front-profile-row-value, .front-resource-head h2, .front-resource-row strong, .front-stat-card strong, .front-ledger-title h2, .front-ledger-stat strong, .front-ledger-model, .front-ledger-other-row strong, .jn-profile-modal h2, .jn-profile-modal strong, .jn-resource-modal h2, .jn-credit-model, .jn-credit-cost, .jn-message-head h2, .jn-message-main strong, .jn-checkin-head h2, .record-detail-head h2, .record-detail-row strong, .gallery-detail-head h2, .gallery-prompt, .oc-chat-title, .oc-chat-message strong, .oc-chat-rich strong, .ai-draw-page h1, .ai-draw-page h2, .ai-video-page h1, .ai-video-page h2) { color: var(--lz-front-text); -webkit-text-fill-color: currentcolor; text-shadow: none; }
body:not(.page-admin):not(.installation-page) :is(p, .muted, .sub, .meta, .eyebrow, .front-shop-head p, .front-shop-desc, .front-shop-price small, .front-buy-row span, .front-profile-row-label, .front-resource-head p, .front-resource-row span, .front-ledger-title p, .front-ledger-muted, .front-ledger-table-head, .front-ledger-empty-inner p, .jn-profile-modal p, .jn-profile-modal small, .jn-resource-modal p, .jn-credit-cell, .jn-credit-table-head, .jn-message-head p, .jn-message-main time, .jn-checkin-head p, .record-detail-head p, .record-detail-row span:first-child, .gallery-meta, .gallery-stats, .gallery-detail-row span:first-child, .oc-chat-meta, .oc-chat-usage, .oc-chat-empty, .ai-draw-hint, .ai-video-time, .ai-video-meta) { color: var(--lz-front-muted); -webkit-text-fill-color: currentcolor; text-shadow: none; }
body:not(.page-admin):not(.installation-page) :is(.front-shop-close, .front-resource-close, .front-profile-close-btn, .front-ledger-close, button[data-close-resource-dialog], button[data-quick-drawer-close], .front-shop-tab, .jn-pay-item span, .front-ledger-tab, .front-ledger-export, .jn-credit-tab, .jn-credit-export, .record-detail-close, .gallery-detail-close, .gallery-filter-trigger, .gallery-icon-btn, .gallery-more-menu button) { background-image: none; border-color: var(--lz-front-line); color: var(--lz-front-soft); -webkit-text-fill-color: currentcolor; box-shadow: none; }
html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog],
html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime],
html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"],
html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime],
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime]),
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer,
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer,
html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer,
html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog],
html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog,
html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] { background: none transparent; backdrop-filter: none; }
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog], html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime], html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"], html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime]), html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer, html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog { position: fixed; inset: 0px; place-content: start flex-end; place-items: start end; padding: calc(max(10px,env(safe-area-inset-top,0px)) + 56px) max(8px,env(safe-area-inset-right,0px)) max(8px,env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px)); overflow: hidden; box-sizing: border-box; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog] > .front-profile-modal, html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime] > .jn-checkin-modal, html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime] > .jn-checkin-reward-modal, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"] > .front-resource-modal, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"] > .front-resource-modal, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] > .front-resource-modal, html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime] > .jn-message-modal, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime]) > .jn-system-notice-modal, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer > .front-shop-modal, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer > .front-buy-panel, html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer > .jn-payment-panel, html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog] > .jn-payment-panel, html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog > .jn-api-key-panel, html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] > .customer-modal { max-height: calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px); }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][hidden], html body:not(.page-admin):not(.installation-page) .jn-checkin-layer.jn-checkin-layer[data-checkin-runtime][data-checkin-runtime][hidden], html body:not(.page-admin):not(.installation-page) .jn-checkin-reward-layer.jn-checkin-reward-layer[data-checkin-reward-runtime][data-checkin-reward-runtime][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="invite"][data-resource-dialog="invite"][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="credits"][data-resource-dialog="credits"][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"][hidden], html body:not(.page-admin):not(.installation-page) .jn-message-layer.jn-message-layer[data-site-message-runtime][data-site-message-runtime][hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-system-notice-layer.jn-system-notice-layer:not(.jn-front-announcement-layer):not([data-front-announcement-runtime])[hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-shop-layer.front-shop-layer[hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-buy-layer.front-buy-layer[hidden], html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .jn-payment-layer.jn-payment-layer[hidden], html body:not(.page-admin):not(.installation-page) .jn-payment-layer.jn-payment-layer[data-jn-payment-dialog][data-jn-payment-dialog][hidden], html body:not(.page-admin):not(.installation-page) .front-resource-layer.front-resource-layer[data-resource-dialog="api-tokens"][data-resource-dialog="api-tokens"] .jn-api-key-dialog.jn-api-key-dialog[hidden], html body:not(.page-admin):not(.installation-page) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime[data-customer-service-runtime][hidden] .customer-modal-overlay.customer-modal-overlay[data-customer-overlay] { display: none; }}
html.jn-browser-compat body:not(.page-admin):not(.installation-page) .enterprise-alert-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-creative-confirm-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-creative-video-confirm-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-profile-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-resource-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-shop-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-buy-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-checkin-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-message-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-payment-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-profile-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-resource-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .record-detail-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .gallery-detail-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .ai-video-player-layer, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .customer-modal-overlay, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .modal-layer { box-sizing: border-box; top: var(--jn-compat-viewport-top, 0px); right: auto; bottom: auto; left: var(--jn-compat-viewport-left, 0px); width: var(--jn-compat-viewport-width, 100vw); height: var(--jn-compat-viewport-height, 100vh); max-width: var(--jn-compat-viewport-width, 100vw); max-height: var(--jn-compat-viewport-height, 100vh); padding: calc(8px + var(--jn-compat-safe-top, 0px)) calc(8px + var(--jn-compat-safe-right, 0px)) calc(8px + var(--jn-compat-safe-bottom, 0px)) calc(8px + var(--jn-compat-safe-left, 0px)); overscroll-behavior: contain; }
html.jn-browser-compat body:not(.page-admin):not(.installation-page) .enterprise-alert, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-profile-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-resource-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-shop-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .front-ledger-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-api-manager-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-checkin-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-credit-ledger-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-message-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-payment-panel, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-profile-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .jn-resource-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .record-detail-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .gallery-detail-modal, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .ai-video-player-panel, html.jn-browser-compat body:not(.page-admin):not(.installation-page) .customer-modal { box-sizing: border-box; min-width: 0px; min-height: 0px; max-width: calc(var(--jn-compat-viewport-width, 100vw) - 16px - var(--jn-compat-safe-left, 0px) - var(--jn-compat-safe-right, 0px)); max-height: calc(var(--jn-compat-viewport-height, 100vh) - 16px - var(--jn-compat-safe-top, 0px) - var(--jn-compat-safe-bottom, 0px)); }
@media (max-width: 760px), (max-height: 680px){html.jn-browser-compat.jn-compat-keyboard-open body:not(.page-admin):not(.installation-page) .jn-payment-layer, html.jn-browser-compat.jn-compat-keyboard-open body:not(.page-admin):not(.installation-page) .jn-profile-layer, html.jn-browser-compat.jn-compat-keyboard-open body:not(.page-admin):not(.installation-page) .front-profile-layer, html.jn-browser-compat.jn-compat-keyboard-open body:not(.page-admin):not(.installation-page) .front-resource-layer, html.jn-browser-compat.jn-compat-keyboard-open body:not(.page-admin):not(.installation-page) .jn-resource-layer { align-items: flex-start; }}
html.jn-light-mode .front-resource-modal,
html.jn-light-mode .front-profile-modal,
html.jn-light-mode .front-shop-modal,
html.jn-light-mode .front-buy-panel,
html.jn-light-mode .jn-message-modal,
html.jn-light-mode .jn-checkin-modal,
html.jn-light-mode .customer-modal,
html.jn-light-mode .account-bind-modal,
body.jn-light-mode .front-resource-modal,
body.jn-light-mode .front-profile-modal,
body.jn-light-mode .front-shop-modal,
body.jn-light-mode .front-buy-panel,
body.jn-light-mode .jn-message-modal,
body.jn-light-mode .jn-checkin-modal,
body.jn-light-mode .customer-modal,
body.jn-light-mode .account-bind-modal { background: rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; }
html.jn-light-mode .front-resource-layer,
html.jn-light-mode .front-profile-layer,
html.jn-light-mode .front-shop-layer,
html.jn-light-mode .front-buy-layer,
html.jn-light-mode .jn-message-layer,
html.jn-light-mode .jn-checkin-layer,
html.jn-light-mode .customer-modal-overlay,
body.jn-light-mode .front-resource-layer,
body.jn-light-mode .front-profile-layer,
body.jn-light-mode .front-shop-layer,
body.jn-light-mode .front-buy-layer,
body.jn-light-mode .jn-message-layer,
body.jn-light-mode .jn-checkin-layer,
body.jn-light-mode .customer-modal-overlay { background: rgba(226, 232, 240, 0.72); backdrop-filter: blur(12px); }
html.jn-light-mode h1,
html.jn-light-mode h2,
html.jn-light-mode h3,
html.jn-light-mode h4,
html.jn-light-mode .page-hd h1,
html.jn-light-mode .card-v3-head h3,
html.jn-light-mode .sidebar-brand-text h1,
html.jn-light-mode .sidebar-user-info strong,
html.jn-light-mode .front-resource-head h2,
html.jn-light-mode .front-resource-row strong,
html.jn-light-mode .front-stat-card strong,
html.jn-light-mode .front-profile-top h2,
html.jn-light-mode .front-profile-row-value,
html.jn-light-mode .jn-message-head h2,
html.jn-light-mode .jn-message-main strong,
html.jn-light-mode .chat-sidebar-title,
html.jn-light-mode .chat-conv-title,
html.jn-light-mode .chat-topbar-title,
html.jn-light-mode .chat-welcome-heading,
html.jn-light-mode .media-card .prompt,
body.jn-light-mode h1,
body.jn-light-mode h2,
body.jn-light-mode h3,
body.jn-light-mode h4,
body.jn-light-mode .page-hd h1,
body.jn-light-mode .card-v3-head h3,
body.jn-light-mode .sidebar-brand-text h1,
body.jn-light-mode .sidebar-user-info strong,
body.jn-light-mode .front-resource-head h2,
body.jn-light-mode .front-resource-row strong,
body.jn-light-mode .front-stat-card strong,
body.jn-light-mode .front-profile-top h2,
body.jn-light-mode .front-profile-row-value,
body.jn-light-mode .jn-message-head h2,
body.jn-light-mode .jn-message-main strong,
body.jn-light-mode .chat-sidebar-title,
body.jn-light-mode .chat-conv-title,
body.jn-light-mode .chat-topbar-title,
body.jn-light-mode .chat-welcome-heading,
body.jn-light-mode .media-card .prompt { color: rgb(15, 23, 42); }
html.jn-light-mode p,
html.jn-light-mode .muted,
html.jn-light-mode .sub,
html.jn-light-mode .eyebrow,
html.jn-light-mode .page-hd p,
html.jn-light-mode .sidebar-brand-text small,
html.jn-light-mode .sidebar-user-info span,
html.jn-light-mode .front-resource-head p,
html.jn-light-mode .front-resource-row span,
html.jn-light-mode .front-profile-row-label,
html.jn-light-mode .jn-message-head p,
html.jn-light-mode .jn-message-main time,
html.jn-light-mode .chat-sidebar-empty,
html.jn-light-mode .chat-conv-meta,
html.jn-light-mode .chat-welcome-text,
html.jn-light-mode .media-card .meta,
body.jn-light-mode p,
body.jn-light-mode .muted,
body.jn-light-mode .sub,
body.jn-light-mode .eyebrow,
body.jn-light-mode .page-hd p,
body.jn-light-mode .sidebar-brand-text small,
body.jn-light-mode .sidebar-user-info span,
body.jn-light-mode .front-resource-head p,
body.jn-light-mode .front-resource-row span,
body.jn-light-mode .front-profile-row-label,
body.jn-light-mode .jn-message-head p,
body.jn-light-mode .jn-message-main time,
body.jn-light-mode .chat-sidebar-empty,
body.jn-light-mode .chat-conv-meta,
body.jn-light-mode .chat-welcome-text,
body.jn-light-mode .media-card .meta { color: rgb(100, 116, 139); }
html.jn-light-mode .btn:not(.primary):not(.danger),
html.jn-light-mode .page-btn:not(.primary),
body.jn-light-mode .btn:not(.primary):not(.danger),
body.jn-light-mode .page-btn:not(.primary) { background: rgb(238, 242, 247); border-color: rgba(15, 23, 42, 0.12); color: rgb(15, 23, 42); box-shadow: none; }
html.jn-light-mode .front-resource-row,
html.jn-light-mode .front-stat-card,
html.jn-light-mode .jn-message-item,
html.jn-light-mode .front-profile-inline-panel,
html.jn-light-mode .jn-work-card,
html.jn-light-mode .front-shop-card,
html.jn-light-mode .front-buy-row,
body.jn-light-mode .front-resource-row,
body.jn-light-mode .front-stat-card,
body.jn-light-mode .jn-message-item,
body.jn-light-mode .front-profile-inline-panel,
body.jn-light-mode .jn-work-card,
body.jn-light-mode .front-shop-card,
body.jn-light-mode .front-buy-row { background: rgb(248, 250, 252); border-color: rgba(15, 23, 42, 0.1); color: rgb(15, 23, 42); box-shadow: none; }
html.jn-light-mode .front-shop-modal,
html.jn-light-mode .front-buy-panel,
html.jn-light-mode .front-profile-modal,
html.jn-light-mode .front-resource-modal,
html.jn-light-mode .jn-message-modal,
html.jn-light-mode .jn-checkin-modal,
html.jn-light-mode .customer-modal,
html.jn-light-mode .account-bind-modal,
body.jn-light-mode .front-shop-modal,
body.jn-light-mode .front-buy-panel,
body.jn-light-mode .front-profile-modal,
body.jn-light-mode .front-resource-modal,
body.jn-light-mode .jn-message-modal,
body.jn-light-mode .jn-checkin-modal,
body.jn-light-mode .customer-modal,
body.jn-light-mode .account-bind-modal { background: none rgb(255, 255, 255); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); box-shadow: rgba(15, 23, 42, 0.16) 0px 28px 80px; }
html.jn-light-mode .front-shop-layer,
html.jn-light-mode .front-buy-layer,
html.jn-light-mode .front-profile-layer,
html.jn-light-mode .front-resource-layer,
html.jn-light-mode .jn-message-layer,
html.jn-light-mode .jn-checkin-layer,
html.jn-light-mode .customer-modal-overlay,
body.jn-light-mode .front-shop-layer,
body.jn-light-mode .front-buy-layer,
body.jn-light-mode .front-profile-layer,
body.jn-light-mode .front-resource-layer,
body.jn-light-mode .jn-message-layer,
body.jn-light-mode .jn-checkin-layer,
body.jn-light-mode .customer-modal-overlay { background: none rgba(226, 232, 240, 0.74); backdrop-filter: blur(12px); }
html.jn-light-mode .front-shop-modal *, html.jn-light-mode .front-buy-panel *, html.jn-light-mode .front-profile-modal *, html.jn-light-mode .front-resource-modal *, html.jn-light-mode .jn-message-modal *, html.jn-light-mode .jn-checkin-modal *, html.jn-light-mode .customer-modal *, html.jn-light-mode .account-bind-modal *, body.jn-light-mode .front-shop-modal *, body.jn-light-mode .front-buy-panel *, body.jn-light-mode .front-profile-modal *, body.jn-light-mode .front-resource-modal *, body.jn-light-mode .jn-message-modal *, body.jn-light-mode .jn-checkin-modal *, body.jn-light-mode .customer-modal *, body.jn-light-mode .account-bind-modal * { text-shadow: none; }
html.jn-light-mode .front-shop-head h2, html.jn-light-mode .front-buy-head h2, html.jn-light-mode .front-profile-top h2, html.jn-light-mode .front-resource-head h2, html.jn-light-mode .jn-message-head h2, html.jn-light-mode .jn-checkin-head h2, html.jn-light-mode .customer-modal h2, html.jn-light-mode .account-bind-modal h2, body.jn-light-mode .front-shop-head h2, body.jn-light-mode .front-buy-head h2, body.jn-light-mode .front-profile-top h2, body.jn-light-mode .front-resource-head h2, body.jn-light-mode .jn-message-head h2, body.jn-light-mode .jn-checkin-head h2, body.jn-light-mode .customer-modal h2, body.jn-light-mode .account-bind-modal h2 { color: rgb(15, 23, 42); }
html.jn-light-mode .front-shop-head p, html.jn-light-mode .front-shop-desc, html.jn-light-mode .front-buy-row span, html.jn-light-mode .front-profile-row-label, html.jn-light-mode .front-resource-head p, html.jn-light-mode .front-resource-row span, html.jn-light-mode .jn-message-head p, html.jn-light-mode .jn-message-main time, html.jn-light-mode .jn-checkin-head p, html.jn-light-mode .customer-modal p, html.jn-light-mode .account-bind-modal p, body.jn-light-mode .front-shop-head p, body.jn-light-mode .front-shop-desc, body.jn-light-mode .front-buy-row span, body.jn-light-mode .front-profile-row-label, body.jn-light-mode .front-resource-head p, body.jn-light-mode .front-resource-row span, body.jn-light-mode .jn-message-head p, body.jn-light-mode .jn-message-main time, body.jn-light-mode .jn-checkin-head p, body.jn-light-mode .customer-modal p, body.jn-light-mode .account-bind-modal p { color: rgb(100, 116, 139); }
html.jn-light-mode .front-shop-card, html.jn-light-mode .front-shop-balance, html.jn-light-mode .front-shop-redeem, html.jn-light-mode .front-buy-row, html.jn-light-mode .front-buy-summary, html.jn-light-mode .front-profile-inline-panel, html.jn-light-mode .front-profile-balance, html.jn-light-mode .front-resource-row, html.jn-light-mode .front-stat-card, html.jn-light-mode .jn-work-card, html.jn-light-mode .jn-message-item, html.jn-light-mode .jn-checkin-calendar, html.jn-light-mode .jn-checkin-reward, body.jn-light-mode .front-shop-card, body.jn-light-mode .front-shop-balance, body.jn-light-mode .front-shop-redeem, body.jn-light-mode .front-buy-row, body.jn-light-mode .front-buy-summary, body.jn-light-mode .front-profile-inline-panel, body.jn-light-mode .front-profile-balance, body.jn-light-mode .front-resource-row, body.jn-light-mode .front-stat-card, body.jn-light-mode .jn-work-card, body.jn-light-mode .jn-message-item, body.jn-light-mode .jn-checkin-calendar, body.jn-light-mode .jn-checkin-reward { background: none rgb(248, 250, 252); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.1); box-shadow: none; }
html.jn-light-mode .front-shop-close, html.jn-light-mode .front-resource-close, html.jn-light-mode .front-profile-close-btn, html.jn-light-mode button[data-close-resource-dialog], html.jn-light-mode button[data-quick-drawer-close], body.jn-light-mode .front-shop-close, body.jn-light-mode .front-resource-close, body.jn-light-mode .front-profile-close-btn, body.jn-light-mode button[data-close-resource-dialog], body.jn-light-mode button[data-quick-drawer-close] { background: rgb(238, 242, 247); color: rgb(15, 23, 42); border-color: rgba(15, 23, 42, 0.12); }
.front-profile-layer { position: fixed; inset: 0px; z-index: 100040; display: grid; place-items: center; background: rgba(0, 0, 0, 0.72); backdrop-filter: blur(10px); padding: 16px; }
.front-profile-layer[hidden] { display: none; }
.front-profile-modal { animation: 0.18s ease-out 0s 1 normal none running profileDialogIn; width: min(366px, -26px + 100vw); max-height: calc(-26px + 100dvh); overflow: auto; background: rgb(21, 22, 26); border: 1px solid rgb(43, 45, 52); border-radius: 7px; box-shadow: rgba(0, 0, 0, 0.52) 0px 28px 90px; color: rgb(246, 247, 251); padding: 0px 20px; }
.front-profile-modal::-webkit-scrollbar { width: 0px; height: 0px; }
.front-profile-top { height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgb(36, 38, 44); }
.front-profile-top h2 { margin: 0px; color: rgb(255, 255, 255); font-size: 20px; line-height: 1.1; font-weight: 1000; letter-spacing: 0px; }
.front-profile-top-actions { display: flex; align-items: center; gap: 7px; }
.front-profile-close-btn { width: 25px; height: 25px; border: 1px solid rgb(52, 55, 65); border-radius: 5px; background: rgb(36, 38, 45); color: rgb(203, 213, 225); cursor: pointer; font-size: 18px; line-height: 1; display: grid; place-items: center; padding: 0px; }
.front-profile-id { height: 22px; display: inline-flex; align-items: center; gap: 6px; padding: 0px 8px; border: 1px solid rgba(0, 216, 239, 0.48); border-radius: 5px; background: rgba(0, 216, 239, 0.1); color: rgb(0, 215, 239); font-size: 11px; font-weight: 900; cursor: pointer; }
.front-profile-id i { width: 11px; height: 11px; position: relative; display: inline-block; }
.front-profile-id i::before, .front-profile-id i::after { content: ""; position: absolute; border: 1px solid rgb(255, 139, 40); border-radius: 2px; }
.front-profile-id i::before { left: 2px; top: 1px; width: 6px; height: 7px; }
.front-profile-id i::after { left: 0px; top: 3px; width: 6px; height: 7px; background: rgb(21, 22, 26); }
.front-profile-hero { display: grid; grid-template-columns: 70px minmax(0px, 1fr); gap: 14px; align-items: center; padding: 20px 0px 24px; border-bottom: 1px solid rgb(36, 38, 44); }
.front-profile-avatar-btn { width: 64px; height: 64px; border: 0px; border-radius: 50%; background: rgb(9, 10, 13); padding: 0px; overflow: hidden; cursor: pointer; box-shadow: rgb(35, 37, 43) 0px 0px 0px 1px; }
.front-profile-avatar-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.front-profile-name-row { display: flex; align-items: center; gap: 7px; min-width: 0px; }
.front-profile-name-row strong { font-size: 17px; color: rgb(255, 255, 255); line-height: 1.25; max-width: 150px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.front-profile-edit-btn { width: 22px; height: 22px; border: 0px; border-radius: 5px; background: rgb(45, 48, 54); color: rgb(174, 181, 194); cursor: pointer; display: grid; place-items: center; font-size: 12px; }
.front-profile-role { display: inline-flex; margin-top: 8px; height: 25px; align-items: center; padding: 0px 12px; border-radius: 999px; border: 1px solid rgba(255, 218, 0, 0.55); background: rgba(255, 218, 0, 0.1); color: rgb(255, 216, 0); font-size: 12px; font-weight: 1000; }
.front-profile-list { display: grid; padding: 16px 0px; border-bottom: 1px solid rgb(36, 38, 44); }
.front-profile-row { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 12px; align-items: center; min-height: 70px; }
.front-profile-row-label { display: block; color: rgb(141, 146, 157); font-size: 12px; font-weight: 800; line-height: 1.2; }
.front-profile-row-value { display: block; max-width: 100%; margin-top: 12px; color: rgb(255, 255, 255); font-size: 13px; font-weight: 900; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.front-profile-row-action { height: 29px; min-width: 53px; padding: 0px 13px; border: 1px solid rgb(52, 55, 65); border-radius: 5px; background: rgb(36, 38, 45); color: rgb(246, 247, 251); font-size: 12px; font-weight: 900; cursor: pointer; white-space: nowrap; }
.front-profile-row-action:disabled { cursor: default; opacity: 0.55; }
.front-profile-balance { display: flex; align-items: center; justify-content: space-between; min-height: 68px; border-bottom: 1px solid rgb(36, 38, 44); }
.front-profile-balance span { color: rgb(162, 166, 176); font-size: 13px; font-weight: 900; }
.front-profile-balance strong { color: rgb(0, 229, 255); font-size: 18px; font-weight: 1000; }
.front-profile-balance strong::first-letter { color: rgb(255, 139, 40); }
.front-profile-inline-panel { display: none; margin: -3px 0px 12px; padding: 12px; border: 1px solid rgb(45, 48, 55); border-radius: 8px; background: rgb(29, 31, 37); gap: 9px; }
.front-profile-inline-panel.is-open { display: grid; }
.front-profile-inline-panel label { display: grid; gap: 6px; color: rgb(174, 180, 192); font-size: 11px; font-weight: 900; }
.front-profile-inline-panel input { height: 36px; border: 1px solid rgb(52, 55, 65); border-radius: 6px; background: rgb(17, 18, 22); color: rgb(255, 255, 255); padding: 0px 10px; outline: none; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; }
.front-profile-inline-panel input:focus { border-color: rgb(0, 215, 239); box-shadow: rgba(0, 216, 239, 0.1) 0px 0px 0px 3px; }
.front-profile-panel-actions { display: flex; gap: 8px; justify-content: flex-end; }
.front-profile-code-actions { display: grid; grid-template-columns: minmax(0px, 1fr) auto auto; align-items: center; }
.front-profile-code-actions input { width: 100%; min-width: 0px; box-sizing: border-box; }
.front-profile-panel-actions button { height: 32px; border-radius: 6px; font-size: 12px; font-weight: 1000; cursor: pointer; }
.front-profile-panel-actions .primary { border: 0px; background: rgb(0, 215, 239); color: rgb(6, 16, 20); padding: 0px 14px; }
.front-profile-panel-actions .secondary { border: 1px solid rgb(52, 55, 65); background: rgb(36, 38, 45); color: rgb(203, 213, 225); padding: 0px 12px; }
.front-profile-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 100060; min-width: 180px; max-width: calc(-32px + 100vw); padding: 11px 14px; border-radius: 14px; background: rgb(17, 24, 39); border: 1px solid rgba(148, 163, 184, 0.24); color: rgb(248, 250, 252); box-shadow: rgba(0, 0, 0, 0.32) 0px 18px 50px; text-align: center; font-size: 13px; }
.front-profile-toast[hidden] { display: none; }
@media (max-width: 520px){.front-profile-layer { padding: 10px; }}
@media (max-width: 520px){.front-profile-modal { width: min(360px, -20px + 100vw); max-height: calc(-20px + 100dvh); padding: 0px 16px; }}
@media (max-width: 520px){.front-profile-row { min-height: 66px; }}
@media (max-width: 520px){.front-profile-name-row strong { max-width: 132px; }}
@media (max-width: 520px){.front-profile-row-action { min-width: 48px; padding: 0px 10px; }}
@media (max-width: 520px){.front-profile-hero { grid-template-columns: 62px minmax(0px, 1fr); gap: 12px; }}
@media (max-width: 520px){.front-profile-avatar-btn { width: 58px; height: 58px; }}
@media (max-width: 520px){.front-profile-code-actions { grid-template-columns: 1fr 1fr; }}
@media (max-width: 520px){.front-profile-code-actions input { grid-column: 1 / -1; }}
.front-profile-expire-line { display: block; margin-top: 6px; color: rgb(143, 150, 163); font-size: 11px; font-weight: 800; line-height: 1.35; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.front-profile-expire-line.is-active { color: rgb(0, 214, 163); }
.front-profile-inline-panel input[readonly] { opacity: 0.78; cursor: not-allowed; background: rgb(23, 25, 31); color: rgb(143, 150, 163); }
.front-profile-balance { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; min-height: auto; padding: 12px 0px; }
.front-profile-balance-card { min-width: 0px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 12px; background: rgba(255, 255, 255, 0.043); padding: 10px 11px; }
.front-profile-balance-card span { display: block; color: rgb(162, 166, 176); font-size: 11px; font-weight: 900; }
.front-profile-balance-card strong { margin-top: 5px; line-height: 1.1; display: block; color: rgb(0, 229, 255); font-size: 16px; font-weight: 1000; }
.front-profile-balance-card strong::first-letter { color: inherit; }
html:not(.jn-light-mode):not([data-theme="light"]) body:not(.jn-light-mode):not([data-theme="light"]):not(.page-admin) .front-profile-layer[data-profile-dialog] [data-profile-avatar-input] { background: rgb(36, 36, 36); border: 1px solid rgb(45, 45, 45); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-balance-card, body.jn-light-mode:not(.page-admin) .front-profile-balance-card { background: rgb(255, 255, 255); border-color: rgba(15, 23, 42, 0.1); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-balance-card strong, body.jn-light-mode:not(.page-admin) .front-profile-balance-card strong { color: rgb(37, 99, 235); }
html.jn-light-mode body:not(.page-admin):not(.installation-page) .front-profile-inline-panel input[readonly], body.jn-light-mode:not(.page-admin) .front-profile-inline-panel input[readonly] { background: rgb(241, 245, 249); color: rgb(100, 116, 139); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] { --front-profile-light-surface: #fff; --front-profile-light-raised: #fafafa; --front-profile-light-field: #fff; --front-profile-light-text: #171717; --front-profile-light-muted: #737373; --front-profile-light-border: rgba(23,23,23,.12); --front-profile-light-border-strong: rgba(23,23,23,.22); --front-profile-light-accent: #404040; --front-profile-light-accent-soft: rgba(23,23,23,.05); --front-profile-surface: #fff; --front-profile-raised: #fafafa; --front-profile-hover: #f5f5f5; --front-profile-field: #fff; --front-profile-text: #171717; --front-profile-muted: #737373; --front-profile-border: rgba(23,23,23,.12); --front-profile-border-strong: rgba(23,23,23,.22); --front-profile-accent: #404040; --front-profile-accent-hover: #262626; --front-profile-accent-soft: rgba(23,23,23,.05); --front-profile-focus: rgba(23,23,23,.12); background: rgba(228, 228, 231, 0.72); color-scheme: light; }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-modal { background: var(--front-profile-light-surface); border-color: var(--front-profile-light-border-strong); color: var(--front-profile-light-text); box-shadow: rgba(35, 43, 52, 0.22) 0px 24px 64px; }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] :is(.front-profile-top, .front-profile-hero, .front-profile-list, .front-profile-balance) { border-color: var(--front-profile-light-border); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] :is(.front-profile-top h2, .front-profile-name-row strong, .front-profile-row-value) { color: var(--front-profile-light-text); -webkit-text-fill-color: var(--front-profile-light-text); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] :is(.front-profile-row-label, .front-profile-balance span, .front-profile-inline-panel label, .front-profile-expire-line) { color: var(--front-profile-light-muted); -webkit-text-fill-color: var(--front-profile-light-muted); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-expire-line.is-active { color: var(--front-profile-light-accent); -webkit-text-fill-color: var(--front-profile-light-accent); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] :is(.front-profile-close-btn, .front-profile-edit-btn, .front-profile-panel-actions .secondary) { border-color: var(--front-profile-light-border); background: var(--front-profile-light-raised); color: rgb(82, 82, 82); -webkit-text-fill-color: rgb(82, 82, 82); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] :is(.front-profile-close-btn, .front-profile-edit-btn, .front-profile-panel-actions .secondary):hover { border-color: var(--front-profile-light-border-strong); background: rgb(245, 245, 245); color: rgb(38, 38, 38); -webkit-text-fill-color: rgb(38, 38, 38); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] :is(.front-profile-id, .front-profile-row-action) { border-color: rgb(212, 212, 212); background: rgb(250, 250, 250); color: rgb(64, 64, 64); -webkit-text-fill-color: rgb(64, 64, 64); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-id i::before, :is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-id i::after { border-color: rgb(115, 115, 115); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-id i::after { background: var(--front-profile-light-surface); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-role { border-color: rgb(212, 212, 212); background: rgb(250, 250, 250); color: rgb(82, 82, 82); -webkit-text-fill-color: rgb(82, 82, 82); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn { background: rgb(245, 245, 245); box-shadow: 0 0 0 1px var(--front-profile-light-border-strong); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel { border-color: var(--front-profile-light-border); background: var(--front-profile-light-raised); color: var(--front-profile-light-text); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel input { border-color: var(--front-profile-light-border); background: var(--front-profile-light-field); color: var(--front-profile-light-text); -webkit-text-fill-color: var(--front-profile-light-text); caret-color: var(--front-profile-light-accent); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel input::placeholder { color: rgb(163, 163, 163); -webkit-text-fill-color: rgb(163, 163, 163); opacity: 1; }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel input:focus { border-color: rgb(115, 115, 115); box-shadow: rgba(23, 23, 23, 0.1) 0px 0px 0px 3px; }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel input[readonly] { background: rgb(245, 245, 245); color: var(--front-profile-light-muted); -webkit-text-fill-color: var(--front-profile-light-muted); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] [data-profile-captcha] .jn-captcha { border-color: var(--front-profile-light-border-strong); background: rgb(245, 245, 245); color: rgb(64, 64, 64); -webkit-text-fill-color: rgb(64, 64, 64); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-panel-actions .primary { border-color: rgb(212, 212, 212); background: rgb(245, 245, 245); color: rgb(64, 64, 64); -webkit-text-fill-color: rgb(64, 64, 64); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-panel-actions .primary:hover { border-color: rgb(189, 189, 189); background: rgb(229, 229, 229); color: rgb(38, 38, 38); -webkit-text-fill-color: rgb(38, 38, 38); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] .front-profile-panel-actions.front-profile-panel-actions button.primary.primary { border-color: rgb(212, 212, 212); background: none rgb(245, 245, 245); color: rgb(64, 64, 64); -webkit-text-fill-color: rgb(64, 64, 64); box-shadow: none; }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer.front-profile-layer.front-profile-layer[data-profile-dialog][data-profile-dialog][data-profile-dialog] .front-profile-modal.front-profile-modal[data-profile-dialog-form][data-profile-dialog-form] .front-profile-panel-actions.front-profile-panel-actions button.primary.primary:disabled { opacity: 1; border-color: rgb(212, 212, 212); background: rgb(245, 245, 245); color: rgb(115, 115, 115); -webkit-text-fill-color: rgb(115, 115, 115); cursor: not-allowed; }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-balance-card { border-color: var(--front-profile-light-border); background: var(--front-profile-light-raised); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-balance-card strong { color: rgb(38, 38, 38); -webkit-text-fill-color: rgb(38, 38, 38); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .jn-required-star { color: rgb(115, 115, 115); }
:is(html.jn-light-mode body:not(.page-admin):not(.installation-page), html[data-theme="light"] body:not(.page-admin):not(.installation-page), body.jn-light-mode:not(.page-admin), body[data-theme="light"]:not(.page-admin)) .front-profile-layer[data-profile-dialog] .front-profile-toast { border-color: var(--front-profile-light-border-strong); background: rgba(255, 255, 255, 0.96); color: var(--front-profile-light-text); -webkit-text-fill-color: var(--front-profile-light-text); box-shadow: rgba(42, 50, 60, 0.18) 0px 12px 30px; }
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer), html body:not(.page-admin):not(.installation-page) :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer) { z-index: 2147483620; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-profile-layer.front-profile-layer[data-profile-force="1"], body:not(.page-admin):not(.installation-page) [data-front-app-public-root] .front-profile-layer.front-profile-layer[data-profile-force="1"], html body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-force="1"], body:not(.page-admin):not(.installation-page) .front-profile-layer.front-profile-layer[data-profile-force="1"] { z-index: 2147483630; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer), html body:not(.page-admin):not(.installation-page) :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer) { position: fixed; inset: 0px; display: flex; align-items: flex-start; justify-content: center; padding: calc(max(10px,env(safe-area-inset-top,0px)) + 56px) max(8px,env(safe-area-inset-right,0px)) 8px 8px; overflow: hidden; box-sizing: border-box; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer)[hidden], html body:not(.page-admin):not(.installation-page) :is(.customer-modal-overlay.customer-modal-overlay, .jn-checkin-layer.jn-checkin-layer, .jn-checkin-reward-layer.jn-checkin-reward-layer, .jn-message-layer.jn-message-layer, .jn-profile-layer.jn-profile-layer, .front-profile-layer.front-profile-layer, .jn-resource-layer.jn-resource-layer, .front-resource-layer.front-resource-layer, .jn-system-notice-layer.jn-system-notice-layer, .jn-front-announcement-layer.jn-front-announcement-layer, [data-front-announcement-runtime][data-front-announcement-runtime], .front-shop-layer.front-shop-layer, .front-buy-layer.front-buy-layer, .account-bind-layer.account-bind-layer, .jn-payment-layer.jn-payment-layer, .enterprise-alert-layer.enterprise-alert-layer, .jn-shop-layer.jn-shop-layer, .jn-buy-layer.jn-buy-layer)[hidden] { display: none; }}
@media (max-width: 760px){html body:not(.page-admin):not(.installation-page) [data-front-app-public-root] :is(.customer-modal, .jn-checkin-modal, .jn-checkin-reward-modal, .jn-message-modal, .jn-profile-modal, .front-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .front-resource-modal, .jn-credit-ledger-modal, .jn-system-notice-modal, .jn-front-announcement-modal, .front-shop-modal, .front-buy-panel, .account-bind-modal, .jn-payment-panel, .enterprise-alert, .jn-shop-modal, .jn-buy-panel), html body:not(.page-admin):not(.installation-page) :is(.customer-modal, .jn-checkin-modal, .jn-checkin-reward-modal, .jn-message-modal, .jn-profile-modal, .front-profile-modal, .jn-resource-modal, .jn-resource-modal-api, .front-resource-modal, .jn-credit-ledger-modal, .jn-system-notice-modal, .jn-front-announcement-modal, .front-shop-modal, .front-buy-panel, .account-bind-modal, .jn-payment-panel, .enterprise-alert, .jn-shop-modal, .jn-buy-panel) { width: min(340px, -24px + 100vw); max-width: calc(-24px + 100vw); max-height: calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px); margin: 0px; box-sizing: border-box; }}

/* Modern account center profile dialog. Keeps all original actions while presenting grouped, theme-aware cards. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog]{--profile-balance-icon-offset:6px;
  --profile-surface:#111827;
  --profile-surface-2:#172033;
  --profile-card:rgba(30,41,59,.72);
  --profile-card-hover:rgba(39,51,72,.88);
  --profile-text:#f5f7fb;
  --profile-muted:#93a1b5;
  --profile-border:rgba(148,163,184,.17);
  --profile-accent:#7c6cf2;
  --profile-accent-rgb:124,108,242;
  --profile-teal:#4fc9bb;
  position:fixed;
  inset:0;
  z-index:2147483638;
  display:grid;
  place-items:center;
  padding:24px;
  overflow:auto;
  background:rgba(4,8,18,.66);
  -webkit-backdrop-filter:blur(16px) saturate(112%);
  backdrop-filter:blur(16px) saturate(112%);
  color-scheme:dark;
}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog][hidden]{display:none!important}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal{
  position:relative;
  width:min(640px,calc(100vw - 32px));
  max-width:640px;
  height:min(820px,calc(100dvh - 40px));
  max-height:calc(100dvh - 40px);
  margin:0;
  padding:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
  border:1px solid var(--profile-border);
  border-radius:24px;
  background:
    radial-gradient(circle at 13% -4%,rgba(var(--profile-accent-rgb),.18),transparent 34%),
    linear-gradient(160deg,var(--profile-surface-2),var(--profile-surface));
  color:var(--profile-text);
  box-shadow:0 34px 100px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06);
  animation:profileDialogIn .22s cubic-bezier(.2,.8,.2,1) both;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top{
  position:relative;
  z-index:4;
  min-height:86px;
  height:auto;
  margin:0;
  padding:18px 20px 16px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border:0;
  border-bottom:1px solid var(--profile-border);
  background:rgba(15,23,38,.72);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
  box-shadow:0 10px 28px rgba(5,9,18,.08);
}
html body:not(.page-admin):not(.installation-page) .front-profile-heading{min-width:0;display:grid;gap:3px}
html body:not(.page-admin):not(.installation-page) .front-profile-heading>span{color:var(--profile-teal);-webkit-text-fill-color:var(--profile-teal);font-size:9px;font-weight:850;line-height:1.2;letter-spacing:.18em}
html body:not(.page-admin):not(.installation-page) .front-profile-heading h2{margin:0;color:var(--profile-text);-webkit-text-fill-color:var(--profile-text);font-size:20px;font-weight:780;line-height:1.25;letter-spacing:-.02em}
html body:not(.page-admin):not(.installation-page) .front-profile-heading p{margin:0;color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:11px;line-height:1.4}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top-actions{display:flex;align-items:center;gap:9px;flex:none}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id{
  height:34px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 10px;
  border:1px solid rgba(var(--profile-accent-rgb),.28);
  border-radius:11px;
  background:rgba(var(--profile-accent-rgb),.10);
  color:#c9c3ff;
  -webkit-text-fill-color:#c9c3ff;
  font:700 11px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
  cursor:pointer;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id>span{height:18px;display:inline-grid;place-items:center;padding:0 5px;border-radius:6px;background:rgba(var(--profile-accent-rgb),.20);color:#fff;-webkit-text-fill-color:#fff;font:800 9px/1 system-ui,sans-serif;letter-spacing:.06em}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id i{width:13px;height:13px;position:relative;display:block}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id i::before,html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id i::after{content:"";position:absolute;width:7px;height:8px;border:1.5px solid currentColor;border-radius:2px;box-sizing:border-box}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id i::before{top:1px;right:1px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id i::after{left:1px;bottom:1px;background:var(--profile-surface-2)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-close-btn{
  width:36px;height:36px;display:grid;place-items:center;padding:0;border:1px solid var(--profile-border);border-radius:11px;background:rgba(255,255,255,.045);color:#aeb9c9;-webkit-text-fill-color:#aeb9c9;font:400 22px/1 system-ui,sans-serif;cursor:pointer;transition:.18s ease
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-close-btn:hover{border-color:rgba(var(--profile-accent-rgb),.42);background:rgba(var(--profile-accent-rgb),.13);color:#fff;-webkit-text-fill-color:#fff;transform:rotate(4deg)}
html body:not(.page-admin):not(.installation-page) .front-profile-scroll{min-height:0;padding:20px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.32) transparent}
html body:not(.page-admin):not(.installation-page) .front-profile-scroll::-webkit-scrollbar{width:6px}
html body:not(.page-admin):not(.installation-page) .front-profile-scroll::-webkit-scrollbar-thumb{border-radius:999px;background:rgba(148,163,184,.32)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero{
  position:relative;
  min-height:150px;
  margin:0;
  padding:24px;
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:20px;
  align-items:center;
  overflow:hidden;
  border:1px solid rgba(var(--profile-accent-rgb),.20);
  border-radius:20px;
  background:
    linear-gradient(120deg,rgba(var(--profile-accent-rgb),.17),rgba(79,201,187,.08) 54%,rgba(255,255,255,.025)),
    rgba(30,41,59,.56);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 18px 42px rgba(4,9,18,.12);
}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-orb{position:absolute;width:210px;height:210px;right:-76px;top:-110px;border-radius:50%;background:radial-gradient(circle,rgba(var(--profile-accent-rgb),.30),transparent 68%);filter:blur(2px);pointer-events:none}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn{
  position:relative;
  z-index:1;
  width:84px;height:84px;flex:0 0 84px;padding:0;overflow:visible;border:3px solid rgba(255,255,255,.86);border-radius:26px;background:#0a1020;color:var(--profile-accent);box-shadow:0 0 0 4px rgba(var(--profile-accent-rgb),.20),0 16px 36px rgba(4,8,18,.30);cursor:pointer;transition:transform .2s ease
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn:hover{transform:translateY(-2px) rotate(-1deg)}
html body:not(.page-admin):not(.installation-page) .front-profile-avatar-img{width:100%;height:100%;display:block;border-radius:22px;object-fit:cover}
html body:not(.page-admin):not(.installation-page) .front-profile-avatar-edit{position:absolute;right:-7px;bottom:-7px;width:30px;height:30px;display:grid;place-items:center;border:3px solid var(--profile-surface-2);border-radius:10px;background:linear-gradient(135deg,var(--profile-accent),#5d8df7);color:#fff;box-shadow:0 7px 18px rgba(var(--profile-accent-rgb),.35)}
html body:not(.page-admin):not(.installation-page) .front-profile-avatar-edit svg{width:15px;height:15px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-copy{position:relative;z-index:1;min-width:0;display:grid;gap:9px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row{display:flex;align-items:center;gap:9px;min-width:0}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row strong{max-width:320px;overflow:hidden;color:var(--profile-text);-webkit-text-fill-color:var(--profile-text);font-size:23px;font-weight:800;line-height:1.25;letter-spacing:-.03em;text-overflow:ellipsis;white-space:nowrap}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-edit-btn{width:28px;height:28px;display:grid;place-items:center;padding:0;border:1px solid var(--profile-border);border-radius:9px;background:rgba(255,255,255,.05);color:#b8c2d2;-webkit-text-fill-color:#b8c2d2;cursor:pointer}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-edit-btn svg{width:14px;height:14px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin):not(.installation-page) .front-profile-membership{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-role{height:25px;display:inline-flex;align-items:center;margin:0;padding:0 10px;border:1px solid rgba(79,201,187,.30);border-radius:999px;background:rgba(79,201,187,.11);color:#73ddd0;-webkit-text-fill-color:#73ddd0;font-size:10.5px;font-weight:800}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-expire-line{height:25px;display:inline-flex;align-items:center;margin:0;padding:0 10px;border:1px solid rgba(var(--profile-accent-rgb),.24);border-radius:999px;background:rgba(var(--profile-accent-rgb),.09);color:#bdb7f9;-webkit-text-fill-color:#bdb7f9;font-size:10.5px;font-weight:700}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-copy>p{margin:0;color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:11.5px;line-height:1.55}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance{min-height:0;margin:14px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;border:0}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card{
  min-height:86px;padding:14px 16px;display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:center;border:1px solid var(--profile-border);border-radius:16px;background:var(--profile-card);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);transition:.18s ease
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card:hover{border-color:rgba(var(--profile-accent-rgb),.30);background:var(--profile-card-hover);transform:translateY(-1px)}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:rgba(79,201,187,.11);color:#65d5c8}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card.is-member .front-profile-balance-icon{background:rgba(var(--profile-accent-rgb),.12);color:#a99fff}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-icon svg{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card>div{min-width:0;display:grid;gap:5px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card>div>span{color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:10.5px;font-weight:700}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card strong{display:flex;align-items:baseline;gap:5px;color:var(--profile-text);-webkit-text-fill-color:var(--profile-text);font-size:21px;font-weight:800;line-height:1.1}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card strong b{font:inherit;color:inherit;-webkit-text-fill-color:inherit}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card strong em{color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:10px;font-style:normal;font-weight:700}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-list{display:grid;gap:14px;margin:14px 0 0;padding:0;border:0}
html body:not(.page-admin):not(.installation-page) .front-profile-section{overflow:hidden;border:1px solid var(--profile-border);border-radius:18px;background:rgba(19,28,43,.50);box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head{min-height:62px;padding:13px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--profile-border);background:rgba(255,255,255,.018)}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head>div{display:grid;gap:2px}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head span{color:var(--profile-teal);-webkit-text-fill-color:var(--profile-teal);font-size:8.5px;font-weight:850;line-height:1.2;letter-spacing:.16em}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head h3{margin:0;color:var(--profile-text);-webkit-text-fill-color:var(--profile-text);font-size:14px;font-weight:780;line-height:1.35}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head p{margin:0;color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:10.5px;line-height:1.4}
html body:not(.page-admin):not(.installation-page) .front-profile-section-body{display:grid;padding:5px 10px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row{
  min-height:66px;padding:8px 6px;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;border:0;border-bottom:1px solid rgba(148,163,184,.10);background:transparent;transition:background-color .18s ease
}
html body:not(.page-admin):not(.installation-page) .front-profile-section-body>.front-profile-row:last-child{border-bottom:0}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row:hover{background:rgba(255,255,255,.022)}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon{width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(var(--profile-accent-rgb),.18);border-radius:13px;background:rgba(var(--profile-accent-rgb),.09);color:#a99fff}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-phone{border-color:rgba(92,156,247,.20);background:rgba(92,156,247,.09);color:#76aaf4}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-email{border-color:rgba(79,201,187,.20);background:rgba(79,201,187,.09);color:#65d5c8}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-wechat{border-color:rgba(75,198,99,.22);background:rgba(75,198,99,.10);color:#69d67f}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq{border-color:rgba(87,173,245,.22);background:rgba(87,173,245,.10);color:#77bbf3}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-password{border-color:rgba(240,168,75,.23);background:rgba(240,168,75,.10);color:#efb560}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon svg{width:21px;height:21px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row>div{min-width:0;display:grid;gap:3px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-label{display:block;color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:10px;font-weight:700;line-height:1.25}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-value{display:block;max-width:100%;margin:0;overflow:hidden;color:var(--profile-text);-webkit-text-fill-color:var(--profile-text);font-size:12.5px;font-weight:720;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action{height:32px;min-width:58px;padding:0 12px;border:1px solid rgba(var(--profile-accent-rgb),.26);border-radius:10px;background:rgba(var(--profile-accent-rgb),.08);color:#bdb7ff;-webkit-text-fill-color:#bdb7ff;font-size:10.5px;font-weight:760;cursor:pointer;white-space:nowrap;transition:.18s ease}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action:hover{border-color:rgba(var(--profile-accent-rgb),.48);background:rgba(var(--profile-accent-rgb),.15);transform:translateY(-1px)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action:disabled{opacity:.48;cursor:default;transform:none}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel{
  display:none;gap:11px;margin:4px 5px 10px;padding:14px;border:1px solid rgba(var(--profile-accent-rgb),.20);border-radius:14px;background:rgba(8,14,25,.48);box-shadow:inset 0 1px 0 rgba(255,255,255,.03)
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel.is-open{display:grid;animation:profileInlineIn .18s ease both}
@keyframes profileInlineIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel label{display:grid;grid-template-columns:auto 1fr;gap:6px;color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted);font-size:10.5px;font-weight:720}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel label input{grid-column:1/-1}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel input{height:40px;min-width:0;padding:0 12px;border:1px solid var(--profile-border);border-radius:10px;outline:0;background:rgba(7,12,22,.58);color:var(--profile-text);-webkit-text-fill-color:var(--profile-text);font:12px/1.2 inherit;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel input:focus{border-color:rgba(var(--profile-accent-rgb),.62);box-shadow:0 0 0 3px rgba(var(--profile-accent-rgb),.12)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-panel-actions{display:flex;justify-content:flex-end;gap:8px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-panel-actions button{height:36px;padding:0 14px;border-radius:10px;font-size:10.5px;font-weight:760;cursor:pointer}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-panel-actions .secondary{border:1px solid var(--profile-border);background:rgba(255,255,255,.04);color:#bec8d7;-webkit-text-fill-color:#bec8d7}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-panel-actions .primary{border:1px solid rgba(var(--profile-accent-rgb),.48);background:linear-gradient(135deg,rgba(var(--profile-accent-rgb),.96),rgba(var(--profile-accent-rgb),.70));color:#fff;-webkit-text-fill-color:#fff;box-shadow:0 8px 20px rgba(var(--profile-accent-rgb),.18)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-code-actions{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-toast{position:absolute;z-index:12;top:12px;left:50%;width:min(360px,calc(100% - 28px));margin:0;padding:10px 14px;transform:translateX(-50%);border:1px solid rgba(79,201,187,.32);border-radius:12px;background:rgba(18,29,42,.96);color:#7be0d4;-webkit-text-fill-color:#7be0d4;font-size:11.5px;text-align:center;box-shadow:0 14px 36px rgba(0,0,0,.28)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog],
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog],
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog]{--profile-surface:#f5f7fb;--profile-surface-2:#fff;--profile-card:rgba(255,255,255,.82);--profile-card-hover:#fff;--profile-text:#172033;--profile-muted:#667085;--profile-border:rgba(43,55,78,.13);--profile-accent:#6558d8;--profile-accent-rgb:101,88,216;--profile-teal:#168f82;background:rgba(222,228,238,.72);color-scheme:light}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal,
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal,
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal{background:radial-gradient(circle at 13% -4%,rgba(var(--profile-accent-rgb),.12),transparent 34%),linear-gradient(160deg,#fff,#f5f7fb);box-shadow:0 34px 90px rgba(43,52,74,.23),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-top,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-top{background:rgba(255,255,255,.78)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-hero,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-hero{background:linear-gradient(120deg,rgba(var(--profile-accent-rgb),.11),rgba(22,143,130,.06) 54%,rgba(255,255,255,.72)),#fff;box-shadow:0 16px 36px rgba(38,47,68,.08),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-section,
body.jn-light-mode:not(.page-admin) .front-profile-section,
body[data-theme="light"]:not(.page-admin) .front-profile-section{background:rgba(255,255,255,.68);box-shadow:0 10px 30px rgba(38,47,68,.045),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-inline-panel,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-inline-panel{background:#f5f7fb}


:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-avatar-edit,
body.jn-light-mode:not(.page-admin) .front-profile-avatar-edit,
body[data-theme="light"]:not(.page-admin) .front-profile-avatar-edit{border-color:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id i::after,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-id i::after,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-id i::after{background:#fff}
@media(max-width:680px){
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog]{padding:10px;place-items:end center}
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal{width:100%;height:min(880px,calc(100dvh - 12px));max-height:calc(100dvh - 12px);border-radius:24px 24px 12px 12px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top{min-height:76px;padding:14px 14px 13px 17px}
  html body:not(.page-admin):not(.installation-page) .front-profile-heading p{display:none}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id{max-width:138px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html body:not(.page-admin):not(.installation-page) .front-profile-scroll{padding:14px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero{min-height:132px;padding:19px;grid-template-columns:74px minmax(0,1fr);gap:15px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn{width:70px;height:70px;flex-basis:70px;border-radius:22px}
  html body:not(.page-admin):not(.installation-page) .front-profile-avatar-img{border-radius:18px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row strong{font-size:19px}
  html body:not(.page-admin):not(.installation-page) .front-profile-hero-copy>p{display:none}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance{grid-template-columns:1fr 1fr;gap:9px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card{min-height:78px;padding:11px;grid-template-columns:36px minmax(0,1fr);gap:9px}
  html body:not(.page-admin):not(.installation-page) .front-profile-balance-icon{width:36px;height:36px;border-radius:11px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card strong{font-size:17px}
  html body:not(.page-admin):not(.installation-page) .front-profile-section-head p{display:none}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-code-actions{grid-template-columns:1fr 1fr}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-code-actions>input{grid-column:1/-1}
}
@media(max-width:410px){
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id{max-width:94px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-balance-card{grid-template-columns:1fr}
  html body:not(.page-admin):not(.installation-page) .front-profile-balance-icon{display:none}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row{grid-template-columns:36px minmax(0,1fr) auto;gap:9px}
  html body:not(.page-admin):not(.installation-page) .front-profile-row-icon{width:36px;height:36px;border-radius:11px}
}
/* Specificity bridge for legacy compact balance rules retained earlier in this layer. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance{
  min-height:0;margin:14px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;border:0;background:transparent
}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card{
  min-width:0;min-height:86px;margin:0;padding:14px 16px;display:grid;grid-template-columns:42px minmax(0,1fr);flex-direction:initial;justify-content:initial;gap:12px;align-items:center;border:1px solid var(--profile-border);border-radius:16px;background:var(--profile-card);box-shadow:inset 0 1px 0 rgba(255,255,255,.035)
}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card>div{min-width:0;display:grid;gap:5px}
@media(max-width:680px){
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card{min-height:78px;padding:11px;grid-template-columns:36px minmax(0,1fr);gap:9px}
}
@media(max-width:410px){
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card{grid-template-columns:1fr}
}

/* Official clean account center refinement: restrained color, flat surfaces and clear hierarchy. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog]{
  --profile-surface:#101722;
  --profile-surface-2:#151e2b;
  --profile-card:#182333;
  --profile-card-hover:#1d2a3c;
  --profile-text:#f4f7fb;
  --profile-muted:#94a0b2;
  --profile-border:rgba(148,163,184,.18);
  --profile-accent:#2f7cf6;
  --profile-accent-rgb:47,124,246;
  --profile-teal:#2f7cf6;
  background:rgba(5,10,18,.62);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal{
  border-color:var(--profile-border);
  border-radius:18px;
  background:var(--profile-surface);
  box-shadow:0 24px 72px rgba(0,0,0,.46);
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top{
  min-height:80px;
  padding:16px 20px 15px 22px;
  background:var(--profile-surface-2);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  box-shadow:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-heading{gap:2px}
html body:not(.page-admin):not(.installation-page) .front-profile-heading>span{display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-heading h2{font-size:19px;font-weight:720;letter-spacing:0}
html body:not(.page-admin):not(.installation-page) .front-profile-heading p{font-size:11px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id{
  border-color:var(--profile-border);
  border-radius:9px;
  background:rgba(148,163,184,.08);
  color:#c7d0dc;
  -webkit-text-fill-color:#c7d0dc;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id>span{
  border-radius:5px;
  background:rgba(var(--profile-accent-rgb),.18);
  color:#8bb8ff;
  -webkit-text-fill-color:#8bb8ff;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-close-btn{border-radius:9px;background:transparent}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-close-btn:hover{
  border-color:var(--profile-border);
  background:rgba(148,163,184,.10);
  color:var(--profile-text);
  -webkit-text-fill-color:var(--profile-text);
  transform:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-scroll{background:transparent}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero{
  min-height:142px;
  border-color:var(--profile-border);
  border-radius:14px;
  background:var(--profile-card);
  box-shadow:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-orb{display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn{
  width:80px;
  height:80px;
  flex-basis:80px;
  border:3px solid var(--profile-surface-2);
  border-radius:50%;
  background:var(--profile-surface-2);
  box-shadow:0 0 0 1px var(--profile-border);
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn:hover{transform:none;box-shadow:0 0 0 2px rgba(var(--profile-accent-rgb),.34)}
html body:not(.page-admin):not(.installation-page) .front-profile-avatar-img{border-radius:50%}
html body:not(.page-admin):not(.installation-page) .front-profile-avatar-edit{
  right:-3px;
  bottom:-3px;
  width:27px;
  height:27px;
  border:3px solid var(--profile-card);
  border-radius:50%;
  background:var(--profile-accent);
  box-shadow:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row strong{font-size:21px;font-weight:740;letter-spacing:0}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-edit-btn{border-radius:8px;background:transparent}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-edit-btn:hover{background:rgba(148,163,184,.10)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-role,
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-expire-line{
  border-color:rgba(var(--profile-accent-rgb),.24);
  border-radius:7px;
  background:rgba(var(--profile-accent-rgb),.10);
  color:#9fc4ff;
  -webkit-text-fill-color:#9fc4ff;
}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card{
  border-radius:14px;
  background:var(--profile-card);
  box-shadow:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-icon{
  border-color:rgba(var(--profile-accent-rgb),.18);
  border-radius:10px;
  background:rgba(var(--profile-accent-rgb),.09);
  color:#83b2ff;
}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card.is-member .front-profile-balance-icon{
  border-color:rgba(42,157,116,.20);
  background:rgba(42,157,116,.10);
  color:#65c7a4;
}
html body:not(.page-admin):not(.installation-page) .front-profile-section{
  border-radius:14px;
  background:var(--profile-card);
  box-shadow:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head{background:transparent}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head span{display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head h3{font-size:14px;font-weight:720}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row:hover{background:var(--profile-card-hover);transform:none}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon{
  border-color:rgba(var(--profile-accent-rgb),.16);
  border-radius:10px;
  background:rgba(var(--profile-accent-rgb),.08);
  color:#83b2ff;
}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-wechat{border-color:rgba(42,157,116,.18);background:rgba(42,157,116,.09);color:#65c7a4}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action{
  border-color:rgba(var(--profile-accent-rgb),.26);
  border-radius:8px;
  background:rgba(var(--profile-accent-rgb),.08);
  color:#9fc4ff;
  -webkit-text-fill-color:#9fc4ff;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action:hover{
  border-color:rgba(var(--profile-accent-rgb),.44);
  background:rgba(var(--profile-accent-rgb),.14);
  transform:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel{
  border-color:var(--profile-border);
  border-radius:12px;
  background:var(--profile-surface-2);
  box-shadow:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel input{background:#0d1520}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-panel-actions .primary{
  border-color:var(--profile-accent);
  background:var(--profile-accent);
  box-shadow:none;
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog],
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog],
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog]{
  --profile-surface:#f6f8fb;
  --profile-surface-2:#fff;
  --profile-card:#fff;
  --profile-card-hover:#f7f9fc;
  --profile-text:#1d2939;
  --profile-muted:#667085;
  --profile-border:rgba(52,64,84,.14);
  --profile-accent:#2563eb;
  --profile-accent-rgb:37,99,235;
  --profile-teal:#2563eb;
  background:rgba(15,23,42,.40);
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal,
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal,
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal{
  background:var(--profile-surface);
  box-shadow:0 24px 72px rgba(30,41,59,.20);
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-top,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-top{background:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-hero,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-hero{background:#fff;box-shadow:none}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-section,
body.jn-light-mode:not(.page-admin) .front-profile-section,
body[data-theme="light"]:not(.page-admin) .front-profile-section{background:#fff;box-shadow:none}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-id,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-id{background:#f8fafc;color:#475467;-webkit-text-fill-color:#475467}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id>span,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-id>span,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-id>span{color:#2563eb;-webkit-text-fill-color:#2563eb}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-role,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-expire-line,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-role,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-expire-line,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-role,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-expire-line{color:#245fc2;-webkit-text-fill-color:#245fc2}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-inline-panel,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-inline-panel,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-inline-panel{background:#f8fafc}


@media(max-width:680px){
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal{border-radius:18px 18px 10px 10px}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn{border-radius:50%}
  html body:not(.page-admin):not(.installation-page) .front-profile-avatar-img{border-radius:50%}
}

/* Reference-style profile center: colorful, soft account cards with brand-authentic connection marks. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog]{
  --profile-surface:#111727;
  --profile-surface-2:#151d30;
  --profile-card:#182238;
  --profile-card-hover:#1d2942;
  --profile-accent:#8178f7;
  --profile-accent-rgb:129,120,247;
}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal{
  width:min(588px,calc(100vw - 28px));
  max-width:588px;
  max-height:min(94dvh,760px);
  border-radius:22px;
  background:
    radial-gradient(circle at 7% 1%,rgba(129,120,247,.12),transparent 26%),
    radial-gradient(circle at 96% 11%,rgba(96,175,255,.10),transparent 27%),
    linear-gradient(180deg,#171e30 0%,#111827 100%);
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top{
  min-height:72px;
  padding:15px 20px 13px;
  border-bottom:0;
  background:transparent;
}
html body:not(.page-admin):not(.installation-page) .front-profile-heading{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:10px;
  align-items:center;
}
html body:not(.page-admin):not(.installation-page) .front-profile-heading>.front-profile-heading-mark{
  position:relative;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid rgba(var(--profile-accent-rgb),.20);
  border-radius:13px;
  background:linear-gradient(145deg,rgba(var(--profile-accent-rgb),.19),rgba(96,142,255,.07));
  color:#aaa5ff;
  -webkit-text-fill-color:#aaa5ff;
  box-shadow:0 8px 22px rgba(var(--profile-accent-rgb),.12),inset 0 1px 0 rgba(255,255,255,.08);
}
html body:not(.page-admin):not(.installation-page) .front-profile-heading>.front-profile-heading-mark::after{content:"";position:absolute;width:7px;height:7px;right:-2px;top:3px;border-radius:50%;background:#83a5ff;box-shadow:0 0 10px rgba(131,165,255,.7)}
html body:not(.page-admin):not(.installation-page) .front-profile-heading-mark svg{width:20px;height:20px;display:block;fill:rgba(var(--profile-accent-rgb),.18);stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin):not(.installation-page) .front-profile-heading-copy{min-width:0;display:grid;gap:2px}
html body:not(.page-admin):not(.installation-page) .front-profile-heading-copy>span{display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-heading h2{font-size:19px;font-weight:790;letter-spacing:-.02em}
html body:not(.page-admin):not(.installation-page) .front-profile-heading p{font-size:10.5px;line-height:1.35}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-id{display:none!important}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-close-btn{
  width:34px;
  height:34px;
  border-radius:11px;
  background:rgba(255,255,255,.045);
  box-shadow:0 7px 20px rgba(0,0,0,.11),inset 0 1px 0 rgba(255,255,255,.05);
}
html body:not(.page-admin):not(.installation-page) .front-profile-scroll{padding:0 18px 18px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero{
  min-height:136px;
  padding:17px 17px;
  grid-template-columns:88px minmax(0,1fr) 166px;
  gap:14px;
  border-color:rgba(var(--profile-accent-rgb),.18);
  border-radius:17px;
  background:
    radial-gradient(circle at 7% 15%,rgba(203,170,255,.16),transparent 31%),
    radial-gradient(circle at 93% 75%,rgba(92,164,255,.17),transparent 38%),
    linear-gradient(116deg,rgba(var(--profile-accent-rgb),.13),rgba(103,206,224,.06) 60%,rgba(104,142,255,.11)),
    var(--profile-card);
  box-shadow:0 13px 34px rgba(4,8,20,.13),inset 0 1px 0 rgba(255,255,255,.055);
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(106deg,transparent 20%,rgba(255,255,255,.055) 47%,transparent 72%);transform:translateX(-34%)}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-orb{width:230px;height:230px;right:-86px;top:-116px;background:radial-gradient(circle,rgba(103,132,255,.25),transparent 66%)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn{
  width:78px;
  height:78px;
  flex-basis:78px;
  border:3px solid rgba(255,255,255,.91);
  border-radius:50%;
  isolation:isolate;
  box-shadow:0 0 0 3px rgba(var(--profile-accent-rgb),.20),0 11px 28px rgba(4,8,20,.20);
}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn::before{content:"";position:absolute;z-index:-2;inset:-8px;border-radius:50%;background:conic-gradient(from 40deg,#76baff,#b19cff,#ffb7e5,#f5d277,#84e8d2,#76baff);opacity:.72;filter:saturate(.88)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn::after{content:"";position:absolute;z-index:3;right:-8px;bottom:5px;width:18px;height:18px;border:0;border-radius:0;background:linear-gradient(135deg,#a992ff,#4e96ff);clip-path:polygon(50% 0,61% 36%,100% 50%,63% 62%,50% 100%,38% 63%,0 50%,36% 38%);filter:drop-shadow(0 4px 5px rgba(91,96,225,.35))}
html body:not(.page-admin):not(.installation-page) .front-profile-avatar-edit{right:4px;bottom:-4px;width:21px;height:21px;border-color:var(--profile-card);background:linear-gradient(135deg,#8f7df9,#5e95ff);transform:translate(32%,24%)}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-name-row strong{font-size:20px;font-weight:790}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-copy{gap:7px}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-copy>p{font-size:10px;line-height:1.5}
html body:not(.page-admin):not(.installation-page) .front-profile-membership{gap:7px}
html body:not(.page-admin):not(.installation-page) .front-profile-role,html body:not(.page-admin):not(.installation-page) .front-profile-expire-line{height:25px;padding:0 9px;border-radius:8px;font-size:9.5px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
html body:not(.page-admin):not(.installation-page) .front-profile-role::before{content:"";width:10px;height:10px;display:inline-block;margin-right:4px;background:currentColor;clip-path:polygon(50% 0,62% 31%,96% 36%,70% 58%,78% 92%,50% 73%,22% 92%,30% 58%,4% 36%,38% 31%)}
html body:not(.page-admin):not(.installation-page) .front-profile-expire-line::before{content:"";width:10px;height:10px;display:inline-block;margin-right:4px;border:1.4px solid currentColor;border-radius:2px;box-sizing:border-box;background:linear-gradient(currentColor,currentColor) 50% 34%/100% 1.4px no-repeat}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-art{
  position:relative;
  z-index:1;
  width:166px;
  height:116px;
  display:grid;
  place-items:center;
  justify-self:end;
  pointer-events:none;
}
html body:not(.page-admin):not(.installation-page) .front-profile-hero-art svg{width:100%;height:auto;display:block;filter:saturate(.98)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance{margin-top:11px;gap:10px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card{
  min-height:72px;
  padding:11px 13px;
  border-radius:15px;
  background:var(--profile-card);
  box-shadow:0 9px 25px rgba(4,8,20,.08),inset 0 1px 0 rgba(255,255,255,.04);
}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card::after{content:"";position:absolute;width:90px;height:90px;right:-42px;top:-51px;border-radius:50%;background:radial-gradient(circle,rgba(var(--profile-accent-rgb),.12),transparent 67%);pointer-events:none}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card.is-member::after{background:radial-gradient(circle,rgba(79,201,159,.14),transparent 67%)}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-icon{width:40px;height:40px;border-radius:13px;background:linear-gradient(145deg,rgba(var(--profile-accent-rgb),.18),rgba(var(--profile-accent-rgb),.07));color:#aaa4ff;box-shadow:0 6px 16px rgba(var(--profile-accent-rgb),.10)}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card.is-member .front-profile-balance-icon{background:linear-gradient(145deg,rgba(69,207,164,.19),rgba(69,207,164,.07));color:#5bd1ad;box-shadow:0 6px 16px rgba(69,207,164,.10)}
html body:not(.page-admin):not(.installation-page) .front-profile-balance-card strong b{font-size:18px}
html body:not(.page-admin):not(.installation-page) .front-profile-list{gap:10px;margin-top:10px}
html body:not(.page-admin):not(.installation-page) .front-profile-section{border-radius:15px;background:var(--profile-card);box-shadow:0 9px 25px rgba(4,8,20,.07),inset 0 1px 0 rgba(255,255,255,.035)}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head{min-height:50px;padding:11px 15px;background:linear-gradient(90deg,rgba(var(--profile-accent-rgb),.035),transparent 50%)}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head>div>span{display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head h3{font-size:14px;font-weight:790}
html body:not(.page-admin):not(.installation-page) .front-profile-section-head p{font-size:9.5px}
html body:not(.page-admin):not(.installation-page) .front-profile-section-body{padding:0 9px 6px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row{min-height:56px;padding:8px 7px;grid-template-columns:38px minmax(0,1fr) auto;gap:11px}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon{width:36px;height:36px;border-radius:12px}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-profile{border-color:rgba(139,116,241,.18);background:linear-gradient(145deg,rgba(139,116,241,.16),rgba(139,116,241,.06));color:#9a87ef}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-phone{border-color:rgba(72,139,244,.18);background:linear-gradient(145deg,rgba(72,139,244,.16),rgba(72,139,244,.06));color:#5f9af1}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-email{border-color:rgba(49,193,151,.18);background:linear-gradient(145deg,rgba(49,193,151,.17),rgba(49,193,151,.06));color:#43c69d}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-wechat{border-color:rgba(32,191,109,.18);background:linear-gradient(145deg,rgba(32,191,109,.17),rgba(32,191,109,.06));color:#22b96d}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq{border-color:rgba(58,133,238,.18);background:linear-gradient(145deg,rgba(58,133,238,.17),rgba(58,133,238,.06));color:#397fe1}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-password{border-color:rgba(240,168,75,.18);background:linear-gradient(145deg,rgba(240,168,75,.16),rgba(240,168,75,.06));color:#eeb057}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon svg{width:20px;height:20px}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon .front-profile-brand-svg{width:22px;height:22px;overflow:visible;fill:currentColor;stroke:none;stroke-width:0}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-wechat .front-profile-brand-svg .brand-eye{fill:var(--profile-card)}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq .front-profile-brand-svg .qq-body{fill:#397fe1}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq .front-profile-brand-svg .qq-belly{fill:#fff}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq .front-profile-brand-svg .qq-eye{fill:#172238}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq .front-profile-brand-svg .qq-beak{fill:#f4a63e}
html body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-qq .front-profile-brand-svg .qq-scarf{fill:#ef5f68}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-label{font-size:9.5px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-value{font-size:12px}
html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-row-action{height:29px;min-width:56px;padding:0 11px;border-radius:8px;font-size:10px}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog],
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog],
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog]{
  --profile-surface:#f5f6ff;
  --profile-surface-2:#fff;
  --profile-card:rgba(255,255,255,.96);
  --profile-card-hover:#f9faff;
  --profile-text:#161d2e;
  --profile-muted:#7b8499;
  --profile-border:rgba(101,112,160,.105);
  --profile-accent:#756cf2;
  --profile-accent-rgb:117,108,242;
  background:rgba(226,230,244,.54);
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal,
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal,
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal{
  border-color:rgba(255,255,255,.88);
  background:
    radial-gradient(circle at 5% 0%,rgba(177,156,255,.14),transparent 29%),
    radial-gradient(circle at 97% 8%,rgba(109,161,255,.13),transparent 31%),
    linear-gradient(180deg,#fafaff 0%,#f3f5ff 100%);
  box-shadow:0 28px 78px rgba(86,95,141,.18),inset 0 1px 0 #fff;
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-heading>.front-profile-heading-mark,
body.jn-light-mode:not(.page-admin) .front-profile-heading>.front-profile-heading-mark,
body[data-theme="light"]:not(.page-admin) .front-profile-heading>.front-profile-heading-mark{border-color:rgba(var(--profile-accent-rgb),.10);background:linear-gradient(145deg,#f2efff,#ecefff);color:#756cf0;-webkit-text-fill-color:#756cf0;box-shadow:0 7px 20px rgba(var(--profile-accent-rgb),.10),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-close-btn,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-close-btn,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-close-btn{border-color:rgba(95,105,150,.09);background:rgba(255,255,255,.76);color:#778198;-webkit-text-fill-color:#778198;box-shadow:0 7px 20px rgba(80,89,130,.09),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero,
body.jn-light-mode:not(.page-admin) .front-profile-modal .front-profile-hero,
body[data-theme="light"]:not(.page-admin) .front-profile-modal .front-profile-hero{
  border-color:rgba(var(--profile-accent-rgb),.09);
  background:
    radial-gradient(circle at 5% 20%,rgba(203,176,255,.22),transparent 31%),
    radial-gradient(circle at 94% 74%,rgba(102,168,255,.21),transparent 39%),
    linear-gradient(116deg,rgba(255,255,255,.98) 0%,rgba(248,246,255,.97) 48%,rgba(231,241,255,.94) 100%);
  box-shadow:0 11px 30px rgba(88,98,145,.085),inset 0 1px 0 #fff;
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card,
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card,
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card,
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal .front-profile-balance-card + .front-profile-balance-card{background:rgba(255,255,255,.96);box-shadow:0 9px 26px rgba(87,97,143,.06),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-section,
body.jn-light-mode:not(.page-admin) .front-profile-section,
body[data-theme="light"]:not(.page-admin) .front-profile-section{background:rgba(255,255,255,.96);box-shadow:0 9px 26px rgba(87,97,143,.06),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-row-icon.is-wechat .front-profile-brand-svg .brand-eye,
body.jn-light-mode:not(.page-admin) .front-profile-row-icon.is-wechat .front-profile-brand-svg .brand-eye,
body[data-theme="light"]:not(.page-admin) .front-profile-row-icon.is-wechat .front-profile-brand-svg .brand-eye{fill:#f0fbf5}
@media(max-width:620px){
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-hero{grid-template-columns:76px minmax(0,1fr);padding:16px}
  html body:not(.page-admin):not(.installation-page) .front-profile-hero-art{display:none}
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-avatar-btn{width:70px;height:70px;flex-basis:70px}
}
@media(max-width:680px){
  html body:not(.page-admin):not(.installation-page) .front-profile-modal .front-profile-top{padding:13px 15px 11px}
  html body:not(.page-admin):not(.installation-page) .front-profile-scroll{padding:0 11px 13px}
  html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal{width:min(100%,calc(100vw - 18px));border-radius:19px}
}

/* 2026-08 final neutral system profile dialog: pure white in light mode, system black in dark mode. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog]{--profile-surface:#171717;--profile-surface-2:#171717;--profile-card:#1f1f1f;--profile-card-hover:#242424;--profile-text:#f5f5f5;--profile-muted:#a3a3a3;--profile-border:#343434;--profile-border-strong:#454545;--profile-primary:#f5f5f5;--profile-primary-ink:#111;background:rgba(0,0,0,.56);color-scheme:dark}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form]{width:min(590px,calc(100vw - 28px));max-width:590px;border:1px solid var(--profile-border);border-radius:18px;background:var(--profile-surface);background-image:none;color:var(--profile-text);box-shadow:0 28px 70px rgba(0,0,0,.46)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-top{min-height:68px;padding:14px 20px;border-bottom:1px solid var(--profile-border);background:var(--profile-surface);background-image:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading{grid-template-columns:38px minmax(0,1fr);gap:11px;align-items:center}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark{width:38px;height:38px;border:1px solid var(--profile-border);border-radius:11px;background:#262626;background-image:none;color:#e5e5e5;-webkit-text-fill-color:#e5e5e5;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark::after{display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark svg{width:20px;height:20px;fill:none;stroke:currentColor;transform:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-copy>span{color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading h2,.front-profile-name-row strong,.front-profile-section-head h3,.front-profile-row-label,.front-profile-balance-card strong){color:var(--profile-text);-webkit-text-fill-color:var(--profile-text)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading p,.front-profile-hero-copy p,.front-profile-section-head p,.front-profile-row-value,.front-profile-balance-card span){color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-id,.front-profile-close-btn){border:1px solid var(--profile-border);background:#242424;background-image:none;color:#d4d4d4;-webkit-text-fill-color:#d4d4d4;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-id,.front-profile-close-btn):hover{border-color:var(--profile-border-strong);background:#2b2b2b;color:#fafafa;-webkit-text-fill-color:#fafafa}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-scroll{padding:0 16px 16px;background:var(--profile-surface)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-hero{grid-template-columns:76px minmax(0,1fr);min-height:126px;padding:20px;border:1px solid var(--profile-border);border-radius:15px;background:var(--profile-card);background-image:none;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-hero-art,.front-profile-hero-orb){display:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn{width:72px;height:72px;flex-basis:72px;border:2px solid #525252;background:#262626;box-shadow:0 0 0 3px #1f1f1f}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-edit{border:2px solid var(--profile-card);background:#f5f5f5;background-image:none;color:#111;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-avatar-edit svg,.front-profile-edit-btn svg){fill:none;stroke:currentColor}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-edit-btn{border:1px solid var(--profile-border);background:#292929;background-image:none;color:#d4d4d4;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-edit-btn:hover{border-color:#525252;background:#303030;color:#fafafa}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-role,.front-profile-expire-line){border:1px solid var(--profile-border);background:#262626;background-image:none;color:#d4d4d4;-webkit-text-fill-color:#d4d4d4;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-balance{gap:10px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-balance-card{border:1px solid var(--profile-border);background:var(--profile-card);background-image:none;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-balance-icon,.front-profile-row-icon:not(.is-wechat):not(.is-qq)){border:1px solid var(--profile-border);background:#292929;background-image:none;color:#d4d4d4;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-balance-icon svg,.front-profile-row-icon svg){fill:none;stroke:currentColor}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-section{border:1px solid var(--profile-border);border-radius:15px;background:var(--profile-card);background-image:none;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-section-head{border-bottom:1px solid var(--profile-border);background:transparent;background-image:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-section-head span{color:var(--profile-muted);-webkit-text-fill-color:var(--profile-muted)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row{border-color:var(--profile-border);background:transparent;background-image:none;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row:hover{background:var(--profile-card-hover)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-wechat{width:36px;height:36px;border:0;border-radius:10px;background:#07c160;background-image:none;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-wechat .front-profile-brand-img{width:23px;height:23px;object-fit:contain;filter:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-qq{width:36px;height:36px;border:1px solid var(--profile-border);border-radius:10px;background:transparent;background-image:none;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-qq .front-profile-brand-img{width:29px;height:29px;object-fit:contain;filter:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-row-action,.front-profile-panel-actions .secondary){border:1px solid var(--profile-border-strong);background:transparent;background-image:none;color:#d4d4d4;-webkit-text-fill-color:#d4d4d4;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-row-action,.front-profile-panel-actions .secondary):hover{background:#2b2b2b;color:#fafafa;-webkit-text-fill-color:#fafafa}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-action:disabled{opacity:.5}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel{border-top:1px solid var(--profile-border);background:#1b1b1b;background-image:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel label{color:#d4d4d4;-webkit-text-fill-color:#d4d4d4}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel :is(input,select){border:1px solid var(--profile-border-strong);background:#262626;background-image:none;color:#f5f5f5;-webkit-text-fill-color:#f5f5f5;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel :is(input,select):focus{border-color:#737373;box-shadow:0 0 0 3px rgba(163,163,163,.14)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-panel-actions .primary{border:1px solid #f5f5f5;background:#f5f5f5;background-image:none;color:#111;-webkit-text-fill-color:#111;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-toast{border:1px solid var(--profile-border-strong);background:#262626;color:#f5f5f5;-webkit-text-fill-color:#f5f5f5;box-shadow:0 16px 40px rgba(0,0,0,.32)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog],body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog],body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog]{--profile-surface:#fff;--profile-surface-2:#fff;--profile-card:#fff;--profile-card-hover:#fafafa;--profile-text:#171717;--profile-muted:#737373;--profile-border:#e5e5e5;--profile-border-strong:#d4d4d4;--profile-primary:#171717;--profile-primary-ink:#fff;background:rgba(23,23,23,.18);color-scheme:light}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form],body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form],body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form]{border-color:#e5e5e5;background:#fff;background-image:none;color:#171717;box-shadow:0 28px 70px rgba(23,23,23,.18)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll),body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll),body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll){background:#fff;background-image:none}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark{border-color:#e5e5e5;background:#f5f5f5;color:#404040;-webkit-text-fill-color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-id,.front-profile-close-btn,.front-profile-edit-btn),body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-id,.front-profile-close-btn,.front-profile-edit-btn),body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-id,.front-profile-close-btn,.front-profile-edit-btn){border-color:#e5e5e5;background:#fff;color:#525252;-webkit-text-fill-color:#525252}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-hero,.front-profile-balance-card,.front-profile-section),body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-hero,.front-profile-balance-card,.front-profile-section),body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-hero,.front-profile-balance-card,.front-profile-section){border-color:#e5e5e5;background:#fff;background-image:none;box-shadow:none}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn{border-color:#d4d4d4;background:#f5f5f5;box-shadow:0 0 0 3px #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-edit,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-avatar-edit,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-avatar-edit{border-color:#fff;background:#171717;color:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-role,.front-profile-expire-line,.front-profile-balance-icon,.front-profile-row-icon:not(.is-wechat):not(.is-qq)),body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-role,.front-profile-expire-line,.front-profile-balance-icon,.front-profile-row-icon:not(.is-wechat):not(.is-qq)),body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-role,.front-profile-expire-line,.front-profile-balance-icon,.front-profile-row-icon:not(.is-wechat):not(.is-qq)){border-color:#e5e5e5;background:#f5f5f5;background-image:none;color:#525252;-webkit-text-fill-color:#525252}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-row,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-row{border-color:#eee;background:transparent;background-image:none}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row:hover,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-row:hover,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-row:hover{background:#fafafa}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-qq,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-qq,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-qq{border-color:#e5e5e5;background:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-row-action,.front-profile-panel-actions .secondary),body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-row-action,.front-profile-panel-actions .secondary),body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-row-action,.front-profile-panel-actions .secondary){border-color:#d4d4d4;background:#fff;color:#404040;-webkit-text-fill-color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel{border-color:#e5e5e5;background:#fafafa;background-image:none}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel label,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel label,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel label{color:#404040;-webkit-text-fill-color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel :is(input,select),body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel :is(input,select),body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-inline-panel :is(input,select){border-color:#d4d4d4;background:#fff;color:#171717;-webkit-text-fill-color:#171717}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-panel-actions .primary,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-panel-actions .primary,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-panel-actions .primary{border-color:#171717;background:#171717;background-image:none;color:#fff;-webkit-text-fill-color:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-toast,body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-toast,body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-toast{border-color:#d4d4d4;background:#fff;color:#171717;-webkit-text-fill-color:#171717}
@media(max-width:620px){html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-hero{grid-template-columns:64px minmax(0,1fr);padding:16px}html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-avatar-btn{width:62px;height:62px;flex-basis:62px}}

/* Final color authority against earlier high-specificity public-shell rules. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form],
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll){background:#171717!important;background-image:none!important}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-hero,.front-profile-balance-card,.front-profile-section){background:#1f1f1f!important;background-image:none!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form],
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form],
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] .front-profile-modal[data-profile-dialog-form],
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll,.front-profile-hero,.front-profile-balance-card,.front-profile-section),
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll,.front-profile-hero,.front-profile-balance-card,.front-profile-section),
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-top,.front-profile-scroll,.front-profile-hero,.front-profile-balance-card,.front-profile-section){background:#fff!important;background-image:none!important}
/* Official Material Symbols for generic account actions; original brand assets remain for WeChat and QQ. */
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading-mark,.front-profile-balance-icon,.front-profile-row-icon){display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;box-sizing:border-box;overflow:hidden;line-height:0;transform:none!important}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading-mark,.front-profile-balance-icon,.front-profile-row-icon){border:1px solid var(--profile-border);background:#262626!important;background-image:none!important;color:inherit;box-shadow:none}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-balance-icon{width:42px;height:42px;padding:5px;border-radius:12px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-balance-card.is-normal .front-profile-balance-icon{margin-left:var(--profile-balance-icon-offset)}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon{width:38px;height:38px;padding:5px;border-radius:11px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-icon-img,.front-profile-brand-img){display:block;position:static;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;filter:none!important;transform:none!important;opacity:1}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark{padding:5px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-heading-mark .front-profile-icon-img{width:27px;height:27px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-qq{padding:3px}
html body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] .front-profile-row-icon.is-wechat{padding:4px}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin):not(.installation-page) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading-mark,.front-profile-balance-icon,.front-profile-row-icon),
body.jn-light-mode:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading-mark,.front-profile-balance-icon,.front-profile-row-icon),
body[data-theme="light"]:not(.page-admin) .front-profile-layer[data-profile-dialog] :is(.front-profile-heading-mark,.front-profile-balance-icon,.front-profile-row-icon){border-color:#e5e5e5;background:#fff!important;background-image:none!important}

/**
 * Shared customer service dialog.
 * This is the single visual implementation used by the home page and user pages.
 */

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime {
  --customer-overlay: rgba(3, 6, 13, .72);
  --customer-panel: linear-gradient(180deg, #091627, #040a15);
  --customer-panel-line: rgba(0, 202, 224, .28);
  --customer-panel-shadow: 0 28px 80px rgba(0, 0, 0, .58), 0 0 42px rgba(0, 202, 224, .08), inset 0 1px 0 rgba(255, 255, 255, .06);
  --customer-heading: #f5fbff;
  --customer-text: rgba(213, 230, 238, .76);
  --customer-surface: rgba(0, 202, 224, .075);
  --customer-surface-soft: rgba(255, 255, 255, .035);
  --customer-surface-line: rgba(125, 211, 252, .16);
  --customer-close-bg: rgba(125, 211, 252, .08);
  --customer-close-bg-hover: rgba(0, 202, 224, .16);
  --customer-close-text: #eaffff;
  --customer-action-bg: linear-gradient(135deg, #00cae0, #009fc7);
  --customer-action-bg-hover: linear-gradient(135deg, #19d8e9, #00add4);
  --customer-action-line: rgba(96, 240, 255, .34);
  --customer-action-text: #ffffff;
  --customer-qr-shell: linear-gradient(180deg, #ffffff, #f1f0ed);
  --customer-qr-line: rgba(125, 211, 252, .24);
  --customer-qr-shadow: 0 14px 32px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .94);
  position: fixed;
  inset: 0;
  z-index: 2147483635;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  margin: 0;
  pointer-events: auto;
  color-scheme: dark;
}

html.jn-light-mode body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime,
html[data-theme=light] body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime,
html body.jn-light-mode #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime,
html body[data-theme=light] #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime {
  --customer-overlay: rgba(3, 11, 24, .46);
  --customer-panel: linear-gradient(180deg, #ffffff, #f2f8fc);
  --customer-panel-line: rgba(8, 145, 178, .22);
  --customer-panel-shadow: 0 28px 72px rgba(15, 40, 65, .22), 0 0 36px rgba(0, 202, 224, .08), inset 0 1px 0 rgba(255, 255, 255, .96);
  --customer-heading: #0f2638;
  --customer-text: #5b7180;
  --customer-surface: rgba(0, 202, 224, .08);
  --customer-surface-soft: rgba(233, 247, 251, .72);
  --customer-surface-line: rgba(8, 145, 178, .15);
  --customer-close-bg: rgba(8, 145, 178, .08);
  --customer-close-bg-hover: rgba(0, 202, 224, .14);
  --customer-close-text: #245064;
  --customer-action-bg: linear-gradient(135deg, #00b8d4, #0789b5);
  --customer-action-bg-hover: linear-gradient(135deg, #00c8df, #0799c4);
  --customer-action-line: rgba(8, 145, 178, .26);
  --customer-action-text: #ffffff;
  --customer-qr-shell: linear-gradient(180deg, #ffffff, #f4fbfd);
  --customer-qr-line: rgba(8, 145, 178, .14);
  --customer-qr-shadow: 0 12px 26px rgba(15, 40, 65, .14), inset 0 1px 0 rgba(255, 255, 255, .96);
  color-scheme: light;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime,
html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime *,
html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime *::before,
html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime *::after {
  box-sizing: border-box;
  letter-spacing: 0;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1;
  display: grid;
  place-items: center;
  align-items: center;
  justify-items: center;
  align-content: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  margin: 0;
  padding: 20px;
  overflow: auto;
  background: var(--customer-overlay);
  color: var(--customer-heading);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal.replica-customer-modal {
  position: relative;
  inset: auto;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  transform: none;
  display: block;
  align-self: center;
  justify-self: center;
  width: min(300px, calc(100vw - 32px));
  max-width: 300px;
  max-height: calc(100dvh - 40px);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--customer-panel-line);
  border-radius: 18px;
  background: var(--customer-panel);
  color: var(--customer-heading);
  box-shadow: var(--customer-panel-shadow);
  backdrop-filter: blur(22px) saturate(118%);
  -webkit-backdrop-filter: blur(22px) saturate(118%);
  text-align: left;
  font-family: inherit;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .replica-customer-modal::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  display: block;
  width: auto;
  height: 132px;
  background: radial-gradient(circle at 24% 16%, rgba(0, 202, 224, .24), transparent 40%), linear-gradient(180deg, rgba(96, 240, 255, .055), transparent);
  opacity: .92;
  pointer-events: none;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  display: block;
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--customer-close-bg);
  color: var(--customer-close-text);
  box-shadow: none;
  font: inherit;
  font-size: 20px;
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  cursor: pointer;
  -webkit-text-fill-color: currentColor;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal-close:hover {
  background: var(--customer-close-bg-hover);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-modal-head {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 20px 18px 14px;
  text-align: left;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-status-dot {
  display: block;
  width: 10px;
  height: 10px;
  margin: 10px 0 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #20e36a;
  box-shadow: 0 0 0 5px rgba(32, 227, 106, .14), 0 0 16px rgba(32, 227, 106, .72);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-modal-head h2 {
  display: block;
  margin: 0;
  padding: 0;
  color: var(--customer-heading);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.15;
  text-align: left;
  -webkit-text-fill-color: currentColor;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-modal-head p {
  display: block;
  margin: 7px 0 0;
  padding: 0;
  color: var(--customer-text);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  -webkit-text-fill-color: currentColor;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  justify-items: center;
  gap: 8px;
  width: auto;
  margin: 0 14px 10px;
  padding: 12px;
  border: 1px solid var(--customer-surface-line);
  border-radius: 14px;
  background: var(--customer-surface);
  color: var(--customer-heading);
  box-shadow: 0 14px 32px rgba(24, 24, 26, .10), inset 0 1px 0 rgba(255, 255, 255, .08);
  text-align: center;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished {
  position: relative;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0;
  padding: 7px;
  overflow: visible;
  border: 1px solid rgba(125, 211, 252, .38);
  border-radius: 18px;
  background: radial-gradient(circle at 28% 18%, rgba(153, 246, 228, .40), transparent 42%), linear-gradient(145deg, rgba(39, 39, 42, .96), rgba(13, 148, 136, .72));
  box-shadow: 0 16px 32px rgba(24, 24, 26, .24), 0 0 0 5px rgba(20, 184, 166, .11), inset 0 1px 0 rgba(255, 255, 255, .18);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished::before {
  content: "";
  position: absolute;
  inset: -5px;
  z-index: -1;
  display: block;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(45, 212, 191, .42), rgba(20, 184, 166, .24), rgba(110, 231, 183, .24));
  opacity: .48;
  filter: blur(8px);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished::after {
  content: "";
  position: absolute;
  right: -2px;
  bottom: -2px;
  display: block;
  width: 20px;
  height: 20px;
  border: 3px solid #3f3f42;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 16px rgba(34, 197, 94, .82);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: transparent;
  object-fit: contain;
  filter: drop-shadow(0 8px 14px rgba(24, 24, 26, .28));
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card > div:not(.service-avatar) {
  display: grid;
  justify-items: center;
  margin: 0;
  padding: 0;
  text-align: center;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card strong {
  display: block;
  margin: 0;
  padding: 0;
  color: var(--customer-heading);
  font-size: 15px;
  font-weight: 700;
  line-height: normal;
  text-align: center;
  -webkit-text-fill-color: currentColor;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card em {
  display: grid;
  place-items: center;
  width: auto;
  height: 22px;
  min-height: 22px;
  margin: 2px 0 0;
  padding: 0 12px;
  border: 1px solid rgba(32, 227, 106, .28);
  border-radius: 999px;
  background: rgba(32, 227, 106, .13);
  color: #9de2c0;
  font-size: 10px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  text-align: center;
  -webkit-text-fill-color: currentColor;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-card.service-qr-card.service-qr-only {
  position: static;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  justify-items: center;
  gap: 14px;
  width: max-content;
  max-width: calc(100% - 32px);
  margin: 0 auto 12px;
  padding: 12px;
  border: 1px solid var(--customer-surface-line);
  border-radius: 18px;
  background: var(--customer-surface-soft);
  color: var(--customer-heading);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 16px 36px rgba(0, 0, 0, .18);
  text-align: center;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-qr-frame {
  position: static;
  display: block;
  width: 154px;
  height: 154px;
  margin: 0;
  padding: 10px;
  overflow: visible;
  border: 1px solid var(--customer-qr-line);
  border-radius: 16px;
  background: var(--customer-qr-shell);
  box-shadow: var(--customer-qr-shadow);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-qr-frame img,
html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-qr-frame .customer-qr-fallback {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 8px;
  overflow: hidden;
  border: 0;
  border-radius: 10px;
  background: #fff;
  color: #0f9db2;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.35;
  object-fit: cover;
  text-align: center;
  -webkit-text-fill-color: currentColor;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-actions.service-actions-single {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  width: auto;
  margin: 0;
  padding: 2px 18px 18px;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-actions.service-actions-single a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 42px;
  min-height: 42px;
  margin: 0;
  padding: 0;
  border: 1px solid var(--customer-action-line);
  border-radius: 999px;
  background: var(--customer-action-bg);
  color: var(--customer-action-text);
  box-shadow: none;
  font-size: 13px;
  font-weight: 900;
  line-height: normal;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  -webkit-text-fill-color: currentColor;
}

html body:not(.public-home) #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-actions.service-actions-single a {
  min-width: 0;
  transition: color .15s cubic-bezier(.16, 1, .3, 1);
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-actions.service-actions-single a:hover {
  background: var(--customer-action-bg-hover);
}

html.jn-light-mode body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .replica-customer-modal::before,
html[data-theme=light] body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .replica-customer-modal::before,
html body.jn-light-mode #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .replica-customer-modal::before,
html body[data-theme=light] #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .replica-customer-modal::before {
  background: radial-gradient(circle at 24% 16%, rgba(0, 184, 212, .14), transparent 40%), linear-gradient(180deg, rgba(255, 255, 255, .52), transparent);
}

html.jn-light-mode body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished::after,
html[data-theme=light] body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished::after,
html body.jn-light-mode #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished::after,
html body[data-theme=light] #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-avatar.service-avatar-polished::after {
  border-color: #f7f5f2;
}

html.jn-light-mode body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card em,
html[data-theme=light] body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card em,
html body.jn-light-mode #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card em,
html body[data-theme=light] #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-online-card em {
  color: #27765e;
}

html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-actions.service-actions-single a::after {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  margin: 0 0 0 8px;
  padding: 0;
  border: 0;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}

@media (max-width: 760px) {
  html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal-overlay {
    padding: 14px;
  }

  html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal.replica-customer-modal {
    width: min(300px, calc(100vw - 28px));
    max-height: calc(100dvh - 28px);
    overflow: auto;
  }

  html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .service-qr-frame {
    width: 144px;
    height: 144px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal-overlay {
    animation: jn-customer-overlay-in .18s ease both;
  }

  html body #jnCustomerServiceRuntime#jnCustomerServiceRuntime#jnCustomerServiceRuntime .customer-modal.replica-customer-modal {
    animation: jn-customer-modal-in .22s cubic-bezier(.2, .8, .2, 1) both;
  }
}

@keyframes jn-customer-overlay-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes jn-customer-modal-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* 2026-07-13 unified front system notice dialog */
@keyframes jnSystemNoticeLayerIn{from{opacity:0}to{opacity:1}}
@keyframes jnSystemNoticeModalIn{from{opacity:0;transform:translateY(18px) scale(.982)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes jnSystemNoticeSheetIn{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:translateY(0)}}
@keyframes jnSystemNoticeShine{0%{transform:translate3d(-38%,0,0)}100%{transform:translate3d(38%,0,0)}}
.jn-system-notice-layer{position:fixed;inset:0;z-index:100070;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,rgba(3,7,18,.82),rgba(18,24,44,.72)),repeating-linear-gradient(135deg,rgba(125,211,252,.08) 0 1px,transparent 1px 42px);backdrop-filter:blur(20px) saturate(1.12);-webkit-backdrop-filter:blur(20px) saturate(1.12);color:#e5f6ff;animation:jnSystemNoticeLayerIn .2s ease-out both}
.jn-system-notice-modal{position:relative;width:min(900px,calc(100vw - 44px));max-height:min(760px,calc(100dvh - 44px));display:grid;grid-template-rows:auto auto minmax(0,1fr);overflow:hidden;border-radius:24px;border:1px solid rgba(143,213,255,.34);background:linear-gradient(180deg,rgba(16,24,43,.98),rgba(6,13,28,.98));box-shadow:0 32px 92px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.06),inset 0 1px 0 rgba(255,255,255,.14);color:#e5f6ff;animation:jnSystemNoticeModalIn .28s cubic-bezier(.2,.9,.22,1.02) both}
.jn-system-notice-modal::before{content:'';position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,#38bdf8 0%,#22c55e 38%,#a78bfa 72%,#facc15 100%)}
.jn-system-notice-modal::after{content:'';position:absolute;inset:5px 0 auto;height:150px;pointer-events:none;background:linear-gradient(112deg,transparent 0 18%,rgba(125,211,252,.08) 18% 20%,transparent 20% 48%,rgba(167,139,250,.08) 48% 50%,transparent 50% 100%);opacity:.9;animation:jnSystemNoticeShine 9s linear infinite alternate}
.jn-system-notice-head{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px 24px 19px;border-bottom:1px solid rgba(148,163,184,.14);background:linear-gradient(180deg,rgba(30,41,59,.70),rgba(15,23,42,.28))}
.jn-system-notice-title{min-width:0;display:flex;align-items:center;gap:15px}
.jn-system-notice-icon{position:relative;width:54px;height:54px;flex:0 0 auto;display:grid;place-items:center;border-radius:18px;border:1px solid rgba(125,211,252,.48);background:linear-gradient(145deg,rgba(14,165,233,.30),rgba(34,197,94,.18) 48%,rgba(168,85,247,.20));box-shadow:0 18px 35px rgba(14,165,233,.18),inset 0 1px 0 rgba(255,255,255,.18)}
.jn-system-notice-icon::after{content:'';position:absolute;inset:8px;border-radius:13px;border:1px solid rgba(255,255,255,.13)}
.jn-system-notice-icon::before{content:'';position:relative;z-index:1;width:24px;height:24px;background:var(--lz-notice-header-icon-color);-webkit-mask-image:var(--jn-qicon-bell);-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:24px 24px;mask-image:var(--jn-qicon-bell);mask-repeat:no-repeat;mask-position:center;mask-size:24px 24px}
.jn-system-notice-title small{display:inline-flex;width:max-content;max-width:100%;margin:0 0 7px;padding:5px 10px;border-radius:999px;border:1px solid rgba(45,212,191,.36);background:linear-gradient(135deg,rgba(20,184,166,.20),rgba(59,130,246,.16));color:#a7f3d0;font-size:11px;font-weight:900;line-height:1;letter-spacing:0}
.jn-system-notice-title h2{max-width:620px;margin:0;color:#f8fafc;font-size:25px;font-weight:950;line-height:1.22;letter-spacing:0;word-break:break-word}
.jn-system-notice-title p{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:7px 0 0;color:#a7b6cc;font-size:12px;font-weight:700;line-height:1.35}
.jn-system-notice-title p em{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;border:1px solid rgba(56,189,248,.26);background:rgba(56,189,248,.10);color:#bae6fd;font-style:normal;font-size:11px;font-weight:900}
.jn-system-notice-head-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.jn-system-notice-head-actions>span{height:32px;display:inline-flex;align-items:center;padding:0 11px;border-radius:999px;border:1px solid rgba(148,163,184,.18);background:rgba(15,23,42,.44);color:#c4d4e9;font-size:12px;font-weight:950;line-height:1;white-space:nowrap}
.jn-system-notice-close{width:38px;height:38px;flex:0 0 auto;display:grid;place-items:center;border-radius:13px;border:1px solid rgba(148,163,184,.22);background:rgba(15,23,42,.58);color:#dbeafe;font-size:22px;font-weight:700;line-height:1;box-shadow:none;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background-color .18s ease}
.jn-system-notice-close:hover{transform:translateY(-1px);border-color:rgba(125,211,252,.46);background:rgba(14,165,233,.16);color:#fff}
.jn-system-notice-progress{position:relative;z-index:2;height:6px;margin:0 24px;overflow:hidden;border-radius:999px;background:rgba(148,163,184,.14)}
.jn-system-notice-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#38bdf8,#22c55e,#a78bfa);box-shadow:0 0 18px rgba(56,189,248,.35);transition:width .28s ease}
.jn-system-notice-scroll{position:relative;z-index:2;min-height:0;overflow:auto;padding:22px 24px 20px;background:linear-gradient(180deg,rgba(2,6,23,.08),rgba(2,6,23,.28));scrollbar-width:none;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.jn-system-notice-scroll::-webkit-scrollbar,.jn-system-notice-flow::-webkit-scrollbar{display:none;width:0;height:0}
.jn-system-notice-flow{min-height:0;display:grid;gap:22px;padding:2px 8px 18px}
.jn-system-notice-flow-card{--jn-notice-accent:var(--lz-notice-accent-default);position:relative;display:grid;gap:var(--lz-space-4);padding:var(--lz-space-5) calc(var(--lz-space-5) + var(--lz-space-1) / 2);border:1px solid color-mix(in srgb,var(--jn-notice-accent,var(--lz-notice-accent-default)),transparent 62%);border-radius:var(--lz-radius-xl);background:linear-gradient(145deg,color-mix(in srgb,var(--jn-notice-accent,var(--lz-notice-accent-default)),transparent 90%),var(--lz-notice-surface));color:var(--lz-notice-text);box-shadow:var(--lz-notice-card-shadow);overflow:hidden;transition:transform var(--lz-duration-normal) var(--lz-ease-standard),border-color var(--lz-duration-normal) var(--lz-ease-standard),box-shadow var(--lz-duration-normal) var(--lz-ease-standard)}
.jn-system-notice-flow-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--jn-notice-accent,#38bdf8),color-mix(in srgb,var(--jn-notice-accent,#38bdf8),white 30%))}
.jn-system-notice-flow-card::after{content:'';position:absolute;right:24px;top:18px;width:5px;height:5px;border-radius:999px;background:var(--jn-notice-accent,#38bdf8);box-shadow:0 0 18px var(--jn-notice-accent,#38bdf8);opacity:.78}

.jn-system-notice-flow-card.is-active,
.jn-system-notice-flow-card.is-unread {
  border-color: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 34%);
  box-shadow: var(--lz-notice-card-active-shadow);
}

.jn-system-notice-flow-title {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--lz-space-3);
}

.jn-system-notice-flow-title > span:not(.jn-system-notice-flow-badges) {
  min-width: 0;
  display: inline-grid;
  grid-template-columns: var(--lz-space-8) minmax(0, 1fr);
  align-items: center;
  gap: var(--lz-space-3);
  padding: var(--lz-space-2) var(--lz-space-3);
  border: var(--lz-notice-border-width) solid color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 58%);
  border-radius: var(--lz-radius-lg);
  background: linear-gradient(135deg, color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 82%), var(--lz-notice-surface-soft));
}

.jn-system-notice-flow-title i {
  width: var(--lz-space-8);
  height: var(--lz-space-8);
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: var(--lz-radius-md);
  background: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 72%);
  color: var(--lz-notice-title);
  font-style: normal;
  font-size: var(--lz-font-size-lg);
  line-height: var(--lz-line-height-tight);
}

.jn-system-notice-flow-title i img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: inherit;
}

.jn-system-notice-flow-title strong {
  min-width: 0;
  color: var(--lz-notice-title);
  font-size: var(--lz-font-size-lg);
  font-weight: var(--lz-notice-font-weight-strong);
  line-height: var(--lz-notice-line-height-heading);
  letter-spacing: 0;
  word-break: break-word;
}

.jn-system-notice-flow-badges {
  display: inline-flex;
  max-width: 100%;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: var(--lz-space-2);
}

.jn-system-notice-flow-badges > b {
  min-width: 0;
  height: calc(var(--lz-space-6) + var(--lz-space-1));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--lz-space-3);
  border: var(--lz-notice-border-width) solid color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 55%);
  border-radius: var(--lz-radius-pill);
  background: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 84%);
  color: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), var(--lz-notice-title) 34%);
  font-size: var(--lz-font-size-xs);
  font-weight: var(--lz-notice-font-weight-strong);
  line-height: var(--lz-line-height-tight);
  white-space: nowrap;
}

.jn-system-notice-flow-badges > .jn-system-notice-pin {
  gap: var(--lz-space-1);
  min-width: max-content;
  padding-inline: var(--lz-space-2) var(--lz-space-3);
  border-color: var(--lz-notice-pin-border);
  background: var(--lz-notice-pin-surface);
  color: var(--lz-notice-pin-text);
  box-shadow: var(--lz-notice-pin-shadow);
}

.jn-system-notice-pin::before {
  width: var(--lz-icon-size-sm);
  height: var(--lz-icon-size-sm);
  flex: 0 0 auto;
  background: currentColor;
  content: '';
  -webkit-mask-image: var(--jn-qicon-pin);
  mask-image: var(--jn-qicon-pin);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.jn-system-notice-flow-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--lz-space-3);
  color: var(--lz-notice-muted);
  font-size: var(--lz-font-size-xs);
  font-weight: var(--lz-notice-font-weight-meta);
}

.jn-system-notice-flow-meta time {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jn-system-notice-flow-meta em {
  height: calc(var(--lz-space-5) + var(--lz-space-1) / 2);
  display: inline-flex;
  align-items: center;
  padding: 0 var(--lz-space-2);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-notice-danger);
  color: var(--lz-notice-danger-contrast);
  font-style: normal;
  font-size: var(--lz-font-size-xs);
  font-weight: var(--lz-notice-font-weight-strong);
  box-shadow: 0 0 var(--lz-space-3) color-mix(in srgb, var(--lz-notice-danger), transparent 48%);
}

.jn-system-notice-body {
  min-width: 0;
  color: var(--lz-notice-text);
  font-size: var(--lz-font-size-lg);
  font-weight: var(--lz-notice-font-weight-body);
  line-height: var(--lz-notice-line-height-body);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.jn-system-notice-body :is(h1, h2, h3, h4, h5, h6) {
  margin: 0 0 var(--lz-space-3);
  color: var(--lz-notice-title);
  line-height: var(--lz-line-height-tight);
  letter-spacing: 0;
}

.jn-system-notice-body :is(p, div, section, article, ul, ol, blockquote, pre, table) {
  margin: 0 0 var(--lz-space-3);
}

.jn-system-notice-body :is(p, div, section, article, ul, ol, blockquote, pre, table):last-child {
  margin-bottom: 0;
}

.jn-system-notice-body :is(ul, ol) {
  padding-left: var(--lz-space-5);
}

.jn-system-notice-body a {
  color: var(--lz-notice-link);
  text-decoration: none;
}

.jn-system-notice-body a:hover {
  text-decoration: underline;
}

.jn-system-notice-body img {
  max-width: 100%;
  height: auto;
  border: var(--lz-notice-border-width) solid var(--lz-notice-border);
  border-radius: var(--lz-radius-lg);
}

.jn-system-notice-body blockquote {
  padding: var(--lz-space-3) var(--lz-space-4);
  border-left: var(--lz-notice-accent-line-width) solid var(--jn-notice-accent, var(--lz-notice-accent-default));
  border-radius: var(--lz-radius-lg);
  background: var(--lz-notice-surface-soft);
  color: inherit;
}

.jn-system-notice-body table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  border-radius: var(--lz-radius-lg);
}

.jn-system-notice-body :is(th, td) {
  padding: var(--lz-space-3);
  border: var(--lz-notice-border-width) solid var(--lz-notice-border);
}

.jn-system-notice-body code {
  padding: calc(var(--lz-space-1) / 2) var(--lz-space-2);
  border: var(--lz-notice-border-width) solid var(--lz-notice-code-border);
  border-radius: var(--lz-radius-md);
  background: var(--lz-notice-code-surface);
  color: var(--lz-notice-code-text);
}

.jn-system-notice-body :is(.notice-content-image, .notice-content-video) {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: var(--lz-notice-media-max-height);
  margin: var(--lz-space-4) 0;
  border: var(--lz-notice-border-width) solid var(--lz-notice-border);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-notice-media-surface);
  object-fit: contain;
}

.jn-system-notice-body .notice-content-audio {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: var(--lz-space-4) 0;
}

.jn-system-notice-body .notice-file-attachment {
  position: relative;
  display: inline-flex;
  max-width: 100%;
  min-height: var(--lz-control-height-md);
  align-items: center;
  gap: var(--lz-space-2);
  margin: var(--lz-space-2) 0;
  padding: var(--lz-space-2) var(--lz-space-3) var(--lz-space-2) calc(var(--lz-space-3) + var(--lz-notice-file-icon-size));
  border: var(--lz-notice-border-width) solid var(--lz-notice-border);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-notice-surface-soft);
  color: var(--lz-notice-text);
  font-size: var(--lz-font-size-sm);
  font-weight: var(--lz-notice-font-weight-meta);
  line-height: var(--lz-line-height-normal);
  overflow-wrap: anywhere;
  text-decoration: none;
}

.jn-system-notice-body .notice-file-attachment::before {
  position: absolute;
  left: var(--lz-space-3);
  width: var(--lz-icon-size-md);
  height: var(--lz-icon-size-md);
  display: grid;
  place-items: center;
  border-radius: var(--lz-radius-sm);
  background: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 82%);
  color: var(--jn-notice-accent, var(--lz-notice-accent-default));
  content: '↓';
  font-size: var(--lz-font-size-xs);
  line-height: var(--lz-line-height-tight);
}

.jn-system-notice-body .notice-file-attachment:hover {
  border-color: color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 48%);
  background: var(--lz-notice-surface-raised);
  text-decoration: none;
}

.jn-system-notice-body .notice-section-title {
  position: relative;
  display: grid;
  width: 100%;
  max-width: 100%;
  grid-template-columns: var(--lz-space-2) minmax(0, 1fr);
  align-items: center;
  gap: var(--lz-space-3);
  margin: var(--lz-space-5) 0 var(--lz-space-3);
  padding: var(--lz-space-3) var(--lz-space-4);
  border: var(--lz-notice-border-width) solid color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 68%);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-notice-block-title-surface);
  color: var(--notice-text-color, var(--lz-notice-title));
  font-size: var(--notice-text-size, var(--lz-font-size-lg));
  font-weight: var(--lz-notice-font-weight-heading);
  line-height: var(--lz-line-height-normal);
  overflow-wrap: anywhere;
}

.jn-system-notice-body .notice-section-title::before {
  width: var(--lz-space-1);
  height: var(--lz-space-5);
  border-radius: var(--lz-radius-pill);
  background: var(--jn-notice-accent, var(--lz-notice-accent-default));
  box-shadow: 0 0 var(--lz-space-3) color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 58%);
  content: '';
}

.jn-system-notice-body .notice-pill {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  align-items: center;
  gap: var(--lz-space-2);
  margin: var(--lz-space-1) var(--lz-space-1) var(--lz-space-2) 0;
  padding: var(--lz-space-1) var(--lz-space-3);
  border: var(--lz-notice-border-width) solid color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 52%);
  border-radius: var(--lz-radius-pill);
  background: var(--lz-notice-block-pill-surface);
  color: var(--notice-text-color, var(--lz-notice-title));
  font-size: var(--notice-text-size, var(--lz-font-size-sm));
  font-weight: var(--lz-notice-font-weight-label);
  line-height: var(--lz-line-height-normal);
  overflow-wrap: anywhere;
}

.jn-system-notice-body .notice-pill::before {
  width: var(--lz-space-2);
  height: var(--lz-space-2);
  flex: 0 0 auto;
  border-radius: var(--lz-radius-pill);
  background: var(--jn-notice-accent, var(--lz-notice-accent-default));
  content: '';
}

.jn-system-notice-body .notice-tip-card {
  position: relative;
  display: block;
  margin: var(--lz-space-4) 0;
  padding: var(--lz-space-4);
  overflow: hidden;
  border: var(--lz-notice-border-width) solid color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 64%);
  border-radius: var(--lz-radius-lg);
  background: var(--lz-notice-block-card-surface);
  color: var(--notice-text-color, var(--lz-notice-text));
  font-size: var(--notice-text-size, inherit);
  line-height: var(--lz-line-height-normal);
  box-shadow: var(--lz-notice-block-shadow);
  overflow-wrap: anywhere;
}

.jn-system-notice-body .notice-tip-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: var(--lz-notice-accent-line-width);
  background: linear-gradient(90deg, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent);
  content: '';
}

.jn-system-notice-body .notice-soft-line {
  display: block;
  margin: var(--lz-space-3) 0;
  padding: var(--lz-space-3) var(--lz-space-4);
  border-left: var(--lz-notice-accent-line-width) solid color-mix(in srgb, var(--jn-notice-accent, var(--lz-notice-accent-default)), transparent 20%);
  border-radius: 0 var(--lz-radius-md) var(--lz-radius-md) 0;
  background: var(--lz-notice-block-line-surface);
  color: var(--notice-text-color, var(--lz-notice-text));
  font-size: var(--notice-text-size, inherit);
  line-height: var(--lz-line-height-normal);
  overflow-wrap: anywhere;
}

.jn-system-notice-flow-card.is-type-activity {
  --jn-notice-accent: var(--lz-notice-accent-activity);
}

.jn-system-notice-flow-card.is-type-maintenance {
  --jn-notice-accent: var(--lz-notice-accent-maintenance);
}

.jn-system-notice-flow-card.is-type-notice {
  --jn-notice-accent: var(--lz-notice-accent-general);
}

.jn-system-notice-empty{min-height:260px;display:grid;place-items:center;text-align:center;border:1px dashed rgba(125,211,252,.22);border-radius:18px;background:rgba(15,23,42,.38);color:#b6c7dd;font-size:14px;font-weight:800}
.jn-system-notice-foot{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;gap:16px;padding:16px 24px 20px;border-top:1px solid rgba(148,163,184,.14);background:linear-gradient(180deg,rgba(15,23,42,.30),rgba(2,6,23,.40));text-align:center}
.jn-system-notice-foot>span{color:#b8c7dc;font-size:12px;font-weight:900}
.jn-system-notice-nav{display:flex;align-items:center;gap:10px}
.jn-system-notice-nav button{min-width:84px;height:38px;padding:0 14px;border-radius:12px;border:1px solid rgba(148,163,184,.22);background:rgba(15,23,42,.66);color:#e5f6ff;font-size:12px;font-weight:900;line-height:1;box-shadow:none;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease}
.jn-system-notice-nav button:not(:disabled):hover{transform:translateY(-1px);border-color:rgba(125,211,252,.45);background:rgba(14,165,233,.18)}
.jn-system-notice-nav button.is-primary{min-width:92px;border:0;background:linear-gradient(135deg,#0ea5e9,#2563eb 52%,#7c3aed);color:#fff;box-shadow:0 14px 30px rgba(37,99,235,.28)}
.jn-system-notice-nav button:disabled{cursor:not-allowed;opacity:.46;box-shadow:none}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-layer,body.jn-light-mode:not(.page-admin) .jn-system-notice-layer,html[data-theme=light] body:not(.page-admin) .jn-system-notice-layer,body[data-theme=light]:not(.page-admin) .jn-system-notice-layer{background:linear-gradient(135deg,rgba(15,23,42,.36),rgba(71,85,105,.28)),repeating-linear-gradient(135deg,rgba(37,99,235,.08) 0 1px,transparent 1px 42px);color:#0f172a}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-modal,body.jn-light-mode:not(.page-admin) .jn-system-notice-modal,html[data-theme=light] body:not(.page-admin) .jn-system-notice-modal,body[data-theme=light]:not(.page-admin) .jn-system-notice-modal{background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(241,245,249,.98));color:#0f172a;border-color:rgba(37,99,235,.18);box-shadow:0 30px 88px rgba(15,23,42,.24),0 0 0 1px rgba(255,255,255,.8),inset 0 1px 0 rgba(255,255,255,.96)}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-head,body.jn-light-mode:not(.page-admin) .jn-system-notice-head,html[data-theme=light] body:not(.page-admin) .jn-system-notice-head,body[data-theme=light]:not(.page-admin) .jn-system-notice-head{background:linear-gradient(180deg,rgba(248,250,252,.92),rgba(255,255,255,.55));border-bottom-color:rgba(15,23,42,.08)}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-title h2,body.jn-light-mode:not(.page-admin) .jn-system-notice-title h2,html[data-theme=light] body:not(.page-admin) .jn-system-notice-title h2,body[data-theme=light]:not(.page-admin) .jn-system-notice-title h2{color:#0f172a}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-title p,body.jn-light-mode:not(.page-admin) .jn-system-notice-title p,html[data-theme=light] body:not(.page-admin) .jn-system-notice-title p,body[data-theme=light]:not(.page-admin) .jn-system-notice-title p{color:#64748b}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-head-actions>span,body.jn-light-mode:not(.page-admin) .jn-system-notice-head-actions>span,html[data-theme=light] body:not(.page-admin) .jn-system-notice-head-actions>span,body[data-theme=light]:not(.page-admin) .jn-system-notice-head-actions>span{background:#fff;color:#334155;border-color:rgba(15,23,42,.10)}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-scroll,body.jn-light-mode:not(.page-admin) .jn-system-notice-scroll,html[data-theme=light] body:not(.page-admin) .jn-system-notice-scroll,body[data-theme=light]:not(.page-admin) .jn-system-notice-scroll{background:linear-gradient(180deg,rgba(248,250,252,.56),rgba(226,232,240,.46))}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-foot,body.jn-light-mode:not(.page-admin) .jn-system-notice-foot,html[data-theme=light] body:not(.page-admin) .jn-system-notice-foot,body[data-theme=light]:not(.page-admin) .jn-system-notice-foot{background:linear-gradient(180deg,rgba(248,250,252,.55),rgba(255,255,255,.88));border-top-color:rgba(15,23,42,.08)}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-foot>span,body.jn-light-mode:not(.page-admin) .jn-system-notice-foot>span,html[data-theme=light] body:not(.page-admin) .jn-system-notice-foot>span,body[data-theme=light]:not(.page-admin) .jn-system-notice-foot>span{color:#64748b}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-modal :is(.jn-system-notice-close,.jn-system-notice-nav button),body.jn-light-mode:not(.page-admin) .jn-system-notice-modal :is(.jn-system-notice-close,.jn-system-notice-nav button),html[data-theme=light] body:not(.page-admin) .jn-system-notice-modal :is(.jn-system-notice-close,.jn-system-notice-nav button),body[data-theme=light]:not(.page-admin) .jn-system-notice-modal :is(.jn-system-notice-close,.jn-system-notice-nav button){background:#fff;border-color:rgba(15,23,42,.12)}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-modal .jn-system-notice-close,body.jn-light-mode:not(.page-admin) .jn-system-notice-modal .jn-system-notice-close,html[data-theme=light] body:not(.page-admin) .jn-system-notice-modal .jn-system-notice-close,body[data-theme=light]:not(.page-admin) .jn-system-notice-modal .jn-system-notice-close{color:#0f172a}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button,body.jn-light-mode:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button,html[data-theme=light] body:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button,body[data-theme=light]:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button{color:#1e293b}
html.jn-light-mode body:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button.is-primary,body.jn-light-mode:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button.is-primary,html[data-theme=light] body:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button.is-primary,body[data-theme=light]:not(.page-admin) .jn-system-notice-modal .jn-system-notice-nav button.is-primary{background:linear-gradient(135deg,#0ea5e9,#2563eb 52%,#7c3aed);color:#fff;box-shadow:0 14px 28px rgba(37,99,235,.24)}
@media(max-width:760px){
  html body:not(.page-admin) .jn-system-notice-layer,body:not(.page-admin) .jn-system-notice-layer{place-items:end center;padding:48px 8px calc(8px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,rgba(2,6,23,.22),rgba(2,6,23,.72))}
  html body:not(.page-admin) .jn-system-notice-modal,body:not(.page-admin) .jn-system-notice-modal{width:min(460px,100%);max-width:100%;max-height:calc(100vh - 56px);max-height:calc(100dvh - 56px - env(safe-area-inset-bottom,0px));border-radius:22px 22px 0 0;grid-template-rows:auto auto minmax(0,1fr);animation:jnSystemNoticeSheetIn .24s cubic-bezier(.2,.86,.2,1) both}
  html body:not(.page-admin) .jn-system-notice-modal::after,body:not(.page-admin) .jn-system-notice-modal::after{height:92px;opacity:.58}
  html body:not(.page-admin) .jn-system-notice-head,body:not(.page-admin) .jn-system-notice-head{align-items:center;gap:10px;padding:16px 14px 12px}
}

@media(max-width:760px){
  html body:not(.page-admin) .jn-system-notice-title,body:not(.page-admin) .jn-system-notice-title{gap:10px}
  html body:not(.page-admin) .jn-system-notice-icon,body:not(.page-admin) .jn-system-notice-icon{width:40px;height:40px;border-radius:14px}
  html body:not(.page-admin) .jn-system-notice-icon::before,body:not(.page-admin) .jn-system-notice-icon::before{width:20px;height:20px;-webkit-mask-size:20px 20px;mask-size:20px 20px}
  html body:not(.page-admin) .jn-system-notice-icon::after,body:not(.page-admin) .jn-system-notice-icon::after{inset:6px;border-radius:10px}
  html body:not(.page-admin) .jn-system-notice-title small,body:not(.page-admin) .jn-system-notice-title small{margin-bottom:5px;padding:4px 8px;font-size:10px}
  html body:not(.page-admin) .jn-system-notice-title h2,body:not(.page-admin) .jn-system-notice-title h2{max-width:calc(100vw - 128px);font-size:18px;line-height:1.22}
  html body:not(.page-admin) .jn-system-notice-title p,body:not(.page-admin) .jn-system-notice-title p{margin-top:5px;font-size:11px;gap:6px}
  html body:not(.page-admin) .jn-system-notice-title p em,body:not(.page-admin) .jn-system-notice-title p em{height:18px;padding:0 7px;font-size:10px}
  html body:not(.page-admin) .jn-system-notice-head-actions,body:not(.page-admin) .jn-system-notice-head-actions{gap:7px}
  html body:not(.page-admin) .jn-system-notice-head-actions>span,body:not(.page-admin) .jn-system-notice-head-actions>span{display:none}
  html body:not(.page-admin) .jn-system-notice-close,body:not(.page-admin) .jn-system-notice-close{width:36px;height:36px;border-radius:12px}
  html body:not(.page-admin) .jn-system-notice-progress,body:not(.page-admin) .jn-system-notice-progress{height:5px;margin:0 14px}
  html body:not(.page-admin) .jn-system-notice-scroll,body:not(.page-admin) .jn-system-notice-scroll{padding:14px;overflow:auto;background:linear-gradient(180deg,rgba(2,6,23,.10),rgba(2,6,23,.24))}
  html body:not(.page-admin) .jn-system-notice-flow,body:not(.page-admin) .jn-system-notice-flow{gap:12px;padding:0 0 12px}
  html body:not(.page-admin) .jn-system-notice-flow-card,body:not(.page-admin) .jn-system-notice-flow-card{padding:14px;border-radius:16px;gap:11px}
  html body:not(.page-admin) .jn-system-notice-flow-card::after,body:not(.page-admin) .jn-system-notice-flow-card::after{right:14px;top:14px}
  html body:not(.page-admin) .jn-system-notice-flow-title,body:not(.page-admin) .jn-system-notice-flow-title{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
  html body:not(.page-admin) .jn-system-notice-flow-badges,body:not(.page-admin) .jn-system-notice-flow-badges{gap:6px}
  html body:not(.page-admin) .jn-system-notice-flow-title>span:not(.jn-system-notice-flow-badges),body:not(.page-admin) .jn-system-notice-flow-title>span:not(.jn-system-notice-flow-badges){grid-template-columns:28px minmax(0,1fr);gap:8px;padding:8px 9px;border-radius:12px}
  html body:not(.page-admin) .jn-system-notice-flow-title i,body:not(.page-admin) .jn-system-notice-flow-title i{width:26px;height:26px;border-radius:9px;font-size:14px}
  html body:not(.page-admin) .jn-system-notice-flow-title strong,body:not(.page-admin) .jn-system-notice-flow-title strong{font-size:14px;line-height:1.32}
  html body:not(.page-admin) .jn-system-notice-flow-badges>b,body:not(.page-admin) .jn-system-notice-flow-badges>b{height:28px;padding:0 9px;font-size:10.5px}
  html body:not(.page-admin) .jn-system-notice-flow-meta,body:not(.page-admin) .jn-system-notice-flow-meta{gap:6px;font-size:11px}
  html body:not(.page-admin) .jn-system-notice-flow-meta time,body:not(.page-admin) .jn-system-notice-flow-meta time{white-space:normal}
  html body:not(.page-admin) .jn-system-notice-body,body:not(.page-admin) .jn-system-notice-body{font-size:var(--lz-notice-font-size-body-mobile);line-height:var(--lz-notice-line-height-body-mobile)}
  html body:not(.page-admin) .jn-system-notice-body :is(p,div,section,article,ul,ol,blockquote,pre,table),body:not(.page-admin) .jn-system-notice-body :is(p,div,section,article,ul,ol,blockquote,pre,table){margin-bottom:10px}
  html body:not(.page-admin) .jn-system-notice-empty,body:not(.page-admin) .jn-system-notice-empty{min-height:210px;border-radius:16px}
  html body:not(.page-admin) .jn-system-notice-foot,body:not(.page-admin) .jn-system-notice-foot{display:grid;grid-template-columns:1fr;gap:9px;padding:11px 12px calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,rgba(15,23,42,.28),rgba(2,6,23,.48))}
  html body:not(.page-admin) .jn-system-notice-foot>span,body:not(.page-admin) .jn-system-notice-foot>span{text-align:center;font-size:11px}
  html body:not(.page-admin) .jn-system-notice-body :is(.notice-content-image,.notice-content-video),body:not(.page-admin) .jn-system-notice-body :is(.notice-content-image,.notice-content-video){width:100%;max-height:var(--lz-notice-media-mobile-max-height)}
  html body:not(.page-admin) .jn-system-notice-body .notice-file-attachment,body:not(.page-admin) .jn-system-notice-body .notice-file-attachment{width:100%;display:flex}
  html body:not(.page-admin) .jn-system-notice-body :is(.notice-section-title,.notice-tip-card,.notice-soft-line),body:not(.page-admin) .jn-system-notice-body :is(.notice-section-title,.notice-tip-card,.notice-soft-line){padding:var(--lz-space-3)}
}

@media(max-width:760px){
  html body:not(.page-admin) .jn-system-notice-nav,body:not(.page-admin) .jn-system-notice-nav{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  html body:not(.page-admin) .jn-system-notice-nav button,body:not(.page-admin) .jn-system-notice-nav button{width:100%;min-width:0;height:36px;padding:0 6px;border-radius:12px;font-size:12px}
}
@media(max-width:380px){
  html body:not(.page-admin) .jn-system-notice-layer,body:not(.page-admin) .jn-system-notice-layer{padding:44px 6px calc(6px + env(safe-area-inset-bottom,0px))}
  html body:not(.page-admin) .jn-system-notice-modal,body:not(.page-admin) .jn-system-notice-modal{max-height:calc(100vh - 50px);max-height:calc(100dvh - 50px - env(safe-area-inset-bottom,0px))}
  html body:not(.page-admin) .jn-system-notice-title small,body:not(.page-admin) .jn-system-notice-title small{display:none}
  html body:not(.page-admin) .jn-system-notice-title h2,body:not(.page-admin) .jn-system-notice-title h2{font-size:17px;max-width:calc(100vw - 112px)}
  html body:not(.page-admin) .jn-system-notice-title p,body:not(.page-admin) .jn-system-notice-title p{font-size:10.5px}
  html body:not(.page-admin) .jn-system-notice-flow-title,body:not(.page-admin) .jn-system-notice-flow-title{grid-template-columns:1fr}
  html body:not(.page-admin) .jn-system-notice-flow-badges,body:not(.page-admin) .jn-system-notice-flow-badges{justify-self:start;flex-wrap:wrap}
}
/* System notice light theme must follow the responsive rules above. */
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .jn-system-notice-scroll,body:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .jn-system-notice-scroll{background:linear-gradient(180deg,rgba(248,250,252,.72),rgba(226,232,240,.58))}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .jn-system-notice-title small,body:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .jn-system-notice-title small{border-color:rgba(13,148,136,.24);background:rgba(20,184,166,.10);color:#64748b}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .jn-system-notice-title p em,body:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .jn-system-notice-title p em{border-color:rgba(2,132,199,.20);background:rgba(14,165,233,.09);color:#0369a1}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .jn-system-notice-flow-title>span:not(.jn-system-notice-flow-badges),body:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .jn-system-notice-flow-title>span:not(.jn-system-notice-flow-badges){background:linear-gradient(135deg,color-mix(in srgb,var(--jn-notice-accent,#38bdf8),transparent 88%),rgba(255,255,255,.82))}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .jn-system-notice-flow-badges>b:not(.jn-system-notice-pin),body:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .jn-system-notice-flow-badges>b:not(.jn-system-notice-pin){color:color-mix(in srgb,var(--jn-notice-accent,#0284c7),#0f172a 45%)}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .jn-system-notice-empty,body:is(.jn-light-mode,[data-theme=light]):not(.page-admin) .jn-system-notice-empty{border-color:rgba(37,99,235,.20);background:#f8fafc;color:#64748b}

body.page-app .jn-system-notice-close{min-width:0}
body:not(.page-admin) .jn-system-notice-flow-meta time{color:#949494}

.front-password-setup-layer{position:fixed;inset:0;z-index:var(--lz-z-priority-dialog);display:grid;place-items:center;padding:var(--lz-space-4);background:var(--lz-front-password-overlay);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);isolation:isolate}
.front-password-setup-layer[hidden]{display:none}
.front-password-setup-modal{position:relative;width:min(420px,calc(100vw - (var(--lz-space-4) * 2)));max-height:calc(100dvh - (var(--lz-space-4) * 2));overflow:auto;display:grid;gap:var(--lz-space-4);padding:var(--lz-space-8);border:1px solid var(--lz-front-composer-border);border-radius:var(--lz-radius-lg);background:var(--lz-front-composer-panel);color:var(--lz-front-composer-text);box-shadow:var(--lz-front-param-shadow)}
.front-password-setup-modal::-webkit-scrollbar{width:0;height:0}
.front-password-setup-close{position:absolute;top:var(--lz-space-4);right:var(--lz-space-4);width:32px;height:32px;display:grid;place-items:center;padding:0;border:1px solid var(--lz-front-composer-control-border);border-radius:var(--lz-radius-md);background:var(--lz-front-composer-control);color:var(--lz-front-composer-muted);font:var(--lz-font-size-xl)/1 var(--lz-font-sans);cursor:pointer}
.front-password-setup-close:hover{background:var(--lz-front-floating-control-hover);color:var(--lz-front-composer-text)}
.front-password-setup-close:focus-visible,.front-password-setup-modal input:focus-visible,.front-password-setup-actions button:focus-visible{outline:2px solid var(--lz-color-primary);outline-offset:2px}
.front-password-setup-icon{width:56px;height:56px;display:grid;place-items:center;margin:0 auto;border:1px solid var(--lz-front-composer-control-border);border-radius:50%;background:var(--lz-front-composer-control);color:var(--lz-front-composer-text)}
.front-password-setup-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.front-password-setup-modal h2{margin:0;text-align:center;color:var(--lz-front-composer-text);font:800 22px/var(--lz-line-height-tight) var(--lz-font-sans)}
.front-password-setup-modal>p{margin:calc(var(--lz-space-2) * -1) 0 0;text-align:center;color:var(--lz-front-composer-muted);font:var(--lz-font-size-sm)/var(--lz-line-height-normal) var(--lz-font-sans)}
.front-password-setup-modal label{display:grid;gap:var(--lz-space-2);color:var(--lz-front-composer-text);font:700 var(--lz-font-size-sm)/var(--lz-line-height-tight) var(--lz-font-sans)}
.front-password-setup-modal input{box-sizing:border-box;width:100%;height:42px;padding:0 var(--lz-space-3);border:1px solid var(--lz-front-composer-control-border);border-radius:var(--lz-radius-md);outline:0;background:var(--lz-front-composer-control);color:var(--lz-front-composer-text);font:var(--lz-font-size-md)/1 var(--lz-font-sans)}
.front-password-setup-modal input::placeholder{color:var(--lz-front-composer-muted)}
.front-password-setup-modal small{color:var(--lz-front-composer-muted);font:var(--lz-font-size-xs)/var(--lz-line-height-normal) var(--lz-font-sans)}
.front-password-setup-message{padding:var(--lz-space-2) var(--lz-space-3);border:1px solid var(--lz-color-danger);border-radius:var(--lz-radius-md);color:var(--lz-color-danger);font:var(--lz-font-size-sm)/var(--lz-line-height-normal) var(--lz-font-sans);text-align:center}
.front-password-setup-message[hidden]{display:none}
.front-password-setup-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--lz-space-3);padding-top:var(--lz-space-1)}
.front-password-setup-actions button{height:42px;padding:0 var(--lz-space-4);border-radius:var(--lz-radius-md);font:800 var(--lz-font-size-md)/1 var(--lz-font-sans);cursor:pointer;white-space:nowrap}
.front-password-setup-actions .secondary{border:1px solid var(--lz-front-composer-control-border);background:var(--lz-front-composer-control);color:var(--lz-front-composer-text)}
.front-password-setup-actions .primary{border:1px solid var(--lz-color-primary);background:var(--lz-color-primary);color:var(--lz-color-surface)}
.front-password-setup-actions .primary:hover{background:var(--lz-color-primary-hover)}
.front-password-setup-actions button:disabled{cursor:not-allowed;opacity:.62}
@media (max-width:520px){.front-password-setup-layer{align-items:end;padding:var(--lz-space-3)}.front-password-setup-modal{width:100%;max-height:calc(100dvh - (var(--lz-space-3) * 2));padding:var(--lz-space-6) var(--lz-space-4);border-radius:var(--lz-radius-lg)}.front-password-setup-actions{grid-template-columns:1fr}}
html.jn-browser-compat body:not(.page-admin) .front-password-setup-layer{box-sizing:border-box;top:var(--jn-compat-viewport-top,0);right:auto;bottom:auto;left:var(--jn-compat-viewport-left,0);width:var(--jn-compat-viewport-width,100vw);height:var(--jn-compat-viewport-height,100vh);max-width:var(--jn-compat-viewport-width,100vw);max-height:var(--jn-compat-viewport-height,100vh)}
html.jn-browser-compat body:not(.page-admin) .front-password-setup-modal{box-sizing:border-box;min-width:0;min-height:0;max-width:calc(var(--jn-compat-viewport-width,100vw) - (var(--lz-space-4) * 2));max-height:calc(var(--jn-compat-viewport-height,100vh) - (var(--lz-space-4) * 2))}

body:not(.page-admin) .front-creative-confirm-layer.front-creative-video-confirm-layer{
  position:fixed;
  inset:0;
  z-index:100120;
  display:grid;
  place-items:center;
  padding:16px;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .16s ease,visibility .16s ease;
}
body:not(.page-admin) .front-creative-confirm-layer.front-creative-video-confirm-layer.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
body:not(.page-admin) .front-creative-confirm-panel.front-creative-video-confirm-panel{
  width:min(420px,calc(100vw - 32px));
  overflow:hidden;
  border-radius:18px;
  background:#17191d;
  background-image:none;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 28px 90px rgba(0,0,0,.48);
  color:#f2f2f2;
  -webkit-text-fill-color:#f2f2f2;
  color-scheme:dark;
  padding:0;
  display:block;
  transform:translateY(8px) scale(.98);
  transition:transform .16s ease;
}
body:not(.page-admin) .front-creative-confirm-layer.front-creative-video-confirm-layer.is-open .front-creative-confirm-panel.front-creative-video-confirm-panel{
  transform:none;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head{
  height:48px;
  padding:0 14px 0 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #2d2d2d;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head span{
  font-size:12px;
  font-weight:900;
  letter-spacing:0;
  color:#bdbdbd;
  -webkit-text-fill-color:#bdbdbd;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body{
  padding:22px 22px 18px;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body h3{
  margin:0 0 10px;
  font-size:18px;
  line-height:1.25;
  color:#f2f2f2;
  -webkit-text-fill-color:#f2f2f2;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body p{
  margin:0;
  font-size:14px;
  line-height:1.65;
  color:#bdbdbd;
  -webkit-text-fill-color:#bdbdbd;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions{
  padding:14px 18px 18px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin:0;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head button,
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-cancel]{
  background:#242424;
  background-image:none;
  border:1px solid #3a3a3a;
  color:#f2f2f2;
  -webkit-text-fill-color:#f2f2f2;
  box-shadow:none;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head button{
  width:32px;
  height:32px;
  min-width:0;
  border-radius:10px;
  border:0;
  font-size:20px;
  line-height:1;
  padding:0;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button{
  height:38px;
  min-width:88px;
  padding:0 16px;
  border-radius:12px;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
}
body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-ok]{
  background:#2584ff;
  background-image:none;
  border:1px solid #2584ff;
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 8px 22px rgba(37,132,255,.22);
}
body:not(.page-admin) .front-creative-confirm-layer.is-danger .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-ok]{
  background:#dc2626;
  background-image:none;
  border-color:#dc2626;
  box-shadow:0 8px 22px rgba(220,38,38,.22);
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel.front-creative-video-confirm-panel,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel.front-creative-video-confirm-panel,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel.front-creative-video-confirm-panel,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel.front-creative-video-confirm-panel{
  background:#f8fafc;
  background-image:none;
  border:1px solid rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:0 26px 80px rgba(15,23,42,.16);
  color-scheme:light;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head{
  background:#f8fafc;
  border-color:rgba(15,23,42,.10);
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head span,
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body p,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head span,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body p,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head span,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body p,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head span,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body p{
  color:#64748b;
  -webkit-text-fill-color:#64748b;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body h3,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body h3,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body h3,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-body h3{
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head button,
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-cancel],
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head button,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-cancel],
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head button,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-cancel],
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-head button,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-cancel]{
  background:#eef2f7;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:none;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-ok],
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-ok],
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-ok],
body.jn-light-mode:not(.page-admin) .front-creative-confirm-panel .front-creative-confirm-actions button[data-confirm-ok]{
  background:#2563eb;
  background-image:none;
  border-color:#2563eb;
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 10px 24px rgba(37,99,235,.22);
}
html.jn-light-mode body:not(.page-admin):not(#jnConfirmActionLightA):not(#jnConfirmActionLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer .front-creative-confirm-actions button[data-confirm-ok],
html[data-theme=light] body:not(.page-admin):not(#jnConfirmActionLightA):not(#jnConfirmActionLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer .front-creative-confirm-actions button[data-confirm-ok],
body.jn-light-mode:not(.page-admin):not(#jnConfirmActionLightA):not(#jnConfirmActionLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer .front-creative-confirm-actions button[data-confirm-ok],
body[data-theme=light]:not(.page-admin):not(#jnConfirmActionLightA):not(#jnConfirmActionLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer .front-creative-confirm-actions button[data-confirm-ok]{
  background:#2563eb;
  background-image:none;
  border-color:#2563eb;
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 10px 24px rgba(37,99,235,.22);
}
html.jn-light-mode body:not(.page-admin):not(#jnConfirmDangerLightA):not(#jnConfirmDangerLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer.is-danger .front-creative-confirm-actions button[data-confirm-ok],
html[data-theme=light] body:not(.page-admin):not(#jnConfirmDangerLightA):not(#jnConfirmDangerLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer.is-danger .front-creative-confirm-actions button[data-confirm-ok],
body.jn-light-mode:not(.page-admin):not(#jnConfirmDangerLightA):not(#jnConfirmDangerLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer.is-danger .front-creative-confirm-actions button[data-confirm-ok],
body[data-theme=light]:not(.page-admin):not(#jnConfirmDangerLightA):not(#jnConfirmDangerLightB) .front-creative-confirm-layer.front-creative-video-confirm-layer.is-danger .front-creative-confirm-actions button[data-confirm-ok]{
  background:#dc2626;
  background-image:none;
  border-color:#dc2626;
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 10px 24px rgba(220,38,38,.22);
}

/* API key manager visual refresh 2026-07-16 */
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-bg:#1d2735;
  --api-head:#202c3b;
  --api-body:#243141;
  --api-panel:#2a3849;
  --api-panel-strong:#303f51;
  --api-field:#344457;
  --api-row:#2f3e50;
  --api-row-hover:#35485d;
  --api-border:#46586d;
  --api-border-soft:#3b4b5e;
  --api-text:#f4f7fb;
  --api-text-strong:#ffffff;
  --api-muted:#aebbd0;
  --api-accent:#3b82f6;
  --api-accent-hover:#2563eb;
  --api-accent-soft:rgba(59,130,246,.16);
  --api-teal:#5eead4;
  --api-danger:#fda4af;
  padding:20px;
  place-items:center;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body:not(.page-admin):not(#jnApiManagerLight) .front-resource-layer[data-resource-dialog="api-tokens"],
body.jn-light-mode:not(.page-admin):not(#jnApiManagerLight) .front-resource-layer[data-resource-dialog="api-tokens"],
html[data-theme="light"] body:not(.page-admin):not(#jnApiManagerLight) .front-resource-layer[data-resource-dialog="api-tokens"],
body[data-theme="light"]:not(.page-admin):not(#jnApiManagerLight) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-bg:#f7f9fc;
  --api-head:#ffffff;
  --api-body:#f3f6fa;
  --api-panel:#ffffff;
  --api-panel-strong:#f7f9fc;
  --api-field:#ffffff;
  --api-row:#ffffff;
  --api-row-hover:#f2f7ff;
  --api-border:#d6dee9;
  --api-border-soft:#e2e8f0;
  --api-text:#263448;
  --api-text-strong:#172033;
  --api-muted:#66758a;
  --api-accent:#2563eb;
  --api-accent-hover:#1d4ed8;
  --api-accent-soft:#eaf2ff;
  --api-teal:#0f766e;
  --api-danger:#be123c;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  width:min(1160px,calc(100vw - 40px));
  max-height:min(850px,calc(100dvh - 40px));
  padding:0;
  overflow:hidden;
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-bg);
  background-image:none;
  color:var(--api-text);
  box-shadow:0 24px 64px rgba(30,41,59,.28),0 0 0 1px rgba(148,163,184,.06);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  min-height:92px;
  margin:0;
  padding:20px 22px;
  align-items:center;
  border-bottom:1px solid var(--api-border-soft);
  background:var(--api-head);
  background-image:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head>div:first-child{
  min-width:0;
  padding-left:15px;
  position:relative;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head>div:first-child::before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  bottom:3px;
  width:3px;
  border-radius:3px;
  background:linear-gradient(180deg,var(--api-accent),var(--api-teal));
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{
  margin:0;
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
  font-size:21px;
  line-height:1.3;
  letter-spacing:0;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head p{
  max-width:700px;
  margin:5px 0 0;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:12px;
  line-height:1.55;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close,
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor-close{
  width:38px;
  height:38px;
  min-width:38px;
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-panel-strong);
  background-image:none;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.front-resource-close,.jn-api-editor-close):hover{
  border-color:var(--api-accent);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  min-height:0;
  padding:16px 22px 22px;
  gap:14px;
  overflow:auto;
  background:var(--api-body);
  scrollbar-color:var(--api-border) transparent;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar,.jn-api-editor,.jn-api-table-wrap){
  border:1px solid var(--api-border-soft);
  border-radius:8px;
  background:var(--api-panel);
  background-image:none;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
  min-height:68px;
  padding:13px 14px;
  gap:16px;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar strong,.jn-api-form-head strong){
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
  font-size:14px;
  line-height:1.4;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar span,.jn-api-form-head span){
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:12px;
  line-height:1.5;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-count-chip{
  height:36px;
  padding:0 12px;
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-panel-strong);
  background-image:none;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary{
  height:38px;
  padding:0 15px;
  border:1px solid var(--api-accent);
  border-radius:8px;
  background:var(--api-accent);
  background-image:none;
  color:#fff;
  -webkit-text-fill-color:#fff;
  box-shadow:0 8px 18px rgba(37,99,235,.20);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary:hover{
  border-color:var(--api-accent-hover);
  background:var(--api-accent-hover);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{
  padding:16px;
  gap:14px;
  border-color:color-mix(in srgb,var(--api-accent) 35%,var(--api-border-soft));
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head>div{
  min-width:0;
  display:grid;
  gap:4px;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{
  grid-template-columns:minmax(200px,1.35fr) repeat(4,minmax(120px,1fr));
  gap:10px;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{
  gap:7px;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:12px;
  font-weight:750;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){
  height:40px;
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-field);
  background-image:none;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select):focus{
  border-color:var(--api-accent);
  outline:none;
  box-shadow:0 0 0 3px var(--api-accent-soft);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{
  gap:8px;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{
  min-height:44px;
  padding:0 11px;
  border:1px solid var(--api-border-soft);
  border-radius:8px;
  background:var(--api-panel-strong);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{
  border-color:var(--api-border);
  background:#56677a;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{
  background:#d2dbe6;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){
  border-color:color-mix(in srgb,var(--api-accent) 55%,var(--api-border));
  background:var(--api-accent-soft);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary{
  height:38px;
  padding:0 15px;
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-panel-strong);
  background-image:none;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created{
  padding:12px;
  border:1px solid color-mix(in srgb,var(--api-accent) 40%,var(--api-border));
  border-radius:8px;
  background:var(--api-accent-soft);
  color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created code{
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-field);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  min-height:210px;
  padding:8px 10px 10px;
  overflow:auto;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{
  border-spacing:0 7px;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{
  height:34px;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:11px;
  font-weight:800;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
  padding:11px 10px;
  border-top:1px solid var(--api-border-soft);
  border-bottom:1px solid var(--api-border-soft);
  background:var(--api-row);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr:hover td{
  background:var(--api-row-hover);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:first-child{
  border-left:1px solid var(--api-border-soft);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:last-child{
  border-right:1px solid var(--api-border-soft);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-name-cell strong,.jn-api-number-cell,.jn-api-time-cell time){
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-name-cell small,.jn-api-time-cell small){
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-cell code{
  border:1px solid var(--api-border);
  border-radius:6px;
  background:var(--api-field);
  color:var(--api-teal);
  -webkit-text-fill-color:var(--api-teal);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-policy-cell span{
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  height:26px;
  min-width:52px;
  padding:0 10px;
  border-color:color-mix(in srgb,var(--api-teal) 45%,transparent);
  background:color-mix(in srgb,var(--api-teal) 14%,transparent);
  color:var(--api-teal);
  -webkit-text-fill-color:var(--api-teal);
  line-height:26px;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{
  border-color:color-mix(in srgb,var(--api-danger) 38%,transparent);
  background:color-mix(in srgb,var(--api-danger) 12%,transparent);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body:not(.page-admin):not(#jnApiManagerUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action{
  height:32px;
  border:1px solid var(--api-border);
  border-radius:6px;
  background:var(--api-panel-strong);
  background-image:none;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiManagerUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-primary{
  border-color:color-mix(in srgb,var(--api-accent) 45%,var(--api-border));
  background:var(--api-accent-soft);
  color:color-mix(in srgb,var(--api-accent) 74%,var(--api-text-strong));
  -webkit-text-fill-color:color-mix(in srgb,var(--api-accent) 74%,var(--api-text-strong));
}
html body:not(.page-admin):not(#jnApiManagerUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-danger{
  border-color:color-mix(in srgb,var(--api-danger) 38%,var(--api-border));
  background:color-mix(in srgb,var(--api-danger) 10%,var(--api-panel-strong));
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] [data-api-token-empty]{
  min-height:188px;
  margin:4px 0 0;
  display:grid;
  place-items:center;
  padding:28px 18px;
  border:1px dashed color-mix(in srgb,var(--api-accent) 36%,var(--api-border));
  border-radius:8px;
  background:var(--api-panel-strong);
  background-image:none;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:13px;
  font-weight:700;
  text-align:center;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] [data-api-token-empty][hidden]{
  display:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{
  position:absolute;
  inset:0;
  z-index:100080;
  display:grid;
  place-items:center;
  padding:16px;
  background:rgba(51,65,85,.28);
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog[hidden]{
  display:none;
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{
  width:min(540px,calc(100vw - 32px));
  padding:22px;
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-panel);
  background-image:none;
  color:var(--api-text);
  box-shadow:0 22px 56px rgba(30,41,59,.28);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel strong{
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel p{
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel code{
  border:1px solid var(--api-border);
  border-radius:8px;
  background:var(--api-field);
  color:var(--api-teal);
  -webkit-text-fill-color:var(--api-teal);
}
@media(max-width:900px) and (min-width:761px){
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field:first-child{grid-column:1/-1}
}
@media(max-width:760px){
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"]{padding:8px;place-items:end center}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);min-height:0;border-radius:8px 8px 0 0;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{min-height:82px;padding:15px 14px}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head>div:first-child{padding-left:12px;padding-right:8px}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{font-size:18px}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{padding:11px 11px 14px}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{padding:12px;align-items:stretch;flex-direction:column}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-count-chip,.jn-api-create-trigger){width:100%}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid,
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{grid-template-columns:1fr}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{min-height:0;padding:0;border:0;background:transparent}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr{padding:10px;border:1px solid var(--api-border-soft);border-radius:8px;background:var(--api-row)}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{grid-template-columns:84px minmax(0,1fr);border-bottom:1px solid var(--api-border-soft);background:transparent}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td::before{color:var(--api-muted);-webkit-text-fill-color:var(--api-muted)}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] [data-api-token-empty]{min-height:180px}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{width:100%;padding:20px 14px 14px;border-radius:8px 8px 0 0}
}
@media(max-width:420px){
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{grid-template-columns:1fr}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions{grid-template-columns:1fr}
  html body:not(.page-admin):not(#jnApiManagerUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
}
html body:not(.page-admin):not(#jnApiLayerA):not(#jnApiLayerB):not(#jnApiLayerC):not(#jnApiLayerD) .front-resource-layer.jn-resource-layer[data-resource-dialog="api-tokens"]{
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}

/* API key manager compact frosted-charcoal refinement 2026-07-16 */
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-bg:rgba(34,34,33,.97);
  --api-head:rgba(38,38,37,.96);
  --api-body:rgba(28,28,27,.96);
  --api-panel:rgba(255,255,255,.025);
  --api-panel-strong:rgba(255,255,255,.045);
  --api-field:rgba(255,255,255,.055);
  --api-row:transparent;
  --api-row-hover:rgba(255,255,255,.032);
  --api-border:rgba(255,255,255,.12);
  --api-border-soft:rgba(255,255,255,.07);
  --api-text:#e9e9e6;
  --api-text-strong:#f5f5f2;
  --api-muted:#b7b7b1;
  --api-accent:#69d5c5;
  --api-accent-hover:#7ce2d3;
  --api-accent-soft:rgba(105,213,197,.13);
  --api-teal:#83dfd2;
  --api-danger:#e79a9a;
  --api-danger-soft:rgba(231,154,154,.08);
  padding:14px;
  color-scheme:dark;
}
html.jn-light-mode body:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"],
body.jn-light-mode:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"],
html[data-theme="light"] body:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"],
body[data-theme="light"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-bg:rgba(249,249,248,.98);
  --api-head:rgba(253,253,252,.97);
  --api-body:rgba(244,244,242,.98);
  --api-panel:rgba(255,255,255,.58);
  --api-panel-strong:rgba(25,25,23,.035);
  --api-field:rgba(255,255,255,.94);
  --api-row:transparent;
  --api-row-hover:rgba(24,24,22,.035);
  --api-border:rgba(24,24,22,.17);
  --api-border-soft:rgba(24,24,22,.09);
  --api-text:#3b3b38;
  --api-text-strong:#20201e;
  --api-muted:#666661;
  --api-accent:#168f82;
  --api-accent-hover:#117a70;
  --api-accent-soft:rgba(22,143,130,.10);
  --api-teal:#0f8176;
  --api-danger:#b74747;
  --api-danger-soft:rgba(183,71,71,.06);
  color-scheme:light;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  width:min(960px,calc(100vw - 28px));
  max-height:min(780px,calc(100dvh - 28px));
  border-color:var(--api-border);
  background:var(--api-bg);
  box-shadow:0 18px 46px rgba(12,12,11,.28),inset 0 1px 0 rgba(255,255,255,.03);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  min-height:62px;
  padding:10px 14px;
  border-bottom-color:var(--api-border-soft);
  background:var(--api-head);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head>div:first-child{
  padding-left:0;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head>div:first-child::before{
  display:none;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{
  font-size:17px;
  font-weight:680;
  letter-spacing:0;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head p{
  margin-top:3px;
  font-size:11px;
  line-height:1.4;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.front-resource-close,.jn-api-editor-close){
  width:30px;
  height:30px;
  min-width:30px;
  border-radius:6px;
  background:var(--api-panel-strong);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  padding:8px 12px 12px;
  gap:7px;
  background:var(--api-body);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
  min-height:46px;
  padding:5px 2px 7px;
  gap:8px;
  border:0;
  border-bottom:1px solid var(--api-border-soft);
  border-radius:0;
  background:transparent;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar strong,.jn-api-form-head strong){
  font-size:13px;
  font-weight:600;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar span,.jn-api-form-head span){
  font-size:11px;
  line-height:1.4;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-count-chip{
  height:28px;
  padding:0 9px;
  border-radius:6px;
  font-size:11px;
  font-weight:500;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary{
  height:30px;
  padding:0 11px;
  border-radius:6px;
  color:#183d38;
  -webkit-text-fill-color:#183d38;
  font-size:11px;
  font-weight:600;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{
  padding:11px 12px;
  gap:10px;
  border-color:var(--api-border);
  border-radius:6px;
  background:var(--api-panel);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head>div{
  gap:2px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{
  grid-template-columns:minmax(190px,1.35fr) repeat(4,minmax(110px,1fr));
  gap:8px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{
  gap:5px;
  font-size:11px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){
  height:34px;
  border-radius:6px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select):focus{
  box-shadow:0 0 0 2px var(--api-accent-soft);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{
  gap:6px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{
  min-height:35px;
  padding:0 9px;
  border-radius:6px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{
  background:#666660;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{
  background:#e0e0da;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary{
  height:32px;
  padding:0 12px;
  border-radius:6px;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  min-height:184px;
  padding:0 6px;
  border-color:var(--api-border-soft);
  border-radius:6px;
  background:var(--api-panel);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{
  border-spacing:0;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(1){width:15%}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(2){width:15%}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(3){width:11.5%}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(4),
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(5){width:6.5%}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(6){width:56px}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(7){width:10.5%}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(8){width:202px}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{
  height:28px;
  padding:0 7px;
  font-size:11px;
  font-weight:600;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
  padding:7px;
  border-top:0;
  border-bottom:1px solid var(--api-border-soft);
  background:transparent;
  font-size:11px;
  font-weight:400;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:first-child{
  border-left:0;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:last-child{
  border-right:0;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-cell code{
  border-radius:5px;
  background:var(--api-field);
  font-size:10.5px;
  font-weight:500;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-name-cell strong,.jn-api-number-cell,.jn-api-time-cell time){
  font-weight:550;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  height:22px;
  min-width:44px;
  padding:0 7px;
  line-height:22px;
  font-size:10.5px;
  font-weight:550;
  border-color:rgba(105,213,197,.22);
  background:var(--api-accent-soft);
  color:var(--api-teal);
  -webkit-text-fill-color:var(--api-teal);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{
  border-color:var(--api-border-soft);
  background:var(--api-panel-strong);
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html.jn-light-mode body[class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge,
html[data-theme="light"] body[class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge,
body.jn-light-mode[class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge,
body[data-theme="light"][class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  border-color:rgba(22,143,130,.24);
  background:var(--api-accent-soft);
  color:var(--api-teal);
  -webkit-text-fill-color:var(--api-teal);
}
html.jn-light-mode body[class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off,
html[data-theme="light"] body[class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off,
body.jn-light-mode[class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off,
body[data-theme="light"][class^="page-"]:not(.page-admin):not(#jnApiCompactLight) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{
  border-color:var(--api-border-soft);
  background:var(--api-panel-strong);
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html.jn-light-mode body.page-app:not(.page-admin):not(#jnApiBadgeA):not(#jnApiBadgeB):not(#jnApiBadgeC) .front-resource-layer.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell .jn-token-badge:not(.off),
html[data-theme="light"] body.page-app:not(.page-admin):not(#jnApiBadgeA):not(#jnApiBadgeB):not(#jnApiBadgeC) .front-resource-layer.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell .jn-token-badge:not(.off),
body.page-app.jn-light-mode:not(.page-admin):not(#jnApiBadgeA):not(#jnApiBadgeB):not(#jnApiBadgeC) .front-resource-layer.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell .jn-token-badge:not(.off){
  border-color:rgba(22,143,130,.24);
  background-color:rgba(22,143,130,.10);
  background-image:none;
  color:#0f8176;
  -webkit-text-fill-color:#0f8176;
}
html body:not(.page-admin):not(#jnApiCompactUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action{
  height:26px;
  padding:0 5px;
  border:1px solid var(--api-border-soft);
  border-radius:5px;
  background:var(--api-panel);
  background-image:none;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  font-size:10.5px;
  font-weight:550;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{
  grid-template-columns:repeat(5,minmax(34px,1fr));
  gap:4px;
}
html body:not(.page-admin):not(#jnApiCompactUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action:is(:hover,:focus-visible){
  border-color:var(--api-border);
  background:var(--api-panel-strong);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiCompactUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-primary{
  border-color:var(--api-border);
  background:var(--api-panel-strong);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiCompactUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-danger{
  border-color:var(--api-border-soft);
  background:var(--api-danger-soft);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{
  background:rgba(24,24,22,.38);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{
  width:min(480px,calc(100vw - 28px));
  padding:16px;
  border-radius:6px;
  background:var(--api-panel);
  box-shadow:0 16px 40px rgba(12,12,11,.32);
}
@media(max-width:760px){
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"]{padding:6px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{width:calc(100vw - 12px);max-height:calc(100dvh - 12px)}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{min-height:60px;padding:9px 11px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{font-size:17px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{padding:7px 8px 10px;gap:7px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{padding:6px 2px 7px;gap:7px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{grid-template-columns:88px minmax(0,1fr)}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{width:100%;min-width:0;padding:9px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{grid-template-columns:1fr;min-width:0}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{min-width:0}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){width:100%;min-width:0;max-width:100%}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{padding:0;background:transparent}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr{padding:7px;border-color:var(--api-border-soft);border-radius:6px;background:var(--api-panel)}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{grid-template-columns:72px minmax(0,1fr);padding:6px 2px}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{padding:14px;border-radius:6px 6px 0 0}
}
@media(max-width:420px){
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{grid-template-columns:82px minmax(0,1fr)}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body:not(.page-admin):not(#jnApiCompactUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* API key manager: light charcoal glass with clear surface separation. */
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-surface:rgba(39,42,39,.97);
  --api-surface-raised:rgba(48,52,48,.98);
  --api-surface-soft:rgba(58,63,58,.94);
  --api-table:rgba(31,34,31,.82);
  --api-row-hover:rgba(255,255,255,.052);
  --api-field:rgba(27,30,27,.88);
  --api-line:rgba(241,245,239,.16);
  --api-line-soft:rgba(241,245,239,.09);
  --api-text:#e7ebe5;
  --api-text-strong:#f7f9f5;
  --api-muted:#aab1aa;
  --api-accent:#d8dfd6;
  --api-accent-hover:#edf1eb;
  --api-accent-ink:#292d29;
  --api-accent-soft:rgba(121,174,145,.14);
  --api-danger:#dc8585;
  --api-danger-soft:rgba(220,133,133,.12);
  padding:12px;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color-scheme:dark;
}
html.jn-light-mode body:not(.page-admin):not(#jnApiCleanLight) .front-resource-layer[data-resource-dialog="api-tokens"],
html[data-theme="light"] body:not(.page-admin):not(#jnApiCleanLight) .front-resource-layer[data-resource-dialog="api-tokens"],
body.jn-light-mode:not(.page-admin):not(#jnApiCleanLight) .front-resource-layer[data-resource-dialog="api-tokens"],
body[data-theme="light"]:not(.page-admin):not(#jnApiCleanLight) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-surface:#f1efeb;
  --api-surface-raised:#faf8f4;
  --api-surface-soft:#e8e5df;
  --api-table:#fffdf9;
  --api-row-hover:rgba(36,34,30,.035);
  --api-field:#fffefa;
  --api-line:rgba(45,42,36,.16);
  --api-line-soft:rgba(45,42,36,.09);
  --api-text:#3d3a34;
  --api-text-strong:#24221e;
  --api-muted:#77736b;
  --api-accent:#4d4942;
  --api-accent-hover:#34312c;
  --api-accent-ink:#fffdf8;
  --api-accent-soft:rgba(77,73,66,.09);
  --api-danger:#b64d4d;
  --api-danger-soft:rgba(182,77,77,.08);
  color-scheme:light;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  width:min(900px,calc(100vw - 24px));
  max-height:min(700px,calc(100dvh - 24px));
  min-height:0;
  padding:0;
  overflow:hidden;
  border:1px solid var(--api-line);
  border-radius:8px;
  background:var(--api-surface);
  background-image:none;
  color:var(--api-text);
  box-shadow:0 24px 64px rgba(8,10,8,.38),inset 0 1px 0 rgba(255,255,255,.045);
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  min-height:50px;
  padding:0 12px 0 16px;
  border:0;
  border-bottom:1px solid var(--api-line-soft);
  background:var(--api-surface-raised);
  background-image:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{
  margin:0;
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
  font-size:16px;
  font-weight:650;
  line-height:1.3;
  letter-spacing:0;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close{
  width:30px;
  height:30px;
  min-width:30px;
  padding:0;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close:hover{
  background:var(--api-surface-soft);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  min-height:0;
  padding:8px 12px 12px;
  gap:8px;
  overflow:auto;
  background:var(--api-surface);
  background-image:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
  min-height:40px;
  padding:0 2px 7px;
  border:0;
  border-bottom:1px solid var(--api-line-soft);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-copy strong{
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  font-size:13px;
  font-weight:600;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{
  display:flex;
  width:auto;
  grid-template-columns:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-create-trigger{
  width:auto;
  height:32px;
  min-height:32px;
  padding:0 11px;
  gap:6px;
  border:1px solid var(--api-accent);
  border-radius:6px;
  background:var(--api-accent);
  background-image:none;
  color:var(--api-accent-ink);
  -webkit-text-fill-color:var(--api-accent-ink);
  font-size:12px;
  font-weight:650;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-create-trigger svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{
  padding:11px;
  gap:9px;
  border:1px solid var(--api-line);
  border-radius:6px;
  background:var(--api-surface-raised);
  background-image:none;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head strong,
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field,
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm span{
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head strong{font-size:13px;font-weight:600}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{
  grid-template-columns:minmax(180px,1.35fr) repeat(4,minmax(105px,1fr));
  gap:7px;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{gap:5px;font-size:11px}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){
  width:100%;
  height:34px;
  min-height:34px;
  border:1px solid var(--api-line);
  border-radius:5px;
  background:var(--api-field);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select):focus{
  border-color:var(--api-accent);
  box-shadow:0 0 0 2px var(--api-accent-soft);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{gap:6px}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{
  min-height:34px;
  padding:0 9px;
  border:1px solid var(--api-line-soft);
  border-radius:5px;
  background:var(--api-field);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions :is(.front-profile-secondary,.jn-api-primary){
  width:auto;
  height:32px;
  min-height:32px;
  padding:0 13px;
  border-radius:5px;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiPrimaryThemeA):not(#jnApiPrimaryThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary{
  border:1px solid var(--api-accent);
  background:var(--api-accent);
  background-image:none;
  color:var(--api-accent-ink);
  -webkit-text-fill-color:var(--api-accent-ink);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiPrimaryThemeA):not(#jnApiPrimaryThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary:is(:hover,:focus-visible){
  border-color:var(--api-accent-hover);
  background:var(--api-accent-hover);
  background-image:none;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiSwitchThemeA):not(#jnApiSwitchThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{
  border-color:var(--api-line);
  background:#66645f;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiSwitchThemeA):not(#jnApiSwitchThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{
  background:#e3e0da;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiSwitchThemeA):not(#jnApiSwitchThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked{
  border-color:var(--api-accent);
  background:var(--api-accent);
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiSwitchThemeA):not(#jnApiSwitchThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked::before{
  left:16px;
  background:var(--api-accent-ink);
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiSwitchThemeA):not(#jnApiSwitchThemeB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){
  border-color:color-mix(in srgb,var(--api-accent) 42%,var(--api-line));
  background:var(--api-accent-soft);
  color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  min-height:160px;
  padding:0;
  overflow:auto;
  border:1px solid var(--api-line-soft);
  border-radius:6px;
  background:var(--api-table);
  background-image:none;
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{
  width:100%;
  table-layout:fixed;
  border-collapse:collapse;
  border-spacing:0;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(1){width:14%}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(2){width:18%}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(3){width:12%}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(4){width:12%}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(5){width:8%}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(6){width:15%}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(7){width:178px}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{
  height:30px;
  padding:0 8px;
  border:0;
  border-bottom:1px solid var(--api-line-soft);
  background:var(--api-surface-raised);
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:10.5px;
  font-weight:550;
  text-align:left;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
  height:56px;
  padding:8px;
  overflow:hidden;
  border:0;
  border-bottom:1px solid var(--api-line-soft);
  background:transparent;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  font-size:11px;
  vertical-align:middle;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr:last-child td{border-bottom:0}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr:hover td{background:var(--api-row-hover)}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-name-cell strong,
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-quota-cell>span{
  display:block;
  overflow:hidden;
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
  font-size:11.5px;
  font-weight:600;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-cell code{
  display:block;
  width:100%;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:10.5px;
  font-weight:500;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-policy-cell span,.jn-api-time-cell time){
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  font-size:11px;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-quota-cell small{
  display:block;
  margin-top:3px;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:10px;
  line-height:1.2;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:22px;
  padding:0 7px;
  border:1px solid rgba(132,190,165,.28);
  border-radius:5px;
  background:var(--api-accent-soft);
  color:#9fd0b9;
  -webkit-text-fill-color:#9fd0b9;
  font-size:10px;
  font-weight:600;
  line-height:1;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{
  border-color:var(--api-line-soft);
  background:var(--api-surface-soft);
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-actions-cell{overflow:visible}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{
  display:flex;
  width:170px;
  grid-template-columns:none;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiCleanActionA):not(#jnApiCleanActionB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action{
  width:30px;
  height:30px;
  min-width:30px;
  min-height:30px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid transparent;
  border-radius:5px;
  background:transparent;
  background-image:none;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiCleanActionA):not(#jnApiCleanActionB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action:is(:hover,:focus-visible){
  border-color:var(--api-line);
  background:var(--api-surface-soft);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiCleanActionA):not(#jnApiCleanActionB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action.is-copied{
  border-color:rgba(102,207,189,.3);
  background:var(--api-accent-soft);
  color:var(--api-accent);
  -webkit-text-fill-color:var(--api-accent);
}
html body:not(.page-admin):not(#jnApiCleanUi):not(#jnApiCleanActionA):not(#jnApiCleanActionB) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action.is-danger:hover{
  border-color:rgba(223,141,141,.3);
  background:var(--api-danger-soft);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] [data-api-token-empty]{
  min-height:150px;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
@media(max-width:760px){
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"]{padding:6px;place-items:center}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{width:calc(100vw - 12px);max-height:calc(100dvh - 12px);border-radius:7px}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{min-height:48px;padding:0 9px 0 13px}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{padding:7px 8px 9px}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{min-height:39px;padding-bottom:6px}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid,
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{grid-template-columns:1fr}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{border:0;overflow:visible}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead{display:none}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody{display:grid;gap:7px}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr{
    display:grid;
    padding:8px 10px;
    border:1px solid var(--api-line-soft);
    border-radius:6px;
    background:var(--api-surface-raised);
  }
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
    width:100%;
    height:auto;
    min-height:32px;
    padding:6px 0;
    display:grid;
    grid-template-columns:68px minmax(0,1fr);
    align-items:center;
    border:0;
    border-bottom:1px solid var(--api-line-soft);
    background:transparent;
  }
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td::before{
    content:attr(data-label);
    color:var(--api-muted);
    -webkit-text-fill-color:var(--api-muted);
    font-size:10.5px;
  }
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table .jn-api-actions-cell{padding-bottom:0;border-bottom:0}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{width:170px;grid-template-columns:none;justify-content:flex-start}
}
@media(max-width:390px){
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-copy strong{font-size:12px}
  html body:not(.page-admin):not(#jnApiCleanUi) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-create-trigger{height:30px;min-height:30px;padding:0 9px;font-size:11px}
}

/* API key manager polish and mobile cards 2026-07-07 */
.jn-resource-modal-api.jn-api-manager-modal{
  width: min(1080px, calc(100vw - 28px));
  max-height: min(820px, calc(100vh - 28px));
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(15, 23, 42, .96), rgba(2, 6, 23, .94));
  border: 1px solid rgba(148, 163, 184, .20);
  box-shadow: 0 28px 90px rgba(0, 0, 0, .46);
}
.jn-api-manager-head{
  position: sticky;
  top: 0;
  z-index: 3;
  margin: -4px -4px 14px;
  padding: 4px 4px 12px;
  background: inherit;
}
.jn-api-manager-head h2{ font-size: 20px; letter-spacing: 0; }
.jn-api-manager-head p{ max-width: 620px; line-height: 1.6; }
.jn-resource-modal-api .jn-resource-close{
  position: relative;
  z-index: 5;
  width: 38px;
  height: 38px;
  min-width: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  font-size: 22px;
  line-height: 1;
}
.jn-api-manager{ gap: 14px; }
.jn-api-toolbar,
.jn-api-editor,
.jn-api-table-wrap{
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, .18);
  background: rgba(15, 23, 42, .58);
  box-shadow: none;
}
.jn-api-toolbar{ padding: 14px; }
.jn-api-toolbar strong,
.jn-api-form-head strong{
  color: #f8fafc;
  font-size: 15px;
  letter-spacing: 0;
}
.jn-api-toolbar span,
.jn-api-form-head span{
  color: #94a3b8;
  line-height: 1.55;
}
.jn-api-create-trigger,
.jn-api-primary{
  border-radius: 10px;
  background: #2563eb;
  color: #fff;
  border: 1px solid #2563eb;
  box-shadow: 0 10px 24px rgba(37, 99, 235, .24);
}
.jn-api-create-trigger:hover,
.jn-api-primary:hover{
  background: #1d4ed8;
  border-color: #1d4ed8;
}
.jn-api-editor{ padding: 16px; }
.jn-api-editor label{
  color: #cbd5e1;
  font-size: 12px;
  font-weight: 800;
}
.jn-api-editor input:not([type="checkbox"]),
.jn-api-editor select{
  height: 40px;
  border-radius: 10px;
  background: rgba(2, 6, 23, .54);
  border-color: rgba(148, 163, 184, .22);
  color: #f8fafc;
}
.jn-api-perms label{
  min-height: 38px;
  border-radius: 10px;
  background: rgba(2, 6, 23, .34);
}
.jn-api-form-actions .jn-profile-secondary{
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 10px;
  background: rgba(15, 23, 42, .72);
  color: #dbeafe;
}
.jn-api-table-wrap{ overflow: auto; }
.jn-api-table{ min-width: 920px; }
.jn-api-table th{
  height: 42px;
  background: rgba(2, 6, 23, .38);
  color: #94a3b8;
  font-size: 12px;
}
.jn-api-table td{
  background: transparent;
  color: #e5e7eb;
}
.jn-api-table tr:hover td{ background: rgba(37, 99, 235, .08); }
.jn-api-table code,
.jn-api-key-panel code,
.jn-api-created code{
  border-radius: 10px;
  background: rgba(2, 6, 23, .60);
  border: 1px solid rgba(148, 163, 184, .18);
  color: #dbeafe;
}
.jn-api-table .jn-api-row-actions{ gap: 6px; }
.jn-api-table .jn-api-row-actions button{
  height: 30px;
  border-radius: 9px;
  background: rgba(15, 23, 42, .70);
  color: #dbeafe;
}
.jn-api-table .jn-api-row-actions button:hover{
  border-color: rgba(96, 165, 250, .48);
  color: #fff;
}
.jn-api-table .jn-api-row-actions button[data-api-token-delete]{ color: #fecaca; }
.jn-token-badge{
  border: 1px solid rgba(34, 197, 94, .26);
  background: rgba(34, 197, 94, .12);
  color: #86efac;
}
.jn-token-badge.off{
  border-color: rgba(248, 113, 113, .26);
  background: rgba(248, 113, 113, .12);
  color: #fecaca;
}
.jn-api-key-dialog{
  z-index: 100080;
  background: rgba(2, 6, 23, .66);
  backdrop-filter: blur(10px);
}
.jn-api-key-panel{
  width: min(560px, calc(100vw - 28px));
  border-radius: 16px;
  background: #0f172a;
  border-color: rgba(148, 163, 184, .22);
}
.jn-api-key-panel > .jn-resource-close{
  position: absolute;
  top: 14px;
  right: 14px;
}
.jn-api-key-panel > strong{ padding-right: 48px; }
html.jn-light-mode .jn-resource-modal-api.jn-api-manager-modal,
body.jn-light-mode .jn-resource-modal-api.jn-api-manager-modal{
  background: #fff;
  color: #0f172a;
  border-color: rgba(15, 23, 42, .12);
  box-shadow: 0 28px 80px rgba(15, 23, 42, .16);
}
html.jn-light-mode .jn-api-toolbar,
html.jn-light-mode .jn-api-editor,
html.jn-light-mode .jn-api-table-wrap,
body.jn-light-mode .jn-api-toolbar,
body.jn-light-mode .jn-api-editor,
body.jn-light-mode .jn-api-table-wrap{
  background: #f8fafc;
  border-color: rgba(15, 23, 42, .10);
}
html.jn-light-mode .jn-api-toolbar strong,
html.jn-light-mode .jn-api-form-head strong,
html.jn-light-mode .jn-api-table td strong,
html.jn-light-mode .jn-api-editor label,
body.jn-light-mode .jn-api-toolbar strong,
body.jn-light-mode .jn-api-form-head strong,
body.jn-light-mode .jn-api-table td strong,
body.jn-light-mode .jn-api-editor label{
  color: #0f172a;
}
html.jn-light-mode .jn-api-toolbar span,
html.jn-light-mode .jn-api-form-head span,
html.jn-light-mode .jn-api-table td small,
html.jn-light-mode .jn-api-table td time,
body.jn-light-mode .jn-api-toolbar span,
body.jn-light-mode .jn-api-form-head span,
body.jn-light-mode .jn-api-table td small,
body.jn-light-mode .jn-api-table td time{
  color: #64748b;
}
html.jn-light-mode .jn-api-editor input:not([type="checkbox"]),
html.jn-light-mode .jn-api-editor select,
html.jn-light-mode .jn-api-table code,
html.jn-light-mode .jn-api-key-panel code,
html.jn-light-mode .jn-api-created code,
body.jn-light-mode .jn-api-editor input:not([type="checkbox"]),
body.jn-light-mode .jn-api-editor select,
body.jn-light-mode .jn-api-table code,
body.jn-light-mode .jn-api-key-panel code,
body.jn-light-mode .jn-api-created code{
  background: #fff;
  color: #0f172a;
  border-color: rgba(15, 23, 42, .14);
}
html.jn-light-mode .jn-api-table th,
body.jn-light-mode .jn-api-table th{
  background: #eef2f7;
  color: #475569;
}
html.jn-light-mode .jn-api-table td,
body.jn-light-mode .jn-api-table td{
  color: #0f172a;
  border-color: rgba(15, 23, 42, .08);
}
html.jn-light-mode .jn-api-table tr:hover td,
body.jn-light-mode .jn-api-table tr:hover td{
  background: rgba(37, 99, 235, .05);
}
html.jn-light-mode .jn-api-row-actions button,
body.jn-light-mode .jn-api-row-actions button,
html.jn-light-mode .jn-api-form-actions .jn-profile-secondary,
body.jn-light-mode .jn-api-form-actions .jn-profile-secondary{
  background: #fff;
  color: #0f172a;
  border-color: rgba(15, 23, 42, .14);
}
html.jn-light-mode .jn-api-key-panel,
body.jn-light-mode .jn-api-key-panel{
  background: #fff;
  color: #0f172a;
  border-color: rgba(15, 23, 42, .12);
}
@media (max-width: 760px) {
.jn-resource-modal-api.jn-api-manager-modal{
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    padding: 14px;
    border-radius: 16px;
  }
  .jn-api-manager-head{
    align-items: flex-start;
    gap: 10px;
    padding-bottom: 10px;
  }
  .jn-api-manager-head h2{ font-size: 18px; }
  .jn-api-manager-head p{ margin-right: 0; }
  .jn-resource-modal-api .jn-resource-close{
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
  .jn-api-toolbar{
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }
  .jn-api-create-trigger{ width: 100%; }
  .jn-api-editor{ padding: 12px; }
  .jn-api-form-grid,
.jn-api-perms,
.jn-api-form-actions{
    grid-template-columns: 1fr;
  }
  .jn-api-form-actions .jn-profile-secondary,
.jn-api-form-actions .jn-api-primary{
    width: 100%;
  }
  .jn-api-table-wrap{
    padding: 0;
    border: 0;
    background: transparent;
    overflow: visible;
  }
  .jn-api-table,
.jn-api-table thead,
.jn-api-table tbody,
.jn-api-table tr,
.jn-api-table th,
.jn-api-table td{
    display: block;
    width: 100%;
    min-width: 0;
  }
  .jn-api-table thead{ display: none; }
  .jn-api-table tr{
    margin-bottom: 10px;
    padding: 10px;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 14px;
    background: rgba(15, 23, 42, .56);
  }
  .jn-api-table td{
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 8px 0;
    border-bottom: 1px solid rgba(148, 163, 184, .12);
  }
  .jn-api-table td:last-child{ border-bottom: 0; }
  .jn-api-table td::before{
    color: #94a3b8;
    font-size: 12px;
    font-weight: 900;
  }
  .jn-api-table td:nth-child(1)::before{ content: "Name"; }
  .jn-api-table td:nth-child(2)::before{ content: "API KEY"; }
  .jn-api-table td:nth-child(3)::before{ content: "Policy"; }
  .jn-api-table td:nth-child(4)::before{ content: "Quota"; }
  .jn-api-table td:nth-child(5)::before{ content: "Used"; }
  .jn-api-table td:nth-child(6)::before{ content: "Status"; }
  .jn-api-table td:nth-child(7)::before{ content: "Created"; }
  .jn-api-table td:nth-child(8)::before{ content: "Action"; }
  .jn-api-table code,
.jn-api-table td strong{
    max-width: 100%;
  }
  .jn-api-table .jn-api-row-actions{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    min-width: 0;
  }
  .jn-api-table .jn-api-row-actions button{
    width: 100%;
    height: 34px;
  }
  .jn-api-key-dialog{
    align-items: end;
    padding: 8px;
  }
  .jn-api-key-panel{
    width: calc(100vw - 16px);
    padding: 18px 14px 14px;
    border-radius: 16px;
  }
  html.jn-light-mode .jn-api-table tr,
body.jn-light-mode .jn-api-table tr{
    background: #f8fafc;
    border-color: rgba(15, 23, 42, .10);
  }
  html.jn-light-mode .jn-api-table td::before,
body.jn-light-mode .jn-api-table td::before{
    color: #64748b;
  }
}

/* Front API key manager final override 2026-07-08 */
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  width: min(1120px, calc(100vw - 32px));
  max-height: min(840px, calc(100dvh - 32px));
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  margin: 0;
  padding: 24px 24px 16px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  min-height: 0;
  padding: 16px 24px 24px;
  display: grid;
  gap: 14px;
  overflow: auto;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border-radius: 10px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-copy{
  min-width: 0;
  display: grid;
  gap: 4px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-count-chip{
  height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{
  padding: 16px;
  border-radius: 10px;
  display: grid;
  gap: 14px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor[hidden]{
  display: none;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{
  display: grid;
  grid-template-columns: minmax(180px, 1.25fr) repeat(4, minmax(128px, 1fr));
  gap: 12px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{
  min-width: 0;
  display: grid;
  gap: 7px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor input:not([type="checkbox"]),
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor select{
  width: 100%;
  height: 42px;
  min-width: 0;
  border-radius: 8px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 8px;
  padding: 0 12px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm span{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{
  appearance: none;
  -webkit-appearance: none;
  width: 34px;
  height: 20px;
  min-width: 34px;
  margin: 0 0 0 auto;
  border-radius: 999px;
  position: relative;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  left: 2px;
  top: 2px;
  border-radius: 999px;
  background: #94a3b8;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked::before{
  left: 16px;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  padding: 8px 12px 12px;
  border-radius: 10px;
  overflow: auto;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{
  width: 100%;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0 8px;
  table-layout: fixed;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(1){ width: 17%; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(2){ width: 15%; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(3){ width: 14%; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(4),
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(5){ width: 7%; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(6){ width: 60px; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(7){ width: 12%; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(8){ width: 220px; }
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
  padding: 12px 10px;
  vertical-align: middle;
  font-size: 12px;
  line-height: 1.45;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell{
  text-align: center;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  height: 28px;
  min-width: 56px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  line-height: 28px;
  white-space: nowrap;
  word-break: keep-all;
  writing-mode: horizontal-tb;
  justify-self: start;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{
  display: grid;
  grid-template-columns: repeat(5, minmax(38px, 1fr));
  gap: 6px;
  min-width: 0;
}
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action{
  height: 32px;
  min-width: 0;
  padding: 0 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}
@media (max-width: 760px) {
.jn-resource-layer[data-resource-dialog="api-tokens"]{
    padding: 8px;
    place-items: end center;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
    width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 12px 12px 0 0;
    display: block;
    overflow: auto;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
    padding: 16px 14px 12px;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
    padding: 12px 12px 16px;
    overflow: visible;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
    align-items: stretch;
    flex-direction: column;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{
    grid-template-columns: 1fr;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
    padding: 0;
    background: transparent;
    border: 0;
    overflow: visible;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
    display: block;
    width: 100%;
    min-width: 0;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead{
    display: none;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody{
    display: grid;
    gap: 10px;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr{
    border-radius: 10px;
    padding: 10px;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: 10px;
    padding: 8px 0;
    border-radius: 0;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td::before{
    content: attr(data-label);
    font-size: 12px;
    font-weight: 900;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-name-cell,
.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-actions-cell{
    grid-template-columns: 1fr;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell{
    text-align: left;
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action{
    height: 36px;
    width: 100%;
  }
}

/* API key manager: centered key viewer, compact editor and local confirmations. */
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  position:relative;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{
  padding:10px 11px 11px;
  gap:8px;
  border-color:var(--api-line-soft);
  background:color-mix(in srgb,var(--api-surface-raised) 88%,transparent);
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head{
  min-height:22px;
  padding:0 1px;
  align-items:center;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head strong{
  font-size:12.5px;
  font-weight:650;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{
  grid-template-columns:minmax(180px,1.4fr) repeat(4,minmax(100px,1fr));
  gap:6px;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{
  gap:4px;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:10.5px;
  font-weight:550;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){
  height:33px;
  min-height:33px;
  padding:0 9px;
  border-color:var(--api-line-soft);
  border-radius:5px;
  background:var(--api-field);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  font-size:11.5px;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select):hover{
  border-color:var(--api-line);
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{
  min-height:32px;
  padding:0 8px;
  gap:7px;
  border-color:var(--api-line-soft);
  background:color-mix(in srgb,var(--api-field) 80%,transparent);
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm span{
  overflow:hidden;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  font-size:10.5px;
  font-weight:550;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked) span{
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions{
  margin-top:1px;
  gap:6px;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions :is(.front-profile-secondary,.jn-api-primary){
  height:31px;
  min-height:31px;
  padding:0 12px;
  font-size:11.5px;
  font-weight:600;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary{
  border:1px solid var(--api-line);
  background:transparent;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  box-shadow:none;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{
  position:absolute;
  inset:0;
  z-index:100090;
  display:grid;
  place-items:center;
  align-items:center;
  justify-items:center;
  padding:18px;
  overflow:auto;
  background:rgba(31,30,27,.48);
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog[hidden]{
  display:none;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{
  position:relative;
  width:min(440px,100%);
  margin:auto;
  padding:18px;
  display:grid;
  gap:12px;
  border:1px solid var(--api-line);
  border-radius:7px;
  background:var(--api-surface-raised);
  background-image:none;
  color:var(--api-text);
  box-shadow:0 18px 44px rgba(18,17,15,.34);
  transform:none;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>.front-resource-close{
  position:absolute;
  top:10px;
  right:10px;
  width:28px;
  height:28px;
  min-width:28px;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>strong{
  padding-right:34px;
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
  font-size:14px;
  font-weight:650;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>p{
  display:none;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>code{
  width:100%;
  min-height:76px;
  max-height:150px;
  margin:0;
  padding:12px;
  overflow:auto;
  border:1px solid var(--api-line-soft);
  border-radius:5px;
  background:var(--api-field);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  font-size:11.5px;
  line-height:1.55;
  overflow-wrap:anywhere;
  white-space:pre-wrap;
}
html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>[data-api-token-copy-revealed]{
  width:100%;
  height:34px;
  min-height:34px;
  margin:0;
  border-radius:5px;
  font-size:11.5px;
  font-weight:650;
}
html body:not(.page-admin) .front-creative-confirm-layer.front-creative-video-confirm-layer.jn-api-confirm-layer{
  position:fixed;
  inset:0;
  z-index:2147483646;
  display:grid;
  place-items:center;
  padding:16px;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  transition:none;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel{
  position:relative;
  width:min(390px,calc(100vw - 32px));
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.11);
  border-radius:7px;
  background:#302f2c;
  background-image:none;
  color:#f1efeb;
  -webkit-text-fill-color:#f1efeb;
  box-shadow:0 18px 48px rgba(18,17,15,.34);
  transition:none;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head{
  position:absolute;
  top:8px;
  right:8px;
  z-index:2;
  width:30px;
  height:30px;
  padding:0;
  border:0;
  background:transparent;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head span{
  display:none;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button{
  width:30px;
  height:30px;
  min-width:30px;
  padding:0;
  border:0;
  border-radius:5px;
  background:transparent;
  color:#aaa7a0;
  -webkit-text-fill-color:#aaa7a0;
  box-shadow:none;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button:hover{
  background:#3a3935;
  color:#fbfaf7;
  -webkit-text-fill-color:#fbfaf7;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body{
  padding:20px 46px 8px 18px;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3{
  margin:0 0 8px;
  color:#fbfaf7;
  -webkit-text-fill-color:#fbfaf7;
  font-size:15px;
  font-weight:650;
  line-height:1.35;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p{
  margin:0;
  color:#aaa7a0;
  -webkit-text-fill-color:#aaa7a0;
  font-size:12px;
  line-height:1.55;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions{
  margin:0;
  padding:14px 18px 18px;
  display:flex;
  justify-content:flex-end;
  gap:7px;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button{
  min-width:76px;
  height:32px;
  padding:0 12px;
  border-radius:5px;
  font-size:11.5px;
  font-weight:650;
  box-shadow:none;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel]{
  border:1px solid rgba(255,255,255,.11);
  background:transparent;
  color:#c6c3bd;
  -webkit-text-fill-color:#c6c3bd;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer.is-enable .front-creative-confirm-actions button[data-confirm-ok]{
  border:1px solid #66cfbd;
  background:#66cfbd;
  color:#173b35;
  -webkit-text-fill-color:#173b35;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer.is-disable .front-creative-confirm-actions button[data-confirm-ok]{
  border:1px solid #c97575;
  background:#c97575;
  color:#2e1717;
  -webkit-text-fill-color:#2e1717;
}
body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer.is-delete .front-creative-confirm-actions button[data-confirm-ok]{
  border:1px solid #c76565;
  background:#c76565;
  color:#2c1515;
  -webkit-text-fill-color:#2c1515;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel{
  border-color:rgba(45,42,36,.16);
  background:#f5f3ef;
  color:#3d3a34;
  -webkit-text-fill-color:#3d3a34;
  box-shadow:0 18px 48px rgba(45,42,36,.18);
  color-scheme:light;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3{
  color:#24221e;
  -webkit-text-fill-color:#24221e;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p{
  color:#77736b;
  -webkit-text-fill-color:#77736b;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button,
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button,
body.jn-light-mode:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button,
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button{
  background:transparent;
  color:#77736b;
  -webkit-text-fill-color:#77736b;
}
html.jn-light-mode body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel],
html[data-theme="light"] body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel],
body.jn-light-mode:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel],
body[data-theme="light"]:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel]{
  border-color:rgba(45,42,36,.16);
  background:#fbfaf7;
  color:#555149;
  -webkit-text-fill-color:#555149;
}
@media(max-width:760px){
  html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{
    grid-template-columns:1fr;
  }
  html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{
    place-items:center;
    align-items:center;
    justify-items:center;
    padding:12px;
  }
  html body:not(.page-admin):not(#jnApiDialogFinish) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{
    width:min(440px,100%);
    padding:16px;
    border-radius:7px;
  }
}

/* API dialogs keep the same neutral charcoal treatment in either site theme. */
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-surface:#252525;
  --api-surface-raised:#2d2d2d;
  --api-surface-soft:#343434;
  --api-table:#1f1f1f;
  --api-field:#232323;
  --api-row-hover:#303030;
  --api-line:rgba(255,255,255,.10);
  --api-line-soft:rgba(255,255,255,.055);
  --api-text:#ededed;
  --api-text-strong:#f5f5f5;
  --api-muted:#b4b4b4;
  --api-accent:#dedede;
  --api-accent-hover:#f0f0f0;
  --api-accent-ink:#282828;
  --api-accent-soft:rgba(255,255,255,.075);
  --api-danger:#c98989;
  --api-danger-soft:rgba(143,93,93,.17);
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color-scheme:dark;
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  border-color:var(--api-line);
  background:var(--api-surface);
  background-image:none;
  color:var(--api-text);
  box-shadow:0 24px 64px rgba(10,10,10,.42),inset 0 1px 0 rgba(255,255,255,.025);
  color-scheme:dark;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  border-color:var(--api-line-soft);
  background:#222222;
  background-image:none;
  color:var(--api-text);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  background:var(--api-surface);
  background-image:none;
  color:var(--api-text);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head h2,.jn-api-toolbar-copy strong,.jn-api-form-head strong,.jn-api-name-cell strong,.jn-api-number-cell>span){
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head p,.jn-api-toolbar-copy span,.jn-api-form-head span,.jn-api-name-cell small,.jn-api-time-cell small){
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close{
  border-color:transparent;
  background:transparent;
  background-image:none;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close:is(:hover,:focus-visible){
  border-color:transparent;
  background:var(--api-surface-soft);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
  border-color:var(--api-line-soft);
  background:transparent;
  background-image:none;
  color:var(--api-text);
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-editor,.jn-api-perm){
  border-color:var(--api-line);
  background:var(--api-surface-raised);
  background-image:none;
  color:var(--api-text);
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-field,.jn-api-perm span){
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){
  border-color:var(--api-line);
  background:var(--api-field);
  background-image:none;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  box-shadow:none;
  color-scheme:dark;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select):focus{
  border-color:rgba(255,255,255,.22);
  box-shadow:0 0 0 2px rgba(255,255,255,.055);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{
  border-color:rgba(255,255,255,.16);
  background:#3b3b3b;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{
  background:#d9d9d9;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked{
  border-color:#d8d8d8;
  background:#d8d8d8;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked::before{
  background:#292929;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){
  border-color:rgba(255,255,255,.14);
  background:#303030;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary,
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-create-trigger{
  border-color:var(--api-accent);
  background:var(--api-accent);
  background-image:none;
  color:var(--api-accent-ink);
  -webkit-text-fill-color:var(--api-accent-ink);
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger):is(:hover,:focus-visible){
  border-color:var(--api-accent-hover);
  background:var(--api-accent-hover);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .front-profile-secondary{
  border-color:var(--api-line);
  background:transparent;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
  box-shadow:none;
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  border-color:var(--api-line-soft);
  background:var(--api-table);
  background-image:none;
  color:var(--api-text);
  box-shadow:none;
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{
  color:var(--api-text);
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{
  border-color:var(--api-line-soft);
  background:#272727;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row{
  background:var(--api-surface);
  color:var(--api-text);
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row td{
  border-color:var(--api-line-soft);
  background:var(--api-surface);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row:hover td{
  background:var(--api-row-hover);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-cell code{
  border:0;
  background:transparent;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  border-color:rgba(255,255,255,.10);
  background:#303030;
  color:#d0d0d0;
  -webkit-text-fill-color:#d0d0d0;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{
  border-color:var(--api-line-soft);
  background:#272727;
  color:#8f8f8f;
  -webkit-text-fill-color:#8f8f8f;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action{
  border-color:transparent;
  background:transparent;
  background-image:none;
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
  box-shadow:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action:is(:hover,:focus-visible){
  border-color:var(--api-line);
  background:var(--api-surface-soft);
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action.is-danger:is(:hover,:focus-visible){
  border-color:rgba(196,123,123,.24);
  background:var(--api-danger-soft);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] [data-api-token-empty]{
  border-color:var(--api-line-soft);
  background:var(--api-table);
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{
  z-index:100090;
  background:rgba(0,0,0,.38);
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{
  border-color:var(--api-line);
  background:#292929;
  background-image:none;
  color:var(--api-text);
  box-shadow:0 22px 58px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.035);
  color-scheme:dark;
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>strong{
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>p{
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>code{
  border-color:var(--api-line);
  background:#202020;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel{
  border-color:rgba(255,255,255,.075);
  background:#292929;
  background-image:none;
  color:#ededed;
  -webkit-text-fill-color:#ededed;
  box-shadow:0 20px 52px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.035);
  color-scheme:dark;
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer{
  z-index:2147483646;
  background:rgba(0,0,0,.34);
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3{
  color:#f5f5f5;
  -webkit-text-fill-color:#f5f5f5;
}
html body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p{
  color:#a9a9a9;
  -webkit-text-fill-color:#a9a9a9;
}
html body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button{
  background:transparent;
  color:#a9a9a9;
  -webkit-text-fill-color:#a9a9a9;
}
html body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel]{
  border-color:rgba(255,255,255,.10);
  background:transparent;
  color:#d1d1d1;
  -webkit-text-fill-color:#d1d1d1;
}
html body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer.is-enable .front-creative-confirm-actions button[data-confirm-ok]{
  border-color:#dedede;
  background:#dedede;
  color:#282828;
  -webkit-text-fill-color:#282828;
}
html body:not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer:is(.is-disable,.is-delete) .front-creative-confirm-actions button[data-confirm-ok]{
  border-color:#8f5d5d;
  background:#8f5d5d;
  color:#f8eded;
  -webkit-text-fill-color:#f8eded;
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer{
  z-index:2147483647;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(#jnApiNeutralA):not(#jnApiNeutralB):not(#jnApiNeutralC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert{
  grid-template-columns:26px minmax(0,1fr) auto;
  border-color:rgba(255,255,255,.075);
  background:#292929;
  background-image:none;
  color:#ededed;
  box-shadow:0 20px 52px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.035);
  color-scheme:dark;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert h3{
  color:#f5f5f5;
  -webkit-text-fill-color:#f5f5f5;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert p{
  color:#a9a9a9;
  -webkit-text-fill-color:#a9a9a9;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert>button{
  border-color:#dedede;
  background:#dedede;
  color:#282828;
  -webkit-text-fill-color:#282828;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert:not(.enterprise-alert-error) .enterprise-alert-icon{
  position:relative;
  width:24px;
  height:24px;
  border:0;
  border-radius:0;
  background:transparent;
  color:transparent;
  -webkit-text-fill-color:transparent;
  font-size:0;
  box-shadow:none;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert:not(.enterprise-alert-error) .enterprise-alert-icon::before{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  display:block;
  width:20px;
  height:15px;
  margin:0;
  border:0;
  background:#e3e3e3;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 15'%3E%3Cpath d='M1.8 7.8 6.6 12.2 18.2 1.9' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 15'%3E%3Cpath d='M1.8 7.8 6.6 12.2 18.2 1.9' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transform:translate(-50%,-50%);
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert:not(.enterprise-alert-error) .enterprise-alert-icon::after{
  content:none;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert-error .enterprise-alert-icon{
  width:22px;
  height:22px;
  border:0;
  border-radius:0;
  background:transparent;
  color:transparent;
  -webkit-text-fill-color:transparent;
  font-size:0;
  box-shadow:none;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert-error .enterprise-alert-icon::before{
  content:"";
  position:absolute;
  top:2px;
  left:10px;
  width:2px;
  height:12px;
  margin:0;
  border:0;
  border-radius:2px;
  background:#c47b7b;
  transform:none;
}
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert-error .enterprise-alert-icon::after{
  content:"";
  position:absolute;
  top:17px;
  left:9.5px;
  width:3px;
  height:3px;
  border:0;
  border-radius:50%;
  background:#c47b7b;
}

/* API key dialogs: final neutral charcoal hierarchy in both site themes. */
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-surface:#202020;
  --api-surface-raised:#282828;
  --api-surface-soft:#2e2e2e;
  --api-table:#181818;
  --api-field:#1c1c1c;
  --api-row-hover:#2d2d2d;
  --api-line:rgba(255,255,255,.09);
  --api-line-soft:rgba(255,255,255,.06);
  --api-text:#ececec;
  --api-text-strong:#f6f6f6;
  --api-muted:#a9a9a9;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  border-color:rgba(255,255,255,.085);
  background:#202020;
  background-image:none;
  color:#ececec;
  box-shadow:0 24px 64px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.025);
  color-scheme:dark;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  border-color:rgba(255,255,255,.055);
  background:#252525;
  background-image:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  background:#202020;
  background-image:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  border-color:rgba(255,255,255,.055);
  background:#181818;
  background-image:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{
  border-color:rgba(255,255,255,.055);
  background:#252525;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row,
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row td{
  border-color:rgba(255,255,255,.055);
  background:#222222;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row:hover td{
  background:#2d2d2d;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{
  z-index:100090;
  background:rgba(0,0,0,.36);
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{
  border-color:rgba(255,255,255,.085);
  background:#282828;
  background-image:none;
  color:#ececec;
  box-shadow:0 22px 56px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.03);
  color-scheme:dark;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel>code{
  border-color:rgba(255,255,255,.085);
  background:#181818;
  color:#ececec;
  -webkit-text-fill-color:#ececec;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer{
  z-index:2147483646;
  background:rgba(0,0,0,.34);
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-panel{
  border-color:rgba(255,255,255,.085);
  background:#282828;
  background-image:none;
  color:#ececec;
  -webkit-text-fill-color:#ececec;
  box-shadow:0 22px 56px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.03);
  color-scheme:dark;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button{
  border:0;
  background:transparent;
  color:#a9a9a9;
  -webkit-text-fill-color:#a9a9a9;
  box-shadow:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-head button:hover{
  background:#323232;
  color:#f4f4f4;
  -webkit-text-fill-color:#f4f4f4;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body h3{
  color:#f6f6f6;
  -webkit-text-fill-color:#f6f6f6;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-body p{
  color:#a9a9a9;
  -webkit-text-fill-color:#a9a9a9;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer .front-creative-confirm-actions button[data-confirm-cancel]{
  border-color:rgba(255,255,255,.11);
  background:#202020;
  color:#d2d2d2;
  -webkit-text-fill-color:#d2d2d2;
  box-shadow:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .front-creative-confirm-layer.jn-api-confirm-layer:is(.is-disable,.is-delete) .front-creative-confirm-actions button[data-confirm-ok]{
  border-color:#684545;
  background:#3a2929;
  color:#e7baba;
  -webkit-text-fill-color:#e7baba;
  box-shadow:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer{
  z-index:2147483647;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert{
  border-color:rgba(255,255,255,.085);
  background:#282828;
  background-image:none;
  color:#ececec;
  box-shadow:0 22px 56px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.03);
  color-scheme:dark;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert:not(.enterprise-alert-error) .enterprise-alert-icon{
  width:22px;
  height:20px;
  border:0;
  border-radius:0;
  background:transparent;
  color:transparent;
  -webkit-text-fill-color:transparent;
  box-shadow:none;
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert:not(.enterprise-alert-error) .enterprise-alert-icon::before{
  width:20px;
  height:14px;
  background:#e8e8e8;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 14'%3E%3Cpath d='M1.7 7.4 6.4 11.5 18.4 1.8' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 14'%3E%3Cpath d='M1.7 7.4 6.4 11.5 18.4 1.8' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transform:translate(-50%,-50%);
}
html body:not(#jnApiCharcoalA):not(#jnApiCharcoalB):not(#jnApiCharcoalC):not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer .enterprise-alert.enterprise-alert:not(.enterprise-alert-error) .enterprise-alert-icon::after{
  display:none;
}

/* API key manager palette: scoped color refresh only. */
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-surface:#1f2228;
  --api-surface-raised:#2a2a2d;
  --api-toolbar:transparent;
  --api-table:transparent;
  --api-table-head:rgba(255,255,255,.035);
  --api-row:rgba(255,255,255,.018);
  --api-field:#18191c;
  --api-row-hover:rgba(255,199,70,.045);
  --api-line:rgba(255,255,255,.10);
  --api-line-soft:rgba(255,255,255,.07);
  --api-text:#f4f4f5;
  --api-text-strong:#fafafa;
  --api-muted:#a1a1aa;
  --api-accent:#ffc746;
  --api-accent-hover:#ffd866;
  --api-accent-ink:#16110a;
  --api-accent-soft:rgba(255,199,70,.09);
  --api-accent-line:rgba(255,218,102,.35);
  --api-switch:#34363b;
  --api-switch-knob:#f1f5f9;
  --api-switch-knob-checked:#fff;
  --api-success:#a1a1aa;
  --api-success-soft:rgba(255,255,255,.05);
  --api-success-line:rgba(255,255,255,.10);
  --api-danger:#ef8790;
  --api-danger-soft:rgba(239,135,144,.13);
  --api-danger-line:rgba(239,135,144,.24);
  --api-action:rgba(255,255,255,.035);
  --api-action-text:#d4d4d8;
  --api-modal-shadow:0 24px 64px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.025);
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"],
html body.jn-light-mode:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{
  --api-surface:#fff;
  --api-surface-raised:#f8fafc;
  --api-toolbar:#f8fafc;
  --api-table:#f8fafc;
  --api-table-head:#f1f5f9;
  --api-row:#fff;
  --api-field:#fff;
  --api-row-hover:#f8fafc;
  --api-line:rgba(15,23,42,.12);
  --api-line-soft:rgba(15,23,42,.08);
  --api-text:#334155;
  --api-text-strong:#0f172a;
  --api-muted:#64748b;
  --api-accent:#3b82f6;
  --api-accent-hover:#2563eb;
  --api-accent-ink:#fff;
  --api-accent-soft:#eff6ff;
  --api-accent-line:#bfdbfe;
  --api-switch:#cbd5e1;
  --api-switch-knob:#fff;
  --api-switch-knob-checked:#fff;
  --api-success:#15803d;
  --api-success-soft:#f0fdf4;
  --api-success-line:#bbf7d0;
  --api-danger:#dc2626;
  --api-danger-soft:#fef2f2;
  --api-danger-line:#fecaca;
  --api-action:#fff;
  --api-action-text:#475569;
  --api-modal-shadow:0 28px 80px rgba(15,23,42,.16);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{
  border-color:var(--api-line);
  background:var(--api-surface);
  background-image:none;
  color:var(--api-text);
  box-shadow:var(--api-modal-shadow);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{
  border-color:var(--api-line-soft);
  background:var(--api-surface);
  background-image:none;
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{
  background:var(--api-surface);
  background-image:none;
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{
  border-color:var(--api-line-soft);
  background:var(--api-toolbar);
  background-image:none;
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-editor,.jn-api-perm){
  border-color:var(--api-line);
  background:var(--api-surface-raised);
  background-image:none;
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head h2,.jn-api-toolbar strong,.jn-api-form-head strong,.jn-api-name-cell strong,.jn-api-number-cell,.jn-api-perm span,.jn-api-time-cell time){
  color:var(--api-text-strong);
  -webkit-text-fill-color:var(--api-text-strong);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head p,.jn-api-toolbar span,.jn-api-form-head span,.jn-api-name-cell small,.jn-api-time-cell small){
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select){
  border-color:var(--api-line);
  background:var(--api-field);
  background-image:none;
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor :is(input:not([type="checkbox"]),select):focus{
  border-color:var(--api-accent);
  box-shadow:0 0 0 2px var(--api-accent-soft);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{
  border-color:var(--api-line);
  background:var(--api-switch);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{
  background:var(--api-switch-knob);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked{
  border-color:var(--api-accent);
  background:var(--api-accent);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked::before{
  background:var(--api-switch-knob-checked);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){
  border-color:var(--api-accent-line);
  background:var(--api-accent-soft);
  color:var(--api-accent);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger){
  border-color:var(--api-accent);
  background:var(--api-accent);
  background-image:none;
  color:var(--api-accent-ink);
  -webkit-text-fill-color:var(--api-accent-ink);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger) :is(span,svg){
  color:var(--api-accent-ink);
  -webkit-text-fill-color:var(--api-accent-ink);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger):is(:hover,:focus-visible){
  border-color:var(--api-accent-hover);
  background:var(--api-accent-hover);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{
  border-color:var(--api-line-soft);
  background:var(--api-table);
  background-image:none;
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{
  border-color:var(--api-line-soft);
  background:var(--api-table-head);
  color:var(--api-muted);
  -webkit-text-fill-color:var(--api-muted);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row,
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row td{
  border-color:var(--api-line-soft);
  background:var(--api-row);
  color:var(--api-text);
  -webkit-text-fill-color:var(--api-text);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody tr.jn-api-token-row:hover td{
  background:var(--api-row-hover);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{
  border-color:var(--api-success-line);
  background:var(--api-success-soft);
  color:var(--api-success);
  -webkit-text-fill-color:var(--api-success);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{
  border-color:var(--api-danger-line);
  background:var(--api-danger-soft);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog=api-tokens] .jn-api-row-actions button.jn-api-action:disabled{
  cursor:not-allowed;
  opacity:.5;
  pointer-events:none;
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action{
  border-color:var(--api-line-soft);
  background:var(--api-action);
  background-image:none;
  color:var(--api-action-text);
  -webkit-text-fill-color:var(--api-action-text);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action:is(:hover,:focus-visible){
  border-color:var(--api-accent-line);
  background:var(--api-accent-soft);
  color:var(--api-accent);
  -webkit-text-fill-color:var(--api-accent);
}
html body:not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions .jn-api-icon-action.is-danger{
  border-color:var(--api-danger-line);
  background:var(--api-danger-soft);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}
html body.page-app:not(.page-admin):not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(#jnApiBadgeA):not(#jnApiBadgeB):not(#jnApiBadgeC) .front-resource-layer.jn-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell .jn-token-badge:not(.off){
  border-color:var(--api-success-line);
  background-color:var(--api-success-soft);
  background-image:none;
  color:var(--api-success);
  -webkit-text-fill-color:var(--api-success);
}
html body:not(.page-admin):not(#jnApiPaletteA):not(#jnApiPaletteB):not(#jnApiPaletteC):not(#jnApiCompactUi):not(#jnApiActionA):not(#jnApiActionB):not(#jnApiActionC):not(#jnApiActionD) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.jn-api-icon-action.is-danger{
  border-color:var(--api-danger-line);
  background:var(--api-danger-soft);
  color:var(--api-danger);
  -webkit-text-fill-color:var(--api-danger);
}

    .front-resource-modal-api.jn-api-manager-modal{border-radius:16px;background:#0b1120;border-color:rgba(148,163,184,.22);box-shadow:0 26px 78px rgba(0,0,0,.34)}.jn-api-manager-head{padding-bottom:12px;border-bottom:1px solid rgba(148,163,184,.16)}.jn-api-toolbar,
.jn-api-editor,
.jn-api-table-wrap{border-radius:14px;background:rgba(15,23,42,.58);border:1px solid rgba(148,163,184,.18);box-shadow:none}.jn-api-form-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.jn-api-form-head>div{display:grid;gap:5px}.jn-api-editor-close{width:36px;height:36px;min-width:36px;border:1px solid rgba(148,163,184,.22);border-radius:10px;background:rgba(15,23,42,.68);color:#e5e7eb;font-size:22px;line-height:1;cursor:pointer}.jn-api-editor input:not([type=checkbox]),
.jn-api-editor select{height:40px;border-radius:10px}.jn-api-primary,
.jn-api-create-trigger{border-radius:10px}.jn-api-table .jn-api-row-actions button{border-radius:8px}.jn-api-key-panel{border-radius:16px}.jn-api-key-panel>.front-resource-close{width:38px;height:38px;min-width:38px}html.jn-light-mode .front-resource-modal-api.jn-api-manager-modal,
body.jn-light-mode .front-resource-modal-api.jn-api-manager-modal{background:#fff;color:#0f172a;border-color:rgba(15,23,42,.12)}html.jn-light-mode .jn-api-toolbar,
html.jn-light-mode .jn-api-editor,
html.jn-light-mode .jn-api-table-wrap,
body.jn-light-mode .jn-api-toolbar,
body.jn-light-mode .jn-api-editor,
body.jn-light-mode .jn-api-table-wrap{background:#f8fafc;border-color:rgba(15,23,42,.10)}html.jn-light-mode .jn-api-editor-close,
body.jn-light-mode .jn-api-editor-close{background:#fff;color:#0f172a;border-color:rgba(15,23,42,.14)}@media(max-width:760px){
.front-resource-modal-api.jn-api-manager-modal{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:14px;border-radius:16px}.jn-api-manager-head h2{font-size:18px}.jn-api-toolbar{gap:10px}.jn-api-editor{padding:13px}.jn-api-editor-close{width:42px;height:42px;min-width:42px}.jn-api-form-actions{gap:8px}.jn-api-key-dialog{align-items:end}.jn-api-key-panel{width:calc(100vw - 16px);padding:18px 14px 14px}
}

    .front-resource-layer[data-resource-dialog="api-tokens"]{padding:20px;place-items:center;background:radial-gradient(circle at 48% 0,rgba(14,165,233,.18),transparent 30%),radial-gradient(circle at 86% 18%,rgba(16,185,129,.12),transparent 28%),rgba(2,6,23,.76)}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{width:min(1120px,calc(100vw - 32px));max-height:min(840px,calc(100dvh - 32px));padding:0;overflow:hidden;border-radius:12px;background:#0b1020;background-image:linear-gradient(180deg,#0e1528 0%,#090e1b 100%);border:1px solid rgba(148,163,184,.22);box-shadow:0 30px 90px rgba(0,0,0,.46);display:grid;grid-template-rows:auto minmax(0,1fr);color:#f8fafc}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{margin:0;padding:24px 24px 16px;border-bottom:1px solid rgba(148,163,184,.16);background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(15,23,42,.74));align-items:center}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{font-size:22px;line-height:1.25;letter-spacing:0}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head p{max-width:660px;margin-top:7px;color:#9aa7bb;font-size:12px;line-height:1.6}
    .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close{width:40px;height:40px;min-width:40px;border-radius:8px;background:#202532;border:1px solid rgba(148,163,184,.24);color:#eef2ff;box-shadow:none}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{min-height:0;padding:16px 24px 24px;display:grid;gap:14px;overflow:auto}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border-radius:10px;background:#101827;border:1px solid rgba(148,163,184,.18)}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-copy{min-width:0;display:grid;gap:4px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar strong,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head strong{color:#fff;font-size:15px;letter-spacing:0}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar span,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head span{color:#9aa7bb;line-height:1.5}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-count-chip{height:36px;display:inline-flex;align-items:center;padding:0 12px;border-radius:8px;background:#0b1220;border:1px solid rgba(148,163,184,.18);color:#cbd5e1;font-size:12px;font-weight:800;white-space:nowrap}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary{height:38px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 15px;border-radius:8px;background:#2563eb;background-image:none;border:1px solid #2563eb;color:#fff;font-size:13px;font-weight:900;box-shadow:0 12px 24px rgba(37,99,235,.24);white-space:nowrap;cursor:pointer}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary:hover{background:#1d4ed8;border-color:#1d4ed8}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{padding:16px;border-radius:10px;background:#101827;border:1px solid rgba(148,163,184,.18);display:grid;gap:14px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor[hidden]{display:none}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor-close{width:38px;height:38px;min-width:38px;border-radius:8px;background:#202532;border:1px solid rgba(148,163,184,.22);color:#e5e7eb;font-size:22px;line-height:1;cursor:pointer}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{display:grid;grid-template-columns:minmax(180px,1.25fr) repeat(4,minmax(128px,1fr));gap:12px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{min-width:0;display:grid;gap:7px;color:#cbd5e1;font-size:12px;font-weight:800}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor input:not([type=checkbox]),
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor select{width:100%;height:42px;min-width:0;border-radius:8px;background:#0b1220;border:1px solid rgba(148,163,184,.22);color:#f8fafc;-webkit-text-fill-color:#f8fafc;padding:0 11px;box-shadow:none}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor input:focus,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor select:focus{outline:none;border-color:#60a5fa;box-shadow:0 0 0 3px rgba(96,165,250,.16)}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{min-height:48px;display:flex;align-items:center;gap:10px;border-radius:8px;background:#0b1220;border:1px solid rgba(148,163,184,.18);padding:0 12px;color:#e5e7eb;font-size:12px;font-weight:850;cursor:pointer}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{appearance:none;-webkit-appearance:none;width:34px;height:20px;min-width:34px;margin:0 0 0 auto;border-radius:999px;border:1px solid rgba(148,163,184,.28);background:#1f2937;position:relative;cursor:pointer}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:before{content:"";position:absolute;width:14px;height:14px;left:2px;top:2px;border-radius:999px;background:#94a3b8;transition:left .16s ease,background .16s ease}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked{background:rgba(37,99,235,.25);border-color:#3b82f6}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked:before{left:16px;background:#60a5fa}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){border-color:rgba(96,165,250,.46);background:rgba(37,99,235,.12);color:#dbeafe}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions{display:flex;justify-content:flex-end;gap:10px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions .front-profile-secondary{height:38px;padding:0 15px;border-radius:8px;border:1px solid rgba(148,163,184,.22);background:#202532;color:#e5e7eb;font-weight:850;box-shadow:none}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created{border-radius:8px;background:rgba(37,99,235,.10);border:1px solid rgba(96,165,250,.25);padding:12px;display:grid;gap:8px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created[hidden]{display:none}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created code{display:block;max-height:110px;overflow:auto;border-radius:8px;background:#0b1220;border:1px solid rgba(148,163,184,.18);color:#dbeafe;padding:10px;word-break:break-all}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{padding:8px 12px 12px;border-radius:10px;background:#101827;border:1px solid rgba(148,163,184,.18);overflow:auto}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{width:100%;min-width:100%;border-collapse:separate;border-spacing:0 8px;table-layout:fixed}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th{height:34px;padding:0 10px;background:transparent;color:#94a3b8;border:0;font-size:12px;font-weight:850;text-align:left;white-space:nowrap}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(1){width:17%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(2){width:15%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(3){width:14%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(4),
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(5){width:7%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(6){width:60px}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(7){width:12%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th:nth-child(8){width:220px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{padding:12px 10px;vertical-align:middle;background:#0b1220;border-top:1px solid rgba(148,163,184,.14);border-bottom:1px solid rgba(148,163,184,.14);color:#e5e7eb;font-size:12px;line-height:1.45}

@media (min-width: 761px) {
  html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer.front-resource-layer[data-resource-dialog=api-tokens] .jn-api-key-dialog.jn-api-key-dialog[hidden] {
    position: absolute;
    inset: 0;
    overflow: auto;
    padding: 18px;
  }

  html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer.front-resource-layer[data-resource-dialog=api-tokens] .jn-api-key-dialog.jn-api-key-dialog[hidden] .jn-api-key-panel.jn-api-key-panel {
    position: relative;
    inset: auto;
    width: min(440px, 100%);
    max-width: none;
    margin: auto;
  }
}

body:not(.page-admin) .front-resource-layer[data-resource-dialog=api-tokens] button:focus-visible {
  outline: auto 1px -webkit-focus-ring-color;
  outline-offset: 0;
}

body:not(.page-admin) .front-resource-layer[data-resource-dialog=api-tokens] .jn-api-editor :is(input:not([type=checkbox]), select):focus-visible {
  outline-offset: 0;
}

    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr:hover td{background:#0f1a2d}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:first-child{border-left:1px solid rgba(148,163,184,.14);border-radius:8px 0 0 8px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:last-child{border-right:1px solid rgba(148,163,184,.14);border-radius:0 8px 8px 0}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-name-cell strong{display:block;color:#f8fafc;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-name-cell small,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-time-cell small{display:block;margin-top:5px;color:#9aa7bb;font-size:11px;line-height:1.35}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-cell code{display:inline-block;max-width:100%;border-radius:8px;background:#111c30;border:1px solid rgba(148,163,184,.18);color:#dbeafe;padding:8px 10px;word-break:break-all;font-size:12px;line-height:1.45}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-policy-cell span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#dbeafe}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-number-cell{white-space:nowrap;color:#f8fafc;font-weight:800}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell{text-align:center}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{height:28px;min-width:56px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:rgba(16,185,129,.14);border:1px solid rgba(16,185,129,.30);color:#6ee7b7;font-size:12px;font-weight:900;line-height:28px;white-space:nowrap;word-break:keep-all;writing-mode:horizontal-tb}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{justify-self:start}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{background:rgba(248,113,113,.13);border-color:rgba(248,113,113,.30);color:#fecaca}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-time-cell time{display:block;color:#e5e7eb;font-size:12px;white-space:nowrap}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{display:grid;grid-template-columns:repeat(5,minmax(38px,1fr));gap:6px;align-items:center;justify-content:stretch;min-width:0}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action{height:32px;min-width:0;padding:0 8px;border-radius:8px;border:1px solid rgba(148,163,184,.20);background:#1b2433;color:#dbeafe;font-size:12px;font-weight:850;line-height:1;box-shadow:none;cursor:pointer;white-space:nowrap}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action:hover{border-color:rgba(96,165,250,.44);background:#243047;color:#fff}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action.is-primary{background:rgba(37,99,235,.16);border-color:rgba(96,165,250,.36);color:#bfdbfe}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action.is-danger{color:#fecaca;border-color:rgba(248,113,113,.28)}
    body[class^="page-"]:not(#jnApiTokenActionA):not(#jnApiTokenActionB):not(#jnApiTokenActionC):not(#jnApiTokenActionD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action{background:#1b2433;background-image:none;border-color:rgba(148,163,184,.20);color:#dbeafe;-webkit-text-fill-color:#dbeafe;box-shadow:none}
    body[class^="page-"]:not(#jnApiTokenActionA):not(#jnApiTokenActionB):not(#jnApiTokenActionC):not(#jnApiTokenActionD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-primary{background:rgba(37,99,235,.18);background-image:none;border-color:rgba(96,165,250,.42);color:#bfdbfe;-webkit-text-fill-color:#bfdbfe}
    body[class^="page-"]:not(#jnApiTokenActionA):not(#jnApiTokenActionB):not(#jnApiTokenActionC):not(#jnApiTokenActionD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-danger{background:rgba(127,29,29,.18);background-image:none;border-color:rgba(248,113,113,.34);color:#fecaca;-webkit-text-fill-color:#fecaca}
    html.jn-light-mode body[class^="page-"]:not(#jnApiTokenActionLightA):not(#jnApiTokenActionLightB):not(#jnApiTokenActionLightC):not(#jnApiTokenActionLightD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action,
body.jn-light-mode[class^="page-"]:not(#jnApiTokenActionLightA):not(#jnApiTokenActionLightB):not(#jnApiTokenActionLightC):not(#jnApiTokenActionLightD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action{background:#fff;background-image:none;border-color:rgba(15,23,42,.12);color:#0f172a;-webkit-text-fill-color:#0f172a}
    html.jn-light-mode body[class^="page-"]:not(#jnApiTokenActionLightA):not(#jnApiTokenActionLightB):not(#jnApiTokenActionLightC):not(#jnApiTokenActionLightD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-primary,
body.jn-light-mode[class^="page-"]:not(#jnApiTokenActionLightA):not(#jnApiTokenActionLightB):not(#jnApiTokenActionLightC):not(#jnApiTokenActionLightD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-primary{background:#eff6ff;background-image:none;border-color:#bfdbfe;color:#1d4ed8;-webkit-text-fill-color:#1d4ed8}
    html.jn-light-mode body[class^="page-"]:not(#jnApiTokenActionLightA):not(#jnApiTokenActionLightB):not(#jnApiTokenActionLightC):not(#jnApiTokenActionLightD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-danger,
body.jn-light-mode[class^="page-"]:not(#jnApiTokenActionLightA):not(#jnApiTokenActionLightB):not(#jnApiTokenActionLightC):not(#jnApiTokenActionLightD):not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions button.jn-api-action.is-danger{background:#fff1f2;background-image:none;border-color:#fecaca;color:#b91c1c;-webkit-text-fill-color:#b91c1c}
    .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-empty{border-radius:8px;background:#0b1220;border-color:rgba(148,163,184,.20);color:#9aa7bb}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{position:absolute;inset:0;z-index:100080;display:grid;place-items:center;background:rgba(2,6,23,.66);backdrop-filter:blur(10px);padding:16px}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog[hidden]{display:none}
    .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{width:min(560px,calc(100vw - 32px));border-radius:10px;background:#101827;border:1px solid rgba(148,163,184,.22);box-shadow:0 24px 70px rgba(0,0,0,.42);color:#f8fafc}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"],
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{background:rgba(15,23,42,.30)}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{background:#fff;background-image:none;color:#0f172a;border-color:rgba(15,23,42,.12);box-shadow:0 28px 80px rgba(15,23,42,.16)}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{background:#fff;border-color:rgba(15,23,42,.10)}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar,.jn-api-editor,.jn-api-table-wrap),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar,.jn-api-editor,.jn-api-table-wrap){background:#f8fafc;border-color:rgba(15,23,42,.10)}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head h2,.jn-api-toolbar strong,.jn-api-form-head strong,.jn-api-name-cell strong,.jn-api-number-cell),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head h2,.jn-api-toolbar strong,.jn-api-form-head strong,.jn-api-name-cell strong,.jn-api-number-cell){color:#0f172a;-webkit-text-fill-color:#0f172a}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head p,.jn-api-toolbar span,.jn-api-form-head span,.jn-api-name-cell small,.jn-api-time-cell small,.jn-api-table th),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head p,.jn-api-toolbar span,.jn-api-form-head span,.jn-api-name-cell small,.jn-api-time-cell small,.jn-api-table th){color:#64748b;-webkit-text-fill-color:#64748b}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-count-chip,.jn-api-editor-close,.jn-api-form-actions .front-profile-secondary,.jn-api-action),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-count-chip,.jn-api-editor-close,.jn-api-form-actions .front-profile-secondary,.jn-api-action){background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a;-webkit-text-fill-color:#0f172a}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-editor input:not([type=checkbox]),.jn-api-editor select,.jn-api-key-cell code,.jn-api-created code),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-editor input:not([type=checkbox]),.jn-api-editor select,.jn-api-key-cell code,.jn-api-created code){background:#fff;border-color:rgba(15,23,42,.14);color:#0f172a;-webkit-text-fill-color:#0f172a}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{background:#fff;border-color:rgba(15,23,42,.08);color:#0f172a}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr{background:#fff;border-color:rgba(15,23,42,.08)}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr:hover td,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr:hover td{background:#eef6ff}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{background:#fff;border-color:rgba(15,23,42,.12);color:#0f172a}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-policy-cell span,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-policy-cell span{color:#1e3a8a;-webkit-text-fill-color:#1e3a8a}

    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action.is-primary,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action.is-primary{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8;-webkit-text-fill-color:#1d4ed8}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action.is-danger,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action.is-danger{color:#b91c1c;-webkit-text-fill-color:#b91c1c;border-color:#fecaca}
    
    
    
    
    
    
    
    
    
    
    
    
    @media(max-width:760px){
.front-resource-layer[data-resource-dialog="api-tokens"]{padding:8px;place-items:end center}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:12px 12px 0 0;display:block;overflow:auto}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{padding:16px 14px 12px;align-items:flex-start}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{font-size:18px}.front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close{width:42px;height:42px;min-width:42px}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{padding:12px 12px 16px;overflow:visible}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{align-items:stretch;flex-direction:column}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar-actions{display:grid;grid-template-columns:1fr;justify-content:stretch}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-count-chip,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-create-trigger{width:100%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-grid{grid-template-columns:1fr}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perms{grid-template-columns:1fr}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions{display:grid;grid-template-columns:1fr 1fr}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-actions button{width:100%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{padding:0;background:transparent;border:0;overflow:visible}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table th,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{display:block;width:100%;min-width:0}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table{border-spacing:0}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead{display:none}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tbody{display:grid;gap:10px}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table tr{border-radius:10px;background:#101827;border:1px solid rgba(148,163,184,.16);padding:10px}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td{display:grid;grid-template-columns:82px minmax(0,1fr);gap:10px;align-items:start;padding:8px 0;border:0;border-bottom:1px solid rgba(148,163,184,.10);background:transparent;border-radius:0}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:last-child{border-bottom:0}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table td:before{content:attr(data-label);color:#94a3b8;font-size:12px;font-weight:900;white-space:nowrap}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-name-cell,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-actions-cell{grid-template-columns:1fr}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-name-cell:before,
.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-actions-cell:before{margin-bottom:2px}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-status-cell{text-align:left}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-time-cell time{white-space:normal}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-row-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action{height:36px;width:100%}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-dialog{align-items:end;padding:8px}.front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-key-panel{width:100%;border-radius:12px 12px 0 0}
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head.front-resource-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  min-width:0;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-manager{
  min-width:0;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .front-resource-close{
  font-size:20px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-create-trigger{
  min-width:108px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-row-actions{
  flex-wrap:wrap;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-table th,
html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-table td{
  line-height:1.45;
  text-align:left;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-table td time{
  margin-top:4px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-create-trigger span{
  margin-top:4px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor input{
  color:var(--text);
  transition:border-color .15s cubic-bezier(.16,1,.3,1),box-shadow .15s cubic-bezier(.16,1,.3,1);
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor input[type='text'],
html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor input[type='password'],
html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor input[type='email'],
html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor input[type='number'],
html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor select{
  transition:border-color .15s cubic-bezier(.16,1,.3,1),box-shadow .15s cubic-bezier(.16,1,.3,1),background .15s cubic-bezier(.16,1,.3,1);
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-editor select{
  appearance:none;
  -webkit-appearance:none;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-form-head{
  margin-bottom:12px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-perms{
  margin:6px 0 12px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-form-actions .jn-api-primary{
  min-width:86px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created{
  margin-top:12px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created span{
  color:#67e8f9;
  font-size:12px;
  font-weight:900;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created code{
  border:1px solid rgba(255,255,255,.12);
  color:#f4f4f5;
  font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created button{
  height:36px;
  min-width:0;
  border:0;
  border-radius:12px;
  background:linear-gradient(135deg,#22d3ee,#22c55e);
  color:#02101c;
  font-weight:900;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-table code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-key-dialog{
  position:fixed;
  inset:0;
  overflow:hidden;
  padding:0;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-key-panel{
  position:fixed;
  inset:66px 8px auto auto;
  width:344px;
  max-width:344px;
  margin:0;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-key-panel p{
  margin:6px 42px 12px 0;
  font-size:12px;
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-key-panel code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  word-break:break-all;
}

html.jn-light-mode body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created code{
  background:#fff;
  border-color:rgba(15,23,42,.14);
  color:#0f172a;
}

html.jn-light-mode body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created span{
  color:#64748b;
}

html.jn-light-mode body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-resource-layer[data-resource-dialog='api-tokens'] .jn-api-created button{
  background:#eef2f7;
  background-image:none;
  color:#0f172a;
  border-color:rgba(15,23,42,.12);
}

html body:not(.page-admin):not(#jnApiFoundationA):not(#jnApiFoundationB):not(#jnApiFoundationC) .front-creative-confirm-layer.jn-api-confirm-layer.is-enable .front-creative-confirm-actions button[data-confirm-ok]{
  box-shadow:0 8px 22px rgba(37,132,255,.22);
}

/* API key feedback stays above the manager without covering it with another dark veil. */
html body:not(.page-admin) .enterprise-alert-layer.enterprise-alert-layer.jn-api-alert-layer{
  position:fixed;
  inset:0;
  z-index:2147483647;
  display:grid;
  place-items:center;
  align-items:center;
  justify-content:center;
  padding:16px;
  overflow:hidden;
  background:transparent;
  background-image:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert{
  width:min(376px,calc(100vw - 32px));
  min-height:78px;
  padding:14px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  grid-template-areas:"icon title action" "icon message action";
  column-gap:11px;
  row-gap:2px;
  align-items:center;
  border:1px solid rgba(241,245,239,.16);
  border-radius:8px;
  background:rgba(47,51,47,.98);
  background-image:none;
  color:#f5f8f3;
  text-align:left;
  box-shadow:0 18px 48px rgba(8,10,8,.38),inset 0 1px 0 rgba(255,255,255,.05);
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert-icon{
  position:relative;
  grid-area:icon;
  width:38px;
  height:38px;
  margin:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(190,230,207,.24);
  border-radius:50%;
  background:#527a67;
  color:transparent;
  -webkit-text-fill-color:transparent;
  font-size:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 5px 14px rgba(14,31,23,.24);
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert-icon::before{
  content:"";
  position:relative;
  z-index:1;
  width:8px;
  height:14px;
  margin-top:-3px;
  border:0;
  border-right:2.5px solid #f7fff9;
  border-bottom:2.5px solid #f7fff9;
  transform:rotate(45deg);
  box-sizing:border-box;
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert-icon::after{
  content:"";
  position:absolute;
  inset:3px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:50%;
  pointer-events:none;
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer h3{
  grid-area:title;
  margin:0;
  color:#f7f9f5;
  -webkit-text-fill-color:#f7f9f5;
  font-size:13.5px;
  font-weight:650;
  line-height:1.35;
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer p{
  grid-area:message;
  margin:0;
  color:#b7beb7;
  -webkit-text-fill-color:#b7beb7;
  font-size:11.5px;
  line-height:1.45;
  word-break:break-word;
}
html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert>button{
  grid-area:action;
  width:auto;
  min-width:62px;
  height:32px;
  margin:0;
  padding:0 12px;
  border:1px solid rgba(241,245,239,.20);
  border-radius:6px;
  background:#d8dfd6;
  background-image:none;
  color:#292d29;
  -webkit-text-fill-color:#292d29;
  font-size:11.5px;
  font-weight:650;
  box-shadow:none;
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert,
body.jn-light-mode:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert,
body[data-theme="light"]:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert{
  border-color:rgba(54,50,44,.14);
  background:#faf8f4;
  color:#302d28;
  box-shadow:0 18px 46px rgba(48,44,38,.20);
  color-scheme:light;
}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer h3,
body.jn-light-mode:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer h3,
body[data-theme="light"]:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer h3{color:#302d28;-webkit-text-fill-color:#302d28}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer p,
body.jn-light-mode:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer p,
body[data-theme="light"]:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer p{color:#777168;-webkit-text-fill-color:#777168}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert>button,
body.jn-light-mode:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert>button,
body[data-theme="light"]:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert>button{border-color:#4d4942;background:#4d4942;color:#fffdf8;-webkit-text-fill-color:#fffdf8}
@media(max-width:460px){
  html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert{
    width:min(344px,calc(100vw - 24px));
    grid-template-columns:34px minmax(0,1fr);
    grid-template-areas:"icon title" "icon message" "action action";
  }
  html body:not(.page-admin) .enterprise-alert-layer.jn-api-alert-layer .enterprise-alert>button{width:100%;margin-top:8px}
}

/* Unified API key action dialog: view, copy, enable/disable and delete share one viewport-centered shell. */
html body:not(.page-admin) .jn-api-action-dialog{
  --api-action-accent:#7c6cf2;
  --api-action-accent-rgb:124,108,242;
  position:fixed;
  inset:0;
  z-index:2147483645;
  display:grid;
  place-items:center;
  padding:22px;
  overflow:auto;
  background:rgba(4,8,18,.68);
  -webkit-backdrop-filter:blur(14px) saturate(112%);
  backdrop-filter:blur(14px) saturate(112%);
  color-scheme:dark;
}
html body:not(.page-admin) .jn-api-action-dialog[hidden]{display:none!important}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="view"]{--api-action-accent:#55c9ba;--api-action-accent-rgb:85,201,186}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="copy"]{--api-action-accent:#6f8cff;--api-action-accent-rgb:111,140,255}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="enable"]{--api-action-accent:#4fc58b;--api-action-accent-rgb:79,197,139}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="disable"]{--api-action-accent:#f0a84b;--api-action-accent-rgb:240,168,75}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="delete"]{--api-action-accent:#f06b78;--api-action-accent-rgb:240,107,120}
html body:not(.page-admin) .jn-api-action-panel{
  position:relative;
  width:min(476px,calc(100vw - 32px));
  max-height:calc(100dvh - 40px);
  padding:24px;
  overflow:auto;
  border:1px solid rgba(163,177,207,.20);
  border-radius:22px;
  outline:0;
  background:
    radial-gradient(circle at 8% 0%,rgba(var(--api-action-accent-rgb),.15),transparent 36%),
    linear-gradient(155deg,#171e2c 0%,#111722 100%);
  color:#f4f7fb;
  box-shadow:0 30px 90px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.07);
  animation:apiActionDialogIn .2s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes apiActionDialogIn{from{opacity:0;transform:translateY(10px) scale(.975)}to{opacity:1;transform:none}}
html body:not(.page-admin) .jn-api-action-head{
  display:grid;
  grid-template-columns:58px minmax(0,1fr) 36px;
  gap:14px;
  align-items:center;
}
html body:not(.page-admin) .jn-api-action-illustration{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border:1px solid rgba(var(--api-action-accent-rgb),.32);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(var(--api-action-accent-rgb),.22),rgba(var(--api-action-accent-rgb),.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px rgba(var(--api-action-accent-rgb),.12);
}
html body:not(.page-admin) .jn-api-action-illustration svg{width:42px;height:42px;display:block;stroke:var(--api-action-accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin) .jn-api-action-heading{min-width:0;display:grid;gap:4px}
html body:not(.page-admin) .jn-api-action-heading>span{color:var(--api-action-accent);-webkit-text-fill-color:var(--api-action-accent);font-size:10px;font-weight:800;line-height:1.2;letter-spacing:.15em}
html body:not(.page-admin) .jn-api-action-heading h3{margin:0;color:#f7f9fd;-webkit-text-fill-color:#f7f9fd;font-size:20px;font-weight:760;line-height:1.3;letter-spacing:-.02em}
html body:not(.page-admin) .jn-api-action-close{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(163,177,207,.18);
  border-radius:11px;
  background:rgba(255,255,255,.045);
  color:#aeb9c9;
  -webkit-text-fill-color:#aeb9c9;
  font:400 22px/1 system-ui,sans-serif;
  cursor:pointer;
  transition:.18s ease;
}
html body:not(.page-admin) .jn-api-action-close:hover{border-color:rgba(var(--api-action-accent-rgb),.42);background:rgba(var(--api-action-accent-rgb),.12);color:#fff;-webkit-text-fill-color:#fff;transform:rotate(4deg)}
html body:not(.page-admin) .jn-api-action-message{margin:20px 0 0;color:#a9b4c4;-webkit-text-fill-color:#a9b4c4;font-size:14px;line-height:1.75}
html body:not(.page-admin) .jn-api-action-secret{
  display:grid;
  gap:8px;
  margin-top:18px;
  padding:14px;
  border:1px solid rgba(var(--api-action-accent-rgb),.25);
  border-radius:14px;
  background:rgba(4,9,17,.48);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
html body:not(.page-admin) .jn-api-action-secret[hidden],html body:not(.page-admin) .jn-api-action-note[hidden]{display:none!important}
html body:not(.page-admin) .jn-api-action-secret>span{color:#7f8da1;-webkit-text-fill-color:#7f8da1;font-size:11px;font-weight:700;letter-spacing:.08em}
html body:not(.page-admin) .jn-api-action-secret code{display:block;max-height:84px;overflow:auto;color:#dbe5f4;-webkit-text-fill-color:#dbe5f4;font:600 12.5px/1.65 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;word-break:break-all;user-select:all}
html body:not(.page-admin) .jn-api-action-note{display:flex;gap:9px;align-items:flex-start;margin-top:12px;padding:10px 12px;border-radius:11px;background:rgba(var(--api-action-accent-rgb),.08);color:#9facbd;-webkit-text-fill-color:#9facbd;font-size:11.5px;line-height:1.55}
html body:not(.page-admin) .jn-api-action-note svg{width:16px;height:16px;flex:0 0 16px;margin-top:1px;fill:none;stroke:var(--api-action-accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html body:not(.page-admin) .jn-api-action-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:10px;margin-top:22px}
html body:not(.page-admin) :is(.jn-api-action-secondary,.jn-api-action-primary){height:44px;padding:0 18px;border-radius:12px;font-size:13px;font-weight:750;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease}
html body:not(.page-admin) .jn-api-action-secondary{border:1px solid rgba(163,177,207,.20);background:rgba(255,255,255,.045);color:#c7d0dc;-webkit-text-fill-color:#c7d0dc}
html body:not(.page-admin) .jn-api-action-primary{border:1px solid rgba(var(--api-action-accent-rgb),.55);background:linear-gradient(135deg,rgba(var(--api-action-accent-rgb),.98),rgba(var(--api-action-accent-rgb),.73));color:#fff;-webkit-text-fill-color:#fff;box-shadow:0 10px 24px rgba(var(--api-action-accent-rgb),.22)}
html body:not(.page-admin) :is(.jn-api-action-secondary,.jn-api-action-primary):hover{transform:translateY(-1px)}
html body:not(.page-admin) .jn-api-action-secondary:hover{border-color:rgba(var(--api-action-accent-rgb),.38);background:rgba(var(--api-action-accent-rgb),.09)}
html body:not(.page-admin) .jn-api-action-primary:hover{box-shadow:0 14px 30px rgba(var(--api-action-accent-rgb),.30)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-dialog,
body.jn-light-mode:not(.page-admin) .jn-api-action-dialog,
body[data-theme="light"]:not(.page-admin) .jn-api-action-dialog{background:rgba(222,228,238,.72);color-scheme:light}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-panel,
body.jn-light-mode:not(.page-admin) .jn-api-action-panel,
body[data-theme="light"]:not(.page-admin) .jn-api-action-panel{border-color:rgba(45,55,75,.13);background:radial-gradient(circle at 8% 0%,rgba(var(--api-action-accent-rgb),.12),transparent 38%),linear-gradient(155deg,#fff 0%,#f6f8fc 100%);color:#182033;box-shadow:0 30px 78px rgba(36,45,65,.22),inset 0 1px 0 #fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-heading h3,
body.jn-light-mode:not(.page-admin) .jn-api-action-heading h3,
body[data-theme="light"]:not(.page-admin) .jn-api-action-heading h3{color:#182033;-webkit-text-fill-color:#182033}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-message,
body.jn-light-mode:not(.page-admin) .jn-api-action-message,
body[data-theme="light"]:not(.page-admin) .jn-api-action-message{color:#667085;-webkit-text-fill-color:#667085}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-close,
body.jn-light-mode:not(.page-admin) .jn-api-action-close,
body[data-theme="light"]:not(.page-admin) .jn-api-action-close{border-color:rgba(45,55,75,.13);background:rgba(255,255,255,.72);color:#657086;-webkit-text-fill-color:#657086}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-secret,
body.jn-light-mode:not(.page-admin) .jn-api-action-secret,
body[data-theme="light"]:not(.page-admin) .jn-api-action-secret{border-color:rgba(var(--api-action-accent-rgb),.24);background:#f5f7fb}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-secret code,
body.jn-light-mode:not(.page-admin) .jn-api-action-secret code,
body[data-theme="light"]:not(.page-admin) .jn-api-action-secret code{color:#27334a;-webkit-text-fill-color:#27334a}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-action-secondary,
body.jn-light-mode:not(.page-admin) .jn-api-action-secondary,
body[data-theme="light"]:not(.page-admin) .jn-api-action-secondary{border-color:rgba(45,55,75,.16);background:#fff;color:#4b566b;-webkit-text-fill-color:#4b566b}
@media(max-width:560px){
  html body:not(.page-admin) .jn-api-action-dialog{padding:12px;place-items:end center}
  html body:not(.page-admin) .jn-api-action-panel{width:100%;max-height:calc(100dvh - 18px);padding:20px 16px 16px;border-radius:22px 22px 14px 14px}
  html body:not(.page-admin) .jn-api-action-head{grid-template-columns:52px minmax(0,1fr) 36px;gap:11px}
  html body:not(.page-admin) .jn-api-action-illustration{width:52px;height:52px;border-radius:16px}
  html body:not(.page-admin) .jn-api-action-heading h3{font-size:18px}
  html body:not(.page-admin) .jn-api-action-actions{grid-template-columns:1fr}
  html body:not(.page-admin) .jn-api-action-primary{grid-row:1}
}

/* API actions stay inside the API manager: compact, transparent and panel-centered. */
html body:not(.page-admin) .jn-api-manager-modal{position:relative}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-dialog{
  position:absolute;
  inset:0;
  z-index:60;
  min-width:0;
  min-height:0;
  padding:14px;
  overflow:auto;
  place-items:center;
  border-radius:inherit;
  background:transparent;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  color-scheme:inherit;
}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-panel{
  width:min(408px,calc(100% - 20px));
  max-height:calc(100% - 16px);
  padding:19px;
  border-radius:17px;
  background:linear-gradient(155deg,#171e2c 0%,#111722 100%);
  box-shadow:0 21px 54px rgba(0,0,0,.45),0 0 0 1px rgba(9,14,24,.22);
}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-head{grid-template-columns:48px minmax(0,1fr) 32px;gap:11px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-illustration{width:48px;height:48px;border-radius:15px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-illustration svg{width:34px;height:34px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-heading{gap:3px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-heading>span{font-size:9px;letter-spacing:.13em}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-heading h3{font-size:18px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-close{width:32px;height:32px;border-radius:10px;font-size:19px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-message{margin-top:15px;font-size:12.5px;line-height:1.65}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-secret{gap:6px;margin-top:13px;padding:11px 12px;border-radius:11px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-secret>span{font-size:10px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-secret code{max-height:65px;font-size:11.5px;line-height:1.55}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-note{gap:7px;margin-top:9px;padding:8px 10px;border-radius:9px;font-size:10.5px;line-height:1.45}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-note svg{width:14px;height:14px;flex-basis:14px}
html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-actions{gap:9px;margin-top:17px}
html body:not(.page-admin) .jn-api-manager-modal :is(.jn-api-action-secondary,.jn-api-action-primary){height:38px;padding:0 14px;border-radius:10px;font-size:12px}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="success"]{--api-action-accent:#4fc58b;--api-action-accent-rgb:79,197,139}
html body:not(.page-admin) .jn-api-action-dialog[data-variant="error"]{--api-action-accent:#ef6675;--api-action-accent-rgb:239,102,117}
html body:not(.page-admin) .jn-api-action-dialog[data-mode="notice"] .jn-api-action-panel{width:min(382px,calc(100% - 20px))}
html body:not(.page-admin) .jn-api-action-dialog[data-mode="notice"] .jn-api-action-actions{grid-template-columns:1fr;margin-top:17px}
html body:not(.page-admin) .jn-api-action-dialog[data-mode="notice"] .jn-api-action-secondary[hidden]{display:none!important}
html body:not(.page-admin) .jn-api-action-dialog[data-mode="notice"] .jn-api-action-primary{width:min(160px,100%);justify-self:end}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-manager-modal .jn-api-action-dialog,
body.jn-light-mode:not(.page-admin) .jn-api-manager-modal .jn-api-action-dialog,
body[data-theme="light"]:not(.page-admin) .jn-api-manager-modal .jn-api-action-dialog{background:transparent;color-scheme:light}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .jn-api-manager-modal .jn-api-action-panel,
body.jn-light-mode:not(.page-admin) .jn-api-manager-modal .jn-api-action-panel,
body[data-theme="light"]:not(.page-admin) .jn-api-manager-modal .jn-api-action-panel{
  border-color:rgba(94,105,148,.13);
  background:linear-gradient(155deg,#fff 0%,#f7f8ff 100%);
  box-shadow:0 21px 54px rgba(51,61,94,.21),0 0 0 1px rgba(255,255,255,.76);
}
@media(max-width:560px){
  html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-dialog{padding:8px;place-items:center}
  html body:not(.page-admin) .jn-api-manager-modal .jn-api-action-panel{width:100%;max-height:calc(100% - 6px);padding:17px 14px 14px;border-radius:16px}
  html body:not(.page-admin) .jn-api-action-dialog[data-mode="notice"] .jn-api-action-panel{width:100%}
  html body:not(.page-admin) .jn-api-action-dialog[data-mode="notice"] .jn-api-action-primary{width:100%}
}

/* 2026-08 final neutral API manager: white/black system surfaces with semantic red only for danger. */
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{--api-surface:#171717;--api-surface-raised:#202020;--api-toolbar:#1b1b1b;--api-table:#1b1b1b;--api-table-head:#262626;--api-row:#1f1f1f;--api-row-hover:#242424;--api-field:#262626;--api-line:#383838;--api-line-strong:#4a4a4a;--api-text:#e5e5e5;--api-text-strong:#fafafa;--api-muted:#a3a3a3;--api-accent:#f5f5f5;--api-accent-ink:#111;--api-danger:#dc4c5d;color-scheme:dark}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{border:1px solid var(--api-line);background:var(--api-surface);background-image:none;color:var(--api-text);box-shadow:0 28px 72px rgba(0,0,0,.46)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head{border-bottom:1px solid var(--api-line);background:var(--api-surface);background-image:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-head h2{color:var(--api-text-strong);-webkit-text-fill-color:var(--api-text-strong)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .front-resource-close{border:1px solid var(--api-line);background:#242424;background-image:none;color:#d4d4d4;-webkit-text-fill-color:#d4d4d4;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager{background:var(--api-surface);background-image:none;color:var(--api-text)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{border-color:var(--api-line);background:var(--api-toolbar);background-image:none;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-toolbar-copy strong,.jn-api-form-head strong){color:var(--api-text-strong);-webkit-text-fill-color:var(--api-text-strong)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary{border:1px solid var(--api-accent);background:var(--api-accent);background-image:none;color:var(--api-accent-ink);-webkit-text-fill-color:var(--api-accent-ink);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-primary:hover{filter:none;opacity:.9;transform:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-editor{border:1px solid var(--api-line);background:var(--api-surface-raised);background-image:none;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-form-head{border-color:var(--api-line)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field{color:var(--api-muted);-webkit-text-fill-color:var(--api-muted)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field :is(input,select){border:1px solid var(--api-line-strong);background:var(--api-field);background-image:none;color:var(--api-text-strong);-webkit-text-fill-color:var(--api-text-strong);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field :is(input,select):focus{border-color:#737373;box-shadow:0 0 0 3px rgba(163,163,163,.14)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{border:1px solid var(--api-line);background:var(--api-row);background-image:none;color:var(--api-text);-webkit-text-fill-color:var(--api-text);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){border-color:#737373;background:#2a2a2a;background-image:none;color:var(--api-text-strong);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{accent-color:#737373}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .front-profile-secondary{border:1px solid var(--api-line-strong);background:transparent;background-image:none;color:var(--api-text);-webkit-text-fill-color:var(--api-text);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created{border:1px solid var(--api-line-strong);background:#1b1b1b;background-image:none;color:var(--api-text);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created>span{color:var(--api-muted);-webkit-text-fill-color:var(--api-muted)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created>code{border:1px solid var(--api-line);background:#262626;color:var(--api-text-strong);-webkit-text-fill-color:var(--api-text-strong)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-created>button{border:1px solid var(--api-accent);background:var(--api-accent);background-image:none;color:var(--api-accent-ink);-webkit-text-fill-color:var(--api-accent-ink);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table-wrap{border:1px solid var(--api-line);background:var(--api-table);background-image:none;color:var(--api-text);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th{border-color:var(--api-line);background:var(--api-table-head);background-image:none;color:var(--api-muted);-webkit-text-fill-color:var(--api-muted)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table :is(.jn-api-token-row,.jn-api-token-row>td){border-color:var(--api-line);background:var(--api-row);background-image:none;color:var(--api-text)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-token-row:hover>td{background:var(--api-row-hover)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table :is(strong,code,time,span){color:inherit;-webkit-text-fill-color:inherit}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge{border:1px solid #525252;background:#2b2b2b;background-image:none;color:#e5e5e5;-webkit-text-fill-color:#e5e5e5;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-token-badge.off{border-color:#404040;background:#242424;color:#8f8f8f;-webkit-text-fill-color:#8f8f8f}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action{border:1px solid var(--api-line);background:#262626;background-image:none;color:#d4d4d4;-webkit-text-fill-color:#d4d4d4;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action:hover{border-color:#525252;background:#303030;color:#fafafa}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action.is-danger{border-color:rgba(220,76,93,.38);background:rgba(220,76,93,.1);color:#f27b88;-webkit-text-fill-color:#f27b88}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog{background:transparent;background-image:none;-webkit-backdrop-filter:none;backdrop-filter:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-panel{width:min(380px,calc(100% - 24px));max-width:380px;border:1px solid var(--api-line);border-radius:14px;background:#1f1f1f;background-image:none;color:var(--api-text);box-shadow:0 22px 56px rgba(0,0,0,.48)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-illustration{border:1px solid var(--api-line);background:#2a2a2a;background-image:none;color:#d4d4d4;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-heading>span,.jn-api-action-message,.jn-api-action-note){color:var(--api-muted);-webkit-text-fill-color:var(--api-muted)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-heading h3{color:var(--api-text-strong);-webkit-text-fill-color:var(--api-text-strong)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-close,.jn-api-action-secondary){border:1px solid var(--api-line-strong);background:transparent;background-image:none;color:var(--api-text);-webkit-text-fill-color:var(--api-text);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-secret,.jn-api-action-note){border:1px solid var(--api-line);background:#262626;background-image:none;box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-secret code{color:var(--api-text-strong);-webkit-text-fill-color:var(--api-text-strong)}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-primary{border:1px solid var(--api-accent);background:var(--api-accent);background-image:none;color:var(--api-accent-ink);-webkit-text-fill-color:var(--api-accent-ink);box-shadow:none}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-primary:disabled{border-color:#404040;background:#303030;color:#8f8f8f;-webkit-text-fill-color:#8f8f8f;opacity:1}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="error"],[data-variant="danger"]) .jn-api-action-illustration{border-color:rgba(220,76,93,.38);background:rgba(220,76,93,.1);color:#f27b88}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="error"],[data-variant="danger"]) .jn-api-action-primary{border-color:var(--api-danger);background:var(--api-danger);color:#fff;-webkit-text-fill-color:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"],body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"],body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{--api-surface:#fff;--api-surface-raised:#fff;--api-toolbar:#fafafa;--api-table:#fff;--api-table-head:#f5f5f5;--api-row:#fff;--api-row-hover:#fafafa;--api-field:#fff;--api-line:#e5e5e5;--api-line-strong:#d4d4d4;--api-text:#404040;--api-text-strong:#171717;--api-muted:#737373;--api-accent:#171717;--api-accent-ink:#fff;color-scheme:light}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-manager-modal{border-color:#e5e5e5;background:#fff;background-image:none;color:#404040;box-shadow:0 28px 70px rgba(23,23,23,.18)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head,.jn-api-manager,.jn-api-toolbar,.jn-api-editor,.jn-api-table-wrap,.jn-api-token-row,.jn-api-token-row>td),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head,.jn-api-manager,.jn-api-toolbar,.jn-api-editor,.jn-api-table-wrap,.jn-api-token-row,.jn-api-token-row>td),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-head,.jn-api-manager,.jn-api-toolbar,.jn-api-editor,.jn-api-table-wrap,.jn-api-token-row,.jn-api-token-row>td){border-color:#e5e5e5;background:#fff;background-image:none;color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{background:#fafafa}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th{border-color:#e5e5e5;background:#f5f5f5;color:#737373;-webkit-text-fill-color:#737373}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field :is(input,select),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field :is(input,select),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-field :is(input,select){border-color:#d4d4d4;background:#fff;color:#171717;-webkit-text-fill-color:#171717}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm{border-color:#e5e5e5;background:#fff;color:#404040;-webkit-text-fill-color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){border-color:#a3a3a3;background:#f5f5f5;color:#171717;-webkit-text-fill-color:#171717}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.front-resource-close,.front-profile-secondary,.jn-api-action-close,.jn-api-action-secondary,.jn-api-icon-action),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.front-resource-close,.front-profile-secondary,.jn-api-action-close,.jn-api-action-secondary,.jn-api-icon-action),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.front-resource-close,.front-profile-secondary,.jn-api-action-close,.jn-api-action-secondary,.jn-api-icon-action){border-color:#d4d4d4;background:#fff;background-image:none;color:#404040;-webkit-text-fill-color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-created,.jn-api-action-panel),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-created,.jn-api-action-panel),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-created,.jn-api-action-panel){border-color:#e5e5e5;background:#fff;background-image:none;color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-created>code,.jn-api-action-secret,.jn-api-action-note,.jn-api-action-illustration),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-created>code,.jn-api-action-secret,.jn-api-action-note,.jn-api-action-illustration),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-created>code,.jn-api-action-secret,.jn-api-action-note,.jn-api-action-illustration){border-color:#e5e5e5;background:#f5f5f5;background-image:none;color:#404040;-webkit-text-fill-color:#404040}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-panel,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-panel,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-panel{box-shadow:0 22px 54px rgba(23,23,23,.2)}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-created>button,.jn-api-action-primary),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-created>button,.jn-api-action-primary),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-created>button,.jn-api-action-primary){border-color:#171717;background:#171717;background-image:none;color:#fff;-webkit-text-fill-color:#fff}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-primary:disabled,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-primary:disabled,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-primary:disabled{border-color:#d4d4d4;background:#e5e5e5;color:#737373;-webkit-text-fill-color:#737373;opacity:1}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action.is-danger,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action.is-danger,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-icon-action.is-danger{border-color:rgba(190,24,50,.24);background:#fff5f6;color:#be1832;-webkit-text-fill-color:#be1832}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary{border-color:#be1832;background:#be1832;color:#fff;-webkit-text-fill-color:#fff}

/* Final color authority against legacy API selectors with ID-level specificity. */
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{--api-accent:#f5f5f5!important;--api-accent-hover:#e5e5e5!important;--api-accent-ink:#111!important;--api-accent-soft:rgba(255,255,255,.08)!important;--api-accent-line:#737373!important;--api-teal:#d4d4d4!important;--api-switch:#404040!important;--api-switch-knob:#d4d4d4!important;--api-switch-knob-checked:#111!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger,.jn-api-created>button,.jn-api-action-primary){border-color:#f5f5f5!important;background:#f5f5f5!important;background-image:none!important;color:#111!important;-webkit-text-fill-color:#111!important;box-shadow:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{border-color:#525252!important;background:#404040!important;background-image:none!important;box-shadow:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{background:#d4d4d4!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked{border-color:#f5f5f5!important;background:#f5f5f5!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked::before{background:#111!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){border-color:#737373!important;background:#2a2a2a!important;background-image:none!important;color:#fafafa!important;-webkit-text-fill-color:#fafafa!important;box-shadow:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-modal,.jn-api-manager-head,.jn-api-manager){background:#171717!important;background-image:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{border-color:#383838!important;background:#1b1b1b!important;background-image:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-editor,.jn-api-table-wrap,.jn-api-created){border-color:#383838!important;background:#202020!important;background-image:none!important;box-shadow:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th{border-color:#383838!important;background:#262626!important;background-image:none!important;color:#a3a3a3!important;-webkit-text-fill-color:#a3a3a3!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table :is(.jn-api-token-row,.jn-api-token-row>td){border-color:#383838!important;background:#1f1f1f!important;background-image:none!important;color:#e5e5e5!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-token-badge,.jn-token-badge.off){border-color:#525252!important;background:#2b2b2b!important;background-image:none!important;color:#d4d4d4!important;-webkit-text-fill-color:#d4d4d4!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-illustration,.jn-api-action-secret,.jn-api-action-note){border-color:#383838!important;background:#262626!important;background-image:none!important;color:#d4d4d4!important;-webkit-text-fill-color:#d4d4d4!important;box-shadow:none!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-panel{border-color:#383838!important;background:#1f1f1f!important;background-image:none!important;color:#e5e5e5!important}
html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary{border-color:#dc4c5d!important;background:#dc4c5d!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"],body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"],body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"]{--api-accent:#171717!important;--api-accent-hover:#262626!important;--api-accent-ink:#fff!important;--api-accent-soft:rgba(23,23,23,.05)!important;--api-accent-line:#a3a3a3!important;--api-teal:#525252!important;--api-switch:#d4d4d4!important;--api-switch-knob:#fff!important;--api-switch-knob-checked:#fff!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger,.jn-api-created>button,.jn-api-action-primary),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger,.jn-api-created>button,.jn-api-action-primary),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-primary,.jn-api-create-trigger,.jn-api-created>button,.jn-api-action-primary){border-color:#171717!important;background:#171717!important;background-image:none!important;color:#fff!important;-webkit-text-fill-color:#fff!important;box-shadow:none!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input{border-color:#d4d4d4!important;background:#d4d4d4!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input::before{background:#fff!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm input:checked{border-color:#171717!important;background:#171717!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-perm:has(input:checked){border-color:#a3a3a3!important;background:#f5f5f5!important;color:#171717!important;-webkit-text-fill-color:#171717!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-modal,.jn-api-manager-head,.jn-api-manager,.jn-api-editor,.jn-api-table-wrap,.jn-api-created),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-modal,.jn-api-manager-head,.jn-api-manager,.jn-api-editor,.jn-api-table-wrap,.jn-api-created),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-manager-modal,.jn-api-manager-head,.jn-api-manager,.jn-api-editor,.jn-api-table-wrap,.jn-api-created){border-color:#e5e5e5!important;background:#fff!important;background-image:none!important;color:#404040!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-toolbar{border-color:#e5e5e5!important;background:#fafafa!important;background-image:none!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table thead th{border-color:#e5e5e5!important;background:#f5f5f5!important;color:#737373!important;-webkit-text-fill-color:#737373!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table :is(.jn-api-token-row,.jn-api-token-row>td),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table :is(.jn-api-token-row,.jn-api-token-row>td),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-table :is(.jn-api-token-row,.jn-api-token-row>td){border-color:#e5e5e5!important;background:#fff!important;color:#404040!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-token-badge,.jn-token-badge.off),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-token-badge,.jn-token-badge.off),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-token-badge,.jn-token-badge.off){border-color:#d4d4d4!important;background:#f5f5f5!important;color:#525252!important;-webkit-text-fill-color:#525252!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-panel,.jn-api-action-illustration,.jn-api-action-secret,.jn-api-action-note),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-panel,.jn-api-action-illustration,.jn-api-action-secret,.jn-api-action-note),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] :is(.jn-api-action-panel,.jn-api-action-illustration,.jn-api-action-secret,.jn-api-action-note){border-color:#e5e5e5!important;background:#fff!important;background-image:none!important;color:#404040!important;-webkit-text-fill-color:#404040!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary,body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary,body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:is([data-variant="danger"],[data-variant="error"]) .jn-api-action-primary{border-color:#be1832!important;background:#be1832!important;color:#fff!important;-webkit-text-fill-color:#fff!important}html body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:not([data-variant="danger"]):not([data-variant="error"]){--api-action-accent:#737373!important;--api-action-accent-rgb:115,115,115!important}
:is(html.jn-light-mode,html[data-theme="light"]) body:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:not([data-variant="danger"]):not([data-variant="error"]),body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:not([data-variant="danger"]):not([data-variant="error"]),body[data-theme="light"]:not(.page-admin) .front-resource-layer[data-resource-dialog="api-tokens"] .jn-api-action-dialog:not([data-variant="danger"]):not([data-variant="error"]){--api-action-accent:#525252!important;--api-action-accent-rgb:82,82,82!important}

body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-pay-record-meta code{
  padding:0 4px;
  border-radius:4px;
  background:var(--main-surface-soft);
  font-size:clamp(11px,1.3vw,13px);
}

:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-pay-record-meta code,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-pay-record-meta code{
  background:#f1f5f9;
}

html[data-theme=dark] body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-tab.is-active,
body[data-theme=dark]:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-tab.is-active{
  background:rgba(59,130,246,.16);
  border-color:rgba(59,130,246,.34);
  color:#3b82f6;
  -webkit-text-fill-color:currentColor;
}

html[data-theme=dark] body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) :is(.front-ledger-cost.charge,.front-pay-record-status.failed),
body[data-theme=dark]:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) :is(.front-ledger-cost.charge,.front-pay-record-status.failed){
  color:#fb7185;
  -webkit-text-fill-color:currentColor;
}

html[data-theme=dark] body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) [data-credit-pane=other] time,
body[data-theme=dark]:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) [data-credit-pane=other] time{
  color:#949494;
  -webkit-text-fill-color:currentColor;
}

html[data-theme=dark] body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-tab,
body[data-theme=dark]:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-tab{
  background:#252832;
}

html[data-theme=dark] body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode [data-credit-pane=model] .front-ledger-cost.charge,
body[data-theme=dark]:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode [data-credit-pane=model] .front-ledger-cost.charge{
  color:#fb7185;
  -webkit-text-fill-color:currentColor;
}

body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits][data-credit-payment-mode=1]{
  place-items:center;
  padding:16px;
  background:radial-gradient(circle at 52% 12%,rgba(34,211,238,.15),transparent 34%),radial-gradient(circle at 86% 22%,rgba(34,197,94,.10),transparent 30%),rgba(2,6,23,.70);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
html body:not(.page-admin) .front-resource-layer.front-resource-layer[data-resource-dialog=credits][data-credit-payment-mode="1"]{
  padding:16px;
}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits][data-credit-payment-mode=1],
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits][data-credit-payment-mode=1]{
  background:rgba(226,232,240,.76);
  background-image:none;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode{
  width:min(600px,calc(100vw - 28px));
  max-height:min(680px,calc(100dvh - 28px));
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  background:rgba(38,38,40,.94);
  color:#ededee;
  box-shadow:0 28px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(22px) saturate(115%);
  -webkit-backdrop-filter:blur(22px) saturate(115%);
  color-scheme:dark;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-shell{
  min-height:0;
  max-height:min(680px,calc(100dvh - 28px));
  background:rgba(38,38,40,.88);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-head{
  flex:0 0 auto;
  height:92px;
  padding:19px 20px 18px 24px;
  border-color:rgba(255,255,255,.10);
  background:rgba(51,51,54,.82);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-icon{
  width:48px;
  height:48px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  background:rgba(255,255,255,.075);
  color:#e7e7e8;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 18px rgba(0,0,0,.12);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title{
  gap:11px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-icon svg{
  width:20px;
  height:20px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title h2{
  margin:0;
  color:#f5f5f5;
  -webkit-text-fill-color:#f5f5f5;
  font-size:22px;
  font-weight:800;
  line-height:1.2;
  letter-spacing:0;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title p{
  margin:3px 0 0;
  color:#aaa9ad;
  -webkit-text-fill-color:#aaa9ad;
  font-size:12px;
  line-height:1.35;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-close{
  width:32px;
  height:32px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:rgba(255,255,255,.07);
  color:#b9b8bc;
  font-size:24px;
  line-height:1;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-close:hover{
  border-color:rgba(255,255,255,.20);
  background:rgba(255,255,255,.12);
  color:#fff;
  transform:translateY(-1px);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-body{
  min-height:0;
  padding:16px 0 20px;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-color:#626265 transparent;
  scrollbar-width:thin;
  background:rgba(38,38,40,.88);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-body::-webkit-scrollbar{width:6px}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-body::-webkit-scrollbar-thumb{border-radius:999px;background:#626265}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-list{
  gap:10px;
  padding:0 20px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row{
  min-height:112px;
  grid-template-columns:46px minmax(0,1fr) auto;
  grid-template-rows:auto auto;
  gap:0 13px;
  padding:16px;
  border:1px solid rgba(255,255,255,.105);
  border-radius:8px;
  background:rgba(255,255,255,.055);
  color:#e5e5e6;
  box-shadow:0 7px 18px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.035);
  transition:transform .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease;
  will-change:transform;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.19);
  background:rgba(255,255,255,.09);
  box-shadow:0 12px 24px rgba(0,0,0,.16);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-icon{
  grid-row:1 / span 2;
  width:42px;
  height:42px;
  box-sizing:border-box;
  display:grid;
  place-items:center;
  align-self:start;
  margin:0;
  padding:0;
  border:1px solid rgba(255,255,255,.72);
  border-radius:8px;
  background:#fff;
  color:#555;
  box-shadow:0 5px 13px rgba(0,0,0,.16);
  line-height:0;
  overflow:hidden;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-icon svg{
  width:30px;
  height:30px;
  display:block;
  margin:auto;
  flex:none;
  transform:none;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-icon svg:not(:first-child){display:none}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-main{min-width:0}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-title{flex-wrap:wrap;gap:7px}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row strong{
  color:#f4f4f4;
  -webkit-text-fill-color:#f4f4f4;
  font-size:15px;
  line-height:1.35;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta{
  gap:7px;
  margin-top:7px;
  color:#9e9da1;
  -webkit-text-fill-color:#9e9da1;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta b{
  height:20px;
  padding:0 7px;
  border:1px solid rgba(52,211,153,.20);
  border-radius:4px;
  background:#1f5949;
  color:#8ee8c2;
  -webkit-text-fill-color:#8ee8c2;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta code{
  padding:0 4px;
  border-radius:4px;
  background:#1f232b;
  color:#9e9da1;
  -webkit-text-fill-color:#9e9da1;
  font-size:clamp(11px,1.3vw,13px);
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits]:has(.front-ledger-other-list>.front-ledger-other-row:nth-child(11)){
  padding:8px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits]:has(.front-ledger-other-list>.front-ledger-other-row:nth-child(11)) .front-ledger-modal.is-payment-mode .front-ledger-title{
  gap:14px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits]:has(.front-ledger-other-list>.front-ledger-other-row:nth-child(11)) .front-ledger-modal.is-payment-mode .front-ledger-icon svg{
  width:29px;
  height:29px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits]:has(.front-ledger-other-list>.front-ledger-other-row:nth-child(11)) .front-ledger-modal.is-payment-mode .front-ledger-title h2{
  font-weight:900;
  line-height:1.12;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits]:has(.front-ledger-other-list>.front-ledger-other-row:nth-child(11)) .front-ledger-modal.is-payment-mode .front-ledger-title p{
  margin-top:7px;
  font-size:13px;
  line-height:1.4;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row em{
  color:#f0d5a4;
  -webkit-text-fill-color:#f0d5a4;
  font-size:18px;
  font-variant-numeric:tabular-nums;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row time{
  grid-column:2 / 4;
  margin-top:13px;
  padding-top:11px;
  border-color:rgba(255,255,255,.09);
  color:#aaa9ad;
  -webkit-text-fill-color:#aaa9ad;
  font-variant-numeric:tabular-nums;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row time:before,
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row time:after{content:none;display:none}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end{margin-top:22px;color:#858489;-webkit-text-fill-color:#858489}
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:before,
body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:after{background:rgba(255,255,255,.10)}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode{
  border-color:#dededf;
  background:#f7f7f8;
  color:#2f2f31;
  box-shadow:0 28px 72px rgba(32,32,34,.16);
  color-scheme:light;
}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode :is(.front-ledger-shell,.front-ledger-body),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode :is(.front-ledger-shell,.front-ledger-body){background:#f7f7f8}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-head,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-head{border-color:#dededf;background:#fff}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-icon,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-icon{border-color:#d9d9db;background:#ededee;color:#555458;box-shadow:none}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title h2,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title h2{color:#2a2a2c;-webkit-text-fill-color:#2a2a2c}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title p,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title p{color:#737276;-webkit-text-fill-color:#737276}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-close,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-close{border-color:#d9d9db;background:#eeeeef;color:#626165}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-close:hover,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-close:hover{border-color:#c9c9cb;background:#e5e5e6;color:#2f2f31}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row{
  border-color:#dededf;
  background:#fff;
  color:#2f2f31;
  -webkit-text-fill-color:#2f2f31;
  box-shadow:0 6px 18px rgba(32,32,34,.05);
}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row:hover,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row:hover{border-color:#c9c9cb;background:#fafafa;box-shadow:0 11px 24px rgba(32,32,34,.08)}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row strong,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row strong{color:#2f2f31;-webkit-text-fill-color:#2f2f31}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta,
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta code,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode :is(.front-pay-record-meta,.front-pay-record-meta code){color:#77767a;-webkit-text-fill-color:#77767a}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta code,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta code{background:#f1f5f9}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-status,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-status{color:#64748b;-webkit-text-fill-color:#64748b}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta b,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta b{border-color:#a9e7cd;background:#e8f8f1;color:#137657;-webkit-text-fill-color:#137657}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row em,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row em{color:#936525;-webkit-text-fill-color:#936525}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row time,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row time{border-color:#e4e4e5;color:#77767a;-webkit-text-fill-color:#77767a}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end{color:#929195;-webkit-text-fill-color:#929195}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:before,
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:after,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:before,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:after{background:#dededf}

:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-shell,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-shell{border-color:rgba(15,23,42,.10);box-shadow:none}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-head,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-head{box-shadow:none}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-body,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-body{border-color:rgba(15,23,42,.10);box-shadow:none}

:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-shell,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-shell{border-color:rgba(15,23,42,.10);box-shadow:none}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-head,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-head{border-color:rgba(15,23,42,.10);border-bottom-color:rgb(221,229,234);box-shadow:none}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-title h2,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-title h2{color:#0f172a;-webkit-text-fill-color:#0f172a}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-title p,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-title p{color:#64748b;-webkit-text-fill-color:#64748b}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-body,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-body{border-color:rgba(15,23,42,.10);box-shadow:none}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-stat,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-stat{border-color:rgba(15,23,42,.10);background:#f8fafc;color:#334155;-webkit-text-fill-color:#334155}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-stat span,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-stat span{color:#64748b;-webkit-text-fill-color:#64748b}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-stat strong,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-stat strong{color:#0f172a;-webkit-text-fill-color:#0f172a}
:is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-toolbar,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal:not(.is-payment-mode) .front-ledger-toolbar{border-color:rgba(15,23,42,.10);border-bottom-color:rgba(15,23,42,.10);background:#fff;box-shadow:none}
@media(max-width:760px){
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode{width:calc(100vw - 20px);height:calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 66px);max-height:calc(100dvh - 20px);border-radius:12px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-shell{height:calc(100dvh - max(10px,env(safe-area-inset-top,0px)) - 68px);max-height:100%}
  
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-head{height:78px;padding:14px 14px 13px 16px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-icon{width:42px;height:42px;border-radius:10px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title{gap:9px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title h2{font-size:19px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-title p{max-width:235px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;line-height:1.35}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-body{padding:12px 0 16px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-list{gap:8px;padding:0 10px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row{min-height:110px;grid-template-columns:40px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:0 10px;padding:13px 12px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-icon{width:38px;height:38px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row strong{font-size:14px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-title{gap:5px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-meta{max-width:100%;margin-top:6px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row em{grid-column:3;grid-row:1;align-self:start;font-size:16px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-ledger-other-row time{grid-column:2 / 4;margin-top:11px;padding-top:10px;font-size:12px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end{margin-top:18px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:before,
  body:not(.page-admin) .front-resource-layer[data-resource-dialog=credits] .front-ledger-modal.is-payment-mode .front-pay-record-end:after{width:54px}
}
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"],
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"],
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"]{
      background:rgba(226,232,240,.76);
      background-image:none;
      backdrop-filter:blur(10px);
      -webkit-backdrop-filter:blur(10px);
    }
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-modal,.front-ledger-shell,.front-ledger-head,.front-ledger-tabs,.front-ledger-body,.front-ledger-toolbar),
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-modal,.front-ledger-shell,.front-ledger-head,.front-ledger-tabs,.front-ledger-body,.front-ledger-toolbar),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-modal,.front-ledger-shell,.front-ledger-head,.front-ledger-tabs,.front-ledger-body,.front-ledger-toolbar){
      background:#ffffff;
      background-image:none;
      border-color:rgba(15,23,42,.10);
      color:#0f172a;
      box-shadow:none;
      color-scheme:light;
    }
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal,
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal{
      box-shadow:0 24px 70px rgba(15,23,42,.18);
    }
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-stat,.front-ledger-row:not(.front-ledger-table-head),.front-ledger-other-row,.front-ledger-select,.front-ledger-calendar-pop input,.front-ledger-calendar-actions button,.front-ledger-export),
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-stat,.front-ledger-row:not(.front-ledger-table-head),.front-ledger-other-row,.front-ledger-select,.front-ledger-calendar-pop input,.front-ledger-calendar-actions button,.front-ledger-export),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-stat,.front-ledger-row:not(.front-ledger-table-head),.front-ledger-other-row,.front-ledger-select,.front-ledger-calendar-pop input,.front-ledger-calendar-actions button,.front-ledger-export){
      background:#f8fafc;
      background-image:none;
      border-color:rgba(15,23,42,.10);
      color:#334155;
      -webkit-text-fill-color:#334155;
      box-shadow:none;
    }
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-title h2,.front-ledger-model,.front-ledger-stat strong,.front-ledger-other-row strong),
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-title h2,.front-ledger-model,.front-ledger-stat strong,.front-ledger-other-row strong),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-title h2,.front-ledger-model,.front-ledger-stat strong,.front-ledger-other-row strong){
      color:#0f172a;
      -webkit-text-fill-color:#0f172a;
    }
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-title p,.front-ledger-muted,.front-ledger-stat span,.front-ledger-table-head,.front-ledger-other-row span),
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-title p,.front-ledger-muted,.front-ledger-stat span,.front-ledger-table-head,.front-ledger-other-row span),
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] :is(.front-ledger-title p,.front-ledger-muted,.front-ledger-stat span,.front-ledger-table-head,.front-ledger-other-row span){
      color:#64748b;
      -webkit-text-fill-color:#64748b;
    }
    html.jn-light-mode body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-row:not(.front-ledger-table-head):hover,
html[data-theme="light"] body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-row:not(.front-ledger-table-head):hover,
body.jn-light-mode:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-row:not(.front-ledger-table-head):hover{
      background:#f1f5f9;
    }
    body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-calendar-pop label{
      position:relative;
      display:flex;
      align-items:center;
      min-width:0;
      overflow:hidden;
    }
    body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-calendar-pop input[type="date"]{
      width:100%;
      height:32px;
      min-height:32px;
      line-height:32px;
      padding:0 30px 0 10px;
      text-align:left;
      box-sizing:border-box;
    }
    body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-calendar-pop label:not(.has-date):before{
      left:10px;
      top:50%;
      transform:translateY(-50%);
      line-height:1;
      margin:0;
    }
    body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-calendar-pop input[type="date"]::-webkit-calendar-picker-indicator{
      position:absolute;
      right:9px;
      top:50%;
      width:15px;
      height:15px;
      margin:0;
      padding:0;
      transform:translateY(-50%);
      opacity:.72;
      cursor:pointer;
    }

/* Keep the payment provider label and transaction number aligned as one stable metadata row. */
body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal.is-payment-mode .front-pay-record-meta{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  column-gap:8px;
  align-items:center;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal.is-payment-mode .front-pay-record-meta b{
  min-width:0;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 8px;
  line-height:20px;
}
body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal.is-payment-mode .front-pay-record-meta code{
  width:100%;
  min-width:0;
  height:22px;
  display:block;
  box-sizing:border-box;
  padding:0 7px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  border-radius:5px;
  background:rgba(18,22,29,.58);
  color:#a8a9ae;
  -webkit-text-fill-color:#a8a9ae;
  font-size:12px;
  font-weight:500;
  line-height:20px;
  text-overflow:ellipsis;
  white-space:nowrap;
  vertical-align:middle;
}
@media(max-width:560px){
  body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal.is-payment-mode .front-pay-record-meta{grid-template-columns:max-content minmax(0,1fr);column-gap:6px}
  body:not(.page-admin) .front-resource-layer[data-resource-dialog="credits"] .front-ledger-modal.is-payment-mode .front-pay-record-meta code{font-size:11px}
}

html body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .recharge-v2-main{
  gap:0;
}

html body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  gap:0;
  grid-template-rows:72px minmax(0,1fr);
}

html body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider > span{
  color:inherit;
  -webkit-text-fill-color:currentColor;
}

html body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list time{
  color:#949494;
}

html:not([data-theme="dark"]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-main{
  color:#0f172a;
}

html:not([data-theme="dark"]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online input[type="radio"]{
  background-color:#f8fafc;
}

@media (min-width:761px){
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main{
    display:grid;
    height:100vh;
    overflow:hidden;
    background:#f7f8fb;
    color:#0f172a;
    -webkit-text-fill-color:currentColor;
    grid-template-rows:72px minmax(0,1fr);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main :is(.recharge-v2-section,.recharge-v2-section-head,.recharge-v2-package-grid,.recharge-v2-checkout,.recharge-v2-payment,.recharge-v2-pay-grid,.recharge-v2-action,.recharge-v2-action>div){
    color:#0f172a;
    -webkit-text-fill-color:#0f172a;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main input[type=radio],
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout input[type=radio],
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-checkout input[type=radio]{
    background-color:#f8fafc;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled{
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
    color:#fff;
    -webkit-text-fill-color:#fff;
    opacity:.5;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled .recharge-v2-icon,
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled .recharge-v2-icon *{
    color:#fff;
    -webkit-text-fill-color:#fff;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-aside img{
    display:inline;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-section-head h3,
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-aside-title h3{
    margin-block:1em;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) :is(.member-shop-mobile-note,.member-shop-aside-title p,.member-shop-aside>p.member-shop-aside-note){
    margin-block:1em;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-plan{
    border:0;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-checkout .recharge-v2-action>button,
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>button:not(:disabled){
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) #frontRedeemCode{
    border-radius:8px;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) .redeem-reference-submit{
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider>span{
    color:#64748b;
    -webkit-text-fill-color:#64748b;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main{
    display:grid;
    overflow:hidden;
    color:#f2f2f2;
    -webkit-text-fill-color:currentColor;
    grid-template-rows:72px minmax(0,1fr);
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-section,
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-section>.recharge-v2-section-head,
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-section :is(.recharge-v2-package-grid,.recharge-v2-custom,.recharge-v2-custom-copy),
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-checkout{
    color:#f2f2f2;
    -webkit-text-fill-color:currentColor;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled{
    border-color:#2563eb;
    opacity:.5;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-aside img{
    display:inline;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-record-list time{
    color:#949494;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-section-head h3,
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-aside-title h3{
    margin-block:1em;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) :is(.member-shop-mobile-note,.member-shop-aside-title p,.member-shop-aside>p.member-shop-aside-note){
    margin-block:1em;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-plan{
    border:0;
    background:transparent;
    color:#fff;
    -webkit-text-fill-color:currentColor;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-plan *{
    -webkit-text-fill-color:currentColor;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .member-shop-checkout .recharge-v2-action>button{
    border-color:#2563eb;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-checkout .recharge-v2-action>button{
    background:linear-gradient(135deg,#2563eb,#06b6d4) #2563eb;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) #frontRedeemCode{
    border-radius:8px;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) .redeem-reference-submit{
    background:linear-gradient(135deg,#2563eb,#06b6d4) #2563eb;
    border-color:#2563eb;
    box-shadow:0 12px 26px rgba(37,99,235,.24);
  }
}

@media (max-width:760px), (max-height:680px){
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main{
    color:#f2f2f2;
    -webkit-text-fill-color:currentColor;
    grid-template-rows:72px minmax(0,1fr);
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-section,
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-section>.recharge-v2-section-head,
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-section :is(.recharge-v2-package-grid,.recharge-v2-custom,.recharge-v2-custom-copy),
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main>.recharge-v2-checkout{
    color:#f2f2f2;
    -webkit-text-fill-color:currentColor;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-custom-input>input{
    height:44px;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled{
    border-color:#2563eb;
    opacity:.5;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-aside img{
    display:inline;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-record-list time{
    color:#949494;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-section-head h3,
  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-aside-title h3{
    margin-block:1em;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) :is(.member-shop-mobile-note,.member-shop-aside-title p,.member-shop-aside>p.member-shop-aside-note){
    margin-block:1em;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-plan{
    border:0;
    background:transparent;
    color:#fff;
    -webkit-text-fill-color:currentColor;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-plan *{
    -webkit-text-fill-color:currentColor;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service .member-shop-checkout .recharge-v2-action>button{
    border-color:#2563eb;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-checkout .recharge-v2-action>button{
    background:linear-gradient(135deg,#2563eb,#06b6d4) #2563eb;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) #frontRedeemCode{
    height:44px;
    border-radius:14px;
  }

  html[data-theme=dark] body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) .redeem-reference-submit{
    background:linear-gradient(135deg,#2563eb,#06b6d4) #2563eb;
    border-color:#2563eb;
    box-shadow:0 12px 26px rgba(37,99,235,.24);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main{
    background:#f7f8fb;
    color:#0f172a;
    -webkit-text-fill-color:#0f172a;
    grid-template-rows:72px minmax(0,1fr);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main :is(.recharge-v2-section,.recharge-v2-section-head,.recharge-v2-package-grid,.recharge-v2-checkout,.recharge-v2-payment,.recharge-v2-pay-grid,.recharge-v2-action,.recharge-v2-action>div){
    color:#0f172a;
    -webkit-text-fill-color:#0f172a;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-custom-input>input{
    height:44px;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main input[type=radio],
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout input[type=radio]{
    background-color:#f8fafc;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled{
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
    color:#fff;
    -webkit-text-fill-color:#fff;
    opacity:.5;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled .recharge-v2-icon,
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-main .recharge-v2-action>button:disabled .recharge-v2-icon *{
    color:#fff;
    -webkit-text-fill-color:#fff;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-online) .recharge-v2-aside img{
    display:inline;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-section-head h3,
  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-aside-title h3{
    margin-block:1em;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) :is(.member-shop-mobile-note,.member-shop-aside-title p,.member-shop-aside>p.member-shop-aside-note){
    margin-block:1em;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-plan{
    border:0;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-checkout input[type=radio]{
    background-color:#f8fafc;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-membership) .member-shop-checkout .recharge-v2-action>button{
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) #frontRedeemCode{
    height:44px;
    border-radius:14px;
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service:not(.is-redeem) .redeem-reference-submit{
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-membership .member-shop-checkout .recharge-v2-action>button:not(:disabled){
    background:#2563eb;
    border-color:#2563eb;
    box-shadow:0 8px 22px rgba(37,99,235,.2);
  }

  :is(html.jn-light-mode,html[data-theme=light]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-account-service.is-redeem .redeem-reference-divider>span{
    color:#64748b;
    -webkit-text-fill-color:#64748b;
  }
}

html:not([data-theme="dark"]) body:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal.is-online .recharge-v2-record-list time{
  color:#64748b;
}

html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service{
  position:relative;
  width:min(1180px,calc(100vw - 36px));
  height:min(840px,calc(100dvh - 36px));
  max-height:calc(100dvh - 36px);
}

@media (max-width:760px){
  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-layer:has(#frontRechargeModal.is-account-service){
    box-sizing:border-box;
    padding-right:calc(8px + var(--jn-compat-safe-right,0px));
    padding-bottom:calc(8px + var(--jn-compat-safe-bottom,0px));
    padding-left:calc(8px + var(--jn-compat-safe-left,0px));
    overflow:hidden;
    touch-action:auto;
  }

  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service{
    display:flex;
    flex-direction:column;
    width:100%;
    max-width:100%;
    height:var(--recharge-modal-available-height,calc(100dvh - 16px));
    max-height:var(--recharge-modal-available-height,calc(100dvh - 16px));
    min-height:0;
    border-radius:14px;
    overflow:hidden;
  }

  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service .recharge-v2-shell{
    display:flex;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }

  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service .recharge-v2-scroll{
    display:block;
    flex:1 1 auto;
    min-height:0;
    max-height:none;
    height:auto;
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    scrollbar-width:none;
    -ms-overflow-style:none;
    touch-action:pan-y;
  }

  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service .recharge-v2-scroll::-webkit-scrollbar{
    width:0;
    height:0;
    display:none;
  }

  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service .recharge-v2-scroll :is(.recharge-v2-pane,.recharge-v2-content-grid,.recharge-v2-main){
    height:auto;
    min-height:0;
    max-height:none;
    overflow:visible;
  }

  html body[class^="page-"]:not(.page-admin) [data-front-app-public-root] .recharge-v2-modal#frontRechargeModal.is-account-service .recharge-v2-pane{
    padding-bottom:calc(24px + var(--jn-compat-safe-bottom,0px));
  }
}

body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer]{
  --front-composer-panel:#242424;
  --front-composer-line:#3a3a3a;
  --front-composer-control:rgba(255,255,255,.055);
  --front-composer-control-line:rgba(255,255,255,.12);
  --front-composer-text:#f6f7fb;
  --front-composer-muted:#9ca3af;
  --front-composer-accent:#ffaf3f;
  --front-composer-width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  position:fixed;
  left:var(--front-menu-offset,0px);
  right:0;
  bottom:var(--front-composer-keyboard-offset,0px);
  z-index:70;
  width:calc(100vw - var(--front-menu-offset,0px));
  max-width:calc(100vw - var(--front-menu-offset,0px));
  margin:0;
  padding:0 clamp(18px,3vw,38px) max(14px,env(safe-area-inset-bottom,0px));
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  background:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  transform:none;
  overflow:visible;
  pointer-events:none;
  box-sizing:border-box;
}

html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer],
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode [data-front-creative-composer],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] [data-front-creative-composer]{
  --front-composer-panel:rgba(246,248,252,.76);
  --front-composer-line:rgba(15,23,42,.12);
  --front-composer-control:rgba(255,255,255,.34);
  --front-composer-control-line:rgba(15,23,42,.12);
  --front-composer-text:#0f172a;
  --front-composer-muted:#64748b;
  --front-composer-accent:#92400e;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] *,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] *::before,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] *::after{
  box-sizing:border-box;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame *,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame *::before,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame *::after{
  box-sizing:border-box;
  transition:none;
  animation:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame{
  --front-creation-guide-safe:312px;
  --front-creation-guide-icon-color:#f8fafc;
  --front-creation-guide-text-color:#e4e4e7;
  --front-creation-guide-panel:rgba(31,34,40,.74);
  --front-creation-guide-panel-image:linear-gradient(135deg,rgba(46,51,61,.82),rgba(28,31,38,.70));
  --front-creation-guide-line:rgba(255,255,255,.12);
  --front-creation-guide-shadow:0 18px 46px rgba(12,16,24,.20),inset 0 1px 0 rgba(255,255,255,.07);
  width:min(985px,calc(100% - 32px));
  max-width:min(985px,calc(100% - 32px));
  min-height:calc(100dvh - var(--front-creation-guide-safe) - 84px);
  margin:0 auto;
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  text-align:center;
  background:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  transform:translateY(-18px);
  overflow:visible;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame[hidden],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame.hidden{
  display:none;
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame,
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode .front-creation-guide-frame,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] .front-creation-guide-frame{
  --front-creation-guide-icon-color:#2563eb;
  --front-creation-guide-text-color:#475569;
  --front-creation-guide-panel:#fff;
  --front-creation-guide-panel-image:none;
  --front-creation-guide-line:rgba(15,23,42,.10);
  --front-creation-guide-shadow:0 12px 28px rgba(15,23,42,.07);
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon]{
  width:84px;
  height:84px;
  min-width:84px;
  min-height:84px;
  max-width:84px;
  max-height:84px;
  flex:0 0 84px;
  display:grid;
  place-items:center;
  padding:0;
  margin:0;
  overflow:visible;
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  border-radius:0;
  box-shadow:none;
  filter:none;
  opacity:1;
  transform:none;
  color:var(--front-creation-guide-icon-color);
  -webkit-text-fill-color:var(--front-creation-guide-icon-color);
  contain:layout paint;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon]::before,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon]::after{
  content:none;
  display:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon] svg,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon] img{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  max-width:100%;
  max-height:100%;
  display:block;
  object-fit:contain;
  object-position:center center;
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  border-radius:0;
  box-shadow:none;
  filter:none;
  opacity:1;
  transform:none;
  mix-blend-mode:normal;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon] svg *{
  stroke:currentColor;
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon] img.is-light-monochrome-icon,
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon] img.is-light-monochrome-icon,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode .front-creation-guide-icon[data-creation-guide-icon] img.is-light-monochrome-icon,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] .front-creation-guide-icon[data-creation-guide-icon] img.is-light-monochrome-icon{
  filter:brightness(0) saturate(100%);
  opacity:.82;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-card[data-creation-guide]{
  width:min(560px,100%);
  max-width:min(560px,100%);
  min-height:91px;
  margin:0;
  padding:18px 22px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--front-creation-guide-line);
  border-radius:16px;
  background:var(--front-creation-guide-panel);
  background-image:var(--front-creation-guide-panel-image);
  color:var(--front-creation-guide-text-color);
  -webkit-text-fill-color:var(--front-creation-guide-text-color);
  font-size:var(--creation-guide-font-size,15px);
  font-weight:500;
  line-height:1.75;
  text-align:center;
  white-space:pre-line;
  overflow-wrap:anywhere;
  box-shadow:var(--front-creation-guide-shadow);
  filter:none;
  opacity:1;
  transform:none;
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-card[data-creation-guide],
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-card[data-creation-guide],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode .front-creation-guide-card[data-creation-guide],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] .front-creation-guide-card[data-creation-guide]{
  background:var(--front-creation-guide-panel);
  background-image:var(--front-creation-guide-panel-image);
  border-color:var(--front-creation-guide-line);
  color:var(--front-creation-guide-text-color);
  -webkit-text-fill-color:var(--front-creation-guide-text-color);
  box-shadow:var(--front-creation-guide-shadow);
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon],
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode .front-creation-guide-icon[data-creation-guide-icon],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] .front-creation-guide-icon[data-creation-guide-icon]{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:transparent;
  color:var(--front-creation-guide-icon-color);
  -webkit-text-fill-color:var(--front-creation-guide-icon-color);
  box-shadow:none;
  filter:none;
}
@media(max-width:760px){
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-frame{
    --front-creation-guide-safe:322px;
    width:min(100%,calc(100vw - 20px));
    max-width:calc(100vw - 20px);
    min-height:calc(100dvh - var(--front-creation-guide-safe) - 72px);
    gap:12px;
    transform:translateY(-12px);
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-icon[data-creation-guide-icon]{
    width:64px;
    height:64px;
    min-width:64px;
    min-height:64px;
    max-width:64px;
    max-height:64px;
    flex-basis:64px;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page .front-creation-guide-card[data-creation-guide]{
    width:min(560px,100%);
    max-width:100%;
    min-height:104px;
    padding:14px 15px;
    border-radius:14px;
    font-size:var(--creation-guide-font-size,13px);
    line-height:1.65;
  }
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-tools{
  position:absolute;
  left:clamp(18px,3vw,38px);
  right:auto;
  top:var(--lz-creative-composer-tools-offset);
  width:var(--front-composer-width);
  max-width:var(--front-composer-width);
  height:34px;
  min-height:34px;
  max-height:34px;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  background:transparent;
  border:0;
  box-shadow:none;
  transform:none;
  overflow:visible;
  pointer-events:auto;
  z-index:6;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-queue-slot{
  min-width:0;
  max-width:min(520px,calc(100vw - 220px));
  flex:1 1 auto;
  margin-right:auto;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-queue-slot[hidden]{
  display:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-inner{
  position:relative;
  width:var(--front-composer-width);
  max-width:var(--front-composer-width);
  min-width:0;
  flex:0 0 var(--front-composer-width);
  height:208px;
  min-height:208px;
  max-height:208px;
  margin:0 auto;
  padding:22px 72px 80px 146px;
  display:block;
  border:1px solid var(--front-composer-line);
  border-radius:18px;
  background:var(--front-composer-panel);
  background-image:none;
  color:var(--front-composer-text);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(22px) saturate(132%);
  -webkit-backdrop-filter:blur(22px) saturate(132%);
  transform:none;
  overflow:visible;
  pointer-events:auto;
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-inner,
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-inner,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode [data-front-creative-composer] .front-creative-composer-inner,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] [data-front-creative-composer] .front-creative-composer-inner{
  box-shadow:0 14px 34px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.42);
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-inner::before,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-inner::after,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-video-composer-frame::before,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-video-composer-frame::after{
  content:none;
  display:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-left{
  position:absolute;
  left:22px;
  top:22px;
  width:92px;
  min-width:92px;
  max-width:92px;
  height:116px;
  min-height:116px;
  max-height:116px;
  margin:0;
  padding:0;
  display:block;
  overflow:visible;
  pointer-events:auto;
  z-index:4;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-main{
  position:relative;
  inset:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:none;
  display:block;
  overflow:visible;
  z-index:1;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-side{
  position:absolute;
  right:18px;
  bottom:18px;
  width:46px;
  min-width:46px;
  max-width:46px;
  height:46px;
  min-height:46px;
  max-height:46px;
  margin:0;
  padding:0;
  display:grid;
  place-items:center;
  overflow:visible;
  pointer-events:auto;
  z-index:16;
}
body.page-app.front-creative-page [data-front-creative-composer] .front-creative-image-prompt,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-panel,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-wrap{
  position:relative;
  inset:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:none;
  margin:0;
  padding:0;
  display:block;
  border:0;
  border-radius:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
  overflow:visible;
}
body.page-app.front-creative-page [data-front-creative-composer] #aiDrawPrompt,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-wrap textarea{
  position:relative;
  inset:auto;
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:none;
  margin:0;
  padding:0 4px;
  border:0;
  outline:0;
  border-radius:0;
  background:transparent;
  background-image:none;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  resize:none;
  font:14px/1.55 inherit;
  box-shadow:none;
  overflow:auto;
  overflow-x:hidden;
  scrollbar-width:none;
  appearance:none;
}
body.page-app.front-creative-page [data-front-creative-composer] #aiDrawPrompt::-webkit-scrollbar,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-wrap textarea::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
body.page-app.front-creative-page [data-front-creative-composer] #aiDrawPrompt::placeholder,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-wrap textarea::placeholder{
  color:var(--front-composer-muted);
  -webkit-text-fill-color:var(--front-composer-muted);
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-inner-controls,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-controls{
  position:absolute;
  left:146px;
  right:72px;
  bottom:22px;
  top:auto;
  width:auto;
  max-width:none;
  min-width:0;
  height:36px;
  min-height:36px;
  max-height:36px;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:visible;
  scrollbar-width:none;
  pointer-events:auto;
  z-index:14;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-inner-controls::-webkit-scrollbar,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-controls::-webkit-scrollbar,
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-selects::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-selects{
  width:100%;
  max-width:100%;
  min-width:0;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:visible;
  scrollbar-width:none;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-select,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control{
  position:relative;
  flex:0 0 auto;
  width:auto;
  min-width:74px;
  max-width:128px;
  height:34px;
  min-height:34px;
  max-height:34px;
  margin:0;
  padding:0;
  display:inline-flex;
  align-items:center;
  color:var(--front-composer-text);
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-model-select,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control.is-model{
  min-width:118px;
  max-width:min(236px,calc(100vw - 44px));
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-select>button,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control{
  border:1px solid var(--lz-front-billing-border);
  border-radius:12px;
  background:var(--lz-front-billing-surface);
  background-image:none;
  box-shadow:none;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-select>button,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control select{
  height:34px;
  min-height:34px;
  max-height:34px;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  padding:0 24px 0 9px;
  display:flex;
  align-items:center;
  gap:6px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--lz-front-billing-text);
  -webkit-text-fill-color:var(--lz-front-billing-text);
  font:12px/1 inherit;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  appearance:none;
  cursor:pointer;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control svg,
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-select>button svg{
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control::after{
  content:"";
  position:absolute;
  right:9px;
  top:50%;
  width:6px;
  height:6px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:translateY(-65%) rotate(45deg);
  opacity:.75;
  pointer-events:none;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options{
  position:absolute;
  left:0;
  right:auto;
  bottom:44px;
  top:auto;
  z-index:170;
  display:none;
  min-width:112px;
  max-width:min(240px,calc(100vw - 24px));
  max-height:min(336px,calc(100dvh - 48px));
  overflow:auto;
  padding:8px;
  border:1px solid var(--front-composer-control-line);
  border-radius:14px;
  background:var(--front-composer-panel);
  color:var(--front-composer-text);
  box-shadow:0 18px 48px rgba(0,0,0,.35);
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-select.is-open .ai-draw-options{
  display:grid;
  gap:6px;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button{
  width:100%;
  height:32px;
  min-height:32px;
  padding:0 10px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--front-composer-text);
  font:13px/1 inherit;
  text-align:left;
  white-space:nowrap;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button:hover,
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button.is-selected{
  background:rgba(255,255,255,.08);
}
html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button:hover,
html.jn-light-mode body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button.is-selected,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button:hover,
html[data-theme="light"] body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-options button.is-selected,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer] .ai-draw-options button:hover,
body.page-app.front-creative-page.jn-light-mode [data-front-creative-composer] .ai-draw-options button.is-selected{
  background:#eef2f7;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frames{
  position:absolute;
  left:0;
  top:0;
  width:92px;
  min-width:92px;
  max-width:92px;
  height:116px;
  min-height:116px;
  max-height:116px;
  margin:0;
  padding:0;
  display:block;
  transform:none;
  overflow:visible;
  pointer-events:auto;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card input[type="file"]{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card{
  position:absolute;
  inset:0;
  width:92px;
  min-width:92px;
  max-width:92px;
  height:116px;
  min-height:116px;
  max-height:116px;
  margin:0;
  padding:0;
  border:1px dashed var(--front-composer-control-line);
  border-radius:14px;
  background:var(--front-composer-control);
  background-image:none;
  color:var(--front-composer-muted);
  box-shadow:none;
  overflow:hidden;
  transform:none;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-pick{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:0;
  background:transparent;
  color:var(--front-composer-muted);
  font:12px/1.2 inherit;
  font-weight:900;
  text-align:center;
  cursor:pointer;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-plus,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-plus{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:var(--front-composer-text);
  font-size:18px;
  line-height:1;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:inherit;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card img{
  display:none;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card.has-image img{
  display:block;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card.has-image .ai-video-frame-pick{
  opacity:0;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-asset,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-scan{
  position:absolute;
  bottom:6px;
  z-index:8;
  width:24px;
  min-width:24px;
  height:24px;
  min-height:24px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid var(--front-composer-control-line);
  border-radius:8px;
  background:rgba(0,0,0,.44);
  color:#fff;
  box-shadow:none;
  cursor:pointer;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-asset{
  left:6px;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-scan{
  right:6px;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-asset svg,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-scan svg{
  width:14px;
  height:14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
}
body.page-app.front-creative-page [data-front-creative-composer] [data-reference-clear],
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-remove{
  position:absolute;
  right:6px;
  top:6px;
  z-index:9;
  width:22px;
  min-width:22px;
  height:22px;
  min-height:22px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(0,0,0,.62);
  color:#fff;
  display:none;
  place-items:center;
  cursor:pointer;
}
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card.has-image .ai-video-frame-remove{
  display:grid;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send-group,
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-side,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-send{
  position:static;
  inset:auto;
  width:46px;
  min-width:46px;
  max-width:46px;
  height:46px;
  min-height:46px;
  max-height:46px;
  margin:0;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:14px;
  transform:none;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-send{
  border:1px solid var(--front-composer-control-line);
  background:var(--front-composer-control);
  background-image:none;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  box-shadow:none;
  cursor:pointer;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send:not(.has-prompt),
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send.is-empty,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-send:not(.has-prompt),
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-send.is-empty,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-send:disabled{
  color:var(--front-composer-muted);
  -webkit-text-fill-color:var(--front-composer-muted);
  opacity:1;
}
body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send svg,
body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-send svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-prompt-panel,
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-prompt-wrap{
  position:relative;
  inset:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:none;
  margin:0;
  padding:0;
  display:block;
  border:0;
  border-radius:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
  overflow:visible;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-input{
  position:relative;
  inset:auto;
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:none;
  margin:0;
  padding:0 4px;
  border:0;
  outline:0;
  border-radius:0;
  background:transparent;
  background-color:transparent;
  background-image:none;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  resize:none;
  font:14px/1.55 inherit;
  box-shadow:none;
  overflow:auto;
  overflow-x:hidden;
  scrollbar-width:none;
  appearance:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-input::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-input::placeholder{
  color:var(--front-composer-muted);
  -webkit-text-fill-color:var(--front-composer-muted);
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls{
  position:absolute;
  left:146px;
  right:72px;
  bottom:22px;
  top:auto;
  width:auto;
  max-width:none;
  min-width:0;
  height:36px;
  min-height:36px;
  max-height:36px;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:visible;
  scrollbar-width:none;
  pointer-events:auto;
  z-index:14;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .ai-video-control{
  position:relative;
  flex:0 0 auto;
  width:max-content;
  min-width:118px;
  max-width:min(236px,calc(100vw - 44px));
  height:34px;
  min-height:34px;
  max-height:34px;
  margin:0;
  padding:0;
  display:inline-flex;
  align-items:center;
  border:0;
  border-radius:12px;
  background:transparent;
  background-color:transparent;
  background-image:none;
  color:var(--front-composer-text);
  box-shadow:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .front-param-trigger{
  position:relative;
  inset:auto;
  width:max-content;
  height:100%;
  min-height:100%;
  max-height:100%;
  min-width:118px;
  max-width:min(236px,calc(100vw - 44px));
  margin:0;
  padding:0 28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  border:1px solid var(--front-composer-control-line);
  border-radius:12px;
  background:var(--front-composer-control);
  background-color:var(--front-composer-control);
  background-image:none;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  box-shadow:none;
  cursor:pointer;
  font:12px/1 inherit;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .front-param-trigger svg{
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .front-param-trigger [data-select-value]{
  min-width:0;
  width:auto;
  max-width:174px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:inherit;
  -webkit-text-fill-color:inherit;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .ai-video-control select{
  height:34px;
  min-height:34px;
  max-height:34px;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  padding:0 24px 0 9px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  font:12px/1 inherit;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  appearance:none;
  cursor:pointer;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .ai-video-control::after{
  content:"";
  position:absolute;
  right:9px;
  top:50%;
  width:6px;
  height:6px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:translateY(-65%) rotate(45deg);
  opacity:.75;
  pointer-events:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send-side,
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send{
  position:static;
  inset:auto;
  width:46px;
  min-width:46px;
  max-width:46px;
  height:46px;
  min-height:46px;
  max-height:46px;
  margin:0;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:14px;
  transform:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send{
  border:1px solid var(--front-composer-control-line);
  background:var(--front-composer-control);
  background-image:none;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  box-shadow:none;
  cursor:pointer;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send:not(.has-prompt),
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send.is-empty{
  color:var(--front-composer-muted);
  -webkit-text-fill-color:var(--front-composer-muted);
  opacity:.58;
  border-color:var(--front-composer-control-line);
  background:var(--front-composer-control);
  box-shadow:none;
}
html.jn-light-mode body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send:not(.has-prompt),
html[data-theme="light"] body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send:not(.has-prompt),
body.page-chat.front-creative-page.jn-light-mode [data-front-creative-composer="chat"] .front-chat-send:not(.has-prompt),
body.page-chat.front-creative-page[data-theme="light"] [data-front-creative-composer="chat"] .front-chat-send:not(.has-prompt),
html.jn-light-mode body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send.is-empty,
html[data-theme="light"] body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send.is-empty,
body.page-chat.front-creative-page.jn-light-mode [data-front-creative-composer="chat"] .front-chat-send.is-empty,
body.page-chat.front-creative-page[data-theme="light"] [data-front-creative-composer="chat"] .front-chat-send.is-empty{
  border-color:rgba(15,23,42,.12);
  background:#f8fafc;
  background-image:none;
  color:#64748b;
  -webkit-text-fill-color:#64748b;
  box-shadow:none;
  opacity:.72;
}
body.page-chat.front-creative-page:not(.jn-light-mode):not([data-theme="light"]) [data-front-creative-composer="chat"] .front-chat-send:not(.has-prompt),
body.page-chat.front-creative-page:not(.jn-light-mode):not([data-theme="light"]) [data-front-creative-composer="chat"] .front-chat-send.is-empty{
  border-color:rgba(255,255,255,.14);
  background:#2f3033;
  background-image:none;
  color:#9ca3af;
  -webkit-text-fill-color:#9ca3af;
  box-shadow:none;
  opacity:.68;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send.has-prompt{
  color:#fff;
  -webkit-text-fill-color:#fff;
  opacity:1;
  border-color:rgba(37,99,235,.72);
  background:#2563eb;
  background-image:none;
  box-shadow:0 12px 26px rgba(37,99,235,.26);
}
html.jn-light-mode body.page-chat.front-creative-page:not(.page-admin):not(#frontChatSendFixA):not(#frontChatSendFixB):not(#frontChatSendFixC):not(#frontChatSendFixD):not(#frontChatSendFixE):not(#frontChatSendFixF) [data-front-creative-composer="chat"] .front-chat-send.has-prompt,
html[data-theme="light"] body.page-chat.front-creative-page:not(.page-admin):not(#frontChatSendFixA):not(#frontChatSendFixB):not(#frontChatSendFixC):not(#frontChatSendFixD):not(#frontChatSendFixE):not(#frontChatSendFixF) [data-front-creative-composer="chat"] .front-chat-send.has-prompt,
body.page-chat.front-creative-page.jn-light-mode:not(.page-admin):not(#frontChatSendFixA):not(#frontChatSendFixB):not(#frontChatSendFixC):not(#frontChatSendFixD):not(#frontChatSendFixE):not(#frontChatSendFixF) [data-front-creative-composer="chat"] .front-chat-send.has-prompt,
body.page-chat.front-creative-page:not(.page-admin):not(#frontChatSendFixA):not(#frontChatSendFixB):not(#frontChatSendFixC):not(#frontChatSendFixD):not(#frontChatSendFixE):not(#frontChatSendFixF) [data-front-creative-composer="chat"] .front-chat-send.has-prompt{
  color:#fff;
  -webkit-text-fill-color:#fff;
  opacity:1;
  border-color:rgba(37,99,235,.72);
  background:#2563eb;
  background-image:none;
  box-shadow:0 12px 26px rgba(37,99,235,.26);
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-input-frame{
  padding:22px 22px 64px 22px;
}
html body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page:not(.page-admin) [data-front-creative-composer] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.ai-video-prompt-wrap,.front-chat-input,.oc-chat-input,.ai-video-prompt-wrap textarea),
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page:not(.page-admin) [data-front-creative-composer] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.ai-video-prompt-wrap,.front-chat-input,.oc-chat-input,.ai-video-prompt-wrap textarea),
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page:not(.page-admin) [data-front-creative-composer] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.ai-video-prompt-wrap,.front-chat-input,.oc-chat-input,.ai-video-prompt-wrap textarea),
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.ai-video-prompt-wrap,.front-chat-input,.oc-chat-input,.ai-video-prompt-wrap textarea),
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"]:not(.page-admin) [data-front-creative-composer] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.ai-video-prompt-wrap,.front-chat-input,.oc-chat-input,.ai-video-prompt-wrap textarea){
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:transparent;
  box-shadow:none;
  text-shadow:none;
}
html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input,
html.jn-light-mode body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input,
html[data-theme="light"] body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input,
body.page-chat.front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input,
body.page-chat.front-creative-page[data-theme="light"]:not(.page-admin) [data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
  color:var(--front-composer-text);
  -webkit-text-fill-color:var(--front-composer-text);
  appearance:none;
  -webkit-appearance:none;
}
html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
html.jn-light-mode body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
html[data-theme="light"] body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
body.page-chat.front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
body.page-chat.front-creative-page[data-theme="light"]:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control{
  background:var(--lz-front-billing-surface);
  background-color:var(--lz-front-billing-surface);
  background-image:none;
  border:1px solid var(--lz-front-billing-border);
  box-shadow:none;
  color:var(--lz-front-billing-text);
  -webkit-text-fill-color:var(--lz-front-billing-text);
}
html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] div.ai-video-prompt-wrap.front-chat-prompt-wrap,
html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input[data-chat-input],
html.jn-light-mode body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] div.ai-video-prompt-wrap.front-chat-prompt-wrap,
html.jn-light-mode body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input[data-chat-input],
html[data-theme="light"] body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] div.ai-video-prompt-wrap.front-chat-prompt-wrap,
html[data-theme="light"] body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input[data-chat-input],
body.page-chat.front-creative-page.has-front-creative-menu.jn-light-mode:not(.page-admin) section[data-front-creative-composer="chat"] div.ai-video-prompt-wrap.front-chat-prompt-wrap,
body.page-chat.front-creative-page.has-front-creative-menu.jn-light-mode:not(.page-admin) section[data-front-creative-composer="chat"] textarea.front-chat-input.oc-chat-input[data-chat-input]{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border-color:transparent;
  box-shadow:none;
}
html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] div.front-model-select.ai-video-control::after,
html.jn-light-mode body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] div.front-model-select.ai-video-control::after,
html[data-theme="light"] body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) section[data-front-creative-composer="chat"] div.front-model-select.ai-video-control::after,
body.page-chat.front-creative-page.has-front-creative-menu.jn-light-mode:not(.page-admin) section[data-front-creative-composer="chat"] div.front-model-select.ai-video-control::after{
  content:none;
  display:none;
  border:0;
}
html.jn-light-mode body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.front-chat-input),
html[data-theme="light"] body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.front-chat-input),
body.page-chat.front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer="chat"] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.front-chat-input),
body.page-chat.front-creative-page[data-theme="light"]:not(.page-admin) [data-front-creative-composer="chat"] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.front-chat-input),
body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] :is(.front-chat-prompt-panel,.front-chat-prompt-wrap,.front-chat-input){
  background:transparent;
  background-color:transparent;
  background-image:none;
  box-shadow:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls{
  left:22px;
  right:auto;
  bottom:-44px;
  width:auto;
  max-width:calc(100% - 116px);
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-upload{
  position:relative;
  flex:0 0 auto;
  width:92px;
  min-width:92px;
  max-width:92px;
  height:34px;
  min-height:34px;
  max-height:34px;
  margin:0;
  padding:0 11px;
  display:inline-flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(148,163,184,.26);
  border-radius:13px;
  background:#f8fafc;
  background-image:none;
  color:#475569;
  -webkit-text-fill-color:#475569;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  cursor:pointer;
  font-size:13px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  writing-mode:horizontal-tb;
  text-orientation:mixed;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-upload svg{
  width:16px;
  height:16px;
  flex:0 0 16px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-upload span{
  width:auto;
  min-width:max-content;
  max-width:none;
  display:inline-block;
  flex:0 0 auto;
  color:inherit;
  -webkit-text-fill-color:inherit;
  font-size:13px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  writing-mode:horizontal-tb;
  text-orientation:mixed;
}
body.page-chat.front-creative-page:not(.jn-light-mode):not([data-theme="light"]) [data-front-creative-composer="chat"] .front-chat-upload{
  border-color:rgba(255,255,255,.14);
  background:#2f3033;
  color:#e5e7eb;
  -webkit-text-fill-color:#e5e7eb;
  box-shadow:none;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send-side,
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send{
  border-radius:999px;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-creative-composer-tools{
  left:auto;
  right:max(10px,calc((100% - var(--front-composer-width)) / 2));
  top:var(--lz-creative-composer-tools-offset);
  width:var(--front-composer-width);
  min-width:0;
  max-width:var(--front-composer-width);
  justify-content:flex-end;
  z-index:24;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-creative-billing-pill.ai-video-price-pill{
  width:auto;
  min-width:max-content;
  max-width:none;
  padding:0 14px;
  overflow:visible;
}
body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-creative-billing-pill.ai-video-price-pill span{
  overflow:visible;
  text-overflow:clip;
}
@media(max-width:860px){
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls{
    left:16px;
    right:auto;
    bottom:12px;
    width:auto;
    max-width:calc(100% - 78px);
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-upload{
    width:88px;
    min-width:88px;
    max-width:88px;
    height:32px;
    min-height:32px;
    max-height:32px;
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send-side,
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send{
    width:40px;
    min-width:40px;
    max-width:40px;
    height:40px;
    min-height:40px;
    max-height:40px;
    border-radius:999px;
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-creative-composer-tools{
    left:auto;
    right:max(10px,calc((100% - var(--front-composer-width)) / 2));
    top:calc((30px + var(--lz-creative-composer-tools-gap)) * -1);
    width:var(--front-composer-width);
    min-width:0;
    max-width:var(--front-composer-width);
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-queue-slot{
    max-width:calc(100vw - 172px);
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-creative-billing-pill.ai-video-price-pill{
    width:auto;
    min-width:max-content;
    max-width:none;
    padding:0 12px;
  }
}

html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page.is-empty-guide-active .ai-draw-conversation {
  overflow-y: hidden;
  overscroll-behavior-y: none;
}

html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page .front-creation-guide-frame.ai-draw-empty {
  height: max(220px, calc(100dvh - 288px));
  min-height: max(220px, calc(100dvh - 288px));
  max-height: max(220px, calc(100dvh - 288px));
  flex: 0 0 max(220px, calc(100dvh - 288px));
  transform: none;
}

/* Image workspace final parity: preserve the release page's inline authority layer. */
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"]{
  color:#f2f2f2;
  grid-template-rows:36px 86px 40px;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools{
  color:#f2f2f2;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools .front-creative-tool-chip.ai-video-clear-chip{
  justify-content:normal;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-tools .front-creative-tool-chip.ai-video-clear-chip>span{
  margin:0;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-billing-pill.ai-video-price-pill{
  width:auto;
  min-width:max-content;
  max-width:none;
  flex:0 0 auto;
  overflow:visible;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-billing-pill.ai-video-price-pill span{
  min-width:max-content;
  flex:0 0 auto;
  overflow:visible;
  text-overflow:clip;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
  width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  min-width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  max-width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  flex-basis:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  margin:0 auto;
  transform:none;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] #aiDrawPrompt{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;
  line-height:1.62;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .ai-draw-selects{
  height:34px;
  min-height:34px;
  max-height:34px;
  gap:6px;
  overflow-x:auto;
  overflow-y:hidden;
}
html body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-select.ai-draw-select{
  --draw-param-text:#e8edf7;
  --draw-param-muted:#9aa3b2;
  border-radius:0;
  color:var(--draw-param-text);
  z-index:75;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-param-trigger.ai-param-trigger{
  color:var(--draw-param-text);
  -webkit-text-fill-color:var(--draw-param-text);
}
body.page-app [data-front-creative-composer="image"] .front-chat-send-side,
body.page-app [data-front-creative-composer="image"] [data-ai-draw-send].front-chat-send{
  width:46px;
  min-width:46px;
  max-width:46px;
  height:46px;
  min-height:46px;
  max-height:46px;
  margin:0;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:999px;
  transform:none;
}
@media(max-width:860px){
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
    width:100%;
    min-width:0;
    max-width:100%;
    flex-basis:auto;
  }
  body.page-app [data-front-creative-composer="image"] .front-chat-send-side,
  body.page-app [data-front-creative-composer="image"] [data-ai-draw-send].front-chat-send{
    width:40px;
    min-width:40px;
    max-width:40px;
    height:40px;
    min-height:40px;
    max-height:40px;
  }
}

/* Image workspace keeps the source composer geometry instead of the shared chat/video inset layout. */
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-tools{
  left:50%;
  right:auto;
  width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  max-width:min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px));
  transform:translateX(-50%);
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-inner{
  --front-image-prompt-start-inset:112px;
  padding:22px 22px 64px;
  display:block;
  grid-template-columns:76px minmax(0,1fr) 218px;
  gap:8px;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-inner.is-reference-disabled{
  --front-image-prompt-start-inset:4px;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-main-image,
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-chat-prompt-panel.front-creative-image-prompt,
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-chat-prompt-wrap.front-creative-image-prompt{
  position:static;
  width:100%;
  max-width:100%;
  height:120px;
  min-height:0;
  max-height:none;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  background-color:transparent;
  background-image:none;
  box-shadow:none;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] #aiDrawPrompt{
  position:absolute;
  left:22px;
  right:22px;
  top:22px;
  bottom:64px;
  width:auto;
  max-width:none;
  height:auto;
  min-height:0;
  padding:0 4px 0 var(--front-image-prompt-start-inset);
  border:0;
  border-radius:0;
  background:transparent;
  background-color:transparent;
  background-image:none;
  box-shadow:none;
  box-sizing:border-box;
}
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .ai-draw-inner-controls{
  position:absolute;
  left:22px;
  right:76px;
  bottom:18px;
  width:auto;
  max-width:none;
  min-width:0;
  height:34px;
  min-height:34px;
  max-height:34px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible;
}
html body.page-app.front-creative-page:not(.page-admin) [data-front-creative-composer=image] .front-chat-prompt-wrap.front-creative-image-prompt,
html.jn-light-mode body.page-app.front-creative-page:not(.page-admin) [data-front-creative-composer=image] .front-chat-prompt-wrap.front-creative-image-prompt,
html[data-theme=light] body.page-app.front-creative-page:not(.page-admin) [data-front-creative-composer=image] .front-chat-prompt-wrap.front-creative-image-prompt,
body.page-app.front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer=image] .front-chat-prompt-wrap.front-creative-image-prompt{
  background:transparent;
  background-color:transparent;
  background-image:none;
  border:0;
  box-shadow:none;
}
@media(max-width:860px){
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-tools{
    width:100%;
    max-width:100%;
    margin-bottom:var(--lz-creative-composer-tools-gap);
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-inner{
    --front-image-prompt-start-inset:100px;
    padding:16px 12px 62px;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] #aiDrawPrompt{
    left:12px;
    right:12px;
    top:16px;
    bottom:62px;

  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .ai-draw-inner-controls{
    left:12px;
    right:72px;
    bottom:16px;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer=image] .front-creative-composer-side-image{
    right:14px;
    bottom:16px;
  }
}
body:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip,
body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill{
  height:34px;
  min-height:34px;
  max-height:34px;
  border:var(--lz-border-width) solid var(--lz-front-billing-border);
  background:var(--lz-front-billing-surface);
  background-image:none;
  box-shadow:none;
  color:rgba(246,247,251,.9);
  -webkit-text-fill-color:rgba(246,247,251,.9);
}
body:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip{
  width:32px;
  min-width:32px;
  max-width:32px;
  padding:0;
  border-radius:10px;
  display:grid;
  place-items:center;
}
body:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip span{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}
body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill{
  width:93px;
  min-width:93px;
  max-width:93px;
  padding:0 12px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  color:var(--lz-front-billing-text);
  -webkit-text-fill-color:var(--lz-front-billing-text);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
}
body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill svg{
  width:13px;
  height:13px;
  flex:0 0 13px;
  fill:currentColor;
  stroke:none;
}
html.jn-light-mode body:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip,
html[data-theme="light"] body:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip,
body.jn-light-mode:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip{
  background:#f8fafc;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill,
html[data-theme="light"] body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill,
body.jn-light-mode:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill{
  background:var(--lz-front-billing-surface);
  border-color:var(--lz-front-billing-border);
  color:var(--lz-front-billing-text);
  -webkit-text-fill-color:var(--lz-front-billing-text);
}
html.jn-light-mode body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill :is(svg,span),
html[data-theme="light"] body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill :is(svg,span),
body.jn-light-mode:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill :is(svg,span){
  color:var(--lz-front-billing-text);
  -webkit-text-fill-color:var(--lz-front-billing-text);
  fill:currentColor;
  stroke:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"]{
  --front-composer-collapsed-bottom:max(18px,env(safe-area-inset-bottom,0px));
  --front-composer-keyboard-size:54px;
  transition:height .3s cubic-bezier(.19,1,.22,1),min-height .3s cubic-bezier(.19,1,.22,1),max-height .3s cubic-bezier(.19,1,.22,1),background .24s ease,transform .22s ease,opacity .18s ease;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"] .front-creative-composer-tools,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"] .front-creative-composer-inner{
  translate:0 0;
  scale:1;
  opacity:1;
  transition:translate .28s cubic-bezier(.19,1,.22,1),scale .28s cubic-bezier(.19,1,.22,1),opacity .22s ease;
  will-change:translate,scale,opacity;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"].is-scroll-collapsed{
  pointer-events:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"].is-scroll-collapsed .front-creative-composer-tools,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"].is-scroll-collapsed .front-creative-composer-inner{
  translate:0 26px;
  scale:.985;
  opacity:0;
  pointer-events:none;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard]{
  position:fixed;
  left:calc(var(--front-menu-offset,0px) + (100vw - var(--front-menu-offset,0px) - var(--front-composer-keyboard-size,54px)) / 2);
  right:auto;
  bottom:var(--front-composer-collapsed-bottom,max(18px,env(safe-area-inset-bottom,0px)));
  z-index:90;
  width:var(--front-composer-keyboard-size,54px);
  min-width:var(--front-composer-keyboard-size,54px);
  max-width:var(--front-composer-keyboard-size,54px);
  height:var(--front-composer-keyboard-size,54px);
  min-height:var(--front-composer-keyboard-size,54px);
  max-height:var(--front-composer-keyboard-size,54px);
  padding:0;
  display:grid;
  place-items:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(31,34,41,.86);
  color:#f8fafc;
  box-shadow:0 18px 44px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  cursor:pointer;
  opacity:0;
  transform:translate3d(0,12px,0) scale(.92);
  pointer-events:none;
  transition:opacity .22s ease,transform .28s cubic-bezier(.19,1,.22,1),background .18s ease,border-color .18s ease;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard] svg{
  width:25px;
  height:25px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer].is-scroll-collapsed [data-front-composer-keyboard]{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  pointer-events:auto;
}
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard]:hover,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard]:focus-visible{
  background:rgba(42,46,55,.94);
  border-color:rgba(255,255,255,.22);
  outline:0;
  transform:translate3d(0,-1px,0) scale(1.02);
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard],
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode [data-front-composer-keyboard],
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] [data-front-composer-keyboard]{
  background:rgba(255,255,255,.84);
  color:#0f172a;
  border-color:rgba(15,23,42,.12);
  box-shadow:0 18px 42px rgba(15,23,42,.16),inset 0 1px 0 rgba(255,255,255,.72);
}
html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard]:hover,
html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard]:hover,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode [data-front-composer-keyboard]:hover,
body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] [data-front-composer-keyboard]:hover{
  background:rgba(248,250,252,.96);
  border-color:rgba(15,23,42,.18);
}
body.front-composer-scroll-collapsed.page-chat .oc-chat-canvas{
  scroll-padding-bottom:96px;
}
body.front-composer-scroll-collapsed.page-chat .oc-chat-bottom-spacer{
  flex-basis:96px;
  min-height:96px;
  height:96px;
}
body.front-composer-scroll-collapsed.page-app .ai-draw-conversation,
body.front-composer-scroll-collapsed.page-video .ai-video-stage{
  scroll-padding-bottom:96px;
}
@media(max-width:860px){
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page{
    --front-menu-offset:0px;
  }
  body.page-app.front-creative-page .ai-draw-conversation{
    padding:54px 18px var(--lz-creative-mobile-content-clearance);
    scroll-padding-bottom:var(--lz-creative-mobile-content-clearance);
  }
  body.page-video.front-creative-page .ai-video-stage{
    padding-bottom:var(--lz-creative-mobile-content-clearance);
    scroll-padding-bottom:var(--lz-creative-mobile-content-clearance);
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer]{
    left:0;
    right:0;
    width:100vw;
    max-width:100vw;
    height:calc(var(--lz-creative-mobile-composer-shell-height) + var(--lz-safe-bottom));
    min-height:calc(var(--lz-creative-mobile-composer-shell-height) + var(--lz-safe-bottom));
    max-height:calc(var(--lz-creative-mobile-composer-shell-height) + var(--lz-safe-bottom));
    padding:0 10px calc(10px + env(safe-area-inset-bottom,0px));
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:stretch;
    background:linear-gradient(180deg,rgba(var(--front-video-chat-bg-rgb,27,28,32),0),var(--front-video-chat-bg,#1b1c20) 34%,var(--front-video-chat-bg,#1b1c20) 100%);
    overflow:hidden;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"].is-scroll-collapsed{
    height:88px;
    min-height:88px;
    max-height:88px;
    background:transparent;
    overflow:visible;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-composer-keyboard]{
    --front-composer-keyboard-size:52px;
    left:calc((100vw - var(--front-composer-keyboard-size,52px)) / 2);
    bottom:max(16px,env(safe-area-inset-bottom,0px));
  }
  html.jn-light-mode body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer],
  html[data-theme="light"] body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer],
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page.jn-light-mode [data-front-creative-composer],
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page[data-theme="light"] [data-front-creative-composer]{
    background:linear-gradient(180deg,rgba(247,248,251,0),var(--front-video-chat-bg,#f7f8fb) 34%,var(--front-video-chat-bg,#f7f8fb) 100%);
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-tools{
    position:relative;
    inset:auto;
    left:auto;
    right:auto;
    top:auto;
    width:100%;
    max-width:100%;
    min-width:0;
    height:30px;
    min-height:30px;
    max-height:30px;
    margin:0 0 var(--lz-creative-composer-tools-gap);
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:6px;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-inner{
    width:min(100%,calc(100vw - 20px));
    max-width:calc(100vw - 20px);
    min-width:0;
    flex:0 0 190px;
    height:190px;
    min-height:190px;
    max-height:190px;
    margin:0;
    padding:12px 10px;
    display:grid;
    grid-template-columns:78px minmax(0,1fr);
    grid-template-rows:minmax(0,1fr) 40px;
    gap:8px 10px;
    align-content:stretch;
    border-radius:18px;
    overflow:hidden;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-left{
    position:relative;
    inset:auto;
    grid-column:1;
    grid-row:1;
    width:78px;
    min-width:78px;
    max-width:78px;
    height:100%;
    min-height:0;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-main{
    position:static;
    grid-column:2;
    grid-row:1;
    width:100%;
    max-width:100%;
    min-width:0;
    height:100%;
    min-height:0;
  }
  body.page-chat.front-creative-page [data-front-creative-composer=chat] .front-creative-composer-inner{
    grid-template-columns:minmax(0,1fr);
  }
  body.page-chat.front-creative-page [data-front-creative-composer=chat] .front-creative-composer-main{
    grid-column:1;
  }
  body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer] .front-creative-composer-side{
    position:absolute;
    right:10px;
    bottom:12px;
    width:40px;
    min-width:40px;
    max-width:40px;
    height:40px;
    min-height:40px;
    max-height:40px;
  }
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frames,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-frame-card{
    width:70px;
    min-width:70px;
    max-width:70px;
    height:88px;
    min-height:88px;
    max-height:88px;
  }
  body.page-app.front-creative-page [data-front-creative-composer] .front-creative-image-prompt,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-panel,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-wrap{
    position:static;
    height:100%;
  }
  body.page-app.front-creative-page [data-front-creative-composer] #aiDrawPrompt,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-prompt-wrap textarea{
    height:100%;
    min-height:0;
    max-height:none;
    padding:0 4px;
    font-size:14px;
    line-height:1.5;
  }
  body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-inner-controls,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-controls{
    left:10px;
    right:58px;
    bottom:12px;
    height:34px;
    min-height:34px;
    max-height:34px;
    gap:6px;
  }
  body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-selects{
    height:34px;
    gap:6px;
  }
  body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-select,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control{
    min-width:74px;
    max-width:128px;
    height:34px;
  }
  body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-model-select,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-control.is-model{
    min-width:118px;
    max-width:148px;
  }
  body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send-group,
  body.page-app.front-creative-page [data-front-creative-composer] .ai-draw-send,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-side,
  body:is(.page-video,.page-audio).front-creative-page [data-front-creative-composer] .ai-video-send{
    width:40px;
    min-width:40px;
    max-width:40px;
    height:40px;
    min-height:40px;
    max-height:40px;
    border-radius:14px;
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-prompt-panel,
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-prompt-wrap{
    position:static;
    height:100%;
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-input{
    height:100%;
    min-height:0;
    max-height:none;
    padding:0 4px;
    font-size:14px;
    line-height:1.5;
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls{
    left:10px;
    right:auto;
    bottom:12px;
    width:auto;
    max-width:calc(100% - 76px);
    height:34px;
    min-height:34px;
    max-height:34px;
    gap:6px;
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-controls .ai-video-control{
    min-width:118px;
    max-width:min(236px,calc(100vw - 44px));
  }
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send-side,
  body.page-chat.front-creative-page [data-front-creative-composer="chat"] .front-chat-send{
    width:40px;
    min-width:40px;
    max-width:40px;
    height:40px;
    min-height:40px;
    max-height:40px;
  }
  body:not(.page-admin) .front-creative-billing-pill.ai-video-price-pill{
    width:83px;
    min-width:83px;
    max-width:83px;
    height:30px;
    min-height:30px;
    max-height:30px;
    padding:0 9px;
  }
  body:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip{
    height:30px;
    min-height:30px;
    max-height:30px;
  }
}

@media(min-width:861px){
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
    margin-left:calc((100% - min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px))) / 2);
    margin-right:calc((100% - min(980px,calc(100vw - var(--front-menu-offset,0px) - 24px))) / 2);
  }
}
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-chat-prompt-panel.front-creative-image-prompt,
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-chat-prompt-wrap.front-creative-image-prompt{
  border-color:transparent;
}
body.page-app.front-creative-page [data-front-creative-composer="image"] [data-front-video-composer-frame].is-reference-disabled .front-creative-composer-left-image{
  display:none;
}

html.jn-light-mode body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
html[data-theme="light"] body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
body.page-chat.front-creative-page.jn-light-mode:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control,
body.page-chat.front-creative-page[data-theme="light"]:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control{
  background:var(--lz-front-billing-surface);
  background-color:var(--lz-front-billing-surface);
  color:var(--lz-front-billing-text);
  -webkit-text-fill-color:var(--lz-front-billing-text);
}

@media(max-width:860px){
  html body.front-creative-page:not(.front-creative-menu-expanded):not(.page-admin) .front-creative-menu :is(.front-creative-nav,.front-creative-account){
    display:none;
    visibility:hidden;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-creative-composer-inner{
    display:grid;
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] [data-front-video-composer-frame].is-reference-disabled{
    grid-template-columns:minmax(0,1fr);
  }
  html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] [data-front-video-composer-frame].is-reference-disabled .front-creative-composer-main-image{
    grid-column:1;
  }
  html body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-stream{
    background:#1b1c20;
  }
  html:is(.jn-light-mode,[data-theme="light"]) body.page-video.front-creative-page:not(.page-admin) #mainArea .ai-video-page .ai-video-stream,
  body.page-video.front-creative-page.jn-light-mode:not(.page-admin) #mainArea .ai-video-page .ai-video-stream,
  body.page-video.front-creative-page[data-theme="light"]:not(.page-admin) #mainArea .ai-video-page .ai-video-stream{
    background:#f4f6fa;
  }
  html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] [data-clear-chat] span{
    display:block;
  }
  html body.page-chat.front-creative-page:not(.page-admin) [data-chat-stream]{
    width:auto;
    margin-left:8px;
    margin-right:8px;
    margin-top:8px;
  }
  html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer="chat"] .front-chat-controls div.front-model-select.ai-video-control{
    width:139px;
    min-width:139px;
    max-width:139px;
  }
}

body:is(.page-chat,.page-app,.page-video,.page-audio).front-creative-page [data-front-creative-composer].is-ime-open{
  transition:none;
}

html:has(> body.page-chat){ margin:0; overflow:hidden; }
body.page-chat{ margin:0; overflow:hidden; background:var(--front-video-chat-bg,#1b1c20); }

.oc-chat-page,
.oc-chat-page *{ box-sizing:border-box; }
.oc-chat-page{ --bg:var(--front-video-chat-bg,#1b1c20); --panel:var(--front-video-chat-bg,#1b1c20); --line:rgba(255,255,255,.10); --muted:#8a8a93; --text:#f4f4f5; --yellow:#eab308; --blue:#2563eb; position:relative; inset:auto; z-index:0; width:100%; height:100dvh; min-height:100dvh; background:var(--bg); color:var(--text); font-family:inherit; overflow:hidden; }
.oc-chat-main{ position:absolute; inset:0; display:flex; flex-direction:column; background:var(--bg); }
.oc-chat-canvas{ flex:1; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; padding:54px 18px 0; background:var(--bg); scroll-behavior:smooth; }
.oc-chat-top-left,
.oc-chat-top-left{ left:14px; }
.oc-chat-icon-btn{ width:42px; height:42px; border-radius:999px; border:1px solid rgba(255,255,255,.16); background:var(--front-video-chat-bg,#1b1c20); color:#fff; display:grid; place-items:center; cursor:pointer; box-shadow:0 14px 34px rgba(0,0,0,.24); transition:transform .15s ease,border-color .15s ease,background .15s ease; }
.oc-chat-icon-btn:hover{ transform:translateY(-1px); border-color:rgba(255,255,255,.26); background:rgba(31,34,40,.88); }
.oc-chat-icon-btn svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; }

.oc-chat-history-zone{ position:absolute; left:20px; top:27px; z-index:95; width:358px; max-width:calc(100% - 40px); pointer-events:none; }
.oc-chat-history-zone.is-history-open{ pointer-events:auto; }
.oc-chat-history-actions{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; pointer-events:auto; }
.oc-chat-history-top{ display:flex; align-items:center; gap:10px; }
.oc-chat-new-btn,
.oc-chat-history-toggle{ height:36px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 18px; font-size:14px; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease; }
.oc-chat-new-btn{ border:1px solid rgba(255,209,31,.9); background:linear-gradient(180deg,#ffc52b,#f5a400); color:#070707; box-shadow:0 10px 26px rgba(245,164,0,.22),inset 0 1px 0 rgba(255,255,255,.28); }
.oc-chat-new-btn:hover,
.oc-chat-history-toggle:hover{ transform:translateY(-1px); }
.oc-chat-new-btn svg,
.oc-chat-history-toggle svg{ width:16px; height:16px; flex:none; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.oc-chat-history-toggle{ border:1px solid var(--oc-history-active-border,rgba(56,189,248,.52)); background:var(--oc-history-active,rgba(56,189,248,.13)); color:var(--oc-history-accent,#38bdf8); padding:0 15px; box-shadow:0 10px 24px rgba(0,0,0,.16); }
.oc-chat-history-toggle.is-open{ background:var(--oc-history-active,rgba(56,189,248,.13)); border-color:var(--oc-history-active-border,rgba(56,189,248,.52)); }
.oc-chat-history-toggle .chevron{ width:12px; height:12px; transition:transform .16s ease; stroke-width:2.8; }
.oc-chat-history-toggle.is-open .chevron{ transform:rotate(180deg); }
.oc-chat-history-panel{ width:358px; max-width:100%; min-height:205px; margin-top:7px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background:#18191f; color:#f6f7fb; box-shadow:0 20px 54px rgba(0,0,0,.35); padding:14px; opacity:0; transform:translateY(-5px); pointer-events:none; visibility:hidden; overflow:visible; transition:opacity .16s ease,transform .16s ease,visibility .16s ease; }
.oc-chat-history-panel.is-open{ opacity:1; transform:translateY(0); pointer-events:auto; visibility:visible; }
.oc-chat-history-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; position:relative; z-index:2; }
.oc-chat-history-title{ margin:0; font-size:14px; line-height:1.2; color:var(--oc-history-text,#eef2f7); font-weight:1000; }
.oc-chat-history-close{width:28px;height:28px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:#111217;color:#d4d4d8;display:grid;place-items:center;cursor:pointer;font-size:18px;line-height:1}
.oc-chat-history-close:hover{border-color:var(--oc-history-active-border,rgba(56,189,248,.52));color:var(--oc-history-text,#eef2f7)}
.oc-chat-history-search{ position:relative; z-index:2; height:34px; border:1px solid rgba(255,255,255,.08); border-radius:9px; background:#111217; display:flex; align-items:center; gap:8px; padding:0 10px; margin-bottom:10px; color:#747b89; }
.oc-chat-history-search svg{ width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.oc-chat-history-search input{ display:block; width:100%; min-width:0; height:32px; min-height:0; max-height:32px; line-height:32px; border:0; outline:0; outline-offset:0; background:transparent; box-shadow:none; color:#e5e7eb; padding:0; margin:0; font-size:12px; transition:border-color .15s cubic-bezier(.16,1,.3,1),box-shadow .15s cubic-bezier(.16,1,.3,1); }
body.page-chat:not(.page-admin) .oc-chat-page .oc-chat-history-panel .oc-chat-history-search input[type="search"][data-history-search]:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]){ background:transparent; background-color:transparent; background-image:none; box-shadow:none; appearance:none; -webkit-appearance:none; }
.oc-chat-history-search input::placeholder{ color:#71717a; }
.oc-chat-history-meta{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 8px; color:#fff; font-size:12px; font-weight:800; }
.oc-chat-history-count{ color:#e5e7eb; font-weight:900; white-space:nowrap; }
.oc-chat-history-bulk{display:flex;align-items:center;gap:8px;margin:0 0 10px}
.oc-chat-history-bulk button{height:28px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:#111217;color:#d4d4d8;padding:0 9px;font-size:12px;font-weight:900;cursor:pointer}
.oc-chat-history-bulk button:hover{border-color:var(--oc-history-active-border,rgba(56,189,248,.52));color:var(--oc-history-text,#eef2f7)}
.oc-chat-history-bulk button:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}
.oc-chat-history-bulk button[data-history-bulk-delete]{color:#fecaca;border-color:rgba(248,113,113,.20)}
.oc-chat-history-list{ max-height:220px; overflow:auto; display:grid; gap:7px; padding-right:2px; }
.oc-chat-history-list::-webkit-scrollbar{ width:5px; }
.oc-chat-history-list::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.16); border-radius:999px; }
.oc-chat-history-item{ width:100%; min-height:48px; border:1px solid rgba(255,255,255,.08); border-radius:9px; background:#14151a; color:#f4f4f5; display:grid; grid-template-columns:22px minmax(0,1fr) 28px; gap:8px; align-items:center; text-align:left; padding:9px 10px; cursor:pointer; }
.oc-chat-history-item:hover{ border-color:var(--oc-history-active-border,rgba(56,189,248,.52)); background:var(--oc-history-item-hover,#1c212b); }
.oc-chat-history-item.is-active{ border-color:var(--oc-history-active-border,rgba(56,189,248,.52)); background:var(--oc-history-active,rgba(56,189,248,.13)); box-shadow:inset 3px 0 0 var(--oc-history-accent,#38bdf8); }
.oc-chat-history-item.is-selected{ border-color:rgba(34,211,238,.54); background:rgba(34,211,238,.10); box-shadow:inset 3px 0 0 #22d3ee; }
.oc-chat-history-item.is-draft{ border-style:dashed; }
.oc-chat-history-check{width:16px;height:16px;accent-color:var(--oc-history-accent,#38bdf8)}
.oc-chat-history-item-copy{min-width:0;display:grid;gap:4px}
.oc-chat-history-item-title{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#f8fafc; font-size:13px; font-weight:900; line-height:1.2; }
.oc-chat-history-item-meta{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#8f96a6; font-size:11px; line-height:1.2; }
.oc-chat-history-delete{width:28px;height:28px;border:0;border-radius:8px;background:transparent;color:#8f96a6;display:grid;place-items:center;cursor:pointer;font-size:17px}
.oc-chat-history-delete:hover{background:rgba(248,113,113,.12);color:#fecaca}
.oc-chat-history-empty{ height:68px; display:grid; place-items:center; color:#71717a; font-size:13px; }
.oc-chat-history-empty[hidden]{ display:none; }
html body.page-chat:not(#ocChatToneA):not(#ocChatToneB) .oc-chat-new-btn{ border:1px solid rgba(255,209,31,.9); background:linear-gradient(180deg,#ffc52b,#f5a400); color:#070707; box-shadow:0 10px 26px rgba(245,164,0,.22),inset 0 1px 0 rgba(255,255,255,.28); }
html body.page-chat:not(#ocChatToneA):not(#ocChatToneB) .oc-chat-history-toggle{ border:1px solid var(--oc-history-active-border,rgba(56,189,248,.52)); background:var(--oc-history-active,rgba(56,189,248,.13)); color:var(--oc-history-accent,#38bdf8); box-shadow:0 10px 24px rgba(0,0,0,.16); }
html body.page-chat:not(#ocChatToneA):not(#ocChatToneB) .oc-chat-history-toggle.is-open{ background:var(--oc-history-active,rgba(56,189,248,.13)); border-color:var(--oc-history-active-border,rgba(56,189,248,.52)); }
html body.page-chat:not(#ocChatToneA):not(#ocChatToneB) .oc-chat-history-title{ color:var(--oc-history-text,#eef2f7); -webkit-text-fill-color:var(--oc-history-text,#eef2f7); }
.oc-chat-welcome{ min-height:calc(100vh - var(--composer-safe, 190px) - 84px); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; transform:translateY(-18px); }
body.page-chat.front-creative-page .oc-chat-welcome.is-hidden,
body.page-chat.front-creative-page.jn-chat-history-booting .oc-chat-welcome{ display:none; }
body.page-chat.jn-chat-history-booting .oc-chat-stream:empty{
  min-height:calc(100vh - var(--composer-safe, 190px) - 170px);
  justify-content:flex-start;
  padding-top:120px;
}
.oc-chat-logo{ width:84px; height:84px; color:#fff; filter:drop-shadow(0 20px 45px rgba(255,255,255,.08)); }
.oc-chat-logo svg{ width:100%; height:100%; }
.oc-chat-logo[data-creation-guide-icon]{color:var(--creation-guide-accent,#fff)}
.oc-chat-logo.is-text-icon{display:grid;place-items:center;font-size:52px;line-height:1}
.oc-chat-logo.is-image-icon img{width:100%;height:100%;display:block;object-fit:contain;border-radius:18px}
.oc-chat-intro{ width:min(560px,100%); border:1px solid var(--line); border-radius:16px; padding:18px 22px; background:var(--front-creation-guide-panel,var(--bg)); background-image:var(--front-creation-guide-panel-image,none); color:var(--front-creation-guide-text-color,#e4e4e7); line-height:1.75; box-shadow:var(--front-creation-guide-shadow,0 18px 50px rgba(12,16,24,.22)); }
.oc-chat-intro[data-creation-guide]{background:var(--front-creation-guide-panel,rgba(31,34,40,.74));background-image:var(--front-creation-guide-panel-image,linear-gradient(135deg,rgba(46,51,61,.82),rgba(28,31,38,.70)));border-color:var(--front-creation-guide-line,rgba(255,255,255,.12));color:var(--front-creation-guide-text-color,var(--creation-guide-content,#e4e4e7));-webkit-text-fill-color:var(--front-creation-guide-text-color,var(--creation-guide-content,#e4e4e7));box-shadow:var(--front-creation-guide-shadow,0 18px 46px rgba(12,16,24,.20));font-size:var(--creation-guide-font-size,15px)}
.oc-chat-stream{ width:min(820px,100%); margin:0 auto; display:flex; flex-direction:column; gap:18px; padding-top:4px; }
.oc-chat-message{ display:flex; gap:12px; align-items:flex-start; animation:ocMsg .2s ease both; }
.oc-chat-message.is-restored{ animation:none; }
@keyframes ocMsg { from { opacity:0; transform:translateY(8px); } }
.oc-chat-message.is-user{ flex-direction:row-reverse; }
.oc-chat-avatar{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; color:#fff; font-size:12px; font-weight:900; border:1px solid var(--line); background:linear-gradient(135deg,#3b82f6,#8b5cf6); }
.oc-chat-message.is-assistant .oc-chat-avatar{ background:rgba(31,34,40,.74); background-image:linear-gradient(135deg,rgba(46,51,61,.86),rgba(28,31,38,.72)); }
.oc-chat-avatar svg{ width:18px; height:18px; }
.oc-chat-avatar img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.oc-chat-message.is-user .oc-chat-avatar{position:relative;overflow:visible;isolation:isolate;border:0;background:transparent;box-shadow:none}
html body.page-chat:not(#jnAvatarFrameGlobalA):not(#jnAvatarFrameGlobalB) .oc-chat-message.is-user .oc-chat-avatar,
body.page-chat:not(#jnAvatarFrameGlobalA):not(#jnAvatarFrameGlobalB) .oc-chat-message.is-user .oc-chat-avatar{--jn-avatar-frame-inset:-6px;--jn-avatar-core-inset:7px}
.oc-chat-message.is-user .oc-chat-avatar::before{content:"";position:absolute;inset:-7px;z-index:2;pointer-events:none;background:var(--jn-avatar-frame-image, url("/user/assets/avatar-frame-starry.png")) center / 100% 100% no-repeat;filter:drop-shadow(0 8px 14px rgba(65,96,255,.28))}
.oc-chat-message.is-user .oc-chat-avatar::after{content:"";position:absolute;inset:7px;z-index:-1;border-radius:50%;background:radial-gradient(circle at 50% 38%,rgba(130,191,255,.72),rgba(54,92,190,.88) 66%,rgba(18,25,76,.96) 100%)}
.oc-chat-message.is-user .oc-chat-avatar img{position:absolute;inset:8px;z-index:1;width:calc(100% - 16px);height:calc(100% - 16px);border-radius:50%;object-fit:cover}
.oc-chat-bubble{ max-width:min(680px,calc(100vw - 116px)); border:1px solid var(--line); border-radius:18px; background:var(--bg); color:#e5e7eb; padding:13px 15px; line-height:1.7; word-break:break-word; box-shadow:0 14px 34px rgba(0,0,0,.22); }
.oc-chat-message.is-user .oc-chat-bubble{ background:linear-gradient(180deg,#1e40af,#1d4ed8); border-color:rgba(96,165,250,.35); color:#fff; border-top-right-radius:8px; }
.oc-chat-message.is-assistant .oc-chat-bubble{ border-top-left-radius:8px; }
.oc-chat-meta{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:6px; color:#7c7c86; font-size:11px; font-weight:800; }
.oc-chat-meta-user{ display:inline-flex; align-items:center; gap:6px; }
.oc-chat-meta-user img{ width:18px; height:18px; border-radius:50%; object-fit:cover; border:1px solid rgba(255,255,255,.24); }
.oc-chat-meta-initial{ width:18px; height:18px; border-radius:50%; display:inline-grid; place-items:center; background:rgba(255,255,255,.18); color:#fff; font-size:10px; font-weight:900; font-style:normal; }
.oc-chat-message.is-user .oc-chat-meta{ color:rgba(255,255,255,.75); }
.oc-chat-pill{ height:23px; padding:0 8px; border-radius:999px; border:1px solid var(--line); display:inline-flex; align-items:center; color:#d4d4d8; background:rgba(31,34,40,.74); }
.oc-chat-content{ white-space:pre-wrap; }
.oc-chat-message.is-assistant .oc-chat-content{ max-height:none; overflow:visible; padding-right:0; scrollbar-width:auto; }
.oc-chat-message.is-assistant .oc-chat-content::-webkit-scrollbar{ width:6px; }
.oc-chat-message.is-assistant .oc-chat-content::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.20); border-radius:999px; }
.oc-chat-message.is-assistant .oc-chat-content::-webkit-scrollbar-track{ background:transparent; }
.oc-chat-usage{ margin-top:9px; padding-top:8px; border-top:1px solid rgba(255,255,255,.08); color:#8a8a93; font-size:11px; font-weight:800; display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; }
.oc-chat-usage strong{ color:#d4d4d8; font-weight:900; }
.oc-chat-copy{ margin-left:auto; height:23px; padding:0 8px; border-radius:999px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:#a1a1aa; font-size:11px; font-weight:900; cursor:pointer; }
.oc-chat-copy:hover{ color:#fff; border-color:rgba(255,255,255,.24); background:rgba(255,255,255,.08); }
.oc-chat-message.is-user .oc-chat-copy{ color:rgba(255,255,255,.78); border-color:rgba(255,255,255,.22); background:rgba(255,255,255,.10); }
.oc-chat-bottom-spacer{ flex:0 0 var(--composer-safe, 170px); pointer-events:none; }
.oc-chat-typing{ display:inline-flex; gap:2px; align-items:center; height:22px; color:#e5e7eb; -webkit-text-fill-color:#e5e7eb; font-size:14px; font-weight:800; }
.oc-chat-typing span{ display:inline-block; margin-right:2px; }
.oc-chat-typing i{ width:4px; height:4px; border-radius:50%; background:#facc15; animation:ocDot 1.1s ease-in-out infinite; }
.oc-chat-typing i:nth-child(2){ animation-delay:.15s; }
.oc-chat-typing i:nth-child(3){ animation-delay:.3s; }
html.jn-light-mode body.page-chat .oc-chat-typing,
body.page-chat.jn-light-mode .oc-chat-typing{color:#334155;-webkit-text-fill-color:#334155}
@keyframes ocDot { 0%,80%,100% { opacity:.35; transform:translateY(0); } 40% { opacity:1; transform:translateY(-4px); } }
.oc-chat-attachments{ display:none; gap:8px; flex-wrap:wrap; padding:0 2px 10px; }
.oc-chat-attachments.has-files{ display:flex; }
.oc-chat-file{ height:32px; max-width:180px; padding:0 9px; border-radius:9px; border:1px solid var(--line); background:var(--bg); color:#d4d4d8; display:flex; align-items:center; gap:7px; font-size:12px; }
.oc-chat-file.is-image{ height:48px; max-width:220px; padding:5px 8px 5px 5px; }
.oc-chat-file.is-image img{ width:36px; height:36px; flex:0 0 36px; display:block; object-fit:cover; border:1px solid var(--line); border-radius:7px; background:var(--panel); }
.oc-chat-file span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.oc-chat-file button{ border:0; background:transparent; color:#777781; cursor:pointer; font-size:16px; }
.oc-chat-message-images{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.oc-chat-message-image{ display:block; width:min(280px,100%); overflow:hidden; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.oc-chat-message-image img{ display:block; width:100%; max-height:360px; object-fit:contain; background:var(--panel); }
.oc-chat-note{ position:absolute; right:16px; top:-24px; color:#777781; font-size:12px; }
.oc-chat-native-select{ position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; z-index:4; }
.oc-chat-toast{ position:fixed; left:50%; bottom:126px; transform:translateX(-50%) translateY(10px); z-index:150; opacity:0; pointer-events:none; border:1px solid rgba(255,255,255,.12); border-radius:999px; background:rgba(31,34,40,.90); color:#eef2f7; padding:9px 14px; font-size:13px; box-shadow:0 18px 44px rgba(12,16,24,.30); backdrop-filter:blur(18px); transition:opacity .18s ease,transform .18s ease; }
.oc-chat-toast.is-show{ opacity:1; transform:translateX(-50%) translateY(0); }
html.jn-light-mode body.page-chat,
body.page-chat.jn-light-mode,
html.jn-light-mode .oc-chat-page,
body.jn-light-mode .oc-chat-page{background:var(--front-video-chat-bg,#f7f8fb);color:#0f172a}
html.jn-light-mode .oc-chat-main,
html.jn-light-mode .oc-chat-canvas,
body.jn-light-mode .oc-chat-main,
body.jn-light-mode .oc-chat-main,
body.jn-light-mode .oc-chat-canvas{background:var(--front-video-chat-bg,#f7f8fb);color:#0f172a}
html.jn-light-mode .oc-chat-history-panel,
html.jn-light-mode .oc-chat-bubble,
html.jn-light-mode .oc-chat-intro:not([data-creation-guide]),
body.jn-light-mode .oc-chat-history-panel,
body.jn-light-mode .oc-chat-bubble,
body.jn-light-mode .oc-chat-intro:not([data-creation-guide]){background:#fff;color:#0f172a;border-color:rgba(15,23,42,.12);box-shadow:0 16px 42px rgba(15,23,42,.10)}
html.jn-light-mode .oc-chat-history-search,
html.jn-light-mode .oc-chat-history-item,
html.jn-light-mode .oc-chat-file,
html.jn-light-mode .oc-chat-history-bulk button,
html.jn-light-mode .oc-chat-history-close,
body.jn-light-mode .oc-chat-history-search,
body.jn-light-mode .oc-chat-history-item,
body.jn-light-mode .oc-chat-file,
body.jn-light-mode .oc-chat-history-bulk button,
body.jn-light-mode .oc-chat-history-close{background:#f8fafc;color:#0f172a;border-color:rgba(15,23,42,.12);box-shadow:none}
html.jn-light-mode .oc-chat-history-title,
html.jn-light-mode .oc-chat-history-item-title,
html.jn-light-mode .oc-chat-content,
html.jn-light-mode .oc-chat-usage strong,
body.jn-light-mode .oc-chat-history-title,
body.jn-light-mode .oc-chat-history-item-title,
body.jn-light-mode .oc-chat-content,
body.jn-light-mode .oc-chat-usage strong{color:#0f172a}
html.jn-light-mode .oc-chat-history-item-meta,
html.jn-light-mode .oc-chat-history-count,
html.jn-light-mode .oc-chat-meta,
html.jn-light-mode .oc-chat-usage,
body.jn-light-mode .oc-chat-history-item-meta,
body.jn-light-mode .oc-chat-history-count,
body.jn-light-mode .oc-chat-meta,
body.jn-light-mode .oc-chat-usage{color:#64748b}
html.jn-light-mode .oc-chat-message.is-user .oc-chat-bubble,
body.jn-light-mode .oc-chat-message.is-user .oc-chat-bubble{background:#fff;background-image:none;color:#0f172a}
@media(min-width:901px){
.oc-chat-main{padding-left:0}.oc-chat-history-zone{left:20px}
}

@media (max-width: 900px) {
.oc-chat-history-zone{left:12px;top:56px;width:min(358px,calc(100vw - 24px));max-width:calc(100vw - 24px)}
}

@media (max-width: 760px) {
.oc-chat-canvas{ padding:54px 18px 0; }
    .oc-chat-icon-btn{ width:40px; height:40px; }
    .oc-chat-welcome{ min-height:calc(100dvh - var(--composer-safe, 150px) - 72px); gap:12px; transform:translateY(-12px); }
    .oc-chat-logo{ width:64px; height:64px; }
    .oc-chat-intro{ padding:14px 15px; font-size:13px; line-height:1.65; border-radius:14px; }
    .oc-chat-stream{ gap:14px; padding-top:2px; }
    .oc-chat-message{ gap:8px; }
    .oc-chat-avatar{ width:30px; height:30px; font-size:11px; }
    .oc-chat-bubble{ max-width:calc(100vw - 76px); padding:11px 12px; border-radius:15px; font-size:14px; line-height:1.65; }
    .oc-chat-message.is-assistant .oc-chat-content{ max-height:none; overflow:visible; }
    .oc-chat-meta{ gap:6px; font-size:10px; }
    .oc-chat-native-select{ display:block; }
    .oc-chat-history-zone{ left:12px; top:56px; width:min(332px,calc(100vw - 24px)); max-width:calc(100vw - 24px); }
    .oc-chat-history-panel{ width:100%; min-height:196px; padding:13px; }
    .oc-chat-history-list{ max-height:180px; }
    .oc-chat-new-btn{ height:34px; padding:0 14px; font-size:13px; }
    .oc-chat-history-toggle{ height:34px; padding:0 13px; font-size:13px; }
    .oc-chat-history-item{grid-template-columns:22px minmax(0,1fr) 28px}
}

html.jn-light-mode body.page-chat,
body.page-chat.jn-light-mode,
html.jn-light-mode body.page-chat .oc-chat-page,
body.page-chat.jn-light-mode .oc-chat-page,
html.jn-light-mode body.page-chat .oc-chat-main,
body.page-chat.jn-light-mode .oc-chat-main,
html.jn-light-mode body.page-chat .oc-chat-canvas,
body.page-chat.jn-light-mode .oc-chat-canvas{
  background:var(--front-video-chat-bg,#f7f8fb);
  color:#0f172a;
}
html.jn-light-mode body.page-chat .oc-chat-history-panel,
html.jn-light-mode body.page-chat .oc-chat-intro:not([data-creation-guide]),
html.jn-light-mode body.page-chat .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-history-panel,
body.page-chat.jn-light-mode .oc-chat-intro:not([data-creation-guide]),
body.page-chat.jn-light-mode .oc-chat-bubble{
  background:#fff;
  color:#0f172a;
  border-color:rgba(15,23,42,.12);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}
html.jn-light-mode body.page-chat .oc-chat-intro[data-creation-guide],
body.page-chat.jn-light-mode .oc-chat-intro[data-creation-guide]{
  background:var(--front-creation-guide-panel,#fff);
  background-image:var(--front-creation-guide-panel-image,none);
  border-color:var(--front-creation-guide-line,rgba(15,23,42,.10));
  color:var(--front-creation-guide-text-color,var(--creation-guide-content,#0f172a));
  -webkit-text-fill-color:var(--front-creation-guide-text-color,var(--creation-guide-content,#0f172a));
  box-shadow:var(--front-creation-guide-shadow,0 12px 28px rgba(15,23,42,.07));
  font-size:var(--creation-guide-font-size,15px);
}
html.jn-light-mode body.page-chat .oc-chat-history-item.is-active,
body.page-chat.jn-light-mode .oc-chat-history-item.is-active{
  background:var(--oc-history-active,#ecfeff);
  border-color:var(--oc-history-active-border,rgba(8,145,178,.38));
  box-shadow:inset 3px 0 0 var(--oc-history-accent,#0891b2);
}
html.jn-light-mode body.page-chat .oc-chat-history-item.is-selected,
body.page-chat.jn-light-mode .oc-chat-history-item.is-selected{
  background:var(--oc-history-active,#ecfeff);
  border-color:var(--oc-history-active-border,rgba(8,145,178,.38));
  box-shadow:inset 3px 0 0 var(--oc-history-accent,#0891b2);
}
html.jn-light-mode body.page-chat :is(.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong),
body.page-chat.jn-light-mode :is(.oc-chat-history-title,.oc-chat-history-item-title,.oc-chat-content,.oc-chat-usage strong){
  color:#0f172a;
}
html.jn-light-mode body.page-chat :is(.oc-chat-history-item-meta,.oc-chat-history-count,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-search input::placeholder),
body.page-chat.jn-light-mode :is(.oc-chat-history-item-meta,.oc-chat-history-count,.oc-chat-meta,.oc-chat-usage,.oc-chat-history-search input::placeholder){
  color:#64748b;
}
html.jn-light-mode body.page-chat .oc-chat-history-search input,
body.page-chat.jn-light-mode .oc-chat-history-search input{
  background:transparent;
  background-color:transparent;
  background-image:none;
  box-shadow:none;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
/* Shared chat history surface: one component skin, theme switches through variables only. */
body.page-chat{
  --oc-history-panel:rgba(31,34,40,.78);
  --oc-history-control:rgba(38,42,50,.62);
  --oc-history-item:rgba(36,40,48,.58);
  --oc-history-item-hover:rgba(46,52,64,.70);
  --oc-history-active:rgba(56,189,248,.13);
  --oc-history-active-border:rgba(56,189,248,.52);
  --oc-history-accent:#38bdf8;
  --oc-history-border:rgba(255,255,255,.12);
  --oc-history-text:#eef2f7;
  --oc-history-muted:#9aa4b2;
  --oc-history-danger:#fda4af;
  --oc-history-danger-bg:rgba(244,63,94,.14);
  --oc-history-shadow:0 20px 54px rgba(12,16,24,.28),inset 0 1px 0 rgba(255,255,255,.06);
}
html.jn-light-mode body.page-chat,
html[data-theme=light] body.page-chat,
html[data-theme="light"] body.page-chat .oc-chat-page,
body.page-chat.jn-light-mode{
  --oc-history-panel:#ffffff;
  --oc-history-control:#f8fafc;
  --oc-history-item:#f8fafc;
  --oc-history-item-hover:#f1f5f9;
  --oc-history-active:#ecfeff;
  --oc-history-active-border:rgba(8,145,178,.38);
  --oc-history-accent:#0891b2;
  --oc-history-border:rgba(15,23,42,.11);
  --oc-history-text:#0f172a;
  --oc-history-muted:#64748b;
  --oc-history-danger:#e11d48;
  --oc-history-danger-bg:#fff1f2;
  --oc-history-shadow:0 16px 38px rgba(15,23,42,.10);
}
body.page-chat:not(.page-admin) .oc-chat-history-panel{
  background:var(--oc-history-panel);
  border-color:var(--oc-history-border);
  color:var(--oc-history-text);
  box-shadow:var(--oc-history-shadow);
}
html.jn-light-mode body.page-chat .oc-chat-history-panel,
html[data-theme="light"] body.page-chat .oc-chat-history-panel,
body.page-chat.jn-light-mode .oc-chat-history-panel{
  background:var(--oc-history-panel);
  border-color:var(--oc-history-border);
  color:var(--oc-history-text);
  box-shadow:0 16px 38px rgba(15,23,42,.10);
}
body.page-chat .oc-chat-history-title,
body.page-chat .oc-chat-history-meta,
body.page-chat .oc-chat-history-item-title{
  color:var(--oc-history-text);
  -webkit-text-fill-color:var(--oc-history-text);
}
body.page-chat .oc-chat-history-count,
body.page-chat .oc-chat-history-item-meta,
body.page-chat .oc-chat-history-empty,
body.page-chat .oc-chat-history-search,
body.page-chat .oc-chat-history-search input::placeholder{
  color:var(--oc-history-muted);
  -webkit-text-fill-color:var(--oc-history-muted);
}
body.page-chat .oc-chat-history-search,
body.page-chat .oc-chat-history-bulk button,
body.page-chat .oc-chat-history-close{
  background:var(--oc-history-control);
  border-color:var(--oc-history-border);
  color:var(--oc-history-muted);
  -webkit-text-fill-color:var(--oc-history-muted);
  box-shadow:none;
}
body.page-chat .oc-chat-history-search input{
  color:var(--oc-history-text);
  -webkit-text-fill-color:var(--oc-history-text);
}
body.page-chat .oc-chat-history-bulk button:not(:disabled):hover,
body.page-chat .oc-chat-history-close:hover{
  background:var(--oc-history-item-hover);
  border-color:var(--oc-history-active-border);
  color:var(--oc-history-text);
  -webkit-text-fill-color:var(--oc-history-text);
}
body.page-chat .oc-chat-history-item{
  background:var(--oc-history-item);
  border-color:var(--oc-history-border);
  color:var(--oc-history-text);
  box-shadow:none;
}
body.page-chat .oc-chat-history-item:hover{
  background:var(--oc-history-item-hover);
  border-color:var(--oc-history-active-border);
}
body.page-chat .oc-chat-history-item.is-active,
body.page-chat .oc-chat-history-item.is-selected{
  background:var(--oc-history-active);
  border-color:var(--oc-history-active-border);
  box-shadow:inset 3px 0 0 var(--oc-history-accent);
}
body.page-chat .oc-chat-history-check{
  accent-color:var(--oc-history-accent);
}
body.page-chat .oc-chat-history-panel .oc-chat-history-delete{
  background:transparent;
  border:0;
  color:var(--oc-history-muted);
  -webkit-text-fill-color:var(--oc-history-muted);
  box-shadow:none;
}
body.page-chat .oc-chat-history-panel .oc-chat-history-delete:hover{
  background:var(--oc-history-danger-bg);
  color:var(--oc-history-danger);
  -webkit-text-fill-color:var(--oc-history-danger);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-user .oc-chat-bubble{
  background:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}

/* Chat message surface and instant history positioning. */
body.page-chat .oc-chat-canvas{
  scroll-behavior:auto;
}
body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{
  background:var(--front-video-chat-bg,#1b1c20);
  background-image:none;
  border:1px solid rgba(255,255,255,.10);
  color:#e5e7eb;
  -webkit-text-fill-color:#e5e7eb;
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}
body.page-chat .oc-chat-message.is-user .oc-chat-bubble{
  border-top-right-radius:8px;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{
  border-top-left-radius:8px;
}
body.page-chat .oc-chat-message.is-user .oc-chat-meta,
body.page-chat .oc-chat-message.is-user .oc-chat-content,
body.page-chat .oc-chat-message.is-user .oc-chat-copy{
  color:inherit;
  -webkit-text-fill-color:currentColor;
}
body.page-chat .oc-chat-message.is-user .oc-chat-meta,
body.page-chat .oc-chat-message.is-assistant .oc-chat-meta{
  color:#8a8a93;
  -webkit-text-fill-color:#8a8a93;
}
body.page-chat .oc-chat-message.is-user .oc-chat-copy,
body.page-chat .oc-chat-message.is-assistant .oc-chat-copy{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.10);
  color:#a1a1aa;
  -webkit-text-fill-color:#a1a1aa;
}
html.jn-light-mode body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-user .oc-chat-bubble{
  background:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-bubble{
  background:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-user .oc-chat-content,
body.page-chat.jn-light-mode .oc-chat-message.is-user .oc-chat-content{
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}

/* 2026-06-18: reserve enough room so chat replies never sit under the fixed composer. */
body.page-chat:not(#ocChatBottomSafeA):not(#ocChatBottomSafeB) .oc-chat-canvas{
  padding-bottom:0;
  scroll-padding-bottom:var(--composer-safe, 292px);
}
body.page-chat:not(#ocChatBottomSafeA):not(#ocChatBottomSafeB) .oc-chat-stream{
  padding-bottom:18px;
}
body.page-chat:not(#ocChatBottomSafeA):not(#ocChatBottomSafeB) .oc-chat-bottom-spacer{
  flex:0 0 var(--composer-safe, 292px);
  min-height:var(--composer-safe, 292px);
  height:var(--composer-safe, 292px);
}
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content{
  position:relative;
  max-height:260px;
  overflow:hidden;
  padding-bottom:18px;
}
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:62px;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(31,34,40,0),var(--oc-reply-surface,#1f2228) 78%);
}
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-expanded .oc-chat-content{
  max-height:none;
  overflow:visible;
  padding-bottom:0;
}
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-expanded .oc-chat-content::after{
  content:none;
  display:none;
}
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle{
  height:28px;
  min-width:72px;
  margin-top:10px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#d8dce6;
  -webkit-text-fill-color:#d8dce6;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle:hover{
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.10);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html.jn-light-mode body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after,
body.page-chat.jn-light-mode:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after{
  background:linear-gradient(180deg,rgba(255,255,255,0),var(--oc-reply-surface,#ffffff) 78%);
}
html.jn-light-mode body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle,
body.page-chat.jn-light-mode:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle{
  background:#f8fafc;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle:hover,
body.page-chat.jn-light-mode:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle:hover{
  background:#eef2f7;
  border-color:rgba(15,23,42,.18);
}

@media(max-width:760px) {
body.page-chat:not(#ocChatBottomSafeA):not(#ocChatBottomSafeB) .oc-chat-canvas{
    padding-bottom:0;
    scroll-padding-bottom:calc(var(--composer-safe, 300px) + env(safe-area-inset-bottom));
  }
  body.page-chat:not(#ocChatBottomSafeA):not(#ocChatBottomSafeB) .oc-chat-bottom-spacer{
    flex-basis:calc(var(--composer-safe, 300px) + env(safe-area-inset-bottom));
    min-height:calc(var(--composer-safe, 300px) + env(safe-area-inset-bottom));
    height:calc(var(--composer-safe, 300px) + env(safe-area-inset-bottom));
  }
  body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content{
    max-height:210px;
  }
}
body.page-chat .oc-chat-native-select{display:none;pointer-events:none;z-index:-1}
body.page-chat .oc-chat-toast{
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(31,34,40,.90);
  backdrop-filter:blur(18px);
  color:#eef2f7;
  box-shadow:0 18px 46px rgba(12,16,24,.30);
}
html.jn-light-mode body.page-chat .oc-chat-toast,
body.page-chat.jn-light-mode .oc-chat-toast{
  background:rgba(255,255,255,.86);
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  box-shadow:0 18px 48px rgba(15,23,42,.14);
}
/* Shared long-text collapse styling for chat replies; kept page-scoped for this migration stage. */
body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content{
  position:relative;
  max-height:260px;
  overflow:hidden;
  padding-bottom:18px;
}
body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:58px;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(31,34,40,0),var(--oc-reply-surface,#1f2228) 78%);
}
body.page-chat .oc-chat-message.is-assistant.is-expanded .oc-chat-content,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-expanded .oc-chat-content{
  max-height:none;
  overflow:visible;
  padding-bottom:0;
}
body.page-chat .oc-chat-message.is-assistant.is-expanded .oc-chat-content::after,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-expanded .oc-chat-content::after{
  content:none;
  display:none;
}
body.page-chat .oc-chat-fold-toggle,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:28px;
  min-width:68px;
  margin:10px 0 0;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#d8dce6;
  -webkit-text-fill-color:#d8dce6;
  font-size:12px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  position:relative;
  z-index:1;
}
html.jn-light-mode body.page-chat .oc-chat-fold-toggle,
body.page-chat.jn-light-mode .oc-chat-fold-toggle{
  background:rgba(248,250,252,.84);
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
@media(max-width:760px){
body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content{
    max-height:210px;
    padding-bottom:16px;
  }
  body.page-chat .oc-chat-fold-toggle,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-fold-toggle{
    height:30px;
    min-width:64px;
    margin-top:8px;
  }
}
@media(max-width:760px){
html body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-fold-toggle,
html body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-fold-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:76px;
    height:32px;
    margin:10px auto 4px;
    padding:0 14px;
    position:relative;
    z-index:12;
    border-radius:999px;
    line-height:1;
    white-space:nowrap;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  html body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-bubble{
    overflow:visible;
  }
}

/* /user/chat detail closeout: compact history actions. */
body.page-chat .oc-chat-history-top{gap:7px;}
body.page-chat .oc-chat-new-btn,
body.page-chat .oc-chat-history-toggle{height:32px;min-height:32px;padding:0 12px;gap:6px;border-radius:999px;font-size:12px;line-height:1;}
body.page-chat .oc-chat-new-btn svg,
body.page-chat .oc-chat-history-toggle svg{width:14px;height:14px;flex:0 0 14px;}
body.page-chat .oc-chat-history-toggle .chevron{width:10px;height:10px;}
@media(max-width:760px){
body.page-chat .oc-chat-history-zone{width:min(300px,calc(100vw - 24px));}
  body.page-chat .oc-chat-history-actions{gap:6px;}
  body.page-chat .oc-chat-new-btn,
body.page-chat .oc-chat-history-toggle{height:29px;min-height:29px;padding:0 9px;gap:5px;font-size:11px;}
  body.page-chat .oc-chat-new-btn svg,
body.page-chat .oc-chat-history-toggle svg{width:13px;height:13px;flex-basis:13px;}
  body.page-chat .oc-chat-history-toggle .chevron{width:9px;height:9px;}
}

/* chat history nowrap final */
body.page-chat .oc-chat-history-toggle,
body.page-chat .oc-chat-history-toggle span{
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;
  flex-wrap:nowrap;
}
body.page-chat .oc-chat-history-toggle{
  min-width:max-content;
}
@media(max-width:760px){
body.page-chat .oc-chat-history-toggle{padding-left:8px;padding-right:8px;}
  body.page-chat .oc-chat-history-toggle span{display:inline-block;}
}

/* 2026-07-10 assistant code blocks: collapsible code frame */
body.page-chat .oc-chat-content.has-code-blocks{white-space:normal}
body.page-chat .oc-chat-content.has-code-blocks .oc-chat-text-fragment{white-space:pre-wrap}
body.page-chat .oc-chat-content.has-user-file{white-space:normal}
body.page-chat .oc-chat-user-file-card{width:min(520px,100%);overflow:hidden;border:1px solid var(--oc-reply-border,rgba(255,255,255,.10));border-radius:12px;background:var(--oc-reply-surface,#1f2228);color:var(--oc-reply-text,#eef2f7);box-shadow:0 16px 36px rgba(2,6,23,.22),inset 0 1px 0 rgba(255,255,255,.04)}
body.page-chat .oc-chat-user-file-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 10px;border-bottom:1px solid var(--oc-reply-border,rgba(255,255,255,.10));background:var(--oc-reply-surface-soft,#252932)}
body.page-chat .oc-chat-user-file-meta{min-width:0;display:flex;align-items:center;gap:9px}
body.page-chat .oc-chat-user-file-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border-radius:10px;background:rgba(250,204,21,.14);color:#facc15;-webkit-text-fill-color:#facc15;font-weight:900;font-size:14px}
body.page-chat .oc-chat-user-file-name{display:block;max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;-webkit-text-fill-color:inherit;font-size:13px;font-weight:900;line-height:1.25}
body.page-chat .oc-chat-user-file-size{display:block;margin-top:3px;color:var(--oc-reply-muted,rgba(238,242,247,.66));-webkit-text-fill-color:var(--oc-reply-muted,rgba(238,242,247,.66));font-size:11px;font-weight:700;line-height:1.2}
body.page-chat .oc-chat-user-file-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}
body.page-chat .oc-chat-user-file-actions button{height:26px;min-height:26px;padding:0 9px;border:1px solid rgba(255,255,255,.10);border-radius:7px;background:rgba(255,255,255,.07);color:var(--oc-reply-text,#eef2f7);-webkit-text-fill-color:var(--oc-reply-text,#eef2f7);box-shadow:none;font-size:11px;font-weight:900;line-height:1;cursor:pointer;white-space:nowrap}
body.page-chat .oc-chat-user-file-actions button:hover{background:rgba(255,255,255,.12)}
body.page-chat .oc-chat-user-file-body{max-height:0;overflow:hidden;transition:max-height .22s ease;background:var(--oc-reply-surface,#1f2228)}
body.page-chat .oc-chat-user-file-card.is-expanded .oc-chat-user-file-body{max-height:min(54vh,520px);overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(250,204,21,.28) rgba(255,255,255,.05)}
body.page-chat .oc-chat-user-file-code{margin:0;padding:13px 14px 16px;color:var(--oc-reply-text,#eef2f7);-webkit-text-fill-color:var(--oc-reply-text,#eef2f7);font-family:Consolas,Menlo,Monaco,"Courier New",monospace;font-size:12px;font-weight:500;line-height:1.68;letter-spacing:0;white-space:pre;tab-size:2}
body.page-chat .oc-chat-user-file-code code{font:inherit;color:inherit;-webkit-text-fill-color:inherit;white-space:pre}
html.jn-light-mode body.page-chat .oc-chat-user-file-card,
html[data-theme="light"] body.page-chat .oc-chat-user-file-card,
body.page-chat.jn-light-mode .oc-chat-user-file-card{background:var(--oc-reply-surface,#ffffff);color:var(--oc-reply-text,#0f172a);border-color:var(--oc-reply-border,rgba(15,23,42,.10));box-shadow:0 14px 32px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.88)}
html.jn-light-mode body.page-chat .oc-chat-user-file-head,
html[data-theme="light"] body.page-chat .oc-chat-user-file-head,
body.page-chat.jn-light-mode .oc-chat-user-file-head{background:var(--oc-reply-surface-soft,#f6f8fb);border-bottom-color:var(--oc-reply-border,rgba(15,23,42,.10))}
html.jn-light-mode body.page-chat .oc-chat-user-file-body,
html[data-theme="light"] body.page-chat .oc-chat-user-file-body,
body.page-chat.jn-light-mode .oc-chat-user-file-body{background:var(--oc-reply-surface,#ffffff)}
html.jn-light-mode body.page-chat .oc-chat-user-file-size,
html[data-theme="light"] body.page-chat .oc-chat-user-file-size,
body.page-chat.jn-light-mode .oc-chat-user-file-size{color:var(--oc-reply-muted,#64748b);-webkit-text-fill-color:var(--oc-reply-muted,#64748b)}
html.jn-light-mode body.page-chat .oc-chat-user-file-actions button,
html[data-theme="light"] body.page-chat .oc-chat-user-file-actions button,
body.page-chat.jn-light-mode .oc-chat-user-file-actions button{background:rgba(15,23,42,.06);border-color:rgba(15,23,42,.10);color:#334155;-webkit-text-fill-color:#334155}
html.jn-light-mode body.page-chat .oc-chat-user-file-actions button:hover,
html[data-theme="light"] body.page-chat .oc-chat-user-file-actions button:hover,
body.page-chat.jn-light-mode .oc-chat-user-file-actions button:hover{background:rgba(15,23,42,.10)}
body.page-chat .oc-chat-message.is-user.is-collapsible .oc-chat-content{max-height:220px;overflow:hidden;position:relative}
body.page-chat .oc-chat-message.is-user.is-collapsible .oc-chat-content::after{content:"";position:absolute;left:0;right:0;bottom:0;height:76px;pointer-events:none;background:linear-gradient(180deg,rgba(31,34,40,0),var(--oc-reply-surface,#1f2228) 76%)}
body.page-chat .oc-chat-message.is-user.is-expanded .oc-chat-content{max-height:min(58vh,620px);overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(250,204,21,.30) rgba(255,255,255,.04)}
body.page-chat .oc-chat-message.is-user.is-expanded .oc-chat-content::after{content:none;display:none}
html.jn-light-mode body.page-chat .oc-chat-message.is-user.is-collapsible .oc-chat-content::after,
html[data-theme="light"] body.page-chat .oc-chat-message.is-user.is-collapsible .oc-chat-content::after,
body.page-chat.jn-light-mode .oc-chat-message.is-user.is-collapsible .oc-chat-content::after{background:linear-gradient(180deg,rgba(255,255,255,0),var(--oc-reply-surface,#ffffff) 76%)}
body.page-chat .oc-chat-code-frame{width:100%;min-width:0;margin:14px 0;overflow:hidden;border:1px solid var(--oc-reply-border,rgba(255,255,255,.10));border-radius:10px;background:var(--oc-reply-surface,#1f2228);color:var(--oc-reply-text,#eef2f7);box-shadow:0 18px 42px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04)}
body.page-chat .oc-chat-code-head{height:34px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 10px 0 12px;border-bottom:1px solid var(--oc-reply-border,rgba(255,255,255,.10));background:var(--oc-reply-surface-soft,#252932)}
body.page-chat .oc-chat-code-lang{max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#facc15;-webkit-text-fill-color:#facc15;font-family:Consolas,Menlo,Monaco,"Courier New",monospace;font-size:11px;font-weight:800;letter-spacing:0}
body.page-chat .oc-chat-code-copy{height:22px;padding:0 8px;border:0;border-radius:5px;background:rgba(255,255,255,.08);color:#d4d4d8;-webkit-text-fill-color:#d4d4d8;font-size:11px;font-weight:900;cursor:pointer}
body.page-chat .oc-chat-code-copy:hover{background:rgba(255,255,255,.13);color:#fff;-webkit-text-fill-color:#fff}
body.page-chat .oc-chat-code-body{position:relative;margin:0;max-height:250px;overflow:hidden;padding:15px 16px 22px;background:var(--oc-reply-surface,#1f2228);color:var(--oc-reply-text,#eef2f7);-webkit-text-fill-color:var(--oc-reply-text,#eef2f7);font-family:Consolas,Menlo,Monaco,"Courier New",monospace;font-size:12.5px;font-weight:500;line-height:1.72;letter-spacing:0;white-space:pre;tab-size:2}
body.page-chat .oc-chat-code-body code{display:block;min-width:max-content;color:inherit;-webkit-text-fill-color:inherit;font:inherit;white-space:pre}
body.page-chat .oc-chat-code-frame.is-expanded .oc-chat-code-body{max-height:min(72vh,720px);overflow:auto;padding-bottom:16px;scrollbar-width:thin;scrollbar-color:rgba(250,204,21,.30) rgba(255,255,255,.04)}
body.page-chat .oc-chat-code-frame.is-expanded .oc-chat-code-body::after{content:none;display:none}
html.jn-light-mode body.page-chat .oc-chat-code-frame,
body.page-chat.jn-light-mode .oc-chat-code-frame{border-color:var(--oc-reply-border,rgba(15,23,42,.10));background:var(--oc-reply-surface,#ffffff);color:var(--oc-reply-text,#0f172a);box-shadow:0 14px 34px rgba(15,23,42,.08),inset 0 1px 0 rgba(255,255,255,.88)}
html.jn-light-mode body.page-chat .oc-chat-code-head,
body.page-chat.jn-light-mode .oc-chat-code-head{background:var(--oc-reply-surface-soft,#f6f8fb);border-bottom-color:var(--oc-reply-border,rgba(15,23,42,.10))}
html.jn-light-mode body.page-chat .oc-chat-code-body,
body.page-chat.jn-light-mode .oc-chat-code-body{background:var(--oc-reply-surface,#ffffff);color:var(--oc-reply-text,#0f172a);-webkit-text-fill-color:var(--oc-reply-text,#0f172a)}
html.jn-light-mode body.page-chat .oc-chat-code-copy,
body.page-chat.jn-light-mode .oc-chat-code-copy{background:rgba(15,23,42,.08);color:#334155;-webkit-text-fill-color:#334155}
html body.page-chat.jn-chat-app-content-live .oc-chat-code-frame button.oc-chat-code-copy[data-copy-code]:not(#ocChatCodeBtnA):not(#ocChatCodeBtnB){height:22px;min-height:22px;padding:0 8px;border:0;border-radius:5px;background:rgba(255,255,255,.08);color:#d4d4d8;-webkit-text-fill-color:#d4d4d8;box-shadow:none;font-size:11px;font-weight:900;line-height:1}
html.jn-light-mode body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-code-frame button.oc-chat-code-copy[data-copy-code]:not(#ocChatCodeBtnA):not(#ocChatCodeBtnB){background:rgba(15,23,42,.07);color:#475569;-webkit-text-fill-color:#475569;border:0;box-shadow:none}
@media(max-width:760px){
body.page-chat .oc-chat-code-frame{margin:12px 0;border-radius:9px}body.page-chat .oc-chat-code-body{max-height:220px;padding:13px 12px 20px;font-size:11.5px;line-height:1.65}body.page-chat .oc-chat-code-frame.is-expanded .oc-chat-code-body{max-height:58vh}
}

/* AI chat workbench rework: closer to the reference site while keeping existing chat APIs. */
body.page-chat .oc-chat-model-workbench{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:11px;
  padding:0 12px 12px;
  overflow:hidden;
}
body.page-chat .oc-chat-workbench-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
body.page-chat .oc-chat-workbench-tabs button,
body.page-chat .oc-chat-workbench-filters button{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
  color:#cfd5df;
  -webkit-text-fill-color:#cfd5df;
  box-shadow:none;
  cursor:pointer;
  font-family:inherit;
  letter-spacing:0;
}
body.page-chat .oc-chat-workbench-tabs button{
  min-width:0;
  min-height:64px;
  border-radius:9px;
  display:grid;
  place-items:center;
  gap:5px;
  padding:8px 5px;
  font-size:12px;
  font-weight:760;
}
body.page-chat .oc-chat-workbench-tabs button svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}
body.page-chat .oc-chat-workbench-tabs button.is-active{
  background:linear-gradient(180deg,rgba(10,176,214,.18),rgba(10,176,214,.08));
  border-color:rgba(34,211,238,.28);
  color:#22d3ee;
  -webkit-text-fill-color:#22d3ee;
  box-shadow:inset 0 -2px 0 rgba(34,211,238,.52),0 10px 24px rgba(8,145,178,.12);
}
body.page-chat .oc-chat-workbench-filters{
  display:flex;
  align-items:center;
  gap:5px;
  overflow-x:auto;
  scrollbar-width:none;
  padding-bottom:1px;
}
body.page-chat .oc-chat-workbench-filters::-webkit-scrollbar,
body.page-chat .oc-chat-model-list::-webkit-scrollbar{display:none}
body.page-chat .oc-chat-workbench-filters button{
  height:30px;
  flex:0 0 auto;
  border-radius:8px;
  padding:0 9px;
  font-size:12px;
  font-weight:760;
}
body.page-chat .oc-chat-workbench-filters button.is-active{
  background:rgba(34,211,238,.14);
  border-color:rgba(34,211,238,.25);
  color:#67e8f9;
  -webkit-text-fill-color:#67e8f9;
}
body.page-chat .oc-chat-model-search{
  height:34px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 10px;
  border:1px solid rgba(250,204,21,.28);
  border-radius:9px;
  background:rgba(250,204,21,.045);
  color:#9aa1ad;
}
body.page-chat .oc-chat-model-search svg{
  width:14px;
  height:14px;
  flex:0 0 14px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
}
body.page-chat .oc-chat-model-search input{
  width:100%;
  min-width:0;
  height:32px;
  border:0;
  outline:0;
  padding:0;
  margin:0;
  background:transparent;
  color:#e5e7eb;
  -webkit-text-fill-color:#e5e7eb;
  box-shadow:none;
  font-size:12px;
}
body.page-chat .oc-chat-model-search input::placeholder{color:#717987}
body.page-chat .oc-chat-model-list{
  min-height:0;
  flex:1 1 auto;
  display:grid;
  align-content:start;
  gap:8px;
  overflow:auto;
  padding-right:1px;
  scrollbar-width:none;
}
body.page-chat .oc-chat-model-card{
  width:100%;
  min-height:76px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  text-align:left;
  padding:10px 9px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  color:#f4f4f5;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
body.page-chat .oc-chat-model-card:hover{transform:translateY(-1px);background:rgba(255,255,255,.045);border-color:rgba(34,211,238,.20)}
body.page-chat .oc-chat-model-card.is-selected{
  background:linear-gradient(90deg,rgba(34,211,238,.20),rgba(34,211,238,.055));
  border-color:rgba(34,211,238,.32);
  box-shadow:inset 3px 0 0 #22d3ee;
}
body.page-chat .oc-chat-model-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(255,255,255,.055);
  color:#e9eef8;
}
body.page-chat .oc-chat-model-icon svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.1;
}
body.page-chat .oc-chat-model-copy{min-width:0;display:grid;gap:4px}
body.page-chat .oc-chat-model-copy strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f8fafc;
  -webkit-text-fill-color:#f8fafc;
  font-size:13px;
  font-weight:820;
  line-height:1.2;
}
body.page-chat .oc-chat-model-copy small{
  min-width:0;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  color:#9aa1ad;
  -webkit-text-fill-color:#9aa1ad;
  font-size:11px;
  line-height:1.34;
}
body.page-chat .oc-chat-model-score{
  align-self:start;
  height:22px;
  display:inline-flex;
  align-items:center;
  border-radius:6px;
  padding:0 6px;
  background:rgba(16,185,129,.16);
  color:#6ee7b7;
  -webkit-text-fill-color:#6ee7b7;
  font-size:10px;
  font-weight:900;
  white-space:nowrap;
}
body.page-chat .oc-chat-quick-nav{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding-top:2px;
}
body.page-chat .oc-chat-quick-nav a{
  height:25px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:0 8px;
  border:1px solid rgba(255,255,255,.07);
  color:#9aa1ad;
  -webkit-text-fill-color:#9aa1ad;
  text-decoration:none;
  font-size:11px;
  font-weight:760;
}
body.page-chat .oc-chat-quick-nav a.is-active{color:#facc15;-webkit-text-fill-color:#facc15;border-color:rgba(250,204,21,.28);background:rgba(250,204,21,.08)}
body.page-chat .oc-chat-stream{
  width:min(880px,100%);
  gap:20px;
}
body.page-chat .oc-chat-message{gap:13px}
body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{
  --oc-reply-surface:#1f2228;
  --oc-reply-surface-soft:#252932;
  --oc-reply-border:rgba(255,255,255,.10);
  --oc-reply-text:#eef2f7;
  --oc-reply-muted:#9aa4b2;
  border-radius:14px;
  border-color:var(--oc-reply-border);
  background:var(--oc-reply-surface);
  background-image:none;
  color:var(--oc-reply-text);
  -webkit-text-fill-color:var(--oc-reply-text);
  box-shadow:0 12px 30px rgba(0,0,0,.22);
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{
  width:100%;
  max-width:100%;
  padding:18px 20px 14px;
}
body.page-chat .oc-chat-message.is-user .oc-chat-bubble{
  max-width:min(760px,calc(100vw - 130px));
  border-radius:14px 14px 6px 14px;
}
body.page-chat .oc-chat-meta{
  margin-bottom:11px;
  color:var(--oc-reply-muted,#8e96a5);
  -webkit-text-fill-color:var(--oc-reply-muted,#8e96a5);
  font-size:11px;
  font-weight:760;
}
body.page-chat .oc-chat-pill{
  height:22px;
  border-color:rgba(250,204,21,.22);
  background:rgba(250,204,21,.08);
  color:#e8c76b;
  -webkit-text-fill-color:#e8c76b;
}
body.page-chat .oc-chat-content{font-size:14.5px;line-height:1.76}
body.page-chat .oc-chat-copy{
  height:25px;
  border-radius:7px;
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.08);
  color:#cbd5e1;
  -webkit-text-fill-color:#cbd5e1;
}
body.page-chat .oc-chat-reply-footer,
body.page-chat .oc-chat-usage{
  min-height:34px;
  margin-top:14px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.065);
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  color:#8e96a5;
  -webkit-text-fill-color:#8e96a5;
  font-size:11px;
  font-weight:760;
}
body.page-chat .oc-chat-reply-footer button{
  height:24px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#cbd5e1;
  -webkit-text-fill-color:#cbd5e1;
  padding:0 6px;
  cursor:pointer;
  font-size:11px;
  font-weight:760;
}
body.page-chat .oc-chat-reply-status{color:#8e96a5;-webkit-text-fill-color:#8e96a5}
body.page-chat .oc-chat-code-frame{
  border-color:var(--oc-reply-border,rgba(255,255,255,.10));
  border-radius:8px;
  background:var(--oc-reply-surface,#1f2228);
  box-shadow:none;
}
body.page-chat .oc-chat-code-head{height:36px;background:var(--oc-reply-surface-soft,#252932)}
body.page-chat .oc-chat-code-lang{color:#aab2bf;-webkit-text-fill-color:#aab2bf}
body.page-chat .oc-chat-code-copy{background:transparent;color:#cbd5e1;-webkit-text-fill-color:#cbd5e1}
body.page-chat .oc-chat-code-actions{display:flex;align-items:center;gap:6px;margin-left:auto;flex:0 0 auto}
body.page-chat .oc-chat-code-view{height:22px;padding:0 8px;border:0;border-radius:5px;background:rgba(255,255,255,.08);color:#cbd5e1;-webkit-text-fill-color:#cbd5e1;font-size:11px;font-weight:900;line-height:1;cursor:pointer;box-shadow:none}
body.page-chat .oc-chat-code-view:hover{background:rgba(255,255,255,.13);color:#fff;-webkit-text-fill-color:#fff}
body.page-chat .oc-chat-code-preview{display:none;min-height:220px;background:var(--oc-reply-surface,#1f2228);border-top:1px solid var(--oc-reply-border,rgba(255,255,255,.10));overflow:hidden}
body.page-chat .oc-chat-code-frame.is-previewable:not(.is-code-visible) .oc-chat-code-preview{display:block}
body.page-chat .oc-chat-code-preview iframe{display:block;width:100%;height:min(48vh,420px);min-height:220px;border:0;background:#f8fafc;color-scheme:light}
body.page-chat .oc-chat-code-preview-note{height:220px;display:grid;place-items:center;padding:20px;text-align:center;color:var(--oc-reply-muted,#9ca3af);-webkit-text-fill-color:var(--oc-reply-muted,#9ca3af);font-size:13px;line-height:1.6;background:var(--oc-reply-surface,#1f2228)}
body.page-chat .oc-chat-code-frame.is-previewable:not(.is-code-visible) .oc-chat-code-body{display:none}
body.page-chat .oc-chat-code-body{background:var(--oc-reply-surface,#1f2228);font-size:12.5px}
html.jn-light-mode body.page-chat .oc-chat-workbench-tabs button,
html.jn-light-mode body.page-chat .oc-chat-workbench-filters button,
html.jn-light-mode body.page-chat .oc-chat-model-card,
body.page-chat.jn-light-mode .oc-chat-workbench-tabs button,
body.page-chat.jn-light-mode .oc-chat-workbench-filters button,
body.page-chat.jn-light-mode .oc-chat-model-card{
  background:#f8fafc;
  border-color:rgba(15,23,42,.10);
  color:#334155;
  -webkit-text-fill-color:#334155;
}
html.jn-light-mode body.page-chat .oc-chat-model-copy strong,
body.page-chat.jn-light-mode .oc-chat-model-copy strong{color:#0f172a;-webkit-text-fill-color:#0f172a}
html.jn-light-mode body.page-chat .oc-chat-model-copy small,
body.page-chat.jn-light-mode .oc-chat-model-copy small{color:#64748b;-webkit-text-fill-color:#64748b}
html.jn-light-mode body.page-chat .oc-chat-model-card.is-selected,
body.page-chat.jn-light-mode .oc-chat-model-card.is-selected{background:#ecfeff;border-color:rgba(8,145,178,.26)}
html.jn-light-mode body.page-chat .oc-chat-model-search,
body.page-chat.jn-light-mode .oc-chat-model-search{background:#fff;border-color:rgba(15,23,42,.12)}
html.jn-light-mode body.page-chat .oc-chat-model-search input,
body.page-chat.jn-light-mode .oc-chat-model-search input{color:#0f172a;-webkit-text-fill-color:#0f172a}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-bubble,
html.jn-light-mode body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-user .oc-chat-bubble{
  --oc-reply-surface:#ffffff;
  --oc-reply-surface-soft:#f6f8fb;
  --oc-reply-border:rgba(15,23,42,.10);
  --oc-reply-text:#0f172a;
  --oc-reply-muted:#64748b;
  background:var(--oc-reply-surface);
  color:var(--oc-reply-text);
  border-color:var(--oc-reply-border);
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}
html.jn-light-mode body.page-chat .oc-chat-code-frame,
body.page-chat.jn-light-mode .oc-chat-code-frame{background:var(--oc-reply-surface,#ffffff);border-color:var(--oc-reply-border,rgba(15,23,42,.10))}
html.jn-light-mode body.page-chat .oc-chat-code-head,
html.jn-light-mode body.page-chat .oc-chat-code-body,
body.page-chat.jn-light-mode .oc-chat-code-head,
body.page-chat.jn-light-mode .oc-chat-code-preview,
body.page-chat.jn-light-mode .oc-chat-code-preview-note,
body.page-chat.jn-light-mode .oc-chat-code-body{background:var(--oc-reply-surface-soft,#f6f8fb);color:var(--oc-reply-text,#0f172a);-webkit-text-fill-color:var(--oc-reply-text,#0f172a)}
html.jn-light-mode body.page-chat .oc-chat-code-view,
body.page-chat.jn-light-mode .oc-chat-code-view{background:rgba(15,23,42,.07);color:#475569;-webkit-text-fill-color:#475569}
html.jn-light-mode body.page-chat .oc-chat-code-view:hover,
body.page-chat.jn-light-mode .oc-chat-code-view:hover{background:rgba(15,23,42,.11);color:#0f172a;-webkit-text-fill-color:#0f172a}
@media(max-width:760px){
  body.page-chat .oc-chat-message.is-user .oc-chat-bubble{max-width:calc(100vw - 86px)}
  body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{padding:15px 14px 12px}
}
html body.page-chat.jn-chat-app-content-live .oc-chat-code-frame button.oc-chat-code-copy[data-copy-code]:not(#ocChatCodeBtnA):not(#ocChatCodeBtnB),
body.page-chat.jn-chat-app-content-live .oc-chat-code-frame button.oc-chat-code-copy[data-copy-code]:not(#ocChatCodeBtnA):not(#ocChatCodeBtnB){
  background:transparent;
  color:#cbd5e1;
  -webkit-text-fill-color:#cbd5e1;
}

/* Chat owns its visible surface; the source public sidebar is not rendered here. */
body.page-chat .oc-chat-model-workbench{
  display:none;
  visibility:hidden;
  pointer-events:none;
}
@media(min-width:901px){
body.page-chat .oc-chat-main{padding-left:0}
  body.page-chat .oc-chat-history-zone{left:20px}
}

/* Chat reply polish: no right scrollbar,
larger AI avatar,
cleaner top tools. */
body.page-chat .oc-chat-canvas,
body.page-chat .oc-chat-message.is-assistant .oc-chat-content,
body.page-chat .oc-chat-code-frame.is-expanded .oc-chat-code-body{
  scrollbar-width:none;
  -ms-overflow-style:none;
}
body.page-chat .oc-chat-canvas::-webkit-scrollbar,
body.page-chat .oc-chat-message.is-assistant .oc-chat-content::-webkit-scrollbar,
body.page-chat .oc-chat-code-frame.is-expanded .oc-chat-code-body::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar{
  width:44px;
  height:44px;
  min-width:44px;
  flex-basis:44px;
  border-radius:999px;
  background:rgba(31,34,40,.74);
  background-image:linear-gradient(135deg,rgba(46,51,61,.86),rgba(28,31,38,.72));
  border-color:rgba(255,255,255,.13);
  box-shadow:0 10px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.08);
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar svg{
  width:24px;
  height:24px;
}
html.jn-theme-booting[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar,
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-avatar{
  background:linear-gradient(135deg,#eef6ff,#ecfeff);
  background-color:#eef6ff;
  background-image:linear-gradient(135deg,#eef6ff,#ecfeff);
  border-color:rgba(37,99,235,.16);
  color:#1d4ed8;
  -webkit-text-fill-color:#1d4ed8;
  box-shadow:0 8px 20px rgba(15,23,42,.08);
}
html.jn-theme-booting[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar svg,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar svg,
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar svg,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-avatar svg{
  color:currentColor;
  stroke:currentColor;
  filter:none;
}
@media(min-width:901px){
body.page-chat .oc-chat-stream{
    width:min(1080px,calc(100% - 72px));
    max-width:min(1080px,calc(100% - 72px));
  }
  body.page-chat .oc-chat-message.is-assistant{
    margin-left:-36px;
    margin-right:36px;
  }
  body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{
    max-width:calc(100% - 58px);
  }
  body.page-chat .oc-chat-message.is-user .oc-chat-bubble{
    max-width:min(820px,calc(100% - 66px));
  }
}
body.page-chat .oc-chat-content.is-revealing{
  white-space:pre-wrap;
}
body.page-chat .oc-chat-content.is-revealing::after{
  content:"";
  display:inline-block;
  width:6px;
  height:1.12em;
  margin-left:2px;
  vertical-align:-.16em;
  border-radius:999px;
  background:rgba(250,204,21,.72);
  animation:ocChatRevealCaret .86s ease-in-out infinite;
}
@keyframes ocChatRevealCaret{
  0%,100%{opacity:.18}
  50%{opacity:.9}
}
body.page-chat .oc-chat-content.is-revealing.has-code-blocks::after{
  content:none;
  display:none;
}
body.page-chat .oc-chat-code-frame.is-streaming .oc-chat-code-copy{
  visibility:hidden;
  pointer-events:none;
}
body.page-chat .oc-chat-code-frame.is-streaming .oc-chat-code-body code::after{
  content:"";
  display:inline-block;
  width:6px;
  height:1.15em;
  margin-left:2px;
  vertical-align:-.16em;
  border-radius:999px;
  background:rgba(250,204,21,.72);
  animation:ocChatRevealCaret .86s ease-in-out infinite;
}
@media(max-width:760px){
body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar{
    width:38px;
    height:38px;
    min-width:38px;
    flex-basis:38px;
  }
  body.page-chat .oc-chat-message.is-assistant .oc-chat-avatar svg{
    width:21px;
    height:21px;
  }
}

/* Final long-reply safe area: keep refreshed content above the fixed composer. */
body.page-chat .oc-chat-canvas{
  scroll-padding-bottom:calc(var(--composer-safe, 312px) + 24px);
}
body.page-chat .oc-chat-bottom-spacer{
  flex:0 0 calc(var(--composer-safe, 312px) + 24px);
  min-height:calc(var(--composer-safe, 312px) + 24px);
  height:calc(var(--composer-safe, 312px) + 24px);
}
body.page-chat .oc-chat-message{
  scroll-margin-bottom:calc(var(--composer-safe, 312px) + 24px);
}
body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content{
  position:relative;
  max-height:286px;
  overflow:hidden;
  padding-bottom:18px;
}
body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content.has-rich-content{
  white-space:normal;
}
body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:68px;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(31,34,40,0),var(--oc-reply-surface,#1f2228) 78%);
}
body.page-chat .oc-chat-message.is-assistant.is-expanded .oc-chat-content{
  max-height:none;
  overflow:visible;
  padding-bottom:0;
}
body.page-chat .oc-chat-message.is-assistant.is-expanded .oc-chat-content::after{
  content:none;
  display:none;
}
body.page-chat .oc-chat-fold-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:30px;
  min-width:70px;
  margin:10px 0 0;
  padding:0 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#d8dce6;
  -webkit-text-fill-color:#d8dce6;
  box-shadow:none;
  font-size:12px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
}
body.page-chat .oc-chat-fold-toggle:hover{
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.10);
  color:#fff;
  -webkit-text-fill-color:#fff;
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after{
  background:linear-gradient(180deg,rgba(255,255,255,0),var(--oc-reply-surface,#ffffff) 78%);
}
html.jn-light-mode body.page-chat .oc-chat-fold-toggle,
body.page-chat.jn-light-mode .oc-chat-fold-toggle{
  background:rgba(248,250,252,.92);
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
@media(max-width:760px){
body.page-chat .oc-chat-canvas{
    scroll-padding-bottom:calc(var(--composer-safe, 304px) + 18px + env(safe-area-inset-bottom));
  }
  body.page-chat .oc-chat-bottom-spacer{
    flex-basis:calc(var(--composer-safe, 304px) + 18px + env(safe-area-inset-bottom));
    min-height:calc(var(--composer-safe, 304px) + 18px + env(safe-area-inset-bottom));
    height:calc(var(--composer-safe, 304px) + 18px + env(safe-area-inset-bottom));
  }
  body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-collapsible .oc-chat-content{
    max-height:224px;
    padding-bottom:16px;
  }
  body.page-chat .oc-chat-message.is-assistant.is-expanded.is-collapsible .oc-chat-content,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-expanded.is-collapsible .oc-chat-content{
    max-height:calc(100vh - var(--composer-safe, 304px) - 112px);
    max-height:clamp(220px, calc(100dvh - var(--composer-safe, 304px) - 112px), 520px);
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding-bottom:16px;
    scrollbar-width:none;
  }
  body.page-chat .oc-chat-message.is-assistant.is-expanded.is-collapsible .oc-chat-content::-webkit-scrollbar,
body.page-chat:not(#ocChatLongReplyA):not(#ocChatLongReplyB) .oc-chat-message.is-assistant.is-expanded.is-collapsible .oc-chat-content::-webkit-scrollbar{
    display:none;
    width:0;
    height:0;
  }
  body.page-chat .oc-chat-message.is-assistant.is-collapsible .oc-chat-content::after{
    height:58px;
  }
}

/* Final light-mode lock for chat first paint. */
html.jn-light-mode,
html[data-theme="light"],
html.jn-light-mode body.page-chat,
html[data-theme="light"] body.page-chat,
body.page-chat.jn-light-mode,
body.page-chat[data-theme="light"]{
  background:var(--front-video-chat-bg,#f7f8fb);
  background-image:none;
  color:#0f172a;
  color-scheme:light;
}
html.jn-light-mode body.page-chat .oc-chat-page,
html.jn-light-mode body.page-chat .oc-chat-main,
html.jn-light-mode body.page-chat .oc-chat-canvas,
html[data-theme="light"] body.page-chat .oc-chat-page,
html[data-theme="light"] body.page-chat .oc-chat-main,
html[data-theme="light"] body.page-chat .oc-chat-canvas,
body.page-chat.jn-light-mode .oc-chat-page,
body.page-chat.jn-light-mode .oc-chat-main,
body.page-chat.jn-light-mode .oc-chat-canvas{
  background:var(--front-video-chat-bg,#f7f8fb);
  background-image:none;
  color:#0f172a;
}

/* Final light-mode hard lock for chat controls{
  background:#f8fafc;
  background-color:#f8fafc;
  background-image:none;
  border:1px solid rgba(15,23,42,.12);
  color:#334155;
  -webkit-text-fill-color:#334155;
  box-shadow:none;
  text-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html.jn-light-mode body.page-chat :is(.oc-chat-file button[data-remove-file],.oc-chat-history-delete),
html[data-theme="light"] body.page-chat :is(.oc-chat-file button[data-remove-file],.oc-chat-history-delete),
body.page-chat.jn-light-mode :is(.oc-chat-file button[data-remove-file],.oc-chat-history-delete){
  background:#f8fafc;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#64748b;
  -webkit-text-fill-color:#64748b;
  box-shadow:none;
  text-shadow:none;
  filter:none;
  opacity:1;
}
html.jn-light-mode body.page-chat :is(.oc-chat-file button[data-remove-file],.oc-chat-history-delete):hover,
html[data-theme="light"] body.page-chat :is(.oc-chat-file button[data-remove-file],.oc-chat-history-delete):hover,
body.page-chat.jn-light-mode :is(.oc-chat-file button[data-remove-file],.oc-chat-history-delete):hover{
  background:#fff1f2;
  border-color:rgba(225,29,72,.20);
  color:#e11d48;
  -webkit-text-fill-color:#e11d48;
}
html.jn-light-mode body.page-chat .oc-chat-history-panel .oc-chat-history-delete,
html[data-theme="light"] body.page-chat .oc-chat-history-panel .oc-chat-history-delete,
body.page-chat.jn-light-mode .oc-chat-history-panel .oc-chat-history-delete{
  background:transparent;
  border:0;
  color:var(--oc-history-muted,#64748b);
  -webkit-text-fill-color:var(--oc-history-muted,#64748b);
  box-shadow:none;
}
html.jn-light-mode body.page-chat .oc-chat-history-panel .oc-chat-history-delete:hover,
html[data-theme="light"] body.page-chat .oc-chat-history-panel .oc-chat-history-delete:hover,
body.page-chat.jn-light-mode .oc-chat-history-panel .oc-chat-history-delete:hover{
  background:var(--oc-history-danger-bg,#fff1f2);
  color:var(--oc-history-danger,#e11d48);
  -webkit-text-fill-color:var(--oc-history-danger,#e11d48);
}
html body.page-chat .oc-chat-history-panel :is(.oc-chat-history-title,.oc-chat-history-meta,.oc-chat-history-item-title){
  color:var(--oc-history-text,#eef2f7);
  -webkit-text-fill-color:var(--oc-history-text,#eef2f7);
}
html body.page-chat .oc-chat-history-panel :is(.oc-chat-history-count,.oc-chat-history-item-meta,.oc-chat-history-empty,.oc-chat-history-search,.oc-chat-history-search input::placeholder){
  color:var(--oc-history-muted,#9aa4b2);
  -webkit-text-fill-color:var(--oc-history-muted,#9aa4b2);
}
html body.page-chat .oc-chat-history-panel .oc-chat-history-search input{
  color:var(--oc-history-text,#eef2f7);
  -webkit-text-fill-color:var(--oc-history-text,#eef2f7);
}
html body.page-chat .oc-chat-history-panel .oc-chat-history-item.is-active,
html body.page-chat .oc-chat-history-panel .oc-chat-history-item.is-selected{
  background:var(--oc-history-active,rgba(56,189,248,.13));
  border-color:var(--oc-history-active-border,rgba(56,189,248,.52));
  box-shadow:inset 3px 0 0 var(--oc-history-accent,#38bdf8);
}
html.jn-light-mode body.page-chat :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button),
html[data-theme="light"] body.page-chat :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button),
body.page-chat.jn-light-mode :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button){
  background:#f8fafc;
  background-color:#f8fafc;
  background-image:none;
  border:1px solid rgba(15,23,42,.12);
  color:#334155;
  -webkit-text-fill-color:#334155;
  box-shadow:none;
  text-shadow:none;
}
html.jn-light-mode body.page-chat :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button):hover,
html[data-theme="light"] body.page-chat :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button):hover,
body.page-chat.jn-light-mode :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button):hover{
  background:#eef6ff;
  border-color:rgba(37,99,235,.18);
  color:#1d4ed8;
  -webkit-text-fill-color:#1d4ed8;
}
html.jn-light-mode body.page-chat :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button) svg,
html[data-theme="light"] body.page-chat :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button) svg,
body.page-chat.jn-light-mode :is(.oc-chat-copy,.oc-chat-reply-footer button[data-copy-message],.oc-chat-code-copy,.oc-chat-artifact-actions button,.oc-chat-artifact-actions a,.oc-chat-table-tools button) svg{
  color:currentColor;
  stroke:currentColor;
  filter:none;
}

/* Light-mode hard override for source high-specificity chat copy controls. */
html.jn-light-mode body.page-chat:not(#ocChatCopyLightA):not(#ocChatCopyLightB):not(#ocChatCopyLightC):not(#ocChatCopyLightD) :is(.oc-chat-message .oc-chat-copy[data-copy-message],.oc-chat-message button[data-copy-message],.oc-chat-reply-footer button,.oc-chat-usage button[data-copy-message],.oc-chat-code-frame button.oc-chat-code-copy[data-copy-code],.oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],.oc-chat-rich .oc-chat-artifact-actions a,.oc-chat-rich .oc-chat-table-tools button[data-rich-action]),
html[data-theme="light"] body.page-chat:not(#ocChatCopyLightA):not(#ocChatCopyLightB):not(#ocChatCopyLightC):not(#ocChatCopyLightD) :is(.oc-chat-message .oc-chat-copy[data-copy-message],.oc-chat-message button[data-copy-message],.oc-chat-reply-footer button,.oc-chat-usage button[data-copy-message],.oc-chat-code-frame button.oc-chat-code-copy[data-copy-code],.oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],.oc-chat-rich .oc-chat-artifact-actions a,.oc-chat-rich .oc-chat-table-tools button[data-rich-action]),
body.page-chat.jn-light-mode:not(#ocChatCopyLightA):not(#ocChatCopyLightB):not(#ocChatCopyLightC):not(#ocChatCopyLightD) :is(.oc-chat-message .oc-chat-copy[data-copy-message],.oc-chat-message button[data-copy-message],.oc-chat-reply-footer button,.oc-chat-usage button[data-copy-message],.oc-chat-code-frame button.oc-chat-code-copy[data-copy-code],.oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],.oc-chat-rich .oc-chat-artifact-actions a,.oc-chat-rich .oc-chat-table-tools button[data-rich-action]){
  background:#f8fafc;
  background-color:#f8fafc;
  background-image:none;
  border:1px solid rgba(15,23,42,.12);
  color:#334155;
  -webkit-text-fill-color:#334155;
  box-shadow:none;
  text-shadow:none;
  filter:none;
}
html.jn-light-mode body.page-chat:not(#ocChatCopyLightA):not(#ocChatCopyLightB):not(#ocChatCopyLightC):not(#ocChatCopyLightD) :is(.oc-chat-message .oc-chat-copy[data-copy-message],.oc-chat-message button[data-copy-message],.oc-chat-reply-footer button,.oc-chat-usage button[data-copy-message],.oc-chat-code-frame button.oc-chat-code-copy[data-copy-code],.oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],.oc-chat-rich .oc-chat-artifact-actions a,.oc-chat-rich .oc-chat-table-tools button[data-rich-action]):hover,
html[data-theme="light"] body.page-chat:not(#ocChatCopyLightA):not(#ocChatCopyLightB):not(#ocChatCopyLightC):not(#ocChatCopyLightD) :is(.oc-chat-message .oc-chat-copy[data-copy-message],.oc-chat-message button[data-copy-message],.oc-chat-reply-footer button,.oc-chat-usage button[data-copy-message],.oc-chat-code-frame button.oc-chat-code-copy[data-copy-code],.oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],.oc-chat-rich .oc-chat-artifact-actions a,.oc-chat-rich .oc-chat-table-tools button[data-rich-action]):hover,
body.page-chat.jn-light-mode:not(#ocChatCopyLightA):not(#ocChatCopyLightB):not(#ocChatCopyLightC):not(#ocChatCopyLightD) :is(.oc-chat-message .oc-chat-copy[data-copy-message],.oc-chat-message button[data-copy-message],.oc-chat-reply-footer button,.oc-chat-usage button[data-copy-message],.oc-chat-code-frame button.oc-chat-code-copy[data-copy-code],.oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],.oc-chat-rich .oc-chat-artifact-actions a,.oc-chat-rich .oc-chat-table-tools button[data-rich-action]):hover{
  background:#eef6ff;
  background-color:#eef6ff;
  border-color:rgba(37,99,235,.18);
  color:#1d4ed8;
  -webkit-text-fill-color:#1d4ed8;
}
/* Chat page final local polish: reply surface and model price menu. */
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-bubble,
html.jn-light-mode body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
html[data-theme="light"] body.page-chat .oc-chat-message.is-user .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-user .oc-chat-bubble{
  background:#fff;
  background-image:none;
  border-color:rgba(15,23,42,.12);
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
  box-shadow:0 14px 30px rgba(15,23,42,.075);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant :is(.oc-chat-content,.oc-chat-rich),
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-content,
html[data-theme=light] body.page-chat .oc-chat-message.is-assistant :is(.oc-chat-content,.oc-chat-rich),
body.page-chat.jn-light-mode .oc-chat-message.is-assistant :is(.oc-chat-content,.oc-chat-rich){
  background:transparent;
  background-image:none;
  border-color:transparent;
  color:#334155;
  -webkit-text-fill-color:currentColor;
  box-shadow:none;
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-content > :not(.oc-chat-code-frame):not(.oc-chat-rich):not(.oc-chat-artifact-card),
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-content > :not(.oc-chat-code-frame):not(.oc-chat-rich):not(.oc-chat-artifact-card),
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-content > :not(.oc-chat-code-frame):not(.oc-chat-rich):not(.oc-chat-artifact-card){
  background:transparent;
  background-image:none;
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-meta,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-meta,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-meta,
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-usage,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-usage,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-usage{
  color:#64748b;
  -webkit-text-fill-color:#64748b;
  border-color:rgba(15,23,42,.08);
}
/* Unified assistant reply surface: the bubble owns the outer card; content and code internals stay transparent. */
body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble{
  --oc-reply-surface:#1f2228;
  --oc-reply-surface-soft:#252932;
  --oc-reply-code-surface:#1f2228;
  --oc-reply-border:rgba(255,255,255,.11);
  --oc-reply-text:#e5e7eb;
  background:var(--oc-reply-surface);
  background-image:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-content,
body.page-chat .oc-chat-message.is-assistant .oc-chat-text-fragment,
body.page-chat .oc-chat-message.is-assistant .oc-chat-content > :not(.oc-chat-code-frame):not(.oc-chat-rich):not(.oc-chat-artifact-card){
  background:transparent;
  background-image:none;
  box-shadow:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame{
  border-color:var(--oc-reply-border);
  background:var(--oc-reply-code-surface);
  background-image:none;
  box-shadow:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-head,
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-body{
  background:transparent;
  background-image:none;
  box-shadow:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-head{
  border-color:rgba(255,255,255,.08);
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame:not(.is-expanded) .oc-chat-code-body::after{
  background:linear-gradient(180deg,rgba(31,34,40,0),var(--oc-reply-code-surface,#1f2228) 76%);
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-content :is(table,.table-wrap,.oc-chat-rich,.oc-chat-rich-table,.oc-chat-artifact-card){
  background:var(--oc-reply-surface);
  background-image:none;
  border-color:var(--oc-reply-border);
  box-shadow:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-content :is(thead,th){
  background:var(--oc-reply-surface-soft);
  background-image:none;
  border-color:var(--oc-reply-border);
  color:var(--oc-reply-text);
  -webkit-text-fill-color:var(--oc-reply-text);
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-content :is(tbody,tr,td){
  background:transparent;
  background-image:none;
  border-color:var(--oc-reply-border);
  color:var(--oc-reply-text);
  -webkit-text-fill-color:var(--oc-reply-text);
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-content tr:nth-child(even) td{
  background:rgba(255,255,255,.025);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-bubble,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-bubble{
  --oc-reply-surface:#ffffff;
  --oc-reply-surface-soft:#ffffff;
  --oc-reply-code-surface:#f8fafc;
  --oc-reply-border:rgba(15,23,42,.12);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-code-head,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-code-head,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-code-head{
  border-color:rgba(15,23,42,.10);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame:not(.is-expanded) .oc-chat-code-body::after,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame:not(.is-expanded) .oc-chat-code-body::after,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-code-frame:not(.is-expanded) .oc-chat-code-body::after{
  background:linear-gradient(180deg,rgba(248,250,252,0),var(--oc-reply-code-surface,#f8fafc) 76%);
}
html.jn-light-mode body.page-chat .oc-chat-message.is-assistant .oc-chat-content tr:nth-child(even) td,
html[data-theme="light"] body.page-chat .oc-chat-message.is-assistant .oc-chat-content tr:nth-child(even) td,
body.page-chat.jn-light-mode .oc-chat-message.is-assistant .oc-chat-content tr:nth-child(even) td{
  background:#f8fafc;
}
html.jn-light-mode body.page-chat :is(.oc-chat-code-frame,.oc-chat-table-wrap),
html[data-theme=light] body.page-chat :is(.oc-chat-code-frame,.oc-chat-table-wrap),
body.page-chat.jn-light-mode :is(.oc-chat-code-frame,.oc-chat-table-wrap){
  background:#ffffff;
  background-image:none;
  border-color:rgba(15,23,42,.10);
  color:#0f172a;
  -webkit-text-fill-color:currentColor;
  box-shadow:0 8px 20px rgba(15,23,42,.055);
}

/* Unified public shell without the source layout sidebar. */
body.page-chat .app-layout{
  min-height:100dvh;
  overflow:hidden;
}
body.page-chat .main-area{
  position:relative;
  flex:1 1 auto;
  min-width:0;
  width:auto;
  height:100dvh;
  min-height:100dvh;
  padding:0;
  overflow:hidden;
  background:var(--front-video-chat-bg,#1b1c20);
}
html.jn-light-mode body.page-chat .main-area,
html[data-theme="light"] body.page-chat .main-area,
body.page-chat.jn-light-mode .main-area{
  background:var(--front-video-chat-bg,#f7f8fb);
}
body.page-chat .oc-chat-page{
  position:relative;
  inset:auto;
  z-index:0;
  width:100%;
  height:100dvh;
  min-height:100dvh;
}
body.page-chat .oc-chat-main{
  position:absolute;
  inset:0;
  padding-left:0;
}
body.page-chat .oc-chat-history-zone{
  position:absolute;
  left:20px;
  top:27px;
  max-width:calc(100% - 40px);
}
@media(max-width:760px){
  body.page-chat .oc-chat-history-zone{
    left:12px;
    top:56px;
    max-width:calc(100% - 24px);
  }
}
body.page-chat .oc-chat-canvas{
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
body.page-chat .oc-chat-main,
body.page-chat .oc-chat-page{
  overflow:hidden;
}
body.page-chat .oc-chat-message.is-assistant.is-expanded.is-collapsible .oc-chat-content{
  max-height:none;
  overflow:visible;
  overflow-x:hidden;
  padding-bottom:0;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame.is-code-fit .oc-chat-code-body{
  max-height:none;
  overflow-x:auto;
  overflow-y:visible;
  padding-bottom:16px;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame.is-collapsible-code:not(.is-expanded) .oc-chat-code-body{
  max-height:220px;
  overflow:hidden;
  padding-bottom:34px;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame.is-collapsible-code.is-expanded .oc-chat-code-body{
  max-height:min(68vh,680px);
  overflow:auto;
  padding-bottom:16px;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-body::after,
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame.is-code-fit .oc-chat-code-body::after{
  content:none;
  display:none;
}
body.page-chat .oc-chat-message.is-assistant .oc-chat-code-frame.is-collapsible-code:not(.is-expanded) .oc-chat-code-body::after{
  content:"";
  display:block;
}
body.page-chat .front-chat-model-options{
  display:none;
}
body.page-chat.front-creative-page .oc-chat-queue{position:relative;width:min(520px,100%);min-width:0;max-width:100%;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;gap:6px}
body.page-chat.front-creative-page .oc-chat-queue[hidden]{display:none}
body.page-chat.front-creative-page .oc-chat-queue-toggle{width:100%;min-width:0;height:34px;min-height:34px;max-height:34px;padding:0 12px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(255,255,255,.07);color:rgba(246,247,251,.92);-webkit-text-fill-color:rgba(246,247,251,.92);display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:center;gap:7px;box-shadow:none;cursor:pointer;overflow:hidden}
body.page-chat.front-creative-page .oc-chat-queue-dot{width:8px;height:8px;border-radius:999px;background:#22d3ee;box-shadow:0 0 0 4px rgba(34,211,238,.12)}
body.page-chat.front-creative-page .oc-chat-queue-title{color:#f8fafc;-webkit-text-fill-color:#f8fafc;font-size:12px;font-weight:1000;white-space:nowrap}
body.page-chat.front-creative-page .oc-chat-queue-preview{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9ca3af;-webkit-text-fill-color:#9ca3af;font-size:12px;font-weight:800;text-align:left}
body.page-chat.front-creative-page .oc-chat-queue-panel{position:absolute;right:0;bottom:42px;z-index:32;width:min(360px,calc(100vw - 24px));display:grid;gap:6px;padding:8px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(35,38,45,.94);box-shadow:0 16px 42px rgba(12,16,24,.32);max-height:240px;overflow:auto;backdrop-filter:blur(16px)}
body.page-chat.front-creative-page .oc-chat-queue-panel[hidden]{display:none}
body.page-chat.front-creative-page .oc-chat-queue-item{position:relative;min-width:0;height:36px;display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:7px;padding:0 7px;border-radius:9px;background:rgba(255,255,255,.065);color:#f4f4f5;-webkit-text-fill-color:#f4f4f5;font-size:12px;font-weight:900}
body.page-chat.front-creative-page .oc-chat-queue-thread-icon{width:18px;height:18px;display:grid;place-items:center;color:#22d3ee;-webkit-text-fill-color:#22d3ee}
body.page-chat.front-creative-page .oc-chat-queue-thread-icon svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
body.page-chat.front-creative-page .oc-chat-queue-index{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:rgba(34,211,238,.12);color:#22d3ee;-webkit-text-fill-color:#22d3ee;font-size:12px}
body.page-chat.front-creative-page .oc-chat-queue-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.page-chat.front-creative-page .oc-chat-queue-row-actions{height:28px;display:flex;align-items:center;justify-content:flex-end;gap:4px;min-width:0;white-space:nowrap}
body.page-chat.front-creative-page .oc-chat-queue-guide,body.page-chat.front-creative-page .oc-chat-queue-row-btn{height:26px;min-height:26px;border:0;box-shadow:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(246,247,251,.86);-webkit-text-fill-color:rgba(246,247,251,.86);background:rgba(255,255,255,.06)}
body.page-chat.front-creative-page .oc-chat-queue-guide{gap:4px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:1000;line-height:1}
body.page-chat.front-creative-page .oc-chat-queue-row-btn{width:26px;padding:0;border-radius:999px}
body.page-chat.front-creative-page .oc-chat-queue-guide:hover,body.page-chat.front-creative-page .oc-chat-queue-row-btn:hover{background:rgba(34,211,238,.16);color:#e0faff;-webkit-text-fill-color:#e0faff}
body.page-chat.front-creative-page .oc-chat-queue-guide svg,body.page-chat.front-creative-page .oc-chat-queue-row-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;flex:0 0 14px}
body.page-chat.front-creative-page .oc-chat-queue-row-btn svg circle{fill:currentColor;stroke:none}
body.page-chat.front-creative-page .oc-chat-queue-more-menu{position:absolute;right:7px;top:34px;z-index:3;display:grid;gap:2px;min-width:124px;padding:5px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(35,38,45,.98);box-shadow:0 12px 28px rgba(10,14,22,.28);backdrop-filter:blur(14px)}
body.page-chat.front-creative-page .oc-chat-queue-more-menu[hidden]{display:none}
body.page-chat.front-creative-page .oc-chat-queue-more-menu button{height:30px;padding:0 9px;border:0;border-radius:8px;background:transparent;color:#f4f4f5;-webkit-text-fill-color:#f4f4f5;text-align:left;font-size:12px;font-weight:900;cursor:pointer}
body.page-chat.front-creative-page .oc-chat-queue-more-menu button:hover{background:rgba(255,255,255,.08)}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-toggle,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-toggle,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-toggle{background:#f8fafc;border-color:rgba(15,23,42,.12);color:#0f172a;-webkit-text-fill-color:#0f172a}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-title,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-title,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-title{color:#0f172a;-webkit-text-fill-color:#0f172a}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-preview,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-preview,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-preview{color:#64748b;-webkit-text-fill-color:#64748b}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-panel,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-panel,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-panel{background:rgba(255,255,255,.96);border-color:rgba(15,23,42,.12);box-shadow:0 16px 42px rgba(15,23,42,.12)}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-item,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-item,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-item{background:#f1f5f9;color:#0f172a;-webkit-text-fill-color:#0f172a}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-guide,html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-row-btn,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-guide,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-row-btn,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-guide,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-row-btn{background:rgba(15,23,42,.06);color:#475569;-webkit-text-fill-color:#475569}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-guide:hover,html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-row-btn:hover,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-guide:hover,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-row-btn:hover,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-guide:hover,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-row-btn:hover{background:rgba(8,145,178,.12);color:#0891b2;-webkit-text-fill-color:#0891b2}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-more-menu,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-more-menu,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-more-menu{background:rgba(255,255,255,.98);border-color:rgba(15,23,42,.12);box-shadow:0 12px 28px rgba(15,23,42,.14)}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-more-menu button,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-more-menu button,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-more-menu button{color:#0f172a;-webkit-text-fill-color:#0f172a}
html.jn-light-mode body.page-chat.front-creative-page .oc-chat-queue-more-menu button:hover,html[data-theme="light"] body.page-chat.front-creative-page .oc-chat-queue-more-menu button:hover,body.page-chat.front-creative-page.jn-light-mode .oc-chat-queue-more-menu button:hover{background:#eef2f7}
@media(max-width:860px){body.page-chat.front-creative-page .oc-chat-queue{grid-template-columns:minmax(0,1fr);gap:6px}body.page-chat.front-creative-page .oc-chat-queue-title,body.page-chat.front-creative-page .oc-chat-queue-preview{font-size:11px}body.page-chat.front-creative-page .oc-chat-queue-panel{right:0;width:min(340px,calc(100vw - 20px))}body.page-chat.front-creative-page .oc-chat-queue-item{grid-template-columns:16px minmax(0,1fr) auto;height:36px;gap:5px;padding:0 6px}body.page-chat.front-creative-page .oc-chat-queue-guide{padding:0 7px}body.page-chat.front-creative-page .oc-chat-queue-guide span{display:inline;white-space:nowrap}}

html:not(.jn-light-mode):not([data-theme=light]) body.page-chat .oc-chat-message,
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat .oc-chat-message .oc-chat-content{
  color:#f2f2f2;
  -webkit-text-fill-color:#f2f2f2;
}
html[data-theme=dark]:not(.jn-light-mode) body:is(.page-chat,.front-creative-page):not(.page-admin):not(.jn-light-mode) .oc-chat-history-panel :is(.oc-chat-history-title,.oc-chat-history-meta,.oc-chat-history-item-title),
body:is(.page-chat,.front-creative-page)[data-theme=dark]:not(.page-admin):not(.jn-light-mode) .oc-chat-history-panel :is(.oc-chat-history-title,.oc-chat-history-meta,.oc-chat-history-item-title),
html.jn-light-mode body:is(.page-chat,.front-creative-page):not(.page-admin) .oc-chat-history-panel :is(.oc-chat-history-title,.oc-chat-history-meta,.oc-chat-history-item-title),
html[data-theme=light] body:is(.page-chat,.front-creative-page):not(.page-admin) .oc-chat-history-panel :is(.oc-chat-history-title,.oc-chat-history-meta,.oc-chat-history-item-title),
body:is(.page-chat,.front-creative-page).jn-light-mode:not(.page-admin) .oc-chat-history-panel :is(.oc-chat-history-title,.oc-chat-history-meta,.oc-chat-history-item-title){
  color:var(--oc-history-text);
  -webkit-text-fill-color:var(--oc-history-text);
  text-shadow:none;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat .oc-chat-history-panel :is(.oc-chat-history-count,.oc-chat-history-item-meta,.oc-chat-history-empty,.oc-chat-history-search,.oc-chat-history-search input::placeholder){
  color:var(--oc-history-muted,#9aa4b2);
  -webkit-text-fill-color:var(--oc-history-muted,#9aa4b2);
}
body.page-chat .oc-chat-history-panel .oc-chat-history-check{
  width:15px;
  height:13px;
}
html.jn-light-mode body.page-chat .oc-chat-history-panel .oc-chat-history-check,
html[data-theme=light] body.page-chat .oc-chat-history-panel .oc-chat-history-check,
body.page-chat.jn-light-mode .oc-chat-history-panel .oc-chat-history-check,
body.page-chat[data-theme=light] .oc-chat-history-panel .oc-chat-history-check{
  background:#f8fafc;
  background-color:#f8fafc;
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
@media(min-width:761px){
  body.page-chat .oc-chat-message.is-user .oc-chat-avatar{
    width:38px;
    height:38px;
    min-height:38px;
    min-width:38px;
    flex-basis:38px;
  }
}
html[data-theme=dark]:not(.jn-light-mode) body.page-chat.page-chat.front-creative-page:not(.jn-light-mode) .oc-chat-history-panel :is(.oc-chat-history-count,.oc-chat-history-item-meta,.oc-chat-history-empty,.oc-chat-history-search,.oc-chat-history-search input::placeholder){
  color:var(--oc-history-muted,#9aa4b2);
  -webkit-text-fill-color:var(--oc-history-muted,#9aa4b2);
}
html[data-theme=dark]:not(.jn-light-mode) body.page-chat.page-chat.front-creative-page:not(.jn-light-mode) .oc-chat-history-panel .oc-chat-history-check{
  color:#f7f8fb;
  -webkit-text-fill-color:#f7f8fb;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat.front-creative-page [data-front-creative-composer=chat] .front-chat-controls .front-param-trigger{
  padding:0 24px 0 14px;
  justify-content:flex-start;
  color:#e8edf7;
  -webkit-text-fill-color:#e8edf7;
  font-weight:820;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat.front-creative-page [data-front-creative-composer=chat] .front-chat-controls .front-param-trigger::after{
  width:0;
  height:0;
}
body.page-chat.front-creative-page .front-creative-composer-tools .ai-video-clear-chip svg{
  width:15px;
  height:15px;
  stroke-width:2;
}

/* Authoritative source chat model portal parity. */
html body.page-chat:not(.page-admin) .front-param-options[data-param=model],
html body.page-chat:not(.page-admin) .front-param-select[data-param=model] .front-param-options{
  --front-param-control-muted:#9aa3b2;
  --front-param-panel-bg:rgba(34,36,42,.86);
  --front-param-panel-border:rgba(255,255,255,.10);
  --front-param-panel-text:#f2f4f8;
  --front-param-shadow:0 18px 48px rgba(0,0,0,.46);
  box-sizing:border-box;
  --front-param-portal-width:min(244px,calc(100vw - 18px));
  --front-param-portal-min-width:min(218px,calc(100vw - 18px));
  --front-param-portal-max-width:min(244px,calc(100vw - 18px));
  max-height:min(336px,calc(100dvh - 24px));
  grid-auto-rows:min-content;
  gap:6px;
  overflow:auto;
  padding:8px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:10px;
  background:rgba(34,36,42,.94);
  background-image:none;
  color:var(--front-param-panel-text);
  -webkit-text-fill-color:var(--front-param-panel-text);
  box-shadow:0 18px 44px rgba(0,0,0,.36);
  backdrop-filter:blur(22px) saturate(132%);
  -webkit-backdrop-filter:blur(22px) saturate(132%);
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model]::before,
html body.page-chat:not(.page-admin) .front-param-select[data-param=model] .front-param-options::before{
  content:'选择模型';
  display:block;
  margin:0 4px 10px;
  text-align:center;
  white-space:pre-line;
  font-size:11px;
  font-weight:700;
  line-height:16px;
  color:var(--front-param-control-muted);
  -webkit-text-fill-color:var(--front-param-control-muted);
  background-image:linear-gradient(to right,var(--front-param-panel-border) 0,var(--front-param-panel-border) calc(50% - 38px),transparent calc(50% - 38px),transparent calc(50% + 38px),var(--front-param-panel-border) calc(50% + 38px),var(--front-param-panel-border) 100%);
  background-repeat:no-repeat;
  background-size:100% 1px;
  background-position:center;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model]::after,
html body.page-chat:not(.page-admin) .front-param-select[data-param=model] .front-param-options::after{
  content:none;
  display:none;
  pointer-events:none;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option,
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] button.front-chat-model-option{
  box-sizing:border-box;
  width:100%;
  height:auto;
  min-height:78px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  gap:10px;
  padding:10px 12px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  background-image:none;
  color:var(--front-param-panel-text);
  -webkit-text-fill-color:var(--front-param-panel-text);
  box-shadow:none;
  font:inherit;
  font-size:13px;
  font-weight:800;
  line-height:1;
  text-align:left;
  white-space:normal;
  overflow:visible;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected::after,
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] button.front-chat-model-option.is-selected::after{
  content:'';
  box-sizing:border-box;
  width:7px;
  height:12px;
  margin-left:auto;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:translateY(-1px) rotate(45deg);
  color:var(--front-param-control-muted);
  -webkit-text-fill-color:var(--front-param-control-muted);
  font-size:0;
  line-height:0;
  flex:0 0 7px;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option:hover,
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] button.front-chat-model-option:hover{
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.10);
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected,
html body.page-chat:not(.page-admin) .front-param-options[data-param=model] button.front-chat-model-option.is-selected{
  background:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.13);
}
html body.page-chat:not(.page-admin) .front-chat-model-copy{
  display:grid;
  gap:5px;
  min-width:0;
  width:100%;
  text-align:left;
}
html body.page-chat:not(.page-admin) .front-chat-model-title{
  display:block;
  color:#f7f8fb;
  -webkit-text-fill-color:#f7f8fb;
  font-size:14px;
  font-weight:900;
  line-height:1.18;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body.page-chat:not(.page-admin) .front-chat-model-price{
  display:block;
  color:#f59e0b;
  -webkit-text-fill-color:#f59e0b;
  font-size:12px;
  font-weight:820;
  line-height:1.2;
  white-space:nowrap;
}
html body.page-chat:not(.page-admin) .front-chat-model-bolt{
  color:#fbbf24;
  -webkit-text-fill-color:#fbbf24;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model]::-webkit-scrollbar,
html body.page-chat:not(.page-admin) .front-param-select[data-param=model] .front-param-options::-webkit-scrollbar{
  width:3px;
  height:3px;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model]::-webkit-scrollbar-track,
html body.page-chat:not(.page-admin) .front-param-select[data-param=model] .front-param-options::-webkit-scrollbar-track{
  background:transparent;
}
html body.page-chat:not(.page-admin) .front-param-options[data-param=model]::-webkit-scrollbar-thumb,
html body.page-chat:not(.page-admin) .front-param-select[data-param=model] .front-param-options::-webkit-scrollbar-thumb{
  border-radius:99px;
  background:rgba(148,163,184,.38);
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-param-options[data-param=model],
html[data-theme=light] body.page-chat:not(.page-admin) .front-param-options[data-param=model],
body.page-chat.jn-light-mode:not(.page-admin) .front-param-options[data-param=model],
body.page-chat[data-theme=light]:not(.page-admin) .front-param-options[data-param=model]{
  --front-param-control-muted:#64748b;
  --front-param-panel-bg:rgba(246,248,252,.82);
  --front-param-panel-border:rgba(15,23,42,.12);
  --front-param-panel-text:#50627a;
  --front-param-shadow:0 18px 44px rgba(15,23,42,.14);
  background:var(--front-param-panel-bg);
  border-color:var(--front-param-panel-border);
  box-shadow:var(--front-param-shadow);
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option,
html[data-theme=light] body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option,
body.page-chat.jn-light-mode:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option,
body.page-chat[data-theme=light]:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option{
  background:transparent;
  border-color:transparent;
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option:hover,
html[data-theme=light] body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option:hover,
body.page-chat.jn-light-mode:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option:hover,
body.page-chat[data-theme=light]:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option:hover{
  background:linear-gradient(135deg,#ffffff,#eef6ff);
  border-color:rgba(37,99,235,.24);
  box-shadow:0 10px 22px rgba(37,99,235,.12),inset 0 1px 0 rgba(255,255,255,.95);
  transform:translateY(-1px);
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected,
html[data-theme=light] body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected,
body.page-chat.jn-light-mode:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected,
body.page-chat[data-theme=light]:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected{
  background:rgba(59,130,246,.10);
  border-color:rgba(37,99,235,.22);
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected:hover,
html[data-theme=light] body.page-chat:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected:hover,
body.page-chat.jn-light-mode:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected:hover,
body.page-chat[data-theme=light]:not(.page-admin) .front-param-options[data-param=model] .front-chat-model-option.is-selected:hover{
  background:linear-gradient(135deg,#eff6ff,#dbeafe);
  border-color:rgba(37,99,235,.36);
  box-shadow:0 12px 26px rgba(37,99,235,.14),inset 0 1px 0 rgba(255,255,255,.94);
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-chat-model-title,
html[data-theme=light] body.page-chat:not(.page-admin) .front-chat-model-title,
body.page-chat.jn-light-mode:not(.page-admin) .front-chat-model-title,
body.page-chat[data-theme=light]:not(.page-admin) .front-chat-model-title{
  color:#111827;
  -webkit-text-fill-color:#111827;
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-chat-model-price,
html[data-theme=light] body.page-chat:not(.page-admin) .front-chat-model-price,
body.page-chat.jn-light-mode:not(.page-admin) .front-chat-model-price,
body.page-chat[data-theme=light]:not(.page-admin) .front-chat-model-price{
  color:#d97706;
  -webkit-text-fill-color:#d97706;
}

/* Authoritative source desktop chat computed-style parity. */
@media(min-width:861px){
  html body.page-chat:not(.page-admin) .front-chat-new-btn{
    font-weight:900;
    white-space:normal;
  }
  html body.page-chat:not(.page-admin) .front-chat-history-toggle{
    font-weight:900;
  }
  html.jn-light-mode body.page-chat:not(.page-admin) .oc-chat-content,
  html[data-theme=light] body.page-chat:not(.page-admin) .oc-chat-content,
  body.page-chat.jn-light-mode:not(.page-admin) .oc-chat-content,
  body.page-chat[data-theme=light]:not(.page-admin) .oc-chat-content{
    color:#334155;
    -webkit-text-fill-color:#334155;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-creative-composer-chat{
    border-color:transparent;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip{
    grid-template-columns:30px;
    justify-content:normal;
    line-height:16px;
    overflow:hidden;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip svg,
  html body.page-chat.front-creative-page:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip path{
    line-height:16px;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-creative-tool-chip.ai-video-clear-chip > span{
    display:block;
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    clip-path:inset(50%);
    white-space:nowrap;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-chat-input-frame{
    margin:0;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-chat-input{
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-chat-controls .front-model-select{
    background:#f8fafc;
    border-color:rgba(15,23,42,.12);
    color:#475569;
    -webkit-text-fill-color:#475569;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-chat-controls .front-param-trigger{
    background:#f8fafc;
    color:#475569;
    -webkit-text-fill-color:#475569;
    font-weight:820;
    justify-content:flex-start;
    padding:0 24px 0 14px;
  }
  html body.page-chat.front-creative-page:not(.page-admin) .front-chat-send.is-empty{
    pointer-events:none;
  }
}

html body.page-chat:not(.page-admin){
  min-width:0;
  max-width:100%;
}
html body.page-chat:not(.page-admin) .front-creative-brand,
html body.page-chat:not(.page-admin) .front-creative-nav-item{
  transition:color .15s cubic-bezier(.16,1,.3,1);
}
html body.page-chat:not(.page-admin) .main-area{
  transition:margin-left .25s cubic-bezier(.16,1,.3,1);
}
html body.page-chat:not(.page-admin) .front-chat-history-frame,
html body.page-chat:not(.page-admin) .oc-chat-history-zone,
html body.page-chat:not(.page-admin) .oc-chat-stream,
html body.page-chat:not(.page-admin) .front-creative-composer-chat{
  min-height:0;
}
html body.page-chat:not(.page-admin) .front-creative-billing-pill>span{
  min-width:0;
}
html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) .front-chat-input-frame{
  margin:0 auto;
}
html body.page-chat:not(.page-admin) .front-chat-input{
  transition:border-color .15s cubic-bezier(.16,1,.3,1),box-shadow .15s cubic-bezier(.16,1,.3,1),background .15s cubic-bezier(.16,1,.3,1);
  outline-offset:0;
}
html body.page-chat.front-creative-page:not(.page-admin) [data-front-creative-composer=chat] .front-chat-controls .front-param-trigger{
  min-width:0;
  min-height:34px;
  max-height:34px;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat:not(.jn-light-mode):not([data-theme=light]):not(.page-admin) .oc-chat-page{
  color:#f2f2f2;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat.front-creative-page:not(.jn-light-mode):not([data-theme=light]):not(.page-admin) .front-creative-composer-chat{
  border-color:#f2f2f2;
  color:#f2f2f2;
}
html:not(.jn-light-mode):not([data-theme=light]) body.page-chat.front-creative-page:not(.jn-light-mode):not([data-theme=light]):not(.page-admin) [data-front-creative-composer=chat] .front-chat-controls .front-param-trigger{
  background:rgba(255,255,255,.055);
}
@media(max-width:900px){
  html body.page-chat:not(.page-admin){
    overflow-y:auto;
  }
  html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) .front-chat-history-top{
    min-height:auto;
  }
  html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) .front-chat-history-toggle{
    min-width:max-content;
  }
  html body.page-chat:not(.page-admin) .front-creative-composer-chat{
    min-height:238px;
  }
  html body.page-chat.front-creative-page.has-front-creative-menu:not(.page-admin) .front-chat-input-frame{
    margin:0;
  }
  html.jn-light-mode body.page-chat:not(.page-admin) .front-creative-menu,
  html[data-theme=light] body.page-chat:not(.page-admin) .front-creative-menu,
  body.page-chat.jn-light-mode:not(.page-admin) .front-creative-menu,
  body.page-chat[data-theme=light]:not(.page-admin) .front-creative-menu{
    background:#fff;
    border-right-color:rgba(15,23,42,.12);
  }
}

html.jn-light-mode body.page-chat:not(.page-admin) .oc-chat-history-panel .oc-chat-history-item-title,
html[data-theme=light] body.page-chat:not(.page-admin) .oc-chat-history-panel .oc-chat-history-item-title,
body.page-chat.jn-light-mode:not(.page-admin) .oc-chat-history-panel .oc-chat-history-item-title,
body.page-chat[data-theme=light]:not(.page-admin) .oc-chat-history-panel .oc-chat-history-item-title{
  color:#0f172a;
  -webkit-text-fill-color:#0f172a;
}
html.jn-light-mode body.page-chat:not(.page-admin) .oc-chat-history-panel .oc-chat-history-search input::placeholder,
html[data-theme=light] body.page-chat:not(.page-admin) .oc-chat-history-panel .oc-chat-history-search input::placeholder,
body.page-chat.jn-light-mode:not(.page-admin) .oc-chat-history-panel .oc-chat-history-search input::placeholder,
body.page-chat[data-theme=light]:not(.page-admin) .oc-chat-history-panel .oc-chat-history-search input::placeholder{
  color:#94a3b8;
  opacity:1;
}
html body.page-chat.front-creative-page:not(.page-admin) .front-model-select>.front-param-trigger:focus-visible{
  outline:1px auto rgb(229,151,0);
  outline-offset:0;
}
html body.page-chat.front-creative-page:not(.page-admin) .front-creative-composer-keyboard:focus-visible{
  outline-offset:0;
}
html.jn-light-mode body.page-chat:not(.page-admin) .front-chat-model-options[data-param=model],
html[data-theme=light] body.page-chat:not(.page-admin) .front-chat-model-options[data-param=model],
body.page-chat.jn-light-mode:not(.page-admin) .front-chat-model-options[data-param=model],
body.page-chat[data-theme=light]:not(.page-admin) .front-chat-model-options[data-param=model]{
  overflow:hidden auto;
  background:#f8fafc;
  color:#475569;
  box-shadow:none;
}

body.page-chat.front-creative-page [data-front-creative-composer="chat"] > .front-creative-composer-inner {
  z-index: var(--lz-ai-agent-selector-layer);
}

body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer] > .front-ai-agent-selector--role-strip {
  position: absolute;
  left: 50%;
  top: calc(var(--lz-ai-agent-role-strip-offset-y) * -1);
  z-index: var(--lz-ai-agent-selector-layer);
  box-sizing: border-box;
  width: min(var(--lz-creative-composer-content-width), calc(100% - var(--lz-ai-agent-role-strip-shell-gutter)));
  margin: 0;
  padding-left: var(--lz-ai-agent-role-strip-inset-x);
  transform: translateX(-50%);
}

body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"] > .front-ai-agent-selector--role-strip {
  translate: 0 0;
  scale: 1;
  transition: translate var(--lz-ai-agent-role-strip-collapse-duration) cubic-bezier(.19, 1, .22, 1), scale var(--lz-ai-agent-role-strip-collapse-duration) cubic-bezier(.19, 1, .22, 1), opacity var(--lz-duration-fast) ease;
  will-change: translate, scale, opacity;
}

body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer][data-front-composer-collapse="1"].is-scroll-collapsed > .front-ai-agent-selector--role-strip {
  translate: 0 var(--lz-ai-agent-role-strip-collapse-offset);
  scale: var(--lz-ai-agent-role-strip-collapse-scale);
  opacity: 0;
  pointer-events: none;
}


@media (hover: hover) and (pointer: fine) and (min-width: 761px) {
  body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer] > .front-ai-agent-selector--role-strip {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--lz-duration-fast) ease, visibility var(--lz-duration-fast) ease;
  }

  body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer]:not(.is-scroll-collapsed).has-agent-strip-revealed > .front-ai-agent-selector--role-strip {
    opacity: 1;
    visibility: visible;
  }
}

@media (max-width: 760px) {
  body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer] {
    overflow: visible;
  }

  body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer] > .front-ai-agent-selector--role-strip {
    top: calc(var(--lz-ai-agent-role-strip-mobile-offset-y) * -1);
    width: calc(100% - (var(--lz-creative-composer-mobile-inline) * 2));
    padding-left: var(--lz-ai-agent-role-strip-mobile-inset-x);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    translate: 0 0;
    scale: 1;
    transition: opacity var(--lz-duration-fast) ease, visibility var(--lz-duration-fast) ease;
  }

  body:is(.page-app, .page-video).front-creative-page [data-front-creative-composer]:focus-within > .front-ai-agent-selector--role-strip {
    opacity: 1;
    visibility: visible;
  }
}

/* 2026-07-10 AI chat rich response renderer */
body.page-chat .oc-chat-content.has-rich-content {
  white-space: normal;
}

body.page-chat .oc-chat-rich {
  --oc-rich-surface: var(--oc-reply-surface, #1f2228);
  --oc-rich-surface-soft: var(--oc-reply-surface-soft, #252932);
  --oc-rich-border: var(--oc-reply-border, rgba(255, 255, 255, .10));
  --oc-rich-text: var(--oc-reply-text, #eef2f7);
  --oc-rich-muted: var(--oc-reply-muted, #9aa4b2);
  display: grid;
  gap: 12px;
  min-width: 0;
  color: var(--oc-rich-text);
}

body.page-chat .oc-chat-rich :where(p, ul, ol, blockquote, pre, table, h1, h2, h3, h4) {
  margin-top: 0;
}

body.page-chat .oc-chat-rich p {
  margin: 0;
  line-height: 1.78;
}

body.page-chat .oc-chat-rich h1,
body.page-chat .oc-chat-rich h2,
body.page-chat .oc-chat-rich h3,
body.page-chat .oc-chat-rich h4 {
  margin: 4px 0 0;
  line-height: 1.35;
  color: var(--oc-rich-text);
  -webkit-text-fill-color: var(--oc-rich-text);
  font-weight: 780;
  letter-spacing: 0;
}

body.page-chat .oc-chat-rich h1 { font-size: 20px; }
body.page-chat .oc-chat-rich h2 { font-size: 18px; }
body.page-chat .oc-chat-rich h3 { font-size: 16px; }
body.page-chat .oc-chat-rich h4 { font-size: 15px; }

body.page-chat .oc-chat-rich ul,
body.page-chat .oc-chat-rich ol {
  margin: 0;
  padding-left: 21px;
  display: grid;
  gap: 6px;
}

body.page-chat .oc-chat-rich li {
  padding-left: 2px;
  line-height: 1.72;
}

body.page-chat .oc-chat-rich blockquote {
  margin: 0;
  padding: 9px 12px;
  border-left: 3px solid rgba(250, 204, 21, .54);
  border-radius: 8px;
  background: rgba(250, 204, 21, .08);
  color: #d7dce7;
  -webkit-text-fill-color: #d7dce7;
}

body.page-chat .oc-chat-rich a {
  color: #93c5fd;
  -webkit-text-fill-color: #93c5fd;
  text-decoration: none;
  border-bottom: 1px solid rgba(147, 197, 253, .32);
}

body.page-chat .oc-chat-rich a:hover {
  color: #bfdbfe;
  -webkit-text-fill-color: #bfdbfe;
  border-bottom-color: rgba(191, 219, 254, .62);
}

body.page-chat .oc-chat-rich :not(pre) > code {
  padding: 2px 5px;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 6px;
  background: rgba(255, 255, 255, .07);
  color: #fde68a;
  -webkit-text-fill-color: #fde68a;
  font-family: Consolas, Menlo, Monaco, "Courier New", monospace;
  font-size: .92em;
}

body.page-chat .oc-chat-table-wrap {
  width: 100%;
  min-width: 0;
  overflow: auto;
  border: 1px solid var(--oc-rich-border);
  border-radius: 10px;
  background: var(--oc-rich-surface);
}

body.page-chat .oc-chat-rich-table {
  width: 100%;
  min-width: 460px;
  border-collapse: collapse;
  font-size: 13px;
  line-height: 1.5;
}

body.page-chat .oc-chat-table-tools {
  min-width: 460px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 0 8px;
  border-bottom: 1px solid var(--oc-rich-border);
  background: var(--oc-rich-surface-soft);
}

body.page-chat .oc-chat-table-tools button {
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 8px;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 7px;
  background: rgba(255, 255, 255, .055);
  color: #d8dce6;
  -webkit-text-fill-color: #d8dce6;
  font-size: 11px;
  font-weight: 760;
  cursor: pointer;
}

body.page-chat .oc-chat-table-tools svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.page-chat .oc-chat-rich-table th,
body.page-chat .oc-chat-rich-table td {
  padding: 9px 11px;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  text-align: left;
  vertical-align: top;
}

body.page-chat .oc-chat-rich-table th {
  background: rgba(255, 255, 255, .06);
  color: #f8fafc;
  -webkit-text-fill-color: #f8fafc;
  font-weight: 780;
}

body.page-chat .oc-chat-rich-table tr:last-child td {
  border-bottom: 0;
}

body.page-chat .oc-chat-artifact-card {
  --artifact-accent: #60a5fa;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--oc-rich-border);
  border-radius: 10px;
  background: var(--oc-rich-surface);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .045);
}

body.page-chat .oc-chat-artifact-card.is-ppt { --artifact-accent: #38bdf8; }
body.page-chat .oc-chat-artifact-card.is-doc { --artifact-accent: #34d399; }
body.page-chat .oc-chat-artifact-card.is-chart { --artifact-accent: #f59e0b; }
body.page-chat .oc-chat-artifact-card.is-mind { --artifact-accent: #a78bfa; }
body.page-chat .oc-chat-artifact-card.is-file { --artifact-accent: #60a5fa; }

body.page-chat .oc-chat-artifact-head {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--oc-rich-border);
  background: var(--oc-rich-surface-soft);
}

body.page-chat .oc-chat-artifact-icon {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  border: 1px solid rgba(96, 165, 250, .30);
  background: rgba(96, 165, 250, .10);
  color: var(--artifact-accent);
}

body.page-chat .oc-chat-artifact-icon svg {
  width: 16px;
  height: 16px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.page-chat .oc-chat-artifact-title {
  min-width: 0;
  flex: 1;
  display: grid;
  gap: 2px;
}

body.page-chat .oc-chat-artifact-title strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--oc-rich-text);
  -webkit-text-fill-color: var(--oc-rich-text);
  font-size: 13px;
  font-weight: 780;
}

body.page-chat .oc-chat-artifact-title span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--oc-rich-muted);
  -webkit-text-fill-color: var(--oc-rich-muted);
  font-size: 11px;
  font-weight: 650;
}

body.page-chat .oc-chat-artifact-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

body.page-chat .oc-chat-artifact-actions button,
body.page-chat .oc-chat-artifact-actions a {
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid rgba(255, 255, 255, .10);
  border-radius: 7px;
  background: rgba(255, 255, 255, .055);
  color: #d8dce6;
  -webkit-text-fill-color: #d8dce6;
  box-shadow: none;
  font-size: 11px;
  font-weight: 760;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
}

body.page-chat .oc-chat-artifact-actions button:hover,
body.page-chat .oc-chat-artifact-actions a:hover {
  border-color: rgba(96, 165, 250, .45);
  color: #fff;
  -webkit-text-fill-color: #fff;
  background: rgba(255, 255, 255, .085);
}

body.page-chat .oc-chat-artifact-actions svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.page-chat .oc-chat-artifact-body {
  padding: 12px;
  background: var(--oc-rich-surface);
}

body.page-chat .oc-chat-artifact-note {
  margin: 0;
  color: var(--oc-rich-text);
  -webkit-text-fill-color: var(--oc-rich-text);
  font-size: 13px;
  line-height: 1.7;
}

body.page-chat .oc-chat-slide-list {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  list-style: none;
}

body.page-chat .oc-chat-slide-list li {
  min-width: 0;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: start;
  gap: 9px;
}

body.page-chat .oc-chat-slide-index {
  width: 28px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: rgba(96, 165, 250, .12);
  color: var(--artifact-accent);
  -webkit-text-fill-color: var(--artifact-accent);
  font-size: 11px;
  font-weight: 820;
}

body.page-chat .oc-chat-slide-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}

body.page-chat .oc-chat-slide-copy strong,
body.page-chat .oc-chat-doc-outline strong {
  color: var(--oc-rich-text);
  -webkit-text-fill-color: var(--oc-rich-text);
  font-size: 13px;
  font-weight: 760;
}

body.page-chat .oc-chat-slide-copy span,
body.page-chat .oc-chat-doc-outline span {
  color: var(--oc-rich-muted);
  -webkit-text-fill-color: var(--oc-rich-muted);
  font-size: 12px;
  line-height: 1.55;
}

body.page-chat .oc-chat-doc-outline {
  margin: 0;
  padding: 0;
  display: grid;
  gap: 7px;
  list-style: none;
}

body.page-chat .oc-chat-doc-outline li {
  display: grid;
  gap: 2px;
  padding-left: 10px;
  border-left: 2px solid rgba(52, 211, 153, .42);
}

body.page-chat .oc-chat-chart-svg {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  overflow: visible;
}

body.page-chat .oc-chat-chart-axis {
  stroke: var(--oc-rich-border);
  stroke-width: 1;
}

body.page-chat .oc-chat-chart-label {
  fill: var(--oc-rich-muted);
  font-size: 11px;
  font-weight: 680;
}

body.page-chat .oc-chat-chart-value {
  fill: var(--oc-rich-text);
  font-size: 11px;
  font-weight: 760;
}

body.page-chat .oc-chat-chart-bar {
  fill: var(--artifact-accent);
  opacity: .86;
}

body.page-chat .oc-chat-mindmap {
  --node-bg: var(--oc-rich-surface-soft);
  --node-line: var(--oc-rich-border);
  overflow-x: auto;
  padding-bottom: 2px;
}

body.page-chat .oc-chat-mindmap ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 8px;
  list-style: none;
}

body.page-chat .oc-chat-mindmap > ul {
  padding-left: 0;
}

body.page-chat .oc-chat-mindmap li {
  position: relative;
  padding-left: 15px;
}

body.page-chat .oc-chat-mindmap li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 13px;
  width: 9px;
  border-top: 1px solid rgba(167, 139, 250, .54);
}

body.page-chat .oc-chat-mindmap > ul > li {
  padding-left: 0;
}

body.page-chat .oc-chat-mindmap > ul > li::before {
  content: none;
}

body.page-chat .oc-chat-mind-node {
  display: inline-flex;
  max-width: 320px;
  padding: 6px 9px;
  border: 1px solid var(--node-line);
  border-radius: 8px;
  background: var(--node-bg);
  color: var(--oc-rich-text);
  -webkit-text-fill-color: var(--oc-rich-text);
  font-size: 12.5px;
  font-weight: 720;
  line-height: 1.45;
}

body.page-chat .oc-chat-mindmap > ul > li > .oc-chat-mind-node {
  border-color: rgba(167, 139, 250, .42);
  background: rgba(167, 139, 250, .15);
  color: #fff;
  -webkit-text-fill-color: #fff;
}

html.jn-light-mode body.page-chat .oc-chat-rich h1,
html.jn-light-mode body.page-chat .oc-chat-rich h2,
html.jn-light-mode body.page-chat .oc-chat-rich h3,
html.jn-light-mode body.page-chat .oc-chat-rich h4,
body.page-chat.jn-light-mode .oc-chat-rich h1,
body.page-chat.jn-light-mode .oc-chat-rich h2,
body.page-chat.jn-light-mode .oc-chat-rich h3,
body.page-chat.jn-light-mode .oc-chat-rich h4 {
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
}

html.jn-light-mode body.page-chat .oc-chat-rich blockquote,
body.page-chat.jn-light-mode .oc-chat-rich blockquote {
  background: #fff7ed;
  color: #334155;
  -webkit-text-fill-color: #334155;
  border-left-color: rgba(245, 158, 11, .55);
}

html.jn-light-mode body.page-chat .oc-chat-rich :not(pre) > code,
body.page-chat.jn-light-mode .oc-chat-rich :not(pre) > code {
  background: #f8fafc;
  border-color: rgba(15, 23, 42, .12);
  color: #92400e;
  -webkit-text-fill-color: #92400e;
}

html.jn-light-mode body.page-chat .oc-chat-table-wrap,
body.page-chat.jn-light-mode .oc-chat-table-wrap {
  background: var(--oc-rich-surface, #ffffff);
  background-image: none;
  border-color: rgba(15, 23, 42, .10);
  box-shadow: 0 8px 20px rgba(15, 23, 42, .055);
}

html.jn-light-mode body.page-chat .oc-chat-artifact-card,
body.page-chat.jn-light-mode .oc-chat-artifact-card {
  background: var(--oc-rich-surface, #ffffff);
  background-image: none;
  border-color: var(--oc-rich-border, rgba(15, 23, 42, .10));
  box-shadow: 0 8px 20px rgba(15, 23, 42, .055);
}

html.jn-light-mode body.page-chat .oc-chat-artifact-head,
body.page-chat.jn-light-mode .oc-chat-artifact-head,
html.jn-light-mode body.page-chat .oc-chat-table-tools,
body.page-chat.jn-light-mode .oc-chat-table-tools,
html.jn-light-mode body.page-chat .oc-chat-rich-table th,
body.page-chat.jn-light-mode .oc-chat-rich-table th {
  background: var(--oc-rich-surface-soft, #f6f8fb);
  border-color: var(--oc-rich-border, rgba(15, 23, 42, .10));
  color: var(--oc-rich-text, #0f172a);
  -webkit-text-fill-color: var(--oc-rich-text, #0f172a);
}

html.jn-light-mode body.page-chat .oc-chat-rich-table th,
html.jn-light-mode body.page-chat .oc-chat-rich-table td,
body.page-chat.jn-light-mode .oc-chat-rich-table th,
body.page-chat.jn-light-mode .oc-chat-rich-table td {
  border-bottom-color: var(--oc-rich-border, rgba(15, 23, 42, .10));
}

html.jn-light-mode body.page-chat .oc-chat-artifact-title strong,
html.jn-light-mode body.page-chat .oc-chat-slide-copy strong,
html.jn-light-mode body.page-chat .oc-chat-doc-outline strong,
body.page-chat.jn-light-mode .oc-chat-artifact-title strong,
body.page-chat.jn-light-mode .oc-chat-slide-copy strong,
body.page-chat.jn-light-mode .oc-chat-doc-outline strong {
  color: var(--oc-rich-text, #0f172a);
  -webkit-text-fill-color: var(--oc-rich-text, #0f172a);
}

html.jn-light-mode body.page-chat .oc-chat-artifact-title span,
html.jn-light-mode body.page-chat .oc-chat-artifact-note,
html.jn-light-mode body.page-chat .oc-chat-slide-copy span,
html.jn-light-mode body.page-chat .oc-chat-doc-outline span,
body.page-chat.jn-light-mode .oc-chat-artifact-title span,
body.page-chat.jn-light-mode .oc-chat-artifact-note,
body.page-chat.jn-light-mode .oc-chat-slide-copy span,
body.page-chat.jn-light-mode .oc-chat-doc-outline span {
  color: var(--oc-rich-muted, #64748b);
  -webkit-text-fill-color: var(--oc-rich-muted, #64748b);
}

html.jn-light-mode body.page-chat .oc-chat-artifact-actions button,
html.jn-light-mode body.page-chat .oc-chat-artifact-actions a,
html.jn-light-mode body.page-chat .oc-chat-table-tools button,
body.page-chat.jn-light-mode .oc-chat-artifact-actions button,
body.page-chat.jn-light-mode .oc-chat-artifact-actions a,
body.page-chat.jn-light-mode .oc-chat-table-tools button {
  background: var(--oc-rich-surface-soft, #f6f8fb);
  border-color: var(--oc-rich-border, rgba(15, 23, 42, .10));
  color: #334155;
  -webkit-text-fill-color: #334155;
}

html.jn-light-mode body.page-chat.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],
html.jn-light-mode body.page-chat.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions a,
html.jn-light-mode body.page-chat.jn-chat-app-content-live .oc-chat-rich .oc-chat-table-tools button[data-rich-action],
body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions button[data-rich-action],
body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions a,
body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-rich .oc-chat-table-tools button[data-rich-action] {
  background: var(--oc-rich-surface-soft, #f6f8fb);
  background-color: var(--oc-rich-surface-soft, #f6f8fb);
  background-image: none;
  border: 1px solid var(--oc-rich-border, rgba(15, 23, 42, .10));
  color: #334155;
  -webkit-text-fill-color: #334155;
  box-shadow: none;
}

html.jn-light-mode body.page-chat.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions button[data-rich-action]:hover,
html.jn-light-mode body.page-chat.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions a:hover,
html.jn-light-mode body.page-chat.jn-chat-app-content-live .oc-chat-rich .oc-chat-table-tools button[data-rich-action]:hover,
body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions button[data-rich-action]:hover,
body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-rich .oc-chat-artifact-actions a:hover,
body.page-chat.jn-light-mode.jn-chat-app-content-live .oc-chat-rich .oc-chat-table-tools button[data-rich-action]:hover {
  background: var(--oc-rich-surface, #ffffff);
  border-color: var(--oc-rich-border, rgba(15, 23, 42, .10));
  color: var(--oc-rich-text, #0f172a);
  -webkit-text-fill-color: var(--oc-rich-text, #0f172a);
}

html.jn-light-mode body.page-chat.jn-chat-app-content-live:not(#lzRichLightA):not(#lzRichLightB):not(#lzRichLightC):not(#lzRichLightD):not(#lzRichLightE):not(#lzRichLightF) .oc-chat-rich .oc-chat-artifact-actions button[data-rich-action]:not(#lzRichBtnA):not(#lzRichBtnB):not(#lzRichBtnC),
html.jn-light-mode body.page-chat.jn-chat-app-content-live:not(#lzRichLightA):not(#lzRichLightB):not(#lzRichLightC):not(#lzRichLightD):not(#lzRichLightE):not(#lzRichLightF) .oc-chat-rich .oc-chat-table-tools button[data-rich-action]:not(#lzRichBtnA):not(#lzRichBtnB):not(#lzRichBtnC),
body.page-chat.jn-light-mode.jn-chat-app-content-live:not(#lzRichLightA):not(#lzRichLightB):not(#lzRichLightC):not(#lzRichLightD):not(#lzRichLightE):not(#lzRichLightF) .oc-chat-rich .oc-chat-artifact-actions button[data-rich-action]:not(#lzRichBtnA):not(#lzRichBtnB):not(#lzRichBtnC),
body.page-chat.jn-light-mode.jn-chat-app-content-live:not(#lzRichLightA):not(#lzRichLightB):not(#lzRichLightC):not(#lzRichLightD):not(#lzRichLightE):not(#lzRichLightF) .oc-chat-rich .oc-chat-table-tools button[data-rich-action]:not(#lzRichBtnA):not(#lzRichBtnB):not(#lzRichBtnC) {
  background: var(--oc-rich-surface-soft, #f6f8fb);
  background-color: var(--oc-rich-surface-soft, #f6f8fb);
  background-image: none;
  border-color: var(--oc-rich-border, rgba(15, 23, 42, .10));
  color: #334155;
  -webkit-text-fill-color: #334155;
}

html.jn-light-mode body.page-chat .oc-chat-chart-axis,
body.page-chat.jn-light-mode .oc-chat-chart-axis {
  stroke: rgba(15, 23, 42, .16);
}

html.jn-light-mode body.page-chat .oc-chat-chart-label,
html.jn-light-mode body.page-chat .oc-chat-slide-index,
body.page-chat.jn-light-mode .oc-chat-chart-label,
body.page-chat.jn-light-mode .oc-chat-slide-index {
  fill: #64748b;
  color: #64748b;
  -webkit-text-fill-color: #64748b;
}

html.jn-light-mode body.page-chat .oc-chat-chart-value,
body.page-chat.jn-light-mode .oc-chat-chart-value {
  fill: #0f172a;
}

html.jn-light-mode body.page-chat .oc-chat-mindmap,
body.page-chat.jn-light-mode .oc-chat-mindmap {
  --node-bg: #f8fafc;
  --node-line: rgba(15, 23, 42, .12);
}

html.jn-light-mode body.page-chat .oc-chat-mind-node,
body.page-chat.jn-light-mode .oc-chat-mind-node {
  color: #0f172a;
  -webkit-text-fill-color: #0f172a;
}

@media (max-width: 760px) {
  body.page-chat .oc-chat-rich {
    gap: 10px;
  }

  body.page-chat .oc-chat-artifact-head {
    align-items: flex-start;
    gap: 9px;
  }

  body.page-chat .oc-chat-artifact-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  body.page-chat .oc-chat-artifact-actions button,
  body.page-chat .oc-chat-artifact-actions a {
    height: 25px;
    padding: 0 8px;
  }

  body.page-chat .oc-chat-rich-table {
    min-width: 390px;
    font-size: 12px;
  }

body.page-chat .oc-chat-rich-table th,
body.page-chat .oc-chat-rich-table td {
    padding: 8px 9px;
  }
}

/* AI chat code syntax tinting */
body.page-chat .oc-chat-code-body .tok-keyword {
  color: #c084fc;
  -webkit-text-fill-color: #c084fc;
}

body.page-chat .oc-chat-code-body .tok-string {
  color: #86efac;
  -webkit-text-fill-color: #86efac;
}

body.page-chat .oc-chat-code-body .tok-number {
  color: #fbbf24;
  -webkit-text-fill-color: #fbbf24;
}

body.page-chat .oc-chat-code-body .tok-comment {
  color: #64748b;
  -webkit-text-fill-color: #64748b;
  font-style: italic;
}

body.page-chat .oc-chat-code-body .tok-function {
  color: #7dd3fc;
  -webkit-text-fill-color: #7dd3fc;
}

body.page-chat .oc-chat-code-body .tok-property {
  color: #f9a8d4;
  -webkit-text-fill-color: #f9a8d4;
}

body.page-chat .oc-chat-code-body .tok-operator {
  color: #94a3b8;
  -webkit-text-fill-color: #94a3b8;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-keyword,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-keyword {
  color: #7c3aed;
  -webkit-text-fill-color: #7c3aed;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-string,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-string {
  color: #047857;
  -webkit-text-fill-color: #047857;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-number,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-number {
  color: #b45309;
  -webkit-text-fill-color: #b45309;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-comment,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-comment {
  color: #64748b;
  -webkit-text-fill-color: #64748b;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-function,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-function {
  color: #0369a1;
  -webkit-text-fill-color: #0369a1;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-property,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-property {
  color: #be185d;
  -webkit-text-fill-color: #be185d;
}

html.jn-light-mode body.page-chat .oc-chat-code-body .tok-operator,
body.page-chat.jn-light-mode .oc-chat-code-body .tok-operator {
  color: #475569;
  -webkit-text-fill-color: #475569;
}

body.page-app.front-creative-page [data-front-creative-composer="image"] .front-chat-prompt-panel.front-creative-image-prompt,
body.page-app.front-creative-page [data-front-creative-composer="image"] .front-chat-prompt-wrap.front-creative-image-prompt {
  border-color: transparent;
}

html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-chat-prompt-panel.front-creative-image-prompt,
html body.page-app.front-creative-page:not(.page-admin) #mainArea .ai-draw-page [data-front-creative-composer="image"] .front-chat-prompt-wrap.front-creative-image-prompt {
  border-color: transparent;
}