:root[data-theme=latte]{--ctp-base: #eff1f5;--ctp-mantle: #e6e9ef;--ctp-crust: #dce0e8;--ctp-surface0: #ccd0da;--ctp-surface1: #bcc0cc;--ctp-surface2: #acb0be;--ctp-overlay0: #9ca0b0;--ctp-overlay1: #8c8fa1;--ctp-overlay2: #7c7f93;--ctp-subtext0: #6c6f85;--ctp-subtext1: #5c5f77;--ctp-text: #4c4f69;--ctp-lavender: #7287fd;--ctp-blue: #1e66f5;--ctp-sapphire: #209fb5;--ctp-sky: #04a5e5;--ctp-teal: #179299;--ctp-green: #40a02b;--ctp-yellow: #df8e1d;--ctp-peach: #fe640b;--ctp-maroon: #e64553;--ctp-red: #d20f39;--ctp-mauve: #8839ef;--ctp-pink: #ea76cb;--ctp-flamingo: #dd7878;--ctp-rosewater: #dc8a78}:root[data-theme=frappe]{--ctp-base: #303446;--ctp-mantle: #292c3c;--ctp-crust: #232634;--ctp-surface0: #414559;--ctp-surface1: #51576d;--ctp-surface2: #626880;--ctp-overlay0: #737994;--ctp-overlay1: #838ba7;--ctp-overlay2: #949cbb;--ctp-subtext0: #a5adce;--ctp-subtext1: #b5bfe2;--ctp-text: #c6d0f5;--ctp-lavender: #babbf1;--ctp-blue: #8caaee;--ctp-sapphire: #85c1dc;--ctp-sky: #99d1db;--ctp-teal: #81c8be;--ctp-green: #a6d189;--ctp-yellow: #e5c890;--ctp-peach: #ef9f76;--ctp-maroon: #ea999c;--ctp-red: #e78284;--ctp-mauve: #ca9ee6;--ctp-pink: #f4b8e4;--ctp-flamingo: #eebebe;--ctp-rosewater: #f2d5cf}:root[data-theme=macchiato]{--ctp-base: #24273a;--ctp-mantle: #1e2030;--ctp-crust: #181926;--ctp-surface0: #363a4f;--ctp-surface1: #494d64;--ctp-surface2: #5b6078;--ctp-overlay0: #6e738d;--ctp-overlay1: #8087a2;--ctp-overlay2: #939ab7;--ctp-subtext0: #a5adcb;--ctp-subtext1: #b8c0e0;--ctp-text: #cad3f5;--ctp-lavender: #b7bdf8;--ctp-blue: #8aadf4;--ctp-sapphire: #7dc4e4;--ctp-sky: #91d7e3;--ctp-teal: #8bd5ca;--ctp-green: #a6da95;--ctp-yellow: #eed49f;--ctp-peach: #f5a97f;--ctp-maroon: #ee99a0;--ctp-red: #ed8796;--ctp-mauve: #c6a0f6;--ctp-pink: #f5bde6;--ctp-flamingo: #f0c6c6;--ctp-rosewater: #f4dbd6}:root,:root[data-theme=mocha]{--ctp-base: #1e1e2e;--ctp-mantle: #181825;--ctp-crust: #11111b;--ctp-surface0: #313244;--ctp-surface1: #45475a;--ctp-surface2: #585b70;--ctp-overlay0: #6c7086;--ctp-overlay1: #7f849c;--ctp-overlay2: #9399b2;--ctp-subtext0: #a6adc8;--ctp-subtext1: #bac2de;--ctp-text: #cdd6f4;--ctp-lavender: #b4befe;--ctp-blue: #89b4fa;--ctp-sapphire: #74c7ec;--ctp-sky: #89dceb;--ctp-teal: #94e2d5;--ctp-green: #a6e3a1;--ctp-yellow: #f9e2af;--ctp-peach: #fab387;--ctp-maroon: #eba0ac;--ctp-red: #f38ba8;--ctp-mauve: #cba6f7;--ctp-pink: #f5c2e7;--ctp-flamingo: #f2cdcd;--ctp-rosewater: #f5e0dc}:root{--primary: var(--ctp-mauve);--accent: var(--ctp-green);--text-primary: var(--ctp-text);--text-secondary: var(--ctp-subtext0);--background: var(--ctp-base);--surface: var(--ctp-base);--border: var(--ctp-surface0);--shadow: none}:root[data-theme=latte]{--border: var(--ctp-surface1)}*{margin:0;padding:0;box-sizing:border-box}.skip-link{position:absolute;top:-40px;left:6px;background:var(--primary);color:var(--background);padding:8px;text-decoration:none;border-radius:4px;font-size:14px;font-weight:500;z-index:10000;transition:top .3s}.skip-link:focus{top:6px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Inter,sans-serif;line-height:1.6;color:var(--text-primary);background:var(--background);font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.header{padding:20px 0;border-bottom:1px solid var(--border);background:var(--background);position:sticky;top:0;z-index:100}.header-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center}.logo{font-size:24px;font-weight:700;color:var(--primary);text-decoration:none}.nav-links{display:flex;gap:30px;list-style:none}.nav-links a{color:var(--text-secondary);text-decoration:none;font-weight:500;transition:color .2s ease}.nav-links a:hover{color:var(--text-primary)}.hero{padding:80px 0 100px;text-align:center;background:var(--background)}.hero-container{max-width:800px;margin:0 auto;padding:0 20px}.hero h1{font-size:3.5rem;font-weight:700;margin-bottom:20px;color:var (--text-primary);line-height:1.1}.hero p{font-size:1.25rem;color:var(--text-secondary);margin-bottom:40px;max-width:600px;margin-left:auto;margin-right:auto}.hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.btn{padding:12px 24px;border:1px solid var(--border);border-radius:6px;font-size:16px;font-weight:500;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:all .2s ease;background:transparent;color:var(--text-primary)}.btn-primary{background:var(--primary);color:var(--background);border-color:var(--primary)}.btn-primary:hover{opacity:.9}.btn-secondary:hover{border-color:var(--text-secondary)}.stats{padding:60px 0;border-bottom:1px solid var(--border)}.stats-container{max-width:1200px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;text-align:center}.stat h3{font-size:2rem;font-weight:700;color:var(--primary);margin-bottom:8px}.stat p{color:var(--text-secondary);font-size:14px}.features{padding:80px 0}.container{max-width:1200px;margin:0 auto;padding:0 20px}.section-title{text-align:center;margin-bottom:60px}.section-title h2{font-size:2.5rem;font-weight:700;color:var(--text-primary);margin-bottom:16px}.section-title p{font-size:1.125rem;color:var(--text-secondary);max-width:600px;margin:0 auto}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:40px}.feature{text-align:center}.feature-icon{font-size:2.5rem;margin-bottom:20px;display:block}.feature h3{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:12px}.feature p{color:var(--text-secondary);line-height:1.6}.demo{padding:80px 0;border-top:1px solid var(--border);background:var(--surface)}.demo-header{text-align:center;margin-bottom:50px}.demo-header h2{font-size:2rem;font-weight:700;color:var(--text-primary);margin-bottom:16px}.demo-header p{color:var(--text-secondary)}.demo-controls{display:flex;justify-content:center;gap:12px;margin-bottom:40px;flex-wrap:wrap}.demo-area{max-width:800px;margin:0 auto;padding:40px;border:1px solid var(--border);border-radius:8px;background:var(--background)}.demo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.demo-item{padding:20px;border:1px solid var(--border);border-radius:6px;background:var(--surface)}.demo-item h4{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:8px}.demo-item p{font-size:14px;color:var(--text-secondary)}.demo-form{max-width:400px;margin:20px auto 0}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px;font-weight:500;color:var(--text-primary);font-size:14px}.form-control{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:4px;font-size:14px;background:var(--background);color:var(--text-primary);transition:border-color .2s ease}.form-control:focus{outline:none;border-color:var(--primary)}.form-text{display:block;margin-top:4px;font-size:12px;color:var(--text-secondary);font-style:italic}.footer{padding:40px 0;border-top:1px solid var(--border);text-align:center}.footer-content{max-width:1200px;margin:0 auto;padding:0 20px}.footer-links{display:flex;justify-content:center;gap:30px;margin-bottom:20px;flex-wrap:wrap}.footer-links a{color:var(--text-secondary);text-decoration:none;font-size:14px;transition:color .2s ease}.footer-links a:hover{color:var(--text-primary)}.footer p{color:var(--text-secondary);font-size:14px}.theme-selector{position:fixed;top:20px;right:20px;z-index:1000;background:var(--background);border:1px solid var(--border);border-radius:6px;padding:12px;transform:translate(100%);opacity:0;transition:all .2s ease}.theme-selector.show{transform:translate(0);opacity:1}.theme-toggle-btn{position:fixed;top:20px;right:20px;z-index:1001;background:var(--background);border:1px solid var(--border);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;color:var(--text-primary);transition:all .2s ease}.theme-toggle-btn:hover{border-color:var(--text-secondary)}.theme-options{display:flex;flex-direction:column;gap:4px;min-width:140px}.theme-option{display:flex;align-items:center;padding:6px 8px;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s ease}.theme-option:hover{background:var(--border)}.theme-option.active{background:var(--primary);color:var(--background)}.theme-preview{width:12px;height:12px;border-radius:50%;margin-right:8px;border:1px solid var(--border)}.theme-preview.latte{background:#8839ef}.theme-preview.frappe{background:#ca9ee6}.theme-preview.macchiato{background:#c6a0f6}.theme-preview.mocha{background:#cba6f7}.status-indicator{position:fixed;bottom:20px;right:20px;z-index:10003;background:var(--primary);color:var(--background);padding:12px 16px;border-radius:6px;font-size:14px;font-weight:500;transform:translateY(100px);opacity:0;transition:all .3s ease}.status-indicator.show{transform:translateY(0);opacity:1}.status-indicator.status-success{background:var(--ctp-green);color:var(--ctp-base)}.status-indicator.status-error{background:var(--ctp-red);color:var(--ctp-base)}.status-indicator.status-warning{background:var(--ctp-yellow);color:var(--ctp-base)}.status-indicator.status-info{background:var(--ctp-blue);color:var(--ctp-base)}@media (max-width: 768px){.hero h1{font-size:2.5rem}.hero p{font-size:1.125rem}.hero-actions{flex-direction:column;align-items:center}.btn{min-width:200px}.features-grid{grid-template-columns:1fr;gap:30px}.demo-grid{grid-template-columns:1fr}.nav-links{display:none}}@media (max-width: 480px){.hero h1,.section-title h2{font-size:2rem}.container{padding:0 15px}}