.theme-switcher{position:relative;z-index:200}.theme-switcher-trigger{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--color-surface, #ffffff);border:1px solid var(--color-border, #e0e0e0);border-radius:8px;cursor:pointer;font-size:.875rem;color:var(--color-text, #000000);transition:all .2s}.theme-switcher-trigger:hover{background:var(--color-border, #f0f0f0)}.theme-switcher-trigger:focus-visible{outline:2px solid var(--color-primary, #000000);outline-offset:2px}.theme-icon{font-size:1.25rem}.theme-name{font-weight:500}.theme-chevron{transition:transform .2s}.theme-chevron.open{transform:rotate(180deg)}.theme-overlay{position:fixed;inset:0;background:#0000004d;z-index:199;animation:fadeIn .2s}.theme-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:320px;max-height:500px;background:var(--color-surface, #ffffff);border:1px solid var(--color-border, #e0e0e0);border-radius:12px;box-shadow:0 10px 40px #0000001a;z-index:200;overflow:hidden;animation:slideDown .2s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.theme-dropdown-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--color-border, #e0e0e0)}.theme-dropdown-header h3{margin:0;font-size:1rem;font-weight:600;color:var(--color-text, #000000)}.theme-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:4px;cursor:pointer;font-size:1.5rem;color:var(--color-text-secondary, #666666);transition:background .2s}.theme-close:hover{background:var(--color-border, #f0f0f0)}.theme-list{max-height:400px;overflow-y:auto;padding:8px}.theme-option{width:100%;display:flex;align-items:center;gap:12px;padding:12px;background:transparent;border:none;border-radius:8px;cursor:pointer;text-align:left;transition:background .2s}.theme-option:hover{background:var(--color-border, #f0f0f0)}.theme-option.active{background:var(--color-primary, #000000);color:var(--color-surface, #ffffff)}.theme-option-icon{font-size:1.5rem;width:32px;text-align:center}.theme-option-info{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}.theme-option-name{font-weight:500;font-size:.875rem}.theme-option-description{font-size:.75rem;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.theme-check{flex-shrink:0}@media (max-width: 768px){.theme-dropdown{position:fixed;inset:auto 0 0;width:100%;max-height:70vh;border-radius:16px 16px 0 0;animation:slideUp .3s}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}}[data-theme-type=glassmorphism] .theme-dropdown{background:#ffffff1a;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2)}[data-theme-type=neumorphism] .theme-dropdown{box-shadow:var(--neu-shadow-lg, 9px 9px 16px #a3b1c6, -9px -9px 16px #ffffff)}[data-theme-type=brutalist] .theme-dropdown{border:4px solid var(--color-primary, #000000);border-radius:0;box-shadow:8px 8px 0 var(--color-primary, #000000)}.app-container{width:100%;height:100%}.setup-container{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--color-background);padding:2rem}.setup-panel{max-width:500px;width:100%}.app-header-content{display:flex;align-items:center;justify-content:space-between;padding:var(--space-3, 16px);background:var(--color-surface);border-radius:8px;border:1px solid var(--color-border)}.app-title{font-size:var(--text-2xl, 1.5rem);font-weight:700;color:var(--color-primary);margin:0;letter-spacing:.1em}.app-subtitle{font-size:var(--text-sm, .875rem);color:var(--color-text-secondary);margin:.5rem 0 0}.api-form{display:flex;flex-direction:column;gap:var(--space-3, 16px)}.form-label{font-size:var(--text-sm, .875rem);font-weight:500;color:var(--color-text);margin-bottom:.5rem}.form-input{width:100%;padding:var(--space-2, 8px) var(--space-3, 12px);background:var(--color-background);border:1px solid var(--color-border);border-radius:6px;font-size:var(--text-base, 1rem);color:var(--color-text);transition:all .2s}.form-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(var(--color-primary-rgb),.1)}.form-input::placeholder{color:var(--color-text-secondary);opacity:.6}.btn{padding:var(--space-2, 8px) var(--space-4, 16px);border-radius:6px;font-size:var(--text-base, 1rem);font-weight:500;cursor:pointer;transition:all .2s;border:none;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2, 8px)}.btn-primary{background:var(--color-primary);color:var(--color-surface)}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-border)}.setup-info{margin-top:var(--space-4, 24px);padding-top:var(--space-4, 24px);border-top:1px solid var(--color-border);text-align:center}.setup-info p{font-size:var(--text-sm, .875rem);color:var(--color-text-secondary)}.setup-info a{color:var(--color-primary);text-decoration:none;font-weight:500}.setup-info a:hover{text-decoration:underline}.canvas-container{display:flex;align-items:center;justify-content:center;padding:var(--space-3, 16px);min-height:400px}.canvas-controls{margin-top:var(--space-2, 8px);display:flex;gap:var(--space-2, 8px);justify-content:center;flex-wrap:wrap}[data-theme-type=glassmorphism] .canvas-wrapper{background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:var(--space-3, 16px)}[data-theme-type=neumorphism] .canvas-wrapper{background:var(--color-background);box-shadow:var(--neu-shadow-inset, inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff);border-radius:20px;padding:var(--space-4, 24px)}[data-theme-type=brutalist] .canvas-wrapper{border:4px solid var(--color-primary);background:var(--color-surface);transform:rotate(-1deg)}[data-theme-type=material] .canvas-wrapper{box-shadow:var(--elevation-md, 0px 2px 6px 2px rgba(0, 0, 0, .15));border-radius:12px;overflow:hidden}.prompt-container{display:flex;flex-direction:column;gap:var(--space-3, 16px)}.prompt-input-wrapper{position:relative}.prompt-input{width:100%;padding:var(--space-2, 8px) var(--space-3, 12px);padding-right:60px;background:var(--color-background);border:1px solid var(--color-border);border-radius:6px;font-size:var(--text-base, 1rem);color:var(--color-text)}.char-count{position:absolute;right:var(--space-2, 8px);top:50%;transform:translateY(-50%);font-size:var(--text-xs, .75rem);color:var(--color-text-secondary)}.prompt-suggestions{display:flex;flex-wrap:wrap;gap:var(--space-2, 8px)}.suggestion-chip{padding:var(--space-1, 4px) var(--space-2, 8px);background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px;font-size:var(--text-sm, .875rem);color:var(--color-text);cursor:pointer;transition:all .2s}.suggestion-chip:hover{background:var(--color-primary);color:var(--color-surface);border-color:var(--color-primary)}.generate-button{width:100%;padding:var(--space-3, 12px);background:var(--color-primary);color:var(--color-surface);border:none;border-radius:8px;font-size:var(--text-base, 1rem);font-weight:600;cursor:pointer;transition:all .2s}.generate-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.generate-button:disabled{opacity:.5;cursor:not-allowed}.icon-preview-container{margin-top:var(--space-3, 16px)}.preview-frame{width:100%;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--color-background);border:1px solid var(--color-border);border-radius:8px;padding:var(--space-3, 16px);position:relative}.loading-state,.error-state,.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2, 8px);text-align:center}.loading-spinner{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-text,.empty-text{font-size:var(--text-sm, .875rem);color:var(--color-text-secondary);font-style:italic}.error-message{color:var(--color-error);font-size:var(--text-sm, .875rem)}.generated-icon{width:100%;height:auto;object-fit:contain;border-radius:8px}.preview-actions{display:flex;gap:var(--space-2, 8px);margin-top:var(--space-3, 16px)}.gallery-container{height:100%;display:flex;flex-direction:column}.gallery-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-3, 16px)}.gallery-title{font-size:var(--text-lg, 1.125rem);font-weight:600;color:var(--color-text);margin:0}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--space-2, 8px)}.gallery-item{position:relative;aspect-ratio:1;border:1px solid var(--color-border);border-radius:8px;overflow:hidden;cursor:pointer;transition:all .2s}.gallery-item:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.gallery-image-wrapper{width:100%;height:100%;position:relative}.gallery-image{width:100%;height:100%;object-fit:cover}.gallery-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);color:#fff;padding:var(--space-2, 8px);transform:translateY(100%);transition:transform .2s}.gallery-item:hover .gallery-overlay{transform:translateY(0)}.gallery-prompt{font-size:var(--text-xs, .75rem);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.delete-button{position:absolute;top:4px;right:4px;width:24px;height:24px;background:var(--color-error);color:#fff;border:none;border-radius:50%;font-size:1rem;line-height:1;cursor:pointer;display:none;align-items:center;justify-content:center;transition:all .2s}.gallery-item:hover .delete-button{display:flex}.delete-button:hover{transform:scale(1.1)}@media (max-width: 768px){.app-header-content{flex-direction:column;gap:var(--space-2, 8px);text-align:center}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}}[data-theme-type=glassmorphism] .btn-primary{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}[data-theme-type=neumorphism] .btn{box-shadow:var(--neu-shadow-sm, 3px 3px 6px #a3b1c6, -3px -3px 6px #ffffff)}[data-theme-type=neumorphism] .btn:active{box-shadow:var(--neu-shadow-inset, inset 3px 3px 6px #a3b1c6, inset -3px -3px 6px #ffffff)}[data-theme-type=brutalist] .btn{border:3px solid var(--color-primary);transform:rotate(-1deg)}[data-theme-type=brutalist] .btn:hover{transform:rotate(1deg)}:root{--charcoal-black: #0a0a0a;--charcoal-dark: #1a1a1a;--charcoal-medium: #2d2d2d;--charcoal-light: #4a4a4a;--charcoal-lighter: #6a6a6a;--paper-white: #fafafa;--paper-cream: #f5f5f0;--stroke-thin: 1px;--stroke-medium: 2px;--stroke-thick: 4px;--font-mono: "Courier New", monospace}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-mono);background:var(--paper-cream);color:var(--charcoal-black);overflow-x:hidden;position:relative}body:before{content:"";position:fixed;inset:0;background-image:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(26,26,26,.03) 2px,rgba(26,26,26,.03) 4px),repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(26,26,26,.03) 2px,rgba(26,26,26,.03) 4px);pointer-events:none;z-index:1}#root{position:relative;z-index:2;min-height:100vh}.charcoal-border{border:var(--stroke-medium) solid var(--charcoal-black);position:relative;background:var(--paper-white)}.charcoal-border:before,.charcoal-border:after{content:"";position:absolute;background:var(--charcoal-black)}.charcoal-border:before{top:-2px;left:-2px;right:-2px;height:2px;filter:url(#roughPaper)}.charcoal-border:after{bottom:-2px;left:-2px;right:-2px;height:2px;filter:url(#roughPaper)}.charcoal-text{font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;font-weight:500}.charcoal-button{background:var(--paper-white);border:var(--stroke-medium) solid var(--charcoal-black);padding:8px 16px;font-family:var(--font-mono);font-size:14px;text-transform:uppercase;letter-spacing:.1em;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.charcoal-button:hover{background:var(--charcoal-black);color:var(--paper-white)}.charcoal-button:active{transform:translate(2px,2px)}.charcoal-input{background:var(--paper-white);border:none;border-bottom:var(--stroke-medium) solid var(--charcoal-black);padding:8px 4px;font-family:var(--font-mono);font-size:14px;outline:none;transition:border-bottom .2s ease}.charcoal-input:focus{border-bottom:var(--stroke-thick) solid var(--charcoal-black)}.sketch-line{stroke:var(--charcoal-black);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}.canvas-container{background:var(--paper-white);border:var(--stroke-medium) solid var(--charcoal-black);box-shadow:3px 3px #1a1a1a1a,6px 6px #1a1a1a0d;position:relative}.canvas-container canvas{display:block;cursor:crosshair}@keyframes charcoalFade{0%{opacity:0;filter:blur(4px)}to{opacity:1;filter:blur(0)}}.fade-in{animation:charcoalFade .5s ease-out}@keyframes sketchDraw{to{stroke-dashoffset:0}}.sketch-draw{stroke-dasharray:1000;stroke-dashoffset:1000;animation:sketchDraw 2s ease-out forwards}