:root{--background: #e2e2e2;--foreground: #02061770;--card-background: #e2e2e225;--card-foreground: var(--foreground);--card-border: #e2e8f050;--popover-background: #e2e2e2;--popover-foreground: var(--foreground);--secondary: #f1f5f925;--secondary-foreground: #0f172a70;--secondary-hover: #e2e8f0;--secondary-active-background: rgba(226, 232, 240, .8);--muted-background: #e2e2e225;--muted-foreground: #64748b;--accent: #08b287;--accent-foreground: #e2e2e2;--accent-hover: #06d48f;--accent-active-background: rgba(6, 182, 212, .1);--color-accent-rgb: 8, 178, 135;--destructive: #dc2626;--destructive-foreground: #e2e2e2;--destructive-background: #fee2e2;--border: #cbd5e1;--border-muted: #e2e8f0;--input-background: #e2e2e225;--input-border: #cbd5e1;--ring: var(--accent);--selection: #a78bfa;--success: #16a34a;--warning: #facc15;--scrollbar-thumb: #cbd5e1;--grid-dashed-border-color: rgba(2, 6, 23, .03);--grid-solid-border-color: rgba(2, 6, 23, .05);--font-title: "Roboto Condensed", sans-serif}html.dark{--background: #131313;--foreground: #eeeeee;--card-background: rgba(56, 56, 56, .1);--card-foreground: var(--foreground);--card-border: #50505025;--popover-background: #252525;--popover-foreground: var(--foreground);--secondary: #53535325;--secondary-foreground: var(--foreground);--secondary-hover: #69696925;--secondary-active-background: rgba(103, 104, 104, .5);--muted-background: rgba(85, 85, 85, .25);--muted-foreground: #b8b8b8;--accent: #22ee66;--accent-foreground: #242424;--accent-hover: #67f99f;--accent-active-background: rgba(235, 236, 236, .2);--color-accent-rgb: 34, 238, 102;--destructive: #ef4444;--destructive-foreground: #ffffff;--destructive-background: rgba(153, 27, 27, .5);--border: #64646425;--border-muted: rgba(124, 124, 124, .3);--input-background: rgba(82, 82, 82, .25);--input-border: #68686825;--ring: var(--accent);--selection: #a78bfa;--success: #22c55e;--warning: #facc15;--scrollbar-thumb: var(--border-muted);--grid-dashed-border-color: rgba(238, 238, 238, .03);--grid-solid-border-color: rgba(238, 238, 238, .06)}html{background-color:var(--background)}body{color:var(--foreground);font-family:Roboto Condensed,sans-serif;font-weight:300;scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) transparent}h1,h2{font-family:var(--font-title)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:var(--scrollbar-thumb);border-radius:10px;border:3px solid transparent;background-clip:content-box}.input-field{background-color:var(--input-background);border:1px solid var(--input-border);border-radius:.375rem;padding:.25rem .5rem;color:var(--foreground);transition:border-color .2s,box-shadow .2s}.input-field:focus{border-color:var(--ring);box-shadow:0 0 0 2px var(--ring);outline:none}.app-container{min-height:100vh}.app-header .title-accent{color:var(--accent);transition:color .3s ease,text-shadow .3s ease,filter .3s ease;-webkit-user-select:none;user-select:none}.app-header p{color:var(--muted-foreground)}.card{background-color:var(--card-background);border:1px solid var(--card-border);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border-radius:.75rem;box-shadow:0 12px 16px -20px,inset 0 0 8px #ffffff59,inset 0 12px 16px -20px,inset 0 1px #ffffff87}html.dark .card{background-color:var(--card-background);border:1px solid var(--card-border) + "50";-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-radius:.75rem;box-shadow:0 12px 16px -20px #000,inset 12px 18px 40px -15px #0000002e,inset -16px -14px 8px -20px #ffffff26,inset 0 1px #ffffff1f}.card-header{border-bottom:1px solid var(--card-border)}.card-header h2{color:var(--card-foreground)}.drawing-canvas-wrapper{background-color:transparent}.toolbar-group{background-color:var(--background)+"25";box-shadow:0 12px 16px -20px,inset 0 0 8px #ffffff59,inset 0 12px 16px -20px,inset 0 1px #ffffff87;border-radius:.375rem}html.dark .toolbar-group{box-shadow:0 12px 16px -20px #000,inset 12px 18px 40px -15px #0000002e,inset -14px -15px 16px -20px #ffffff14,inset 0 1px #ffffff1c}.tool-button{color:var(--muted-foreground);transition:color .2s,background-color .2s,filter .3s ease}.tool-button:hover:not([disabled]){background-color:var(--secondary-hover);color:var(--secondary-foreground)}.tool-button[data-active=true]{background-color:var(--accent-active-background);color:var(--accent)}.tool-button:disabled{color:var(--muted-foreground);opacity:.5;cursor:not-allowed}.color-picker-button{transition:transform .2s ease,box-shadow .2s ease,filter .3s ease}.color-picker-button:hover{transform:scale(1.1)}.color-picker-button[data-active=true]{box-shadow:0 0 0 2px var(--background),0 0 0 4px var(--accent)}.text-muted-foreground{color:var(--muted-foreground)}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:.375rem;font-weight:600;transition:background-color .2s,color .2s,border-color .2s,opacity .2s,filter .3s ease}.btn-primary{background-color:var(--accent);color:var(--accent-foreground)}html.dark .btn-primary{box-shadow:0 4px 14px #22d3ee33}.btn-primary:hover{background-color:var(--accent-hover)}.btn-primary:disabled{background-color:var(--muted-background);color:var(--muted-foreground);cursor:not-allowed}.btn-secondary{background-color:var(--secondary);color:var(--muted-foreground);border:1px solid var(--border)}.btn-secondary:hover{background-color:var(--secondary-hover);color:var(--secondary-foreground)}.btn:disabled{opacity:.6;cursor:not-allowed}.alert-destructive{background-color:var(--destructive-background);color:var(--destructive);padding:.75rem;border-radius:.375rem;font-size:.75rem}.loading-spinner{border-bottom-color:var(--accent)}.preview-tab-item{color:var(--card-foreground);transition:color .2s ease,filter .3s ease}.preview-tab-item h2{color:inherit}.preview-tab-item:hover,.preview-tab-item[data-active=true]{color:var(--accent)}.preview-toolbar{border:1px solid #ffffff75}html.dark .preview-toolbar{border-color:#6464641a}.layer-item{background-color:var(--muted-background);border:1px solid var(--border);transition:color .2s,background-color .2s,border-color .2s,filter .3s ease}.layer-item:hover{background-color:var(--secondary);border-color:var(--secondary-hover)}.layer-item[data-selected=true]{background-color:var(--accent-active-background);border-color:var(--accent)}.layer-item[data-visible=false]{opacity:.5}.layer-item-input{background-color:var(--popover-background);color:var(--popover-foreground);border:1px solid var(--accent);border-radius:.25rem}.tile-button{background-color:transparent;border:2px solid var(--border);transition:border-color .2s ease-in-out,filter .3s ease}.tile-button[data-active=true]{border-color:var(--accent)}.tile-button:not([data-active=true]):hover{border-color:var(--border-muted)}.tile-button-remove{background-color:var(--destructive);color:var(--destructive-foreground)}.tile-include-button{position:absolute;top:.25rem;left:.25rem;z-index:10;display:flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:.375rem;border:1px solid var(--border);background-color:#0003;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:all .2s;cursor:pointer}.tile-include-button svg{width:12px;height:12px;stroke:var(--accent-foreground);opacity:0;transform:scale(.5);transition:all .2s}.tile-include-button[data-included=true]{background-color:var(--success);border-color:var(--success)}.tile-include-button[data-included=true] svg{opacity:1;transform:scale(1)}.tile-include-button:hover:not(:disabled){border-color:var(--accent)}.tile-include-button:disabled{cursor:not-allowed;opacity:.7}html.dark .tile-button-remove:hover{background-color:#be123c}html.light .tile-button-remove:hover{background-color:#b91c1c}.segmented-control-button{color:var(--muted-foreground);transition:color .2s,background-color .2s,box-shadow .2s}.segmented-control-button:hover:not([data-active=true]){background-color:var(--secondary-hover);color:var(--secondary-foreground)}.segmented-control-button[data-active=true]{background-color:var(--card-background);color:var(--foreground);box-shadow:0 1px 2px #0000000d}html.light .segmented-control-button[data-active=true]{box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.border-grid-dashed{border-color:var(--grid-dashed-border-color)}.border-grid-solid{border-color:var(--grid-solid-border-color)}html.dark.glow-enabled .app-header .title-accent,html.synthwave.glow-enabled .app-header .title-accent{text-shadow:0 0 8px rgba(var(--color-accent-rgb),.6),0 0 20px rgba(var(--color-accent-rgb),.3),-1px 9px 8px rgb(0 0 0),1px -9px 8px rgb(0 0 0)}html.dark.glow-enabled .app-header svg.title-accent,html.synthwave.glow-enabled .app-header svg.title-accent{filter:drop-shadow(0 0 8px rgba(var(--color-accent-rgb),.6))}html.dark.glow-enabled .tool-button[data-active=true],html.synthwave.glow-enabled .tool-button[data-active=true],html.dark.glow-enabled .preview-tab-item[data-active=true],html.synthwave.glow-enabled .preview-tab-item[data-active=true],html.dark.glow-enabled .btn-primary:not(:disabled),html.synthwave.glow-enabled .btn-primary:not(:disabled),html.dark.glow-enabled .tile-button[data-active=true],html.synthwave.glow-enabled .tile-button[data-active=true],html.dark.glow-enabled .layer-item[data-selected=true],html.synthwave.glow-enabled .layer-item[data-selected=true],html.dark.glow-enabled .color-picker-button[data-active=true],html.synthwave.glow-enabled .color-picker-button[data-active=true]{filter:drop-shadow(0 0 6px rgba(var(--color-accent-rgb),.5))}html.dark.glow-enabled .input-field:focus,html.synthwave.glow-enabled .input-field:focus{box-shadow:0 0 0 2px var(--ring),0 0 10px rgba(var(--color-accent-rgb),.6)}.switch{position:relative;display:inline-block;width:44px;height:24px}.switch input{opacity:0;width:0;height:0}.switch .switch-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;border:1px solid var(--border);-webkit-transition:.2s;transition:.2s;border-radius:24px}.switch .switch-slider:before{position:absolute;content:"";height:18px;width:18px;left:2px;bottom:2px;background-color:var(--muted-foreground);-webkit-transition:.2s;transition:.2s;border-radius:50%}.switch input:checked+.switch-slider{background-color:var(--accent);border-color:var(--accent)}html.dark.glow-enabled .switch input:checked+.switch-slider,html.synthwave.glow-enabled .switch input:checked+.switch-slider{filter:drop-shadow(0 0 4px rgba(var(--color-accent-rgb),.6))}.switch input:focus-visible+.switch-slider{outline:2px solid var(--ring);outline-offset:2px}.switch input:checked+.switch-slider:before{background-color:var(--accent-foreground);-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translate(20px)}.slider-container{position:relative;display:flex;align-items:center;height:28px}.slider-track-wrapper{position:absolute;top:11px;left:0;right:0;height:3px;pointer-events:none}.slider-track-bg{position:absolute;height:100%;width:100%;background-color:var(--border);border-radius:3px}.slider-track-progress{position:absolute;height:100%;background-color:var(--accent);border-radius:3px;transition:filter .2s ease}html.dark.glow-enabled .slider-track-progress,html.synthwave.glow-enabled .slider-track-progress{filter:drop-shadow(0 0 5px rgba(var(--color-accent-rgb),.5))}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;background:transparent;cursor:pointer;position:relative;z-index:2;margin:0;padding:0}.slider:focus{outline:none}.slider::-webkit-slider-runnable-track{width:100%;height:6px;background:transparent}.slider::-moz-range-track{width:100%;height:6px;background:transparent}.slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:28px;width:32px;background:transparent;border:none;margin-top:-11px}.slider::-moz-range-thumb{height:28px;width:32px;background:transparent;border:none}.slider-thumb-value{position:absolute;top:0;z-index:1;width:32px;height:28px;background-color:var(--background);color:var(--accent);border:2px solid var(--accent);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;pointer-events:none;transition:transform .2s ease,filter .2s ease;box-sizing:border-box}html.dark.glow-enabled .slider-thumb-value,html.synthwave.glow-enabled .slider-thumb-value{filter:drop-shadow(0 0 5px rgba(var(--color-accent-rgb),.5))}.slider:hover+.slider-thumb-value,.slider:focus+.slider-thumb-value,.slider-thumb-value[data-dragging=true]{transform:scale(1.05)}html.dark.glow-enabled .slider:hover+.slider-thumb-value,html.dark.glow-enabled .slider:focus+.slider-thumb-value,html.dark.glow-enabled .slider-thumb-value[data-focused=true],html.dark.glow-enabled .slider-thumb-value[data-dragging=true],html.synthwave.glow-enabled .slider:hover+.slider-thumb-value,html.synthwave.glow-enabled .slider:focus+.slider-thumb-value,html.synthwave.glow-enabled .slider-thumb-value[data-focused=true],html.synthwave.glow-enabled .slider-thumb-value[data-dragging=true]{filter:drop-shadow(0 0 8px rgba(var(--color-accent-rgb),.7))}html.dark.glow-enabled .slider:hover~.slider-track-wrapper .slider-track-progress,html.dark.glow-enabled .slider:focus~.slider-track-wrapper .slider-track-progress,html.synthwave.glow-enabled .slider:hover~.slider-track-wrapper .slider-track-progress,html.synthwave.glow-enabled .slider:focus~.slider-track-wrapper .slider-track-progress{filter:drop-shadow(0 0 8px rgba(var(--color-accent-rgb),.7))}html.neo-brutal{--background: #fdf5d3;--foreground: #1e1e1e;--card-background: var(--background);--card-foreground: var(--foreground);--card-border: var(--foreground);--popover-background: var(--background);--popover-foreground: var(--foreground);--secondary: #fef08a;--secondary-foreground: var(--foreground);--secondary-hover: #fde047;--secondary-active-background: #facc15;--muted-background: #f3edd8;--muted-foreground: #57534e;--accent: #3b82f6;--accent-foreground: #ffffff;--accent-hover: #2563eb;--accent-active-background: rgba(59, 130, 246, .15);--color-accent-rgb: 59, 130, 246;--destructive: #ef4444;--destructive-foreground: #ffffff;--destructive-background: #fecaca;--border: var(--foreground);--border-muted: #a8a29e;--input-background: var(--background);--input-border: var(--foreground);--ring: var(--accent);--selection: #fef08a;--success: #22c55e;--warning: #facc15;--scrollbar-thumb: #a8a29e;--grid-dashed-border-color: rgba(30, 30, 30, .1);--grid-solid-border-color: rgba(30, 30, 30, .15);--font-title: "Syne", sans-serif}html.neo-brutal body{font-weight:400}html.neo-brutal .app-header h1{font-weight:700}html.neo-brutal .card,html.neo-brutal .toolbar-group{border-radius:0;border:2px solid var(--foreground);box-shadow:8px 8px 0 var(--foreground)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}html.neo-brutal .card-header{border-bottom:2px solid var(--foreground)}html.neo-brutal .btn{border-radius:0;border:2px solid var(--foreground);box-shadow:4px 4px 0 var(--foreground);transition:transform .1s ease,box-shadow .1s ease}html.neo-brutal .btn:active{transform:translate(4px,4px);box-shadow:none}html.neo-brutal .btn:disabled{box-shadow:none;transform:none}html.neo-brutal .btn-primary{background-color:var(--accent);color:var(--accent-foreground)}html.neo-brutal .btn-primary:hover{background-color:var(--accent-hover)}html.neo-brutal .btn-secondary{background-color:transparent;color:var(--foreground)}html.neo-brutal .btn-secondary:hover{background-color:var(--secondary)}html.neo-brutal .input-field{border-radius:0;border-width:2px}html.neo-brutal .input-field:focus{box-shadow:4px 4px 0 var(--ring)}html.neo-brutal .tool-button{border:0;border-radius:0}html.neo-brutal .tool-button:hover:not([disabled]){background-color:var(--secondary)}html.neo-brutal .tool-button[data-active=true]{background-color:var(--accent);color:var(--accent-foreground);box-shadow:inset 3px 3px #00000040}html.neo-brutal .tool-button[data-active=true]:active{box-shadow:inset 3px 3px #00000040;transform:none}html.neo-brutal .color-picker-button[data-active=true]{box-shadow:0 0 0 2px var(--background),0 0 0 4px var(--foreground)}html.neo-brutal .segmented-control-button{border-radius:0;border:2px solid transparent}html.neo-brutal .segmented-control-button[data-active=true]{background-color:var(--accent);color:var(--accent-foreground);border-color:var(--foreground);box-shadow:none}html.neo-brutal .layer-item{border-radius:0;border-width:2px}html.neo-brutal .layer-item[data-selected=true]{border-color:var(--accent);box-shadow:4px 4px 0 var(--accent)}html.neo-brutal .tile-button{border-radius:0;border-width:2px}html.neo-brutal .tile-button[data-active=true]{box-shadow:0 0 0 3px var(--accent) inset}html.neo-brutal .switch .switch-slider{border-radius:0;border-width:2px;background-color:var(--background)}html.neo-brutal .switch .switch-slider:before{border-radius:0;background-color:var(--foreground);height:14px;width:14px;left:3px;bottom:3px}html.neo-brutal .switch input:checked+.switch-slider{background-color:var(--accent);border-color:var(--foreground)}html.neo-brutal .switch input:checked+.switch-slider:before{transform:translate(18px);background-color:var(--accent-foreground)}html.neo-brutal .slider-thumb-value{border-radius:0;border-width:2px;box-shadow:2px 2px 0 var(--foreground)}html.neo-brutal .slider:active~.slider-thumb-value,html.neo-brutal .slider-thumb-value[data-dragging=true]{transform:translate(2px,2px);box-shadow:none}html.synthwave{--background: #1a103c;--foreground: #f0e6ff;--card-background: rgba(26, 16, 60, .5);--card-foreground: var(--foreground);--card-border: rgba(0, 255, 255, .3);--popover-background: #2c1a62;--popover-foreground: var(--foreground);--secondary: rgba(255, 0, 255, .12);--secondary-foreground: #f0e6ff;--secondary-hover: rgba(255, 0, 255, .25);--secondary-active-background: rgba(255, 0, 255, .3);--muted-background: rgba(26, 16, 60, .8);--muted-foreground: #a78bfa;--accent: #ff00ff;--accent-foreground: #ffffff;--accent-hover: #ff33ff;--color-accent-rgb: 255, 0, 255;--destructive: #f472b6;--destructive-foreground: #1a103c;--destructive-background: rgba(244, 114, 182, .2);--border: rgba(0, 255, 255, .3);--border-muted: rgba(0, 255, 255, .2);--input-background: rgba(0, 0, 0, .2);--input-border: rgba(0, 255, 255, .3);--ring: var(--accent);--selection: rgba(167, 139, 250, .5);--success: #00ffff;--warning: #facc15;--scrollbar-thumb: var(--accent);--grid-dashed-border-color: rgba(0, 255, 255, .1);--grid-solid-border-color: rgba(0, 255, 255, .2);--font-title: "Audiowide", cursive}html.synthwave .card,html.synthwave .toolbar-group{border-color:var(--card-border);box-shadow:0 0 15px rgba(var(--color-accent-rgb),.3),0 0 5px #0ff6,inset 0 0 3px #00ffff4d;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}html.synthwave .card-header{border-bottom-color:var(--card-border)}html.synthwave .btn-primary{text-shadow:0 0 5px #fff;box-shadow:0 0 8px var(--accent),inset 0 0 5px var(--accent)}html.synthwave .btn-secondary{background-color:transparent;border-color:var(--border);color:var(--border);text-shadow:0 0 5px var(--border)}html.synthwave .btn-secondary:hover{background-color:var(--secondary-hover);border-color:var(--accent);color:var(--accent);text-shadow:0 0 5px var(--accent)}html.synthwave .tool-button[data-active=true]{background-color:var(--accent-active-background);color:var(--accent)}html.synthwave .segmented-control-button[data-active=true]{box-shadow:0 0 8px #00ffff80}html.synthwave .layer-item[data-selected=true],html.synthwave .tile-button[data-active=true]{border-color:var(--accent)}@keyframes noise{0%,to{background-position:0 0}10%{background-position:-5% -10%}20%{background-position:-15% 5%}30%{background-position:7% -25%}40%{background-position:20% 25%}50%{background-position:-25% 10%}60%{background-position:15% 5%}70%{background-position:0 15%}80%{background-position:25% 35%}90%{background-position:-10% 10%}}html.synthwave:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;pointer-events:none;background-image:repeating-linear-gradient(to bottom,rgba(0,0,0,.2) 0px,rgba(0,0,0,.2) 1px,transparent 1px,transparent 3px),url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.6' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");background-size:auto,200px;opacity:.08;animation:noise .2s linear infinite}