@import"https://fonts.googleapis.com/css?family=Orbitron&display=swap";:root{--blue: #3490dc;--indigo: #6574cd;--purple: #9561e2;--pink: #f66d9b;--red: #e3342f;--orange: #f6993f;--yellow: #ffed4a;--green: #38c172;--teal: #4dc0b5;--cyan: #6cb2eb;--white: #fff;--gray: #6c757d;--gray-dark: #343a40;--primary: #3490dc;--secondary: #6c757d;--success: #38c172;--info: #6cb2eb;--warning: #ffed4a;--danger: #e3342f;--light: #f8f9fa;--dark: #343a40;--breakpoint-xs: 0;--breakpoint-sm: 576px;--breakpoint-md: 768px;--breakpoint-lg: 992px;--breakpoint-xl: 1200px;--font-family-sans-serif: "Orbitron", sans-serif;--font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}html{font-family:Orbitron,sans-serif;font-size:10pt;color:#d3d3d3}body{padding:0;margin:0;min-height:100%!important;background:#000}a{text-decoration:none;color:#2d2d2d;transition:.3s ease}a:hover{color:#286478}.flex{display:flex}.aifs{align-items:flex-start}.instruments_container{flex-flow:column;align-items:flex-start;gap:30px}.display{background:#333;color:#67e8ff;text-shadow:0px 0px 5px rgb(103,232,255);font-weight:700;box-shadow:0 0 5px #356b75 inset;width:330px}.display .step{width:65px}.display .bpm{width:70px}.head{font-size:14pt;font-weight:700;color:#67e8ff;margin-bottom:5px}.bpm_value{background:no-repeat;border:none;color:#67e8ff;text-shadow:0px 0px 5px rgb(103,232,255);width:35px;height:15px}.patterns{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;grid-gap:10px}.pattern{width:50px;height:50px;padding:11px;font-size:16pt;text-align:center}.pattern_button{border:1px solid #5c90a3}.pattern_button.active{background:#67e8ff;color:#000}.button{background:#171717;background:linear-gradient(0deg,#171717,#393939);color:#3a8b99;font-weight:700;border:1px solid #2d2d2d;cursor:pointer;box-sizing:border-box;position:sticky;top:10px;width:70px;text-align:center}.button.active{color:#67e8ff;text-shadow:0px 0px 5px rgb(103,232,255)}.pack{color:#67e8ff;cursor:pointer}.pack:hover{text-shadow:0px 0px 5px rgb(103,232,255)}.tracks{display:flex;flex-flow:column;align-items:flex-start}.tracks .track{display:grid;grid-template-columns:repeat(17,1fr);grid-gap:10px}.tracks .step,.tracks .instrument{width:50px;height:50px;box-sizing:border-box;padding:10px;border:1px solid #2d2d2d;cursor:pointer}.tracks .step:not(.active):not(.scnd){background:#171717;background:linear-gradient(0deg,#171717,#393939)}.tracks .step.scnd:not(.active){background:#282828;background:linear-gradient(0deg,#282828,#434343)}.tracks .step.flow{border:1px solid rgb(53,118,130)}.tracks .step.active{background:#67e8ff;background:radial-gradient(circle,#67e8ff,#494949 97%,#393939)}.basspattern{display:grid;grid-template-columns:repeat(17,1fr);grid-gap:10px}.basstypes{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:10px}.bass_image{width:90px;height:40px}.bass_image.sine{background:url(/img/waves.svg) -7px 0px/95px}.bass_image.square{background:url(/img/waves.svg) -7px -58px/95px}.bass_image.sawtooth{background:url(/img/waves.svg) -7px -174px/95px}.bass_image.triangle{background:url(/img/waves.svg) -7px -116px/95px}.basstype{width:100px;height:50px;cursor:pointer}.basstype:not(.active){opacity:.7}.basstype.active{opacity:1}.bass_type_name{font-size:8pt}.stepnotes_name{display:flex;flex-flow:column-reverse}.stepnotes_name .note{width:50px;height:20px;box-sizing:border-box;margin-top:10px}.stepnotes{position:relative;display:flex;flex-flow:column-reverse;justify-content:center}.stepnotes .note{width:50px;height:20px;border:1px solid #2d2d2d;box-sizing:border-box;cursor:pointer;margin-top:10px}.stepnotes .note:not(.active){background:#171717;background:linear-gradient(0deg,#171717,#393939)}.stepnotes .note.active{background:#67e8ff}.add{font-size:20pt;font-weight:700;color:#67e8ff}.pointer{cursor:pointer}.ffc{flex-flow:column}.gap10{gap:10px}.aic{align-items:center}.p10{padding:10px}.ml10{margin-left:10px}.mt10{margin-top:10px}.mixerblock{position:relative;width:50px;height:200px;margin-bottom:20px;margin-right:10px}.mixerblock .title{transform:rotate(270deg);margin-left:-40px;bottom:37px;position:absolute;width:100px}.fader{width:200px;position:absolute;top:40%;transform:rotate(270deg);margin-left:-60px;margin-top:15px}.ml5{margin-left:5px}.prev_drum_instrument,.next_drum_instrument{cursor:pointer}.value{text-align:center;font-size:10pt;color:#67e8ff;margin-top:5px}.road_track{padding:10px;background:#f5f5f5;border-radius:4px;margin-bottom:10px}.road_name{font-weight:700;min-width:80px}.road_patterns{min-height:40px;padding:10px;background:#fff;border-radius:4px;border:1px solid #ddd;flex-wrap:wrap}.road_pattern_block{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;margin:5px;background:#e0e0e0;border:2px solid #ccc;border-radius:4px;cursor:pointer;transition:all .2s ease;min-width:50px}.road_pattern_block:hover{background:#d0d0d0;border-color:#999}.road_pattern_block.active{border-color:#007bff;background:#e7f3ff}.road_pattern_block.playing{border-color:#28a745;background:#d4edda;box-shadow:0 0 10px #28a74580}.road_pattern_label{font-size:12px;font-weight:700}.road_pattern_remove{position:absolute;top:-8px;right:-8px;width:20px;height:20px;border-radius:50%;background:#dc3545;color:#fff;border:none;cursor:pointer;font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;transition:all .2s ease}.road_pattern_remove:hover{background:#c82333;transform:scale(1.1)}.road_empty{color:#999;font-style:italic;padding:10px;text-align:center}.road_position{font-size:14px;color:#666;font-weight:400}.road_modal_overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.road_modal{background:#fff;border-radius:8px;padding:0;max-width:600px;width:90%;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 4px 20px #0000004d}.road_modal_header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #ddd}.road_modal_header h3{margin:0;font-size:18px}.road_modal_close{background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease}.road_modal_close:hover{background:#f0f0f0;color:#333}.road_modal_content{padding:20px;overflow-y:auto}.road_modal_patterns{display:flex;flex-wrap:wrap;gap:10px}.road_modal_pattern_button{padding:10px 20px;background:#f8f9fa;border:2px solid #ddd;border-radius:4px;cursor:pointer;transition:all .2s ease;font-size:14px}.road_modal_pattern_button:hover{background:#e9ecef;border-color:#999}.road_modal_pattern_button.active{background:#007bff;color:#fff;border-color:#0056b3}