*{box-sizing:border-box}body{margin:0;background:#0f1117;color:#e2e8f0;font:14px 'Segoe UI',system-ui,sans-serif}header{height:64px;display:flex;align-items:center;gap:24px;padding:0 24px;border-bottom:1px solid #2d3347}header a{color:#00e676;text-decoration:none}h1{font-size:21px}header span{color:#94a3b8}main{display:flex;height:calc(100dvh - 64px)}aside{width:280px;padding:16px 20px;overflow-y:auto;background:#1a1d27;flex-shrink:0}h2{font-size:13px;color:#00e676;margin:20px 0 12px}.tools{display:grid;grid-template-columns:1fr 1fr;gap:7px}button{font:inherit;cursor:pointer;background:#22263a;color:#e2e8f0;border:1px solid #475569;border-radius:7px;padding:9px}button:hover{border-color:#00e676}button.active{background:#00b854;color:#081910;border-color:#00e676}button:focus-visible,input:focus-visible{outline:2px solid #00e676;outline-offset:2px}label{display:block;margin:12px 0;line-height:1.7}input[type=number]{display:block;width:100%;padding:7px;background:#111827;border:1px solid #475569;color:white;border-radius:5px}input[type=file]{max-width:100%;font-size:12px}input[type=range]{width:100%}p{font-size:12px;color:#a9b5c8;line-height:1.6}.note{padding:10px;background:#22263a;border-radius:6px}#area{flex:1;min-width:0;position:relative;overflow:hidden;background:#f4f6fa}canvas{display:block;width:100%;height:100%;touch-action:none}output{position:absolute;bottom:16px;left:16px;max-width:calc(100% - 32px);padding:10px 14px;background:#111827e8;border-radius:8px;pointer-events:none;font-size:13px}@media(max-width:650px){aside{width:190px;padding:10px}header{gap:12px;padding:0 12px}header span{display:none}}

/* Panell estret, plegable manualment. */
header #togglePanel{margin-left:auto;white-space:nowrap}aside{width:200px;padding:10px}aside h2{margin:14px 0 8px}aside label{margin:8px 0}aside button{padding:7px}aside input[type=number]{padding:5px}body.panel-closed #toolPanel{display:none}
@media(max-width:900px){header{gap:10px;padding:0 10px}header span{display:none}header h1{font-size:18px}header a{font-size:12px}header #togglePanel{padding:8px;font-size:12px}}
@media(max-width:650px){aside{width:170px;padding:8px}aside button{font-size:12px}}
@media(max-width:360px){header{gap:7px;padding:0 7px}header h1{font-size:16px}header a{font-size:11px}}
body{height:100dvh;display:flex;flex-direction:column;overflow:hidden}header{flex-shrink:0}main{height:auto;flex:1;min-height:0}#electricalBar{flex-shrink:0;background:#182235;border-bottom:1px solid #334155;padding:8px 12px;display:flex;flex-direction:column;gap:7px}.circuitControls,.electricTools{display:flex;align-items:center;gap:7px;overflow-x:auto;min-width:0;white-space:nowrap}.circuitControls>* ,.electricTools>*{flex-shrink:0}.circuitControls label{margin:0;font-size:12px}select{font:inherit;background:#111827;color:#e2e8f0;border:1px solid #475569;border-radius:5px;padding:7px;max-width:240px}#electricalBar button{padding:7px;font-size:12px}button:disabled{opacity:.35;cursor:default}#circuitBadge{background:#fff;padding:5px 8px;border:2px solid;border-radius:5px;font-size:12px}@media(max-width:650px){#electricalBar{padding:6px}select{max-width:185px;font-size:12px}}

#electricalBar{flex-direction:row;align-items:center;flex-wrap:nowrap;overflow-x:auto;gap:10px;min-height:53px}.circuitControls,.electricTools{overflow:visible;flex-shrink:0}.electricTools{border-left:1px solid #475569;padding-left:10px}#electricalBar .electricTools button{display:inline-flex;align-items:center;justify-content:center;width:38px;height:36px;padding:4px}#electricalBar select{max-width:195px}#electricalBar #circuitKind{max-width:175px}#electricalBar #addCircuit{width:32px;height:34px;font-size:22px;padding:0}

.viewTools{display:flex;align-items:center;gap:7px;flex-shrink:0;border-left:1px solid #475569;padding-left:10px}.viewTools button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:36px;font-size:21px!important;padding:3px!important}.viewTools select{font-size:12px}#electricalBar{scrollbar-width:thin}

.circuitDivider{height:28px;border-left:1px solid #64748b;margin:0 3px}#electricalBar #addCircuit{width:auto;padding:0 8px;font-size:12px}#deleteCircuit{display:flex;align-items:center;justify-content:center;height:34px;width:32px;padding:4px!important;color:#fda4af}#deleteCircuit:disabled{color:#94a3b8}

#electricalBar .electricTools #connectIgnition.ending{width:auto;min-width:90px;padding:4px 9px;font-weight:700;white-space:nowrap}
/* Connexió d’encesa: verd inicial, vermell durant l’edició, verd en acabar. */
#electricalBar .electricTools #connectIgnition{background:#00b854;color:#081910;border-color:#00e676}
#electricalBar .electricTools #connectIgnition.ending{background:#dc2626;color:#fff;border-color:#f87171}
#electricalBar .electricTools #connectIgnition:disabled{background:#22263a;color:#94a3b8;border-color:#475569}

.editTools{display:flex;align-items:center;gap:7px;flex-shrink:0;border-left:1px solid #475569;padding-left:10px}.editTools button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:36px;padding:3px!important;font-size:21px!important}

/* Capçalera comuna de Tecno-Apps. */
    .suiteNav { position: relative; z-index: 100; background: rgba(15,17,23,.97); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); padding: 0 2rem; display: flex; align-items: center; height: 72px; flex-shrink: 0; overflow-x: auto; }
    .suiteNav::-webkit-scrollbar { display: none; }
    .suiteNav .nav-brand { font-size: .8rem; font-weight: 700; color: var(--green); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; margin-right: 1.5rem; text-decoration: none; flex-shrink: 0; display: flex; align-items: center; gap: .6rem; }
    .suiteNav .nav-links { display: flex; list-style: none; flex-shrink: 0; }
    .suiteNav .nav-links a { display: block; padding: 0 .9rem; height: 72px; line-height: 72px; font-size: .82rem; font-weight: 500; color: var(--muted); text-decoration: none; white-space: nowrap; transition: color .2s, border-bottom .2s; border-bottom: 2px solid transparent; }
    .suiteNav .nav-links a:hover, .suiteNav .nav-links a.active { color: var(--green); border-bottom-color: var(--green); }

header{height:48px;gap:16px}header h1{display:flex;align-items:center;gap:9px;font-size:20px;margin:0;white-space:nowrap}header h1 img{flex-shrink:0}header span{font-size:12px}.suiteNav ul{margin:0;padding:0}.suiteNav .nav-brand img{height:40px;width:auto;object-fit:contain;border-radius:6px}

#electricalBar .appIdentity{flex-shrink:0;padding-right:10px;border-right:1px solid #475569}.appIdentity h1{display:flex;align-items:center;gap:8px;margin:0;font-size:18px;white-space:nowrap}.appIdentity img{width:28px;height:28px;flex-shrink:0}#electricalBar #togglePanel{flex-shrink:0;white-space:nowrap}

#toolPanel #togglePanel{width:100%;margin:0 0 10px;font-size:12px;white-space:normal}#area #showPanel{position:absolute;top:10px;left:10px;z-index:2;font-size:12px;background:#182235}#area #showPanel[hidden]{display:none}

.wideAction{width:100%;color:#00e676;border-color:#00b854}.schematicsView{position:fixed;inset:0;z-index:200;background:#f4f6fa;color:#172033;overflow:auto}.schematicsView[hidden]{display:none}.schematicsView>header{position:sticky;top:0;z-index:2;height:auto;min-height:72px;padding:12px 24px;background:#111827;color:#e2e8f0;justify-content:space-between;border-bottom:1px solid #334155}.schematicsView header h2{margin:2px 0 0;font-size:22px;color:#fff}.schematicsView .eyebrow{margin:0;color:#00e676;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.schematicTabs{display:flex;gap:8px;padding:16px 24px 8px;background:#e8edf4}.schematicTabs button{min-width:110px;background:#fff;color:#334155}.schematicTabs button.active{background:#00b854;color:#081910;border-color:#009b48}.schematicCircuitPicker{display:flex;align-items:center;gap:10px;padding:8px 24px;background:#e8edf4}.schematicCircuitPicker label{margin:0;font-weight:700}.schematicCircuitPicker select{max-width:520px;background:#fff;color:#172033}.schematicContent{padding:24px;max-width:1100px;margin:auto}.schematicSheet{background:#fff;border:1px solid #cbd5e1;border-radius:10px;box-shadow:0 8px 24px #0f172a18;padding:24px}.schematicSheet h3{margin:0 0 6px;font-size:20px}.schematicSheet>p{color:#475569;font-size:13px}.schematicSummary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:20px 0}.schematicMetric{padding:12px;border:1px solid #d8e0ea;border-radius:7px;background:#f8fafc}.schematicMetric strong{display:block;font-size:20px;color:#007b50}.circuitRows{display:grid;gap:8px;margin-top:18px}.circuitRow{display:grid;grid-template-columns:72px 1fr auto;gap:12px;align-items:center;padding:10px 12px;border-left:5px solid var(--circuit-color);background:#f8fafc;border-radius:5px}.circuitRow strong{color:#172033}.circuitRow span,.circuitRow small{color:#64748b}.emptySchematic{padding:30px;text-align:center;color:#64748b;border:1px dashed #94a3b8;border-radius:8px}@media(max-width:650px){.schematicsView>header{padding:10px 12px}.schematicTabs,.schematicCircuitPicker{padding-left:12px;padding-right:12px}.schematicContent{padding:12px}.schematicSheet{padding:15px}.circuitRow{grid-template-columns:55px 1fr}.circuitRow small{grid-column:2}}

.panelDiagramWrap{margin:20px 0;overflow-x:auto;border:1px solid #d8e0ea;border-radius:8px;background:#fff}.panelDiagram{display:block;min-width:900px;width:100%;height:auto}.diagramWire{stroke:#334155;stroke-width:2;fill:none}.diagramBus{stroke:#172033;stroke-width:4;fill:none}.diagramDevice{fill:#f8fafc;stroke:#334155;stroke-width:2}.diagramDevice.optional{stroke-dasharray:7 5;fill:#fff}.diagramDeviceTitle{font:700 15px 'Segoe UI',sans-serif;fill:#172033}.diagramDeviceDetail{font:12px 'Segoe UI',sans-serif;fill:#64748b}.diagramLabel{font:13px 'Segoe UI',sans-serif;fill:#475569}.diagramSection{font:700 14px 'Segoe UI',sans-serif;fill:#007b50}.diagramCircuit{font:700 14px 'Segoe UI',sans-serif;fill:#172033}.diagramCircuitDetail{font:12px 'Segoe UI',sans-serif;fill:#64748b}.diagramEmpty{font:14px 'Segoe UI',sans-serif;fill:#64748b}.schematicRegulationNote{padding:10px 12px;background:#ecfdf5;border-left:4px solid #00b854;border-radius:4px;color:#334155!important}

.schematicCircuitPicker[hidden]{display:none}

.diagramSymbol{stroke:#172033;stroke-width:2.4;fill:none;stroke-linecap:round}.diagramSymbolThin{stroke:#334155;stroke-width:1.5;fill:none}.diagramTerminal{fill:#fff;stroke:#172033;stroke-width:2}.diagramToroid{fill:none;stroke:#172033;stroke-width:1.7}.diagramTest{fill:none;stroke:#64748b;stroke-width:1.2;stroke-dasharray:3 2}.diagramTestLabel{font:10px 'Segoe UI',sans-serif;fill:#64748b}.diagramSurge{fill:none;stroke:#172033;stroke-width:2;stroke-linejoin:round}.diagramEarth{stroke:#172033;stroke-width:1.5}.optionalWire{stroke-dasharray:5 4}

.circuitDiagram{display:block;min-width:900px;width:100%;height:auto}.circuitElementSymbol{fill:none;stroke:#172033;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.circuitElementSymbol .filled{fill:#172033;stroke:none}.diagramElementLabel{font:11px 'Segoe UI',sans-serif;fill:#475569}.diagramWarning{font:700 13px 'Segoe UI',sans-serif;fill:#b45309}.unassignedWire{stroke:#b45309;stroke-dasharray:5 4}

.sidebarCircuitControls{padding-bottom:12px;border-bottom:1px solid #334155}.sidebarCircuitControls h2{margin-top:4px}.sidebarCircuitControls label{font-size:12px;color:#a9b5c8}.sidebarCircuitControls select{display:block;width:100%;max-width:none;font-size:12px}.sidebarControlRow{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:6px;align-items:center}.sidebarControlRow #deleteCircuit{width:34px;height:34px;display:flex;align-items:center;justify-content:center;padding:4px;color:#fda4af}.sidebarWideButton{width:100%;margin-top:7px;color:#00e676}

.projectTools{display:flex;align-items:center;gap:7px;flex-shrink:0;border-left:1px solid #475569;padding-left:10px}.projectTools button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:4px!important}.projectTools #new{color:#00e676}

.furnitureTools{display:grid;grid-template-columns:1fr 1fr;gap:6px}.furnitureTools button{min-width:0;padding:7px 4px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.furnitureTools button.active{background:#d97706;color:#fff;border-color:#f59e0b}

.receiverMenu{position:fixed;z-index:350;width:min(330px,calc(100vw - 16px));max-height:min(480px,70vh);overflow:auto;padding:8px;background:#111827;border:1px solid #475569;border-radius:9px;box-shadow:0 14px 35px #02061780}.receiverMenu[hidden]{display:none}.receiverOption{display:grid;width:100%;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 9px;margin:0 0 5px;text-align:left;background:#1e293b}.receiverOption:last-child{margin-bottom:0}.receiverIcon{display:flex;align-items:center;justify-content:center}.receiverIcon svg{width:27px;height:27px}.receiverName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.receiverCircuits{padding:3px 6px;border-radius:5px;background:#0f172a;color:#7dd3fc;font-size:10px;font-weight:700;white-space:nowrap}.receiverOption:disabled .receiverCircuits{color:#94a3b8}.receiverOption.active{background:#006d42;color:#fff}

#summaryPanel{width:260px;border-left:1px solid #334155;padding:10px 12px}#summaryPanel #toggleSummary{width:100%;margin-bottom:8px;font-size:12px}body.summary-closed #summaryPanel{display:none}#area #showSummary{position:absolute;top:10px;right:10px;z-index:2;font-size:12px;background:#182235}#area #showSummary[hidden]{display:none}.summaryMetrics{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.summaryMetric{padding:7px 3px;text-align:center;background:#0f172a;border:1px solid #334155;border-radius:6px}.summaryMetric strong{display:block;color:#00e676;font-size:18px}.summaryMetric span{font-size:9px;color:#94a3b8}.summaryCircuitList{display:grid;gap:6px}.summaryCircuit{padding:7px 8px;border-left:4px solid var(--summary-color);background:#22263a;border-radius:5px}.summaryCircuitHeading{display:flex;justify-content:space-between;gap:6px}.summaryCircuitHeading span{font-size:10px;color:#94a3b8}.summaryCircuitName{margin:3px 0;color:#cbd5e1;font-size:11px}.summaryCircuit small{color:#94a3b8;font-size:10px}.summaryCountList{display:grid;gap:4px}.summaryCountRow{display:flex;justify-content:space-between;gap:8px;padding:5px 7px;background:#22263a;border-radius:4px;font-size:11px}.summaryCountRow strong{color:#00e676}.summaryIndependent{display:grid;gap:5px}.summaryIndependent span{padding:6px 7px;background:#22263a;border-radius:4px;font-size:11px}.summaryWarnings{display:grid;gap:5px}.summaryWarning,.summaryOk{margin:0;padding:6px 7px;border-radius:4px;font-size:10px;line-height:1.35}.summaryWarning{background:#451a1a;color:#fecaca}.summaryOk{background:#052e24;color:#a7f3d0}@media(max-width:900px){#summaryPanel{width:210px;padding:8px}.summaryCircuitHeading span{display:none}}

.receiverTable{width:100%;margin-top:18px;border-collapse:collapse;font-size:12px}.receiverTable caption{text-align:left;padding:0 0 8px;color:#172033;font-size:14px;font-weight:700}.receiverTable th,.receiverTable td{padding:8px 10px;border:1px solid #d8e0ea;text-align:left}.receiverTable th{background:#e8edf4;color:#334155}.receiverTable td{color:#475569}.receiverTable td:first-child{font-weight:700;color:#007b50}

.schematicActions{display:flex;gap:8px;align-items:center}
@media(max-width:650px){.schematicActions{flex-wrap:wrap;justify-content:flex-end}.schematicActions button{font-size:11px;padding:6px}}
@media print{body{display:block!important;overflow:visible!important;background:#fff!important}body>*:not(#schematicsView){display:none!important}#schematicsView{position:static!important;display:block!important;overflow:visible!important;background:#fff!important}#schematicsView>header,.schematicTabs,.schematicCircuitPicker{display:none!important}.schematicContent{max-width:none!important;padding:0!important}.schematicSheet{border:0!important;box-shadow:none!important;padding:0!important}.panelDiagramWrap{overflow:visible!important;border:0!important}}
