:root{--bg: #0b0e12;--rail: #0f1318;--surface: #151a20;--surface2: #1c222a;--line: #29313a;--text: #f2f6f7;--text-rgb: 242, 246, 247;--muted: #88939e;--danger: #ff6b70;--warn: #ffcc66;--accent-text: #06120f;--keycap-face: #20262d;--keycap-h-face: #20262d;--keycap-a-face: var(--color-primary);--keycap-side: #3a444e;--keycap-h-side: var(--color-primary);--keycap-a-side: var(--color-primary);--keycap-text: #dce3e8;--keycap-h-text: var(--color-primary);--keycap-a-text: var(--accent-text);--color-label-gray: #ededed;--color-label-darker: #ccc;--color-label-disable: var(--muted);--color-disable: var(--muted);--color-keycap: #20262d;--color-pop: #242424;--color-side: #1e1e1e;--color-side-gray: #1c1d1f;--color-danger: #cc0000;--color-success: #00a000;--color-orange: #ff8000;--color-grad-primary-white: rgba(var(--accent-rgb), .11);--color-secondary: #00d8d0;--trans-key: none;--fade-function: cubic-bezier(.23, 1, .32, 1);--anim-fade-in: fade-in .3s var(--fade-function) forwards;--anim-fade-out: fade-out .3s var(--fade-function) forwards;--anim-fade-in-down: fade-in-down .3s var(--fade-function) forwards;--anim-fade-out-up: fade-out-up .3s var(--fade-function) forwards;--anim-fade-in-zoom: fade-in-zoom .3s var(--fade-function) forwards;--anim-fade-out-zoom: fade-out-zoom .3s var(--fade-function) forwards;--color-primary: var(--accent);--color-label: var(--text);--color-bg: var(--bg);--color-keyboard-bg: var(--surface);--color-keycap-face: var(--keycap-face);--color-keycap-a-face: var(--keycap-a-face);--color-keycap-h-face: var(--keycap-h-face);--color-keycap-side: var(--keycap-side);--color-keycap-a-side: var(--keycap-a-side);--color-keycap-h-side: var(--keycap-h-side);--color-menu-icon-a-bg: none;--color-pane-bg: #1c1d1f;--color-select-bg: #1c1d1f;--color-button-hover-bg: var(--color-keycap);--color-connect-screen-bg: linear-gradient( 180deg, rgba(11, 14, 18, .08), rgba(11, 14, 18, .28) );--mask: color-mix(in srgb, var(--color-bg), transparent 30%)}html.light{--bg: #f3f5f7;--rail: #ffffff;--surface: #ffffff;--surface2: #edf1f4;--line: #d8dee4;--text: #182028;--text-rgb: 24, 32, 40;--muted: #687480;--accent-text: #07110f;--keycap-face: #e8edf1;--keycap-h-face: #e8edf1;--keycap-a-face: var(--accent);--keycap-side: #cbd3da;--keycap-h-side: var(--accent);--keycap-a-side: var(--color-primary);--keycap-text: #202830;--keycap-h-text: var(--accent);--keycap-a-text: #07110f;--color-connect-screen-bg: rgba(243, 245, 247, .16)}@keyframes dataFlow{0%{transform:translateY(0);opacity:0}25%{opacity:1}to{transform:translateY(calc(100vh + 80px));opacity:0}}@keyframes deviceScan{0%,10%{left:-4%;opacity:0}25%{opacity:.75}75%{opacity:.75}90%,to{left:104%;opacity:0}}@keyframes keyWave{0%,65%,to{border-color:var(--line);transform:translateY(0)}72%{border-color:var(--accent);transform:translateY(-2px)}80%{border-color:var(--line);transform:translateY(0)}}@keyframes buttonGlint{0%,55%{left:-50px}85%,to{left:220px}}@keyframes connectProgress{0%{width:0}to{width:100%}}@keyframes keyConnected{0%{background:var(--surface2)}50%{background:var(--accent);transform:translateY(-3px)}to{background:var(--surface2);border-color:var(--accent);transform:translateY(0)}}@keyframes screenOut{to{opacity:0;transform:scale(1.015)}}@keyframes modulePageIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes modulePanelIn{0%{opacity:0;transform:translateY(7px) scale(.995)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes titleSwitch{0%{opacity:.25;transform:translate(-6px)}to{opacity:1;transform:translate(0)}}@keyframes activeControlIn{0%{filter:brightness(.8);transform:scale(.97)}to{filter:brightness(1);transform:scale(1)}}@keyframes menuDropIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes home-keyboard{0%{background:var(--color-disable)}39%{background:var(--color-disable)}40%{background:var(--color-label)}60%{background:var(--color-label)}61%{background:var(--color-disable)}to{background:var(--color-disable)}}@keyframes home-cable{0%{transform:translateY(-40px)}26%{transform:translateY(-40px)}80%{transform:translateY(-5px)}to{transform:translateY(-5px)}}@keyframes rotate{0%{rotate:0deg}to{rotate:360deg}}@keyframes hueRotate{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:scaleY(.8)}70%{opacity:1}to{opacity:1;transform:scaleY(1)}}@keyframes fade-out-up{0%{opacity:1;transform:scaleY(1)}70%{opacity:0}to{opacity:0;transform:scaleY(.8)}}@keyframes fade-in-zoom{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes fade-out-zoom{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}@font-face{font-family:FiraCode-Medium;src:url(/fonts/FiraCode-Medium.ttf) format("opentype")}html,body{height:100%}body{position:relative;padding:0;-webkit-user-select:none;user-select:none;background:var(--bg);color:var(--text);font-family:Noto Sans SC,Noto Sans KR,Noto Sans JP,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-size:14px;margin:0;letter-spacing:0}:where(*){border-width:0px;border-style:solid;box-sizing:border-box;overflow-wrap:break-word}button,input,select{font:inherit}button{position:relative;z-index:1}button:active{transform:translateY(1px)}li{list-style:none}svg{display:block}*:focus{outline:none}#root{background:var(--color-bg);height:100%;width:100%;position:relative;min-width:1024px;min-height:760px}.custom-scrollbar::-webkit-scrollbar{width:5px;height:5px}.custom-scrollbar::-webkit-scrollbar-track{width:5px;height:5px;border-radius:5px;-webkit-box-shadow:none}.custom-scrollbar::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;background:var(--color-disable)}.custom-scrollbar::-webkit-scrollbar-corner{background:transparent}img{pointer-events:none}.spin{transform-origin:center;animation:spin 1s infinite linear;will-change:transform}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:.55}50%{opacity:1}}input[type=range]{width:100%;accent-color:var(--accent)}
