:root{--primary: #00e5ff;--bg-page: #050505;--bg-panel: rgba(10, 10, 15, .85);--border: #333;--text-main: #e0e0e0;--text-muted: #bbb;--text-heading: #fff;--btn-bg: #2a2a2a;--btn-hover: #444;--check-bg: #111;--check-border: #555;--check-mark: #000;--hint-bg: rgba(0,0,0,.8);--scroll-thumb: #444}body.light-mode{--primary: #007bb5;--bg-page: #e6edf2;--bg-panel: rgba(255, 255, 255, .85);--border: #ccc;--text-main: #333;--text-muted: #666;--text-heading: #111;--btn-bg: #eaeaea;--btn-hover: #d0d0d0;--check-bg: #fff;--check-border: #999;--check-mark: #fff;--hint-bg: rgba(255, 255, 255, .9);--scroll-thumb: #bbb}body{margin:0;overflow:hidden;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--bg-page);color:var(--text-main);-webkit-user-select:none;user-select:none;transition:background-color .3s,color .3s}#canvas-container{width:100vw;height:100vh;display:block;position:absolute;z-index:0}#ui-layer{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:flex;justify-content:space-between;padding:20px;box-sizing:border-box;z-index:1}.panel{pointer-events:auto;background:var(--bg-panel);border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:20px;border-radius:12px;box-shadow:0 8px 32px #0000004d;display:flex;flex-direction:column;transition:background .3s,border .3s}#filters-panel{width:320px;max-height:calc(100vh - 40px);overflow-y:auto}#info-panel{width:380px;height:fit-content;align-self:flex-end}.header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}h1{margin:0;font-size:20px;color:var(--primary);text-transform:uppercase;letter-spacing:1px;transition:color .3s}h2{margin:0 0 10px;font-size:18px;color:var(--text-heading)}h3{font-size:13px;color:var(--primary);margin:15px 0 8px;border-bottom:1px solid var(--border);padding-bottom:4px;text-transform:uppercase;letter-spacing:1px;transition:color .3s}p{font-size:14px;line-height:1.6;color:var(--text-muted);margin:0}.filter-group{display:flex;flex-direction:column;gap:8px}.filter-label{display:flex;align-items:center;cursor:pointer;font-size:13px;transition:color .2s}.filter-label:hover{color:var(--primary)}input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border:2px solid var(--check-border);border-radius:4px;margin-right:10px;cursor:pointer;position:relative;outline:none;background:var(--check-bg);transition:.2s}input[type=checkbox]:checked{background:var(--primary);border-color:var(--primary)}input[type=checkbox]:checked:after{content:"✔";position:absolute;color:var(--check-mark);font-size:12px;left:1px;top:-2px}.btn-group{display:flex;gap:10px;margin-bottom:10px}button{flex:1;background:var(--btn-bg);color:var(--text-main);border:1px solid var(--border);padding:8px;border-radius:6px;cursor:pointer;font-size:12px;transition:.2s;font-weight:600}button:hover{background:var(--btn-hover);border-color:var(--primary);color:var(--primary)}#theme-btn{flex:0 0 auto;padding:5px 10px;font-size:14px}#device-switch{flex-wrap:wrap}#device-switch button{flex:1 1 calc(33% - 8px);min-width:64px}#device-switch button.active{background:var(--primary);color:var(--check-mark);border-color:var(--primary)}.hint{position:absolute;bottom:20px;left:50%;transform:translate(-50%);background:var(--hint-bg);border:1px solid var(--border);padding:10px 20px;border-radius:20px;font-size:12px;pointer-events:none;color:var(--text-muted);letter-spacing:.5px;transition:background .3s,color .3s,border .3s}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border-radius:3px}