@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-base:#0f172a;--bg-surface:#1e293bb3;--bg-surface-hover:#334155cc;--bg-elevated:#0f172a99;--text-primary:#f8fafc;--text-secondary:#94a3b8;--accent-color:#3b82f6;--accent-hover:#2563eb;--border-color:#ffffff1a;--danger-color:#ef4444;--success-color:#10b981;--border-radius-sm:6px;--border-radius-md:12px;--border-radius-lg:24px;--font-family:"Inter", sans-serif;--transition-fast:.15s ease;--transition-smooth:.3s cubic-bezier(.4, 0, .2, 1);--glow:0 0 20px #3b82f680}@media (prefers-color-scheme:light){:root{--bg-base:#f8fafc;--bg-surface:#ffffffb3;--bg-surface-hover:#f1f5f9cc;--bg-elevated:#fff9;--text-primary:#0f172a;--text-secondary:#64748b;--border-color:#0000001a}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background:var(--bg-base);color:var(--text-primary);background-image:radial-gradient(circle at 15%,#3b82f614,#0000 25%),radial-gradient(circle at 85% 30%,#8b5cf614,#0000 25%);min-height:100vh;overflow:hidden}#root{width:100vw;height:100vh;display:flex}.glass-panel{background:var(--bg-surface);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-color)}.btn{background:var(--bg-surface);color:var(--text-primary);border:1px solid var(--border-color);border-radius:var(--border-radius-sm);font-family:var(--font-family);cursor:pointer;transition:all var(--transition-fast);outline:none;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:14px;font-weight:500;display:inline-flex}.btn:hover:not(:disabled){background:var(--bg-surface-hover);border-color:#fff3}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent-color);color:#fff;border:none;box-shadow:0 4px 14px #3b82f663}.btn-primary:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 20px #3b82f63b}.btn-icon{border-radius:var(--border-radius-sm);padding:8px}.form-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.form-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:13px;font-weight:600}.form-input{border:1px solid var(--border-color);color:var(--text-primary);border-radius:var(--border-radius-sm);font-family:var(--font-family);transition:all var(--transition-fast);background:#0003;padding:10px 12px;font-size:14px}.form-input:focus{border-color:var(--accent-color);outline:none;box-shadow:0 0 0 2px #3b82f633}input[type=range]{appearance:none;background:0 0;width:100%}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;cursor:pointer;background:#06d6a0;border-radius:50%;width:18px;height:18px;margin-top:-6px;box-shadow:0 0 8px #06d6a099}input[type=range]::-webkit-slider-runnable-track{cursor:pointer;background:#ffffff1a;border-radius:3px;width:100%;height:6px}input[type=range]:focus{outline:none}.custom-checkbox{appearance:none;cursor:pointer;background:#0003;border:2px solid #ffffff4d;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;transition:all .2s;display:inline-flex}.custom-checkbox:checked{background:#06d6a0;border-color:#06d6a0;box-shadow:0 0 10px #06d6a066}.custom-checkbox:checked:after{content:"✔";color:#fff;font-size:12px;font-weight:700}@property --spin-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes spin-gradient{0%{--spin-angle:0deg}to{--spin-angle:360deg}}.glow-button{text-shadow:0 2px 4px #0000004d;background:conic-gradient(from var(--spin-angle), #ef476f, #06d6a0, #118ab2, #ef476f)!important;color:#fff!important;border:none!important;transition:all .3s!important;animation:3s linear infinite spin-gradient!important;box-shadow:0 4px 25px #06d6a066,0 0 15px #ef476f4d!important}.glow-button:hover:not(:disabled){transform:translateY(-2px)!important;box-shadow:0 6px 30px #06d6a099,0 0 25px #ef476f80!important}@property --session-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes spin-session{0%{--session-angle:0deg}to{--session-angle:360deg}}.session-button{letter-spacing:.3px;text-shadow:none;background:conic-gradient(from var(--session-angle), #f7971e, #ffd200, #f7971e)!important;color:#1a1a1a!important;border-radius:var(--border-radius-sm)!important;cursor:pointer!important;border:none!important;font-size:13px!important;font-weight:700!important;transition:all .3s!important;animation:3s linear infinite spin-session!important;box-shadow:0 4px 20px #f7971e59,0 0 12px #ffd20033!important}.session-button:hover{transform:translateY(-2px)!important;box-shadow:0 6px 28px #f7971e8c,0 0 20px #ffd20059!important}.segmented-control{border-radius:var(--border-radius-sm);background:#0000004d;flex-wrap:wrap;gap:4px;padding:4px;display:flex}.segmented-button{text-align:center;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;border-radius:4px;flex:1;padding:8px;font-size:13px;font-weight:500}.segmented-button.active{color:var(--text-primary);background:#ffffff1a;box-shadow:0 2px 8px #0003}.app-container{width:100%;height:100%;display:flex}.sidebar{border-right:1px solid var(--border-color);background:var(--bg-surface);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:10;flex-direction:column;gap:24px;width:320px;min-width:320px;height:100%;padding:24px;display:flex;overflow-y:auto}.canvas-area{background-color:#0000;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-position:0 0;background-repeat:repeat;background-size:20px 20px;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.watermark-overlay{pointer-events:none;opacity:.3;z-index:100;flex-wrap:wrap;place-content:stretch space-around;display:flex;position:absolute;inset:0;overflow:hidden}.watermark-text{color:#fff;-webkit-user-select:none;user-select:none;padding:4rem;font-size:4rem;font-weight:900;transform:rotate(-30deg)}.dropzone{border:2px dashed var(--border-color);border-radius:var(--border-radius-md);text-align:center;cursor:pointer;transition:all var(--transition-smooth);background:#0003;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:32px 16px;display:flex}.dropzone:hover,.dropzone.active{border-color:var(--accent-color);background:#3b82f60d}.dropzone-icon{color:var(--accent-color)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:9999;opacity:0;background:#000c;justify-content:center;align-items:center;animation:.3s forwards fadeIn;display:flex;position:fixed;inset:0}.modal{background:var(--bg-base);border:1px solid var(--border-color);border-radius:var(--border-radius-lg);text-align:center;width:100%;max-width:480px;padding:40px;box-shadow:0 25px 50px -12px #00000080}@keyframes fadeIn{to{opacity:1}}.twinkle-container{pointer-events:none;z-index:0;width:100vw;height:100vh;position:fixed;top:0;left:0;overflow:hidden}.twinkle{border-radius:50%;animation:3s ease-in-out infinite twinkle-pulse;position:absolute}.twinkle.small{width:1px;height:1px}.twinkle.medium{width:2px;height:2px}.twinkle.large{width:3px;height:3px}.twinkle.slow{animation-duration:5s}.twinkle.normal{animation-duration:3s}.twinkle.fast{animation-duration:1.8s}.twinkle.pink{background:#ef476f;box-shadow:0 0 6px 2px #ef476fb3,0 0 12px 4px #ef476f4d}.twinkle.yellow{background:#ffd166;box-shadow:0 0 6px 2px #ffd166b3,0 0 12px 4px #ffd1664d}.twinkle.teal{background:#06d6a0;box-shadow:0 0 6px 2px #06d6a0b3,0 0 12px 4px #06d6a04d}.twinkle.blue{background:#118ab2;box-shadow:0 0 6px 2px #118ab2b3,0 0 12px 4px #118ab24d}.twinkle.dark{background:#06d6a0;box-shadow:0 0 4px 1px #073b4ce6,0 0 8px 3px #073b4c66}@keyframes twinkle-pulse{0%,to{opacity:.1;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}.app-container.landing-mode{flex-direction:column}.app-container.landing-mode .canvas-area{display:none}.app-container.landing-mode .sidebar{height:100%;overflow-y:auto;width:100%!important;min-width:unset!important;background:0 0!important;border-right:none!important;max-width:none!important}.sidebar{z-index:10;transition:all .5s cubic-bezier(.4,0,.2,1)}@keyframes attentionPulse{0%{border-color:#ef4444cc;box-shadow:0 0 #ef4444b3}70%{border-color:#ef44444d;box-shadow:0 0 0 10px #ef444400}to{box-shadow:0 0 #ef444400}}.pulse-error{animation:2s infinite attentionPulse;border-color:var(--danger-color)!important}@keyframes subtleGlow{0%{border-color:#3b82f6cc;box-shadow:0 0 #3b82f666}50%{border-color:#3b82f6;box-shadow:0 0 20px 4px #3b82f699}to{border-color:var(--border-color);box-shadow:0 0 #3b82f600}}.pulse-glow{animation:2.5s ease-out 2 subtleGlow}@keyframes pulsate-vibrant{0%{opacity:.5;text-shadow:0 0 #118ab200;color:var(--text-secondary);transform:scale(1)}50%{opacity:1;text-shadow:0 0 15px #118ab2cc;color:#118ab2;transform:scale(1.05)}to{opacity:.5;text-shadow:0 0 #118ab200;color:var(--text-secondary);transform:scale(1)}}.hint-glow{animation:2.5s ease-in-out infinite pulsate-vibrant}