@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&display=swap";:root{--bg-dark:#0a0a0f;--bg-panel:#14141d;--bg-card:#1c1c28;--text-main:#f0f0f5;--text-muted:#8e8e9f;--accent-cyan:#00f0ff;--accent-purple:#b026ff;--accent-pink:#ff2a85;--accent-glow:#00f0ff66;--font-main:"Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}html{min-height:100%}html,body{background-color:var(--bg-dark);width:100%;min-height:100%;color:var(--text-main);font-family:var(--font-main);overflow:hidden auto}#root{flex-direction:column;width:100%;height:100dvh;min-height:100dvh;display:flex}.app-container{flex-direction:column;flex:auto;width:100%;height:100dvh;min-height:100dvh;display:flex;overflow:hidden visible}.app-container>:not(.nav-laws){flex-direction:column;flex:1;min-height:0;display:flex}.app-container>.page-scroll{flex:0 auto;height:auto;min-height:0}h1,h2,h3{letter-spacing:.5px;font-weight:800}p{line-height:1.5}.glass-panel{-webkit-backdrop-filter:blur(12px);background:#14141db3;border:1px solid #ffffff0d;border-radius:16px}.text-gradient{background:linear-gradient(90deg, var(--accent-cyan), var(--accent-purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.btn-primary{background:linear-gradient(90deg, var(--accent-purple), var(--accent-pink));color:#fff;font-family:var(--font-main);cursor:pointer;border:none;border-radius:30px;align-items:center;gap:8px;padding:12px 24px;font-size:1rem;font-weight:600;transition:all .3s;display:flex;box-shadow:0 4px 15px #b026ff4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #b026ff80}.btn-primary:active{transform:translateY(1px)}.btn-icon{color:var(--text-main);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;transition:all .2s;display:flex}.btn-icon:hover{background:#ffffff1a;transform:scale(1.05)}input[type=range]{appearance:none;background:#ffffff1a;border-radius:5px;outline:none;width:100%;height:6px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent-cyan);cursor:pointer;width:20px;height:20px;box-shadow:0 0 10px var(--accent-glow);border-radius:50%;transition:transform .1s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}input[type=range].compact-slider{height:4px}input[type=range].compact-slider::-webkit-slider-thumb{width:14px;height:14px}@keyframes pulse{0%{box-shadow:0 0 #00f0ffb3}70%{box-shadow:0 0 0 10px #00f0ff00}to{box-shadow:0 0 #00f0ff00}}.interactive-glow{animation:2s infinite pulse}.nav-laws{z-index:10;background:linear-gradient(180deg, var(--bg-dark) 0%, transparent 100%);justify-content:center;gap:12px;padding:16px;display:flex;position:absolute;top:0;left:0;right:0}.nav-pill{color:var(--text-muted);cursor:pointer;background:#ffffff0d;border:1px solid #0000;border-radius:20px;padding:8px 16px;font-size:.9rem;font-weight:600;transition:all .3s}.nav-pill.active{color:var(--accent-cyan);background:#00f0ff1a;border-color:#00f0ff4d;box-shadow:0 0 10px #00f0ff33}.control-panel{z-index:10;flex-direction:column;gap:16px;width:90%;max-width:400px;padding:24px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.control-row{flex-direction:column;gap:8px;display:flex}.control-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;justify-content:space-between;font-size:.85rem;display:flex}.value-display{color:var(--accent-cyan);font-weight:800}.canvas-container{z-index:1;flex:1;width:100%;height:100%;position:absolute;top:0;left:0}.instructions-overlay{text-align:center;z-index:5;pointer-events:none;width:90%;max-width:600px;position:absolute;top:80px;left:50%;transform:translate(-50%)}.instructions-overlay h2{text-shadow:0 2px 10px #000c;margin-bottom:8px;font-size:1.5rem}.instructions-overlay p{color:var(--text-muted);text-shadow:0 1px 5px #000c;font-size:1rem}.notification{background:var(--bg-card);border-left:4px solid var(--accent-cyan);z-index:100;border-radius:8px;align-items:center;gap:12px;padding:16px;font-size:.9rem;display:flex;position:absolute;top:20px;right:20px;box-shadow:0 4px 20px #00000080}