*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;background:#0a0a0a;justify-content:center;min-height:100vh;padding:2rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;display:flex}#app{width:100%;max-width:800px}header{text-align:center;margin-bottom:2rem}h1{letter-spacing:.1em;color:#fff;font-size:2.5rem;font-weight:300}.subtitle{color:#666;margin-top:.5rem;font-size:.9rem}.controls{background:#141414;border:1px solid #222;border-radius:12px;flex-direction:column;gap:1rem;padding:1.5rem;display:flex}.input-group{flex-direction:column;gap:.4rem;display:flex}.input-group label{color:#888;text-transform:uppercase;letter-spacing:.05em;font-size:.8rem}input[type=text]{color:#fff;background:#1a1a1a;border:1px solid #333;border-radius:8px;outline:none;padding:.75rem 1rem;font-size:1rem;transition:border-color .2s}input[type=text]:focus{border-color:#555}.radio-group{gap:.5rem;display:flex}.radio-label{cursor:pointer;flex:1}.radio-label input{display:none}.radio-label span{text-align:center;background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:.6rem 1rem;font-size:.9rem;transition:all .2s;display:block}.radio-label input:checked+span{color:#fff;background:#222;border-color:#fff}button{color:#000;cursor:pointer;background:#fff;border:none;border-radius:8px;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;transition:opacity .2s}button:hover{opacity:.9}button:disabled{opacity:.4;cursor:not-allowed}#output-area{text-align:center;margin-top:2rem}.status{min-height:1.4rem;margin-bottom:1rem;font-size:.9rem;transition:all .3s}.status.generating{color:#888}.status.verifying{color:#f0ad4e}.status.success{color:#4ade80;font-size:1.1rem;font-weight:600}.status.fallback{color:#f0ad4e}.status.error{color:#d9534f}.success-badge{background:#4ade801f;border:1px solid #4ade804d;border-radius:100px;align-items:center;gap:.5rem;padding:.5rem 1.2rem;animation:.4s cubic-bezier(.34,1.56,.64,1) successPop;display:inline-flex}.success-badge .check{color:#000;background:#4ade80;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:14px;font-weight:700;display:flex}@keyframes successPop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.canvas-wrapper{background:#0a0a0f;border:1px solid #222;border-radius:12px;margin-bottom:1rem;padding:1.5rem;transition:box-shadow .4s;display:inline-block}.canvas-wrapper.glow-plasma{animation:3s ease-in-out infinite glowPulse-plasma}.canvas-wrapper.glow-matrix{animation:3s ease-in-out infinite glowPulse-matrix}.canvas-wrapper.glow-lava{animation:3s ease-in-out infinite glowPulse-lava}.canvas-wrapper.glow-aurora{animation:3s ease-in-out infinite glowPulse-aurora}.canvas-wrapper.glow-mono{box-shadow:0 0 30px #ffffff14}@keyframes glowPulse-plasma{0%,to{box-shadow:0 0 30px #b450ff33,0 0 60px #b450ff14}50%{box-shadow:0 0 50px #b450ff59,0 0 100px #b450ff26}}@keyframes glowPulse-matrix{0%,to{box-shadow:0 0 30px #00ff3c26,0 0 60px #00ff3c0f}50%{box-shadow:0 0 50px #00ff3c4d,0 0 100px #00ff3c1f}}@keyframes glowPulse-lava{0%,to{box-shadow:0 0 30px #ff641433,0 0 60px #ff3c0014}50%{box-shadow:0 0 50px #ff641459,0 0 100px #ff3c0026}}@keyframes glowPulse-aurora{0%,to{box-shadow:0 0 30px #00dcb426,0 0 60px #64b4ff14}50%{box-shadow:0 0 50px #00dcb44d,0 0 100px #64b4ff26}}.canvas-wrapper:not(.glow-mono) canvas{animation:8s ease-in-out infinite hueShimmer}@keyframes hueShimmer{0%,to{filter:hue-rotate()brightness()}50%{filter:hue-rotate(8deg)brightness(1.03)}}canvas{image-rendering:pixelated;display:block}.theme-group{flex-wrap:wrap}.theme-plasma input:checked+span{color:#e6b3ff!important;background:#aa00ff26!important;border-color:#d580ff!important}.theme-matrix input:checked+span{color:#9f9!important;background:#00cc0026!important;border-color:#6f6!important}.theme-lava input:checked+span{color:#ffc499!important;background:#cc550026!important;border-color:#f83!important}.theme-aurora input:checked+span{color:#9efadb!important;background:#0ac28526!important;border-color:#3df5b8!important}.theme-mono input:checked+span{color:#ccc!important;background:#ffffff14!important;border-color:#888!important}.logo-upload-row{align-items:center;gap:.5rem;display:flex}.logo-upload-btn{cursor:pointer;text-align:center;color:#888;background:#1a1a1a;border:1px solid #333;border-radius:8px;flex:1;padding:.6rem 1rem;font-size:.9rem;transition:all .2s;display:block}.logo-upload-btn:hover{color:#ccc;border-color:#555}.logo-upload-btn.has-logo{color:#4ade80;border-color:#4ade80}.logo-upload-btn input[type=file]{display:none}.logo-clear-btn{flex-shrink:0;color:#888!important;background:#222!important;padding:.6rem .8rem!important;font-size:.8rem!important}.export-buttons{justify-content:center;gap:.5rem;display:flex}.export-buttons button{color:#e0e0e0;background:#222;padding:.6rem 1rem;font-size:.85rem}.export-buttons button:hover{background:#333}canvas{max-width:100%;height:auto!important}@media (width<=600px){body{padding:1rem}h1{font-size:1.8rem}.controls{border-radius:10px;padding:1rem}.radio-group{flex-wrap:wrap}.radio-label,.theme-group .radio-label{flex:0 0 calc(33.33% - .35rem)}.radio-label span{padding:.5rem .4rem;font-size:.75rem}.canvas-wrapper{border-radius:8px;width:100%;padding:.75rem}.export-buttons{flex-direction:column}.export-buttons button{width:100%}input[type=text]{font-size:16px}button{-webkit-tap-highlight-color:transparent;padding:.85rem 1.5rem;font-size:1rem}}
