main{height:calc(100vh - 4.5rem)}#all-devices{height:calc(100vh - 11rem);min-height:60vh}.visualizer-toolbar .btn{box-shadow:0 0 12px rgba(95,232,255,0.15)}.visualizer-surface{position:relative;display:flex;align-items:flex-start;gap:2rem;padding:1.5rem;overflow:auto;color:#d7e6ff;background-color:#070b16;background-image:linear-gradient(transparent 95%,rgba(95,232,255,0.08) 95%),linear-gradient(90deg,transparent 95%,rgba(95,232,255,0.08) 95%),radial-gradient(circle at top right,rgba(95,232,255,0.15),transparent 55%);background-size:24px 24px,24px 24px,auto;border-radius:18px;border:1px solid rgba(95,232,255,0.2);box-shadow:inset 0 0 30px rgba(5,10,25,0.85),0 12px 30px rgba(2,8,20,0.65);--visualizer-link-color:rgba(95,232,255,0.45);--visualizer-link-width:1.25}.visualizer-canvas-surface{justify-content:center;align-items:center}.visualizer-canvas-surface canvas{width:100%;height:100%;border-radius:14px;border:1px solid rgba(95,232,255,0.2);background:radial-gradient(circle at top right,rgba(15,28,48,0.9),rgba(6,12,24,0.95))}.visualizer-surface.visualizer-capture{overflow:visible !important;scrollbar-width:none}.visualizer-surface.visualizer-capture::-webkit-scrollbar{display:none}.capture{overflow:visible !important;height:auto !important;max-height:none !important;background-color:#fff !important}.capture *{animation:none !important;transition:none !important}.capture::-webkit-scrollbar{display:none !important}.capture .mtconnect-container{backdrop-filter:none !important;filter:none !important}.visualizer-hide-data-items .mtconnect-data-items{display:none}.visualizer-collapse-components .mtconnect-component>.mtconnect-container{display:none}.mtconnect-components{position:relative;display:flex;flex-direction:row;gap:.8em;margin-bottom:1.5em}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px) scale(.95)}100%{opacity:1;transform:translateY(0) scale(1)}}.mtconnect-container{position:relative;display:flex;gap:1.5em;border:1px solid rgba(95,232,255,0.2);background:rgba(12,20,35,0.72);padding:.75rem;border-radius:14px;box-shadow:inset 0 0 20px rgba(6,12,28,0.9),0 10px 20px rgba(4,8,20,0.65)}.mtconnect-container canvas{position:absolute;top:0;left:0;pointer-events:none;z-index:0}.mtconnect-component,.mtconnect-component-name,.mtconnect-data-item-name{animation:fadeIn .4s ease-in-out}.mtconnect-component{position:relative;display:flex;flex-direction:column;z-index:1;border:1px solid rgba(95,232,255,0.08)}.mtconnect-component .mtconnect-component-name{position:relative;text-align:center;line-height:1.5em;padding:.65em 1.2em;margin-bottom:1.5em;font-size:1.15em;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:#d7e6ff;background:rgba(18,30,52,0.85);border:1px solid rgba(95,232,255,0.35);box-shadow:0 0 12px rgba(95,232,255,0.25),inset 0 0 18px rgba(5,10,22,0.8)}.mtconnect-component .mtconnect-component-name small{position:absolute;top:-1.2em;right:0;font-size:.55em;color:rgba(216,238,255,0.65);letter-spacing:.08em}.mtconnect-component[data-node-type='Device'] .mtconnect-component-name{border-color:rgba(95,232,255,0.7);box-shadow:0 0 18px rgba(95,232,255,0.5),inset 0 0 22px rgba(8,18,35,0.8);border-radius:16px}.mtconnect-component[data-node-type='Component'] .mtconnect-component-name{border-color:rgba(210,107,255,0.5)}.mtconnect-component[data-shape='chamfered'] .mtconnect-component-name{clip-path:polygon(0% 12px,12px 0%,calc(100% - 12px) 0%,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0% calc(100% - 12px))}.mtconnect-component[data-node-type='Controller'] .mtconnect-component-name{border-color:rgba(125,255,176,0.6)}.mtconnect-component[data-node-type='Axes'] .mtconnect-component-name{border-color:rgba(255,180,77,0.6)}.mtconnect-data-items{position:relative;display:flex;flex-direction:column}.mtconnect-data-items .mtconnect-data-item-name{position:relative;text-align:center;line-height:1.5em;padding:.5em 1em;margin-bottom:1.5em;transition:background-color .3s,box-shadow .3s,transform .3s;font-size:.95em;background:rgba(14,22,38,0.75);border:1px solid rgba(95,232,255,0.25);box-shadow:inset 0 0 12px rgba(4,8,18,0.8);color:#d7e6ff}.mtconnect-data-items .mtconnect-data-item-name[data-shape='capsule']{border-radius:999px}.mtconnect-data-items .mtconnect-data-item-name:hover{background-color:rgba(20,35,55,0.9);box-shadow:0 0 16px rgba(95,232,255,0.35);transform:translateY(-2px) scale(1.02);cursor:pointer}.mtconnect-data-items .mtconnect-data-item-name[data-category='CONDITION']{border-color:rgba(255,180,77,0.6);box-shadow:0 0 12px rgba(255,180,77,0.3)}.mtconnect-data-items .mtconnect-data-item-name[data-category='EVENT']{border-color:rgba(210,107,255,0.6);box-shadow:0 0 12px rgba(210,107,255,0.3)}.mtconnect-data-items .mtconnect-data-item-name[data-category='SAMPLE']{border-color:rgba(125,255,176,0.6);box-shadow:0 0 12px rgba(125,255,176,0.3)}.mtconnect-data-items .mtconnect-data-item-name[data-severity='ERROR']{border-color:rgb(var(--bs-danger-rgb));box-shadow:0 0 12px rgba(var(--bs-danger-rgb),0.6)}.mtconnect-data-items .mtconnect-data-item-name[data-severity='WARNING']{border-color:rgb(var(--bs-warning-rgb));box-shadow:0 0 12px rgba(var(--bs-warning-rgb),0.5)}.mtconnect-data-items .mtconnect-data-item-name[data-severity='FATAL']{border-color:rgb(var(--bs-danger-rgb));box-shadow:0 0 12px rgba(var(--bs-danger-rgb),0.75)}.mtconnect-data-items .mtconnect-data-item-name small{position:absolute;font-size:.55em;padding:.1em;color:rgba(216,238,255,0.65)}.mtconnect-data-items .mtconnect-data-item-name small.subtype{bottom:-1.1em;left:0;width:100%;font-size:.55em!important;text-align:center}.mtconnect-data-items .mtconnect-data-item-name small.category{top:-1.1em;left:0}.mtconnect-data-items .mtconnect-data-item-name small.name{top:-1.1em;right:0}.mtconnect-data-items .mtconnect-data-item-name small.exception-message-indicator{bottom:-0.1em;right:-0.1em;font-size:.85em;font-weight:800}.mtconnect-data-items .mtconnect-data-item-name small.exception-message-indicator::before{border-radius:50%}@media (max-width:768px){.mtconnect-component{flex:1 1 100%}.visualizer-surface{padding:1rem}}@media (min-width:769px) and (max-width:1024px){.mtconnect-component{flex:1 1 48%}}
.mapping-builder .mapping-builder-surface{min-height:70vh;height:calc(100vh - 14rem);width:100%}.mapping-builder .mapping-builder-sidebar{padding:1rem;border-radius:14px;background:rgba(12,20,35,.78);border:1px solid rgba(95,232,255,.2);color:#d7e6ff}.mapping-builder .mapping-builder-list{max-height:40vh;overflow-y:auto}
.mapping-builder .mapping-builder-surface canvas{width:100%;height:100%;display:block}