html[data-theme=catppuccin-latte]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ctp-rosewater:#dc8a78;--ctp-flamingo:#dd7878;--ctp-pink:#ea76cb;--ctp-mauve:#8839ef;--ctp-red:#d20f39;--ctp-maroon:#e64553;--ctp-peach:#fe640b;--ctp-yellow:#df8e1d;--ctp-green:#40a02b;--ctp-teal:#179299;--ctp-sky:#04a5e5;--ctp-sapphire:#209fb5;--ctp-blue:#1e66f5;--ctp-lavender:#7287fd;--ctp-text:#4c4f69;--ctp-subtext-1:#5c5f77;--ctp-subtext-0:#6c6f85;--ctp-overlay-2:#7c7f93;--ctp-overlay-1:#8c8fa1;--ctp-overlay-0:#9ca0b0;--ctp-surface-2:#acb0be;--ctp-surface-1:#bcc0cc;--ctp-surface-0:#ccd0da;--ctp-base:#eff1f5;--ctp-mantle:#e6e9ef;--ctp-crust:#dce0e8;--color-page:var(--ctp-base);--color-header:color-mix(in srgb, var(--ctp-mantle) 92%, transparent);--color-panel:color-mix(in srgb, white 67%, var(--ctp-base));--color-panel-solid:#f8f9fb;--color-elevated:white;--color-muted:var(--ctp-mantle);--color-muted-strong:var(--ctp-crust);--color-border:var(--ctp-surface-1);--color-border-soft:var(--ctp-surface-0);--color-text:var(--ctp-text);--color-text-soft:var(--ctp-subtext-1);--color-text-muted:#696c82;--color-primary:var(--ctp-mauve);--color-on-accent:#fff;--color-primary-hover:#7728d9;--color-primary-soft:color-mix(in srgb, var(--ctp-mauve) 11%, transparent);--color-blue:var(--ctp-blue);--color-blue-soft:color-mix(in srgb, var(--ctp-blue) 11%, transparent);--color-green:var(--ctp-green);--color-green-soft:color-mix(in srgb, var(--ctp-green) 12%, transparent);--color-peach:var(--ctp-peach);--color-peach-soft:color-mix(in srgb, var(--ctp-peach) 11%, transparent);--color-danger:var(--ctp-red);--color-danger-hover:#b80d32;--color-danger-soft:color-mix(in srgb, var(--ctp-red) 9%, transparent);--color-success:#2d731e;--color-weekend:color-mix(in srgb, var(--ctp-rosewater) 9%, white);--shadow-sm:0 4px 14px #4c4f691a;--shadow-md:0 18px 50px #4c4f692e;--shadow-lg:0 30px 80px #4c4f694d}html[data-theme=catppuccin-mocha]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ctp-rosewater:#f5e0dc;--ctp-flamingo:#f2cdcd;--ctp-pink:#f5c2e7;--ctp-mauve:#cba6f7;--ctp-red:#f38ba8;--ctp-maroon:#eba0ac;--ctp-peach:#fab387;--ctp-yellow:#f9e2af;--ctp-green:#a6e3a1;--ctp-teal:#94e2d5;--ctp-sky:#89dceb;--ctp-sapphire:#74c7ec;--ctp-blue:#89b4fa;--ctp-lavender:#b4befe;--ctp-text:#cdd6f4;--ctp-subtext-1:#bac2de;--ctp-subtext-0:#a6adc8;--ctp-overlay-2:#9399b2;--ctp-overlay-1:#7f849c;--ctp-overlay-0:#6c7086;--ctp-surface-2:#585b70;--ctp-surface-1:#45475a;--ctp-surface-0:#313244;--ctp-base:#1e1e2e;--ctp-mantle:#181825;--ctp-crust:#11111b;--color-page:var(--ctp-base);--color-header:color-mix(in srgb, var(--ctp-mantle) 92%, transparent);--color-panel:color-mix(in srgb, var(--ctp-surface-0) 72%, var(--ctp-base));--color-panel-solid:#262638;--color-elevated:var(--ctp-surface-0);--color-muted:var(--ctp-mantle);--color-muted-strong:var(--ctp-crust);--color-border:var(--ctp-surface-1);--color-border-soft:var(--ctp-surface-0);--color-text:var(--ctp-text);--color-text-soft:var(--ctp-subtext-1);--color-text-muted:var(--ctp-overlay-2);--color-primary:var(--ctp-mauve);--color-on-accent:var(--ctp-crust);--color-primary-hover:#b890eb;--color-primary-soft:color-mix(in srgb, var(--ctp-mauve) 14%, transparent);--color-blue:var(--ctp-blue);--color-blue-soft:color-mix(in srgb, var(--ctp-blue) 14%, transparent);--color-green:var(--ctp-green);--color-green-soft:color-mix(in srgb, var(--ctp-green) 14%, transparent);--color-peach:var(--ctp-peach);--color-peach-soft:color-mix(in srgb, var(--ctp-peach) 14%, transparent);--color-danger:var(--ctp-red);--color-danger-hover:#ff9bb5;--color-danger-soft:color-mix(in srgb, var(--ctp-red) 13%, transparent);--color-success:var(--ctp-green);--color-weekend:color-mix(in srgb, var(--ctp-rosewater) 7%, var(--ctp-surface-0));--shadow-sm:0 4px 14px #0003;--shadow-md:0 18px 50px #00000057;--shadow-lg:0 30px 80px #00000080}:root{font-synthesis:none;text-rendering:optimizelegibility;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--content-width:1600px;--paper-background:#fff;--paper-text:#4c4f69;--paper-soft:#6c6f85;--paper-muted:#8c8fa1;--paper-border:#bcc0cc;--paper-border-soft:#dce0e8;--paper-primary:#8839ef;--paper-primary-soft:#8839ef1a;--paper-hatch:#8839ef09;--paper-blue:#1e66f5;--paper-peach:#fe640b;--paper-weekend:#fcf4f1;--paper-on-accent:#fff;font-family:Inter,Avenir,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,sans-serif}*{box-sizing:border-box}html{background:var(--color-page);width:100%;overflow-x:clip}body{width:100%;min-height:100vh;color:var(--color-text);background:radial-gradient(circle at 8% 16%, var(--color-primary-soft), transparent 28rem), radial-gradient(circle at 92% 32%, var(--color-blue-soft), transparent 25rem), var(--color-page);-webkit-font-smoothing:antialiased;margin:0;transition:color .16s,background-color .16s;overflow-x:clip}button,input,textarea,select{font:inherit}button{color:inherit}input,textarea{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:100%;max-width:100%;min-height:44px;color:var(--color-text);background:var(--color-elevated);outline:none;padding:9px 11px;transition:border-color .14s,box-shadow .14s,background-color .14s}select{max-width:100%}input:focus,textarea:focus,select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-soft)}input.invalid{border-color:var(--color-danger);box-shadow:0 0 0 3px var(--color-danger-soft)}textarea{resize:vertical;line-height:1.5}.field-label{color:var(--color-text-soft);letter-spacing:.055em;text-transform:uppercase;margin:0 0 6px;font-size:11px;font-weight:800;display:block}.eyebrow{color:var(--color-primary);letter-spacing:.15em;text-transform:uppercase;margin:0 0 7px;font-size:11px;font-weight:850}.btn{min-height:38px;color:var(--color-text);background:var(--color-muted);cursor:pointer;border:0;border-radius:9px;justify-content:center;align-items:center;gap:7px;padding:8px 13px;font-size:12px;font-weight:800;transition:transform .14s,background-color .14s,box-shadow .14s;display:inline-flex}.btn:hover:not(:disabled){background:var(--color-border-soft);transform:translateY(-1px)}.btn:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid var(--color-primary-soft);outline-offset:2px}.btn-primary{color:var(--color-on-accent);background:var(--color-primary);box-shadow:0 7px 16px color-mix(in srgb, var(--color-primary) 24%, transparent)}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-danger{color:var(--color-on-accent);background:var(--color-danger);box-shadow:0 7px 16px color-mix(in srgb, var(--color-danger) 20%, transparent)}.btn-danger:hover:not(:disabled){background:var(--color-danger-hover)}.btn:disabled{opacity:.45;cursor:not-allowed}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media print{@page{size:A4 portrait;margin:10mm}html,html[data-theme]{--lightningcss-light:initial!important;--lightningcss-dark: !important;color-scheme:light!important;--color-page:#fff!important;--color-panel:#fff!important;--color-panel-solid:#fff!important;--color-elevated:#fff!important;--color-muted:#e6e9ef!important;--color-border:#bcc0cc!important;--color-border-soft:#ccd0da!important;--color-text:#4c4f69!important;--color-text-soft:#6c6f85!important;--color-text-muted:#8c8fa1!important;--color-primary:#8839ef!important;--color-on-accent:#fff!important;--color-primary-soft:#8839ef1a!important;--color-blue:#1e66f5!important;--color-peach:#fe640b!important;--color-weekend:#fcf4f1!important}body{background:var(--paper-background)!important}.no-print{display:none!important}}.app-shell{min-height:100vh}.workspace{width:min(100%, var(--content-width));grid-template-columns:minmax(560px,1.08fr) minmax(460px,.92fr);align-items:start;gap:clamp(30px,4vw,68px);margin:0 auto;padding:42px clamp(18px,3vw,48px) 70px;display:grid}.editor-column{min-width:0}.preview-column{min-width:0;position:sticky;top:94px}@media (width<=1100px){.workspace{grid-template-columns:1fr;max-width:800px}.preview-column{position:static}}@media (width<=680px){.workspace{gap:38px;padding:28px 12px 50px}}@media print{.app-shell,.workspace,.preview-column{width:100%;max-width:none;min-height:0;margin:0;padding:0;display:block}.editor-column{display:none!important}}