html,body{height:100%}*{box-sizing:border-box}:root{--font-family:"Inter", sans-serif;--bg-dark:#0f172a;--bg-darker:#020617;--accent-blue:#3b82f6;--accent-blue-hover:#2563eb;--accent-green:#10b981;--accent-green-hover:#059669;--accent-red:#ef4444;--accent-red-hover:#dc2626;--text-main:#f8fafc;--text-muted:#94a3b8;--glass-bg:#0f172aa6;--glass-border:#ffffff14;--glass-blur:blur(16px);--glass-shadow:0 8px 32px 0 #0000005e;--input-bg:#ffffff0d;--input-border:#ffffff1a;--input-focus:#3b82f680;--transition-fast:.15s ease-in-out;--transition-base:.3s ease-in-out}body{width:100vw;height:100dvh;font-family:var(--font-family);background-color:var(--bg-darker);background:radial-gradient(circle at 50% 50%, var(--bg-dark) 0%, var(--bg-darker) 100%);color:var(--text-main);margin:0;padding:0;overflow:hidden}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border-left:1px solid var(--glass-border);box-shadow:var(--glass-shadow);color:var(--text-main);flex-direction:column;height:100vh;display:flex;overflow:hidden auto}.glass-panel::-webkit-scrollbar{width:6px}.glass-panel::-webkit-scrollbar-track{background:0 0}.glass-panel::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}.glass-panel::-webkit-scrollbar-thumb:hover{background:#fff3}.app-layout{width:100%;height:100dvh;display:flex}.canvas-container{flex:1;position:relative;overflow:hidden}.ui-container{z-index:10;z-index:10;flex-shrink:0;width:340px;max-width:90vw}.section-header{letter-spacing:-.02em;border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;margin:0 0 16px;padding-bottom:12px;font-size:1.1rem;font-weight:600;display:flex}.control-group{flex-direction:column;margin-bottom:24px;display:flex}.control-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.control-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.premium-input{box-sizing:border-box;background:var(--input-bg);border:1px solid var(--input-border);width:100%;color:var(--text-main);font-family:var(--font-family);transition:all var(--transition-fast);border-radius:6px;padding:10px 12px;font-size:.875rem}.premium-input:focus{border-color:var(--input-focus);background:#ffffff14;outline:none}.premium-input::placeholder{color:#ffffff4d}.premium-range{-webkit-appearance:none;background:var(--input-bg);border-radius:2px;outline:none;width:100%;height:4px;margin:10px 0}.premium-range::-webkit-slider-thumb{appearance:none;background:var(--text-main);cursor:pointer;width:16px;height:16px;transition:transform var(--transition-fast);border-radius:50%;box-shadow:0 2px 4px #00000080}.premium-range::-webkit-slider-thumb:hover{transform:scale(1.2)}.btn-reset{color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:1px solid #ffffff1a;border-radius:4px;padding:4px 8px;font-size:.65rem}.btn-reset:hover{color:var(--text-main);background:#ffffff1a}.btn-select{border:1px solid var(--glass-border);cursor:pointer;width:100%;transition:all var(--transition-base);border-radius:8px;justify-content:center;align-items:center;gap:8px;margin-bottom:12px;padding:10px;font-size:.85rem;font-weight:600;display:flex}.btn-select.inactive{background:var(--input-bg);color:var(--text-muted)}.btn-select.inactive:hover{background:#ffffff1a}.btn-select.active.text{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue);box-shadow:0 4px 12px #3b82f64d}.btn-select.active.logo{background:var(--accent-green);color:#fff;border-color:var(--accent-green);box-shadow:0 4px 12px #10b9814d}.mode-toggle-group{background:var(--input-bg);border:1px solid var(--glass-border);border-radius:8px;gap:8px;padding:4px;display:flex}.mode-btn{cursor:pointer;transition:all var(--transition-fast);color:var(--text-muted);background:0 0;border:none;border-radius:4px;flex:1;padding:6px;font-size:.75rem;font-weight:600}.mode-btn:hover:not(.active){background:#ffffff0d}.mode-btn.active.text{background:var(--accent-blue);color:#fff;box-shadow:0 2px 4px #0003}.mode-btn.active.logo{background:var(--accent-green);color:#fff;box-shadow:0 2px 4px #0003}.color-picker{-webkit-appearance:none;cursor:pointer;background:0 0;border:none;border-radius:6px;width:100%;height:40px;padding:0}.color-picker::-webkit-color-swatch-wrapper{padding:0}.color-picker::-webkit-color-swatch{border:1px solid var(--input-border);border-radius:6px}.viewport-toolbar{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);z-index:50;pointer-events:auto;border-radius:99px;gap:12px;padding:8px 16px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.toolbar-btn{color:var(--text-muted);cursor:pointer;width:36px;height:36px;transition:all var(--transition-fast);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.toolbar-btn:hover{color:var(--text-main);background:#ffffff1a;transform:translateY(-2px)}.toolbar-btn svg{width:20px;height:20px}.toolbar-divider{background:var(--glass-border);align-self:center;width:1px;height:20px}.tab-container{border-bottom:1px solid var(--glass-border);background:#ffffff08;margin-bottom:8px;padding:4px;display:flex}.tab-item{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all var(--transition-base);background:0 0;border:none;border-radius:4px;flex:1;justify-content:center;align-items:center;gap:8px;padding:12px;font-size:.75rem;font-weight:700;display:flex}.tab-item:hover:not(.active){color:var(--text-main);background:#ffffff0d}.tab-item.active{color:var(--text-main);background:var(--input-bg);box-shadow:0 2px 8px #0003}.tab-item.active.text{border-bottom:2px solid var(--accent-blue)}.tab-item.active.image{border-bottom:2px solid var(--accent-green)}.tab-item.active.library{border-bottom:2px solid var(--accent-blue)}@media (width<=768px){.app-layout{flex-direction:column;overflow:hidden}.canvas-container{border-bottom:1px solid var(--glass-border);flex:none;height:50%}.ui-container{flex:1;width:100%;max-width:100%;height:50%}.glass-panel{border-left:none;border-top:1px solid var(--glass-border);overflow:hidden}.viewport-toolbar{gap:8px;padding:6px 12px;bottom:12px}.toolbar-btn{width:32px;height:32px}.section-header{margin-bottom:12px;padding-bottom:8px;font-size:1rem}.control-group{margin-bottom:16px}.tab-item{gap:4px;padding:10px 4px;font-size:.7rem}.tab-item svg{width:14px;height:14px}}.flex-row{align-items:center;display:flex}.flex-between{justify-content:space-between;align-items:center;display:flex}.flex-column{flex-direction:column;display:flex}.flex-1{flex:1}.gap-8{gap:8px}.gap-12{gap:12px}.w-full{width:100%}.h-full{height:100%}.m-0{margin:0}.mb-8{margin-bottom:8px}.mt-12{margin-top:12px}.ml-auto{margin-left:auto}.p-8{padding:8px}.p-10{padding:10px}.p-12{padding:12px}.p-24{padding:24px}.p-16{padding:16px}.rounded-8{border-radius:8px}.rounded-4{border-radius:4px}.overflow-y-auto{overflow-y:auto}.d-none{display:none}.d-block{display:block}.bg-input{background:var(--input-bg)}.border-input{border:1px solid var(--input-border)}.border-glass-top{border-top:1px solid var(--glass-border)}.bg-glass-subtle{background:#0000001a}.text-danger{color:var(--accent-red)}.border-danger-subtle{border-color:#ef44444d}.logo-preview-container{background:var(--input-bg);border:1px solid var(--input-border);border-radius:8px;align-items:center;gap:12px;margin-top:12px;padding:8px;display:flex}.logo-preview-img{border-radius:4px;max-width:48px;max-height:48px;display:block}.configurator-footer{padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--glass-border);background:#0000001a;flex-direction:column;flex-shrink:0;gap:12px;display:flex}.btn-secondary{border:1px solid var(--glass-border);color:#fff;background:#ffffff0d;flex:1;padding:10px;font-size:.8rem}.btn-primary-large{width:100%;padding:12px;font-size:.9rem}.library-grid{gap:10px;display:grid}.library-item{gap:8px;display:flex;position:relative}.library-btn{text-align:left;cursor:pointer;background:#ffffff05;flex:1;padding:12px;font-size:.8rem}.library-btn-title{color:var(--text-main);margin-bottom:4px;font-weight:600}.library-btn-meta{color:var(--text-muted);font-size:.65rem}.btn-delete-item{color:var(--accent-red);background:#ef44441a;border:1px solid #ef444433;margin-top:auto;margin-bottom:auto}.text-muted-sm{color:var(--text-muted);font-size:.8rem}.italic{font-style:italic}.premium-toast{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-family:var(--font-family);font-size:.85rem;background:var(--bg-dark)!important;color:var(--text-main)!important;border:1px solid var(--glass-border)!important;border-radius:12px!important}