:root{--bg-gradient-start:#0f0c29;--bg-gradient-mid:#302b63;--bg-gradient-end:#24243e;--glass-bg:#ffffff14;--glass-border:#ffffff2e;--glass-shadow:0 8px 32px #0000005e;--glass-blur:12px;--text-primary:#fff;--text-secondary:#ffffffb3;--text-muted:#ffffff80;--accent-primary:#7c3aed;--accent-secondary:#a855f7;--accent-success:#10b981;--accent-error:#ef4444;--accent-warning:#f59e0b;--border-radius:16px;--border-radius-sm:8px}*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(135deg,var(--bg-gradient-start),var(--bg-gradient-mid),var(--bg-gradient-end));min-height:100vh;color:var(--text-primary);font-family:Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif;overflow-x:hidden}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--glass-shadow)}.glass-button{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border-radius:var(--border-radius-sm);color:#fff;cursor:pointer;border:none;padding:14px 28px;font-size:1rem;font-weight:600;transition:all .3s;box-shadow:0 4px 15px #7c3aed66}.glass-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #7c3aed99}.glass-button:active{transform:translateY(0)}.glass-button:disabled{opacity:.5;cursor:not-allowed;transform:none}.glass-button.secondary{background:var(--glass-bg);border:1px solid var(--glass-border);box-shadow:none}.glass-button.secondary:hover{box-shadow:none;background:#ffffff26}.glass-input{border:1px solid var(--glass-border);border-radius:var(--border-radius-sm);color:var(--text-primary);background:#0003;width:100%;padding:12px 16px;font-size:1rem;transition:all .3s}.glass-input:focus{border-color:var(--accent-primary);outline:none;box-shadow:0 0 0 3px #7c3aed33}.glass-input::placeholder{color:var(--text-muted)}.glass-textarea{border:1px solid var(--glass-border);border-radius:var(--border-radius-sm);color:var(--text-primary);resize:vertical;background:#0003;width:100%;min-height:150px;padding:16px;font-family:Cascadia Code,Fira Code,monospace;font-size:1rem;transition:all .3s}.glass-textarea:focus{border-color:var(--accent-primary);outline:none;box-shadow:0 0 0 3px #7c3aed33}.app-container{max-width:1100px;min-height:100vh;margin:0 auto;padding:40px 20px}.app-header{text-align:center;margin-bottom:40px}.app-title{background:linear-gradient(135deg,#fff,var(--accent-secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:10px;font-size:2.5rem;font-weight:700}.app-subtitle{color:var(--text-secondary);font-size:1.1rem}.tabs-container{gap:10px;margin-bottom:30px;display:flex}.tab-button{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--border-radius-sm);color:var(--text-secondary);cursor:pointer;flex:1;justify-content:center;align-items:center;gap:10px;padding:16px 24px;font-size:1rem;font-weight:500;transition:all .3s;display:flex}.tab-button:hover{background:#ffffff1f}.tab-button.active{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;border-color:#0000;box-shadow:0 4px 15px #7c3aed66}.tab-icon{font-size:1.3rem}.tab-content{padding:30px;animation:.3s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.form-group{margin-bottom:24px}.form-label{color:var(--text-secondary);margin-bottom:10px;font-weight:500;display:block}.form-hint{color:var(--text-muted);margin-top:8px;font-size:.85rem}.form-hint.warning{color:var(--accent-warning)}.image-upload-zone{border:2px dashed var(--glass-border);border-radius:var(--border-radius);text-align:center;cursor:pointer;background:#0000001a;padding:40px;transition:all .3s}.image-upload-zone:hover{border-color:var(--accent-primary);background:#7c3aed1a}.image-upload-zone.has-image{padding:20px}.upload-icon{opacity:.7;margin-bottom:15px;font-size:3rem}.upload-text{color:var(--text-secondary);margin-bottom:5px}.upload-hint{color:var(--text-muted);font-size:.85rem}.image-preview{border-radius:var(--border-radius-sm);object-fit:contain;max-width:100%;max-height:300px}.image-info{border-radius:var(--border-radius-sm);color:var(--accent-success);background:#10b9811a;border:1px solid #10b9814d;margin-top:15px;padding:12px;font-size:.9rem}.alert{border-radius:var(--border-radius-sm);align-items:center;gap:12px;margin-bottom:20px;padding:16px 20px;display:flex}.alert.success{color:var(--accent-success);background:#10b98126;border:1px solid #10b9814d}.alert.error{color:var(--accent-error);background:#ef444426;border:1px solid #ef44444d}.alert.warning{color:var(--accent-warning);background:#f59e0b26;border:1px solid #f59e0b4d}.result-section{border-top:1px solid var(--glass-border);margin-top:30px;padding-top:30px}.result-header{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.result-title{font-size:1.1rem;font-weight:600}.result-actions{gap:10px;display:flex}.result-content{border:1px solid var(--glass-border);border-radius:var(--border-radius-sm);white-space:pre-wrap;word-break:break-word;background:#0000004d;max-height:300px;padding:20px;font-family:Cascadia Code,Fira Code,monospace;overflow-y:auto}.two-columns{grid-template-columns:1fr 1fr;gap:30px;display:grid}@media (max-width:768px){.two-columns{grid-template-columns:1fr}.app-title{font-size:1.8rem}.tabs-container{flex-direction:column}}.loading-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:20px;height:20px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.stars{pointer-events:none;z-index:-1;width:100%;height:100%;position:fixed;top:0;left:0;overflow:hidden}.star{opacity:.5;background:#fff;border-radius:50%;width:2px;height:2px;animation:3s infinite twinkle;position:absolute}@keyframes twinkle{0%,to{opacity:.3}50%{opacity:.8}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0003;border-radius:4px}::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.hidden-input{display:none}
