@import "https://fonts.googleapis.com/css?family=Open+Sans&display=swap";@import "https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Silkscreen:wght@400;700&family=VT323&display=swap";:root{--metro-accent-home:#d7c826;--metro-accent-blue:#1ba1e2;--metro-accent-magenta:#ff0097;--metro-accent-purple:#a200ff;--metro-accent-teal:#00aba9;--metro-accent-lime:#8cbf26;--metro-accent-brown:#960;--metro-accent-orange:#f09609;--metro-accent-red:#e51400;--metro-accent-green:#393;--primary-metro-accent:var(--metro-accent-blue);--background-dark:#1e1e1e;--tile-background:#00000069;--border-color:#555;--text-color-primary:#e0e0e0;--text-color-dark:#666;--text-color-secondary:#a0a0a0;--primary-metro-accent-rgb:27, 161, 226;--metro-accent-cyan:#0fc}body{background:var(--background-dark);color:var(--text-color-secondary);box-sizing:border-box;border-top:25px solid #000;min-height:100vh;margin:0;padding:0;font-family:Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;font-weight:300;line-height:1.4}.app-drawer-container{--s:133px;grid:auto-flow var(--s) / repeat(2, var(--s));place-items:center;gap:10px;max-width:none;margin:0;padding:0;transition:opacity .3s,transform .3s;display:grid;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)rotate(45deg)}.app-tile{aspect-ratio:1;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);background-color:var(--tile-background);text-align:center;cursor:pointer;backdrop-filter:blur(1px);flex-direction:column;justify-content:center;align-items:center;width:141%;padding:12px;transition:transform .2s ease-in-out;display:flex;position:relative;transform:rotate(-45deg)}.app-tile:after{content:"";background:var(--border-color);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);-webkit-mask-composite:xor;pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-composite:exclude;mask-mode:match-source,match-source}.app-tile:hover{transform:rotate(-45deg)scale(1.05)}.app-tile:hover:after{background:var(--primary-metro-accent)}.app-tile h2{letter-spacing:-.5px;color:var(--text-color-primary);margin:0;font-size:1.2rem;font-weight:200;line-height:1.4;transform:none}.accent{color:var(--metro-accent-home);font-weight:200}.modal{z-index:1000;backdrop-filter:blur(3px);background-color:#000000bf;width:100%;height:100%;display:none;position:fixed;top:0;left:0;overflow:auto}.modal-content{backdrop-filter:blur(12px);border:1px solid var(--border-color);width:100%;max-width:100%;height:95dvh;max-height:95dvh;box-shadow:none;color:var(--text-color-primary);text-align:left;background:#14141ceb;border-radius:0;flex-direction:column;margin:0;padding:0;display:flex;position:relative;overflow:hidden}.modal-content h3{flex-shrink:0;margin:0 5px 5px;font-weight:300}.modal-header-row{letter-spacing:-.5px;width:100%;color:var(--metro-accent-teal);text-transform:uppercase;justify-content:space-between;align-items:center;font-size:1.8rem;display:flex}.modal-header-row .title{letter-spacing:-.5px;color:var(--metro-accent-teal);text-transform:uppercase;text-align:left;flex-shrink:0;font-size:1.8rem}.modal-header-row .close{cursor:pointer;color:#aaa;text-align:right;flex-shrink:0;font-size:1.7rem;font-weight:300;line-height:1;position:static}.modal-header-row .title,.modal-header-row .close{flex:1}.modal-header-row .second,.modal-header-row .third{text-align:center;flex:none}.modal-header-row .close:hover{color:var(--metro-accent-blue)}.modal-bottom-bar{flex-shrink:0;margin:0 5px 5px;padding-top:0}.modal-content p{color:#a3a1a1;margin:.5rem 5px;font-size:1rem;line-height:1.1}.modal-content::-webkit-scrollbar{width:6px}.modal-content::-webkit-scrollbar-track{background:#0000004d}.modal-content::-webkit-scrollbar-thumb{background:var(--metro-accent-teal);border-radius:0}.close{cursor:pointer;color:#aaa;font-size:32px;font-weight:300;transition:color .2s;position:absolute;top:-3px;right:10px}.close:hover{color:var(--metro-accent-blue)}.modal-action-buttons{justify-content:space-between;align-items:center;gap:20px;margin-top:20px;display:flex}.modal-action-btn{background:rgba(var(--primary-metro-accent-rgb), .7);text-transform:uppercase;color:#fff;cursor:pointer;letter-spacing:1px;white-space:nowrap;border:none;border-radius:0;flex-shrink:0;padding:8px 24px;font-size:.9rem;font-weight:500;transition:all .2s}.modal-action-btn:hover{background:var(--primary-metro-accent);transform:translateY(-2px)}.slide-left{animation-name:slideInLeft}.slide-top{animation-name:slideInTop}.slide-right{animation-name:slideInRight}@keyframes slideInLeft{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes slideInTop{0%{opacity:0;transform:translateY(-120%)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}footer{backdrop-filter:blur(4px);color:#ccc;letter-spacing:.5px;z-index:99;justify-content:center;align-items:top;background-color:#000;width:100%;height:48px;padding:4px 0;font-size:.7rem;display:flex;position:fixed;bottom:0;left:0}footer p{margin:0;line-height:1}header{backdrop-filter:blur(8px);z-index:101;width:auto;height:33px;padding-top:max(8px, env(safe-area-inset-top));background-color:#000;border:1px solid #ffffff1a;border-top:none;border-bottom-right-radius:0;border-bottom-left-radius:0;justify-content:center;align-items:center;margin-top:-2px;padding:2px 8px 0;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:15px;left:50%;transform:translate(-50%)}header:hover{background-color:#000;border-color:#fdc9314d;height:35px;transform:translate(-50%)translateY(2px);box-shadow:0 4px 15px #0006}header p{letter-spacing:1px;margin:0;font-size:.75rem;line-height:1}.bottom-bar-system{z-index:10;pointer-events:none;justify-content:space-between;gap:80px;width:auto;display:flex;position:fixed;bottom:50px;left:50%;transform:translate(-50%)}.notch-container{backdrop-filter:blur(8px);z-index:10;pointer-events:auto;background-color:#000;border:1px solid #ffffff1a;border-bottom:none;border-top-left-radius:0;border-top-right-radius:0;justify-content:space-between;align-items:center;width:auto;min-width:55px;height:35px;margin-top:-2px;padding:2px 12px 0;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;bottom:48px;left:50%;transform:translate(-50%)}.notch-container:hover{cursor:pointer;background-color:#000;border-color:#fdc9314d;height:35px;transform:translate(-50%)translateY(-2px);box-shadow:0 -4px 15px #0006}#DK-logo{cursor:pointer;justify-content:center;align-items:center;width:40px;height:auto;transition:transform .2s;display:flex}#DK-logo:hover{transform:scale(1.05)}.legal-about-container{pointer-events:none;z-index:100;padding:0 30px;position:fixed;top:10px;left:50%;transform:translate(-50%)}.btn-legal{right:calc(100% + 50px);transform:translate(0)}.btn-about{left:calc(100% + 50px);transform:translate(0)}.notch-btn{background:var(--tile-background);backdrop-filter:blur(4px);color:var(--text-color-secondary);letter-spacing:0;cursor:pointer;white-space:nowrap;pointer-events:auto;text-transform:uppercase;border:1px solid #ffffff1a;border-radius:0;padding:3px 6px;font-family:Segoe UI,Roboto,sans-serif;font-size:.7rem;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s,background .2s}.notch-btn:hover{color:var(--metro-accent-home,#d7c826);background:#000;border-color:#fdc9314d}@media (width<=480px){.app-drawer-container{--s:100px;gap:8px}.app-tile h2{font-size:.8rem}.modal-content{margin:4% auto}.modal-header-row .title,.modal-header-row .second,.modal-header-row .third,.modal-header-row .close{font-size:1.7rem}.modal-action-buttons{gap:10px}.modal-action-btn{padding:8px 16px;font-size:.8rem}.modal-volume-wrapper{flex:1}#modalVolume{width:100%;max-width:none}.legal-about-container{justify-content:space-between;padding:0 60px}.notch-container{min-width:55px;bottom:48px}}.container-login{background-color:#0006;border-radius:0;padding:10px}.container-login h1{text-align:center;margin-bottom:30px}.container-login a{color:#add8e6;text-decoration:none}.btn{cursor:pointer;background:#add8e6;border:0;border-radius:5px;width:100%;padding:15px;font-family:inherit;font-size:16px;display:inline-block}.btn:focus{outline:0}.btn:active{transform:scale(.98)}.text{margin-top:30px}.form-control{width:100%;max-width:100%;margin:20px 0 40px;position:relative}.form-control input{color:#fff;z-index:100;background-color:#0000;border:0;border-bottom:2px solid #fff;width:100%;padding:15px 0;font-size:18px;display:block;position:relative}.form-control input:focus,.form-control input:valid{border-bottom-color:#add8e6;outline:0}.form-control label{pointer-events:none;white-space:nowrap;position:absolute;top:15px;left:0}.form-control label span{min-width:5px;font-size:18px;transition:all .3s cubic-bezier(.68,-.55,.265,1.55);display:inline-block}.form-control input:focus~label span,.form-control input:valid~label span{color:#add8e6;transform:translateY(-30px)}.modal-radio-container{flex-direction:column;align-items:center;gap:10px;margin:20px 0;display:flex}.modal-play-btn{background:var(--metro-accent-purple);color:#fff;cursor:pointer;text-transform:uppercase;letter-spacing:1px;border:none;min-width:100px;padding:8px 20px;font-family:monospace;font-size:14px;font-weight:700;transition:all .2s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.modal-play-btn:hover{background:var(--metro-accent-teal);transform:translate(-50%,-50%)scale(1.05)}.modal-play-btn:active{transform:translate(-50%,-50%)scale(.95)}.modal-volume-wrapper{color:#a4d4d6;flex-shrink:0;align-items:center;gap:30px;display:flex}.status-text{letter-spacing:1px;color:var(--text-color-secondary);font-family:Share Tech Mono,monospace;font-size:10px}#modalVolume{-webkit-appearance:none;background:rgba(var(--primary-metro-accent-rgb), .7);border-radius:px;outline:none;width:100%;max-width:180px;height:4px}#modalVolume::-webkit-slider-thumb{appearance:none;background:rgba(var(--primary-metro-accent-rgb), 1);cursor:pointer;border-radius:0;width:12px;height:12px}#modalVolume::-moz-range-thumb{background:rgba(var(--primary-metro-accent-rgb), .7);cursor:pointer;border-radius:50%;width:12px;height:12px}.square-image-container{aspect-ratio:1;background:#000;width:100%;margin-bottom:16px;position:relative;overflow:hidden}.square-image-container img{object-fit:cover;object-position:center;width:100%;height:100%}.media-badge{background:var(--background-dark);backdrop-filter:blur(1px);color:var(--metro-accent-teal);letter-spacing:-1px;text-transform:uppercase;z-index:20;white-space:nowrap;padding:8px 16px;font-family:monospace;font-size:1.2rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.image-overlay-text.vertical{height:100%;color:var(--text-color-secondary);writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:1px;backdrop-filter:blur(1px);background:#00000054;border-left:0 solid #fff3;justify-content:center;align-items:center;padding:0;font-family:monospace;font-size:.85rem;display:flex;position:absolute;top:0;right:0}.image-overlay-text.horizontal{color:#fff;text-align:left;background:0 0;max-width:75%;padding:0;font-family:Segoe UI,Open Sans,sans-serif;font-size:.75rem;font-weight:300;line-height:1.5;position:absolute;top:20px;left:5px}.image-overlay-text.horizontal p{box-decoration-break:clone;background:#000000bf;padding:0 5px;display:inline}.image-overlay-text.horizontal .accent{color:var(--metro-accent-home)}.nav-left,.nav-right{color:#fff9;cursor:pointer;z-index:10;justify-content:center;align-items:center;width:15%;height:100%;font-size:3rem;font-weight:300;transition:all .2s;display:flex;position:absolute;top:0}.nav-left:hover,.nav-right:hover{color:#fff;background:#0000004d}.nav-left{left:0}.nav-right{right:0}.tab-indicators{justify-content:center;gap:12px;margin-top:15px;margin-bottom:30px;display:flex}.tab-dot{background:rgba(var(--primary-metro-accent-rgb), .33);border:1px solid var(--border-color);cursor:pointer;width:20px;height:10px;transition:all .3s}.tab-dot.active{background:rgba(var(--primary-metro-accent-rgb), .7);border-color:#3ccfcf;box-shadow:0 0 8px #3ccfcf80}.tab-pane{animation:.3s fadeIn}.tab-pane.active-pane{display:block}.swipe-hint{text-align:center;color:#888;margin-top:16px;font-size:.7rem}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@media (width<=480px){.image-overlay-text.vertical{padding:12px 6px;font-size:.7rem}.nav-left,.nav-right{font-size:2.5rem}.tab-dot{width:16px;height:8px}.login-overlay-content{width:95%;padding:25px 15px}.form-control{margin:15px 0 30px}.form-control input{padding:12px 0;font-size:16px}.form-control label span{font-size:16px}.form-control input:focus~label span,.form-control input:valid~label span{transform:translateY(-25px)}.login-overlay-content h3{margin-bottom:15px;font-size:1.4rem}.login-buttons-row{gap:8px}.login-buttons-row .modal-action-btn{min-width:auto;padding:8px 12px;font-size:.75rem}.login-or-text{font-size:.75rem}.modal-action-btn{letter-spacing:.5px;padding:6px 12px;font-size:.7rem}.btn-legal{right:calc(100% + 20px)}.btn-about{left:calc(100% + 20px)}.slide-btn{padding:4px 8px;font-size:.6rem}}.login-overlay{backdrop-filter:blur(8px);z-index:2000;background:#000000f2;justify-content:center;align-items:center;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.login-overlay.active{display:flex}.login-overlay-content{border:1px solid var(--border-color);background:#14141cfa;width:90%;max-width:400px;padding:30px 20px;position:relative}.login-overlay-content h3{color:var(--metro-accent-teal);text-align:center;margin-bottom:20px}.login-overlay-close{cursor:pointer;color:#aaa;font-size:28px;position:absolute;top:10px;right:15px}.login-overlay-close:hover{color:var(--metro-accent-red)}.login-buttons-row{justify-content:space-between;align-items:center;gap:10px;margin-top:0;display:flex}.login-or-text{color:var(--text-color-secondary);text-transform:uppercase;letter-spacing:1px;flex-shrink:0;font-size:.9rem}.slide-btn{background:var(--tile-background);backdrop-filter:blur(4px);color:var(--text-color-secondary);letter-spacing:0;cursor:pointer;white-space:nowrap;pointer-events:auto;text-transform:uppercase;border:1px solid #ffffff1a;border-radius:0;padding:3px 6px;font-family:Segoe UI,Roboto,sans-serif;font-size:.7rem;transition:transform .3s cubic-bezier(.4,0,.2,1),opacity .3s,background .2s;position:absolute;top:-3px}.slide-btn:hover{color:var(--metro-accent-home,#d7c826);background:#000;border-color:#fdc9314d}#legalModal .modal-content a{color:var(--metro-accent-teal);text-decoration:none}#legalModal .modal-content a:hover{color:var(--metro-accent-home);text-decoration:underline}:root{--phone-w:340px;--phone-h:500px;--top-h:155px;--nav-h:60px;--label-h:20px;--display-w:200px;--display-h:108px}*{box-sizing:border-box}.phone{width:var(--phone-w);height:var(--phone-h);background-color:var(--background-dark);border-radius:5px;position:relative;left:50%;overflow:hidden;transform:translate(-50%)}.top-synth{height:var(--top-h);background-image:url(../synth/assets/gfx/ui/top-synth.png);background-repeat:no-repeat;justify-content:center;align-items:center;width:100%;display:flex;position:relative}.side-knob{width:38px;height:75px;position:absolute;top:50%;transform:translateY(-50%)}.side-knob svg{contain:strict}.knob-left{left:28px}.knob-right{right:28px;transform:translateY(-50%)scaleX(-1)}#big-knob-left:hover,#big-knob-right:hover{opacity:.85;cursor:pointer}.display{width:var(--display-w);height:var(--display-h);color:#b8b8b8;background:#000000e6;border:1px solid #333;flex-direction:column;padding:5px;display:flex;position:absolute;top:22px;left:50%;transform:translate(-50%)}.display-row{flex:1;justify-content:space-around;align-items:center;width:100%;display:flex}.small-txt{font-size:6pt}.large-txt{font-size:10pt}.adsr-box{border-top:1px solid #333;width:100%;height:25px;margin-top:2px}nav{top:var(--top-h);z-index:10;background-image:url(../synth/assets/gfx/ui/middle-synth.png);background-repeat:no-repeat;background-size:contain;width:100%;position:absolute}nav ul{height:var(--nav-h);margin:0;padding:0;list-style:none;display:flex}nav li{cursor:pointer;color:#c9c9c9;flex:1;justify-content:center;align-items:flex-end;padding-bottom:3px;transition:color .3s;display:flex;position:relative}nav li:first-child{margin-left:15px}nav li:last-child{margin-right:15px}nav li.active{color:var(--brand-purple)}.toggle-container{justify-content:center;align-items:center;width:40px;height:30px;display:flex;position:relative}.nav-svg{z-index:1;width:100%;height:100%;position:absolute}.ascii-icon{z-index:2;pointer-events:none;color:var(--border-color);margin-top:-2px;font-size:14px;font-weight:550;position:relative}nav li.active .ascii-icon{color:#8e44ad}.synth-labels{width:100%;height:var(--label-h);justify-content:space-around;align-items:center;display:flex;position:absolute;bottom:0}.synth-labels span{color:#b8b8b8;cursor:pointer;text-align:center;flex:1;font-size:10px;font-weight:700}.synth-labels span:hover{color:#8e44ad}.bottom-content{opacity:0;width:100%;bottom:0;top:calc(var(--top-h) + var(--nav-h));pointer-events:none;background-position:bottom;background-repeat:no-repeat;background-size:contain;transition:opacity .4s;position:absolute}.bottom-content.show{opacity:1;z-index:1;pointer-events:auto}.bottom-synth{background-image:url(../synth/assets/gfx/ui/bottom-synth.png)}.bottom-rythm{background-image:url(../synth/assets/gfx/ui/bottom-rythm.png)}#legal-grid{background-image:url(../synth/assets/gfx/ui/naked-bottom.png);background-repeat:no-repeat;overflow-y:auto}.bottom-recorder{background-image:url(../synth/assets/gfx/ui/bottom-recorder.png)}.bottom-recorder svg{text-rendering:optimizelegibility;pointer-events:auto;width:100%;height:100%;display:block}.recorder-action-btn{background:var(--metro-accent-teal);text-transform:uppercase;color:rgba(var(--text-color-primary), 1);cursor:pointer;letter-spacing:1px;white-space:nowrap;border:none;border-radius:0;flex-shrink:0;padding:5px;font-size:.7rem;font-weight:500;transition:all .2s;position:absolute;bottom:80px}.recorder-action-btn:hover{background:var(--metro-accent-home,#d7c826);color:#1e1e1e}.replay-action-btn{background:var(--metro-accent-teal);text-transform:uppercase;color:rgba(var(--text-color-primary), 1);cursor:pointer;letter-spacing:1px;white-space:nowrap;border:none;border-radius:0;flex-shrink:0;padding:5px;font-size:.7rem;font-weight:500;transition:all .2s;position:absolute;bottom:80px;right:0}.replay-action-btn:hover,.replay-action-btn.active{background:var(--metro-accent-home,#d7c826);color:#1e1e1e}.toggle-container.mini{cursor:pointer;color:#c9c9c9;justify-content:center;align-items:center;width:40px;height:30px;display:flex;position:relative}.bottom-synth svg{width:100%;height:100%;display:block}.bottom-synth svg [id^=knob],.bottom-synth svg [id^=button],.bottom-rythm svg [id^=pad],.bottom-recorder svg [id^=switch]{cursor:pointer;transition:filter .1s;pointer-events:auto!important}.bottom-synth svg [id^=knob]:hover,.bottom-rythm svg [id^=pad]:hover,.bottom-recorder svg [id^=switch]:hover{filter:brightness(1.4)}.bottom-recorder svg [id^=switch]:active{filter:brightness(.8);transform:translateY(1px)}.bottom-rythm svg{text-rendering:optimizelegibility;width:100%;height:100%;display:block}.container{flex-wrap:wrap;justify-content:center;padding:10px;display:flex}.square{background-color:var(--text-color-primary);width:16px;height:16px;margin:2px;transition:all .6s;box-shadow:0 0 1px #000}.square:hover{transition-duration:0s}.square.active{background:var(--metro-accent-home,#ffc724);box-shadow:0 0 6px var(--metro-accent-home,#ffc724);transition-duration:0s}.square.channel-selector{opacity:.4;cursor:pointer}.square.channel-selected{box-shadow:0 0 6px var(--metro-accent-teal,#00bcd4);opacity:1;transition-duration:0s;background:var(--metro-accent-teal,#00bcd4)!important}#bottom-midi{height:calc(var(--phone-h) - var(--top-h) - var(--nav-h));background-image:url(../synth/assets/gfx/ui/naked-bottom.png);background-repeat:no-repeat;overflow-y:auto}#bottom-midi .tab-content{flex:1;padding:20px;overflow-y:auto}#bottom-midi .midi-tabs{background:#00000080;border-top:1px solid #2a2a2a;flex-shrink:0}.midi-tabs ul{list-style:none;display:flex}.midi-tabs li{text-align:center;color:#666;cursor:pointer;flex:1;padding:12px 0;font-size:11px}.midi-tabs li.active{color:#00aba9;background:#00aba91a;border-top:2px solid #00aba9}.tab-pane.active{display:block}.setting-group{margin-bottom:24px}.setting-label{color:#888;margin-bottom:8px;font-size:10px;display:block}.toggle-switch{cursor:pointer;background:#0006;border:1px solid #333;align-items:center;gap:12px;padding:12px;display:flex}.toggle-switch .toggle-track{background:#333;border-radius:12px;width:44px;height:24px;position:relative}.toggle-switch .toggle-track:after{content:"";background:#666;border-radius:50%;width:20px;height:20px;transition:all .2s;position:absolute;top:2px;left:2px}.toggle-switch.active .toggle-track{background:#00aba9}.toggle-switch.active .toggle-track:after{background:#1a1a1a;left:22px}.bpm-display{background:#0006;border:1px solid #333;padding:12px}.bpm-input-row{justify-content:center;align-items:center;gap:12px;display:flex}#bpm-value{color:#00aba9;text-align:center;background:#1a1a1a;border:1px solid #444;width:100px;padding:8px;font-size:24px}.dropdown{color:#ccc;background:#0006;border:1px solid #333;width:100%;padding:10px}.channel-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.channel-item{background:#0006;border:1px solid #333;justify-content:space-between;padding:10px;display:flex}.channel-item input{color:#00aba9;text-align:center;background:#1a1a1a;border:1px solid #444;width:50px}.log-area{background:#0009;border:1px solid #333;height:160px;padding:10px;font-size:10px;overflow-y:auto}.log-entry{color:#fff!important}.log-entry .time{color:#00aba9!important}.log-entry .text{color:#fff!important}.status-item{color:#8cbf26;background:#0006;border:1px solid #333;align-items:center;gap:10px;padding:10px;display:flex}.status-dot{border-radius:50%;width:8px;height:8px}.status-dot.green{background:#8cbf26}.last-message{color:#00aba9;background:#0006;border:1px solid #333;padding:12px;font-size:11px}.btn{color:#00aba9;cursor:pointer;background:#00aba933;border:1px solid #00aba9;width:100%;padding:8px;font-size:11px}.btn:hover{color:#1a1a1a;background:#00aba9}#bottom-midi::-webkit-scrollbar{width:3px}#bottom-midi::-webkit-scrollbar-track{background:#1a1a1a}#bottom-midi::-webkit-scrollbar-thumb{background:#00aba9;border-radius:0}.log-area::-webkit-scrollbar{width:3px}.log-area::-webkit-scrollbar-track{background:#1a1a1a}.log-area::-webkit-scrollbar-thumb{background:#00aba9}#looper-controls{justify-content:center;align-items:center;gap:12px;width:99%;padding:16px;display:flex;position:absolute;bottom:-120px}#looper-controls button{color:#acacac;cursor:pointer;letter-spacing:1px;white-space:nowrap;background:0 0;border:none;border-radius:0;width:100%;height:40px;padding:0 5px;font-family:Share Tech Mono,monospace;font-size:.9rem;transition:background .15s}#looper-controls button:hover{background:#24b2ff15}#looper-controls button:last-child{background:0 0}#looper-controls button:last-child:hover{background:#b00f0015}.avatar-grid{align-items:center;gap:5px;display:flex}.avatar-slot{background:#0003;border:1px solid #0fc;justify-content:center;align-items:center;width:30px;height:30px;font-size:20px;display:flex}.avatar-slot.empty{color:#00ffcc4d;border:1px dashed #00ffcc4d}.lock-header-row{background:0 0;justify-content:space-between;align-items:center;width:100%;display:flex}.lock-header-row .left{letter-spacing:-.5px;color:var(--text-color-primary);text-transform:uppercase;font-size:1.8rem}.lock-header-row .middle{flex:1}.lock-header-row .right{cursor:pointer;color:var(--text-color-primary);font-size:32px;font-weight:300;line-height:1;position:static}.lock-header-row .left:hover,.lock-header-row .right:hover{color:var(--metro-accent-home)}.lock-action-btn{background:var(--metro-accent-teal);text-transform:uppercase;color:rgba(var(--text-color-primary), 1);cursor:pointer;letter-spacing:1px;white-space:nowrap;border:none;border-radius:0;flex-shrink:0;padding:5px;font-size:.7rem;font-weight:500;transition:all .2s}#lock-plate{text-align:center;background:linear-gradient(#eee 0%,#949ba0 100%);border:1px solid #cfd3d6;border-radius:0;width:255px;margin:0 auto;padding:8px 0;position:relative;box-shadow:0 1px #0009}#lock-plate span{background:#bdc1c4;border-radius:10px;width:5px;height:5px;display:block;position:absolute;box-shadow:inset 0 1px #0009,inset 0 -1px #fffc}#lock-plate span:first-child{top:2px;left:2px}#lock-plate span:nth-child(2){top:2px;right:2px}#lock-plate span:nth-child(3){bottom:2px;left:2px}#lock-plate span:nth-child(4){bottom:2px;right:2px}#lock-wrapper{background:linear-gradient(#c4c4c4 0%,#676767 100%);border:1px solid #fff9;border-radius:0;width:100%;height:35px;margin:0 auto;padding:0;overflow:hidden;box-shadow:inset 0 0 15px #000000e6}.welcome-message{color:#fff;width:400px;height:60px;margin-top:-45px;margin-left:-200px;font-family:Arial,Helvetica,sans-serif;font-size:70px;font-weight:700;display:none;position:absolute;top:50%;left:50%}.lock-dial{float:left;cursor:move;background:linear-gradient(#8c9093 0%,#b6babd 9%,#ccd2d6 18%,#fff 55%,#ccd2d6 82%,#b6babd 91%,#8c9093 100%);width:20px;height:35px;margin-left:5px;position:relative;box-shadow:0 0 5px #000c}#lock-wrapper .lock-dial ul{text-align:center;color:#414f6b;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;margin-top:10px;padding:0;font-size:15px;line-height:18px;list-style:none;transition:box-shadow .45s linear,color .25s linear}#lock-wrapper.unlocked .lock-dial ul{color:green;text-shadow:0 0 2px #3f3}#synth-waveform,#bass-waveform,#slicer-waveform{pointer-events:none;background:#000;width:96%;height:40%;display:none;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}#three-container{z-index:0;pointer-events:auto;width:100vw;height:100vh;position:fixed;top:0;left:0}.camera-label-container{backdrop-filter:blur(10px);z-index:100;background:#000000b3;border:1px solid #ffffff1a;border-radius:0;align-items:center;gap:16px;padding:10px 20px;animation:.5s fadeIn;display:flex;position:fixed;bottom:120px;left:50%;transform:translate(-50%)}.camera-label{color:#0fc;letter-spacing:2px;font-family:monospace;font-size:14px}.camera-home-btn{color:#fff;cursor:pointer;background:#ffffff1a;border:1px solid #fff3;border-radius:0;padding:4px 12px;font-family:monospace;font-size:12px;transition:all .3s}.camera-home-btn:hover{background:#fff3;border-color:#0fc}.tab-dot{cursor:pointer;transition:all .3s}.tab-dot:hover{opacity:.8;transform:scale(1.2)}.nav-left,.nav-right{cursor:pointer;z-index:10;user-select:none;color:#ffffffb3;font-size:3rem;transition:color .3s}.nav-left:hover,.nav-right:hover{color:#0fc}.modal-content{flex-direction:column;max-height:95vh;display:flex;overflow:hidden}.modal-content h3,.modal-content .tab-indicators,.modal-content .modal-bottom-bar{flex-shrink:0}.panorama-scroll{scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;flex:1;width:100%;min-height:0;overflow:auto hidden}.panorama-track{flex-flow:row;gap:0;width:100%;height:100%;padding:0;display:flex}.panorama-track .tab-pane{scroll-snap-align:start;box-sizing:border-box;flex-direction:column;flex:0 0 100%;min-width:100%;max-width:100%;height:100%;padding:0 10px;display:flex;overflow-y:auto}.modal-header{border-bottom:1px solid #ffffff0f;flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 24px 8px;display:flex}.modal-header-title{letter-spacing:-1px;color:var(--metro-accent-teal);font-family:"Press Start 2P",monospace;font-size:14px;font-weight:300;line-height:1}.modal-header-sub{letter-spacing:-1px;color:var(--text-color-secondary);margin-left:12px;font-family:VT323,monospace;font-size:20px;font-weight:300;line-height:1}.modal-label{letter-spacing:-1px;text-transform:uppercase;margin:0;font-family:"Press Start 2P",monospace;font-size:14px;font-weight:700;line-height:1.3}.modal-body{letter-spacing:-1px;color:var(--text-color-secondary);margin:5px 0 0;font-family:VT323,monospace;line-height:1.15;font-size:20px!important}.modal-tagline{letter-spacing:-1px;color:var(--text-color-secondary);font-family:VT323,monospace;line-height:1;font-size:18px!important}.panorama-scroll{-webkit-overflow-scrolling:touch;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;flex:1;min-height:0;overflow:auto hidden}.panorama-scroll::-webkit-scrollbar{display:none}.panorama-panel{background:var(--metro-accent-cyan);flex-shrink:0;width:1080px;height:800px;position:relative;overflow:hidden}.panel-bg{background-position:50%;background-size:cover;width:100%;height:102.2%;position:absolute;top:-1.1%;left:0}.panel-dark{background:#1a1a1a;position:absolute}.panel-image,.panel-player{background-position:50%;background-size:cover;position:absolute}.panel-text{position:absolute}.panel-overlay-teal{background:#12978480;position:absolute}.panel-overlay-red{background:#db251a80;position:absolute}.panel-yellow{background:#d4be7c;position:absolute}.panel-video{background:#666;border:1px solid #ffffff1a;position:absolute;overflow:hidden}.panel-video:before{content:"● LIVE";color:#ff0040;letter-spacing:1px;z-index:2;background:#000000b3;padding:2px 8px;font-family:VT323,monospace;font-size:11px;position:absolute;top:6px;left:8px}.panel-video:after{content:"field feed";color:#fff3;letter-spacing:2px;text-transform:uppercase;z-index:2;font-family:VT323,monospace;font-size:10px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.panel-copyright{color:#ff0040;letter-spacing:0;z-index:2;background:#000000b3;padding:2px 8px;font-family:monospace;font-size:11px;position:absolute;bottom:0;right:0}.modal-bottom-bar{background:#0003;border-top:1px solid #ffffff08;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 12px;display:flex}.bottom-left{align-items:center;gap:8px;display:flex}.vol-label{color:var(--text-color-secondary);letter-spacing:1px;font-family:VT323,monospace;font-size:20px}.vol-slider{cursor:pointer;accent-color:#e8e0d4;width:120px}.modal-status{color:var(--metro-accent-lime);text-transform:uppercase;letter-spacing:1px;background:#0d0d0dba;border:none;padding:0 5px;font-size:12px}.close{cursor:pointer;color:#aaa;font-size:32px;line-height:1}.metro-grid-view{box-sizing:border-box;text-transform:uppercase;grid-template-columns:repeat(2,1fr);gap:10px;max-height:96%;padding:15px 20px 25px;font-family:VT323,monospace;display:grid;overflow-y:auto}.metro-tile{cursor:pointer;text-transform:uppercase;background:#111;border:2px solid #0000;font-family:VT323,monospace;transition:transform .2s,border-color .2s;position:relative;overflow:hidden}.metro-tile:hover{border-color:var(--metro-accent-teal,#00f0ff)}.metro-tile:active{transform:scale(.96)}.metro-tile img{object-fit:cover;width:100%;height:100%;display:block}.metro-tile.small{aspect-ratio:1;grid-column:span 1}.metro-tile.wide{aspect-ratio:2;grid-column:span 2}.metro-tile.big{aspect-ratio:1;grid-column:span 2}.tile-label{pointer-events:none;background:linear-gradient(#0000 40%,#000000d9 100%);flex-direction:column;justify-content:flex-end;padding:10px;display:flex;position:absolute;inset:0}.tile-title{color:#fff;letter-spacing:1px;text-transform:uppercase;font-family:VT323,monospace;font-size:20px;line-height:1}.tile-sub{color:var(--metro-accent-teal,#00f0ff);text-transform:uppercase;font-family:Silkscreen,monospace;font-size:9px}.metro-expanded-view{text-transform:uppercase;flex-direction:column;gap:15px;padding:10px 20px 25px;font-family:VT323,monospace;animation:.3s cubic-bezier(.16,1,.3,1) forwards expandIn;display:flex}@keyframes expandIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.back-btn{border:1px solid var(--metro-accent-teal,#00f0ff);color:var(--metro-accent-teal,#00f0ff);cursor:pointer;text-transform:uppercase;background:0 0;align-self:flex-start;padding:6px 12px;font-family:"Press Start 2P",monospace;font-size:10px}.back-btn:hover{background:var(--metro-accent-teal,#00f0ff);color:#000}.horizontal-scroll-gallery{scroll-snap-type:x mandatory;gap:12px;padding-bottom:8px;display:flex;overflow-x:auto}.horizontal-scroll-gallery img{object-fit:cover;scroll-snap-align:start;border-radius:4px;flex-shrink:0;width:auto;height:220px}.project-info-panel{border-left:3px solid var(--metro-accent-teal,#00f0ff);text-transform:uppercase;background:#111;padding:15px;font-family:VT323,monospace;font-size:18px}.metro-grid-view::-webkit-scrollbar{width:3px;height:3px}.horizontal-scroll-gallery::-webkit-scrollbar{width:3px;height:3px}.metro-grid-view::-webkit-scrollbar-track{background:#0000004d}.horizontal-scroll-gallery::-webkit-scrollbar-track{background:#0000004d}.metro-grid-view::-webkit-scrollbar-thumb{background:var(--metro-accent-teal);border-radius:0}.horizontal-scroll-gallery::-webkit-scrollbar-thumb{background:var(--metro-accent-teal);border-radius:0}.metro-grid-view,.horizontal-scroll-gallery{scrollbar-width:thin;scrollbar-color:var(--metro-accent-teal) #0000004d}.welcome-overlay{backdrop-filter:blur(8px);z-index:999999;background:#000000d9;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .5s;display:flex;position:fixed;top:0;left:0}.welcome-card{text-align:center;color:#fff;background:#111;border:1px solid #00aba9;max-width:400px;padding:2rem;font-family:VT323,monospace}.welcome-btn{color:#fff;cursor:pointer;background:#00aba9;border:none;margin-top:1.5rem;padding:10px 20px;font-family:VT323,monospace;font-weight:700;transition:background .2s}.welcome-btn:hover{color:#000;background:#f1c40f}.tour-overlay{z-index:99998;pointer-events:none;width:100vw;height:100vh;display:none;position:fixed;top:0;left:0}.tour-overlay.active{display:block}.tour-highlight{z-index:99999;border:3px solid var(--metro-accent-teal,#00aba9);pointer-events:none;opacity:0;border-radius:6px;transition:all .4s cubic-bezier(.25,.46,.45,.94);position:fixed;box-shadow:0 0 0 9999px #000000bf,inset 0 0 20px #00aba91a}.tour-highlight.show{opacity:1}.tour-highlight:after{content:"";border:2px solid #00aba94d;border-radius:8px;animation:1.5s ease-in-out infinite tourPulse;position:absolute;inset:-6px}@keyframes tourPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.05)}}.tour-tooltip{z-index:100000;color:#e0e0e0;border:1px solid var(--metro-accent-teal,#00aba9);pointer-events:auto;cursor:pointer;opacity:0;background:#1a1a1a;border-radius:8px;max-width:360px;padding:20px 24px;font-family:VT323,monospace;font-size:14px;line-height:1.6;transition:all .3s;position:fixed;transform:translateY(10px);box-shadow:0 8px 32px #0009}.tour-tooltip.show{opacity:1;transform:translateY(0)}.tour-tooltip:before{content:"";border-left:8px solid #0000;border-right:8px solid #0000;border-bottom:8px solid var(--metro-accent-teal,#00aba9);position:absolute;top:-8px;left:50%;transform:translate(-50%)}.tour-tooltip.bottom:before{border-bottom:none;border-top:8px solid var(--metro-accent-teal,#00aba9);top:auto;bottom:-8px}.tour-step-number{color:var(--metro-accent-teal,#00aba9);letter-spacing:1px;margin-bottom:6px;font-size:12px;font-weight:700;display:inline-block}.tour-step-text{margin-bottom:12px}.tour-next-hint{color:#f1c40f;letter-spacing:.5px;align-items:center;gap:8px;font-size:12px;display:flex}.tour-next-hint:after{content:"→";animation:1s ease-in-out infinite tourArrowBounce}@keyframes tourArrowBounce{0%,to{transform:translate(0)}50%{transform:translate(4px)}}.tour-progress{z-index:100001;opacity:0;gap:8px;transition:opacity .3s;display:flex;position:fixed;bottom:30px;left:50%;transform:translate(-50%)}.tour-progress.show{opacity:1}.tour-dot{cursor:pointer;pointer-events:auto;background:#fff3;border:1px solid #ffffff1a;border-radius:50%;width:10px;height:10px;transition:all .3s}.tour-dot.active{background:var(--metro-accent-teal,#00aba9);border-color:var(--metro-accent-teal,#00aba9);transform:scale(1.2)}.tour-dot:hover{background:#00aba980}.tour-exit{z-index:100001;color:#fff;cursor:pointer;pointer-events:auto;background:#000c;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:20px;transition:all .2s;display:none;position:fixed;top:20px;right:20px}.tour-exit.show{display:flex}.tour-exit:hover{background:#ff00004d;border-color:#f44;transform:scale(1.1)}.stream-status{color:#00aba9;align-items:center;gap:8px;font-family:monospace;font-size:11px;display:flex}.stream-dot{background:#f04;border-radius:50%;width:8px;height:8px;animation:1s ease-in-out infinite streamPulse}@keyframes streamPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.8)}}#calendarModal .modal-content{background:var(--background-dark);max-width:420px;padding:0}.cal-header-bar{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:16px 20px 12px;display:flex}.cal-header-bar .cal-title{letter-spacing:1px;color:var(--metro-accent-teal);font-family:"Press Start 2P",monospace;font-size:14px}.cal-header-bar .close{font-size:24px;position:static}.cal-week-grid{border-bottom:1px solid var(--border-color);background:var(--background-secondary);grid-template-columns:repeat(7,1fr);padding:8px 12px 4px;display:grid}.cal-weekday{text-align:center;color:var(--text-muted);letter-spacing:.5px;padding:4px 0;font-family:"Press Start 2P",monospace;font-size:9px}.cal-month-nav{justify-content:space-between;align-items:center;padding:12px 16px 8px;display:flex}.cal-month-nav .month-label{color:var(--text-primary);letter-spacing:.5px;font-family:"Press Start 2P",monospace;font-size:12px}.cal-month-nav .nav-btn{border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;background:0 0;padding:4px 12px;font-family:VT323,monospace;font-size:16px;transition:all .2s}.cal-month-nav .nav-btn:hover{border-color:var(--metro-accent-teal);color:var(--metro-accent-teal)}.cal-days-grid{grid-template-columns:repeat(7,1fr);gap:3px;padding:4px 12px 12px;display:grid}.cal-day-cell{aspect-ratio:1;color:var(--text-primary);background:var(--background-secondary);cursor:pointer;border-radius:2px;flex-direction:column;justify-content:center;align-items:center;min-height:36px;font-family:VT323,monospace;font-size:18px;transition:all .15s;display:flex;position:relative}.cal-day-cell:hover{background:var(--background-hover);transform:scale(1.05)}.cal-day-cell.empty{cursor:default;background:0 0}.cal-day-cell.empty:hover{transform:none}.cal-day-cell.today{border:2px solid var(--metro-accent-teal)}.cal-day-cell.has-messages{background:var(--background-tertiary)}.cal-day-cell .dot-indicator{flex-wrap:wrap;justify-content:center;gap:1px;width:100%;padding:0 2px;display:flex;position:absolute;bottom:2px}.cal-day-cell .dot-indicator .square-dot{background:var(--metro-accent-teal);flex-shrink:0;width:3px;height:3px}.cal-day-cell .dot-indicator .dot-extra{color:var(--metro-accent-teal);font-family:VT323,monospace;font-size:6px;line-height:1}.cal-view-toggle{border-top:1px solid var(--border-color);gap:4px;padding:8px 16px;display:flex}.cal-view-toggle button{border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;letter-spacing:.5px;background:0 0;flex:1;padding:6px 0;font-family:"Press Start 2P",monospace;font-size:8px;transition:all .2s}.cal-view-toggle button.active{border-color:var(--metro-accent-teal);color:var(--metro-accent-teal);background:#00aba91a}.cal-view-toggle button:hover{border-color:var(--metro-accent-teal);color:var(--metro-accent-teal)}.cal-cards-container{flex-direction:column;flex:1;gap:8px;min-height:200px;max-height:400px;padding:12px 16px;display:flex;overflow-y:auto}.cal-card{background:var(--background-card);border:1px solid var(--border-color);padding:10px 14px;transition:all .15s}.cal-card:hover{border-color:var(--metro-accent-teal);transform:translate(2px)}.cal-card .card-from{color:var(--metro-accent-teal);letter-spacing:.5px;font-family:"Press Start 2P",monospace;font-size:8px}.cal-card .card-text{color:var(--text-primary);margin-top:2px;font-family:VT323,monospace;font-size:16px;line-height:1.3}.cal-card .card-time{color:var(--text-muted);margin-top:2px;font-family:VT323,monospace;font-size:12px}.cal-empty{color:var(--text-muted);text-align:center;padding:40px 20px;font-family:VT323,monospace;font-size:18px}.cal-filters{border-top:1px solid var(--border-color);flex-wrap:wrap;gap:4px;padding:8px 16px;display:flex}.cal-filter-pill{background:var(--background-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;padding:2px 10px;font-family:VT323,monospace;font-size:14px;transition:all .15s}.cal-filter-pill:hover{border-color:var(--metro-accent-teal);color:var(--text-primary)}.cal-filter-pill.active{border-color:var(--metro-accent-teal);color:var(--metro-accent-teal);background:#00aba91a}.cal-filter-pill .count{color:var(--text-muted);margin-left:4px;font-size:12px}.cal-filter-pill.active .count{color:var(--metro-accent-teal)}#calendarModal .cal-cards-container::-webkit-scrollbar{width:3px}#calendarModal .cal-cards-container::-webkit-scrollbar-track{background:var(--background-secondary)}#calendarModal .cal-cards-container::-webkit-scrollbar-thumb{background:var(--metro-accent-teal)}