@font-face{font-family:Outfit;src:url(/assets/Outfit-Variable-B6lQlNBM.ttf) format("truetype");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:Outfit;src:url(/assets/Outfit-Regular-CZeFCLjM.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Outfit;src:url(/assets/Outfit-Medium-x_F55Dd7.ttf) format("truetype");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:Outfit;src:url(/assets/Outfit-SemiBold-BG6JAc2c.ttf) format("truetype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Outfit;src:url(/assets/Outfit-Bold-DVwZUuqo.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}:root{--color-deep-signal-blue: #2E3B8C;--color-olive-precision: #8C812E;--color-bronze-ground: #8C6B2E;--color-signal-lavender: #D4D9FF;--color-warm-cream: #FFFAD4;--color-success: #10B981;--color-warning: #F59E0B;--color-error: #EF4444;--color-info: #3B82F6;--color-text-dark: #2E3B8C;--color-text-slate: #0F172A;--color-primary: var(--color-deep-signal-blue);--color-primary-hover: var(--color-olive-precision);--color-accent: var(--color-olive-precision);--color-surface-primary: var(--color-warm-cream);--color-surface-secondary: var(--color-signal-lavender);--color-border: var(--color-bronze-ground);--font-heading: "Outfit", system-ui, -apple-system, sans-serif;--font-body: "Outfit", system-ui, -apple-system, sans-serif;--radius-lg: 12px;--radius-md: 8px;--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1)}body{font-family:var(--font-body);background-color:var(--color-surface-primary);color:var(--color-text-dark);margin:0;padding:0;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-deep-signal-blue);margin-top:0}button{font-family:var(--font-body)}.btn-primary{background-color:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);padding:.75rem 1.5rem;font-weight:600;cursor:pointer;transition:background-color .2s}.btn-primary:hover{background-color:var(--color-primary-hover)}.btn-secondary{background-color:var(--color-surface-primary);color:var(--color-primary);border:2px solid var(--color-primary);border-radius:var(--radius-md);padding:.75rem 1.5rem;font-weight:600;cursor:pointer;transition:all .2s}.btn-secondary:hover{background-color:var(--color-signal-lavender)}.card{background-color:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:1rem;border:1px solid rgba(140,107,46,.2);transition:box-shadow .2s ease,transform .15s ease}.card:hover{box-shadow:0 8px 16px -4px #00000026,0 4px 8px -4px #0000001a}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.card:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.btn-primary:focus-visible,.btn-secondary:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px;box-shadow:0 0 0 4px #8c812e4d}.context-menu{background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:0 8px 24px #00000026;padding:.5rem 0;min-width:160px;z-index:1000}.context-menu .menu-header{padding:.5rem 1rem;font-size:.75rem;color:var(--color-text-slate);border-bottom:1px solid rgba(140,107,46,.15);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.context-menu button{display:block;width:100%;padding:.625rem 1rem;border:none;background:none;text-align:left;cursor:pointer;font-size:.875rem;color:var(--color-text-dark);transition:background-color .15s ease}.context-menu button:hover{background-color:var(--color-surface-secondary)}.context-menu button:focus-visible{outline:none;background-color:var(--color-surface-secondary)}.context-menu button.danger{color:var(--color-error)}.context-menu button.danger:hover{background-color:#ef44441a}.sidebar{scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background:transparent}.sidebar::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:3px}.device-node{transition:box-shadow .2s ease}.device-node:hover{box-shadow:0 8px 24px #2e3b8c33}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.btn-loading{pointer-events:none;opacity:.7;position:relative}.btn-loading:after{content:"";position:absolute;width:1rem;height:1rem;top:50%;left:50%;margin-left:-.5rem;margin-top:-.5rem;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:spin .6s linear infinite}.skeleton{background:linear-gradient(90deg,var(--color-surface-secondary) 25%,var(--color-warm-cream) 50%,var(--color-surface-secondary) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}:root{--z-dropdown: 1000;--z-sticky: 1020;--z-modal: 1050;--z-popover: 1060;--z-tooltip: 1070}:root{--color-primary: #1a2b4b;--color-primary-dark: #121e36;--color-secondary: #f4f4f4;--color-accent: #8da399;--color-text: #333333;--color-text-light: #ffffff;--color-border: #e0e0e0;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 8rem;--container-width: 1200px;--header-height: 80px;--transition-fast: .3s ease}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-body);color:var(--color-text);line-height:1.6;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-primary);line-height:1.2;margin-bottom:var(--spacing-sm)}a{text-decoration:none;color:inherit;transition:color var(--transition-fast)}ul{list-style:none}.container{max-width:var(--container-width);margin:0 auto;padding:0 var(--spacing-sm)}.text-light{color:var(--color-text-light)}.bg-light{background-color:var(--color-secondary)}.btn{display:inline-block;padding:12px 30px;font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:.9rem;border:none;cursor:pointer;transition:all var(--transition-fast)}.btn-primary{background-color:var(--color-accent);color:var(--color-text-light)}.btn-primary:hover{background-color:var(--color-primary)}.site-header{background-color:var(--color-text-light);height:var(--header-height);display:flex;align-items:center;position:fixed;width:100%;top:0;z-index:1000;box-shadow:0 2px 10px #0000000d}.header-container{display:flex;justify-content:space-between;align-items:center;width:100%}.logo{font-family:var(--font-heading);font-size:1.5rem;font-weight:700;letter-spacing:2px;color:var(--color-primary)}.main-nav ul{display:flex;gap:var(--spacing-md)}.main-nav a{font-size:.9rem;font-weight:700;text-transform:uppercase;color:var(--color-primary)}.main-nav a:hover{color:var(--color-accent)}.mobile-toggle{display:none}.hero{height:100vh;background-color:var(--color-primary);background-size:cover;background-position:center;position:relative;display:flex;align-items:center;color:var(--color-text-light);margin-top:var(--header-height)}.hero-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#1a2b4bcc}.hero-content{position:relative;z-index:2;text-align:center;width:100%}.hero-title{font-size:3.5rem;margin-bottom:var(--spacing-md)}.hero-subtitle{font-size:1.2rem;max-width:600px;margin:0 auto var(--spacing-md);font-weight:300}.section{padding:var(--spacing-xl) 0}.section-header{text-align:center;margin-bottom:var(--spacing-lg)}.section-title{font-size:2.5rem}.section-desc{color:#666;max-width:700px;margin:0 auto}.separator,.separator-left{height:3px;width:60px;background-color:var(--color-accent);margin:var(--spacing-sm) auto}.separator-left{margin:var(--spacing-sm) 0}.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--spacing-md)}.service-card{background:#fff;padding:var(--spacing-md);text-align:center;transition:transform var(--transition-fast)}.service-card:hover{transform:translateY(-5px)}.icon-box{font-size:3rem;color:var(--color-accent);margin-bottom:var(--spacing-sm)}.read-more{display:inline-block;margin-top:var(--spacing-sm);font-size:.85rem;font-weight:700;text-transform:uppercase;color:var(--color-primary)}.split-container{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);align-items:center}.feature-image{width:100%;height:auto;border-radius:4px;box-shadow:0 15px 30px #0000001a;transition:transform var(--transition-fast)}.feature-image:hover{transform:translateY(-5px)}.feature-list li{margin-bottom:var(--spacing-xs);font-weight:700;color:var(--color-primary)}.stats-section{background-color:var(--color-primary);padding:var(--spacing-lg) 0}.stats-grid{display:flex;justify-content:space-around;text-align:center}.stat-number{display:block;font-size:3rem;font-family:var(--font-heading);font-weight:700;color:var(--color-accent)}.stat-label{font-size:.9rem;text-transform:uppercase;letter-spacing:1px}.site-footer{background-color:#111;color:#999;padding:var(--spacing-lg) 0 var(--spacing-md);font-size:.9rem}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.logo-text{color:#fff;font-size:1.2rem;margin-bottom:var(--spacing-xs)}.footer-col h4{color:#fff;font-size:1rem;margin-bottom:var(--spacing-sm)}.footer-col a:hover{color:var(--color-accent)}.footer-bottom{text-align:center;padding-top:var(--spacing-md);border-top:1px solid #222}@media(max-width:768px){.hero-title{font-size:2.5rem}.mobile-toggle{display:block;background:none;border:none;cursor:pointer}.bar{display:block;width:25px;height:3px;margin:5px auto;background-color:var(--color-primary);transition:all .3s ease-in-out}.main-nav{position:fixed;left:-100%;top:var(--header-height);gap:0;flex-direction:column;background-color:#fff;width:100%;text-align:center;transition:.3s;box-shadow:0 10px 10px #0000001a}.main-nav.active{left:0}.main-nav ul{flex-direction:column;padding:var(--spacing-md) 0}.split-container{grid-template-columns:1fr}.stats-grid{flex-direction:column;gap:var(--spacing-md)}}.sidebar-content{display:flex;flex-direction:column;padding:1rem;height:100%;overflow-y:auto}.sidebar-section-title{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#fff9;margin:0 0 .75rem}.sidebar-hint{font-size:.8125rem;color:#ffffff80;margin:0 0 1rem;font-style:italic}.sidebar-divider{height:1px;background:#ffffff1a;margin:1rem 0}.tool-buttons{display:flex;flex-direction:column;gap:.5rem}.tool-button{display:flex;align-items:center;gap:.625rem;padding:.5rem .75rem;border-radius:var(--radius-md);border:none;background:#ffffff0d;color:#fffc;cursor:pointer;font-size:.8125rem;text-align:left;transition:background .15s ease}.tool-button:hover{background:#ffffff26}.tool-button.active{background:#fff3;color:#fff}.device-list{display:flex;flex-direction:column;gap:.375rem}.device-list-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:#ffffff0d;border-radius:var(--radius-sm, 4px);font-size:.8125rem;color:#fff}.device-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}.device-ports{font-size:.75rem;color:#ffffff80}.connection-types{display:flex;flex-wrap:wrap;gap:.375rem}.conn-type{padding:.25rem .5rem;border-radius:4px;font-size:.6875rem;font-weight:600;text-transform:uppercase}.conn-type.hdmi{background:#7c3aed;color:#fff}.conn-type.usb{background:#10b981;color:#fff}.conn-type.cat{background:#f59e0b;color:#fff}.conn-type.lan{background:#3b82f6;color:#fff}.category-list{display:flex;flex-direction:column;gap:.5rem;flex:1}.category-group{background:#ffffff0d;border-radius:var(--radius-md);overflow:hidden;flex-shrink:0}.category-header{display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:#ffffff14;font-size:.8125rem;font-weight:500;color:#fff;cursor:pointer;transition:background .15s ease}.category-header:hover{background:#ffffff1f}.category-count{margin-left:auto;font-size:.6875rem;color:#ffffff80;background:#ffffff1a;padding:.125rem .375rem;border-radius:10px}.category-chevron{font-size:.625rem;transition:transform .2s ease;color:#fff6}.category-chevron.expanded{transform:rotate(180deg)}.category-icon{font-size:1rem}.category-items{padding:.5rem;display:flex;flex-direction:column;gap:.25rem}.device-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .625rem;font-size:.8125rem;color:#ffffffe6;background:#00000026;border:1px solid rgba(255,255,255,.05);cursor:grab;border-radius:4px;transition:all .15s ease}.device-item:hover{background:#ffffff1a;border-color:#fff3}.device-item.draggable:active{cursor:grabbing}.device-item.dragging{opacity:.5;background:#ffffff26}.device-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-brand{font-size:.6875rem;color:#fff6;margin-left:.5rem}.more-items{font-size:.75rem;color:#fff6;text-align:center;padding:.375rem;font-style:italic}.brand-nav{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:.75rem}.brand-tab{padding:.375rem .75rem;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:20px;color:#ffffffb3;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .15s ease}.brand-tab:hover{background:#ffffff26;color:#fff}.brand-tab.active{background:linear-gradient(135deg,#3b82f6,#2563eb);border-color:#3b82f6;color:#fff;box-shadow:0 2px 8px #3b82f64d}.brand-header{display:flex;flex-direction:column;gap:.25rem;padding:.5rem .75rem;background:#ffffff0d;border-radius:var(--radius-sm, 4px);margin-bottom:.75rem}.brand-name{font-size:.875rem;font-weight:600;color:#fff}.brand-desc{font-size:.6875rem;color:#ffffff80}.device-library-scroll{flex:1;overflow-y:auto;min-height:0;padding-right:.25rem}.device-library-scroll::-webkit-scrollbar{width:6px}.device-library-scroll::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.device-library-scroll::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.device-library-scroll::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.layout-sidebar{display:flex;flex-direction:column;overflow:hidden}.element-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin-bottom:.5rem}.element-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.75rem .5rem;background:#ffffff0d;border:1px dashed rgba(255,255,255,.2);border-radius:var(--radius-md);color:#ffffffb3;font-size:.75rem;cursor:grab;transition:all .15s ease}.element-btn:hover{background:#ffffff1a;border-color:#ffffff4d;transform:translateY(-1px)}.element-btn.dragging{opacity:.5;cursor:grabbing}.element-btn .element-icon{font-size:1.25rem}.element-btn .element-label{font-size:.6875rem;color:#fff9}.device-count-footer{margin-top:1rem;padding:.5rem;text-align:center;font-size:.6875rem;color:#fff6;border-top:1px solid rgba(255,255,255,.1)}.sidebar-hint.loading{animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:.4}50%{opacity:.8}}.rack-templates{display:flex;flex-direction:column;gap:.375rem}.rack-template{display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:#ffffff0d;border:none;border-radius:var(--radius-md);color:#fffc;font-size:.8125rem;cursor:pointer;transition:all .15s ease}.rack-template:hover{background:#ffffff1a}.rack-template.active{background:#fff3;color:#fff}.rack-icon{font-size:1.125rem}.rack-stats{display:flex;flex-direction:column;gap:.375rem}.stat-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.05)}.stat-label{font-size:.8125rem;color:#fff9}.stat-value{font-size:.875rem;font-weight:600;color:#fff}.stat-value.success{color:var(--color-success)}.device-queue{display:flex;flex-direction:column;gap:.375rem}.queue-item{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:#ffffff0d;border-radius:var(--radius-sm, 4px);cursor:grab}.queue-label{font-size:.8125rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px}.queue-u{font-size:.75rem;padding:.125rem .375rem;background:#ffffff1a;border-radius:4px;color:#ffffffb3}.bom-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.summary-stat{display:flex;flex-direction:column;align-items:center;padding:.75rem .5rem;background:#ffffff0d;border-radius:var(--radius-md)}.summary-value{font-size:1.25rem;font-weight:700;color:#fff}.summary-label{font-size:.6875rem;color:#ffffff80;text-align:center;margin-top:.25rem}.export-buttons{display:flex;flex-direction:column;gap:.5rem}.export-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem;background:#ffffff14;border:none;border-radius:var(--radius-md);color:#fff;font-size:.8125rem;cursor:pointer;transition:all .15s ease}.export-btn:hover:not(:disabled){background:#ffffff26}.export-btn:disabled{opacity:.4;cursor:not-allowed}.export-icon{font-size:1.125rem}.filter-group{margin-bottom:.75rem}.filter-label{display:block;font-size:.75rem;color:#fff9;margin-bottom:.375rem}.filter-select{width:100%;padding:.5rem .75rem;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm, 4px);color:#fff;font-size:.8125rem;cursor:pointer}.filter-select:focus{outline:none;border-color:#ffffff4d}.filter-select option{background:var(--color-primary);color:#fff}.dashboard{min-height:100vh;background:var(--color-surface-primary);color:var(--color-text-dark)}.dashboard-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:var(--color-surface-primary);color:var(--color-text-slate)}.loading-spinner{width:40px;height:40px;border:3px solid var(--color-surface-secondary);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.dashboard-header{padding:1rem 2rem;border-bottom:1px solid rgba(140,107,46,.2);background:#fff;display:flex;align-items:center;justify-content:space-between;height:56px;box-sizing:border-box}.dashboard-brand{display:flex;align-items:center;gap:.75rem}.dashboard-brand h1{font-size:1.5rem;font-weight:700;color:var(--color-primary);margin:0}.dashboard-tagline{font-size:.875rem;color:var(--color-text-slate);opacity:.7}.dashboard-content{padding:2rem;max-width:1200px;margin:0 auto}.dashboard-section{margin-bottom:2rem}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.section-header h2{font-size:1.25rem;font-weight:600;color:var(--color-text-dark);margin:0}.primary-btn{display:flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-weight:600;cursor:pointer;transition:all .2s ease}.primary-btn:hover{background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #2e3b8c40}.primary-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.secondary-btn{padding:.625rem 1.25rem;background:#fff;color:var(--color-primary);border:2px solid var(--color-primary);border-radius:var(--radius-md);font-weight:600;cursor:pointer;transition:all .2s ease}.secondary-btn:hover{background:var(--color-surface-secondary)}.btn-icon{font-size:1.1rem;line-height:1}.empty-state{text-align:center;padding:4rem 2rem;background:#fff;border:2px dashed var(--color-border);border-radius:var(--radius-lg)}.empty-icon{font-size:3rem;margin-bottom:1rem;opacity:.7}.empty-state h3{font-size:1.25rem;font-weight:600;margin:0 0 .5rem;color:var(--color-text-dark)}.empty-state p{color:var(--color-text-slate);margin:0 0 1.5rem;max-width:400px;margin-left:auto;margin-right:auto;opacity:.8}.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.project-card{background:#fff;border:1px solid rgba(140,107,46,.2);border-radius:var(--radius-lg);padding:1.25rem;cursor:pointer;transition:all .2s ease;box-shadow:var(--shadow-md)}.project-card:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 8px 24px #2e3b8c26}.project-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.project-icon{font-size:1.5rem;opacity:.8}.project-actions{display:flex;gap:.25rem;opacity:0;transition:opacity .2s ease}.project-card:hover .project-actions{opacity:1}.action-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--color-surface-secondary);border:none;border-radius:var(--radius-sm, 4px);cursor:pointer;transition:all .2s ease;font-size:.875rem}.action-btn:hover{background:var(--color-signal-lavender)}.action-btn.danger:hover{background:#ef444426}.project-name{font-size:1rem;font-weight:600;margin:0 0 .5rem;color:var(--color-text-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-meta{display:flex;flex-direction:column;gap:.25rem;font-size:.75rem;color:var(--color-text-slate);margin-bottom:.75rem;opacity:.8}.meta-label{margin-right:.25rem;font-weight:500}.project-stats{display:flex;gap:1rem;padding-top:.75rem;border-top:1px solid rgba(140,107,46,.15)}.stat{font-size:.75rem;color:var(--color-text-slate);display:flex;align-items:center;gap:.25rem}.modal-overlay{position:fixed;inset:0;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal, 1050)}.modal-content{background:#fff;border:1px solid rgba(140,107,46,.2);border-radius:var(--radius-lg);padding:1.5rem;width:100%;max-width:400px;box-shadow:0 20px 50px #0003}.modal-content h2{font-size:1.125rem;font-weight:600;margin:0 0 1rem;color:var(--color-text-dark)}.modal-content input{width:100%;padding:.75rem 1rem;background:var(--color-surface-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-dark);font-size:.9375rem;margin-bottom:1rem;box-sizing:border-box;font-family:var(--font-body)}.modal-content input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2e3b8c26}.modal-actions{display:flex;gap:.75rem;justify-content:flex-end}.react-flow{direction:ltr;--xy-edge-stroke-default: #b1b1b7;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #555;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(255, 255, 255, .5);--xy-minimap-background-color-default: #fff;--xy-minimap-mask-background-color-default: rgba(240, 240, 240, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #e2e2e2;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: transparent;--xy-background-pattern-dots-color-default: #91919a;--xy-background-pattern-lines-color-default: #eee;--xy-background-pattern-cross-color-default: #e2e2e2;background-color:var(--xy-background-color, var(--xy-background-color-default));--xy-node-color-default: inherit;--xy-node-border-default: 1px solid #1a192b;--xy-node-background-color-default: #fff;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #1a192b;--xy-node-border-radius-default: 3px;--xy-handle-background-color-default: #1a192b;--xy-handle-border-color-default: #fff;--xy-selection-background-color-default: rgba(0, 89, 220, .08);--xy-selection-border-default: 1px dotted rgba(0, 89, 220, .8);--xy-controls-button-background-color-default: #fefefe;--xy-controls-button-background-color-hover-default: #f4f4f4;--xy-controls-button-color-default: inherit;--xy-controls-button-color-hover-default: inherit;--xy-controls-button-border-color-default: #eee;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #ffffff;--xy-edge-label-color-default: inherit;--xy-resize-background-color-default: #3367d9}.react-flow.dark{--xy-edge-stroke-default: #3e3e3e;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #727272;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(150, 150, 150, .25);--xy-minimap-background-color-default: #141414;--xy-minimap-mask-background-color-default: rgba(60, 60, 60, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #2b2b2b;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: #141414;--xy-background-pattern-dots-color-default: #777;--xy-background-pattern-lines-color-default: #777;--xy-background-pattern-cross-color-default: #777;--xy-node-color-default: #f8f8f8;--xy-node-border-default: 1px solid #3c3c3c;--xy-node-background-color-default: #1e1e1e;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #999;--xy-handle-background-color-default: #bebebe;--xy-handle-border-color-default: #1e1e1e;--xy-selection-background-color-default: rgba(200, 200, 220, .08);--xy-selection-border-default: 1px dotted rgba(200, 200, 220, .8);--xy-controls-button-background-color-default: #2b2b2b;--xy-controls-button-background-color-hover-default: #3e3e3e;--xy-controls-button-color-default: #f8f8f8;--xy-controls-button-color-hover-default: #fff;--xy-controls-button-border-color-default: #5b5b5b;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #141414;--xy-edge-label-color-default: #f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{overflow:visible;position:absolute;pointer-events:none}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__arrowhead polyline{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__arrowhead polyline.arrowclosed{fill:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}svg.react-flow__connectionline{z-index:1001;overflow:visible;position:absolute}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background-color:var(--xy-handle-background-color, var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));border-radius:100%}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:0;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px) translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px) translateY(-50%)}.react-flow__attribution{font-size:10px;background:var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;left:0;top:0}.react-flow__viewport-portal{position:absolute;width:100%;height:100%;left:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__minimap{background:var( --xy-minimap-background-color-props, var(--xy-minimap-background-color, var(--xy-minimap-background-color-default)) )}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var( --xy-minimap-mask-background-color-props, var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default)) );stroke:var( --xy-minimap-mask-stroke-color-props, var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default)) );stroke-width:var( --xy-minimap-mask-stroke-width-props, var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default)) )}.react-flow__minimap-node{fill:var( --xy-minimap-node-background-color-props, var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default)) );stroke:var( --xy-minimap-node-stroke-color-props, var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default)) );stroke-width:var( --xy-minimap-node-stroke-width-props, var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default)) )}.react-flow__background-pattern.dots{fill:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default)) )}.react-flow__background-pattern.lines{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default)) )}.react-flow__background-pattern.cross{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default)) )}.react-flow__controls{display:flex;flex-direction:column;box-shadow:var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default))}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{display:flex;justify-content:center;align-items:center;height:26px;width:26px;padding:4px;border:none;background:var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));border-bottom:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) );color:var( --xy-controls-button-color-props, var(--xy-controls-button-color, var(--xy-controls-button-color-default)) );cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px;fill:currentColor}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:var(--xy-node-border-radius, var(--xy-node-border-radius-default));width:150px;font-size:12px;color:var(--xy-node-color, var(--xy-node-color-default));text-align:center;border:var(--xy-node-border, var(--xy-node-border-default));background-color:var(--xy-node-background-color, var(--xy-node-background-color-default))}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color, var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color, var(--xy-selection-background-color-default));border:var(--xy-selection-border, var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var( --xy-controls-button-background-color-hover-props, var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default)) );color:var( --xy-controls-button-color-hover-props, var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default)) )}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) )}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:5px;height:5px;border:1px solid #fff;border-radius:1px;background-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));translate:-50% -50%}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color, var(--xy-edge-label-color-default))}.layout-view{display:flex;flex-direction:column;height:100%;background:var(--color-warm-cream)}.layout-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:#fff;border-bottom:1px solid rgba(0,0,0,.08);gap:1rem}.toolbar-group{display:flex;align-items:center;gap:.5rem}.toolbar-label{font-size:.8125rem;color:var(--color-text-secondary);font-weight:500}.toolbar-btn{display:flex;align-items:center;gap:.375rem;padding:.5rem .75rem;border-radius:var(--radius-md);border:1px solid rgba(0,0,0,.1);background:#fff;color:var(--color-text-primary);font-size:.8125rem;cursor:pointer;transition:all .15s ease}.toolbar-btn:hover{background:var(--color-surface-secondary);border-color:#00000026}.toolbar-btn.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.toolbar-btn.danger:not(:disabled){color:var(--color-error);border-color:var(--color-error)}.toolbar-btn.danger:not(:disabled):hover{background:var(--color-error);color:#fff}.toolbar-btn:disabled{opacity:.4;cursor:not-allowed}.toolbar-stat{font-size:.75rem;color:var(--color-text-secondary);background:var(--color-surface-secondary);padding:.375rem .625rem;border-radius:var(--radius-sm)}.layout-canvas-container{flex:1;overflow:auto;display:flex;align-items:flex-start;justify-content:flex-start;padding:2rem}.layout-canvas{position:relative;background:#fff;border-radius:var(--radius-lg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;background-image:linear-gradient(to right,rgba(0,0,0,.03) 1px,transparent 1px),linear-gradient(to bottom,rgba(0,0,0,.03) 1px,transparent 1px);min-width:100%;min-height:100%}.layout-empty-state{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:var(--color-text-secondary);pointer-events:none}.layout-empty-state .empty-icon{font-size:3rem;display:block;margin-bottom:1rem;opacity:.6}.layout-empty-state h3{font-size:1.125rem;font-weight:600;color:var(--color-text-primary);margin:0 0 .5rem}.layout-empty-state p{font-size:.875rem;margin:0;opacity:.7}.layout-element{position:absolute;border-radius:4px;cursor:move;display:flex;align-items:center;justify-content:center;transition:box-shadow .15s ease;-webkit-user-select:none;user-select:none}.layout-element:hover{box-shadow:0 4px 12px #00000026}.layout-element.selected{box-shadow:0 0 0 3px var(--color-primary),0 4px 12px #0003}.layout-element.wall{border-radius:2px}.layout-element.wall .element-label{color:#ffffffe6;font-size:.5625rem}.layout-element.zone .element-label{color:#9370db;text-shadow:none;font-weight:700}.element-label{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3);pointer-events:none}.resize-handle{position:absolute;right:-4px;bottom:-4px;width:12px;height:12px;background:var(--color-primary);border:2px solid white;border-radius:2px;cursor:nwse-resize;box-shadow:0 1px 4px #0000004d;transition:transform .1s ease}.resize-handle:hover{transform:scale(1.2);background:var(--color-accent-bronze)}.layout-device{position:absolute;background:var(--color-primary);border-radius:var(--radius-md);border:2px solid rgba(255,255,255,.3);cursor:move;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:all .15s ease;-webkit-user-select:none;user-select:none;box-shadow:0 2px 4px #0000001a}.layout-device:hover{transform:scale(1.05);box-shadow:0 4px 12px #0003;z-index:10}.layout-device.selected{box-shadow:0 0 0 3px var(--color-accent-bronze),0 4px 12px #00000040;z-index:20}.device-icon{font-size:1rem}.device-label-mini{font-size:.5rem;color:#fff;font-weight:600;text-transform:uppercase;letter-spacing:.02em;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.element-dimensions,.device-dimensions{position:absolute;bottom:-18px;left:50%;transform:translate(-50%);font-size:.5625rem;color:var(--color-text-secondary);background:#fffffff2;padding:2px 6px;border-radius:3px;white-space:nowrap;box-shadow:0 1px 3px #0000001a;font-weight:500;pointer-events:none}.device-dimensions{bottom:-16px;font-size:.5rem}.layout-view .context-menu{background:#fff;border-radius:var(--radius-md);box-shadow:0 4px 20px #00000026,0 0 0 1px #0000000d;overflow:hidden;min-width:150px;z-index:1000}.layout-view .context-menu .menu-header{padding:.625rem .875rem;font-weight:600;font-size:.8125rem;color:var(--color-text-primary);background:var(--color-surface-secondary);border-bottom:1px solid rgba(0,0,0,.08)}.layout-view .context-menu button{display:block;width:100%;padding:.5rem .875rem;text-align:left;border:none;background:none;font-size:.8125rem;color:var(--color-text-primary);cursor:pointer;transition:background .15s ease}.layout-view .context-menu button:hover{background:var(--color-surface-secondary)}.layout-view .context-menu button.danger{color:var(--color-error)}.layout-view .context-menu button.danger:hover{background:#ef44441a}@media(max-width:1024px){.layout-toolbar{flex-wrap:wrap}.toolbar-group:last-child{width:100%;justify-content:flex-end;margin-top:.5rem}}.app-container{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden}.app-header{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 1.5rem;background:#fff;border-bottom:1px solid rgba(140,107,46,.2);flex-shrink:0;z-index:100;box-sizing:border-box}.header-brand{display:flex;align-items:center;gap:.75rem}.brand-logo{flex-shrink:0}.brand-name{font-family:var(--font-heading);font-size:1.25rem;font-weight:700;color:var(--color-primary);letter-spacing:-.02em}.brand-divider{color:var(--color-border);font-weight:300}.brand-product{font-family:var(--font-body);font-size:.875rem;color:var(--color-text-slate);opacity:.7}.header-center{flex:1;display:flex;justify-content:center}.header-user{display:flex;align-items:center;gap:.5rem}.btn-icon{width:36px;height:36px;border-radius:var(--radius-md);border:none;background:transparent;color:var(--color-text-slate);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .15s ease,color .15s ease}.btn-icon:hover{background-color:var(--color-surface-secondary);color:var(--color-primary)}.user-avatar{width:36px;height:36px;border-radius:50%;background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;cursor:pointer;margin-left:.5rem}.app-body{display:flex;flex:1;overflow:hidden}.canvas-area{flex:1;position:relative;background-color:#fff}.product-list{display:flex;flex-direction:column;gap:8px}.back-btn{width:36px;height:36px;border-radius:var(--radius-md);border:none;background:transparent;color:var(--color-text-slate);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .15s ease,color .15s ease}.back-btn:hover{background-color:var(--color-surface-secondary);color:var(--color-primary)}.project-name{font-family:var(--font-body);font-size:.9375rem;color:var(--color-text-dark);font-weight:500;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.view-tabs{display:flex;align-items:center;gap:.25rem;padding:.25rem;background:var(--color-surface-secondary);border-radius:var(--radius-md)}.view-tab{display:flex;align-items:center;gap:.375rem;padding:.5rem 1rem;border:none;border-radius:var(--radius-sm);background:transparent;color:var(--color-text-slate);font-size:.875rem;font-weight:500;cursor:pointer;transition:all .15s ease}.view-tab:hover{background:#2e3b8c14;color:var(--color-text-dark)}.view-tab.active{background:#fff;color:var(--color-primary);box-shadow:0 1px 3px #0000001a}.view-icon{font-size:1rem;line-height:1}.view-label{line-height:1}.placeholder-view{display:flex;align-items:center;justify-content:center;height:100%;background:var(--color-surface-primary)}.placeholder-content{text-align:center;padding:3rem 2rem;max-width:600px;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:1px solid rgba(140,107,46,.15)}.placeholder-content h2{font-size:1.5rem;font-weight:600;color:var(--color-text-dark);margin:0 0 .75rem}.placeholder-content p{color:var(--color-text-slate);margin:0;opacity:.8}.placeholder-content .empty-message{margin-top:1rem;font-style:italic}.bom-table{width:100%;margin-top:1.5rem;border-collapse:collapse;text-align:left;background:#fff}.bom-table th,.bom-table td{padding:.75rem 1rem;border-bottom:1px solid rgba(140,107,46,.15)}.bom-table th{font-weight:600;color:var(--color-text-slate);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;background:var(--color-surface-primary)}.bom-table td{color:var(--color-text-dark);font-size:.875rem}.bom-table tr:hover td{background:var(--color-surface-secondary)}