:root{--of-brand: #0ea5e9;--of-brand-hover: #0284c7;--of-brand-active: #0369a1;--of-brand-soft: rgba(14, 165, 233, .12);--of-brand-border: rgba(14, 165, 233, .28);--of-accent: #14b8a6;--of-accent-hover: #0d9488;--of-accent-active: #0f766e;--of-accent-soft: rgba(20, 184, 166, .12);--of-accent-border: rgba(20, 184, 166, .28);--of-warm: #ff7a3d;--of-warm-hover: #f97316;--of-warm-active: #ea580c;--of-warm-soft: rgba(255, 122, 61, .14);--of-warm-border: rgba(255, 122, 61, .3);--of-bg: #f7fafc;--of-bg-soft: #f1f5f9;--of-surface: #ffffff;--of-surface-raised: #ffffff;--of-surface-sunken: #eef4f8;--of-surface-glass: rgba(255, 255, 255, .7);--of-border: #dde7ee;--of-divider: rgba(15, 23, 42, .08);--of-border-subtle: rgba(0, 0, 0, .05);--of-ink: #111827;--of-ink-soft: #334155;--of-ink-muted: #64748b;--of-ink-subtle: #94a3b8;--of-ink-disabled: #cbd5e1;--of-danger: #ff3b30;--of-danger-hover: #dc2626;--of-danger-active: #b91c1c;--of-danger-soft: rgba(255, 59, 48, .12);--of-danger-border: rgba(255, 59, 48, .34);--of-danger-text-on-fill: #ffffff;--of-warning: #f59e0b;--of-warning-hover: #d97706;--of-warning-active: #b45309;--of-warning-soft: rgba(245, 158, 11, .14);--of-warning-border: rgba(245, 158, 11, .32);--of-success: #10b981;--of-success-hover: #059669;--of-success-active: #047857;--of-success-soft: rgba(16, 185, 129, .12);--of-success-border: rgba(16, 185, 129, .3);--of-info: #2563eb;--of-info-hover: #1d4ed8;--of-info-active: #1e40af;--of-info-soft: rgba(37, 99, 235, .12);--of-info-border: rgba(37, 99, 235, .3);--of-playing: var(--of-brand);--of-playing-soft: var(--of-brand-soft);--of-playing-border: var(--of-brand-border);--of-like: #ff4d8d;--of-like-hover: #f43f7f;--of-like-active: #db2777;--of-like-soft: rgba(255, 77, 141, .14);--of-like-border: rgba(255, 77, 141, .3);--of-pro: #d6a548;--of-pro-hover: #c9942e;--of-pro-active: #a8741e;--of-pro-soft: rgba(214, 165, 72, .16);--of-pro-border: rgba(214, 165, 72, .35);--of-local: var(--of-warm);--of-local-soft: var(--of-warm-soft);--of-local-border: var(--of-warm-border);--of-platform-web: var(--of-warm);--of-platform-desktop: var(--of-brand);--of-platform-mobile: var(--of-accent);--of-platform-community: #8b5cf6;--of-tier-free: var(--of-ink-soft);--of-tier-plus: var(--of-brand);--of-tier-pro: var(--of-pro);--of-tier-lifetime: var(--of-warm);--of-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);--of-shadow-md: 0 8px 24px rgba(15, 23, 42, .08);--of-shadow-lg: 0 18px 48px rgba(15, 23, 42, .12);--of-glow-brand: 0 0 24px rgba(14, 165, 233, .24);--of-glow-like: 0 0 24px rgba(255, 77, 141, .22);--of-glow-danger: 0 0 24px rgba(255, 59, 48, .22);--of-page-gradient: radial-gradient(circle at 18% 12%, rgba(14, 165, 233, .12), transparent 32%), radial-gradient(circle at 82% 88%, rgba(255, 122, 61, .1), transparent 34%), linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);--of-player-gradient: radial-gradient(circle at 20% 20%, rgba(14, 165, 233, .18), transparent 36%), radial-gradient(circle at 80% 80%, rgba(255, 77, 141, .14), transparent 38%), linear-gradient(145deg, rgba(255, 255, 255, .88), rgba(247, 250, 252, .78))}[data-theme=mist]{--of-bg: #f7fafc;--of-bg-soft: #f1f5f9;--of-surface: #ffffff;--of-surface-raised: #ffffff;--of-surface-sunken: #eef4f8;--of-border: #dde7ee;--of-divider: rgba(15, 23, 42, .08);--of-ink: #1a1f2e;--of-ink-soft: #3d4556;--of-ink-muted: #6b7280;--of-ink-subtle: #9ca3af;--of-ink-disabled: #cbd5e1;--of-brand: #3d4556;--of-brand-hover: #2d3546;--of-brand-active: #1a1f2e;--of-brand-soft: rgba(61, 69, 86, .12);--of-brand-border: rgba(61, 69, 86, .28);--of-surface-shell: rgba(255, 255, 255, .95);--of-surface-sidebar: rgba(248, 250, 252, .9);--of-surface-main: rgba(255, 255, 255, .75);--of-surface-panel: rgba(250, 251, 253, .92);--of-surface-variant: rgba(248, 250, 252, .95);--of-surface-hover: rgba(255, 255, 255, .72);--of-surface-active: rgba(248, 250, 253, .96);--of-surface-dim: rgba(250, 251, 253, .88);--of-surface-card: rgba(255, 255, 255, .85);--of-focus-ring: rgba(26, 31, 46, .12);--of-selection-bg: rgba(26, 31, 46, .12);--of-state-layer-hover: rgba(26, 31, 46, .06);--of-state-layer-pressed: rgba(26, 31, 46, .12);--of-shadow-sm: 0 2px 8px -2px rgba(26, 31, 46, .06);--of-shadow-md: 0 8px 24px -8px rgba(26, 31, 46, .08);--of-shadow-lg: 0 32px 64px -12px rgba(26, 31, 46, .12);--of-radius-sm: .5rem;--of-radius-md: .75rem;--of-radius-lg: 1rem;--of-radius-xl: 1.5rem;--of-radius-2xl: 2rem;--of-scrollbar-idle: rgba(26, 31, 46, 0);--of-scrollbar-hover: rgba(26, 31, 46, .26);--of-scrollbar-active: rgba(26, 31, 46, .38)}[data-theme=paper]{--of-bg: #fafaf8;--of-bg-soft: #f5f5f3;--of-surface: #ffffff;--of-surface-raised: #ffffff;--of-surface-sunken: #f0f0ee;--of-border: #e5e5e3;--of-divider: rgba(0, 0, 0, .06);--of-ink: #1a1a1a;--of-ink-soft: #2c2c2c;--of-ink-muted: #8c8c8c;--of-ink-subtle: #bfbfbf;--of-ink-disabled: #d4d4d4;--of-brand: #2c2c2c;--of-brand-hover: #1a1a1a;--of-brand-active: #000000;--of-brand-soft: rgba(44, 44, 44, .08);--of-brand-border: rgba(44, 44, 44, .2);--of-surface-shell: #fafaf8;--of-surface-sidebar: #f5f5f3;--of-surface-main: #ffffff;--of-surface-panel: #fafaf8;--of-surface-variant: #f0f0ee;--of-surface-hover: rgba(0, 0, 0, .03);--of-surface-active: rgba(0, 0, 0, .05);--of-surface-dim: rgba(0, 0, 0, .02);--of-surface-card: #ffffff;--of-focus-ring: rgba(0, 0, 0, .12);--of-selection-bg: rgba(0, 0, 0, .08);--of-state-layer-hover: rgba(0, 0, 0, .04);--of-state-layer-pressed: rgba(0, 0, 0, .08);--of-shadow-sm: 0 2px 8px -2px rgba(0, 0, 0, .04);--of-shadow-md: 0 8px 24px -8px rgba(0, 0, 0, .06);--of-shadow-lg: 0 20px 60px -15px rgba(0, 0, 0, .08);--of-radius-sm: .375rem;--of-radius-md: .5rem;--of-radius-lg: .75rem;--of-radius-xl: 1rem;--of-radius-2xl: 1.5rem;--of-scrollbar-idle: rgba(0, 0, 0, 0);--of-scrollbar-hover: rgba(0, 0, 0, .2);--of-scrollbar-active: rgba(0, 0, 0, .35)}[data-theme=material]{--of-bg: #fffbfe;--of-bg-soft: #f7f2fa;--of-surface: #ffffff;--of-surface-raised: #ffffff;--of-surface-sunken: #f6f1fa;--of-border: #e7e0ec;--of-divider: rgba(28, 27, 31, .12);--of-ink: #1c1b1f;--of-ink-soft: #49454f;--of-ink-muted: #79747e;--of-ink-subtle: #a8a29e;--of-ink-disabled: #cac4d0;--of-brand: #6750a4;--of-brand-hover: #5a4594;--of-brand-active: #381e72;--of-brand-soft: rgba(103, 80, 164, .14);--of-brand-border: rgba(103, 80, 164, .32);--of-playing: var(--of-brand);--of-playing-soft: var(--of-brand-soft);--of-playing-border: var(--of-brand-border);--of-surface-shell: #fffbfe;--of-surface-sidebar: #f7f2fa;--of-surface-main: #ffffff;--of-surface-panel: #fffbfe;--of-surface-variant: #e7e0ec;--of-surface-hover: rgba(103, 80, 164, .08);--of-surface-active: rgba(103, 80, 164, .12);--of-surface-dim: rgba(250, 247, 254, .88);--of-surface-card: rgba(255, 251, 254, .95);--of-focus-ring: rgba(103, 80, 164, .12);--of-selection-bg: rgba(103, 80, 164, .2);--of-state-layer-hover: rgba(103, 80, 164, .08);--of-state-layer-pressed: rgba(103, 80, 164, .12);--of-shadow-sm: 0 2px 4px -1px rgba(103, 80, 164, .2), 0 4px 5px 0 rgba(103, 80, 164, .14), 0 1px 10px 0 rgba(103, 80, 164, .12);--of-shadow-md: 0 3px 5px -1px rgba(103, 80, 164, .2), 0 6px 10px 0 rgba(103, 80, 164, .14), 0 1px 18px 0 rgba(103, 80, 164, .12);--of-shadow-lg: 0 8px 10px -5px rgba(103, 80, 164, .2), 0 16px 24px 2px rgba(103, 80, 164, .14), 0 6px 30px 5px rgba(103, 80, 164, .12);--of-elevation-1: 0 1px 2px rgba(103, 80, 164, .3), 0 1px 3px 1px rgba(103, 80, 164, .15);--of-elevation-2: 0 1px 2px rgba(103, 80, 164, .3), 0 2px 6px 2px rgba(103, 80, 164, .15);--of-elevation-3: 0 4px 8px 3px rgba(103, 80, 164, .15), 0 1px 3px rgba(103, 80, 164, .3);--of-elevation-4: 0 6px 10px 4px rgba(103, 80, 164, .15), 0 2px 3px rgba(103, 80, 164, .3);--of-elevation-5: 0 8px 12px 6px rgba(103, 80, 164, .15), 0 4px 4px rgba(103, 80, 164, .3);--of-radius-sm: .25rem;--of-radius-md: .5rem;--of-radius-lg: .75rem;--of-radius-xl: 1.5rem;--of-radius-2xl: 2rem;--of-scrollbar-idle: rgba(103, 80, 164, 0);--of-scrollbar-hover: rgba(103, 80, 164, .26);--of-scrollbar-active: rgba(103, 80, 164, .38)}html[data-effective-color-scheme=dark]{--of-bg: #080c12;--of-bg-soft: #0d131c;--of-surface: #111827;--of-surface-raised: #172033;--of-surface-sunken: #0b111a;--of-border: rgba(148, 163, 184, .18);--of-divider: rgba(148, 163, 184, .12);--of-ink: #f8fafc;--of-ink-soft: #cbd5e1;--of-ink-muted: #94a3b8;--of-ink-subtle: #64748b;--of-ink-disabled: #475569;--of-brand: #38bdf8;--of-brand-hover: #7dd3fc;--of-brand-active: #0ea5e9;--of-brand-soft: rgba(56, 189, 248, .16);--of-brand-border: rgba(56, 189, 248, .34);--of-accent: #2dd4bf;--of-accent-hover: #5eead4;--of-accent-soft: rgba(45, 212, 191, .16);--of-accent-border: rgba(45, 212, 191, .34);--of-warm: #fb923c;--of-warm-hover: #fdba74;--of-warm-soft: rgba(251, 146, 60, .16);--of-warm-border: rgba(251, 146, 60, .34);--of-danger: #ff6b5e;--of-danger-hover: #ff8a80;--of-danger-soft: rgba(255, 107, 94, .16);--of-danger-border: rgba(255, 107, 94, .36);--of-warning: #fbbf24;--of-warning-hover: #fcd34d;--of-warning-soft: rgba(251, 191, 36, .16);--of-warning-border: rgba(251, 191, 36, .36);--of-success: #34d399;--of-success-hover: #6ee7b7;--of-success-soft: rgba(52, 211, 153, .16);--of-success-border: rgba(52, 211, 153, .36);--of-info: #60a5fa;--of-info-hover: #93c5fd;--of-info-soft: rgba(96, 165, 250, .16);--of-info-border: rgba(96, 165, 250, .36);--of-like: #ff6fa3;--of-like-hover: #ff8db8;--of-like-soft: rgba(255, 111, 163, .16);--of-like-border: rgba(255, 111, 163, .36);--of-pro: #e2b866;--of-pro-hover: #f0cb84;--of-pro-soft: rgba(226, 184, 102, .18);--of-pro-border: rgba(226, 184, 102, .38);--of-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--of-shadow-md: 0 8px 24px rgba(0, 0, 0, .4);--of-shadow-lg: 0 18px 48px rgba(0, 0, 0, .5);--of-glow-brand: 0 0 24px rgba(56, 189, 248, .3);--of-glow-like: 0 0 24px rgba(255, 111, 163, .3);--of-glow-danger: 0 0 24px rgba(255, 107, 94, .3);--of-page-gradient: radial-gradient(circle at 18% 12%, rgba(56, 189, 248, .14), transparent 34%), radial-gradient(circle at 82% 88%, rgba(20, 184, 166, .1), transparent 36%), linear-gradient(180deg, #080c12 0%, #0d131c 100%);--of-player-gradient: radial-gradient(circle at 20% 20%, rgba(56, 189, 248, .2), transparent 36%), radial-gradient(circle at 80% 80%, rgba(255, 111, 163, .14), transparent 38%), linear-gradient(145deg, rgba(17, 24, 39, .88), rgba(13, 19, 28, .78));--of-surface-shell: rgba(22, 25, 31, .85);--of-surface-sidebar: rgba(18, 20, 25, .65);--of-surface-main: rgba(22, 25, 31, .4);--of-surface-panel: rgba(26, 30, 38, .85);--of-surface-variant: rgba(30, 35, 43, .95);--of-surface-hover: rgba(255, 255, 255, .05);--of-surface-active: rgba(255, 255, 255, .08);--of-surface-dim: rgba(0, 0, 0, .25);--of-surface-card: rgba(255, 255, 255, .03);--of-surface-glass: rgba(13, 18, 27, .8);--of-border-subtle: rgba(255, 255, 255, .08);--of-focus-ring: rgba(56, 189, 248, .4);--of-selection-bg: rgba(56, 189, 248, .2);--of-state-layer-hover: rgba(255, 255, 255, .06);--of-state-layer-pressed: rgba(255, 255, 255, .1);--of-scrollbar-idle: rgba(255, 255, 255, 0);--of-scrollbar-hover: rgba(255, 255, 255, .2);--of-scrollbar-active: rgba(255, 255, 255, .35)}[data-page-context=tools]{--of-brand: var(--of-info);--of-brand-hover: var(--of-info-active);--of-brand-active: var(--of-info-active);--of-brand-soft: var(--of-info-soft);--of-brand-border: var(--of-info-border)}html[data-theme=material][data-effective-color-scheme=dark]{--of-brand: #d0bcff;--of-brand-hover: #eaddff;--of-brand-active: #6750a4;--of-brand-soft: rgba(208, 188, 255, .16);--of-brand-border: rgba(208, 188, 255, .34);--of-playing: var(--of-brand);--of-playing-soft: var(--of-brand-soft);--of-playing-border: var(--of-brand-border);--of-surface-shell: rgba(22, 18, 32, .92);--of-surface-sidebar: rgba(18, 14, 28, .7);--of-surface-main: rgba(22, 18, 32, .4);--of-surface-panel: rgba(28, 24, 38, .88);--of-shadow-sm: 0 2px 4px -1px rgba(0, 0, 0, .3), 0 4px 5px 0 rgba(0, 0, 0, .2);--of-shadow-md: 0 3px 5px -1px rgba(0, 0, 0, .3), 0 6px 10px 0 rgba(0, 0, 0, .2);--of-shadow-lg: 0 8px 10px -5px rgba(0, 0, 0, .3), 0 16px 24px 2px rgba(0, 0, 0, .2)}html[data-area=site]{--of-page-gradient: linear-gradient(180deg, #ffffff 0%, #f5f8fa 100%);--of-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .05);--of-shadow-md: 0 2px 4px rgba(16, 24, 40, .04), 0 10px 28px rgba(16, 24, 40, .08);--of-shadow-lg: 0 4px 10px rgba(16, 24, 40, .05), 0 24px 56px rgba(16, 24, 40, .12)}html[data-area=site][data-effective-color-scheme=dark]{--of-page-gradient: linear-gradient(180deg, #0a0e14 0%, #0d1218 100%);--of-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3), 0 1px 3px rgba(0, 0, 0, .35);--of-shadow-md: 0 2px 4px rgba(0, 0, 0, .3), 0 10px 28px rgba(0, 0, 0, .45);--of-shadow-lg: 0 4px 10px rgba(0, 0, 0, .35), 0 24px 56px rgba(0, 0, 0, .55)}html[data-area=site][data-effective-color-scheme=dark] body{background:var(--of-page-gradient)}:root{--of-btn-primary-bg: var(--of-brand);--of-btn-primary-bg-hover: var(--of-brand-hover);--of-btn-primary-bg-active: var(--of-brand-active);--of-btn-primary-text: #ffffff;--of-btn-secondary-bg: var(--of-surface);--of-btn-secondary-bg-hover: var(--of-bg-soft);--of-btn-secondary-text: var(--of-ink-soft);--of-btn-secondary-text-hover: var(--of-ink);--of-btn-secondary-border: var(--of-border);--of-btn-danger-bg: var(--of-danger);--of-btn-danger-bg-hover: var(--of-danger-hover);--of-btn-danger-bg-active: var(--of-danger-active);--of-btn-danger-text: var(--of-danger-text-on-fill);--of-btn-danger-soft-bg: var(--of-danger-soft);--of-btn-danger-soft-text: var(--of-danger);--of-btn-danger-soft-border: var(--of-danger-border);--of-player-current-text: var(--of-playing);--of-player-current-bg: var(--of-playing-soft);--of-player-current-border: var(--of-playing-border);--of-player-progress: var(--of-playing);--of-player-progress-bg: var(--of-border);--of-player-control-text: var(--of-ink-muted);--of-player-control-text-hover: var(--of-playing);--of-player-control-bg-hover: var(--of-playing-soft);--of-like-button-text: var(--of-ink-muted);--of-like-button-text-active: var(--of-like);--of-like-button-bg-active: var(--of-like-soft);--of-like-button-border-active: var(--of-like-border);--of-badge-pro-text: var(--of-pro);--of-badge-pro-bg: var(--of-pro-soft);--of-badge-pro-border: var(--of-pro-border);--of-card-bg: var(--of-surface);--of-card-bg-hover: var(--of-surface-raised);--of-card-border: var(--of-border);--of-card-shadow: var(--of-shadow-sm);--of-card-shadow-hover: var(--of-shadow-md);--of-dialog-bg: var(--of-surface);--of-dialog-header-bg: var(--of-ink);--of-dialog-header-text: #ffffff;--of-dialog-border: var(--of-border);--of-dialog-shadow: var(--of-shadow-lg);--of-dialog-overlay: rgba(0, 0, 0, .5);--of-input-bg: var(--of-surface-sunken);--of-input-bg-focus: var(--of-surface);--of-input-border: var(--of-border);--of-input-border-focus: var(--of-brand);--of-input-text: var(--of-ink);--of-input-placeholder: var(--of-ink-subtle);--of-md-note: var(--of-info);--of-md-note-bg: var(--of-info-soft);--of-md-note-border: var(--of-info-border);--of-md-tip: var(--of-success);--of-md-tip-bg: var(--of-success-soft);--of-md-tip-border: var(--of-success-border);--of-md-warning: var(--of-warning);--of-md-warning-bg: var(--of-warning-soft);--of-md-warning-border: var(--of-warning-border);--of-md-caution: var(--of-danger);--of-md-caution-bg: var(--of-danger-soft);--of-md-caution-border: var(--of-danger-border);--of-md-important: var(--of-brand);--of-md-important-bg: var(--of-brand-soft);--of-md-important-border: var(--of-brand-border);--of-sidebar-bg: var(--of-surface);--of-sidebar-border: var(--of-border);--of-sidebar-item-text: var(--of-ink-soft);--of-sidebar-item-text-active: var(--of-ink);--of-sidebar-item-bg-active: var(--of-brand-soft);--of-track-bg: transparent;--of-track-bg-hover: var(--of-bg-soft);--of-track-bg-active: var(--of-playing-soft);--of-track-border-active: var(--of-playing-border);--of-track-text: var(--of-ink);--of-track-text-secondary: var(--of-ink-muted);--of-tag-web: var(--of-platform-web);--of-tag-desktop: var(--of-platform-desktop);--of-tag-mobile: var(--of-platform-mobile);--of-tag-community: var(--of-platform-community);--of-pricing-free: var(--of-tier-free);--of-pricing-plus: var(--of-tier-plus);--of-pricing-pro: var(--of-tier-pro);--of-pricing-lifetime: var(--of-tier-lifetime);--of-scrollbar-idle: rgba(0, 0, 0, 0);--of-scrollbar-hover: rgba(0, 0, 0, .2);--of-scrollbar-active: rgba(0, 0, 0, .35);--of-tool-notice-error-bg: var(--of-danger-soft);--of-tool-notice-error-text: var(--of-danger);--of-tool-notice-error-border: var(--of-danger-border);--of-tool-notice-warning-bg: var(--of-warning-soft);--of-tool-notice-warning-text: var(--of-warning);--of-tool-notice-warning-border: var(--of-warning-border);--of-tool-notice-info-bg: var(--of-info-soft);--of-tool-notice-info-text: var(--of-info);--of-tool-notice-info-border: var(--of-info-border);--of-tool-notice-success-bg: var(--of-success-soft);--of-tool-notice-success-text: var(--of-success-active);--of-tool-notice-success-border: var(--of-success-border);--of-tool-callout-bg-from: var(--of-info-soft);--of-tool-callout-bg-to: var(--of-surface);--of-tool-callout-accent: var(--of-info);--of-tool-callout-accent-hover: var(--of-info-active)}html[data-effective-color-scheme=dark]{--of-scrollbar-idle: rgba(255, 255, 255, 0);--of-scrollbar-hover: rgba(255, 255, 255, .2);--of-scrollbar-active: rgba(255, 255, 255, .35)}[data-page-context=tools]{--of-tool-surface: var(--of-surface);--of-tool-well: var(--of-bg-soft);--of-tool-line: var(--of-border);--of-tool-ink: var(--of-ink);--of-tool-ink-muted: var(--of-ink-muted);--of-tool-ink-subtle: var(--of-ink-subtle);--of-tool-action: var(--of-brand);--of-tool-action-hover: var(--of-brand-hover);--of-tool-on-action: var(--of-brand-contrast, var(--of-btn-primary-text));--of-tool-active: var(--of-warm);--of-tool-active-soft: var(--of-warm-soft);--of-tool-active-border: var(--of-warm-border);--of-tool-on-active: var(--of-brand-contrast, var(--of-btn-primary-text));--of-tool-ok: var(--of-success-active);--of-tool-ok-soft: color-mix(in srgb, var(--of-success) 9%, var(--of-surface));--of-tool-ok-border: color-mix(in srgb, var(--of-success) 32%, var(--of-border));--of-tool-warn: var(--of-warning-active);--of-tool-warn-soft: color-mix(in srgb, var(--of-warning) 11%, var(--of-surface));--of-tool-warn-border: color-mix(in srgb, var(--of-warning) 38%, var(--of-border));--of-tool-error: var(--of-danger-active);--of-tool-error-soft: color-mix(in srgb, var(--of-danger) 8%, var(--of-surface));--of-tool-error-border: color-mix(in srgb, var(--of-danger) 34%, var(--of-border));--of-tool-paper: var(--of-home-doodle-paper, var(--of-bg-soft));--of-tool-grid: var(--of-home-doodle-grid, var(--of-border));--of-tool-sticker: var(--of-home-doodle-warm, var(--of-warm));--of-tool-pixel-ink: var(--of-home-doodle-ink, var(--of-ink));--of-tool-pixel-warm: var(--of-home-doodle-warm, var(--of-warm));--of-tool-pixel-lime: var(--of-home-doodle-lime, var(--of-success));--of-tool-pixel-sky: var(--of-home-doodle-sky, var(--of-info));--of-tool-pixel-light: var(--of-home-doodle-light, var(--of-surface));--of-tool-pixel-muted: var(--of-home-doodle-muted, var(--of-border));--of-tool-focus: var(--of-focus-ring);--of-tool-radius-lg: 20px;--of-tool-radius-md: 14px;--of-tool-radius-sm: 10px;--of-tool-ease: cubic-bezier(.22, 1, .36, 1)}html[data-effective-color-scheme=dark] [data-page-context=tools]{--of-tool-ok: var(--of-success);--of-tool-warn: var(--of-warning);--of-tool-error: var(--of-danger)}html[data-area=site],html[data-area=site] #app{--font-family: var(--of-site-font);--of-bg: var(--of-home-bg);--of-bg-soft: var(--of-home-surface);--of-surface: var(--of-home-card);--of-surface-raised: var(--of-home-card);--of-surface-sunken: var(--of-home-surface);--of-surface-hover: var(--of-home-nav-hover);--of-surface-active: var(--of-home-nav-hover);--of-surface-glass: var(--of-home-nav-glass);--of-border: var(--of-home-line);--of-divider: var(--of-home-line);--of-border-subtle: var(--of-home-line);--of-ink: var(--of-home-ink);--of-ink-soft: var(--of-home-muted);--of-ink-muted: var(--of-home-muted);--of-ink-subtle: var(--of-home-subtle);--of-ink-disabled: var(--of-home-subtle);--of-brand: var(--of-home-button);--of-brand-hover: var(--of-home-button-hover);--of-brand-active: var(--of-home-button-hover);--of-brand-contrast: var(--of-home-on-button);--of-brand-soft: var(--of-home-surface);--of-brand-border: var(--of-home-line);--of-warm: var(--of-home-warm);--of-warm-hover: var(--of-home-warm);--of-warm-active: var(--of-home-warm);--of-warm-soft: var(--of-home-warm-soft);--of-warm-border: color-mix(in srgb, var(--of-home-warm) 20%, var(--of-home-line));--of-page-gradient: var(--of-home-bg);--of-focus-ring: var(--of-home-focus);--of-radius-md: 14px;--of-radius-lg: 20px;--of-site-header-height: calc(60px + max(14px, env(safe-area-inset-top))) ;--font-weight-normal: 400;color:var(--of-home-ink);background:var(--of-home-bg);font-family:var(--of-site-font)}html[data-area=site] body{background:var(--of-home-bg);font-family:var(--of-site-font)}html[data-area=site] #app [data-page-context=tools]{--of-brand: var(--of-home-button);--of-brand-hover: var(--of-home-button-hover);--of-brand-active: var(--of-home-button-hover);--of-brand-soft: var(--of-home-surface);--of-brand-border: var(--of-home-line)}[data-page-context=tools] :is(button,input,label):is(:focus-visible,:focus-within){box-shadow:none}html[data-area=site] #app :is(.pp-wrap,.docs-page,.tutorials-page){--of-site-tools-height: 68px;--bg: var(--of-home-bg);--border: var(--of-home-line);--text: var(--of-home-ink);--text-muted: var(--of-home-muted);--text-faint: var(--of-home-subtle);--text-body: var(--of-home-muted);--dp-bg: var(--of-home-bg);--dp-sidebar-bg: var(--of-home-bg);--dp-surface: var(--of-home-card);--dp-border: var(--of-home-line);--dp-text: var(--of-home-ink);--dp-text-2: var(--of-home-muted);--dp-text-3: var(--of-home-subtle);--dp-accent: var(--of-home-warm);--dp-accent-2: var(--of-home-warm-soft);--dp-hover: var(--of-home-nav-hover);--dp-active-text: var(--of-home-warm);--dp-surface-raised: var(--of-home-surface);--dp-inline-code: var(--of-home-surface);--dp-inline-code-text: var(--of-home-warm)}html[data-area=site] #app :is(.download-page,.seo-page,.pp-wrap,.docs-page,.tutorials-page,.survey-page){background:var(--of-home-bg);color:var(--of-home-ink);font-family:var(--of-site-font);font-size:15px;line-height:1.65;scroll-padding-top:calc(var(--of-site-header-height) + 16px);overflow-x:clip}html[data-area=site] #app :is(.tools-index,.tool-page){height:100dvh;overflow-y:auto;overflow-x:clip;scroll-padding-top:calc(var(--of-site-header-height) + 16px)}html[data-area=site] #app :has(>:is(.site-nav,.reading-toolbar):focus-within){scroll-padding-top:0}html[data-area=site] #app .download-page-inner{width:min(760px,calc(100% - 64px));max-width:none;gap:24px;padding:54px 0 44px}html[data-area=site] #app .download-header{width:100%;align-items:flex-start;text-align:left;gap:14px;margin-bottom:12px}html[data-area=site] #app .download-header h1{font-size:clamp(36px,5vw,54px);font-weight:600;line-height:1.2;letter-spacing:-.045em}html[data-area=site] #app .download-header :is(h1,p){margin:0}html[data-area=site] #app :is(.download-sub,.download-meta,.download-release-status,.download-release-meta-row span,.download-release-sha-label,.download-release-sha-value,.download-ms-store__label,.download-notice,.changelog-empty,.changelog-entry-date){color:var(--of-home-muted)}html[data-area=site] #app .migration-notice{padding:24px 28px;border:1px solid var(--of-home-line);background:var(--of-home-surface);border-radius:20px}html[data-area=site] #app .migration-notice-legacy{font-weight:400}html[data-area=site] #app :is(.download-card,.changelog-entry,.support-notice){border:1px solid var(--of-home-line);background:var(--of-home-card);border-radius:20px;box-shadow:none;color:var(--of-home-ink)}html[data-area=site] #app .support-notice{padding:30px 32px}html[data-area=site] #app .support-notice h2{font-size:clamp(24px,3vw,30px);font-weight:600;line-height:1.45;letter-spacing:-.035em}html[data-area=site] #app .support-notice p{color:var(--of-home-muted);font-size:14px}html[data-area=site] #app .support-notice__eyebrow{color:var(--of-home-warm);font-weight:500;letter-spacing:0}html[data-area=site] #app .support-notice__note{padding:12px 16px;border:0;border-radius:12px;background:var(--of-home-surface)}html[data-area=site] #app :is(.support-notice button,.download-btn:not(.download-btn--disabled)){min-height:44px;border:0;border-radius:999px;background:var(--of-home-button);color:var(--of-home-on-button)}html[data-area=site] #app .support-notice button{width:auto;padding:11px 22px;font-size:13px}html[data-area=site] #app :is(.changelog-title,.changelog-entry-version,.changelog-entry-item){color:var(--of-home-ink)}html[data-area=site] #app .changelog-title{font-size:17px;letter-spacing:0;font-weight:600}html[data-area=site] #app :is(.download-release-details,.download-ms-store){border-color:var(--of-home-line)}html[data-area=site] #app :is(.seo-content,.pp-body){max-width:960px;padding-top:54px}html[data-area=site] #app .pp-body{max-width:800px}html[data-area=site] #app .pp-header{gap:14px;margin-bottom:36px}html[data-area=site] #app :is(.pp-title,.pp-updated){margin:0}html[data-area=site] #app .pp-article .md-renderer{display:block;padding:0;max-width:none}html[data-area=site] #app :is(.seo-hero h1,.pp-title,.tools-index__hero-title){font-size:clamp(34px,4.6vw,54px);font-weight:600;line-height:1.3;letter-spacing:-.04em}html[data-area=site] #app .seo-hero{padding:0 0 36px;text-align:left}html[data-area=site] #app .seo-hero h1{max-width:800px;margin:0 0 20px;background:none;color:var(--of-home-ink);-webkit-text-fill-color:currentColor}html[data-area=site] #app .seo-hero-sub{max-width:680px;margin:0}html[data-area=site] #app .seo-badge{margin-bottom:18px;background:var(--of-home-warm-soft);color:var(--of-home-warm)}html[data-area=site] #app :is(.seo-hero-sub,.seo-section p,.seo-card p,.seo-section li,.seo-cta p){color:var(--of-home-muted)}html[data-area=site] #app :is(.seo-section,.seo-related,.seo-related a,.pp-footer){border-color:var(--of-home-line)}html[data-area=site] #app :is(.seo-card,.seo-cta){background:var(--of-home-surface);border:1px solid var(--of-home-line);border-radius:20px;box-shadow:none}html[data-area=site] #app :is(.seo-card h3,.seo-section h2,.seo-cta h2){color:var(--of-home-ink);font-weight:600}html[data-area=site] #app .seo-page .btn{border-radius:999px;min-height:44px}html[data-area=site] #app .seo-page .btn--primary{background:var(--of-home-button);color:var(--of-home-on-button)}html[data-area=site] #app .seo-page .btn--subtle{background:var(--of-home-card);color:var(--of-home-ink);border-color:var(--of-home-line)}html[data-area=site] #app .tool-hero__title{font-size:clamp(30px,3.4vw,44px);font-weight:600;letter-spacing:-.035em}html[data-area=site] #app .tool-page__main{padding-top:30px}html[data-area=site] #app .survey-page{--survey-glass-bg: var(--of-home-card);--survey-panel-bg: var(--of-home-card);--survey-panel-border: var(--of-home-line);--survey-choice-bg: var(--of-home-surface);--survey-choice-bg-hover: var(--of-home-nav-hover);--survey-submit-bg: var(--of-home-card);--survey-shadow: none;--survey-scrollbar-track: var(--of-home-surface);--survey-scrollbar-thumb: var(--of-home-line);--survey-scrollbar-thumb-hover: var(--of-home-subtle)}html[data-area=site] #app .survey-shell--empty{min-height:min(520px,65dvh)}html[data-area=site] #app :is(.survey-hero h1,.survey-empty h1){font-weight:600;letter-spacing:-.035em}html[data-area=site] #app :is(.survey-submit-btn,.survey-secondary-btn){border-radius:999px;font-weight:600}html[data-area=site] #app .survey-page:before,html[data-area=site] #app .survey-page:after{display:none}html[data-area=site] #app .survey-page .home-footer{position:relative;z-index:1}@media(max-width:767px){html[data-area=site],html[data-area=site] #app{--of-site-header-height: calc(56px + max(10px, env(safe-area-inset-top))) }html[data-area=site] #app .download-page-inner{width:calc(100% - 40px);padding-top:32px;gap:18px}html[data-area=site] #app .migration-notice{padding:22px}html[data-area=site] #app .support-notice{padding:24px}html[data-area=site] #app :is(.seo-content,.pp-body){padding-top:32px}}@media(prefers-reduced-motion:reduce){html[data-area=site] #app :is(.download-page,.seo-page,.pp-wrap,.docs-page,.tutorials-page,.tools-index,.tool-page){scroll-behavior:auto}}