:root{color-scheme:dark;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}@keyframes mixer-scan{0%,to{transform:translateY(-12%) scaleY(.7);opacity:.2}50%{transform:translateY(12%) scaleY(1.05);opacity:.55}}@keyframes mixer-spectrum-pulse{0%,to{transform:scaleY(.45);opacity:.4}40%{transform:scaleY(1.3);opacity:1}70%{transform:scaleY(.8);opacity:.7}}@keyframes mixer-constellation-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes mixer-video-glow{0%,to{opacity:.75;transform:scale(.98)}50%{opacity:1;transform:scale(1.02)}}@keyframes mixer-fallback-pulse{0%,to{opacity:.6;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}@keyframes edge-orbit{0%{transform:rotate(0deg) scale(1);opacity:.65}55%{transform:rotate(.8deg) scale(1.02);opacity:.85}to{transform:rotate(1.6deg) scale(1);opacity:.65}}@keyframes gradient-shift{0%,to{background-position:0 50%}50%{background-position:100% 50%}}@keyframes glow-pulse{0%,to{opacity:.5}50%{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}body{margin:0;background:linear-gradient(135deg,#0a0e27,#1a1f3a 50%,#0f1729);background-size:200% 200%;animation:gradient-shift 15s ease infinite;color:#e2e8f0;font-family:inherit;position:relative;overflow-x:hidden}body:before{top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(99,102,241,.05) 0,transparent 50%);animation:glow-pulse 8s ease-in-out infinite}body:after,body:before{content:"";position:fixed;pointer-events:none;z-index:0}body:after{inset:0;background-image:url(/assets/bg_frame.png);background-repeat:no-repeat;background-position:50%;background-size:clamp(1400px,160vw,2400px);opacity:.18;mix-blend-mode:normal;-webkit-mask-image:radial-gradient(circle,rgba(0,0,0,.25) 0,rgba(0,0,0,.4) 45%,rgba(0,0,0,.85) 75%,#000 100%);mask-image:radial-gradient(circle,rgba(0,0,0,.25) 0,rgba(0,0,0,.4) 45%,rgba(0,0,0,.85) 75%,#000 100%);-webkit-mask-size:200%;mask-size:200%;-webkit-mask-position:center;mask-position:center;transform-origin:center;animation:edge-orbit 26s ease-in-out infinite}a{color:inherit;text-decoration:none}.app-body{min-height:100vh;display:flex}.main-container{flex:1 1;display:flex;flex-direction:column;margin:0 auto;width:min(760px,100%);max-width:clamp(640px,68vw,760px);padding:40px 20px 56px;gap:24px;box-sizing:border-box;position:relative;z-index:1;animation:slide-up .6s ease-out}.panel{background:linear-gradient(135deg,rgba(15,23,42,.95),rgba(30,41,59,.9));border:1px solid rgba(99,102,241,.2);border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.4),0 0 0 1px rgba(99,102,241,.1),inset 0 1px 0 hsla(0,0%,100%,.05);padding:32px;position:relative;overflow:hidden;transition:all .3s ease}.panel:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(99,102,241,.1),transparent);transition:left .5s ease}.panel:hover:before{left:100%}.panel:hover{border-color:rgba(99,102,241,.4);box-shadow:0 25px 50px rgba(0,0,0,.5),0 0 0 1px rgba(99,102,241,.2),inset 0 1px 0 hsla(0,0%,100%,.08);transform:translateY(-2px)}.panel h1,.panel h2{margin:0;background:linear-gradient(135deg,#a5b4fc,#818cf8 50%,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;letter-spacing:-.02em}.panel-header{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;position:relative}.panel-header:after{content:"";position:absolute;bottom:-12px;left:0;width:60px;height:3px;background:linear-gradient(90deg,#6366f1,transparent);border-radius:2px}.text-muted{color:#94a3b8;font-size:.9rem;line-height:1.6}.button{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border:none;border-radius:12px;padding:14px 28px;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px rgba(99,102,241,.4),inset 0 1px 0 hsla(0,0%,100%,.2);position:relative;overflow:hidden}.button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);transition:left .5s ease}.button:hover:before{left:100%}.button:disabled{cursor:wait;opacity:.6;transform:none}.button-secondary{background:linear-gradient(135deg,rgba(15,23,42,.85),rgba(30,41,59,.9));color:#e0f2fe;border:1px solid rgba(148,163,184,.35);box-shadow:0 4px 15px rgba(14,165,233,.25),inset 0 1px 0 hsla(0,0%,100%,.15)}.button-secondary:not(:disabled):hover{background:linear-gradient(135deg,rgba(2,132,199,.85),rgba(59,130,246,.7));color:#fff;box-shadow:0 6px 20px rgba(59,130,246,.35),inset 0 1px 0 hsla(0,0%,100%,.25)}.button:not(:disabled):hover{background:linear-gradient(135deg,#7c3aed,#a855f7);box-shadow:0 6px 20px rgba(99,102,241,.6),inset 0 1px 0 hsla(0,0%,100%,.3);transform:translateY(-2px)}.button:not(:disabled):active{transform:translateY(0);box-shadow:0 2px 10px rgba(99,102,241,.4),inset 0 1px 0 hsla(0,0%,100%,.2)}.status{font-size:.9rem;margin:0;padding:12px 16px;border-radius:8px;font-weight:500;animation:slide-up .3s ease-out}.status.error{color:#fca5a5;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3)}.status.success{color:#86efac;background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3)}.input-text,.input-textarea{min-height:240px;border-radius:12px;border:1px solid rgba(99,102,241,.2);background:rgba(15,23,42,.8);color:#e2e8f0;padding:16px;resize:vertical;font-size:.95rem;font-family:JetBrains Mono,Fira Code,monospace;transition:all .3s ease;box-shadow:inset 0 2px 4px rgba(0,0,0,.2)}.input-text{min-height:auto;font-family:inherit}.input-text:focus,.input-textarea:focus{outline:none;border-color:rgba(99,102,241,.5);background:rgba(15,23,42,.95);box-shadow:inset 0 2px 4px rgba(0,0,0,.2),0 0 0 3px rgba(99,102,241,.1)}.input-text::placeholder,.input-textarea::placeholder{color:#64748b}.input-label{font-size:.9rem;font-weight:600;color:#cbd5e1;display:flex;align-items:baseline;gap:4px}.link{color:#6ee7b7}.card-balance{display:flex;flex-direction:column;gap:12px;padding:8px 0}.card-balance__value{display:flex;align-items:baseline;gap:12px;font-weight:700;font-size:2.5rem;background:linear-gradient(135deg,#a5b4fc,#818cf8 50%,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.card-balance__value span:last-child{font-size:1.2rem;font-weight:600;opacity:.8}.card-balance__status{text-transform:uppercase;letter-spacing:.1em;font-size:.75rem;font-weight:600;color:#94a3b8;display:flex;align-items:center;gap:8px}.card-balance__status:before{content:"💰";font-size:1rem}.section-stack{display:flex;flex-direction:column;gap:24px}.mixer-form{gap:28px}.mixer-stage{position:relative;display:grid;grid-gap:16px;gap:16px;justify-items:center;align-items:center;background:linear-gradient(135deg,rgba(15,23,42,.8),rgba(30,41,59,.9));border:1px solid rgba(148,163,184,.2);border-radius:18px;padding:clamp(22px,4vw,36px);overflow:hidden;box-shadow:inset 0 1px 0 hsla(0,0%,100%,.05),0 18px 35px rgba(2,6,23,.45)}.mixer-stage:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 25% 20%,rgba(251,191,36,.15),transparent 45%),radial-gradient(circle at 80% 30%,rgba(96,165,250,.1),transparent 50%);pointer-events:none}.mixer-caption{position:relative;z-index:1;width:min(560px,92%);text-align:center;font-size:clamp(.95rem,1.6vw,1.18rem);color:#e2e8f0;line-height:1.7;padding:14px 18px;border-radius:18px;background:rgba(15,23,42,.55);border:1px solid rgba(148,163,184,.24);box-shadow:inset 0 0 12px rgba(59,130,246,.2),0 12px 24px rgba(2,6,23,.45)}.mixer-controls{display:grid;grid-gap:24px;gap:24px}.mixer-control{display:grid;grid-gap:12px;gap:12px}.mixer-actions{gap:18px}.mixer-actions,.mixer-status{display:flex;flex-direction:column}.mixer-status{gap:12px}.status.info{color:#bfdbfe;background:rgba(37,99,235,.12);border:1px solid rgba(96,165,250,.25)}.mixer-scene{position:relative;width:clamp(300px,62vw,520px);aspect-ratio:1/1;display:grid;place-items:center;pointer-events:none;border-radius:32px;background:radial-gradient(circle at 25% 30%,rgba(244,114,182,.32),transparent 62%),radial-gradient(circle at 75% 28%,rgba(96,165,250,.28),transparent 65%),radial-gradient(circle at 52% 70%,rgba(250,204,21,.22),transparent 70%),rgba(15,23,42,.75);box-shadow:0 24px 48px rgba(2,6,23,.45),inset 0 1px 0 rgba(148,163,184,.08),inset 0 0 0 1px rgba(99,102,241,.2);overflow:hidden}.mixer-grid{inset:0;background-image:linear-gradient(rgba(99,102,241,.06) 1px,transparent 0),linear-gradient(90deg,rgba(99,102,241,.06) 1px,transparent 0);background-size:36px 36px;opacity:.6;mix-blend-mode:screen}.mixer-grid,.mixer-halo{position:absolute;transform:translateZ(0)}.mixer-halo{inset:10%;border-radius:50%;background:radial-gradient(circle,rgba(56,189,248,.28) 0,transparent 65%),radial-gradient(circle,rgba(251,191,36,.24) 0,transparent 85%);filter:blur(4px);opacity:.8}.mixer-scanline{position:absolute;inset:14% 10%;border-radius:28px;background:linear-gradient(180deg,transparent,rgba(148,163,184,.12) 35%,rgba(148,163,184,.24) 65%,transparent),linear-gradient(90deg,rgba(59,130,246,.12),transparent 40%,rgba(14,165,233,.18));-webkit-mask-image:radial-gradient(circle,rgba(0,0,0,.9) 0,transparent 78%);mask-image:radial-gradient(circle,rgba(0,0,0,.9) 0,transparent 78%);animation:mixer-scan 7s ease-in-out infinite;animation-play-state:paused;mix-blend-mode:screen}.mixer-video{position:absolute;inset:clamp(32px,7vw,56px);border-radius:32px;background:transparent;border:none;box-shadow:none;overflow:hidden;display:grid;place-items:center}.mixer-video__player{width:100%;height:100%;object-fit:cover;border-radius:24px;display:block;opacity:0;transition:opacity .28s ease-in-out}.mixer-video[data-state=playing] .mixer-video__player{opacity:1}.mixer-video__fallback{position:absolute;inset:0;display:grid;place-content:center;grid-gap:8px;gap:8px;color:rgba(226,232,240,.9);text-align:center;font-size:clamp(.9rem,2vw,1.1rem);animation:mixer-fallback-pulse 2.4s ease-in-out infinite}.mixer-video[data-state=playing] .mixer-video__fallback{opacity:.08;animation:none}.mixer-video__icon{font-size:clamp(1.8rem,5vw,2.6rem);display:inline-block}.mixer-video__text{letter-spacing:.08em;text-transform:uppercase}.mixer-scene.is-running .mixer-scanline{animation-play-state:running}@keyframes mixer-pulse{0%{transform:scale(.6);opacity:0}20%{opacity:1}70%{opacity:.4}to{transform:scale(1.4);opacity:0}}.mixer-orbit{position:absolute;inset:14%;border-radius:50%;border:1px solid rgba(14,165,233,.25);animation:mixer-orbit-spin 8s linear infinite;transform-origin:center}.mixer-orbit--inner{animation-duration:6s;border-color:rgba(99,102,241,.25)}.mixer-orbit--middle{inset:9%;border-color:rgba(244,114,182,.22);animation-duration:10s}.mixer-orbit--outer{inset:4%;animation-direction:reverse}.mixer-orbit__dot{position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,#38bdf8 0,rgba(56,189,248,.1) 70%);box-shadow:0 0 12px rgba(56,189,248,.6)}.mixer-scene.is-running .mixer-orbit{animation-play-state:running}.mixer-scene:not(.is-running) .mixer-orbit{animation-play-state:paused}@keyframes mixer-orbit-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (max-width:900px){.mixer-scene{width:min(360px,90vw)}.mixer-caption{font-size:.98rem;padding:12px 16px}}@media (max-width:640px){.mixer-stage{padding:18px 16px 22px}.mixer-caption{font-size:.92rem}}.mixer-results{display:grid;grid-gap:18px;gap:18px;padding:24px;border-radius:18px;background:linear-gradient(135deg,rgba(15,23,42,.85),rgba(9,9,11,.9));border:1px solid rgba(94,234,212,.2);box-shadow:inset 0 1px 0 hsla(0,0%,100%,.05),0 20px 35px rgba(2,44,34,.35)}.mixer-results__title{margin:0;font-size:1.1rem;font-weight:700;letter-spacing:-.01em;color:#bef264}.mixer-document{background:rgba(15,23,42,.95);border-radius:14px;border:1px solid rgba(45,212,191,.2);padding:20px;overflow:auto;max-height:520px;box-shadow:inset 0 0 0 1px rgba(14,165,233,.05),0 12px 22px rgba(2,6,23,.4)}.mixer-document pre{margin:0;white-space:pre-wrap;font-family:JetBrains Mono,Fira Code,monospace;font-size:.9rem;line-height:1.6;color:#e2e8f0}.app-header{width:100%;padding:24px 0;margin-bottom:32px;position:relative}.app-header:after{content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(99,102,241,.3),transparent)}.header-content{justify-content:space-between}.header-content,.logo-section{display:flex;align-items:center}.logo-section{gap:16px}.logo-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:24px;background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(139,92,246,.2));border:1px solid rgba(99,102,241,.3);border-radius:12px;box-shadow:0 4px 12px rgba(99,102,241,.2)}.logo-text{display:flex;flex-direction:column;gap:2px}.logo-title{margin:0;font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#a5b4fc,#818cf8 50%,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.logo-subtitle{margin:0;color:#94a3b8;font-weight:500}.header-badge,.logo-subtitle{font-size:.75rem;letter-spacing:.05em;text-transform:uppercase}.header-badge{display:flex;align-items:center;gap:8px;padding:6px 14px;background:rgba(99,102,241,.1);border:1px solid rgba(99,102,241,.3);border-radius:20px;font-weight:600;color:#a5b4fc}.badge-dot{width:6px;height:6px;background:#6366f1;border-radius:50%;animation:glow-pulse 2s ease-in-out infinite;box-shadow:0 0 8px rgba(99,102,241,.8)}