:root{--animation-duration:.4s;--transition-duration:.3s;--backdrop-blur:blur(10px);--box-shadow:0 8px 25px #00000026;--mobile-animation-duration:.2s;--mobile-transition-duration:.15s;--mobile-backdrop-blur:blur(5px);--mobile-box-shadow:0 4px 15px #0000001a}@media (max-width:768px){:root{--animation-duration:var(--mobile-animation-duration);--transition-duration:var(--mobile-transition-duration);--backdrop-blur:var(--mobile-backdrop-blur);--box-shadow:var(--mobile-box-shadow)}}@media (max-width:480px) and (-webkit-max-device-pixel-ratio:1.5625),(max-width:480px) and (max-resolution:150dpi){:root{--animation-duration:0s;--transition-duration:.1s;--backdrop-blur:none;--box-shadow:none}}.tutorial-modal,.preview-modal,.result-modal,.icon-selection-group,.color-selection-group,.song-selection-group,.image-upload-group{content-visibility:auto;contain-intrinsic-size:auto 500px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}*{box-sizing:border-box;margin:0;padding:0}body{color:#fff;background:linear-gradient(135deg,#0a0a0a 0%,#1a1a2e 50%,#16213e 100%);min-height:100vh;padding:20px;font-family:Orbitron,sans-serif}.container{max-width:800px;margin:0 auto}.header{text-align:center;-webkit-backdrop-filter:blur(15px);background:linear-gradient(135deg,#ffffff14,#ffffff05);border:1px solid #4ecdc433;border-radius:20px;margin-bottom:3rem;padding:2rem;position:relative;overflow:hidden;box-shadow:0 15px 35px #0000001a}.header:before{content:"";opacity:.8;background:linear-gradient(90deg,#4ecdc4,#c534ed,#ff6b9d);height:2px;position:absolute;top:0;left:0;right:0}h1{background:linear-gradient(45deg,#ff6b9d,#4ecdc4);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:1rem;font-size:2.5rem;font-weight:900}#qrCode{justify-content:center;align-items:center;margin-top:2rem;display:flex}#qrCode canvas{border-radius:15px}.form-container{-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:1px solid #4ecdc433;border-radius:25px;padding:2.5rem;position:relative;overflow:hidden;box-shadow:0 25px 50px #00000026,0 0 0 1px #ffffff1a}.form-container:before{content:"";opacity:.8;background:linear-gradient(90deg,#4ecdc4,#c534ed,#ff6b9d);height:2px;position:absolute;top:0;left:0;right:0}.form-group{margin-bottom:2rem}.form-group label{-webkit-text-fill-color:transparent;text-shadow:0 2px 4px #0000001a;background:linear-gradient(135deg,#4ecdc4,#c534ed);-webkit-background-clip:text;background-clip:text;margin-bottom:.8rem;font-weight:700;display:block}.form-group textarea,.form-group input,.form-group select{color:#12a8c0;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:2px solid #4ecdc44d;border-radius:15px;width:100%;padding:1.2rem;font-family:Orbitron,sans-serif;font-size:1rem;transition:all .3s;box-shadow:0 8px 25px #0000001a}.form-group textarea{resize:vertical;height:150px}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:#4ecdc4;outline:none;transform:translateY(-2px);box-shadow:0 0 25px #4ecdc466,0 0 0 1px #c534ed4d}.textarea-container{position:relative}.textarea-info{justify-content:space-between;align-items:center;margin-top:8px;font-size:.85rem;display:flex}.textarea-counter{color:#ffffffb3;align-items:center;gap:.5rem;display:flex}.line-counter{color:#4ecdc4cc;font-weight:600}.textarea-warning{color:#ff6b6b;align-items:center;gap:.5rem;font-weight:600;animation:1s ease-in-out infinite alternate warningPulse;display:flex}.textarea-warning .bi{font-size:1rem}.textarea-container.warning textarea{border-color:#ff6b6b;box-shadow:0 0 15px #ff6b6b4d}.textarea-container.danger textarea{border-color:#ff4757;box-shadow:0 0 20px #ff475766}.textarea-counter.warning{color:#ffa502}.textarea-counter.danger{color:#ff6b6b;font-weight:700}@keyframes warningPulse{0%{opacity:.7}to{opacity:1}}.color-picker-group{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;display:grid}.color-option{background:#ffffff0d;border-radius:10px;align-items:center;gap:.5rem;padding:.5rem;display:flex}.color-preview{border:2px solid #ffffff4d;border-radius:50%;width:30px;height:30px}.icon-selector{grid-template-columns:repeat(auto-fill,minmax(60px,1fr));gap:1rem;margin-top:1rem;display:grid}.icon-option{cursor:pointer;text-align:center;background:#ffffff0d;border:2px solid #ffffff4d;border-radius:10px;padding:1rem;font-size:1.5rem;transition:all .3s}.icon-option:hover,.icon-option.selected{background:#4ecdc433;border-color:#4ecdc4;transform:scale(1.1)}.back-btn{color:#4ecdc4;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc426,#c534ed1a);border:1px solid #4ecdc44d;border-radius:50px;align-items:center;gap:.8rem;margin-bottom:2rem;padding:12px 20px;font-weight:700;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1);display:inline-flex;box-shadow:0 8px 25px #0000001a}.back-btn:hover{color:#fff;background:linear-gradient(135deg,#4ecdc440,#c534ed26);transform:translate(-8px)translateY(-2px);box-shadow:0 15px 35px #4ecdc44d,0 0 20px #c534ed33}.loading{text-align:center;padding:2rem;display:none}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.result{text-align:center;background:#4ecdc41a;border:2px solid #4ecdc4;border-radius:15px;margin-top:2rem;padding:2rem;display:none}.result-link{word-break:break-all;background:#ffffff1a;border-radius:10px;margin:1rem 0;padding:1rem;font-family:monospace}.copy-btn{color:#4ecdc4;cursor:pointer;background:0 0;border:2px solid #4ecdc4;border-radius:25px;padding:.5rem 1rem;font-family:Orbitron,sans-serif;transition:all .3s}.copy-btn:hover{background:#4ecdc433}.error-message{color:#fff;text-align:center;background:#ff4757;border-radius:8px;margin:1rem 0;padding:1rem}.performance-option ul{text-align:left;margin:0;padding:0;list-style:none}.performance-option li{color:#ffffffb3;margin-bottom:.4rem;padding-left:1rem;font-size:.85rem;transition:all .3s;position:relative}.performance-option li:before{content:"✨";color:#4ecdc4;font-size:.8rem;position:absolute;left:0}.performance-option:hover li{color:#ffffffe6;transform:translate(2px)}.performance-option.selected li{color:#fff}.song-selector-container{align-items:center;gap:.5rem;display:flex}.preview-btn{cursor:pointer;color:#4ecdc4;background:0 0;border:2px solid #4ecdc4;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.2rem;transition:all .3s;display:flex}.preview-btn:hover{background:#4ecdc433;transform:scale(1.1)}.song-input{color:#12a8c0;background:#ffffff1a;border:2px solid #4ecdc44d;border-radius:10px;width:100%;margin-bottom:.5rem;padding:1rem;font-family:Orbitron,sans-serif;font-size:1rem}.check-song-btn{color:#4ecdc4;cursor:pointer;background:0 0;border:2px solid #4ecdc4;border-radius:10px;width:100%;margin-bottom:.5rem;padding:.8rem 1rem;font-family:Orbitron,sans-serif;transition:all .3s}.check-song-btn:hover{background:#4ecdc433}.divider{text-align:center;color:#aaa;margin:1rem 0;font-size:.9rem}@media (max-width:768px){body{padding:10px}.container{max-width:100%;padding:0}h1{margin-bottom:.5rem;font-size:1.8rem}.header{margin-bottom:2rem}.form-container{border-radius:15px;padding:1rem}.form-group{margin-bottom:1.5rem}.form-group textarea,.form-group input,.form-group select{padding:.8rem;font-size:.9rem}.icon-selector{grid-template-columns:repeat(auto-fill,minmax(45px,1fr));gap:.8rem}.icon-option{padding:.8rem;font-size:1.2rem}.color-picker-group{grid-template-columns:1fr;gap:.8rem}.icon-selector-enhanced{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:.8rem}.icon-option-enhanced{padding:.8rem}.icon-preview{font-size:1.3rem}.color-picker-group-enhanced{grid-template-columns:1fr;gap:.8rem}.color-option-enhanced{padding:.8rem}.color-input-wrapper{gap:.6rem}.upload-area{padding:1.5rem}.upload-icon{font-size:2.5rem}.upload-text h2{font-size:1rem}.upload-btn{padding:.7rem 1.2rem;font-size:.9rem}.color-option{padding:.8rem}.color-option label{font-size:.9rem}.performance-selector{grid-template-columns:1fr;gap:1rem}.performance-option{padding:1rem}.performance-option h2{font-size:1rem}.performance-icon{font-size:1.8rem}.performance-option p{font-size:.85rem}.performance-option li{font-size:.75rem}.btn{padding:.8rem 1.5rem;font-size:1rem}.result-link{padding:.8rem;font-size:.8rem}.copy-btn{padding:.4rem .8rem;font-size:.9rem}.song-selector-container{flex-direction:column;align-items:stretch;gap:.5rem}.preview-btn{border-radius:8px;width:100%;height:35px;font-size:1rem}.song-input{padding:.8rem;font-size:.9rem}.check-song-btn{padding:.7rem;font-size:.9rem}.divider{margin:.8rem 0;font-size:.85rem}}@media (max-width:480px){body{padding:5px}h1{font-size:1.5rem}.form-container{padding:.8rem}.form-group textarea,.form-group input,.form-group select{padding:.7rem;font-size:.85rem}.icon-selector{grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:.5rem}.icon-selector-enhanced{grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:.5rem}.icon-option-enhanced{padding:.6rem}.icon-preview{font-size:1.1rem}.icon-label{font-size:.75rem}.color-picker-group-enhanced{grid-template-columns:1fr;gap:.6rem}.color-option-enhanced{padding:.6rem}.color-input-wrapper{gap:.5rem}.color-preview{width:35px;height:35px}.color-input{width:45px;height:35px}.upload-area{padding:1rem}.upload-icon{font-size:2rem}.upload-text h2{margin-bottom:.8rem;font-size:.9rem}.upload-btn{padding:.6rem 1rem;font-size:.85rem}.form-label-enhanced{font-size:1rem}.form-label-enhanced i{font-size:1.1rem}.galaxy-id-input-wrapper{flex-direction:column;gap:.6rem}.url-preview{padding:.6rem .8rem}.url-base,.galaxy-id-input{font-size:.8rem}.check-id-btn{width:100%;height:40px;padding:.6rem}.messages-stats{flex-direction:column;gap:.8rem}.stat-item{padding:.5rem .8rem;font-size:.8rem}.textarea-overlay{display:none}.messages-hints{flex-direction:column;gap:.8rem}.audio-type-tabs{flex-direction:column;gap:.5rem}.audio-type-tab{padding:.6rem .8rem;font-size:.85rem}.tab-text{display:none}.song-selector-enhanced{flex-direction:column;gap:.8rem}.song-preview-btn{width:100%;min-width:auto}.upload-info{flex-direction:column;gap:.8rem}.audio-header{flex-direction:column;align-items:flex-start;gap:1rem}.audio-file-info{width:100%}.audio-actions{align-self:flex-end}.audio-progress-section{gap:.8rem}.time-display{min-width:35px;font-size:.8rem}.icon-option{padding:.6rem;font-size:1rem}.performance-option{padding:.8rem}.performance-icon{font-size:1.5rem}.performance-option h2{font-size:.9rem}.performance-option p{font-size:.8rem}.performance-option li{font-size:.7rem}.btn{padding:.7rem 1.2rem;font-size:.9rem}.preview-btn{height:32px;font-size:.9rem}.song-input{padding:.7rem;font-size:.85rem}.check-song-btn{padding:.6rem;font-size:.85rem}.divider{margin:.6rem 0;font-size:.8rem}}.tutorial-modal{z-index:1000;-webkit-backdrop-filter:blur(15px);background:#000c;width:100%;height:100%;display:none;position:fixed;top:0;left:0;overflow-y:auto}.tutorial-content{color:#fff;-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:1px solid #4ecdc433;border-radius:25px;max-width:800px;margin:30px auto;padding:30px;animation:.4s ease-out modalFadeIn;position:relative;overflow:hidden;box-shadow:0 25px 50px #0000004d,0 0 0 1px #ffffff1a}.tutorial-content:before{content:"";opacity:.8;background:linear-gradient(90deg,#4ecdc4,#c534ed,#ff6b9d);height:2px;position:absolute;top:0;left:0;right:0}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.tutorial-header{border-bottom:1px solid #4ecdc44d;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;display:flex}.tutorial-title{background:linear-gradient(45deg,#ff6b9d,#4ecdc4);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;align-items:center;font-size:1.8rem;font-weight:700;display:flex}.tutorial-title span{margin-left:10px}.close-tutorial{color:#ff6b9d;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;transition:all .3s;display:flex}.close-tutorial:hover{background:#ff6b9d33;transform:scale(1.1)}.steps-container{flex-direction:column;gap:25px;display:flex}.step{-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff14,#ffffff05);border:1px solid #4ecdc433;border-radius:18px;padding:25px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:0 8px 25px #0000001a}.step:hover{background:linear-gradient(135deg,#ffffff1f,#ffffff0f);border-color:#4ecdc466;transform:translateY(-5px)scale(1.02);box-shadow:0 15px 35px #0003,0 0 20px #4ecdc44d}.step-number{-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ff6b9d,#4ecdc4,#c534ed);border:2px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.3rem;font-weight:700;display:flex;position:absolute;top:-18px;left:-18px;box-shadow:0 8px 25px #0000004d,0 0 15px #4ecdc466}.step-title{-webkit-text-fill-color:transparent;text-shadow:0 2px 4px #0000001a;background:linear-gradient(135deg,#4ecdc4,#c534ed);-webkit-background-clip:text;background-clip:text;margin-bottom:12px;margin-left:20px;font-size:1.4rem;font-weight:600}.step-description{line-height:1.6}.tutorial-tip{-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ff6b9d26,#c534ed1a);border:1px solid #ff6b9d4d;border-radius:12px;margin-top:8px;padding:12px 18px;font-size:.9rem;position:relative;overflow:hidden;box-shadow:0 4px 15px #ff6b9d1a}.tutorial-tip:before{content:"";background:linear-gradient(#ff6b9d,#c534ed);width:4px;height:100%;position:absolute;top:0;left:0}.tutorial-btn{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc4,#44a08d,#c534ed);border:none;border-radius:50px;align-items:center;gap:10px;padding:12px 24px;font-family:Orbitron,sans-serif;font-size:1rem;font-weight:600;text-decoration:none;transition:all .4s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative;overflow:hidden;box-shadow:0 8px 25px #4ecdc44d}.tutorial-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.tutorial-btn:hover{transform:translateY(-4px)scale(1.05);box-shadow:0 15px 35px #4ecdc466,0 0 20px #c534ed4d}.tutorial-btn:hover:before{left:100%}.tutorial-btn i{font-size:1.1rem}.tutorial-footer{text-align:center;border-top:1px solid #4ecdc44d;margin-top:30px;padding-top:20px}.tutorial-navigation{justify-content:space-between;margin-top:20px;display:flex}.steps-dots{justify-content:center;gap:8px;margin-top:20px;display:flex}.step-dot{cursor:pointer;background:#ffffff4d;border-radius:50%;width:10px;height:10px;transition:all .3s}.step-dot.active{background:#4ecdc4;transform:scale(1.2)}.step-dot:hover{background:#4ecdc4b3}.step-image{border:2px solid #4ecdc44d;border-radius:10px;width:100%;max-width:500px;height:auto;margin:15px auto;display:block;box-shadow:0 10px 20px #0000004d}.open-tutorial-btn{color:#fff;cursor:pointer;z-index:10;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc4,#44a08d,#c534ed);border:1px solid #ffffff1a;border-radius:50px;align-items:center;gap:8px;padding:10px 18px;font-family:Orbitron,sans-serif;font-size:.9rem;font-weight:600;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:15px;right:15px;box-shadow:0 8px 25px #4ecdc44d}.open-tutorial-btn:hover{transform:translateY(-4px)scale(1.05);box-shadow:0 15px 35px #4ecdc466,0 0 20px #c534ed4d}@media (max-width:768px){.tutorial-content{margin:20px;padding:20px}.tutorial-title{font-size:1.5rem}.step-title{font-size:1.1rem}.step{padding:15px}.step-number{width:30px;height:30px;font-size:1rem;top:-10px;left:-10px}.open-tutorial-btn{padding:6px 12px;font-size:.8rem;top:10px;right:10px}}.enhance-btn{cursor:pointer;color:#fff;background:linear-gradient(45deg,#c534ed,#4ecdc4);border:none;border-radius:50px;margin-top:10px;padding:.6rem 1.2rem;font-family:Orbitron,sans-serif;font-size:.9rem;font-weight:700;transition:all .3s;display:block}.enhance-btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px #c534ed66}.enhance-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}#enhanceStatus{border-radius:5px;padding:.5rem;font-weight:500}#enhanceStatus.success{color:#4ecdc4;background:#4ecdc433}#enhanceStatus.error{color:#ff6b6b;background:#ff6b6b33}#enhanceStatus.processing{color:#c534ed;background:#c534ed1a}.ai-enhancement-toggle{margin-top:12px;margin-bottom:8px}.toggle-checkbox{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:12px;display:flex}.toggle-checkbox input[type=checkbox]{display:none}.toggle-slider{background:#fff3;border:1px solid #c534ed4d;border-radius:24px;width:50px;height:24px;transition:all .3s;position:relative}.toggle-slider:before{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:all .3s;position:absolute;top:2px;left:2px;box-shadow:0 2px 4px #0003}.toggle-checkbox input[type=checkbox]:checked+.toggle-slider{background:linear-gradient(135deg,#c534ed,#4ecdc4);border-color:#c534ed}.toggle-checkbox input[type=checkbox]:checked+.toggle-slider:before{background:#fff;transform:translate(26px)}.toggle-label{color:#c534ed;font-size:.95rem;font-weight:600;transition:color .3s}.toggle-checkbox:hover .toggle-label{color:#4ecdc4}.enhance-container{-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff14,#ffffff05);border:2px solid #c534ed4d;border-radius:16px;margin-top:1.5rem;padding:1.5rem;animation:.4s cubic-bezier(.4,0,.2,1) slideDown;position:relative;overflow:hidden}.enhance-container:before{content:"";opacity:.5;z-index:-1;background:linear-gradient(135deg,#c534ed1a,#4ecdc41a);position:absolute;top:0;bottom:0;left:0;right:0}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.ai-usage-limits{background:linear-gradient(135deg,#c534ed1a,#4ecdc41a);border:1px solid #c534ed4d;border-radius:12px;margin-bottom:15px;padding:15px;font-family:Orbitron,sans-serif}.usage-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.usage-icon{margin-right:8px;font-size:1.2rem}.usage-title{color:#c534ed;flex-grow:1;font-weight:600}.refresh-btn{cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px;font-size:1rem;transition:all .2s}.refresh-btn:hover{background:#c534ed33;transform:rotate(180deg)}.usage-bars{flex-direction:column;gap:10px;display:flex}.usage-item{flex-direction:column;gap:4px;display:flex}.usage-label{justify-content:space-between;align-items:center;font-size:.85rem;font-weight:500;display:flex}.usage-count{color:#c534ed;font-weight:600}.usage-bar{background:#fff3;border-radius:3px;height:6px;overflow:hidden}.usage-progress{background:linear-gradient(90deg,#4ecdc4,#c534ed);border-radius:3px;height:100%;transition:width .3s}.usage-progress.warning{background:linear-gradient(90deg,#ffd93d,#ff6b9d)}.usage-progress.danger{background:linear-gradient(90deg,#ff6b6b,#ff4757)}.usage-message{text-align:center;border-radius:6px;margin-top:10px;padding:8px 12px;font-size:.8rem;display:none}.usage-message.info{color:#4ecdc4;background:#4ecdc433;border:1px solid #4ecdc44d}.usage-message.warning{color:#ffd93d;background:#ffd93d33;border:1px solid #ffd93d4d}.usage-message.error{color:#ff6b6b;background:#ff6b6b33;border:1px solid #ff6b6b4d}.enhance-controls{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:10px;display:flex}.enhance-options{background:#c534ed1a;border-radius:25px;align-items:center;gap:8px;padding:5px 10px;display:flex}.enhance-options label{color:#c534ed;margin:0;font-size:.9rem;font-weight:600}.message-count-input{color:#c534ed;text-align:center;background:#ffffff26;border:1px solid #c534ed66;border-radius:12px;outline:none;width:50px;padding:3px 8px;font-weight:700}.message-count-input:focus{border-color:#c534ed;box-shadow:0 0 0 2px #c534ed33}.enhance-suggestion{background:#ffd7001a;border-left:3px solid gold;border-radius:0 8px 8px 0;align-items:flex-start;gap:10px;margin-bottom:10px;padding:8px 12px;display:flex}.enhance-suggestion p{color:#e6c200;margin:0;font-size:.85rem;line-height:1.4}.suggestion-icon{font-size:1.2rem}.quick-topics{margin-top:10px;margin-bottom:12px}.quick-topic-label{color:#e6c200;margin-bottom:8px;font-size:.85rem;display:block}.topic-buttons{flex-wrap:wrap;gap:8px;display:flex}.topic-btn{color:#4ecdc4;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff14,#ffffff05);border:2px solid #4ecdc44d;border-radius:25px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.topic-btn:before{content:"";opacity:0;z-index:-1;background:linear-gradient(135deg,#4ecdc41a,#c534ed1a);transition:opacity .3s;position:absolute;top:0;bottom:0;left:0;right:0}.topic-btn:hover{color:#c534ed;background:linear-gradient(135deg,#ffffff1f,#ffffff0f);border-color:#4ecdc499;transform:translateY(-3px)scale(1.02);box-shadow:0 8px 25px #4ecdc44d,0 0 15px #4ecdc433}.topic-btn:hover:before{opacity:1}.topic-btn:active{transition:all .1s;transform:translateY(-1px)scale(.98)}.btn-highlight{animation:1.5s buttonPulse}@keyframes buttonPulse{0%{box-shadow:0 0 #c534edb3}50%{box-shadow:0 0 0 10px #c534ed00}to{box-shadow:0 0 #c534ed00}}@media (max-width:768px){.ai-enhancement-toggle{margin-top:10px;margin-bottom:6px}.toggle-checkbox{gap:10px}.toggle-label{font-size:.9rem}.enhance-container{margin-top:12px;padding:12px}.enhance-controls{flex-direction:column;align-items:flex-start;gap:10px}.enhance-btn{width:100%}.enhance-options{justify-content:center;width:100%}}.qr-style-option{border:2px solid #0000;transition:all .3s}.qr-style-option:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0003}.qr-style-option.selected{background:#4ecdc41a;border-color:#4ecdc4;box-shadow:0 5px 15px #4ecdc44d}.qr-preview{transition:all .3s}.qr-style-option:hover .qr-preview{transform:scale(1.05)}@media (max-width:768px){.qr-styles-container{gap:5px}.qr-style-option{padding:3px}.qr-preview{width:60px;height:60px}.qr-style-option span{font-size:24px}}@media (max-width:480px){.qr-styles-container{gap:3px}.qr-preview{width:50px;height:50px}.qr-style-option span{font-size:20px}}.ai-toggle-card{background:linear-gradient(135deg,#c534ed1a,#4ecdc41a);border:1px solid #c534ed4d;border-radius:16px;margin-top:15px;padding:20px;transition:all .3s;position:relative;overflow:hidden}.ai-toggle-card:before{content:"";opacity:0;background:linear-gradient(90deg,#c534ed,#4ecdc4,#ff6b9d);height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.ai-toggle-card:hover{border-color:#c534ed;transform:translateY(-2px);box-shadow:0 8px 25px #c534ed33}.ai-toggle-card:hover:before{opacity:1}.ai-toggle-header{justify-content:space-between;align-items:center;margin-bottom:15px;display:flex}.ai-toggle-info{flex:1;align-items:center;gap:15px;display:flex}.ai-toggle-icon{-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px #c534ed4d);background:linear-gradient(135deg,#c534ed,#4ecdc4);-webkit-background-clip:text;background-clip:text;font-size:2.5rem}.ai-toggle-content{flex:1}.ai-toggle-title{color:#c534ed;margin:0 0 5px;font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:700}.ai-toggle-description{color:#4ecdc4cc;margin:0;font-size:.9rem;line-height:1.4}.toggle-switch{cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.toggle-switch input[type=checkbox]{display:none}.toggle-slider-modern{background:#fff3;border:2px solid #c534ed4d;border-radius:30px;width:60px;height:30px;transition:all .3s;display:block;position:relative}.toggle-slider-modern:before{content:"";background:#fff;border-radius:50%;width:22px;height:22px;transition:all .3s;position:absolute;top:3px;left:3px;box-shadow:0 2px 8px #0003}.toggle-switch input[type=checkbox]:checked+.toggle-slider-modern{background:linear-gradient(135deg,#c534ed,#4ecdc4);border-color:#c534ed;box-shadow:0 0 20px #c534ed66}.toggle-switch input[type=checkbox]:checked+.toggle-slider-modern:before{transform:translate(30px);box-shadow:0 2px 8px #c534ed4d}.ai-toggle-features{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.feature-tag{color:#4ecdc4;background:#4ecdc426;border:1px solid #4ecdc44d;border-radius:20px;padding:4px 10px;font-size:.8rem;font-weight:500;transition:all .2s}.feature-tag:hover{background:#4ecdc440;transform:translateY(-1px)}@media (max-width:768px){.ai-toggle-card{margin-top:12px;padding:15px}.ai-toggle-header{margin-bottom:12px}.ai-toggle-info{gap:12px}.ai-toggle-icon{font-size:2rem}.ai-toggle-title{font-size:1.1rem}.ai-toggle-description{font-size:.85rem}.toggle-slider-modern{width:50px;height:26px}.toggle-slider-modern:before{width:18px;height:18px;top:3px;left:3px}.toggle-switch input[type=checkbox]:checked+.toggle-slider-modern:before{transform:translate(24px)}.feature-tag{padding:3px 8px;font-size:.75rem}}@media (max-width:480px){.ai-toggle-card{padding:12px}.ai-toggle-header{flex-direction:column;align-items:flex-start;gap:10px}.ai-toggle-info{gap:10px;width:100%}.ai-toggle-icon{font-size:1.8rem}.ai-toggle-title{font-size:1rem}.ai-toggle-description{font-size:.8rem}.toggle-slider-modern{width:45px;height:24px}.toggle-slider-modern:before{width:16px;height:16px;top:3px;left:3px}.toggle-switch input[type=checkbox]:checked+.toggle-slider-modern:before{transform:translate(21px)}.ai-toggle-features{gap:6px;margin-top:8px}.feature-tag{padding:2px 6px;font-size:.7rem}}.modern-audio-player{-webkit-backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:1px solid #4ecdc44d;border-radius:20px;margin-top:15px;padding:25px;animation:.3s slideInUp;position:relative;overflow:hidden;box-shadow:0 15px 35px #0003,0 0 0 1px #ffffff1a}.modern-audio-player:before{content:"";opacity:.8;background:linear-gradient(90deg,#4ecdc4,#c534ed,#ff6b9d);border-radius:20px 20px 0 0;height:2px;position:absolute;top:0;left:0;right:0}.audio-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.audio-file-info{flex:1;align-items:center;gap:12px;display:flex}.audio-icon-wrapper{color:#fff;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc4,#44a08d,#c534ed);border:1px solid #fff3;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:45px;height:45px;font-size:1.3rem;display:flex;box-shadow:0 8px 25px #4ecdc44d}.audio-title{-webkit-text-fill-color:transparent;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 2px 4px #0000001a;background:linear-gradient(135deg,#4ecdc4,#c534ed);-webkit-background-clip:text;background-clip:text;margin-bottom:4px;font-size:1.1rem;font-weight:600;overflow:hidden}.audio-meta{align-items:center;gap:8px;display:flex}.duration{color:#4ecdc4b3;font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-size:.85rem;font-weight:500}.btn-remove{color:#ef4444;cursor:pointer;background:#ef44441a;border:none;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;transition:all .2s;display:flex}.btn-remove:hover{background:#ef444433;transform:scale(1.05)}.audio-progress-section{-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc40d,#c534ed0d);border:1px solid #4ecdc41a;border-radius:12px;align-items:center;gap:12px;margin-bottom:20px;padding:8px 0;display:flex}.time-display{min-width:40px}.current-time,.total-time{color:#4ecdc4cc;font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-size:.8rem;font-weight:500}.progress-container{flex:1;position:relative}.progress-track{cursor:pointer;background:#ffffff1a;border-radius:2px;height:4px;transition:height .2s;position:relative}.progress-track:hover{height:6px}.progress-fill{background:linear-gradient(90deg,#4ecdc4,#44a08d);border-radius:2px;width:0%;height:100%;transition:width .1s;position:relative}.progress-thumb{cursor:pointer;opacity:0;background:#4ecdc4;border:2px solid #fffc;border-radius:50%;width:12px;height:12px;transition:all .2s;position:absolute;top:50%;right:100%;transform:translateY(-50%)translate(50%);box-shadow:0 2px 8px #4ecdc466}.progress-track:hover .progress-thumb{opacity:1}.progress-thumb:hover{transform:translateY(-50%)scale(1.2)}.btn-play-pause{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc4,#44a08d,#c534ed);border:2px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;font-size:1.3rem;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;box-shadow:0 8px 25px #4ecdc466}.btn-play-pause:hover{transform:scale(1.08);box-shadow:0 12px 30px #4ecdc480,0 0 20px #c534ed4d}.btn-play-pause:active{transform:scale(.95)}.btn-volume{color:#4ecdc4;cursor:pointer;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#4ecdc426,#c534ed1a);border:1px solid #4ecdc44d;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.1rem;transition:all .3s;display:flex}.btn-volume:hover{background:linear-gradient(135deg,#4ecdc440,#c534ed26);transform:scale(1.08);box-shadow:0 8px 20px #4ecdc44d}@media (max-width:768px){.modern-audio-player{padding:16px}.audio-header{margin-bottom:16px}.audio-icon{width:36px;height:36px;font-size:1rem}.audio-title{font-size:.9rem}.btn-remove{width:32px;height:32px;font-size:.9rem}.audio-progress-section{gap:10px;margin-bottom:16px}.current-time,.total-time{font-size:.75rem}.btn-play-pause{width:44px;height:44px;font-size:1.1rem}.btn-volume{width:36px;height:36px;font-size:.9rem}}@media (max-width:480px){.modern-audio-player{padding:14px}.audio-file-info{gap:10px}.audio-icon{width:32px;height:32px;font-size:.9rem}.audio-title{font-size:.85rem}.btn-remove{width:28px;height:28px;font-size:.8rem}.audio-progress-section{gap:8px}.time-display{min-width:35px}.btn-play-pause{width:40px;height:40px;font-size:1rem}.btn-volume{width:32px;height:32px;font-size:.85rem}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideIn{0%{opacity:0;transform:translate(-50%,-60%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.form-actions{flex-direction:column;justify-content:center;align-items:center;display:flex}.btn{cursor:pointer;-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ff6b9d,#4ecdc4,#c534ed);border:2px solid #fff3;border-radius:50px;justify-content:center;align-items:center;gap:10px;width:300px;min-width:140px;height:50px;margin-bottom:15px;padding:15px 30px;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 15px 35px #ff6b9d4d}.btn:before{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000);width:100%;height:100%;transition:left .6s;position:absolute;top:0;left:-100%}.btn:hover{transform:translateY(-5px)scale(1.02);box-shadow:0 20px 40px #ff6b9d66,0 0 25px #4ecdc44d}.btn:hover:before{left:100%}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-text{color:#fff;font-family:Orbitron,sans-serif;font-size:1rem;font-weight:600}.preview-galaxy-btn{cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;width:300px;min-width:140px;height:45px;margin-bottom:15px;padding:12px 24px;transition:all .3s;display:flex;position:relative;overflow:hidden}.preview-galaxy-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.preview-galaxy-btn:hover{background:linear-gradient(135deg,#44a08d,#4ecdc4);transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc466}.preview-galaxy-btn:hover:before{left:100%}.preview-galaxy-btn:active{transform:translateY(0);box-shadow:0 4px 15px #4ecdc44d}.preview-galaxy-btn:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.preview-galaxy-btn .btn-loading{animation:1s linear infinite spin}.preview-modal{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:1000;background:#000c;width:100%;height:100%;animation:.3s fadeIn;display:none;position:fixed;top:0;left:0}.preview-content{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#ffffff1a,#ffffff0d);border:1px solid #fff3;border-radius:20px;flex-direction:column;width:90%;max-width:1200px;height:85%;animation:.3s slideIn;display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.preview-header{background:#c534ed1a;border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:20px 25px;display:flex}.preview-title{align-items:center;gap:12px;display:flex}.preview-icon{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#c534ed,#4ecdc4);-webkit-background-clip:text;background-clip:text;font-size:1.5rem}.preview-title h3{color:#c534ed;margin:0;font-family:Orbitron,sans-serif;font-size:1.3rem;font-weight:700}.preview-controls{gap:10px;display:flex}.refresh-preview-btn,.fullscreen-preview-btn,.close-preview-btn{color:#4ecdc4;cursor:pointer;background:#ffffff1a;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.2rem;transition:all .3s;display:flex}.refresh-preview-btn:hover,.fullscreen-preview-btn:hover{background:#4ecdc433;transform:scale(1.1)}.close-preview-btn:hover{color:#ff6b6b;background:#ff6b6b33;transform:scale(1.1)}.refresh-preview-btn:active{transform:scale(1.1)rotate(180deg)}.preview-body{flex:1;position:relative;overflow:hidden}.preview-loading{text-align:center;color:#4ecdc4;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.loading-spinner{border:4px solid #4ecdc433;border-top-color:#4ecdc4;border-radius:50%;width:50px;height:50px;margin:0 auto 15px;animation:1s linear infinite spin}.preview-error{text-align:center;color:#ff6b6b;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.error-icon{margin-bottom:15px;font-size:3rem}.retry-preview-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#ff6b6b,#ff4757);border:none;border-radius:8px;margin-top:15px;padding:10px 20px;font-weight:600;transition:all .3s}.retry-preview-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #ff6b6b66}.preview-frame-container{width:100%;height:100%;position:relative}.preview-frame{border:none;border-radius:0 0 20px 20px;width:100%;height:100%}.preview-footer{background:#4ecdc40d;border-top:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:15px 25px;display:flex}.preview-info{color:#4ecdc4cc;align-items:center;gap:8px;font-size:.9rem;display:flex}.info-icon{font-size:1.1rem}.preview-actions{gap:12px;display:flex}.edit-preview-btn,.create-from-preview-btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:6px;padding:8px 16px;font-weight:600;transition:all .3s;display:flex}.edit-preview-btn{color:#4ecdc4;background:#ffffff1a;border:1px solid #4ecdc44d}.edit-preview-btn:hover{background:#4ecdc41a;transform:translateY(-1px)}.create-from-preview-btn{color:#fff;background:linear-gradient(135deg,#c534ed,#4ecdc4)}.create-from-preview-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #c534ed66}@media (max-width:768px){.preview-content{width:95%;height:90%}.preview-header{flex-direction:column;align-items:flex-start;gap:15px;padding:15px 20px}.preview-title h3{font-size:1.1rem}.preview-controls{align-self:flex-end}.refresh-preview-btn,.fullscreen-preview-btn,.close-preview-btn{width:35px;height:35px;font-size:1rem}.preview-footer{flex-direction:column;align-items:stretch;gap:12px;padding:12px 20px}.preview-info{justify-content:center;font-size:.8rem}.preview-actions{justify-content:center}.edit-preview-btn,.create-from-preview-btn{flex:1;justify-content:center;padding:10px 16px}.preview-galaxy-btn{min-width:120px;padding:10px 20px;font-size:.9rem}}@media (max-width:480px){.preview-content{border-radius:15px;width:98%;height:95%}.preview-header{padding:12px 15px}.preview-title{gap:8px}.preview-icon{font-size:1.2rem}.preview-title h3{font-size:1rem}.refresh-preview-btn,.fullscreen-preview-btn,.close-preview-btn{width:32px;height:32px;font-size:.9rem}.preview-footer{padding:10px 15px}.preview-info{font-size:.75rem}.edit-preview-btn,.create-from-preview-btn{padding:8px 12px;font-size:.85rem}.preview-galaxy-btn{min-width:100px;padding:8px 16px;font-size:.85rem}.loading-spinner{border-width:3px;width:40px;height:40px}.error-icon{font-size:2.5rem}}.success-icon{font-size:3rem;animation:2s infinite bounce}.sparkles span{font-size:1.5rem;animation:2s infinite sparkle;position:absolute}.sparkles span:first-child{animation-delay:0s;top:10%;left:20%}.sparkles span:nth-child(2){animation-delay:.5s;top:20%;right:15%}.sparkles span:nth-child(3){animation-delay:1s;bottom:20%;left:15%}.sparkles span:nth-child(4){animation-delay:1.5s;bottom:10%;right:20%}.result-header h3{color:#c534ed;text-align:center;margin:0;font-family:Orbitron,sans-serif;font-size:1.5rem;font-weight:700}.success-subtitle{color:#4ecdc4;text-align:center;opacity:.9;margin:.5rem 0 0;font-style:italic}.share-section{grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem;display:grid}@media (max-width:768px){.share-section{grid-template-columns:1fr;gap:1rem}}.share-link-section h3,.qr-section h3{color:#c534ed;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:1.1rem;display:flex}.copy-field input{color:#fff;background:#ffffff1a;border:2px solid #4ecdc44d;border-radius:8px;flex:1;padding:.75rem;font-family:monospace;font-size:.9rem}.copy-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:8px;align-items:center;gap:.5rem;padding:.75rem 1rem;font-weight:600;transition:all .3s;display:flex}.copy-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #4ecdc466}.qr-style-selector label{color:#4ecdc4;margin-bottom:.5rem;font-weight:600;display:block}.qr-style-options{flex-wrap:wrap;gap:.5rem;display:flex}.qr-style-option{cursor:pointer;background:#ffffff0d;border:2px solid #fff3;border-radius:8px;flex-direction:column;align-items:center;min-width:60px;padding:.5rem;transition:all .3s;display:flex}.qr-style-option:hover{border-color:#4ecdc4;transform:translateY(-2px)}.qr-style-option.selected{background:#c534ed33;border-color:#c534ed}.style-preview{margin-bottom:.25rem;font-size:1.5rem}.qr-style-option span{color:#fff;text-align:center;font-size:.8rem}@keyframes sparkle{0%,to{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1)}}.bi{font-size:inherit;vertical-align:middle;line-height:1}.tutorial-title .bi,.step-title .bi{color:#4ecdc4;margin-right:.5rem}.ai-toggle-icon .bi{font-size:2.5rem}.feature-tag .bi{margin-right:.25rem;font-size:.9em}.topic-btn .bi{margin-right:.5rem;font-size:1em}.performance-icon .bi{color:#4ecdc4}.btn-icon .bi{margin-right:.5rem;font-size:1.1em}.preview-icon .bi,.info-icon .bi{color:#4ecdc4;margin-right:.5rem}.usage-icon .bi{color:#c534ed;font-size:1.2rem}.suggestion-icon .bi{color:gold;font-size:1.2rem}.tutorial-btn:hover .bi,.enhance-btn:hover .bi,.topic-btn:hover .bi{transition:transform .2s;transform:scale(1.1)}.copy-btn:hover .bi{animation:.5s copyPulse}@keyframes copyPulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.social-btn .bi{margin-right:.5rem;font-size:1.1em}.qr-section h3 .bi,.share-link-section h3 .bi,.social-share h3 .bi{color:#c534ed;margin-right:.5rem}.download-qr-btn .bi,.view-galaxy-btn .bi,.create-new-btn .bi{margin-right:.5rem}.audio-icon{color:#fff!important}.btn-remove .bi{color:#ef4444}.btn-play-pause .bi,.btn-volume .bi{color:#fff}.refresh-preview-btn .bi,.fullscreen-preview-btn .bi{color:#4ecdc4}.close-preview-btn{color:#ff6b6b}.edit-preview-btn .bi{color:#4ecdc4;margin-right:.5rem}.create-from-preview-btn .bi{color:#fff;margin-right:.5rem}.back-btn .bi{margin-right:.5rem;transition:transform .3s}.back-btn:hover .bi{transform:translate(-3px)}.open-tutorial-btn .bi{margin-right:.5rem}@media (max-width:768px){.ai-toggle-icon .bi{font-size:2rem}.performance-icon .bi{font-size:1.5rem}.tutorial-title .bi,.step-title .bi{margin-right:.3rem}.btn-icon .bi{margin-right:.3rem;font-size:1em}}@media (max-width:480px){.ai-toggle-icon .bi{font-size:1.8rem}.performance-icon .bi{font-size:1.3rem}.feature-tag .bi,.topic-btn .bi{margin-right:.2rem;font-size:.9em}.social-btn .bi{margin-right:.3rem;font-size:1em}.textarea-info{flex-direction:column;align-items:flex-start;gap:.5rem}.textarea-counter,.textarea-warning{font-size:.8rem}}.btn-loading .bi,.loading-spinner{animation:1s linear infinite spin}.btn.loading{opacity:.8;cursor:not-allowed}.btn.loading .btn-loading{align-items:center;gap:.5rem;display:inline-flex!important}.btn.loading .btn-loading .bi{animation:1s linear infinite spin}.qr-display.loading{background:linear-gradient(45deg,#4ecdc41a 25%,#0000 25% 50%,#4ecdc41a 50% 75%,#0000 75%) 0 0/20px 20px;animation:1s linear infinite loading-stripes}@keyframes loading-stripes{0%{background-position:0 0}to{background-position:20px 20px}}.success-animation{animation:2s ease-in-out infinite successPulse}@keyframes successPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.btn:active,.copy-btn:active,.download-qr-btn:active{transition:transform .1s;transform:scale(.98)}.social-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #0000004d}.copy-btn:focus,.download-qr-btn:focus,.social-btn:focus,.qr-style-option:focus{outline-offset:2px;outline:2px solid #4ecdc4}.enhance-container.validation-warning{background:#ffa5021a;border:2px solid #ffa502}.enhance-container.validation-danger{background:#ff6b6b1a;border:2px solid #ff6b6b}.enhance-btn:disabled{opacity:.6;cursor:not-allowed;background:#666!important}.enhance-status.error{color:#ff6b6b;background:#ff6b6b1a;border:1px solid #ff6b6b4d;border-radius:8px;margin-top:10px;padding:10px}.enhance-status.success{color:#4ecdc4;background:#4ecdc41a;border:1px solid #4ecdc44d;border-radius:8px;margin-top:10px;padding:10px}.enhance-status.processing{color:#ffa502;background:#ffa5021a;border:1px solid #ffa5024d;border-radius:8px;margin-top:10px;padding:10px}.form-actions.validation-warning{background:#ffa5020d;border:2px solid #ffa502;border-radius:15px;padding:15px}.form-actions.validation-danger{background:#ff6b6b0d;border:2px solid #ff6b6b;border-radius:15px;padding:15px}#submitBtn.validation-warning{border-color:#ffa502;box-shadow:0 4px 15px #ffa50266;background:linear-gradient(135deg,#ffa502,#ff8c00)!important}#submitBtn.validation-warning:hover{transform:translateY(-2px);box-shadow:0 6px 20px #ffa50280;background:linear-gradient(135deg,#ff8c00,#ffa502)!important}#submitBtn.validation-danger{cursor:not-allowed;border-color:#ff6b6b;box-shadow:0 4px 15px #ff6b6b66;background:linear-gradient(135deg,#ff6b6b,#ff4757)!important}#submitBtn.validation-danger:hover{transform:none;box-shadow:0 4px 15px #ff6b6b66;background:linear-gradient(135deg,#ff6b6b,#ff4757)!important}#submitBtn:disabled{opacity:.7;cursor:not-allowed;transform:none!important}#submitBtn:disabled:hover{transform:none!important}#previewBtn.validation-warning{border-color:#ffa502;background:linear-gradient(135deg,#ffa502,#ff8c00)!important}#previewBtn.validation-danger{cursor:not-allowed;border-color:#ff6b6b;background:linear-gradient(135deg,#ff6b6b,#ff4757)!important}@media (max-width:768px){.form-actions.validation-warning,.form-actions.validation-danger{margin:10px 0;padding:10px}}*{transition:all .3s}button,.btn,a{transition:all .2s}.qr-display.error{background:#ff6b6b1a;border-color:#ff6b6b}.qr-display.error:after{content:"⚠️ Không thể tạo QR";color:#ff6b6b;font-size:1rem;font-weight:600}.result-modal{z-index:10000;box-sizing:border-box;background:#000c;width:100%;height:100%;padding:8px;display:none;position:fixed;top:0;left:0}.result-modal.show{animation:.3s ease-out modalFadeIn}.result-content{will-change:transform, opacity;background:#141e30f2;border:1px solid #4ecdc466;border-radius:20px;flex-direction:column;width:calc(100% - 16px);max-width:800px;max-height:calc(100vh - 16px);display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 20px 40px #0000004d}.result-content.show{animation:.3s ease-out modalSlideIn}@keyframes modalSlideIn{0%{opacity:0;transform:translate(-50%,-55%)scale(.9)}to{opacity:1;transform:translate(-50%,-50%)scale(1)}}.result-header{text-align:center;background:#c534ed1a;border-bottom:1px solid #ffffff1a;padding:20px 25px;position:relative}.success-animation{justify-content:center;align-items:center;margin-bottom:1rem;display:flex;position:relative}.success-icon{color:gold;font-size:3rem;animation:3s ease-in-out infinite gentleBounce}.sparkles{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.sparkles span{opacity:.8;font-size:1.2rem;animation:4s infinite gentleSparkle;position:absolute}.sparkles span:first-child{color:gold;animation-delay:0s;top:10%;left:20%}.sparkles span:nth-child(2){color:#4ecdc4;animation-delay:1s;top:20%;right:15%}.sparkles span:nth-child(3){color:#c534ed;animation-delay:2s;bottom:20%;left:15%}.sparkles span:nth-child(4){color:#ff6b6b;animation-delay:3s;bottom:10%;right:20%}.result-header h3{color:#c534ed;text-shadow:0 0 20px #c534ed80;-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#c534ed,#4ecdc4);-webkit-background-clip:text;background-clip:text;margin:0 0 .5rem;font-family:Orbitron,sans-serif;font-size:1.6rem;font-weight:700}.success-subtitle{color:#4ecdc4;opacity:.9;text-shadow:0 0 10px #4ecdc44d;margin:0;font-size:1rem;font-style:italic}.close-result-btn{color:#ff6b6b;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #ff6b6b4d;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.4rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;top:20px;right:20px}.close-result-btn:hover{background:#ff6b6b33;transform:scale(1.1)rotate(90deg);box-shadow:0 0 20px #ff6b6b66}.result-body{scrollbar-width:thin;scrollbar-color:#4ecdc480 transparent;flex:1;padding:30px;overflow-y:auto}.result-body::-webkit-scrollbar{width:6px}.result-body::-webkit-scrollbar-track{background:0 0}.result-body::-webkit-scrollbar-thumb{background:#4ecdc480;border-radius:3px}.result-body::-webkit-scrollbar-thumb:hover{background:#4ecdc4b3}.share-section{flex-direction:column;gap:1.5rem;margin-bottom:1.5rem;padding:0;display:flex}.share-link-section,.qr-section{background:#ffffff0d;border:1px solid #4ecdc433;border-radius:16px;padding:20px;transition:all .3s}.share-link-section:hover,.qr-section:hover{background:#ffffff14;border-color:#4ecdc466;transform:translateY(-2px)}.share-link-section h3,.qr-section h3{color:#c534ed;align-items:center;gap:.7rem;margin-bottom:1.2rem;font-size:1.1rem;font-weight:600;display:flex}.share-link-section h3 i,.qr-section h3 i{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#c534ed,#4ecdc4);-webkit-background-clip:text;background-clip:text;font-size:1.3rem}.copy-field{align-items:stretch;gap:.7rem;display:flex}.copy-field input{color:#4ecdc4;background:#ffffff1a;border:1px solid #4ecdc44d;border-radius:12px;outline:none;flex:1;padding:14px 16px;font-family:Courier New,monospace;font-size:.9rem;transition:all .3s}.copy-field input:focus{background:#ffffff26;border-color:#4ecdc4;box-shadow:0 0 15px #4ecdc44d}.copy-btn{color:#fff;cursor:pointer;white-space:nowrap;background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;min-width:100px;padding:14px 20px;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.copy-btn:hover{background:linear-gradient(135deg,#5fd4d4,#4ecdc4);transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc466}.copy-btn:active{transform:translateY(0)}.success-message{text-align:center;margin-bottom:25px}.success-icon{margin-bottom:15px;font-size:3rem;animation:1s ease-in-out bounce}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}.success-text{color:#4ecdc4;margin:0;font-size:1.2rem;font-weight:600}.share-section{margin:25px 0}.share-title{color:#c534ed;text-align:center;margin-bottom:15px;font-size:1.1rem;font-weight:600}.galaxy-link-container{gap:10px;margin-bottom:20px;display:flex}.galaxy-link-input{color:#4ecdc4;background:#ffffff1a;border:1px solid #4ecdc44d;border-radius:10px;outline:none;flex:1;padding:12px 15px;font-family:monospace;font-size:.9rem}.galaxy-link-input:focus{border-color:#4ecdc4;box-shadow:0 0 10px #4ecdc44d}.copy-link-btn{color:#fff;cursor:pointer;white-space:nowrap;background:linear-gradient(135deg,#4ecdc4,#44a08d);border:none;border-radius:10px;padding:12px 20px;font-weight:600;transition:all .3s}.copy-link-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #4ecdc466}.qr-section{text-align:center;margin:20px 0}.qr-container{text-align:center;background:#ffffffe6;border-radius:15px;margin-bottom:15px;padding:15px;display:inline-block}.form-label-enhanced{color:#4ecdc4;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:1.1rem;font-weight:700;display:flex}.form-label-enhanced i{color:#c534ed;font-size:1.2rem}.icon-selection-group{background:#ffffff05;border:1px solid #4ecdc41a;border-radius:15px;padding:1.5rem}.icon-selector-enhanced{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;margin-bottom:1rem;display:grid}.icon-option-enhanced{text-align:center;cursor:pointer;background:#ffffff0d;border:2px solid #ffffff1a;border-radius:12px;padding:1rem;transition:all .3s;position:relative;overflow:hidden}.icon-option-enhanced:hover{background:#4ecdc41a;border-color:#4ecdc4;transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc433}.icon-option-enhanced.selected{background:#c534ed26;border-color:#c534ed;box-shadow:0 8px 25px #c534ed4d}.icon-option-enhanced.selected:before{content:"";background:linear-gradient(90deg,#c534ed,#4ecdc4);height:3px;position:absolute;top:0;left:0;right:0}.icon-preview{margin-bottom:.5rem;font-size:1.5rem;line-height:1.2}.icon-label{color:#fffc;font-size:.85rem;font-weight:600}.custom-icon-input-container{margin-top:1rem}.custom-icon-input{color:#4ecdc4;background:#ffffff0d;border:2px solid #4ecdc44d;border-radius:10px;width:100%;padding:.8rem 1rem;font-family:Orbitron,sans-serif;font-size:.9rem;transition:all .3s}.custom-icon-input:focus{background:#ffffff14;border-color:#4ecdc4;outline:none;box-shadow:0 0 20px #4ecdc44d}.color-selection-group{background:#ffffff05;border:1px solid #4ecdc41a;border-radius:15px;padding:1.5rem}.color-picker-group-enhanced{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin-bottom:1rem;display:grid}.color-option-enhanced{background:#ffffff0d;border:2px solid #ffffff1a;border-radius:12px;padding:1rem;transition:all .3s}.color-option-enhanced:hover{background:#4ecdc40d;border-color:#4ecdc4;transform:translateY(-1px)}.color-option-header{align-items:center;gap:.5rem;margin-bottom:.8rem;display:flex}.color-icon{color:#c534ed;font-size:1.1rem}.color-option-header label{color:#ffffffe6;margin:0;font-size:.9rem;font-weight:600}.color-input-wrapper{align-items:center;gap:.8rem;display:flex}.color-preview{cursor:pointer;border:2px solid #fff3;border-radius:8px;width:40px;height:40px;transition:all .3s;position:relative;overflow:hidden}.color-preview:hover{border-color:#fff6;transform:scale(1.1)}.color-input{cursor:pointer;background:0 0;border:2px solid #fff3;border-radius:8px;outline:none;width:50px;height:40px;padding:0;transition:all .3s}.color-input:hover{border-color:#4ecdc4;box-shadow:0 0 10px #4ecdc44d}.color-input:focus{border-color:#c534ed;box-shadow:0 0 15px #c534ed66}.color-value{color:#ffffffb3;text-align:center;-webkit-user-select:none;user-select:none;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;min-width:70px;padding:.3rem .6rem;font-family:Courier New,monospace;font-size:.8rem;transition:all .3s}.color-value:hover{color:#4ecdc4;background:#4ecdc41a;border-color:#4ecdc44d;transform:translateY(-1px)}.qr-style-selector{margin-bottom:1.5rem}.qr-style-selector label{color:#4ecdc4;margin-bottom:.8rem;font-size:.95rem;font-weight:600;display:block}.qr-style-options{flex-wrap:wrap;justify-content:center;gap:.8rem;display:flex}.image-upload-group{background:#ffffff05;border:1px solid #4ecdc41a;border-radius:15px;padding:1.5rem}.image-upload-container{margin-bottom:1rem}.upload-area{text-align:center;cursor:pointer;background:#ffffff05;border:2px dashed #4ecdc44d;border-radius:12px;padding:2rem;transition:all .3s;position:relative;overflow:hidden}.upload-area:hover{background:#4ecdc40d;border-color:#4ecdc4;transform:translateY(-2px)}.upload-area.dragover{background:#c534ed1a;border-color:#c534ed;box-shadow:0 8px 25px #c534ed33}.upload-icon{color:#4ecdc4;opacity:.7;margin-bottom:1rem;font-size:3rem}.upload-text h2{color:#ffffffe6;margin-bottom:1rem;font-weight:600}.upload-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#c534ed);border:none;border-radius:8px;align-items:center;gap:.5rem;padding:.8rem 1.5rem;font-weight:600;transition:all .3s;display:inline-flex}.upload-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.upload-info{background:#ffffff08;border:1px solid #ffffff0d;border-radius:8px;margin-top:1rem;padding:1rem}.info-row{color:#ffffffb3;align-items:center;gap:.5rem;margin-bottom:.5rem;font-size:.85rem;display:flex}.info-row:last-child{margin-bottom:0}.info-row i{color:#4ecdc4;font-size:.9rem}.file-ext{color:#4ecdc4;background:#4ecdc433;border-radius:4px;padding:.2rem .4rem;font-size:.75rem;font-weight:600}.image-preview-container{flex-wrap:wrap;gap:1rem;min-height:0;margin-top:1rem;display:flex}.image-preview-container:empty{display:none}.input-hint{color:#fff9;background:#ffffff05;border-left:3px solid #4ecdc44d;border-radius:6px;align-items:center;gap:.5rem;margin-top:.5rem;padding:.5rem .8rem;font-size:.85rem;display:flex}.input-hint i{color:#4ecdc4;font-size:.9rem}.galaxy-id-group{background:#ffffff05;border:1px solid #4ecdc41a;border-radius:15px;margin-bottom:1.5rem;padding:1.5rem}.galaxy-id-container{margin-bottom:1rem}.galaxy-id-input-wrapper{align-items:center;gap:.8rem;margin-bottom:1rem;display:flex}.url-preview{background:#ffffff0d;border:2px solid #4ecdc44d;border-radius:10px;flex:1;align-items:center;padding:.8rem 1rem;transition:all .3s;display:flex;overflow:hidden}.url-preview:focus-within{background:#ffffff14;border-color:#4ecdc4;box-shadow:0 0 20px #4ecdc44d}.url-base{color:#fff9;white-space:nowrap;margin-right:0;font-family:Courier New,monospace;font-size:.9rem}.galaxy-id-input{color:#4ecdc4;background:0 0;border:none;outline:none;flex:1;min-width:0;font-family:Courier New,monospace;font-size:.9rem;font-weight:600}.galaxy-id-input::placeholder{color:#4ecdc480;font-style:italic}.check-id-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#c534ed);border:none;border-radius:8px;justify-content:center;align-items:center;min-width:45px;height:45px;padding:.8rem 1rem;transition:all .3s;display:flex}.check-id-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.check-id-btn:disabled{cursor:not-allowed;box-shadow:none;background:#ffffff1a;transform:none}.galaxy-id-status{align-items:center;min-height:40px;display:flex}.status-message{border-radius:8px;align-items:center;gap:.5rem;padding:.6rem 1rem;font-size:.85rem;transition:all .3s;display:flex}.status-message.info{color:#4ecdc4;background:#4ecdc41a;border:1px solid #4ecdc44d}.status-message.success{color:#28a745;background:#28a7451a;border:1px solid #28a7454d}.status-message.error{color:#dc3545;background:#dc35451a;border:1px solid #dc35454d}.status-message.warning{color:#ffc107;background:#ffc1071a;border:1px solid #ffc1074d}.status-message.checking{color:#c534ed;background:#c534ed1a;border:1px solid #c534ed4d}.status-message i{font-size:1rem}.status-message .spinner{border:2px solid #c534ed4d;border-top-color:#c534ed;border-radius:50%;width:16px;height:16px;animation:1s linear infinite spin}.messages-group{background:#ffffff05;border:1px solid #4ecdc41a;border-radius:15px;margin-bottom:1.5rem;padding:1.5rem}.messages-container{position:relative}.textarea-wrapper{margin-bottom:1rem;position:relative}.textarea-wrapper textarea{color:#fff;resize:vertical;background:#ffffff0d;border:2px solid #4ecdc44d;border-radius:12px;width:100%;min-height:120px;padding:1rem;font-size:.95rem;line-height:1.5;transition:all .3s}.textarea-wrapper textarea:focus{background:#ffffff14;border-color:#4ecdc4;outline:none;box-shadow:0 0 20px #4ecdc44d}.textarea-overlay{pointer-events:none;opacity:0;transition:opacity .3s;position:absolute;top:1rem;right:1rem}.textarea-wrapper:hover .textarea-overlay{opacity:1}.writing-tips{color:#4ecdc4;background:#4ecdc41a;border:1px solid #4ecdc44d;border-radius:8px;align-items:center;gap:.5rem;padding:.5rem .8rem;font-size:.8rem;display:flex}.messages-stats{flex-wrap:wrap;gap:1rem;margin-bottom:1rem;display:flex}.stat-item{background:#ffffff0d;border:1px solid #4ecdc433;border-radius:8px;align-items:center;gap:.5rem;padding:.6rem 1rem;font-size:.85rem;transition:all .3s;display:flex}.stat-item i{color:#4ecdc4;font-size:1rem}.stat-label{color:#ffffffb3;font-weight:500}.stat-value{color:#4ecdc4;font-weight:600}.stat-max{color:#ffffff80;font-size:.8rem}.quality-indicator.good{border-color:#28a7454d}.quality-indicator.good i,.quality-indicator.good .stat-value{color:#28a745}.quality-indicator.warning{border-color:#ffc1074d}.quality-indicator.warning i,.quality-indicator.warning .stat-value{color:#ffc107}.quality-indicator.error{border-color:#dc35454d}.quality-indicator.error i,.quality-indicator.error .stat-value{color:#dc3545}.messages-hints{flex-wrap:wrap;gap:1rem;display:flex}.hint-item{color:#ffffffb3;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.hint-item i{color:#4ecdc4;font-size:.9rem}.song-selection-group{background:#ffffff05;border:1px solid #4ecdc41a;border-radius:15px;margin-bottom:1.5rem;padding:1.5rem}.audio-type-tabs{background:#ffffff0d;border-radius:10px;gap:.3rem;padding:.3rem;display:flex}.audio-type-tab{color:#ffffffb3;cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.8rem 1rem;font-size:.9rem;font-weight:500;transition:all .3s;display:flex}.audio-type-tab:hover:not(.active){color:#fff;background:#ffffff1a}.tab-text{font-weight:600}.tab-badge{background:#fff3;border-radius:12px;padding:.2rem .5rem;font-size:.75rem;font-weight:500}.audio-type-tab.active .tab-badge{background:#ffffff4d}.song-selector-enhanced{align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.song-dropdown-wrapper{flex:1;position:relative}.song-select-enhanced{color:#fff;cursor:pointer;-webkit-appearance:none;appearance:none;background:#ffffff0d;border:2px solid #4ecdc44d;border-radius:10px;width:100%;padding:.8rem 3rem .8rem 1rem;font-size:.9rem;transition:all .3s}.song-select-enhanced:focus{border-color:#4ecdc4;outline:none;box-shadow:0 0 20px #4ecdc44d}.song-select-enhanced option{color:#fff;background:#1a1a2e;padding:.5rem}.song-dropdown-icon{color:#4ecdc4;pointer-events:none;transition:transform .3s;position:absolute;top:50%;right:1rem;transform:translateY(-50%)}.song-dropdown-wrapper:hover .song-dropdown-icon{transform:translateY(-50%)rotate(180deg)}.song-preview-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#c534ed);border:none;border-radius:8px;justify-content:center;align-items:center;gap:.5rem;min-width:120px;padding:.8rem 1.2rem;font-size:.9rem;font-weight:600;transition:all .3s;display:flex}.song-preview-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.song-preview-btn:disabled{cursor:not-allowed;box-shadow:none;background:#ffffff1a;transform:none}.song-info{background:#4ecdc41a;border:1px solid #4ecdc44d;border-radius:8px;margin-top:1rem;padding:.8rem 1rem}.song-details{color:#4ecdc4;align-items:center;gap:.5rem;font-size:.9rem;font-weight:500;display:flex}.song-upload-area{text-align:center;background:#ffffff08;border:2px dashed #4ecdc44d;border-radius:12px;padding:1.5rem;transition:all .3s}.song-upload-area:hover{background:#ffffff0d;border-color:#4ecdc4}.upload-zone{margin-bottom:1rem}.upload-icon{color:#4ecdc4;margin-bottom:1rem;font-size:3rem}.upload-content h2{color:#fff;margin-bottom:.5rem;font-weight:600}.upload-content p{color:#ffffffb3;margin-bottom:1rem}.upload-file-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#c534ed);border:none;border-radius:8px;align-items:center;gap:.5rem;padding:.8rem 1.5rem;font-weight:600;transition:all .3s;display:inline-flex}.upload-file-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.upload-info{flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:1rem;display:flex}.info-item{color:#ffffffb3;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.info-item i{color:#4ecdc4}.upload-status{text-align:center;border-radius:8px;margin-top:1rem;padding:.8rem;font-size:.9rem}.upload-status.success{color:#28a745;background:#28a7451a;border:1px solid #28a7454d}.upload-status.error{color:#dc3545;background:#dc35451a;border:1px solid #dc35454d}.upload-status.processing{color:#4ecdc4;background:#4ecdc41a;border:1px solid #4ecdc44d}.hidden-file-input{display:none}.modern-audio-player{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff05;border:1px solid #4ecdc433;border-radius:15px;margin-top:1rem;padding:1.5rem}.audio-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.audio-file-info{flex:1;align-items:center;gap:1rem;min-width:0;display:flex}.audio-icon-wrapper{background:linear-gradient(135deg,#4ecdc4,#c534ed);border-radius:12px;justify-content:center;align-items:center;min-width:48px;height:48px;padding:.8rem;display:flex}.audio-icon{color:#fff;font-size:1.2rem}.audio-details{flex:1;min-width:0}.audio-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;margin-bottom:.3rem;font-size:1rem;font-weight:600;overflow:hidden}.audio-meta{color:#ffffffb3;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.audio-source{color:#4ecdc4;font-weight:500}.meta-separator{color:#fff6}.duration{color:#fffc;font-family:Courier New,monospace}.audio-actions{gap:.5rem;display:flex}.btn-change,.btn-remove{color:#fffc;cursor:pointer;background:#ffffff1a;border:1px solid #fff3;border-radius:8px;justify-content:center;align-items:center;min-width:36px;height:36px;padding:.6rem;transition:all .3s;display:flex}.btn-change:hover{color:#4ecdc4;background:#4ecdc433;border-color:#4ecdc4;transform:translateY(-1px)}.btn-remove:hover{color:#dc3545;background:#dc354533;border-color:#dc3545;transform:translateY(-1px)}.audio-progress-section{align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.time-display{color:#fffc;min-width:40px;font-family:Courier New,monospace;font-size:.85rem}.progress-container{cursor:pointer;background:#ffffff1a;border-radius:3px;flex:1;height:6px;position:relative}.progress-track{border-radius:3px;width:100%;height:100%;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#4ecdc4,#c534ed);border-radius:3px;width:0%;height:100%;transition:width .1s}.progress-thumb{opacity:0;background:#fff;border-radius:50%;width:12px;height:12px;transition:left .1s;position:absolute;top:50%;left:0%;transform:translateY(-50%);box-shadow:0 2px 8px #0000004d}.progress-container:hover .progress-thumb{opacity:1;transform:translateY(-50%)translate(50%)scale(1.2)}.progress-container.dragging .progress-thumb{opacity:1;transform:translateY(-50%)translate(50%)scale(1.3);box-shadow:0 4px 15px #4ecdc499}.progress-container.dragging{cursor:grabbing}.progress-track{cursor:pointer}.progress-track:hover{background:#ffffff26}.audio-controls{justify-content:center;align-items:center;gap:1rem;display:flex}.btn-play-pause,.btn-volume{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4,#c534ed);border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.2rem;transition:all .3s;display:flex}.btn-play-pause:hover,.btn-volume:hover{transform:scale(1.1);box-shadow:0 8px 25px #4ecdc466}.btn-volume{width:40px;height:40px;font-size:1rem}.qr-style-option{cursor:pointer;text-align:center;background:#ffffff0d;border:2px solid #4ecdc433;border-radius:12px;flex-direction:column;align-items:center;gap:.4rem;min-width:70px;padding:.8rem;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.qr-style-option:hover{border-color:#4ecdc480;transform:translateY(-3px);box-shadow:0 8px 20px #0003}.qr-style-option.selected{background:#4ecdc426;border-color:#4ecdc4;transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.style-preview{font-size:1.8rem;transition:transform .3s}.qr-style-option:hover .style-preview{transform:scale(1.2)}.qr-style-option span{color:#4ecdc4;font-size:.8rem;font-weight:500}.qr-display{background:#fffffff2;border:2px dashed #4ecdc44d;border-radius:12px;justify-content:center;align-items:center;min-height:200px;margin-bottom:1.2rem;transition:all .3s;display:flex;position:relative;overflow:hidden}.qr-display.style-heart{background:linear-gradient(45deg,#ffb6c14d,#ff69b433);border-color:#ff69b480}.qr-display.style-star{background:linear-gradient(45deg,#ffd7004d,#ff8c0033);border-color:#ffd70080}.qr-display.style-flower{background:linear-gradient(45deg,#ffb6c14d,#ff149333);border-color:#ff149380}.qr-display.style-gift{background:linear-gradient(45deg,#ff63474d,#ff450033);border-color:#ff634780}.qr-display.style-cosmic{background:linear-gradient(45deg,#4ecdc44d,#c534ed33);border-color:#4ecdc480}.qr-display .qr-container{border-radius:12px;justify-content:center;align-items:center;padding:15px;transition:all .3s;display:flex;position:relative}.qr-display.style-heart .qr-container{background:radial-gradient(circle at 20% 20%,#ffb6c14d 0%,#0000 50%),radial-gradient(circle at 80% 80%,#ff69b433 0%,#0000 50%),radial-gradient(circle at 40% 70%,#ff14931a 0%,#0000 50%);border:1px solid #ff69b44d}.qr-display.style-star .qr-container{background:radial-gradient(circle at 25% 25%,#ffd7004d 0%,#0000 50%),radial-gradient(circle at 75% 75%,#ff8c0033 0%,#0000 50%),radial-gradient(circle,#ffc1071a 0%,#0000 50%);border:1px solid #ffd7004d}.qr-display.style-flower .qr-container{background:radial-gradient(circle at 30% 30%,#ffb6c14d 0%,#0000 50%),radial-gradient(circle at 70% 70%,#ff149333 0%,#0000 50%),radial-gradient(circle at 50% 20%,#db70931a 0%,#0000 50%);border:1px solid #ff14934d}.qr-display.style-gift .qr-container{background:radial-gradient(circle at 20% 80%,#ff63474d 0%,#0000 50%),radial-gradient(circle at 80% 20%,#ff450033 0%,#0000 50%),radial-gradient(circle at 60% 60%,#ff8c001a 0%,#0000 50%);border:1px solid #ff63474d}.qr-display.style-cosmic .qr-container{background:radial-gradient(circle at 25% 75%,#4ecdc44d 0%,#0000 50%),radial-gradient(circle at 75% 25%,#c534ed33 0%,#0000 50%),radial-gradient(circle,#8a80d81a 0%,#0000 50%);border:1px solid #4ecdc44d}.qr-display:hover .qr-container{transform:scale(1.02);box-shadow:0 8px 25px #00000026}.qr-display.style-heart:hover .qr-container{box-shadow:0 8px 25px #ff69b44d}.qr-display.style-star:hover .qr-container{box-shadow:0 8px 25px #ffd7004d}.qr-display.style-flower:hover .qr-container{box-shadow:0 8px 25px #ff14934d}.qr-display.style-gift:hover .qr-container{box-shadow:0 8px 25px #ff63474d}.qr-display.style-cosmic:hover .qr-container{box-shadow:0 8px 25px #4ecdc44d}.qr-display canvas{border-radius:8px;box-shadow:0 4px 15px #0003}.qr-display:after{content:attr(data-style-icon);z-index:10;pointer-events:none;text-align:center;vertical-align:middle;font-variant-emoji:emoji;background:#fffffff2;border:1px solid #0000001a;border-radius:8px;justify-content:center;align-items:center;width:36px;height:32px;margin:0;padding:0;font-family:Apple Color Emoji,Segoe UI Emoji,Noto Color Emoji,sans-serif;font-size:1.4rem;font-style:normal;font-weight:400;line-height:1;text-decoration:none;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 3px 12px #0000004d}.qr-display.style-heart:after{background:linear-gradient(135deg,#fffffffa,#ffb6c11a);border:1px solid #ff69b44d;border-radius:12px}.qr-display.style-star:after{background:linear-gradient(135deg,#fffffffa,#ffd7001a);border:1px solid #ffd70066;border-radius:6px}.qr-display.style-flower:after{background:linear-gradient(135deg,#fffffffa,#ff14931a);border:1px solid #ff14934d;border-radius:50% 10px}.qr-display.style-gift:after{background:linear-gradient(135deg,#fffffffa,#ff63471a);border:1px solid #ff634766;border-radius:4px}.qr-display.style-cosmic:after{background:linear-gradient(135deg,#fffffffa,#4ecdc41a);border:1px solid #4ecdc466;border-radius:10px}.download-qr-btn{color:#4ecdc4;cursor:pointer;background:#ffffff1a;border:1px solid #4ecdc44d;border-radius:12px;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:12px 24px;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.download-qr-btn:hover{background:#4ecdc426;border-color:#4ecdc480;transform:translateY(-2px);box-shadow:0 5px 15px #4ecdc44d}.result-actions{background:linear-gradient(135deg,#4ecdc414,#c534ed0d);border-top:1px solid #ffffff26;justify-content:center;gap:1rem;padding:25px 30px;display:flex}.view-galaxy-btn,.create-new-btn{cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;gap:.7rem;min-width:160px;padding:14px 28px;font-size:1rem;font-weight:600;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative;overflow:hidden}.view-galaxy-btn:before,.create-new-btn:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.view-galaxy-btn:hover:before,.create-new-btn:hover:before{left:100%}.view-galaxy-btn{color:#fff;background:linear-gradient(135deg,#c534ed,#4ecdc4);box-shadow:0 4px 15px #c534ed4d}.view-galaxy-btn:hover{background:linear-gradient(135deg,#d645ff,#5fd4d4);transform:translateY(-3px);box-shadow:0 8px 30px #c534ed80}.create-new-btn{color:#4ecdc4;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:2px solid #4ecdc466}.create-new-btn:hover{background:#4ecdc426;border-color:#4ecdc499;transform:translateY(-3px);box-shadow:0 8px 25px #4ecdc466}@keyframes gentleBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes gentleSparkle{0%,to{opacity:0;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}@media (max-width:768px){.result-modal{align-items:flex-start;padding:20px 8px 8px}.result-content{border-radius:16px;width:100%;max-width:none;max-height:calc(100vh - 40px);margin:0 auto;position:relative;top:auto;left:auto;overflow-y:auto;transform:none}.result-header{padding:15px 20px}.result-header h3{margin-bottom:.3rem;font-size:1.3rem}.success-subtitle{font-size:.85rem}.success-icon{font-size:2.5rem}.sparkles span{font-size:1rem}.close-result-btn{width:36px;height:36px;font-size:1.1rem;top:12px;right:12px}.result-body{padding:15px 20px}.share-link-section,.qr-section{margin-bottom:1rem;padding:15px}.copy-field{flex-direction:column;gap:.6rem}.copy-field input{padding:10px 12px;font-size:.8rem}.copy-btn{width:100%;padding:10px 16px;font-size:.9rem}.qr-style-options{justify-content:center;gap:.5rem}.qr-style-option{min-width:55px;padding:.5rem}.style-preview{font-size:1.3rem}.qr-style-option span{font-size:.7rem}.qr-display{min-height:160px}.qr-display:after{border-radius:6px;width:32px;height:28px;font-size:1.2rem}.qr-display .qr-container{padding:12px}.result-actions{flex-direction:column;gap:.6rem;padding:15px 20px}.view-galaxy-btn,.create-new-btn{width:100%;padding:12px 20px;font-size:.9rem}}@media (max-width:480px){.result-modal{padding:10px 4px 4px}.result-content{border-radius:12px;width:100%;max-height:calc(100vh - 20px);font-size:14px}.share-section{gap:16px}.qr-style-options{grid-template-columns:repeat(3,1fr);gap:8px}.qr-style-option{padding:8px 4px;font-size:.75rem}.style-preview{margin-bottom:2px;font-size:1.2rem}.qr-container{padding:12px}.result-actions{flex-direction:column;gap:12px;padding:16px}.view-galaxy-btn,.create-new-btn{width:100%;padding:12px;font-size:.9rem}.result-header{padding:12px 16px}.result-header h3{margin-bottom:.2rem;font-size:1.1rem}.success-subtitle{font-size:.75rem}.success-icon{font-size:2rem}.sparkles span{font-size:.9rem}.close-result-btn{width:32px;height:32px;font-size:1rem;top:10px;right:10px}.result-body{padding:12px 16px}.share-link-section,.qr-section{margin-bottom:.8rem;padding:12px}.share-link-section h3,.qr-section h3{margin-bottom:.8rem;font-size:.9rem}.copy-field input{padding:8px 10px;font-size:.75rem}.copy-btn{padding:8px 14px;font-size:.8rem}.qr-style-options{gap:.3rem}.qr-style-option{min-width:45px;padding:.4rem}.style-preview{font-size:1.1rem}.qr-style-option span{font-size:.65rem}.qr-display{min-height:140px}.qr-display:after{border-radius:5px;width:28px;height:24px;font-size:1rem}.qr-display .qr-container{padding:10px}.download-qr-btn{padding:8px 16px;font-size:.8rem}.result-actions{gap:.5rem;padding:12px 16px}.view-galaxy-btn,.create-new-btn{padding:10px 18px;font-size:.8rem}}.performance-selector,.fall-speed-selector{grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:1rem;margin-bottom:1.5rem;display:grid}@media (max-width:480px){.performance-selector,.fall-speed-selector{grid-template-columns:1fr;gap:.8rem;margin-top:.8rem;margin-bottom:1rem}}@media (min-width:481px) and (max-width:768px){.performance-selector,.fall-speed-selector{grid-template-columns:repeat(2,1fr);gap:1rem}}.performance-option,.fall-speed-option{cursor:pointer;-webkit-backdrop-filter:blur(10px);text-align:center;background:linear-gradient(135deg,#ffffff14,#ffffff05);border:2px solid #4ecdc44d;border-radius:16px;padding:1.5rem;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}@media (max-width:768px){.performance-option,.fall-speed-option{-webkit-backdrop-filter:blur(5px);transition:all .2s}.performance-option:hover,.fall-speed-option:hover{transform:translateY(-2px)scale(1.01);box-shadow:0 6px 20px #4ecdc433}.performance-option.selected,.fall-speed-option.selected{transform:translateY(-2px)scale(1.01);box-shadow:0 8px 25px #4ecdc44d}}@media (max-width:480px){.performance-option,.fall-speed-option{text-align:left;border-radius:12px;align-items:center;gap:1rem;padding:1rem;display:flex}.performance-option{text-align:center;flex-direction:column}.fall-speed-option{flex-direction:row}}@media (min-width:481px) and (max-width:768px){.performance-option,.fall-speed-option{border-radius:14px;padding:1.2rem}}.performance-option:before,.fall-speed-option:before{content:"";opacity:0;z-index:-1;background:linear-gradient(135deg,#4ecdc41a,#c534ed1a);transition:opacity .3s;position:absolute;top:0;bottom:0;left:0;right:0}.performance-option:hover,.fall-speed-option:hover{background:linear-gradient(135deg,#ffffff1f,#ffffff0f);border-color:#4ecdc499;transform:translateY(-4px)scale(1.02);box-shadow:0 12px 40px #0003,0 0 20px #4ecdc44d}.performance-option:hover:before,.fall-speed-option:hover:before{opacity:1}.performance-option.selected,.fall-speed-option.selected{background:linear-gradient(135deg,#4ecdc433,#c534ed1a);border-color:#4ecdc4;transform:translateY(-5px)scale(1.03);box-shadow:0 15px 50px #4ecdc466,0 0 30px #4ecdc44d}.performance-option.selected:before,.fall-speed-option.selected:before{opacity:1}.performance-icon,.fall-speed-option .speed-icon{justify-content:center;align-items:center;height:70px;margin-bottom:1rem;font-size:2.8rem;display:flex}@media (max-width:480px){.performance-icon,.fall-speed-option .speed-icon{flex-shrink:0;height:50px;margin-bottom:.8rem;font-size:2.2rem}.fall-speed-option .speed-icon{width:50px;margin-bottom:0;margin-right:.5rem}}@media (min-width:481px) and (max-width:768px){.performance-icon,.fall-speed-option .speed-icon{height:60px;margin-bottom:.8rem;font-size:2.4rem}}.performance-icon,.fall-speed-option .speed-icon i{background:linear-gradient(135deg,#4ecdc4,#c534ed);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px #0000004d);-webkit-background-clip:text;background-clip:text;transition:all .3s}.performance-option:hover .performance-icon,.fall-speed-option:hover .speed-icon i{filter:drop-shadow(0 4px 8px #4ecdc480);transform:scale(1.1)rotate(5deg)}.performance-option.selected .performance-icon,.fall-speed-option.selected .speed-icon i{filter:drop-shadow(0 6px 12px #4ecdc499);transform:scale(1.15)}.performance-option h2,.fall-speed-option h2{color:#c534ed;text-shadow:0 2px 4px #0000004d;margin:0 0 .8rem;font-size:1.2rem;font-weight:700;transition:all .3s}@media (max-width:480px){.performance-option h2,.fall-speed-option h2{margin:0 0 .5rem;font-size:1rem}.fall-speed-option h2{flex:1;margin:0}}@media (min-width:481px) and (max-width:768px){.performance-option h2,.fall-speed-option h2{margin:0 0 .6rem;font-size:1.1rem}}.performance-option:hover h2,.fall-speed-option:hover h2{color:#4ecdc4;transform:translateY(-2px)}.performance-option.selected h2,.fall-speed-option.selected h2{color:#4ecdc4;text-shadow:0 0 10px #4ecdc480}.performance-option p,.fall-speed-option p{color:#fffc;margin:0 0 1rem;font-size:.95rem;line-height:1.4;transition:all .3s}@media (max-width:480px){.performance-option p,.fall-speed-option p{margin:0 0 .5rem;font-size:.85rem;line-height:1.3}.fall-speed-option p{margin:0;font-size:.8rem}}@media (min-width:481px) and (max-width:768px){.performance-option p,.fall-speed-option p{margin:0 0 .8rem;font-size:.9rem}}.performance-option:hover p,.fall-speed-option:hover p{color:#fffffff2;transform:translateY(-1px)}.performance-option.selected p,.fall-speed-option.selected p{color:#fff;text-shadow:0 1px 2px #0000004d}.speed-demo{background:linear-gradient(#ffffff14,#fff0),#0000003d;border:1px solid #ffffff14;border-radius:10px;height:50px;margin-top:.5rem;position:relative;overflow:hidden;box-shadow:inset 0 0 18px #4ecdc414}.demo-particle{--fall-demo-duration:2s;--fall-demo-primary:#4ecdc4;--fall-demo-secondary:#c534ed;position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden}.demo-particle:before,.demo-particle:after{content:"";background:linear-gradient(135deg, var(--fall-demo-primary), var(--fall-demo-secondary));filter:drop-shadow(0 0 8px #4ecdc4bf);width:10px;height:10px;animation:particleFall var(--fall-demo-duration) infinite linear;will-change:transform, opacity;border-radius:999px;position:absolute;top:-14px;left:24%;box-shadow:46px -22px 0 -2px #4ecdc4db,92px -8px 0 -3px #c534edcc,132px -28px 0 -2px #ffffffc2,-34px -16px 0 -3px #4ecdc4b3}.demo-particle:after{width:8px;height:8px;animation-delay:calc(var(--fall-demo-duration) * -.48);opacity:.86;left:64%}.demo-particle.slow{--fall-demo-duration:3.1s}.demo-particle.normal{--fall-demo-duration:2s}.demo-particle.fast{--fall-demo-duration:1.05s;--fall-demo-primary:#74f7ff;--fall-demo-secondary:#d73dff}@keyframes particleFall{0%{opacity:0;transform:translate(-50%,-14px)}12%{opacity:1}82%{opacity:1}to{opacity:.2;transform:translate(-50%,66px)}}@media (prefers-reduced-motion:reduce){.demo-particle:before,.demo-particle:after{opacity:1;animation:none;top:50%;transform:translate(-50%,-50%)}}@media (max-width:480px){.fall-speed-option{gap:.8rem;padding:.8rem}.fall-speed-option h2{font-size:.9rem}.fall-speed-option p{font-size:.75rem}.fall-speed-option .speed-demo{width:50px;height:25px}}@media (max-width:768px) and (pointer:coarse){.qr-style-option,.copy-btn,.download-qr-btn,.view-galaxy-btn,.create-new-btn,.close-result-btn,.fall-speed-option{min-width:44px;min-height:44px}.qr-style-option{padding:.8rem}.copy-btn,.download-qr-btn{padding:14px 20px}}.audio-type-selector{margin-bottom:1rem}.audio-type-tabs{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:12px;padding:4px;display:flex}.audio-type-tab{color:#ffffffb3;cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.9rem;transition:all .3s;display:flex}.audio-type-tab:hover{color:#ffffffe6;background:#ffffff1a}.audio-type-tab.active{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);box-shadow:0 4px 15px #667eea4d}.audio-section{margin-top:1rem}.link-input-container{align-items:center;gap:.5rem;display:flex}.link-input{color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border:1px solid #fff3;border-radius:8px;flex:1;padding:.75rem 1rem;font-size:.9rem;transition:all .3s}.link-input:focus{border-color:#4ecdc4;outline:none;box-shadow:0 0 0 3px #4ecdc433}.link-input::placeholder{color:#ffffff80}.parse-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4ecdc4 0%,#44a08d 100%);border:none;border-radius:8px;justify-content:center;align-items:center;min-width:44px;padding:.75rem;transition:all .3s;display:flex}.parse-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4ecdc44d}.parse-btn:active{transform:translateY(0)}.link-examples{background:#ffffff0d;border-left:3px solid #4ecdc4;border-radius:8px;padding:.75rem}@media (max-width:768px){.audio-type-tabs{flex-direction:column;gap:4px}.audio-type-tab{padding:.6rem;font-size:.85rem}.link-input-container{flex-direction:column;gap:.75rem}.parse-btn{width:100%;padding:.75rem 1rem}}.text-size-configuration{margin-top:15px;margin-bottom:15px}.text-size-card{background:linear-gradient(135deg,#ff6b9d1a,#4ecdc41a);border:1px solid #ff6b9d4d;border-radius:16px;padding:20px;transition:all .3s;position:relative;overflow:hidden}.text-size-card:before{content:"";opacity:0;background:linear-gradient(90deg,#ff6b9d,#4ecdc4,#c534ed);height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.text-size-card:hover{border-color:#ff6b9d;transform:translateY(-2px);box-shadow:0 8px 25px #ff6b9d33}.text-size-card:hover:before{opacity:1}.text-size-header{align-items:center;margin-bottom:20px;display:flex}.text-size-info{flex:1;align-items:center;gap:15px;display:flex}.text-size-icon{-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px #ff6b9d4d);background:linear-gradient(135deg,#ff6b9d,#4ecdc4);-webkit-background-clip:text;background-clip:text;font-size:2.5rem}.text-size-content{flex:1}.text-size-title{color:#ff6b9d;margin:0 0 5px;font-family:Orbitron,sans-serif;font-size:1.2rem;font-weight:700}.text-size-description{color:#4ecdc4cc;margin:0;font-size:.9rem;line-height:1.4}.text-size-controls{flex-direction:column;gap:20px;display:flex}.text-size-options{grid-template-columns:1fr 1fr;gap:15px;display:grid}.text-size-option{cursor:pointer;-webkit-user-select:none;user-select:none;position:relative}.text-size-option input[type=radio]{opacity:0;width:0;height:0;position:absolute}.option-content{text-align:center;background:#ffffff0d;border:2px solid #ff6b9d33;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:15px;transition:all .3s;display:flex}.option-content i{color:#ff6b9d;margin-bottom:5px;font-size:1.5rem}.option-text{color:#fff;font-size:1rem;font-weight:600}.option-desc{color:#fff9;font-size:.8rem;line-height:1.3}.text-size-option input[type=radio]:checked+.option-content{background:#ff6b9d26;border-color:#ff6b9d;box-shadow:0 4px 15px #ff6b9d33}.text-size-option input[type=radio]:checked+.option-content i{color:#ff6b9d;text-shadow:0 0 10px #ff6b9d80}.text-size-option:hover .option-content{border-color:#ff6b9d80;transform:translateY(-2px)}.custom-size-control{background:#ffffff08;border:1px solid #ff6b9d1a;border-radius:12px;padding:20px}.size-slider-container{flex-direction:column;gap:15px;display:flex}.size-label{color:#ff6b9d;align-items:center;gap:8px;font-size:1rem;font-weight:600;display:flex}.size-label i{font-size:1.2rem}.slider-wrapper{position:relative}.size-slider{-webkit-appearance:none;appearance:none;cursor:pointer;background:#ffffff1a;border-radius:3px;outline:none;width:100%;height:6px}.size-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:pointer;background:linear-gradient(135deg,#ff6b9d,#4ecdc4);border-radius:50%;width:20px;height:20px;transition:all .3s;box-shadow:0 2px 8px #ff6b9d4d}.size-slider::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 4px 15px #ff6b9d80}.size-slider::-moz-range-thumb{cursor:pointer;background:linear-gradient(135deg,#ff6b9d,#4ecdc4);border:none;border-radius:50%;width:20px;height:20px;transition:all .3s;box-shadow:0 2px 8px #ff6b9d4d}.size-marks{justify-content:space-between;margin-top:8px;padding:0 10px;display:flex}.size-mark{color:#ffffff80;font-size:.75rem}.size-preview{text-align:center;background:#ffffff0d;border:1px solid #ff6b9d1a;border-radius:8px;padding:15px}.preview-text{color:#fff;font-weight:500;transition:font-size .3s}@media (max-width:768px){.text-size-card{margin-top:12px;padding:15px}.text-size-header{margin-bottom:15px}.text-size-info{gap:12px}.text-size-icon{font-size:2rem}.text-size-title{font-size:1.1rem}.text-size-description{font-size:.85rem}.text-size-options{grid-template-columns:1fr;gap:12px}.option-content{padding:12px}.option-content i{font-size:1.3rem}.option-text{font-size:.9rem}.option-desc{font-size:.75rem}.custom-size-control{padding:15px}}@media (max-width:480px){.text-size-card{padding:12px}.text-size-header{flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:12px}.text-size-info{gap:10px;width:100%}.text-size-icon{font-size:1.8rem}.text-size-title{font-size:1rem}.text-size-description{font-size:.8rem}.text-size-controls{gap:15px}.option-content{padding:10px}.option-content i{font-size:1.2rem}.option-text{font-size:.85rem}.option-desc{font-size:.7rem}.custom-size-control{padding:12px}.size-label{font-size:.9rem}.size-preview{padding:12px}}.sidebar-progress{z-index:100;align-items:center;gap:0;padding:1rem .4rem 1rem .6rem;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s;display:flex;position:fixed;top:50%;left:0;transform:translateY(-50%)}.sidebar-progress-inner{-webkit-backdrop-filter:blur(20px);background:#0a0a0ad9;border:1px solid #4ecdc426;border-left:none;border-radius:0 16px 16px 0;flex-direction:column;align-items:center;gap:0;padding:1rem .6rem;display:flex;box-shadow:4px 0 24px #0000004d}.sidebar-step{cursor:pointer;opacity:.4;border-radius:12px;flex-direction:column;align-items:center;gap:.2rem;padding:.4rem;transition:all .3s;display:flex;position:relative}.sidebar-step:hover{opacity:.8;background:#4ecdc414}.sidebar-step.active{opacity:1}.sidebar-step.completed{opacity:.7}.sidebar-step-icon{z-index:1;background:#ffffff0f;border:2px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:.9rem;transition:all .3s;display:flex;position:relative}.sidebar-step.active .sidebar-step-icon{background:linear-gradient(135deg,#4ecdc4,#c534ed);border-color:#0000;transform:scale(1.1);box-shadow:0 0 16px #4ecdc480}.sidebar-step.completed .sidebar-step-icon{background:#4ecdc433;border-color:#4ecdc4}.sidebar-step-label{color:#ffffff80;white-space:nowrap;text-align:center;text-overflow:ellipsis;max-width:60px;font-size:.55rem;font-weight:600;transition:color .3s;overflow:hidden}.sidebar-step.active .sidebar-step-label{color:#4ecdc4}.sidebar-step.completed .sidebar-step-label{color:#4ecdc4b3}.sidebar-step-check{color:#fff;z-index:2;background:#4ecdc4;border:2px solid #0a0a0ae6;border-radius:50%;justify-content:center;align-items:center;width:15px;height:15px;font-size:.55rem;display:none;position:absolute;top:-3px;right:-3px}.sidebar-step.completed .sidebar-step-check{display:flex}.sidebar-line{background:#ffffff14;flex-shrink:0;width:2px;height:16px}.sidebar-progress-bar{background:#ffffff0f;border-radius:3px;align-self:center;width:3px;height:200px;margin-left:.3rem;overflow:hidden}.sidebar-progress-fill{background:linear-gradient(#4ecdc4,#c534ed,#ff6b9d);border-radius:3px;width:100%;height:0%;transition:height .4s}@media (max-width:1100px){.sidebar-progress{display:none}}@media (min-width:1101px){.container{margin-left:auto;margin-right:auto}}@media (max-width:768px){.form-actions{z-index:100;-webkit-backdrop-filter:blur(15px);background:#0a0a0af2;border-top:1px solid #4ecdc433;gap:.6rem;margin:0;padding:.8rem 1rem;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 20px #0000004d}.form-actions .preview-galaxy-btn,.form-actions .btn{flex:1;min-height:44px;margin:0;padding:.7rem .5rem;font-size:.85rem}.form-container{padding-bottom:5rem}}.form-group{position:relative}.form-group:after{content:"";background:linear-gradient(90deg,#0000,#4ecdc426,#0000);height:1px;margin-top:1.5rem;display:block}.form-group:last-child:after{display:none}:root{--creator-bg:radial-gradient(circle at 16% 8%, #f85f9a33, transparent 28%), radial-gradient(circle at 88% 0%, #53d7d024, transparent 28%), linear-gradient(135deg, #08070f 0%, #171126 52%, #0f192f 100%);--creator-panel:#ffffff13;--creator-panel-strong:#ffffff1c;--creator-border:#ffffff24;--creator-text:#fff7fb;--creator-muted:#fff7fbb3;--creator-primary:#ff4f91;--creator-cyan:#7ee7df;--creator-gold:#d8b456;--creator-radius:14px}body{background:var(--creator-bg);font-family:var(--app-font-sans,Inter, system-ui, sans-serif);color:var(--creator-text)}body:before{content:"";pointer-events:none;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:72px 72px;position:fixed;top:0;bottom:0;left:0;right:0;-webkit-mask-image:linear-gradient(#000000bf,#0000 78%);mask-image:linear-gradient(#000000bf,#0000 78%)}.container{max-width:920px}.header,.form-container,.tutorial-content,.preview-content,.result-content{border-radius:var(--creator-radius);border:1px solid var(--creator-border);background:linear-gradient(135deg, var(--creator-panel-strong), #ffffff0b);box-shadow:0 24px 70px #03020e47}.header{gap:.9rem;padding:clamp(1.35rem,3vw,2.2rem);display:grid}.header h1,h1{font-family:var(--app-font-display,Inter, system-ui, sans-serif);letter-spacing:0;background:linear-gradient(135deg,#fff7fb,#ff79ad 46%,#76e6df);-webkit-background-clip:text;background-clip:text;font-weight:850}.header p{color:var(--creator-muted);line-height:1.6}.creator-meta-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-top:.2rem;display:grid}.creator-meta-grid span{color:var(--creator-muted);background:#fff1;border:1px solid #ffffff1f;border-radius:12px;padding:.75rem;font-size:.86rem;display:block}.creator-meta-grid strong{color:var(--creator-text);font-size:1.05rem;display:block}.back-btn,.open-tutorial-btn,.btn,.preview-galaxy-btn,.enhance-btn,.upload-btn,.check-id-btn,.song-preview-btn,.tutorial-btn,.create-from-preview-btn,.view-galaxy-btn,.download-qr-btn{font-family:var(--app-font-sans,Inter, system-ui, sans-serif);border-radius:999px}.form-container{padding:clamp(1.1rem,3vw,2rem)}.form-group{border-radius:var(--creator-radius);background:#ffffff0b;border:1px solid #ffffff1a;padding:clamp(1rem,2vw,1.35rem)}.form-group label,.form-label-enhanced,.ai-toggle-title,.text-size-title,.step-title,.preview-title h3,.result-header h3{font-family:var(--app-font-display,Inter, system-ui, sans-serif);letter-spacing:0}.form-group textarea,.form-group input,.form-group select,.galaxy-id-input,.song-input,.message-count-input{font-family:var(--app-font-sans,Inter, system-ui, sans-serif);color:var(--creator-text);background:#05050e7a;border-color:#7ee7df38;border-radius:12px}.form-group textarea::placeholder,.form-group input::placeholder{color:#fff7fb70}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--creator-cyan);transform:none;box-shadow:0 0 0 3px #7ee7df29}.ai-toggle-card,.text-size-card,.upload-area,.modern-audio-player,.performance-option,.fall-speed-option,.icon-option-enhanced,.color-option-enhanced,.qr-style-option{background:#ffffff0e;border-color:#ffffff1f;border-radius:12px}.performance-option.selected,.fall-speed-option.selected,.icon-option-enhanced.selected,.qr-style-option.selected{border-color:#7ee7df8c;box-shadow:0 0 0 1px #7ee7df1f,0 18px 45px #7ee7df1f}.form-actions{gap:.8rem}.preview-galaxy-btn,#submitBtn,.create-from-preview-btn,.view-galaxy-btn{border:0;min-height:48px}#submitBtn,.create-from-preview-btn,.view-galaxy-btn{background:linear-gradient(135deg, var(--creator-primary), var(--creator-cyan));box-shadow:0 15px 36px #ff4f9138}.preview-galaxy-btn{color:var(--creator-text);background:#ffffff14;border:1px solid #ffffff29}@media (max-width:768px){.creator-meta-grid{grid-template-columns:1fr}.form-group{padding:1rem}.form-actions{align-items:stretch}}