:root{--bg-color: #0f111a;--bg-panel: rgba(22, 26, 43, .7);--bg-card: rgba(30, 36, 62, .5);--border-color: rgba(255, 255, 255, .08);--border-focus: #5d6cf0;--text-primary: #f1f3f9;--text-secondary: #8b92b6;--text-muted: #53597d;--color-primary: #5d6cf0;--color-primary-hover: #4c5ad9;--color-accent: #00f2fe;--color-accent-hover: #00d2de;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--color-danger-hover: #dc2626;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .2);--shadow-md: 0 8px 24px rgba(0, 0, 0, .3);--shadow-lg: 0 16px 48px rgba(0, 0, 0, .4);--backdrop-blur: blur(12px);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--transition-fast: .15s ease;--transition-normal: .25s ease;--type-server: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);--type-switch: linear-gradient(135deg, #0d9488 0%, #115e59 100%);--type-router: linear-gradient(135deg, #0284c7 0%, #0369a1 100%);--type-security: linear-gradient(135deg, #b91c1c 0%, #7f1d1d 100%);--type-ups: linear-gradient(135deg, #d97706 0%, #92400e 100%);--type-pdu: linear-gradient(135deg, #4b5563 0%, #374151 100%);--type-shelf: linear-gradient(135deg, #7c3aed 0%, #5b21b6 100%);--type-pc: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);--type-other: linear-gradient(135deg, #6b7280 0%, #4b5563 100%)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-color);color:var(--text-primary);min-height:100vh;overflow:hidden;position:relative}.bg-glow{position:absolute;border-radius:50%;filter:blur(140px);opacity:.12;pointer-events:none;z-index:0}.bg-glow-1{width:500px;height:500px;background:var(--color-primary);top:-100px;right:-50px}.bg-glow-2{width:600px;height:600px;background:var(--color-accent);bottom:-150px;left:-100px}.app-container{display:flex;flex-direction:column;height:100vh;position:relative;z-index:1}.app-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--bg-panel);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border-bottom:1px solid var(--border-color);gap:24px}.brand{display:flex;align-items:center;gap:12px}.logo-icon{background:linear-gradient(135deg,var(--color-primary),var(--color-accent));color:#fff;width:42px;height:42px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 15px #5d6cf066}.brand-text h1{font-size:1.25rem;font-weight:700;letter-spacing:-.5px;background:linear-gradient(to right,#fff,#c5ccff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.brand-text p{font-size:.75rem;color:var(--text-secondary)}.global-stats{display:flex;gap:16px}.stat-card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:8px 16px;display:flex;flex-direction:column;min-width:120px}.stat-label{font-size:.7rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:1.05rem;font-weight:600;color:var(--text-primary);margin-top:2px}.header-actions{display:flex;align-items:center;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:var(--radius-sm);font-family:inherit;font-size:.85rem;font-weight:550;cursor:pointer;border:none;transition:all var(--transition-fast) ease;color:#fff}.btn-primary{background:var(--color-primary)}.btn-primary:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #5d6cf033}.btn-secondary{background:var(--bg-card);border:1px solid var(--border-color)}.btn-secondary:hover{background:#28305099;border-color:var(--text-secondary)}.btn-accent{background:linear-gradient(135deg,#00c6ff,#0072ff)}.btn-accent:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 4px 12px #00c6ff33}.btn-danger-outline{background:transparent;border:1px solid rgba(239,68,68,.4);color:var(--color-danger);padding:10px}.btn-danger-outline:hover{background:#ef44441a;border-color:var(--color-danger)}.btn-block{width:100%}.app-body{display:flex;flex:1;overflow:hidden;height:calc(100vh - 75px)}.sidebar{width:340px;background:var(--bg-panel);-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);border-right:1px solid var(--border-color);display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.sidebar-tabs{display:flex;border-bottom:1px solid var(--border-color);background:#0f111a66}.tab-btn{flex:1;padding:14px;background:transparent;border:none;color:var(--text-secondary);font-family:inherit;font-size:.9rem;font-weight:600;cursor:pointer;transition:all var(--transition-fast);border-bottom:2px solid transparent}.tab-btn:hover{color:var(--text-primary);background:#ffffff05}.tab-btn.active{color:var(--color-primary);border-bottom-color:var(--color-primary);background:#5d6cf00d}.tab-content{display:none;flex-direction:column;flex:1;overflow-y:auto;padding:16px}.tab-content.active{display:flex}.search-box{position:relative;margin-bottom:16px}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-secondary);pointer-events:none}.search-box input{width:100%;background:#0f111a99;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:10px 12px 10px 38px;color:#fff;font-family:inherit;font-size:.85rem;transition:border-color var(--transition-fast)}.search-box input:focus{outline:none;border-color:var(--color-primary)}.library-accordion{display:flex;flex-direction:column;gap:12px}.accordion-item{border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--bg-card);overflow:hidden;transition:all var(--transition-normal)}.accordion-header{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-size:.85rem;font-weight:600;color:var(--text-primary);-webkit-user-select:none;user-select:none;background:#ffffff03;transition:background var(--transition-fast)}.accordion-header:hover{background:#ffffff08}.accordion-arrow{font-size:.7rem;color:var(--text-secondary);transition:transform var(--transition-normal)}.accordion-item.expanded .accordion-arrow{transform:rotate(180deg)}.accordion-body{display:none;padding:12px;flex-direction:column;gap:8px;background:#0f111a33;border-top:1px solid var(--border-color)}.accordion-item.expanded .accordion-body{display:flex}.lib-item{display:flex;flex-direction:column;padding:12px;background:#1e243ecc;border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:grab;-webkit-user-select:none;user-select:none;transition:transform var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast);position:relative;overflow:hidden}.lib-item:hover{border-color:#5d6cf066;box-shadow:var(--shadow-sm);transform:translateY(-1px)}.lib-item:active{cursor:grabbing}.lib-item-header{display:flex;justify-content:space-between;align-items:start;gap:8px}.lib-item-name{font-size:.85rem;font-weight:600;color:var(--text-primary);line-height:1.3}.lib-item-badge{font-size:.65rem;font-weight:700;padding:2px 6px;border-radius:4px;background:#ffffff1a;color:#fff;flex-shrink:0}.lib-item-desc{font-size:.72rem;color:var(--text-secondary);margin-top:4px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lib-item-meta{display:flex;justify-content:space-between;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.04);font-size:.72rem;color:var(--text-muted)}.lib-item-power{color:var(--color-warning);font-weight:500;display:flex;align-items:center;gap:4px}.custom-form{display:flex;flex-direction:column;gap:16px}.form-title{font-size:.95rem;font-weight:600;color:var(--text-primary);margin-bottom:4px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group-row{display:flex;gap:12px}.form-group-row .form-group{flex:1}label{font-size:.75rem;font-weight:550;color:var(--text-secondary)}input[type=text],input[type=number],select,textarea{width:100%;background:#0f111a99;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:10px 12px;color:#fff;font-family:inherit;font-size:.85rem;transition:border-color var(--transition-fast)}input[type=text]:focus,input[type=number]:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-primary)}textarea{resize:vertical}.workspace{flex:1;overflow-x:auto;overflow-y:auto;padding:24px;position:relative;background:radial-gradient(circle at 50% 50%,#14182e4d,#0f111a00)}.racks-canvas{display:flex;gap:32px;align-items:flex-start;min-height:100%;padding-bottom:24px}.empty-canvas{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;text-align:center;padding:60px 20px;color:var(--text-secondary)}.empty-icon{color:var(--text-muted);margin-bottom:16px;opacity:.7}.empty-canvas h2{font-size:1.4rem;font-weight:600;color:var(--text-primary);margin-bottom:8px}.empty-canvas p{font-size:.9rem;margin-bottom:20px;max-width:320px}.rack-container{display:flex;flex-direction:column;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px;min-width:max-content;width:max-content;box-shadow:var(--shadow-md);position:relative;-webkit-backdrop-filter:var(--backdrop-blur);backdrop-filter:var(--backdrop-blur);transition:border-color var(--transition-normal)}.rack-container:hover{border-color:#ffffff26}.rack-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:16px;gap:12px}.rack-title-wrap{flex:1}.rack-title{font-size:1.05rem;font-weight:700;color:var(--text-primary);border:1px dashed transparent;padding:2px 6px;border-radius:var(--radius-sm);transition:all var(--transition-fast);width:100%;background:transparent;font-family:inherit}.rack-title:hover{border-color:var(--border-color);background:#ffffff05}.rack-title:focus{outline:none;background:#0f111acc;border-color:var(--color-primary)}.rack-subtitle{font-size:.75rem;color:var(--text-secondary);padding-left:6px;margin-top:2px}.rack-actions{display:flex;gap:4px}.rack-btn{background:transparent;border:none;color:var(--text-secondary);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.rack-btn:hover{background:#ffffff0f;color:var(--text-primary)}.rack-btn-danger:hover{background:#ef444426;color:var(--color-danger)}.rack-frame{background:#08090f;border:4px solid #1a1e2e;border-radius:8px;padding:10px 4px;width:350px;flex-shrink:0;display:flex;flex-direction:column;position:relative;box-shadow:inset 0 0 20px #000c}.rack-frame:before,.rack-frame:after{content:"";position:absolute;top:0;bottom:0;width:12px;background:repeating-linear-gradient(to bottom,#141824,#141824 10px,#252b3d 10px,#252b3d 12px);border:1px solid #1f2538}.rack-frame:before{left:32px}.rack-frame:after{right:32px}.rack-slots{display:flex;flex-direction:column;position:relative;z-index:2}.rack-slot{display:grid;grid-template-columns:32px 1fr 32px;height:28px;border-bottom:1px dashed rgba(255,255,255,.03);position:relative;transition:background var(--transition-fast)}.rack-slot:last-child{border-bottom:none}.rack-slot-num{font-family:JetBrains Mono,monospace;font-size:.68rem;color:var(--text-muted);display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.rack-slot-num-left{border-right:1px solid rgba(255,255,255,.05)}.rack-slot-num-right{border-left:1px solid rgba(255,255,255,.05)}.rack-slot-dropzone{display:flex;align-items:center;justify-content:center;color:#ffffff14;font-size:.65rem;cursor:pointer;transition:all var(--transition-fast)}.rack-slot-dropzone:hover{background:#5d6cf00f;color:#5d6cf066}.rack-slot.drag-over .rack-slot-dropzone{background:#10b98126!important;color:var(--color-success)!important;border:1px dashed var(--color-success)}.rack-slot.drag-over-invalid .rack-slot-dropzone{background:#ef444426!important;color:var(--color-danger)!important;border:1px dashed var(--color-danger)}.rack-item{position:absolute;left:32px;right:32px;background:var(--type-other);border:1px solid rgba(255,255,255,.15);border-radius:4px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;box-shadow:0 4px 10px #0006,inset 0 1px #ffffff1a;cursor:grab;z-index:5;-webkit-user-select:none;user-select:none;transition:filter var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast)}.rack-item:hover{filter:brightness(1.08);border-color:#ffffff59;box-shadow:0 4px 12px #00000080,0 0 8px #5d6cf033}.rack-item.dragging{opacity:.4;cursor:grabbing}.rack-item[data-type=server]{background:var(--type-server)}.rack-item[data-type=switch]{background:var(--type-switch)}.rack-item[data-type=router]{background:var(--type-router)}.rack-item[data-type=security]{background:var(--type-security)}.rack-item[data-type=ups]{background:var(--type-ups)}.rack-item[data-type=pdu]{background:var(--type-pdu)}.rack-item[data-type=shelf]{background:var(--type-shelf)}.rack-item[data-type=pc]{background:var(--type-pc)}.rack-item-info{display:flex;flex-direction:column;justify-content:center;overflow:hidden;flex:1;padding-right:8px}.rack-item-title{font-size:.72rem;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 2px rgba(0,0,0,.5)}.rack-item-details{font-size:.6rem;color:#ffffffb3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}.rack-item-meta{display:flex;align-items:center;gap:8px;flex-shrink:0}.rack-item-u{font-family:JetBrains Mono,monospace;font-size:.65rem;font-weight:700;background:#00000040;color:#ffffffe6;padding:1px 4px;border-radius:3px}.rack-item-watts{font-family:JetBrains Mono,monospace;font-size:.65rem;font-weight:700;color:#f59e0b;background:#00000040;padding:1px 4px;border-radius:3px}.rack-item-controls{display:flex;align-items:center;gap:2px;opacity:0;transition:opacity var(--transition-fast);background:#0006;padding:2px;border-radius:4px}.rack-item:hover .rack-item-controls{opacity:1}.item-control-btn{background:transparent;border:none;color:#fff;width:18px;height:18px;display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:2px;transition:background var(--transition-fast)}.item-control-btn:hover{background:#fff3}.item-control-delete:hover{background:#ef444499}.rack-footer{margin-top:16px;display:flex;flex-direction:column;gap:8px}.rack-power-summary{display:flex;justify-content:space-between;align-items:center;font-size:.82rem}.rack-power-summary .label{color:var(--text-secondary)}.rack-power-summary .value{font-weight:700;font-family:JetBrains Mono,monospace}.power-bar-container{height:8px;background:#0000004d;border-radius:4px;overflow:hidden;width:100%;position:relative}.power-bar{height:100%;width:0%;background:var(--color-success);border-radius:4px;transition:width var(--transition-normal) ease,background var(--transition-normal)}.power-bar.warning{background:var(--color-warning)}.power-bar.danger{background:var(--color-danger);animation:pulse-danger 1.5s infinite}@keyframes pulse-danger{0%{opacity:1}50%{opacity:.6}to{opacity:1}}.power-alert-msg{font-size:.72rem;color:var(--color-danger);font-weight:550;display:none;align-items:center;gap:4px;margin-top:2px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#05060ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;display:none;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-normal)}.modal-overlay.active{display:flex;opacity:1}.modal{background:#141724;border:1px solid var(--border-color);border-radius:var(--radius-lg);width:100%;max-width:440px;box-shadow:var(--shadow-lg);overflow:hidden;transform:translateY(-20px);transition:transform var(--transition-normal)}.modal-overlay.active .modal{transform:translateY(0)}.modal-header{padding:16px 20px;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.modal-header h2{font-size:1.1rem;font-weight:600;color:var(--text-primary)}.modal-close{background:transparent;border:none;color:var(--text-secondary);font-size:1.5rem;cursor:pointer;line-height:1}.modal-close:hover{color:var(--text-primary)}.modal-body{padding:20px}.toast-container{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column;gap:8px;z-index:200}.toast{background:#141726f2;border-left:4px solid var(--color-primary);border-radius:var(--radius-sm);color:#fff;padding:12px 20px;font-size:.82rem;font-weight:500;box-shadow:var(--shadow-md);display:flex;align-items:center;justify-content:space-between;gap:16px;min-width:280px;transform:translate(100%);transition:transform var(--transition-normal) cubic-bezier(.68,-.55,.27,1.55)}.toast.active{transform:translate(0)}.toast.success{border-left-color:var(--color-success)}.toast.warning{border-left-color:var(--color-warning)}.toast.danger{border-left-color:var(--color-danger)}.toast-close{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;font-size:1rem}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0000001a}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#fff3}@media print{body{background:#fff!important;color:#000!important;overflow:visible!important;height:auto!important}.bg-glow,.app-header,.sidebar,.modal-overlay,.toast-container,.rack-actions,.rack-item-controls,.rack-slot-dropzone{display:none!important}.app-container,.app-body,.workspace{overflow:visible!important;height:auto!important;padding:0!important;margin:0!important;display:block!important;background:transparent!important}.racks-canvas{display:flex!important;flex-wrap:wrap!important;gap:40px!important;justify-content:center!important;padding:20px!important}.rack-container{page-break-inside:avoid;border:2px solid #ccc!important;box-shadow:none!important;background:#fff!important;color:#000!important}.rack-title{color:#000!important;border:none!important}.rack-frame{border:4px solid #333!important;background:#fcfcfc!important}.rack-slot{border-bottom:1px dashed #ddd!important}.rack-slot-num{color:#555!important}.rack-item{border:1px solid #333!important;box-shadow:none!important;filter:none!important}.rack-item[data-type=server]{background:#e0f2fe!important;border:1px solid #0284c7!important}.rack-item[data-type=server] .rack-item-title{color:#0369a1!important}.rack-item[data-type=switch]{background:#ccfbf1!important;border:1px solid #0d9488!important}.rack-item[data-type=switch] .rack-item-title{color:#115e59!important}.rack-item[data-type=router]{background:#e0f2fe!important;border:1px solid #0284c7!important}.rack-item[data-type=router] .rack-item-title{color:#0369a1!important}.rack-item[data-type=security]{background:#fee2e2!important;border:1px solid #dc2626!important}.rack-item[data-type=security] .rack-item-title{color:#991b1b!important}.rack-item[data-type=ups]{background:#fef3c7!important;border:1px solid #d97706!important}.rack-item[data-type=ups] .rack-item-title{color:#92400e!important}.rack-item[data-type=pdu]{background:#f3f4f6!important;border:1px solid #4b5563!important}.rack-item[data-type=pdu] .rack-item-title{color:#1f2937!important}.rack-item[data-type=shelf]{background:#f3e8ff!important;border:1px solid #7c3aed!important}.rack-item[data-type=shelf] .rack-item-title{color:#5b21b6!important}.rack-item[data-type=pc]{background:#dbeafe!important;border:1px solid #2563eb!important}.rack-item[data-type=pc] .rack-item-title{color:#1d4ed8!important}.rack-item-title,.rack-item-details{text-shadow:none!important}}.spec-fields-container{display:flex;flex-direction:column;gap:12px;margin-top:8px;padding:12px;background:#00000040;border:1px solid var(--border-color);border-radius:var(--radius-sm)}.spec-section-title{font-size:.78rem;font-weight:700;color:var(--color-accent);border-bottom:1px solid rgba(255,255,255,.05);padding-bottom:4px;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.disk-row{display:flex;gap:6px;align-items:center;margin-bottom:6px}.disk-row select,.disk-row input{padding:6px 8px;font-size:.8rem;height:32px}.disk-row .btn-remove-disk{background:#ef444426;color:var(--color-danger);border:none;width:32px;height:32px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all var(--transition-fast)}.disk-row .btn-remove-disk:hover{background:var(--color-danger);color:#fff}.btn-add-disk{align-self:flex-start;font-size:.75rem;padding:6px 12px;background:#5d6cf026;color:#c5ccff;border:1px dashed rgba(93,108,240,.5);border-radius:var(--radius-sm);cursor:pointer;margin-top:4px;transition:all var(--transition-fast);display:flex;align-items:center;gap:4px}.btn-add-disk:hover{background:var(--color-primary);color:#fff}.lib-item-actions{display:flex;gap:4px}.lib-item-header{display:flex;justify-content:space-between;align-items:start;gap:8px;padding-right:48px}.btn-toggle-orientation{font-family:inherit;font-size:.62rem;background:#ffffff26;color:#fff;border:none;padding:2px 5px;border-radius:3px;cursor:pointer;display:flex;align-items:center;gap:3px;transition:background var(--transition-fast);text-transform:uppercase}.btn-toggle-orientation:hover{background:#ffffff4d}.rack-body-wrapper{display:flex;gap:20px;position:relative;width:100%}.rack-annotations-panel{position:relative;width:240px;min-height:100%;flex-shrink:0}.rack-annotation-box{position:absolute;left:0;right:0;box-sizing:border-box;background:#1e243e66;border:1px solid rgba(255,255,255,.08);border-radius:6px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:4px 8px;display:flex;flex-direction:column;justify-content:center;transition:all var(--transition-fast);z-index:4}.rack-annotation-box:hover,.rack-annotation-box:focus-within{background:#1e243eb3;border-color:#5d6cf066;box-shadow:0 0 10px #5d6cf026}.annotation-textarea{width:100%;height:100%;background:transparent;border:none;resize:none;font-family:inherit;font-size:.72rem;color:var(--text-primary);outline:none;padding:0;margin:0}.annotation-textarea::placeholder{color:var(--text-muted);font-style:italic;font-size:.68rem}.rack-item[data-type=pc][data-orientation=vertical]{background:transparent!important;border:none!important;box-shadow:none!important;padding:0!important}.rack-item-vertical-pcs{display:flex;gap:6px;width:100%;height:100%;box-sizing:border-box;align-items:stretch;justify-content:center;padding:2px}.vertical-pc-chassis{flex:1;max-width:50px;background:linear-gradient(180deg,#181d30,#0d101d);border:1.5px solid rgba(255,255,255,.15);border-radius:4px;box-shadow:inset 0 1px #ffffff1a,0 4px 8px #00000080;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:4px 2px;position:relative;transition:all var(--transition-fast)}.vertical-pc-chassis:hover{border-color:var(--color-accent);box-shadow:0 0 8px #00f2fe4d}.pc-led{width:4px;height:4px;border-radius:50%;background:var(--color-success);box-shadow:0 0 4px var(--color-success);animation:led-blink 2s infinite ease-in-out}@keyframes led-blink{0%,to{opacity:.6}50%{opacity:1;filter:brightness(1.2)}}.pc-led.blue{background:var(--color-accent);box-shadow:0 0 4px var(--color-accent)}.pc-grill{width:80%;flex:1;margin:4px 0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.05),rgba(255,255,255,.05) 1px,transparent 1px,transparent 3px);border-radius:2px;border:1px solid rgba(255,255,255,.03)}.pc-title-vert{font-family:JetBrains Mono,monospace;font-size:.5rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;text-align:center;-webkit-user-select:none;user-select:none}.rack-item[data-type=pc][data-orientation=vertical] .rack-item-info{position:absolute;left:5px;top:5px;z-index:10;pointer-events:none;background:#08090fd9;padding:1px 4px;border-radius:3px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.08);max-width:calc(100% - 10px)}.rack-item[data-type=pc][data-orientation=vertical] .rack-item-meta{position:absolute;right:5px;bottom:5px;z-index:10;pointer-events:none}.rack-item[data-type=pc][data-orientation=vertical] .rack-item-controls{pointer-events:auto}.details-table{width:100%;border-collapse:collapse;margin-top:10px;margin-bottom:20px;font-size:.85rem}.details-table th,.details-table td{padding:10px 12px;text-align:left;border-bottom:1px solid rgba(255,255,255,.06)}.details-table th{font-weight:600;color:var(--text-secondary);width:40%;background:#ffffff03}.details-table td{color:var(--text-primary);font-family:JetBrains Mono,monospace}.details-section-header{font-size:.9rem;font-weight:700;color:var(--color-accent);margin-top:15px;margin-bottom:8px;padding-bottom:4px;border-bottom:1px solid rgba(0,242,254,.2);text-transform:uppercase;letter-spacing:.5px}.details-annotation-block{margin-top:20px;padding:12px;background:#ffffff05;border:1px dashed rgba(255,255,255,.1);border-radius:6px}.details-annotation-title{font-size:.8rem;font-weight:600;color:var(--text-secondary);margin-bottom:4px}.details-annotation-text{font-size:.82rem;color:var(--text-primary);white-space:pre-wrap;line-height:1.4}.rack-item-qty{font-family:JetBrains Mono,monospace;font-size:.65rem;color:#fff;font-weight:700;margin:0 4px;-webkit-user-select:none;user-select:none}.btn-network-config{background:#10b98126;color:var(--color-success);border:none;width:20px;height:20px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast)}.btn-network-config:hover{background:var(--color-success);color:#fff}.network-map-wrapper{width:100%;height:100%;position:relative;background:#0f111a80;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-color);box-shadow:inset 0 0 40px #0000004d}#network-map-svg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:3;pointer-events:none}.map-connection-line{stroke:var(--color-primary);stroke-width:3px;stroke-linecap:round;fill:none;opacity:.6;transition:opacity var(--transition-fast),stroke-width var(--transition-fast);pointer-events:auto}.map-connection-label{pointer-events:auto}.map-connection-line:hover{opacity:1;stroke-width:4px;stroke:var(--color-accent);cursor:pointer}.map-nodes-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:5}.map-node{position:absolute;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:8px 12px;min-width:150px;display:flex;flex-direction:column;gap:4px;cursor:grab;box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);-webkit-user-select:none;user-select:none;transition:box-shadow var(--transition-fast),border-color var(--transition-fast)}.map-node:hover{border-color:var(--color-primary);box-shadow:0 0 10px #5d6cf04d}.map-node:active{cursor:grabbing}.map-node-title{font-size:.8rem;font-weight:600;color:var(--text-primary)}.map-node-type{font-size:.65rem;color:var(--text-secondary)}.interface-row{display:flex;flex-direction:column;gap:8px;background:#ffffff05;border:1px solid rgba(255,255,255,.05);padding:12px;border-radius:var(--radius-sm);margin-bottom:8px}.interface-header{font-size:.8rem;font-weight:600;color:var(--color-accent);display:flex;justify-content:space-between}.interface-config-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.interface-connection{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px;padding-top:8px;border-top:1px dashed rgba(255,255,255,.1)}.map-toolbar{display:flex;gap:12px;padding:12px 24px;background:var(--bg-panel);border-bottom:1px solid var(--border-color);align-items:center}.network-map-wrapper{background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:20px 20px}.map-node{min-width:220px;padding:0;z-index:10}.map-node-header{background:#0006;padding:8px 12px;border-bottom:1px solid var(--border-color);border-top-left-radius:var(--radius-sm);border-top-right-radius:var(--radius-sm);cursor:grab}.map-node:active .map-node-header{cursor:grabbing}.map-node-ports{padding:8px;display:flex;flex-direction:column;gap:8px}.map-port-row{display:flex;align-items:center;gap:6px;position:relative}.map-port-endpoint{width:12px;height:12px;border-radius:50%;background:var(--color-primary);border:2px solid var(--bg-panel);cursor:crosshair;position:absolute;left:-15px;transition:transform var(--transition-fast),background var(--transition-fast);z-index:15}.map-port-endpoint.right{left:auto;right:-15px}.map-port-endpoint:hover{transform:scale(1.3);background:var(--color-accent)}.map-port-input{background:#0000004d;border:1px solid transparent;color:var(--text-primary);font-size:.65rem;padding:4px;border-radius:3px;font-family:JetBrains Mono,monospace;width:100%}.map-port-input:hover,.map-port-input:focus{border-color:var(--color-primary);outline:none}.map-connection-line.draft{stroke:var(--color-accent);stroke-dasharray:4;opacity:.8;pointer-events:none}.map-zones-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none}.map-zone{background-color:#ffffff03;position:absolute;background:#5d6cf00d;border:2px dashed rgba(93,108,240,.4);border-radius:8px;pointer-events:auto;cursor:move}.map-zone-title{position:absolute;top:-24px;left:0;color:#5d6cf0cc;font-weight:700;font-size:.8rem;pointer-events:auto;border:none;background:transparent;outline:none}.map-zone-resize{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:se-resize;background:linear-gradient(135deg,transparent 50%,rgba(93,108,240,.5) 50%)}.map-annotations-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:12;pointer-events:none}.map-annotation{position:absolute;pointer-events:auto;background:#0009;border:1px solid var(--border-color);color:#fff;padding:4px 8px;border-radius:4px;font-size:.75rem;cursor:move;min-width:100px;min-height:24px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.map-annotation-input{width:100%;height:100%;background:transparent;border:none;color:inherit;font-family:inherit;font-size:inherit;resize:both;outline:none}.map-node.selected,.map-zone.selected,.map-annotation.selected{outline:2px solid var(--color-accent);box-shadow:0 0 15px #5d6cf066}.map-zone.selected{outline-offset:2px}#network-map-canvas{transform-origin:0 0}.map-zones-container,.map-nodes-container,.map-annotations-container{pointer-events:none}.map-zone,.map-node,.map-annotation,.map-primitive{pointer-events:auto}.port-anchor{position:absolute;width:20px;height:20px;background:#ffffff03;cursor:crosshair;z-index:10;opacity:0;transition:opacity .2s,transform .2s;pointer-events:auto;display:flex;align-items:center;justify-content:center}.port-anchor:after{content:"";width:8px;height:8px;background:var(--color-primary);border-radius:50%;transition:background .2s,transform .2s}.map-node:hover .port-anchor{opacity:1}.network-map-wrapper.connecting .port-anchor{opacity:.8!important}.port-anchor:hover:after{transform:scale(1.5);background:var(--color-accent)}.port-anchor.left{left:-25px;top:50%;transform:translateY(-50%)}.port-anchor.right{right:-25px;top:50%;transform:translateY(-50%)}.port-anchor.left:hover,.port-anchor.right:hover{transform:translateY(-50%) scale(1.2)}.map-resize-handle{position:absolute;width:10px;height:10px;background:#fff;border:1px solid var(--color-primary);z-index:20;pointer-events:auto}.map-resize-handle.br{bottom:-5px;right:-5px;cursor:nwse-resize}.map-node:not(.selected) .map-resize-handle,.map-zone:not(.selected) .map-resize-handle{display:none}path.map-connection-line.selected{stroke-width:3;filter:drop-shadow(0 0 5px rgba(255,255,255,.8))}text.map-connection-label.selected{font-weight:700;filter:drop-shadow(0 0 5px rgba(255,255,255,.8))}.map-primitive{position:absolute;cursor:grab;z-index:10;box-sizing:border-box;background-color:#00000003;pointer-events:auto}.map-primitive.selected{outline:2px solid var(--color-primary);outline-offset:2px;filter:drop-shadow(0 0 5px rgba(255,255,255,.8))}.map-primitive-resize{position:absolute;width:12px;height:12px;right:-6px;bottom:-6px;background:var(--color-primary);border-radius:50%;cursor:se-resize;opacity:0;transition:opacity .2s}.map-primitive.selected .map-primitive-resize{opacity:1}
