:root{--surface-window:#fff;--surface-panel:#f7f7f7;--surface-card:#fff;--surface-viewport:#f0f0f0;--text-primary:#707070;--text-secondary:#888;--text-muted:#9a9a9a;--text-on-accent:#fff;--control-bg:#f2f2f2;--control-hover:#ededed;--control-pressed:#d2d2d2;--control-selected:#ddd;--control-border:#e0e0e0;--accent:#49d7df;--accent-soft:#dffaff;--slider-track:#e3e3e3;--slider-thumb-border:#b8b8b8;--toggle-off:#b8b8b8;--toggle-thumb:#f7f7f7;--radius-window:7px;--radius-card:24px;--radius-popup:12px;--radius-tile:28px;--font-ui:"Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}html{background:var(--surface-viewport)}body{font-family:var(--font-ui);color:var(--text-primary);-webkit-font-smoothing:antialiased;overflow:hidden}button,input{font:inherit}button{color:inherit}.app-surface{background:var(--surface-viewport);width:100%;height:100%;position:relative;overflow:hidden}.screen{position:absolute;inset:0}.fade-screen{animation:.65s cubic-bezier(.65,0,.35,1) both screenIn}@keyframes screenIn{0%{opacity:0}to{opacity:1}}.back-button{z-index:60;width:20px;height:20px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;padding:0;font-size:28px;font-weight:100;line-height:16px;position:absolute;top:5px;left:5px}.back-button:hover{color:var(--text-primary)}.intro-screen{place-items:center;display:grid}.intro-center{flex-direction:column;align-items:center;display:flex;transform:translateY(-10px)}.intro-title{min-height:42px;color:var(--text-primary);align-items:center;font-size:20px;font-weight:300;transition:transform .8s cubic-bezier(.65,0,.35,1);display:flex;transform:translateY(0)}.intro-title.raised{transform:translateY(-100px)}.intro-icon{object-fit:contain;width:24px;height:24px;margin-right:8px;animation:.9s cubic-bezier(.2,1.35,.35,1) both iconPop}@keyframes iconPop{0%{transform:scale(0)}to{transform:scale(1)}}.explore-button{border:1px solid var(--control-border);background:var(--surface-card);width:250px;height:45px;color:var(--text-primary);cursor:pointer;opacity:0;border-radius:22px;margin-top:-65px;font-size:16px;transition:background .16s;transform:scale(0)}.explore-button.show{opacity:1;animation:.8s cubic-bezier(.2,1.35,.35,1) both bubblePop}.explore-button:hover{background:var(--control-hover)}@keyframes bubblePop{0%{transform:scale(0)}to{transform:scale(1)}}.explore-scroll{scrollbar-width:none;overscroll-behavior-x:none;touch-action:pan-y;position:absolute;inset:55px 36px 35px;overflow:hidden auto}.explore-scroll::-webkit-scrollbar{display:none}.tile-grid{grid-template-columns:repeat(4,minmax(150px,1fr));width:min(100%,1120px);margin:0 auto;display:grid}.pattern-tile{aspect-ratio:1;border-radius:var(--radius-tile);border:1px solid var(--control-border);background:var(--surface-card);cursor:pointer;min-width:150px;min-height:150px;margin:14px;transition:transform .18s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;transform:scale(1)}.pattern-tile:hover{z-index:2;transform:scale(1.08)}.pattern-tile img{object-fit:cover;opacity:1;width:100%;height:100%;transition:opacity .18s linear;position:absolute;inset:0}.pattern-tile .tile-title{text-align:center;color:var(--text-primary);opacity:0;place-items:center;font-size:clamp(16px,2vw,26px);font-weight:300;transition:opacity .18s linear;display:grid;position:absolute;inset:22px}.pattern-tile:hover img{opacity:0}.pattern-tile:hover .tile-title{opacity:1}.pattern-tile.disabled{cursor:default}.pattern-tile.disabled .tile-title{opacity:1}.pattern-tile.disabled:hover{transform:scale(1)}.visualizer-screen{grid-template-columns:360px 20px minmax(0,1fr);padding:20px;display:grid}.control-card{z-index:20;background:var(--surface-panel);border-radius:var(--radius-card);grid-column:1;grid-template-rows:auto 10px minmax(0,1fr) auto;min-height:0;padding:14px 22px 22px;display:grid;position:relative;overflow:visible}.control-title{color:var(--text-primary);margin:0 0 6px;font-size:30px;font-weight:300;line-height:1.15}.control-header{min-height:26px}.control-scroll{scrollbar-width:thin;scrollbar-color:var(--control-border) transparent;grid-row:3;padding-right:3px;overflow:hidden auto}.control-utility{grid-row:4;margin-top:14px}.viewport-frame{z-index:1;border-radius:var(--radius-card);background:var(--surface-viewport);grid-column:3;min-width:0;min-height:0;position:relative;overflow:hidden}.viewport-frame canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.header-grid{grid-template-columns:auto 1fr 130px;align-items:start;display:grid}.header-grid.wide{grid-template-columns:auto 1fr 150px}.header-right{grid-column:3}.menu-selector{width:max-content;position:relative}.menu-trigger{cursor:pointer;background:0 0;border:0;align-items:center;height:18px;padding:0;display:flex}.hamburger{border-radius:8px;align-content:center;justify-items:center;gap:2.2px;width:22px;height:18px;display:grid}.menu-trigger:hover .hamburger{background:var(--control-hover)}.hamburger i{background:var(--text-muted);border-radius:1px;width:16px;height:1.4px;display:block}.menu-selected{color:var(--text-muted);margin-left:6px;font-size:13px}.popup-wrap{z-index:100;padding-top:6px;position:absolute;top:100%;left:0}.popup-wrap.above{padding-top:0;padding-bottom:6px;top:auto;bottom:100%}.popup-card{background:var(--surface-card);border:1px solid var(--control-border);border-radius:var(--radius-popup);opacity:0;min-width:110px;padding:8px;animation:.18s forwards popupIn;box-shadow:0 8px 30px #0000000a}@keyframes popupIn{to{opacity:1}}.popup-option{width:100%;min-height:28px;color:var(--text-secondary);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:8px;margin:1px 0;padding:4px 6px;font-size:13px}.popup-option:hover{background:var(--control-hover);color:var(--text-primary)}.popup-option:active{background:var(--control-pressed)}.popup-option:disabled{opacity:.45;cursor:default}.section-header{width:100%;position:relative}.pill-button{background:var(--control-bg);width:100%;min-height:22px;color:var(--text-secondary);cursor:pointer;border:0;border-radius:7px;padding:2px 8px;font-size:13px;font-weight:600}.pill-button:hover{background:var(--control-hover)}.pill-button.selected{background:var(--control-selected);color:var(--text-primary)}.segmented{grid-template-columns:1fr 2px 1fr;margin-bottom:8px;display:grid}.segmented .pill-button:first-child{grid-column:1}.segmented .pill-button:last-child{grid-column:3}.toggle-row{grid-template-columns:1fr 48px;align-items:center;margin:0 0 10px;display:grid}.toggle-row.spaced{margin-top:22px}.toggle-label{color:var(--text-secondary);font-size:14px;font-weight:600}.toggle-switch{background:var(--toggle-off);cursor:pointer;width:34px;height:18px;box-shadow:none;border:0;border-radius:999px;outline:none;justify-self:end;padding:0;transition:background .16s ease-out;position:relative}.toggle-switch:after{content:"";background:var(--toggle-thumb);width:12px;height:12px;box-shadow:none;border:0;border-radius:50%;transition:transform .16s ease-out;position:absolute;top:50%;left:3px;transform:translateY(-50%)}.toggle-switch.on{background:var(--accent)}.toggle-switch.on:after{transform:translate(16px,-50%)}.labeled-slider{margin-bottom:12px;display:block}.slider-heading{justify-content:space-between;align-items:center;gap:8px;min-height:18px;display:flex}.slider-label{color:var(--text-muted);font-size:13px}.slider-heading-accessory{flex:none;align-items:center;display:flex}.slider-heading.accessory-inline{justify-content:flex-start;gap:6px}.slider-row{grid-template-columns:minmax(0,1fr) 48px;align-items:center;height:28px;display:grid}.slider-wrap{align-items:center;height:32px;margin-right:10px;display:flex}.slider-input{--fill:0%;appearance:none;cursor:pointer;background:0 0;width:100%;height:24px}.slider-input::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) 0 var(--fill), var(--slider-track) var(--fill) 100%);border-radius:3px;height:5px}.slider-input::-moz-range-track{background:var(--slider-track);border-radius:3px;height:5px}.slider-input::-moz-range-progress{background:var(--accent);border-radius:3px;height:5px}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;background:var(--surface-card);border:1.5px solid var(--accent);width:13px;height:24px;box-shadow:none;filter:none;border-radius:7px;outline:none;margin-top:-9.5px}.slider-input::-moz-range-thumb{background:var(--surface-card);border:1.5px solid var(--accent);width:11px;height:22px;box-shadow:none;filter:none;border-radius:7px;outline:none}.slider-input.at-min::-webkit-slider-thumb{border-color:var(--slider-thumb-border)}.slider-input.at-min::-moz-range-thumb{border-color:var(--slider-thumb-border)}.slider-input.at-max::-webkit-slider-thumb{background:var(--accent);border-color:var(--accent)}.slider-input.at-max::-moz-range-thumb{background:var(--accent);border-color:var(--accent)}.value-box{width:48px;min-width:34px;color:var(--text-muted);text-align:right;background:0 0;border:1px solid #0000;border-radius:8px;outline:none;padding:1px 4px;font-size:13px}.value-box:hover{background:var(--control-bg);border-color:var(--control-border)}.value-box:focus{background:var(--surface-card);border-color:var(--slider-thumb-border)}.utility-bar{align-items:center;gap:8px;display:flex}.utility-item{position:relative}.utility-button{background:var(--control-selected);cursor:pointer;border:0;border-radius:12px;place-items:center;width:42px;height:42px;padding:0;display:grid}.utility-button:hover{background:var(--control-hover)}.utility-button:active{background:var(--control-pressed)}.utility-button img{object-fit:contain;opacity:.72;width:22px;height:22px}.layer-popup{min-width:245px}.popup-title{color:var(--text-primary);margin:0 2px 8px;font-size:14px;font-weight:600}.layer-row{cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;border-radius:8px;grid-template-columns:minmax(0,1fr) 48px;align-items:center;min-height:30px;margin:1px 0;padding:3px 6px;display:grid}.layer-row:hover{background:var(--control-hover)}.layer-row.dragging{opacity:.5;cursor:grabbing}.layer-name{color:var(--text-primary);font-size:13px;font-weight:600}.layer-toggle-cell{justify-content:flex-end;align-items:center;width:48px;display:flex}.layer-row .toggle-switch{margin:0}.preset-button{width:100%;height:36px;margin:0 0 8px}.preset-description{color:var(--text-muted);margin:10px 4px 0;font-size:12px;line-height:1.4}.panel-note{color:var(--text-secondary);margin:0 0 14px;font-size:13px;line-height:1.4}.color-control{width:100%}.color-picker{touch-action:none;width:190px;height:190px;margin:0 auto 14px;position:relative}.color-picker canvas{width:190px;height:190px;display:block}.color-handle{border:2px solid var(--surface-card);pointer-events:none;border-radius:50%;width:22px;height:22px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000001f}.color-preview{border:1px solid var(--control-border);border-radius:12px;grid-template-columns:1fr 1fr;height:34px;margin-bottom:14px;display:grid;overflow:hidden}.color-preview button{cursor:pointer;border:0}.color-preview div{min-width:0}.hex-input{border:1px solid var(--control-border);background:var(--surface-card);width:100%;color:var(--text-secondary);border-radius:10px;outline:none;margin-bottom:12px;padding:6px 8px;font-size:13px}.hex-input:focus{border-color:var(--slider-thumb-border)}.color-model-menu{margin-bottom:12px}.viewport-status{color:#7070708c;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:10px;position:absolute;bottom:10px;right:12px}@media (max-width:899px){.tile-grid{grid-template-columns:repeat(3,minmax(150px,1fr))}}@media (max-width:620px){html,body{width:100%;max-width:100%;overflow-x:hidden}body{overflow-y:auto}.app-surface{width:100%;max-width:100%;height:auto;min-height:100%;overflow-x:hidden}.explore-scroll{overscroll-behavior-x:none;touch-action:pan-y;-webkit-overflow-scrolling:touch;inset:48px 12px 16px;overflow:hidden auto}.tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%}.pattern-tile{width:100%;min-width:0;min-height:0;margin:0}.visualizer-screen{grid-template-rows:auto 10px minmax(480px,1fr);grid-template-columns:1fr;min-height:100vh;padding:10px}.control-card{grid-column:1;max-height:48vh}.viewport-frame{grid-area:3/1;min-height:480px}}.penrose-canvas.duplicate-on{cursor:grab}.penrose-canvas.duplicate-on:active{cursor:grabbing}.penrose-animate-button{width:100%;height:34px;margin:4px 0 12px;font-weight:500}.icon-utility-button{color:var(--text-muted)}.icon-utility-button svg{fill:currentColor;width:21px;height:21px;display:block}.icon-utility-button.active{color:var(--accent)}.penrose-animation-row{grid-template-columns:1fr 48px;align-items:center;margin:2px 0 10px;display:grid}.inline-animation-button{border-radius:10px;justify-self:end;width:34px;height:34px}.inline-animation-button svg{width:18px;height:18px}:is(.viewport-frame:fullscreen,.viewport-frame.pseudo-fullscreen){background:var(--surface-viewport);border-radius:0}.viewport-frame.pseudo-fullscreen{z-index:10000!important;width:100vw!important;min-width:0!important;height:100dvh!important;min-height:0!important;position:fixed!important;inset:0!important}.fullscreen-overlay-controls{z-index:25;top:max(12px, env(safe-area-inset-top));right:max(12px, env(safe-area-inset-right));position:absolute}.fullscreen-overlay-controls .utility-button{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#f5f5f5e0}.density-slider{margin-bottom:16px}.density-track-row{align-items:center;height:28px;padding-right:0;display:flex}.density-track-row .slider-input{width:100%}.density-labels{color:var(--text-muted);text-transform:lowercase;grid-template-columns:1fr 1fr 1fr;margin-top:-3px;font-size:10px;line-height:1;display:grid}.density-labels span:first-child{text-align:left}.density-labels span:nth-child(2){text-align:center}.density-labels span:last-child{text-align:right}.fullscreen-overlay-controls{align-items:center;gap:8px;display:flex}.penrose-export-popup{width:292px;max-width:calc(100vw - 24px)}.export-config{padding:2px}.export-config-header{text-transform:lowercase;grid-template-columns:28px 1fr 28px;align-items:center;height:28px;margin-bottom:8px;font-size:13px;display:grid}.export-config-header strong{text-align:center;color:var(--text-primary);grid-column:2;font-weight:600}.export-back{width:26px;height:26px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:8px;grid-column:1;padding:0;font-size:23px;line-height:22px}.export-back:hover{background:var(--control-hover);color:var(--text-primary)}.export-size-label{color:var(--text-muted);margin:2px 2px 5px;font-size:11px}.export-size-spacer{margin-top:8px}.export-ratio-grid{grid-template-columns:repeat(3,1fr);gap:5px;display:grid}.export-ratio{background:var(--control-bg);min-width:0;min-height:30px;color:var(--text-secondary);cursor:pointer;border:1px solid #0000;border-radius:8px;padding:0 5px;font-size:11px}.export-ratio:hover{background:var(--control-hover)}.export-ratio.selected{background:var(--control-selected);border-color:var(--control-border);color:var(--text-primary)}.export-quality-grid{align-items:stretch}.export-quality{flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:40px;padding:5px 4px;display:flex}.export-quality small{color:var(--text-muted);font-size:9px;line-height:1.1}.export-quality.selected small{color:inherit;opacity:.82}.export-resolution{min-height:24px;color:var(--text-muted);text-align:right;padding:5px 2px 4px;font-size:10px}.export-time-input{min-height:36px;color:var(--text-muted);grid-template-columns:1fr 62px 34px;align-items:center;gap:5px;margin:2px 0 10px;font-size:12px;display:grid}.export-time-input input{border:1px solid var(--control-border);background:var(--surface-card);width:62px;height:28px;color:var(--text-secondary);text-align:right;border-radius:8px;outline:none;padding:2px 5px}.export-time-input input:focus{border-color:var(--accent)}.export-time-input small{color:var(--text-muted);font-size:9px}.export-create-button,.export-ready button{background:var(--control-selected);width:100%;min-height:31px;color:var(--text-secondary);cursor:pointer;border:0;border-radius:9px;margin-top:4px;font-size:12px}.export-create-button:hover,.export-ready button:hover{background:var(--control-hover);color:var(--text-primary)}.export-create-button:disabled{cursor:wait;opacity:.72}.export-progress{background:var(--slider-track);border-radius:2px;height:3px;margin:7px 2px 1px;overflow:hidden}.export-progress i{background:var(--accent);border-radius:inherit;height:100%;transition:width .12s linear;display:block}.export-error{color:#a55;margin-top:7px;font-size:10px;line-height:1.3}.export-ready{grid-template-columns:1fr 1fr;gap:5px;margin-top:4px;display:grid}.export-ready .export-again{border:1px solid var(--control-border);background:0 0;grid-column:1/-1}@media (max-width:620px){.penrose-export-popup{width:min(292px,100vw - 34px)}}.utility-button:disabled{opacity:.42;cursor:default}.utility-button:disabled:hover,.utility-button:disabled:active{background:var(--control-selected)}.export-popup{width:148px;max-width:calc(100vw - 24px)}.export-popup.configured{width:min(540px,100vw - 24px)}.export-format-list .popup-title{text-transform:lowercase;margin:2px 6px 7px}.export-workspace{grid-template-columns:minmax(220px,1fr) minmax(240px,1fr);align-items:start;gap:16px;display:grid}.export-settings{min-width:0;padding:2px}.export-name{color:var(--text-muted);grid-template-columns:52px minmax(0,1fr);align-items:center;gap:7px;margin:2px 0 12px;font-size:11px;display:grid}.export-name input{border:1px solid var(--control-border);background:var(--surface-card);width:100%;min-width:0;height:30px;color:var(--text-secondary);font:inherit;border-radius:8px;outline:none;padding:3px 8px}.export-name input:focus{border-color:var(--accent)}.export-name input::placeholder{color:var(--text-muted);opacity:.65}.export-create-button:disabled,.export-ready button:disabled{cursor:default;opacity:.42}.export-preview-column{flex-direction:column;justify-content:flex-start;align-items:center;gap:7px;min-width:0;min-height:290px;padding-top:2px;display:flex}.export-preview-shell{border:1px solid var(--control-border);background:var(--surface-viewport);border-radius:14px;transition:width .18s,height .18s;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff2e,0 7px 22px #0000000b}.export-preview-column.ratio-square .export-preview-shell{width:220px;height:220px}.export-preview-column.ratio-desktop .export-preview-shell{width:240px;height:135px;margin-top:34px}.export-preview-column.ratio-phone .export-preview-shell{width:146px;height:260px}.export-preview-caption{width:100%;color:var(--text-muted);text-align:center;font-size:10px}.export-preview-shell.transparent{background-image:linear-gradient(45deg,#0000000e 25%,#0000 25%),linear-gradient(-45deg,#0000000e 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#0000000e 75%),linear-gradient(-45deg,#0000 75%,#0000000e 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.export-preview-shell canvas{width:100%;height:100%;display:block}.export-background-toggle{width:100%;min-height:24px;color:var(--text-muted);grid-template-columns:1fr 38px;align-items:center;gap:8px;font-size:11px;display:grid}.export-background-toggle .toggle-switch{justify-self:end}.export-background-toggle.disabled{opacity:.55}.export-background-note{min-height:12px;color:var(--text-muted);text-align:right;margin-top:-5px;font-size:9px}.export-ready{grid-template-columns:1fr}.export-ready .export-again{grid-column:1}@media (max-width:620px){.export-popup.configured{width:min(330px,100vw - 34px)}.export-workspace{grid-template-columns:1fr}.export-preview-column{order:-1}.export-preview-shell{width:min(100%,250px);max-height:180px;margin:0 auto}}.dual-range{--range-low:0%;--range-high:100%;height:43px;margin:-2px 0 7px;position:relative}.dual-range-values{justify-content:space-between;align-items:start;height:17px;padding:0;display:flex}.range-value-box{width:44px;height:17px;color:var(--text-muted);text-align:center;background:0 0;border:1px solid #0000;border-radius:6px;outline:none;padding:0 3px;font-size:9px;line-height:15px}.range-value-box:hover{background:var(--control-bg);border-color:var(--control-border)}.range-value-box:focus{background:var(--surface-card);border-color:var(--slider-thumb-border);color:var(--text-secondary)}.dual-range-track{background:var(--slider-track);border-radius:999px;height:5px;position:absolute;top:25px;left:6px;right:6px;overflow:hidden}.dual-range-track i{top:0;bottom:0;left:var(--range-low);right:calc(100% - var(--range-high));border-radius:inherit;background:var(--accent);position:absolute}.dual-range input[type=range]{appearance:none;z-index:2;pointer-events:none;background:0 0;width:100%;height:24px;margin:0;position:absolute;top:16px;left:0}.dual-range input[type=range]:last-of-type{z-index:3}.dual-range input[type=range]::-webkit-slider-runnable-track{background:0 0;height:5px}.dual-range input[type=range]::-moz-range-track{background:0 0;height:5px}.dual-range input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--surface-card);border:1.5px solid var(--accent);width:13px;height:24px;box-shadow:none;pointer-events:auto;cursor:ew-resize;border-radius:7px;margin-top:-9.5px}.dual-range input[type=range]::-moz-range-thumb{background:var(--surface-card);border:1.5px solid var(--accent);width:11px;height:22px;box-shadow:none;pointer-events:auto;cursor:ew-resize;border-radius:7px}.dual-range.disabled{opacity:.45}.animation-page{padding-bottom:4px}.animation-style-label{margin:4px 2px 6px}.animation-style-grid{grid-template-columns:1fr 1fr;gap:5px;margin-bottom:15px;display:grid}.animation-style-grid .pill-button{min-height:28px}.animation-parameter-list{gap:8px;display:grid}.animation-parameter-card{border:1px solid var(--control-border);background:#ffffff1f;border-radius:12px;padding:9px 10px 6px;transition:border-color .18s,background .18s}.animation-parameter-card.focused{border-color:var(--accent);background:var(--control-bg)}.animation-parameter-title-row{grid-template-columns:minmax(0,1fr) 30px 38px;align-items:center;gap:5px;min-height:25px;margin-bottom:5px;display:grid}.animation-parameter-title-row>span{color:var(--text-secondary);font-size:13px;font-weight:600}.animation-parameter-title-row .toggle-switch{justify-self:end}.animation-local-play{width:28px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;padding:0;display:grid}.animation-local-play:hover{background:var(--control-hover)}.animation-local-play.active{color:var(--accent);background:var(--control-selected)}.animation-local-play svg{fill:currentColor;width:15px;height:15px;display:block}.animation-parameter-card .labeled-slider{margin-bottom:2px}.animation-range-label{color:var(--text-muted);margin:0 2px 2px;font-size:11px}.geometry-orientation-label{margin-top:1px;margin-bottom:5px}.geometry-orientation{margin-bottom:15px}.slider-input.centered::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--slider-track) 0 var(--fill-start), var(--accent) var(--fill-start) var(--fill-end), var(--slider-track) var(--fill-end) 100%)}.slider-input.centered::-moz-range-track{background:linear-gradient(to right, var(--slider-track) 0 var(--fill-start), var(--accent) var(--fill-start) var(--fill-end), var(--slider-track) var(--fill-end) 100%)}.slider-input.centered::-moz-range-progress{background:0 0}.tooltip-button{position:relative;overflow:visible}.tooltip-button:after{content:attr(data-tooltip);z-index:240;border:1px solid var(--control-border);background:var(--surface-card);width:178px;color:var(--text-secondary);text-align:left;white-space:normal;opacity:0;visibility:hidden;pointer-events:none;border-radius:9px;padding:7px 8px;font-size:11px;font-weight:500;line-height:1.35;position:absolute;box-shadow:0 8px 24px #0000000f}.tooltip-button:hover:after,.tooltip-button:focus-visible:after{opacity:1;visibility:visible}.tooltip-above:after{bottom:calc(100% + 7px);left:50%;transform:translate(-50%)}.tooltip-below:after{top:calc(100% + 5px)}.animation-style-grid .tooltip-button:nth-child(odd):after{left:0}.animation-style-grid .tooltip-button:nth-child(2n):after{right:0}.geometry-orientation-inline{width:112px;min-width:0;margin:0}.geometry-orientation-inline.segmented{margin-bottom:0}.geometry-orientation-inline .pill-button{min-width:0;min-height:18px;padding:0 4px;font-size:10px;line-height:18px}.create-preset-button{height:34px;margin:4px 0 2px}.about-panel{color:var(--text-secondary);padding:1px 2px 8px}.about-title{color:var(--text-primary);text-transform:lowercase;margin:0 0 4px;font-size:18px;font-weight:650}.about-equation{color:var(--text-muted);margin:0 0 13px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;line-height:1.45}.about-description,.about-history{color:var(--text-secondary);margin:0;font-size:12px;line-height:1.55}.about-graphic{border:1px solid var(--control-border);background:var(--surface-viewport);border-radius:12px;place-items:center;height:150px;margin:15px 0 16px;display:grid;overflow:hidden}.about-svg{width:100%;height:100%;display:block}.about-history-title{color:var(--text-primary);text-transform:lowercase;margin:0 0 6px;font-size:13px;font-weight:650}.about-outline,.about-plate{fill:none;stroke:var(--text-muted);stroke-width:1.25px;opacity:.55}.about-node{fill:var(--text-muted);opacity:.72}.about-polygon-lines{fill:none;stroke:var(--text-primary);stroke-width:1px;opacity:.64;transform-origin:130px 75px;animation:5s ease-in-out infinite alternate aboutPolygonShift}@keyframes aboutPolygonShift{0%{opacity:.42;transform:rotate(-3deg)scale(.96)}to{opacity:.78;transform:rotate(8deg)scale(1.02)}}.about-chladni-lines{fill:none;stroke:var(--text-primary);stroke-width:1.35px;opacity:.65;animation:3.2s ease-in-out infinite alternate aboutChladniPulse}.about-sand{fill:var(--text-muted);opacity:.75;animation:3.2s ease-in-out infinite alternate aboutSandSettle}@keyframes aboutChladniPulse{0%{opacity:.36;transform-origin:130px 75px;transform:scale(.985)}to{opacity:.82;transform-origin:130px 75px;transform:scale(1.015)}}@keyframes aboutSandSettle{0%{opacity:.42;transform:translateY(4px)}to{opacity:.86;transform:translateY(-2px)}}.about-penrose-base polygon{fill:none;stroke:var(--text-primary);stroke-width:1.2px;opacity:.58}.about-penrose-overlay{transform-origin:130px 75px;animation:5.4s ease-in-out infinite alternate aboutPenroseOverlay}.about-penrose-overlay polygon{fill:none;stroke:var(--text-primary);stroke-width:1.2px;opacity:.28}@keyframes aboutPenroseOverlay{0%{transform:translate(-3px,2px)rotate(-2deg)}to{transform:translate(7px,-4px)rotate(7deg)}}@media (prefers-reduced-motion:reduce){.about-polygon-lines,.about-chladni-lines,.about-sand,.about-penrose-overlay{animation:none}}