*{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #1a1a1a;--bg-darker: #0f0f0f;--bg-panel: #252525;--bg-control: #2d2d2d;--bg-hover: #353535;--text-primary: #fff;--text-secondary: #a0a0a0;--accent-blue: #4a9eff;--accent-blue-dim: #3a7ac7;--border-color: #3a3a3a;--disabled-opacity: .4;--panel-width: 360px;--footer-height: 0px;--overlay-dark: rgb(0 0 0 / 70%);--overlay-medium: rgb(0 0 0 / 40%);--overlay-light: rgb(255 255 255 / 10%);--overlay-lighter: rgb(255 255 255 / 20%);--button-bg: rgb(45 45 45 / 85%);--button-bg-hover: rgb(53 53 53 / 90%);--transition-fast: .2s ease;--transition-normal: .3s ease;--button-blue-bg: rgb(74 158 255 / 90%);--button-blue-bg-active: rgb(58 122 199 / 95%);--button-blue-shadow: 0 4px 12px rgb(74 158 255 / 30%);--button-blue-shadow-hover: 0 6px 20px rgb(74 158 255 / 50%);--button-blue-focus-shadow: 0 0 0 4px rgb(74 158 255 / 20%);--button-blue-focus-shadow-full: 0 0 0 4px rgb(74 158 255 / 30%);--panel-btn-size: 44px;--panel-btn-opacity: .7;--panel-btn-opacity-hover: 1;--panel-btn-border-radius: 8px;--panel-btn-shadow: 0 4px 12px rgb(0 0 0 / 30%);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 20px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--z-canvas: 1;--z-ui: 100;--z-panel-btn: 200;--z-loading: 1000;--z-fullscreen: 2000;--panel-image-width-full: 320px;--panel-image-width-comfortable: 280px;--panel-image-width-compact: 260px;--panel-image-margin: 20px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:var(--bg-darker);color:var(--text-primary);height:100vh;overflow:hidden}.app-container{display:flex;height:100vh;width:100vw}.side-panel{width:var(--panel-width);background:var(--bg-panel);display:flex;flex-direction:column;border-right:1px solid var(--border-color);overflow:hidden;transition:transform var(--transition-normal),width var(--transition-normal);will-change:transform,width;contain:layout style paint}.side-panel.hidden{transform:translate(calc(-1 * var(--panel-width)));width:0}.panel-header{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg) var(--spacing-xl);border-bottom:1px solid var(--border-color);background:var(--bg-dark)}.panel-header h1{flex:1;font-size:1.1rem;font-weight:600;letter-spacing:.3px}.back-btn,.minimize-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s ease}.back-btn:hover,.minimize-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.panel-content{flex:1;overflow:hidden auto;padding:8px 0;padding-bottom:var(--footer-height, 120px)}.panel-content::-webkit-scrollbar{width:8px}.panel-content::-webkit-scrollbar-track{background:var(--bg-panel)}.panel-content::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.panel-content:hover::-webkit-scrollbar-thumb{background:#4a4a4a}.panel-warning{display:flex;align-items:flex-start;gap:10px;padding:12px 16px;margin:8px 12px;background:#ffc10726;border:1px solid rgb(255 193 7 / 30%);border-radius:6px;color:#ffc107;font-size:.85rem;line-height:1.4}.warning-icon{flex-shrink:0;margin-top:2px;color:#ffc107}.panel-warning span{flex:1}.section{margin:0;border-bottom:1px solid var(--border-color)}.section-header{width:100%;display:flex;align-items:center;gap:12px;padding:14px 20px;background:transparent;border:none;color:var(--text-primary);font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s ease;text-align:left}.section-header:hover{background:var(--bg-hover)}.section-icon{color:var(--text-secondary);flex-shrink:0}.section-header span{flex:1}.section-header .chevron{color:var(--text-secondary);transition:transform .3s ease;flex-shrink:0;will-change:transform}.section-header.collapsed .chevron{transform:rotate(-90deg)}.section-content{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease;padding:0 20px;will-change:max-height;contain:layout style}.section-content.active{max-height:2000px;padding:16px 20px}.right-panel .section-content.active{overflow:visible}.control{margin-bottom:20px}.control:last-child{margin-bottom:0}.math-info-header{margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border-color)}.fractal-name{margin:0 0 4px;font-size:1.1rem;font-weight:600;color:var(--text-primary)}.fractal-family{margin:0;font-size:.85rem;color:var(--text-secondary);text-transform:capitalize}.math-info-section{margin-bottom:20px}.math-info-section:last-child{margin-bottom:0}.math-info-title{margin:0 0 12px;font-size:.95rem;font-weight:600;color:var(--text-primary)}.math-info-formula{margin-bottom:16px;padding:12px;background:var(--bg-dark);border-radius:6px;border:1px solid var(--border-color)}.math-info-formula:last-child{margin-bottom:0}.formula-title{font-size:.85rem;font-weight:600;color:var(--text-secondary);margin-bottom:6px}.formula-text{font-size:.9rem;color:var(--text-primary);margin-bottom:8px;padding:8px;background:var(--bg-darker);border-radius:4px;border:1px solid var(--border-color);overflow-x:auto;text-align:center}.formula-text .katex{font-size:1.1em}.formula-text .katex-display{margin:0}.formula-description{font-size:.85rem;color:var(--text-secondary);line-height:1.5;margin-top:8px}.math-info-properties{list-style:none;padding:0;margin:0}.math-info-properties li{margin-bottom:8px;font-size:.9rem;color:var(--text-primary);line-height:1.5}.math-info-properties li:last-child{margin-bottom:0}.math-info-properties strong{color:var(--text-secondary);margin-right:6px}.discoverer-link,.complexity-link,.property-label-link{color:var(--accent-blue);text-decoration:none;transition:all .2s ease;border-bottom:1px solid transparent}.discoverer-link:hover,.complexity-link:hover,.property-label-link:hover{color:var(--accent-blue);border-bottom-color:var(--accent-blue);text-decoration:none}.math-info-text{font-size:.9rem;color:var(--text-primary);line-height:1.6;margin:0}.math-info-related{display:flex;flex-wrap:wrap;gap:8px}.related-fractal-chip{color:var(--text-primary);font-size:.85rem}.math-info-wikipedia-link{display:inline-block;margin-top:16px;padding:8px 16px;background:var(--bg-dark);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);text-decoration:none;font-size:.9rem;transition:all .2s ease}.math-info-wikipedia-link:hover{background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff}.math-info-fallback{padding:16px;text-align:center;color:var(--text-secondary)}.math-info-fallback p{margin:0 0 12px;font-size:.9rem}.math-info-loading{padding:16px;text-align:center;color:var(--text-secondary);font-size:.9rem}.side-panel .panel-content .section-content .control:has(.coordinate-display){display:none}.control:has(#y-scale){margin-bottom:25px}.control label{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--text-secondary);margin-bottom:10px;font-weight:500}.control label .value{color:var(--accent-blue);font-weight:600;font-size:.9rem}.styled-select{width:100%;padding:10px 36px 10px 20px;background:var(--bg-control);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-size:.9rem;cursor:pointer;outline:none;transition:all .2s ease;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:linear-gradient(to right,var(--text-secondary) 0,var(--text-secondary) 1px,transparent 1px),url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 4L6 8L10 4' stroke='%23ffffff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat,no-repeat;background-position:right 37px center,right 14px center;background-size:1px 60%,12px}.styled-select:hover{border-color:#4a4a4a}.styled-select:focus{border-color:var(--accent-blue)}.styled-select option{background:var(--bg-control);color:var(--text-primary)}.styled-slider{width:100%;height:4px;background:var(--bg-control);border-radius:2px;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none}.styled-slider:focus-visible{outline:2px solid var(--accent-blue);outline-offset:4px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}.styled-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:var(--accent-blue);border-radius:50%;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #4a9eff66;will-change:transform}.styled-slider:hover::-webkit-slider-thumb{transform:scale(1.15);box-shadow:0 2px 12px #4a9eff99}.styled-slider::-moz-range-thumb{width:16px;height:16px;background:var(--accent-blue);border:none;border-radius:50%;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #4a9eff66;will-change:transform}.styled-slider:hover::-moz-range-thumb{transform:scale(1.15);box-shadow:0 2px 12px #4a9eff99}.styled-slider:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.styled-slider:disabled::-webkit-slider-thumb{cursor:not-allowed;background:var(--text-secondary);box-shadow:none}.styled-slider:disabled::-moz-range-thumb{cursor:not-allowed;background:var(--text-secondary);box-shadow:none}#julia-controls{transition:opacity .3s ease}#julia-controls.disabled{display:none}.checkbox-label{display:flex;align-items:flex-start;gap:12px;cursor:pointer;-webkit-user-select:none;user-select:none;padding:4px 0}.styled-checkbox{width:18px;height:18px;cursor:pointer;accent-color:var(--accent-blue);flex-shrink:0;margin-top:2px}.checkbox-content{display:flex;flex-direction:column;gap:4px;flex:1}.checkbox-text{color:var(--text-primary);font-size:.9rem;font-weight:500;line-height:1.4}.checkbox-description{color:var(--text-secondary);font-size:.8rem;line-height:1.4}.coordinate-display{background:var(--bg-control);border:1px solid var(--border-color);border-radius:8px;padding:12px;margin-top:8px}.side-panel .panel-content .section-content .coordinate-display,.side-panel .panel-content .section-content .control-label:first-child+.coordinate-display{display:none}.side-panel .panel-content .section-content .control>.control-label:first-child:has(+.coordinate-display){display:none}.coordinate-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:.9rem}.coordinate-row:last-of-type{margin-bottom:12px}.coordinate-label{color:var(--text-secondary);font-weight:500}.coordinate-value{color:var(--accent-blue);font-family:Courier New,monospace;font-weight:600;font-size:.9rem}.copy-coords-btn{width:100%;padding:10px 16px;background:var(--bg-hover);border:1px solid var(--border-color);border-radius:8px;color:var(--text-primary);font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all var(--transition-fast);margin-top:8px;will-change:transform}.copy-coords-btn:hover{background:var(--accent-blue-dim);border-color:var(--accent-blue);transform:translateY(-1px)}.copy-coords-btn:active{transform:translateY(0)}.debug-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:4px}.debug-value{color:var(--accent-blue);font-family:Courier New,monospace;font-weight:600;font-size:.9rem;flex:1;word-break:break-all}.debug-copy-btn{background:var(--bg-hover);border:1px solid var(--border-color);border-radius:4px;padding:6px 8px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:all var(--transition-fast);flex-shrink:0}.debug-copy-btn:hover{background:var(--bg-control);color:var(--text-primary);border-color:var(--accent-blue)}.debug-copy-btn:active{transform:scale(.95)}.copy-coords-btn svg{flex-shrink:0}.wikipedia-link{display:flex;align-items:center;gap:2px;padding:10px 16px;background:var(--button-bg);border:1px solid var(--overlay-light);border-radius:8px;color:var(--text-primary);text-decoration:none;font-size:.9rem;font-weight:500;transition:all .2s ease;margin-top:8px;width:100%;justify-content:center;outline:none;box-shadow:0 2px 8px #0000004d;will-change:transform}.wikipedia-link:hover{background:#4a9effe5;border-color:var(--accent-blue);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #4a9eff4d}.wikipedia-link:active{transform:translateY(0);background:#3a7ac7f2;border-color:var(--accent-blue-dim)}.wikipedia-link:focus-visible{outline:2px solid var(--accent-blue);outline-offset:2px;background:#4a9effe5;border-color:var(--accent-blue);color:#fff;box-shadow:0 0 0 4px #4a9eff33,0 4px 12px #4a9eff4d}.wikipedia-link svg{flex-shrink:0}.footer-share-btn{width:100%;padding:8px 16px;background:var(--bg-hover);border:1px solid var(--border-color);border-radius:6px;color:var(--text-primary);font-size:.85rem;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:all var(--transition-fast);margin-top:10px;will-change:transform}.footer-share-btn:hover{background:var(--accent-blue-dim);border-color:var(--accent-blue);transform:translateY(-1px)}.footer-share-btn:active{transform:translateY(0)}.footer-share-btn svg{flex-shrink:0}.footer-share-description{opacity:0;max-height:0;overflow:hidden;transition:opacity .2s ease,max-height .2s ease,margin-bottom .2s ease;margin-bottom:0;font-size:.75rem;color:var(--text-secondary);text-align:center;line-height:1.4;padding:0 10px}.app-footer:has(#share-fractal-btn:hover) .footer-share-description{opacity:1;max-height:100px;margin-bottom:6px}.control-description{font-size:.8rem;color:var(--text-secondary);margin-top:6px;line-height:1.4;padding-left:28px}.navigation-description{font-size:.8rem;color:var(--text-secondary);margin-top:6px;line-height:1.4;padding-left:18px}.navigation-list{margin:6px 0 0;padding-left:18px;font-size:.8rem;color:var(--text-secondary);line-height:1.4}.navigation-list li+li{margin-top:4px}.top-action-bar{position:absolute;top:0;left:0;right:0;display:flex;gap:12px;padding:16px 20px;background:linear-gradient(to bottom,rgb(0 0 0 / 70%) 0%,rgb(0 0 0 / 40%) 70%,transparent 100%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;pointer-events:none;opacity:1;transition:opacity .3s ease;will-change:opacity;contain:layout style paint}.top-action-bar #benchmark-toggle{margin-left:auto}.canvas-area:not(:hover) .top-action-bar{opacity:.6}.canvas-area .top-action-bar:hover{opacity:1}.canvas-area .top-action-bar:has(.top-action-btn:focus-visible){opacity:1}.top-action-btn{display:flex;align-items:center;gap:8px;padding:10px 18px;background:var(--button-bg);border:1px solid var(--overlay-light);border-radius:8px;color:var(--text-primary);font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease;outline:none;pointer-events:auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 8px #0000004d;will-change:transform}.top-action-btn svg{flex-shrink:0}.top-action-btn:focus-visible{outline:2px solid var(--accent-blue);outline-offset:2px;background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff;box-shadow:var(--button-blue-focus-shadow),var(--button-blue-shadow)}.top-action-btn:hover{background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff;transform:translateY(-1px);box-shadow:var(--button-blue-shadow);transition:all var(--transition-fast)}.top-action-btn:active{transform:translateY(0);background:var(--button-blue-bg-active);border-color:var(--accent-blue-dim)}.top-action-btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.top-action-btn:disabled:hover{transform:none;box-shadow:0 2px 8px #0000004d;background:var(--button-bg);border-color:var(--overlay-light);color:var(--text-primary);transition:none}.show-panel-btn{position:fixed;top:50%;left:var(--spacing-xl);transform:translateY(-50%);width:var(--panel-btn-size);height:var(--panel-btn-size);background:var(--button-bg);border:1px solid var(--overlay-lighter);border-radius:var(--panel-btn-border-radius);color:var(--text-primary);cursor:pointer;display:none;align-items:center;justify-content:center;z-index:var(--z-panel-btn);transition:all var(--transition-fast);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--panel-btn-shadow);will-change:transform;opacity:var(--panel-btn-opacity)}.show-panel-btn:hover{background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff;transform:translateY(-50%) translate(2px);box-shadow:var(--button-blue-shadow);opacity:var(--panel-btn-opacity-hover)}.side-panel.hidden~.canvas-area .show-panel-btn{display:flex}.right-panel{width:var(--panel-width);background:var(--bg-panel);display:flex;flex-direction:column;border-left:1px solid var(--border-color);overflow:hidden;transition:transform var(--transition-normal),width var(--transition-normal);will-change:transform,width;contain:layout style paint;position:fixed;top:0;right:0;height:100vh;z-index:100}.right-panel.hidden{transform:translate(var(--panel-width));width:0}.right-panel .panel-header{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border-color);background:var(--bg-dark)}.right-panel .panel-header h1{flex:1;font-size:1.1rem;font-weight:600;letter-spacing:.3px}.right-back-btn{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s ease}.right-back-btn:hover{background:var(--bg-hover);color:var(--text-primary)}.right-panel .panel-content{flex:1;overflow:hidden auto;padding:8px 0 150px}.show-right-panel-btn{position:fixed;top:50%;right:var(--spacing-xl);transform:translateY(-50%);width:var(--panel-btn-size);height:var(--panel-btn-size);background:var(--button-bg);border:1px solid var(--overlay-lighter);border-radius:var(--panel-btn-border-radius);color:var(--text-primary);cursor:pointer;display:none;align-items:center;justify-content:center;z-index:var(--z-panel-btn);transition:all var(--transition-fast);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--panel-btn-shadow);will-change:transform;opacity:var(--panel-btn-opacity)}.show-right-panel-btn:hover{background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff;transform:translateY(-50%) translate(-2px);box-shadow:var(--button-blue-shadow);opacity:var(--panel-btn-opacity-hover)}.show-right-panel-btn,.right-panel.hidden~* .show-right-panel-btn{display:flex}.right-panel:not(.hidden)~* .show-right-panel-btn{display:none}.right-panel .panel-image{width:var(--panel-image-width-comfortable);max-width:100%;height:auto;border-radius:var(--radius-lg);border:1px solid var(--border-color);margin:var(--spacing-md) auto;display:block;transition:all var(--transition-fast);box-shadow:0 2px 8px #0003}.right-panel .panel-image:hover{border-color:var(--accent-blue);box-shadow:0 4px 16px #4a9eff33;transform:translateY(-1px)}.right-panel .panel-image-full{width:var(--panel-image-width-full)}.right-panel .panel-image-compact{width:var(--panel-image-width-compact)}.right-panel .panel-image-container{display:flex;flex-direction:column;align-items:center;margin:var(--spacing-lg) 0}.right-panel .panel-image-title{font-size:.9rem;font-weight:500;color:var(--text-primary);margin-bottom:var(--spacing-sm);text-align:center}.right-panel .panel-image-description{font-size:.8rem;color:var(--text-secondary);margin-top:var(--spacing-sm);text-align:center;line-height:1.4;max-width:var(--panel-image-width-comfortable)}.exif-hidden,.panel-content .exif-hidden,.section-content .exif-hidden,.debug-hidden,.panel-content .debug-hidden,.section-content .debug-hidden{display:none}.current-fractal-info{background:var(--bg-control);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-sm)}.fractal-info-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xs);font-size:.85rem}.fractal-info-row:last-child{margin-bottom:0}.info-label{color:var(--text-secondary);font-weight:500}.info-value{color:var(--accent-blue);font-family:Courier New,monospace;font-weight:600}.image-drop-zone{border:2px dashed var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;cursor:pointer;transition:all var(--transition-fast);background:var(--bg-control);margin-bottom:var(--spacing-sm)}.image-drop-zone:hover{border-color:var(--accent-blue);background:var(--bg-hover)}.image-drop-zone.drag-over{border-color:var(--accent-blue);background:#4a9eff1a;border-style:solid}.drop-zone-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.drop-zone-content svg{color:var(--text-secondary);opacity:.7}.drop-zone-text{font-size:.9rem;font-weight:500;color:var(--text-primary);margin:0}.drop-zone-subtext{font-size:.8rem;color:var(--text-secondary);margin:0}.image-preview{background:var(--bg-control);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-sm)}.image-preview img{width:100%;max-width:var(--panel-image-width-comfortable);height:auto;border-radius:var(--radius-md);margin-bottom:var(--spacing-sm);display:block;margin-left:auto;margin-right:auto}.image-info{display:flex;flex-direction:column;gap:var(--spacing-xs);font-size:.8rem}.image-info span{color:var(--text-secondary)}.image-info span:first-child{color:var(--text-primary);font-weight:500}.exif-json-textarea{width:100%;height:120px;min-height:80px;max-height:200px;padding:var(--spacing-md);background:var(--bg-darker);border:1px solid var(--border-color);border-radius:var(--radius-lg);color:var(--text-primary);font-family:Courier New,monospace;font-size:.85rem;line-height:1.4;resize:vertical;transition:border-color var(--transition-fast)}.exif-json-textarea:focus{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 2px #4a9eff33}.exif-json-textarea::placeholder{color:var(--text-secondary);opacity:.7}.exif-json-textarea::-webkit-scrollbar{width:8px}.exif-json-textarea::-webkit-scrollbar-track{background:var(--bg-darker)}.exif-json-textarea::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}.exif-json-textarea:hover::-webkit-scrollbar-thumb{background:#4a4a4a}.exif-editor-section{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-xl)}#write-exif-btn,#clear-image-btn{display:flex;width:100%;margin-bottom:var(--spacing-md);margin-top:var(--spacing-md);min-height:44px;align-items:center;justify-content:center}.copy-coords-btn#write-exif-btn,.copy-coords-btn#clear-image-btn{display:flex}#write-exif-btn:disabled{opacity:.5;cursor:not-allowed}#clear-image-btn,.copy-coords-btn#clear-image-btn{background:var(--bg-hover)}.presets-container{padding:0}.presets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:var(--spacing-md);padding:0 0 32px;justify-items:center}.preset-item{position:relative;width:310px;height:194px;border-radius:var(--radius-md);overflow:hidden;background:var(--bg-secondary);border:2px solid var(--border-color);cursor:pointer;transition:all var(--transition-fast)}.preset-item:hover{border-color:var(--accent-blue);transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.preset-item:active{transform:translateY(0)}.preset-image{width:100%;height:100%;object-fit:cover;display:block}.preset-info{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,#000c);color:#fff;padding:var(--spacing-sm);font-size:.75rem;opacity:0;transition:opacity var(--transition-fast)}.preset-item:hover .preset-info{opacity:1}.preset-title{font-weight:600;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preset-details{font-size:.7rem;opacity:.9;line-height:1.2}.preset-placeholder{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;min-height:120px;border:2px dashed var(--border-color);border-radius:var(--radius-md);background:var(--bg-darker)}.preset-loading{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;min-height:120px;color:var(--text-secondary);text-align:center;padding:var(--spacing-lg)}.loading-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm)}.loading-spinner{animation:spin 1s linear infinite;color:var(--accent-blue)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.placeholder-content{text-align:center;color:var(--text-secondary);padding:var(--spacing-lg)}.placeholder-content svg{margin-bottom:var(--spacing-sm);opacity:.5}.placeholder-content p{margin:var(--spacing-sm) 0;font-weight:500}.placeholder-content small{opacity:.7;font-size:.75rem}.app-footer{position:fixed;bottom:0;left:0;width:var(--panel-width);padding:12px 20px 16px;background:linear-gradient(to top,var(--overlay-dark) 0%,var(--overlay-medium) 70%,transparent 100%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid rgb(255 255 255 / 5%);z-index:150;transition:transform var(--transition-normal),width var(--transition-normal);display:flex;flex-direction:column;height:fit-content;min-height:fit-content;will-change:transform,width;contain:layout style paint}.app-footer p{margin:0;font-size:.85rem;color:var(--text-secondary);text-align:center}.app-footer p:nth-child(2){margin-top:2px}.app-footer .footer-license{margin-top:8px;font-size:.75rem;opacity:.8}.app-footer a{color:var(--accent-blue);text-decoration:none;transition:color .2s ease}.app-footer a:hover{color:var(--text-primary);text-decoration:underline}.eli5-link{color:var(--accent-blue);text-decoration:none;transition:color .2s ease}.eli5-link:hover{color:var(--text-primary);text-decoration:underline}.footer-separator{margin:0 8px;color:#ffffff4d}.github-link{display:inline-flex;align-items:center;gap:4px}.fullscreen-control-btn svg{width:24px;height:24px}.github-link svg{vertical-align:middle;transition:transform .2s ease;will-change:transform}.github-link:hover svg{transform:scale(1.1)}.side-panel.hidden~.app-footer{transform:translate(calc(-1 * var(--panel-width)));width:0;opacity:0}.canvas-area{flex:1;display:flex;flex-direction:column;background:var(--bg-darker);position:relative;overflow:hidden;transition:width var(--transition-normal);contain:layout style}.canvas-container{flex:1;position:relative;background:#000;overflow:hidden;contain:layout style paint}#fractal-canvas{display:block;width:100%;height:100%;cursor:grab;will-change:contents;contain:strict}#fractal-canvas:active{cursor:grabbing}.selection-box{position:absolute;border:2px dashed var(--accent-blue);background:#4a9eff1a;pointer-events:none;display:none;z-index:100;box-shadow:0 0 10px #4a9eff7f;will-change:transform;contain:layout style paint}.selection-box.active{display:block}#info-panel{position:absolute;bottom:16px;right:16px;background:#000000bf;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:8px 14px;border-radius:8px;font-size:.8rem;font-family:Courier New,monospace;border:1px solid rgb(255 255 255 / 10%);transition:opacity .3s ease}#info-panel div{color:var(--text-secondary)}.loading-bar{position:absolute;top:0;left:0;width:0%;height:3px;background:linear-gradient(90deg,var(--accent-blue) 0%,#6fb3ff 50%,var(--accent-blue) 100%);background-size:200% 100%;opacity:0;transition:opacity .15s ease;z-index:1000;pointer-events:none;box-shadow:0 0 12px #4a9effcc;will-change:width,opacity,background-position;contain:layout style paint}.loading-bar.active{opacity:1;animation:loading-progress .8s ease-out,loading-shimmer 1.2s linear infinite}@keyframes loading-progress{0%{width:0%}to{width:100%}}@keyframes loading-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.fullscreen-controls{position:fixed;bottom:20px;right:20px;display:none;flex-direction:column;gap:12px;z-index:2000;pointer-events:none;opacity:1;transition:opacity .5s ease-in-out}.fullscreen-controls.visible{display:flex}.fullscreen-controls.faded{opacity:0}.fullscreen-control-btn{width:48px;height:48px;border-radius:50%;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgb(255 255 255 / 20%);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;pointer-events:auto;box-shadow:0 4px 12px #0006;position:relative;outline:none;will-change:transform}.fullscreen-control-btn:hover{background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff;transform:scale(1.1);box-shadow:var(--button-blue-shadow-hover)}.fullscreen-control-btn:active{transform:scale(.95);background:var(--button-blue-bg-active);border-color:var(--accent-blue-dim)}.fullscreen-control-btn:focus-visible{outline:2px solid var(--accent-blue);outline-offset:3px;background:var(--button-blue-bg);border-color:var(--accent-blue);color:#fff;transform:scale(1.1);box-shadow:var(--button-blue-focus-shadow-full),var(--button-blue-shadow-hover)}.fullscreen-random-number{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;background:#f59e0b;color:#fff;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;padding:0 4px;box-shadow:0 2px 6px #0000007f;border:2px solid rgb(0 0 0 / 30%);line-height:1}.fullscreen-color-palette{position:absolute;top:-4px;right:-4px;width:16px;height:16px;border-radius:2px;border:2px solid rgb(0 0 0 / 50%);box-shadow:0 1px 3px #0006;image-rendering:pixelated;image-rendering:crisp-edges}.fullscreen-iterations-controls{display:flex;flex-direction:column;gap:8px;align-items:center}.fullscreen-iterations-number{min-width:32px;height:24px;background:#000000b3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgb(255 255 255 / 20%);color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;padding:0 8px;box-shadow:0 2px 6px #0000007f;line-height:1}.canvas-container:fullscreen{width:100vw;height:100vh;background:#000}.canvas-container:fullscreen .fullscreen-controls{display:flex}body.is-fullscreen #info-panel{display:none;opacity:0;visibility:hidden;pointer-events:none}div.canvas-container:fullscreen>#info-panel{display:none;opacity:0;visibility:hidden;pointer-events:none}.canvas-container:fullscreen .loading-bar{position:fixed;width:100vw}.canvas-area:has(.canvas-container:fullscreen) .top-action-bar{display:none}body.is-fullscreen .canvas-area .top-action-bar #benchmark-toggle{display:none}.canvas-area:has(.canvas-container:fullscreen) .top-action-bar #benchmark-toggle{display:none}body.is-fullscreen .app-container .side-panel{display:none;visibility:hidden;opacity:0;pointer-events:none}.benchmark-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;max-width:90vw;max-height:80vh;background:var(--bg-panel);border:2px solid var(--border-color);border-radius:8px;box-shadow:0 8px 32px #0009;z-index:10000;display:none;overflow:hidden;will-change:transform,opacity;contain:layout style paint}.benchmark-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--border-color);background:var(--bg-darker)}.benchmark-header h3{margin:0;font-size:18px;font-weight:600;color:var(--text-primary)}.benchmark-close{background:none;border:none;color:var(--text-secondary);font-size:24px;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all var(--transition-fast)}.benchmark-close:hover{background:var(--bg-hover);color:var(--text-primary)}.benchmark-content{padding:20px;overflow-y:auto;max-height:calc(80vh - 80px)}.benchmark-controls{display:flex;flex-direction:column;gap:16px;margin-bottom:20px}.benchmark-controls label{display:flex;flex-direction:column;gap:8px;color:var(--text-secondary);font-size:14px}.benchmark-controls select,.benchmark-controls input{padding:8px 12px;background:var(--bg-control);border:1px solid var(--border-color);border-radius:4px;color:var(--text-primary);font-size:14px;transition:all var(--transition-fast)}.benchmark-controls select:focus,.benchmark-controls input:focus{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 2px #4a9eff33}.benchmark-btn{padding:10px 20px;background:var(--accent-blue);color:#fff;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all var(--transition-fast);will-change:transform}.benchmark-btn:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.benchmark-btn:hover:not(:disabled){background:var(--accent-blue-dim);transform:translateY(-1px);box-shadow:0 4px 12px #4a9eff4d}.benchmark-status{margin-bottom:20px;min-height:24px}.benchmark-progress{color:var(--accent-blue);font-size:14px}.benchmark-success{color:#4ade80;font-size:14px;font-weight:600}.benchmark-error{color:#f87171;font-size:14px;font-weight:600}.benchmark-results{background:var(--bg-darker);border:1px solid var(--border-color);border-radius:4px;padding:16px;font-family:Monaco,Menlo,Courier New,monospace;font-size:12px;line-height:1.6;color:var(--text-primary);max-height:400px;overflow-y:auto}.benchmark-results pre{margin:0;white-space:pre-wrap;overflow-wrap:break-word}body.is-fullscreen .app-container .app-footer{display:none;visibility:hidden;opacity:0;pointer-events:none}.app-container:has(.canvas-container:fullscreen) .side-panel.side-panel{display:none;visibility:hidden;opacity:0;pointer-events:none}.app-container:has(.canvas-container:fullscreen) .app-footer.app-footer{display:none;visibility:hidden;opacity:0;pointer-events:none}@media(max-width:768px){.app-container{flex-direction:column}.side-panel{width:100%;max-height:40vh;border-right:none;border-bottom:1px solid var(--border-color)}.side-panel.hidden{transform:translateY(-40vh);max-height:0}.top-action-bar{flex-wrap:wrap;padding:12px 16px;gap:8px}.top-action-btn{padding:8px 14px;font-size:.85rem;gap:6px}.top-action-btn svg{width:16px;height:16px}.show-panel-btn{top:10px;left:10px}.app-footer{width:100%;position:fixed}.side-panel.hidden~.app-footer{transform:translateY(100%);opacity:0}}