@font-face{font-family:Suisse Intl;src:url(/fonts/SuisseIntl-Regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Suisse Intl;src:url(/fonts/SuisseIntl-SemiBold.woff2)format("woff2");font-weight:600;font-style:normal;font-display:swap}:root{--space-3xs:.125rem;--space-2xs:.25rem;--space-xs:.375rem;--space-sm:.5rem;--space-md:.75rem;--space-lg:1rem;--space-xl:1.5rem;--space-2xl:2rem;--space-3xl:3rem;--space-4xl:4rem;--space-5xl:5rem;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-full:50%;--text-2xs:.625rem;--text-xs:.6875rem;--text-sm:.75rem;--text-md:.8125rem;--text-base:.875rem;--text-lg:1rem;--text-xl:1.125rem;--text-2xl:2.25rem;--text-3xl:3rem;--font-sans:"Suisse Intl", system-ui, -apple-system, sans-serif;--font-mono:"SF Mono", "Fira Code", "Cascadia Code", monospace;--surface-1:#121212;--surface-2:#1a1a1a;--surface-3:#1e1e1e;--surface-4:#2c2c2c;--surface-5:#3a3a3a;--text-primary:#ffffffde;--text-secondary:#ffffffb3;--text-tertiary:#ffffff80;--text-muted:#fff6;--text-faint:#ffffff4d;--border-subtle:#ffffff14;--border-light:#ffffff1a;--border-medium:#fff3;--overlay-subtle:#ffffff08;--overlay-light:#ffffff0a;--overlay-medium:#ffffff14;--overlay-heavy:#fff2;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 24px #0006;--shadow-lg:0 8px 32px #00000080}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0;padding:0;overflow:hidden}#root{height:100%}:root{font-family:var(--font-sans);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#213547;background-color:#fff;font-size:16px;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;color:var(--text-primary);background-color:var(--surface-1)}}.app-layout{--accent:#3b82f6;--accent-hover:#2563eb;--accent-light:#3b82f61a;--accent-light-dk:#3b82f626;grid-template-columns:1fr 280px;height:100%;display:grid;overflow:hidden}.app-layout.mode-dev{--accent:#0d9f4f;--accent-hover:#0b8a43;--accent-light:#0d9f4f1a;--accent-light-dk:#0d9f4f26}.main-area{position:relative;overflow:hidden}main{height:100%;padding-bottom:var(--space-5xl);overflow-y:auto}.hero{min-height:90svh;padding:var(--space-4xl) var(--space-2xl);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.hero-bg-clip{z-index:0;position:absolute;inset:0;overflow:hidden}.hero-bg{transform-origin:50%;background:url(/images/DTS_TERRA_Chris_Abatzis_Photos_ID13224.jpg) 50%/cover no-repeat;width:100%;height:100%}.hero-content{z-index:1;text-align:center;max-width:640px;position:relative}.hero-heading{font-size:var(--text-3xl);margin:0 0 var(--space-lg);color:#fff;letter-spacing:-.02em;font-weight:600;line-height:1.1}.hero-subheading{font-size:var(--text-xl);margin:0 0 var(--space-2xl);color:#fffc;line-height:1.6}.hero-btn{padding:var(--space-md) var(--space-2xl);font-size:var(--text-lg);color:#064e2b;border-radius:var(--radius-xs);cursor:pointer;transition:background var(--speed-short,.2s) ease;background:#fff;border:none;font-weight:600;display:inline-block}.hero-btn:hover{background:#f0f0f0}.section-stagger-toggle{bottom:var(--space-md);right:var(--space-md);z-index:2;opacity:0;transition:opacity .15s;position:absolute}.hero:hover .section-stagger-toggle,.icon-columns:hover .section-stagger-toggle,.split-section:hover .section-stagger-toggle{opacity:1}.stagger-toggle-label{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius-md);cursor:pointer;-webkit-user-select:none;user-select:none;background:#000a;display:flex}.stagger-toggle-input{width:14px;height:14px;accent-color:var(--accent);cursor:pointer;margin:0}.stagger-toggle-text{font-size:var(--text-xs);color:#fffc;font-weight:400}.icon-columns{gap:var(--space-2xl);max-width:960px;padding:var(--space-4xl) var(--space-2xl);grid-template-columns:repeat(3,1fr);margin:0 auto;display:grid;position:relative}.icon-column{text-align:center;flex-direction:column;align-items:center;display:flex}.icon-circle{border-radius:var(--radius-full);background:var(--accent-light);width:56px;height:56px;color:var(--accent);margin-bottom:var(--space-lg);justify-content:center;align-items:center;display:flex}@media (prefers-color-scheme:dark){.icon-circle{background:var(--accent-light-dk)}}.icon-column-heading{font-size:var(--text-xl);margin:0 0 var(--space-sm);font-weight:600}.icon-column-text{font-size:var(--text-base);color:#666;margin:0;line-height:1.6}@media (prefers-color-scheme:dark){.icon-column-text{color:var(--text-tertiary)}}.split-section{gap:var(--space-3xl);max-width:1080px;padding:var(--space-5xl) var(--space-2xl);grid-template-columns:1fr 1fr;align-items:center;margin:0 auto;display:grid;position:relative}.split-text{flex-direction:column;align-items:flex-start;display:flex}.split-heading{font-size:var(--text-2xl);margin:0 0 var(--space-lg);letter-spacing:-.02em;font-weight:600;line-height:1.15}.split-subheading{font-size:var(--text-lg);margin:0 0 var(--space-xl);color:#666;line-height:1.6}@media (prefers-color-scheme:dark){.split-subheading{color:var(--text-tertiary)}}.split-btn{padding:var(--space-sm) var(--space-xl);font-size:var(--text-base);color:#fff;background:var(--accent);border-radius:var(--radius-xs);cursor:pointer;transition:background var(--speed-short,.2s) ease;border:none;font-weight:600;display:inline-block}.split-btn:hover{background:var(--accent-hover)}.split-image{justify-content:center;align-items:center;display:flex}.split-image-clip{aspect-ratio:1;border-radius:var(--radius-xl);width:100%;overflow:hidden}.split-image-inner{transform-origin:50%;background:url(/images/DTS_The_Internet_Fanette_Guilloud_Photos_ID5236.jpg) 50%/cover no-repeat;width:100%;height:100%}.mobile-settings-btn{top:var(--space-md);right:var(--space-md);z-index:1001;border-radius:var(--radius-lg);background:var(--surface-4);width:40px;height:40px;color:var(--text-secondary);cursor:pointer;box-shadow:var(--shadow-sm);transition:background var(--speed-short,.2s) ease;border:none;justify-content:center;align-items:center;display:none;position:absolute}.mobile-settings-btn:hover{background:var(--surface-5);color:#ffffffe6}@media (width<=760px){.app-layout{grid-template-columns:1fr}.mobile-settings-btn{display:flex}.hero-heading{font-size:2rem}.icon-columns{grid-template-columns:1fr;gap:2.5rem}.split-section{grid-template-columns:1fr}}.bottom-bar{padding:var(--space-md) var(--space-lg);padding-bottom:max(var(--space-md), env(safe-area-inset-bottom));pointer-events:none;z-index:1000;justify-content:center;display:flex;position:absolute;bottom:0;left:0;right:0}.toolbar{align-items:center;gap:var(--space-sm);pointer-events:auto;box-shadow:var(--shadow-md);border-radius:var(--radius-xl);display:flex}.mode-toggle{background:var(--surface-4);border-radius:var(--radius-xl);padding:var(--space-2xs);align-items:center;gap:var(--space-3xs);display:flex;position:relative}.toggle-indicator{border-radius:var(--radius-lg);background:var(--accent);z-index:0;width:40px;height:40px;transition:transform .35s cubic-bezier(.4,0,.2,1);position:absolute;transform:translate(0)}.toggle-indicator.at-dev{transform:translateX(calc(100% + var(--space-3xs)))}.toggle-btn{border-radius:var(--radius-lg);width:40px;height:40px;color:var(--text-secondary);cursor:pointer;z-index:1;background:0 0;border:none;justify-content:center;align-items:center;transition:color .2s;display:flex;position:relative}.toggle-btn:hover{color:#ffffffe6}.toggle-btn.active{color:#fff}.sidebar{background:var(--surface-4);color:var(--text-primary);border-left:1px solid var(--border-subtle);flex-direction:column;height:100%;display:flex;overflow:hidden}@media (width<=760px){.sidebar{border-left:none;border-top:1px solid var(--border-subtle);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;z-index:2000;width:100%;max-height:50svh;transition:transform .3s cubic-bezier(.4,0,.2,1);position:fixed;bottom:0;left:0;right:0;transform:translateY(100%)}.sidebar.sidebar-open{transform:translateY(0)}}.sidebar-header{padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--border-subtle);flex-shrink:0;justify-content:space-between;align-items:center;display:flex}.sidebar-title{font-size:var(--text-md);text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);margin:0;font-weight:600}.share-wrapper{position:relative}.share-btn{padding:var(--space-xs) var(--space-lg);font-size:var(--text-sm);color:#fff;background:var(--accent);border-radius:var(--radius-xs);cursor:pointer;transition:background var(--speed-short,.2s) ease;border:none;font-weight:600}.share-btn:hover{background:var(--accent-hover)}.share-dropdown{top:calc(100% + var(--space-xs));background:var(--surface-3);border:1px solid var(--border-light);border-radius:var(--radius-lg);min-width:160px;padding:var(--space-2xs);z-index:10;box-shadow:var(--shadow-md);position:absolute;right:0}.share-dropdown-item{width:100%;padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);color:var(--text-primary);border-radius:var(--radius-md);cursor:pointer;text-align:left;background:0 0;border:none;font-weight:400;transition:background .1s;display:block}.share-dropdown-item:hover{background:var(--overlay-medium)}.sidebar-content{padding-bottom:var(--space-lg);flex:1;overflow-y:auto}.syntax-toggle-section{padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--border-subtle)}.syntax-toggle{background:var(--overlay-light);border-radius:var(--radius-lg);padding:var(--space-3xs);display:flex}.syntax-toggle-btn{padding:var(--space-xs) 0;font-size:var(--text-sm);border-radius:var(--radius-xs);color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex:1;font-weight:600;transition:all .15s}.syntax-toggle-btn:hover{color:var(--text-secondary)}.syntax-toggle-btn.active{background:var(--accent);color:#fff}.sidebar-footer{align-items:center;gap:var(--space-sm);padding:var(--space-md) var(--space-lg);padding-bottom:max(var(--space-md), env(safe-area-inset-bottom));border-top:1px solid var(--border-subtle);flex-shrink:0;display:flex}.btn-preview{justify-content:center;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-lg);font-size:var(--text-md);border-radius:var(--radius-xs);background:var(--accent);color:#fff;cursor:pointer;transition:background var(--speed-short,.2s) ease;border:none;flex:1;font-weight:600;display:flex}.btn-preview:hover{background:var(--accent-hover)}.sidebar-section{border-bottom:1px solid var(--border-subtle)}.section-title{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);padding:var(--space-sm) var(--space-lg) var(--space-xs);justify-content:space-between;align-items:center;margin:0;font-weight:600;display:flex}.section-title-collapsible{cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .12s}.section-title-collapsible:hover{color:var(--text-secondary)}.section-toggle-icon{opacity:.5;flex-shrink:0;transition:opacity .12s}.section-title-collapsible:hover .section-toggle-icon{opacity:.8}.section-content{padding:0 var(--space-lg) var(--space-md)}.property-row{padding:var(--space-2xs) 0;justify-content:space-between;align-items:center;display:flex}.property-label{font-size:var(--text-sm);color:var(--text-secondary)}.property-value{font-size:var(--text-sm);font-family:var(--font-mono);color:var(--text-primary);background:var(--overlay-light);padding:var(--space-3xs) var(--space-sm);border-radius:var(--radius-sm)}.property-input{width:64px;font-size:var(--text-sm);font-family:var(--font-mono);color:var(--text-primary);background:var(--overlay-light);border:1px solid var(--border-light);border-radius:var(--radius-sm);padding:var(--space-3xs) var(--space-sm);text-align:right;-moz-appearance:textfield;outline:none;transition:border-color .12s}.property-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.property-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.property-input:focus{border-color:var(--accent)}.speed-slider{gap:var(--space-2xs);padding:var(--space-2xs) 0;flex-direction:column;display:flex}.speed-slider-header{justify-content:space-between;align-items:center;display:flex}.speed-slider-value-wrap{align-items:center;gap:var(--space-3xs);display:flex}.speed-slider-value-input{width:48px;font-size:var(--text-xs);font-family:var(--font-mono);color:var(--text-primary);background:var(--overlay-light);border-radius:var(--radius-sm);padding:var(--space-3xs) var(--space-xs);text-align:right;-moz-appearance:textfield;border:1px solid #0000;outline:none;transition:border-color .12s}.speed-slider-value-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.speed-slider-value-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.speed-slider-value-input:focus{border-color:var(--accent);background:var(--overlay-medium)}.speed-slider-unit{font-size:var(--text-2xs);color:var(--text-faint)}.speed-slider-track{border-radius:var(--radius-sm);background:var(--overlay-medium);height:6px;position:relative}.speed-slider-fill{border-radius:var(--radius-sm);background:var(--accent);pointer-events:none;height:100%;position:absolute;top:0;left:0}.speed-slider-input{appearance:none;cursor:pointer;background:0 0;width:100%;margin:0;position:absolute;top:50%;left:0;transform:translateY(-50%)}.speed-slider-input::-webkit-slider-thumb{-webkit-appearance:none;border-radius:var(--radius-full);border:2px solid var(--accent);width:14px;height:14px;box-shadow:var(--shadow-sm);cursor:pointer;background:#fff}.speed-slider-input::-moz-range-thumb{border-radius:var(--radius-full);border:2px solid var(--accent);width:14px;height:14px;box-shadow:var(--shadow-sm);cursor:pointer;background:#fff}.speed-slider-input::-moz-range-track{background:0 0}.property-unit{font-size:var(--text-xs);color:var(--text-faint);margin-left:var(--space-2xs)}.select-dropdown{width:100%;padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm);font-family:var(--font-mono);color:var(--text-primary);background:var(--overlay-light);border:1px solid var(--border-light);border-radius:var(--radius-md);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%23ffffff66' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-sm) center;padding-right:var(--space-xl);outline:none;transition:border-color .12s}.select-dropdown:focus{border-color:var(--accent)}.select-dropdown option{background:var(--surface-4);color:var(--text-primary)}.speed-hint{font-size:var(--text-xs);font-family:var(--font-mono);color:var(--text-faint);margin-top:var(--space-3xs)}.checkbox-row{align-items:center;gap:var(--space-sm);cursor:pointer;display:flex}.checkbox-input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;margin:0}.checkbox-label{font-size:var(--text-sm);color:var(--text-secondary)}.code-block-wrapper{position:relative}.code-block-wrapper:hover .code-copy-btn{opacity:1}.code-copy-btn{top:var(--space-sm);right:var(--space-sm);border-radius:var(--radius-sm);background:var(--overlay-medium);width:28px;height:28px;color:var(--text-tertiary);cursor:pointer;opacity:0;border:none;justify-content:center;align-items:center;padding:0;transition:opacity .12s,background .12s,color .12s;display:flex;position:absolute}.code-copy-btn:hover{background:var(--overlay-heavy);color:var(--text-primary)}.code-copy-btn.copied{opacity:1;color:var(--accent)}.code-block{font-size:var(--text-xs);font-family:var(--font-mono);color:#abb2bf;background:var(--surface-2);border-radius:var(--radius-md);padding:var(--space-md);white-space:pre;tab-size:2;margin:0;line-height:1.6;overflow-x:auto}.syn-keyword{color:#c678dd}.syn-selector{color:#e06c75}.syn-property{color:#d19a66}.syn-prop-key{color:#e06c75}.syn-string{color:#98c379}.syn-number{color:#d19a66}.syn-unit{color:#56b6c2}.syn-comment{color:#5c6370;font-style:italic}.easing-section{position:relative}.easing-curve-row{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);cursor:pointer;transition:background .12s;display:flex}.easing-curve-row:hover{background:var(--overlay-light)}.easing-chevron{color:var(--text-faint);flex-shrink:0}.curve-preview-svg{flex-shrink:0}.easing-curve-labels{text-align:left;flex-direction:column;flex:1;min-width:0;display:flex}.easing-curve-index{font-size:var(--text-2xs);color:var(--text-faint);letter-spacing:.03em;font-weight:400}.easing-curve-label{font-size:var(--text-sm);font-family:var(--font-mono)}.easing-flyout{background:var(--surface-3);border:1px solid var(--border-light);border-radius:var(--radius-lg);width:260px;box-shadow:var(--shadow-lg);z-index:20;position:fixed;overflow:hidden}.easing-flyout-header{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;display:flex}.easing-flyout-title{font-size:var(--text-sm);color:var(--text-secondary);font-weight:600}.easing-flyout-close{border-radius:var(--radius-sm);width:24px;height:24px;color:var(--text-faint);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:0;transition:color .12s,background .12s;display:flex}.easing-flyout-close:hover{color:var(--text-primary);background:var(--overlay-medium)}.easing-flyout-content{padding:var(--space-md);gap:var(--space-md);flex-direction:column;display:flex}.option-group{gap:var(--space-xs);flex-direction:column;display:flex}.section-content>.option-group+.option-group,.section-content>.option-group+.speed-slider,.section-content>.speed-slider+.option-group,.section-content>.option-group+.checkbox-row,.section-content>.checkbox-row+.option-group{margin-top:var(--space-lg)}.option-group-label{font-size:var(--text-2xs);text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);font-weight:600}.option-pills{gap:var(--space-2xs);display:flex}.option-pill{padding:var(--space-2xs) 0;font-size:var(--text-xs);border:1px solid var(--border-light);border-radius:var(--radius-xs);color:var(--text-secondary);cursor:pointer;background:0 0;flex:1;font-weight:400;transition:all .12s}.option-pill.has-tooltip{position:relative}.pill-tooltip{bottom:calc(100% + var(--space-xs));padding:var(--space-3xs) var(--space-sm);font-size:var(--text-2xs);font-family:var(--font-mono);color:var(--text-primary);background:var(--surface-1);border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s;position:absolute;left:50%;transform:translate(-50%)}.option-pill.has-tooltip:hover .pill-tooltip{opacity:1}.option-pill:hover{border-color:var(--border-medium);color:#ffffffe6}.option-pill.active{background:var(--accent);border-color:var(--accent);color:#fff}.factor-grid{gap:var(--space-2xs);grid-template-columns:1fr 1fr;display:grid}.factor-btn{align-items:center;gap:var(--space-3xs);padding:var(--space-xs) var(--space-2xs) var(--space-2xs);border:1px solid var(--border-light);border-radius:var(--radius-xs);color:var(--text-secondary);cursor:pointer;background:0 0;flex-direction:column;transition:all .12s;display:flex}.factor-btn:hover{border-color:var(--border-medium);background:var(--overlay-subtle)}.factor-btn.active{border-color:var(--accent);background:var(--accent-light);color:#fff}.factor-btn.active .curve-preview-svg path{stroke:var(--accent)}.factor-btn-label{font-size:var(--text-2xs);font-weight:400}