@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&display=swap";:root{--color-black:#09090b;--color-dark-gray:#121216;--color-panel-bg:#16161cbf;--color-white:#fff;--color-neon-blue:#00f2fe;--color-neon-cyan:#06b6d4;--color-neon-green:#10b981;--color-neon-purple:#a855f7;--color-neon-pink:#ec4899;--color-bg:#09090b;--color-border:#ffffff14;--color-border-glow:#00f2fe26;--color-text:#f4f4f5;--color-text-light:#a1a1aa;--color-text-muted:#71717a;--radius:16px;--radius-sm:8px;--radius-lg:24px;--shadow:0 4px 20px -2px #00000080;--shadow-lg:0 10px 30px -5px #000c, 0 0 15px #00f2fe1a;--shadow-glow:0 0 15px #a855f766;--shadow-glow-cyan:0 0 15px #06b6d466;--font-main:"Outfit", "Inter", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#ffffff1a transparent;margin:0;padding:0}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:#ffffff26;border-radius:10px}::-webkit-scrollbar-thumb:hover{background-color:#ffffff4d}body{font-family:var(--font-main);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;width:100vw;height:100vh;overflow:hidden}#root{background-image:radial-gradient(at 0 0,#6e14b81a 0,#0000 50%),radial-gradient(at 100% 100%,#14a7b81a 0,#0000 50%);flex-direction:column;height:100%;display:flex;position:relative}button{cursor:pointer;border-radius:var(--radius);background:0 0;border:none;justify-content:center;align-items:center;font-family:inherit;font-weight:600;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex}button:disabled{opacity:.35;cursor:not-allowed;box-shadow:none!important;transform:none!important}.btn-primary{background:linear-gradient(135deg, var(--color-neon-purple), var(--color-neon-cyan));color:var(--color-white);box-shadow:var(--shadow-glow);padding:12px 24px;font-size:1.05rem;font-weight:700;position:relative;overflow:hidden}.btn-primary:before{content:"";opacity:0;background:linear-gradient(135deg,#ffffff26,#fff0);width:100%;height:100%;transition:opacity .25s;position:absolute;top:0;left:0}.btn-primary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 0 25px #06b6d480,0 0 10px #a855f74d}.btn-primary:hover:not(:disabled):before{opacity:1}.btn-primary:active:not(:disabled){transform:translateY(0)scale(.97)}.btn-secondary{background:linear-gradient(135deg, var(--color-neon-green), #059669);color:var(--color-white);padding:10px 20px;font-size:.95rem;font-weight:700;box-shadow:0 0 15px #10b98140}.btn-secondary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px);box-shadow:0 0 25px #10b98180}.btn-secondary:active:not(:disabled){transform:translateY(0)scale(.97)}.btn-outline{border:1px solid var(--color-border);color:var(--color-text);background-color:#ffffff08;padding:10px 20px;font-weight:600}.btn-outline:hover:not(:disabled){border-color:var(--color-neon-cyan);color:var(--color-neon-cyan);background-color:#06b6d414;transform:translateY(-1px)}.btn-outline:active:not(:disabled){transform:translateY(0)scale(.97)}.btn-icon{justify-content:center;align-items:center;gap:8px;display:flex}.app-container{flex:1;gap:16px;padding:0 16px 16px;display:flex;overflow:hidden}.sidebar{background:var(--color-panel-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--color-border);border-radius:var(--radius-lg);z-index:10;width:300px;box-shadow:var(--shadow);flex-direction:column;padding:24px 0;display:flex}.sidebar-right{background:var(--color-panel-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--color-border);border-radius:var(--radius-lg);z-index:10;width:340px;box-shadow:var(--shadow);flex-direction:column;padding:24px;display:flex;overflow-y:auto}.main-content{border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:#0a0a0c66;flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.topbar{z-index:20;justify-content:space-between;align-items:center;height:76px;margin-bottom:8px;padding:0 24px;display:flex}.topbar-title{letter-spacing:.05em;background:linear-gradient(135deg, var(--color-white) 30%, var(--color-neon-cyan));-webkit-text-fill-color:transparent;text-transform:uppercase;-webkit-background-clip:text;align-items:center;gap:12px;font-size:1.4rem;font-weight:900;display:flex}.topbar-actions{align-items:center;gap:12px;display:flex}.control-group{border-radius:var(--radius);background:#ffffff05;border:1px solid #ffffff08;margin-bottom:24px;padding:16px}.control-label{color:var(--color-text);letter-spacing:-.01em;margin-bottom:8px;font-size:1.05rem;font-weight:700;display:block}.control-desc{color:var(--color-text-light);margin-bottom:12px;font-size:.85rem;line-height:1.4}.slider-container{align-items:center;gap:14px;margin-top:10px;display:flex}input[type=range]{appearance:none;background:#ffffff1a;border-radius:4px;outline:none;flex:1;height:8px;transition:background .3s}input[type=range]::-webkit-slider-thumb{appearance:none;background:linear-gradient(135deg, var(--color-neon-cyan), var(--color-neon-blue));cursor:pointer;width:20px;height:20px;box-shadow:0 0 10px var(--color-neon-cyan);border-radius:50%;transition:transform .1s,background-color .2s}input[type=range]::-webkit-slider-thumb:hover{box-shadow:0 0 15px var(--color-neon-cyan), 0 0 5px white;transform:scale(1.2)}input[type=range]::-webkit-slider-thumb:active{transform:scale(.9)}.gum-tip-card{border-radius:var(--radius);background:linear-gradient(135deg,#a855f726,#06b6d426);border:1px solid #a855f74d;margin-bottom:24px;padding:16px;position:relative;overflow:hidden;box-shadow:0 4px 15px #0003}.gum-tip-card:after{content:"";pointer-events:none;background:radial-gradient(circle,#06b6d433 0%,#0000 70%);width:60px;height:60px;position:absolute;top:0;right:0}.gum-tip-card h3{color:var(--color-neon-blue);text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:8px;margin-bottom:6px;font-size:1.05rem;font-weight:800;display:flex}.gum-tip-card p{color:var(--color-text);font-size:.9rem;font-weight:500;line-height:1.45}.checkerboard{background-color:#0c0a09;background-image:linear-gradient(45deg,#18181b 25%,#0000 25%),linear-gradient(135deg,#18181b 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#18181b 75%),linear-gradient(135deg,#0000 75%,#18181b 75%);background-position:0 0,12px 0,12px -12px,0 12px;background-size:24px 24px}.sidebar-step-button{position:relative}.step-tooltip{background:var(--color-panel-bg);border:1px solid var(--color-neon-cyan);border-radius:var(--radius-sm);color:var(--color-text);pointer-events:none;opacity:0;visibility:hidden;z-index:999;text-align:left;width:220px;padding:8px 12px;font-size:.85rem;line-height:1.35;transition:all .2s cubic-bezier(.4,0,.2,1);position:absolute;top:50%;left:280px;transform:translateY(-50%)translate(15px);box-shadow:0 10px 25px #000c,0 0 10px #06b6d433}.step-tooltip:before{content:"";border-style:solid;border-width:6px;border-color:transparent var(--color-neon-cyan) transparent transparent;position:absolute;top:50%;right:100%;transform:translateY(-50%)}.sidebar-step-button:hover .step-tooltip{opacity:1;visibility:visible;transform:translateY(-50%)translate(5px)}@media (width<=1200px){.sidebar{width:260px}.sidebar-right{width:300px}.topbar-actions button{padding:8px 14px;font-size:.85rem}.step-tooltip{left:240px}}