:root,[data-gs-theme="light"]{--gs-radius:16px;--gs-radius-sm:10px;--gs-radius-xs:6px;--gs-transition:all 0.22s cubic-bezier(0.4, 0, 0.2, 1);--gs-accent:#6366f1;--gs-accent-hover:#4f46e5;--gs-accent-soft:rgba(99,102,241,0.1);--gs-font-mono:'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;--gs-bg-page:#f1f5f9;--gs-bg-card:#ffffff;--gs-bg-input:#f8fafc;--gs-bg-input-focus:#ffffff;--gs-bg-stop:#f8fafc;--gs-bg-stop-hover:#f1f5f9;--gs-bg-tag:#f8fafc;--gs-bg-search:#f8fafc;--gs-bg-search-focus:#ffffff;--gs-border-color:rgba(0,0,0,0.07);--gs-border-stop:#e8edf3;--gs-border-stop-hover:#c8d3e0;--gs-border-input:#e2e8f0;--gs-border-input-focus:var(--gs-accent);--gs-border-tag:#e2e8f0;--gs-border-dashed:#d1d5db;--gs-border-pill:#e2e8f0;--gs-text-primary:#1e293b;--gs-text-secondary:#64748b;--gs-text-muted:#94a3b8;--gs-text-label:#94a3b8;--gs-text-input:#334155;--gs-text-preset-name:#1e293b;--gs-shadow-soft:0 4px 20px rgba(0,0,0,0.07);--gs-shadow-card:0 2px 12px rgba(0,0,0,0.06);--gs-shadow-card-hover:0 10px 28px rgba(0,0,0,0.1);--gs-scrollbar-thumb:#dde1e8;--gs-scrollbar-thumb-hover:#b8c0cc;--gs-theme-icon-sun:block;--gs-theme-icon-moon:none;--gs-ring-bg:#f8fafc;--gs-ring-border:#e2e8f0;--gs-preset-border:rgba(0,0,0,0.06);--gs-preset-bg:#ffffff;--gs-section-label:#94a3b8;--gs-del-hover-bg:#fee2e2;--gs-del-hover-color:#ef4444;--gs-tag-active-bg:var(--gs-accent);--gs-tag-active-color:#fff;--gs-fmt-active-bg:#1e293b;--gs-fmt-active-color:#fff;--gs-fmt-active-border:#1e293b;--gs-export-bg:#0f172a;--gs-export-text:#94a3b8;--gs-toast-bg:#1e293b;--gs-toast-color:#f1f5f9;--gs-checker-a:#e2e8f0;--gs-checker-b:#f1f5f9;--gs-empty-color:#94a3b8;--gs-topbtn-bg:#f1f5f9;--gs-topbtn-border:#e2e8f0;--gs-topbtn-color:#64748b;--gs-topbtn-hover-bg:#e2e8f0;--gs-counter-color:#94a3b8}[data-gs-theme="dark"],.uk-light [data-gs-theme="dark"],.uk-light{--gs-bg-page:#0f172a;--gs-bg-card:#1e293b;--gs-bg-input:#0f172a;--gs-bg-input-focus:#1e293b;--gs-bg-stop:#1a2535;--gs-bg-stop-hover:#243046;--gs-bg-tag:#1a2535;--gs-bg-search:#0f172a;--gs-bg-search-focus:#1a2535;--gs-border-color:rgba(255,255,255,0.07);--gs-border-stop:rgba(255,255,255,0.08);--gs-border-stop-hover:rgba(255,255,255,0.18);--gs-border-input:rgba(255,255,255,0.12);--gs-border-input-focus:var(--gs-accent);--gs-border-tag:rgba(255,255,255,0.1);--gs-border-dashed:rgba(255,255,255,0.2);--gs-border-pill:rgba(255,255,255,0.1);--gs-text-primary:#f1f5f9;--gs-text-secondary:#94a3b8;--gs-text-muted:#64748b;--gs-text-label:#64748b;--gs-text-input:#e2e8f0;--gs-text-preset-name:#f1f5f9;--gs-shadow-soft:0 4px 24px rgba(0,0,0,0.4);--gs-shadow-card:0 2px 12px rgba(0,0,0,0.3);--gs-shadow-card-hover:0 10px 32px rgba(0,0,0,0.5);--gs-scrollbar-thumb:#334155;--gs-scrollbar-thumb-hover:#475569;--gs-ring-bg:#1e293b;--gs-ring-border:rgba(255,255,255,0.15);--gs-preset-border:rgba(255,255,255,0.06);--gs-preset-bg:#1e293b;--gs-section-label:#475569;--gs-del-hover-bg:rgba(239,68,68,0.15);--gs-del-hover-color:#f87171;--gs-tag-active-bg:var(--gs-accent);--gs-tag-active-color:#fff;--gs-fmt-active-bg:#e2e8f0;--gs-fmt-active-color:#0f172a;--gs-fmt-active-border:#e2e8f0;--gs-export-bg:#020817;--gs-export-text:#64748b;--gs-toast-bg:#f1f5f9;--gs-toast-color:#0f172a;--gs-checker-a:#334155;--gs-checker-b:#1e293b;--gs-empty-color:#475569;--gs-topbtn-bg:rgba(255,255,255,0.06);--gs-topbtn-border:rgba(255,255,255,0.12);--gs-topbtn-color:#94a3b8;--gs-topbtn-hover-bg:rgba(255,255,255,0.12);--gs-counter-color:#475569}.studio-preview-zone{height:340px;border-radius:var(--gs-radius);box-shadow:var(--gs-shadow-soft),inset 0 0 0 1px rgb(0 0 0 / .06);overflow:hidden;position:relative;transition:var(--gs-transition)}.studio-preview-zone::before{content:'';position:absolute;inset:0;background-image:linear-gradient(45deg,var(--gs-checker-a) 25%,transparent 25%),linear-gradient(-45deg,var(--gs-checker-a) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--gs-checker-a) 75%),linear-gradient(-45deg,transparent 75%,var(--gs-checker-a) 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;background-color:var(--gs-checker-b);z-index:0}.gradient-layer{position:absolute;inset:0;z-index:1;transition:background-image 0.35s ease,opacity 0.3s ease;display:flex;align-items:center;justify-content:center}.glass-overlay{background:rgb(255 255 255 / .18);backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);border:1px solid rgb(255 255 255 / .35);padding:22px 30px;border-radius:14px;box-shadow:0 8px 32px rgb(0 0 0 / .12),inset 0 1px 0 rgb(255 255 255 / .4);position:relative;z-index:2;text-align:center;min-width:200px;color:#fff;transition:color 0.3s ease,background 0.3s ease,border-color 0.3s ease,text-shadow 0.3s ease,opacity 0.25s ease,transform 0.25s ease;text-shadow:0 1px 4px rgb(0 0 0 / .35)}.glass-overlay *{color:inherit;transition:color 0.3s ease}.glass-overlay.light-bg{background:rgb(0 0 0 / .22);border-color:rgb(0 0 0 / .18);color:#1e293b;text-shadow:0 1px 3px rgb(255 255 255 / .5);box-shadow:0 8px 32px rgb(0 0 0 / .1),inset 0 1px 0 rgb(255 255 255 / .3)}.glass-overlay.light-bg *{color:#1e293b}.glass-overlay.dark-mode:not(.light-bg){background:rgb(0 0 0 / .28);border-color:rgb(255 255 255 / .15);color:#fff;text-shadow:0 1px 4px rgb(0 0 0 / .4)}.glass-overlay.dark-mode:not(.light-bg) *{color:#fff!important}.glass-overlay.dark-mode.light-bg{background:rgb(0 0 0 / .4);border-color:rgb(255 255 255 / .2);color:#fff;text-shadow:0 1px 4px rgb(0 0 0 / .5)}.glass-overlay.dark-mode.light-bg *{color:#fff!important}.section-label{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gs-section-label);margin-bottom:8px;display:block;transition:color 0.2s}.control-card{background:var(--gs-bg-card);border:1px solid var(--gs-border-color);border-radius:var(--gs-radius-sm);padding:16px;box-shadow:var(--gs-shadow-card);transition:background 0.25s,border-color 0.25s,box-shadow 0.25s}.type-pills{display:flex;gap:6px}.type-pill{flex:1;padding:8px 6px;border-radius:var(--gs-radius-xs);border:1.5px solid var(--gs-border-pill);background:var(--gs-bg-input);cursor:pointer;font-size:12px;font-weight:600;text-align:center;color:var(--gs-text-secondary);transition:var(--gs-transition);display:flex;flex-direction:column;align-items:center;gap:4px}.type-pill:hover{border-color:var(--gs-accent);color:var(--gs-accent);background:var(--gs-accent-soft)}.type-pill.active{background:var(--gs-accent);border-color:var(--gs-accent);color:#fff;box-shadow:0 2px 10px rgb(99 102 241 / .35)}.type-pill svg{width:22px;height:22px}.angle-ring-wrap{display:flex;align-items:center;gap:10px}.angle-ring{width:40px;height:40px;border-radius:50%;border:2px solid var(--gs-ring-border);background:var(--gs-ring-bg);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;flex-shrink:0;user-select:none;transition:border-color 0.2s,box-shadow 0.2s,background 0.25s}.angle-ring:hover{border-color:var(--gs-accent);box-shadow:0 0 0 3px var(--gs-accent-soft)}.angle-ring{--ring-angle:45deg}.angle-ring::after{content:'';width:14px;height:2px;background:var(--gs-accent);border-radius:2px;position:absolute;transform-origin:left center;left:50%;top:50%;transform:translateY(-50%) rotate(var(--ring-angle));transition:transform 0.05s linear}.gs-range{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:2px;background:var(--gs-border-input);outline:none;cursor:pointer;transition:background 0.25s}.gs-range::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--gs-accent);border:2px solid var(--gs-bg-card);box-shadow:0 1px 4px rgb(0 0 0 / .25);cursor:pointer}.gs-range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--gs-accent);border:2px solid var(--gs-bg-card);box-shadow:0 1px 4px rgb(0 0 0 / .25);cursor:pointer}.color-bar{width:100%;height:6px;border-radius:3px;margin:8px 0 12px;transition:background 0.3s ease}.color-stop-row{background:var(--gs-bg-stop);border:1px solid var(--gs-border-stop);border-radius:var(--gs-radius-xs);padding:9px 12px;margin-bottom:7px;transition:var(--gs-transition);display:flex;align-items:center;justify-content:space-between;gap:10px}.color-stop-row:hover{border-color:var(--gs-border-stop-hover);background:var(--gs-bg-stop-hover)}.color-stop-left{display:flex;align-items:center;gap:10px;flex:1}.color-circle-input{width:30px;height:30px;border-radius:50%;border:2px solid var(--gs-bg-card);box-shadow:0 2px 6px rgb(0 0 0 / .15);cursor:pointer;padding:0;overflow:hidden;flex-shrink:0}.color-circle-input::-webkit-color-swatch-wrapper{padding:0}.color-circle-input::-webkit-color-swatch{border:none}.color-hex-input{font-size:12px;font-family:var(--gs-font-mono);border:1px solid var(--gs-border-input);border-radius:5px;padding:5px 8px;width:88px;background:var(--gs-bg-card);color:var(--gs-text-input);transition:border-color 0.2s,background 0.2s,color 0.2s}.color-hex-input:focus{outline:none;border-color:var(--gs-accent)}.color-pos-input{font-size:12px;border:1px solid var(--gs-border-input);border-radius:5px;padding:5px 6px;width:52px;background:var(--gs-bg-card);color:var(--gs-text-secondary);font-family:var(--gs-font-mono);transition:border-color 0.2s,background 0.2s}.color-pos-input:focus{outline:none;border-color:var(--gs-accent)}.stop-del-btn{width:26px;height:26px;border-radius:50%;border:none;background:#fff0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--gs-text-muted);transition:var(--gs-transition);flex-shrink:0}.stop-del-btn:hover{background:var(--gs-del-hover-bg);color:var(--gs-del-hover-color)}.stop-del-btn:disabled{opacity:.25;cursor:not-allowed}.stop-del-btn:disabled:hover{background:#fff0;color:var(--gs-text-muted)}.btn-add-stop{width:100%;border:1.5px dashed var(--gs-border-dashed);border-radius:var(--gs-radius-xs);background:#fff0;color:var(--gs-text-muted);font-size:12px;font-weight:600;padding:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;margin-top:4px;transition:var(--gs-transition)}.btn-add-stop:hover{border-color:var(--gs-accent);color:var(--gs-accent);background:var(--gs-accent-soft)}#animate-btn.is-animating{background:rgb(99 102 241 / .12);color:var(--gs-accent);border-color:var(--gs-accent)}.tag-btn[data-tag="bookmarks"].active{background:#f59e0b;border-color:#f59e0b;color:#fff}.tag-btn[data-tag="bookmarks"]:hover{border-color:#f59e0b;color:#f59e0b}.tag-btn[data-tag="linear"].active,.tag-btn[data-tag="radial"].active,.tag-btn[data-tag="conic"].active,.tag-btn[data-tag="mesh"].active{background:#0ea5e9;border-color:#0ea5e9;color:#fff}.tag-btn[data-tag="linear"]:hover,.tag-btn[data-tag="radial"]:hover,.tag-btn[data-tag="conic"]:hover,.tag-btn[data-tag="mesh"]:hover{border-color:#0ea5e9;color:#0ea5e9}.tag-btn[data-tag="bookmarks"].active:hover,.tag-btn[data-tag="linear"].active:hover,.tag-btn[data-tag="radial"].active:hover,.tag-btn[data-tag="conic"].active:hover,.tag-btn[data-tag="mesh"].active:hover{color:#fff}.glass-overlay.gs-hidden{opacity:0;transform:scale(.92);pointer-events:none}.preview-corner-btn{position:absolute;top:10px;right:10px;z-index:10;width:30px;height:30px;border-radius:50%;border:1px solid rgb(255 255 255 / .3);background:rgb(0 0 0 / .28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:rgb(255 255 255 / .85);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background 0.2s,border-color 0.2s,color 0.2s,transform 0.15s;padding:0}.preview-corner-btn:hover{background:rgb(0 0 0 / .5);border-color:rgb(255 255 255 / .55);color:#fff;transform:scale(1.1)}.preview-corner-btn--left{right:auto;left:10px}.preview-corner-btn.active-toggle{background:rgb(99 102 241 / .55);border-color:rgb(99 102 241 / .8);color:#fff}kbd{display:inline-block;padding:2px 7px;font-size:11px;font-family:var(--gs-font-mono,monospace);border:1px solid #cbd5e1;border-bottom-width:2px;border-radius:5px;background:#f8fafc;color:#334155;white-space:nowrap}.btn-random{background:linear-gradient(135deg,#6366f1,#a855f7);border:none;color:#fff;border-radius:var(--gs-radius-xs);font-size:12px;font-weight:600;padding:7px 14px;cursor:pointer;display:inline-flex;align-items:center;gap:5px;transition:opacity 0.2s,transform 0.15s}.btn-random:hover{opacity:.88;transform:translateY(-1px)}.btn-random:active{transform:scale(.97)}.export-block{background:var(--gs-export-bg);border-radius:var(--gs-radius-sm);padding:14px 16px;position:relative;margin-bottom:10px}.export-label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gs-export-text);margin-bottom:6px}.export-textarea{width:100%;background:#fff0;border:none;resize:none;font-family:var(--gs-font-mono);font-size:11.5px;color:#94a3b8;line-height:1.6;outline:none}.export-textarea::-webkit-scrollbar{width:4px}.export-textarea::-webkit-scrollbar-track{background:#fff0}.export-textarea::-webkit-scrollbar-thumb{background:#334155;border-radius:4px}.fmt-tabs{display:flex;gap:4px;margin-bottom:10px}.fmt-tab{padding:5px 12px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--gs-border-pill);background:var(--gs-bg-input);color:var(--gs-text-secondary);transition:var(--gs-transition)}.fmt-tab.active{background:var(--gs-fmt-active-bg);border-color:var(--gs-fmt-active-border);color:var(--gs-fmt-active-color)}.gallery-side{display:flex;flex-direction:column;height:100%}#preset-gallery{flex:1;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:flex-start;padding-right:4px;padding-bottom:8px;max-height:720px}#preset-gallery::-webkit-scrollbar{width:5px}#preset-gallery::-webkit-scrollbar-track{background:#fff0}#preset-gallery::-webkit-scrollbar-thumb{background:var(--gs-scrollbar-thumb);border-radius:10px}#preset-gallery::-webkit-scrollbar-thumb:hover{background:var(--gs-scrollbar-thumb-hover)}.preset-card{cursor:pointer;border-radius:var(--gs-radius-sm);overflow:hidden;border:1.5px solid var(--gs-preset-border);background:var(--gs-preset-bg);transition:transform 0.2s cubic-bezier(.4,0,.2,1),box-shadow 0.2s,border-color 0.2s,background 0.25s;box-shadow:var(--gs-shadow-card)}.preset-card:hover{transform:translateY(-2px);box-shadow:var(--gs-shadow-card-hover);border-color:rgb(99 102 241 / .3)}.preset-card.selected{border-color:var(--gs-accent);box-shadow:0 0 0 3px var(--gs-accent-soft),var(--gs-shadow-card)}.preset-swatch{height:90px;position:relative}.preset-type-badge{position:absolute;top:6px;right:6px;background:rgb(0 0 0 / .35);backdrop-filter:blur(8px);border-radius:4px;font-size:9px;font-weight:700;color:rgb(255 255 255 / .92);padding:2px 6px;letter-spacing:.06em;text-transform:uppercase}.preset-info{padding:8px 10px}.preset-name{font-size:12px;font-weight:600;color:var(--gs-text-preset-name);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px;transition:color 0.25s}.preset-meta{font-size:11px;color:var(--gs-text-muted)}.preset-colors-dots{display:flex;gap:3px;margin-top:5px}.preset-dot{width:10px;height:10px;border-radius:50%;border:1.5px solid rgb(255 255 255 / .6);box-shadow:0 1px 2px rgb(0 0 0 / .15)}.search-wrap{position:relative;margin-bottom:10px}.search-input{width:100%;padding:10px 14px 10px 38px;border:1.5px solid var(--gs-border-input);border-radius:var(--gs-radius-xs);font-size:13px;background:var(--gs-bg-search);color:var(--gs-text-primary);transition:border-color 0.2s,background 0.2s,color 0.2s;outline:none}.search-input:focus{border-color:var(--gs-accent);background:var(--gs-bg-search-focus)}.search-input::placeholder{color:var(--gs-text-muted)}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--gs-text-muted);pointer-events:none;transition:color 0.25s}.tag-filters{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px}.tag-btn{padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;border:1.5px solid var(--gs-border-tag);background:var(--gs-bg-tag);color:var(--gs-text-secondary);transition:var(--gs-transition)}.tag-btn:hover{border-color:var(--gs-accent);color:var(--gs-accent)}.tag-btn.active{background:var(--gs-tag-active-bg);border-color:var(--gs-tag-active-bg);color:var(--gs-tag-active-color)}.empty-state{grid-column:1/-1;text-align:center;padding:40px 20px;color:var(--gs-empty-color);font-size:13px}.empty-state svg{width:40px;height:40px;margin-bottom:10px;opacity:.35}#toast-msg{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--gs-toast-bg);color:var(--gs-toast-color);padding:10px 20px;border-radius:8px;font-size:13px;font-weight:500;z-index:9999;box-shadow:0 8px 24px rgb(0 0 0 / .25);transition:transform 0.3s cubic-bezier(.4,0,.2,1),opacity 0.3s;opacity:0;pointer-events:none;white-space:nowrap}#toast-msg.show{transform:translateX(-50%) translateY(0);opacity:1}.gs-theme-btn,.gs-lang-btn{background:var(--gs-topbtn-bg);border:1px solid var(--gs-topbtn-border);border-radius:20px;padding:3px 10px;font-size:12px;font-weight:700;color:var(--gs-topbtn-color);cursor:pointer;transition:var(--gs-transition);display:inline-flex;align-items:center;gap:4px}.gs-theme-btn:hover,.gs-lang-btn:hover{background:var(--gs-topbtn-hover-bg)}#preset-count{color:var(--gs-counter-color)}[data-gs-theme="dark"] .uk-select,[data-gs-theme="dark"] .uk-input,[data-gs-theme="dark"] .uk-textarea{background:var(--gs-bg-input)!important;color:var(--gs-text-primary)!important;border-color:var(--gs-border-input)!important}.copy-btn-float{position:absolute;top:10px;right:10px;background:rgb(255 255 255 / .08);border:1px solid rgb(255 255 255 / .12);border-radius:6px;color:#94a3b8;font-size:12px;padding:4px 8px;cursor:pointer;transition:var(--gs-transition);display:flex;align-items:center;gap:4px}.copy-btn-float:hover{background:rgb(255 255 255 / .15);color:#e2e8f0}.copy-btn-float.copied{background:rgb(16 185 129 / .15);border-color:rgb(16 185 129 / .3);color:#10b981}.uk-select,.uk-input{border-radius:var(--gs-radius-xs)!important;border:1.5px solid var(--gs-border-input)!important;font-size:13px!important;background:var(--gs-bg-input)!important;color:var(--gs-text-primary)!important;transition:background 0.25s,border-color 0.2s,color 0.2s!important}.uk-select:focus,.uk-input:focus{border-color:var(--gs-accent)!important;outline:none!important;box-shadow:0 0 0 3px var(--gs-accent-soft)!important}.uk-button-primary{background:var(--gs-accent)!important;border-color:var(--gs-accent)!important}.uk-button-primary:hover{background:var(--gs-accent-hover)!important}@media (max-width:768px){.studio-preview-zone{height:240px}#preset-gallery{max-height:340px}}#preview-title{transition:font-size 0.3s cubic-bezier(.4,0,.2,1),color 0.3s ease,background-image 0.3s ease;background-size:100% 100%}#preview-title.gs-text-gradient-active .uk-button-primary{color:#fff}#lang-btn,#expand-btn{background:#f8fafc;border:1px solid #e2e8f0;border-radius:20px;padding:3px 12px;font-size:11px;font-weight:700;color:#64748b;cursor:pointer;transition:all 0.2s}#lang-btn:hover,#expand-btn:hover{background:#e2e8f0}main.uk-section .uk-container{transition:max-width 0.35s cubic-bezier(.4,0,.2,1),padding 0.25s ease,transform 0.25s ease}main.uk-section .uk-container:not(.uk-container-small){animation:studioExpandFade 0.25s ease}@keyframes studioExpandFade{from{opacity:.96;transform:scale(.995)}to{opacity:1;transform:scale(1)}}