.spa-studio{--spa-bg:#0b202c;--spa-ink:#ecf5f4;--spa-muted:#b9cbd0;--spa-accent:#79e0d1;color:var(--spa-ink);background:var(--spa-bg);font-family:Inter,system-ui,sans-serif;padding:clamp(22px,4vw,64px);border-radius:24px;margin:30px auto;max-width:1440px;line-height:1.6;box-sizing:border-box}.spa-studio *{box-sizing:border-box}.spa-studio h1,.spa-studio h2,.spa-studio h3{color:var(--spa-ink);line-height:1.15;letter-spacing:-.03em}.spa-studio h1{font-size:clamp(34px,5vw,68px);max-width:950px;margin:18px 0 24px}.spa-studio h2{font-size:clamp(25px,3vw,40px)}.spa-studio h3{font-size:24px}.spa-studio p{color:var(--spa-muted)}.spa-eyebrow{color:var(--spa-accent)!important;font-size:13px;letter-spacing:.15em;text-transform:uppercase}.spa-studio a{color:var(--spa-accent)}.spa-studio a.spa-btn,.spa-studio button{display:inline-block;background:var(--spa-accent);color:#072c32;border:1px solid transparent;border-radius:9px;padding:12px 18px;cursor:pointer;font:inherit;font-weight:650;text-decoration:none;margin:4px 6px 4px 0}.spa-studio .spa-secondary,.spa-actions button{background:#163745;color:#e5f6f3;border:1px solid #3d606b}.spa-studio a:focus-visible,.spa-studio button:focus-visible,.spa-studio input:focus-visible,.spa-studio select:focus-visible{outline:3px solid #ffcb83;outline-offset:3px}.spa-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:32px;align-items:center;margin-bottom:45px}.spa-hero img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:20px}.spa-filter{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.spa-studio input,.spa-studio select{background:#102f3c;color:#edf8f7;border:1px solid #52747f;border-radius:8px;padding:12px;width:100%;font:inherit}.spa-filter input{max-width:460px}.spa-filter select{max-width:260px}.spa-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.spa-card{background:#12303d;border:1px solid #315460;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}.spa-card[hidden]{display:none}.spa-card img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}.spa-card-body{padding:22px;display:flex;flex-direction:column;flex:1}.spa-card h3{margin:10px 0 14px}.spa-card p{font-size:15px}.spa-card .spa-links{margin-top:auto}.spa-tag{color:#8ce7d9;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.spa-workbench{display:grid;grid-template-columns:320px 1fr;gap:25px}.spa-form{background:#12313e;padding:22px;border-radius:14px}.spa-form label{display:block;font-size:14px;color:#d1e7e8;margin-bottom:16px}.spa-form input{margin-top:6px}.spa-view{min-width:0}.spa-canvas{width:100%;height:auto;border-radius:14px;display:block}.spa-canvas[hidden]{display:none}.spa-results{background:#12313e;border-radius:14px;overflow:auto;margin-top:16px}.spa-studio table{width:100%;border-collapse:collapse;color:#e5f1ef;font-size:15px;border:0}.spa-studio th,.spa-studio td{text-align:left;vertical-align:top;border:0;border-bottom:1px solid #35525d;padding:14px;word-break:break-word}.spa-studio th{font-weight:500;width:53%}.spa-studio td{font-weight:650}.spa-studio td input[type=checkbox]{width:22px;height:22px;vertical-align:middle}.spa-actions{display:flex;flex-wrap:wrap;margin-top:20px}.spa-note{border-left:3px solid #d4aa70;padding-left:15px;font-size:14px}.spa-error{padding:18px;background:#5b2d2d;color:#fff!important}.spa-status{font-size:13px;min-height:22px}.spa-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:35px 0}.spa-info-grid>div{padding:22px;background:#12313e;border-radius:14px}.spa-studio details{border-bottom:1px solid #3b5964;padding:18px 0}.spa-studio summary{cursor:pointer;font-weight:650}.spa-strip{padding:24px;background:#153b48;max-width:1300px;margin:25px auto;border-radius:14px;color:#e1f6f1}.spa-strip a{color:#83e8d4}.spa-illustration-credit{font-size:11px!important;opacity:.85}.spa-studio [hidden]{display:none!important}.spa-studio small{color:#a9c2c8}@media(max-width:1000px){.spa-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spa-workbench{grid-template-columns:280px 1fr}.spa-info-grid{grid-template-columns:1fr}}@media(max-width:700px){.spa-studio{border-radius:0;padding:24px 16px;margin:0}.spa-hero,.spa-workbench,.spa-grid{grid-template-columns:1fr}.spa-hero img{max-height:400px}.spa-filter input,.spa-filter select{max-width:none}.spa-actions button{width:100%}.spa-studio h1{font-size:36px}.spa-card img{aspect-ratio:16/10}}@media print{body>*:not(.spa-studio){background:white!important}.spa-studio{background:white;color:#111;max-width:none;padding:15px;box-shadow:none}.spa-studio h1,.spa-studio h2,.spa-studio h3,.spa-studio p,.spa-studio td,.spa-studio th,.spa-studio label{color:#111!important}.spa-actions,.spa-form button,header,footer,.spa-filter,.spa-nav{display:none!important}.spa-workbench{display:block}.spa-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:white}.spa-results{background:white}.spa-canvas{max-width:550px}.spa-studio input{background:white;color:black}.spa-hero{display:block}.spa-hero img{max-width:250px}.spa-card,.spa-info-grid>div{break-inside:avoid;background:white}.spa-results{overflow:visible}}
.spa-expansion{margin:46px 0;padding:clamp(18px,4vw,38px);border:1px solid #315460;border-radius:24px;background:radial-gradient(ellipse at 95% 5%,#17414d 0,transparent 40%),linear-gradient(150deg,#0f2a37,#0a202c)}.spa-expansion-head{max-width:820px;margin-bottom:25px}.spa-expansion-head h2{margin:0 0 10px}.spa-expansion-tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:14px}.spa-expansion-tools article{padding:19px;border:1px solid #315460;border-radius:16px;background:#12303d}.spa-expansion-tools article>span{font-size:11px;letter-spacing:.12em;color:#79e0d1}.spa-expansion-tools article h3{margin:10px 0;font-size:19px}.spa-expansion-tools article p{font-size:14px;min-height:68px}.spa-expansion-tools article a{font-weight:700}.spa-planners{display:grid;gap:18px;margin-top:20px}.spa-planner{padding:clamp(17px,3vw,27px);border-radius:18px;border:1px solid #315460;background:#102a37;scroll-margin-top:25px}.spa-planner h3{margin-top:0}.spa-planner-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.spa-planner label{display:block;color:#d1e7e8;font-size:14px}.spa-planner input,.spa-planner select,.spa-planner textarea{display:block;margin-top:6px;width:100%;padding:11px 12px;border:1px solid #52747f;border-radius:9px;background:#0d2430;color:#edf8f7;font:inherit}.spa-planner textarea{resize:vertical}.spa-planner input:focus-visible,.spa-planner select:focus-visible,.spa-planner textarea:focus-visible{outline:3px solid #ffcb83;outline-offset:2px}.spa-planner [data-log-list],.spa-planner [data-task-list]{margin-top:18px}.spa-local-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:start;padding:13px 2px;border-bottom:1px solid #35525d}.spa-local-row strong{display:block;color:#ecf5f4}.spa-local-row small{display:block;color:#b9cbd0}.spa-local-row button{padding:7px 10px!important;font-size:12px!important}.spa-safety-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.spa-safety-item{display:flex!important;gap:10px;align-items:flex-start;padding:13px;border:1px solid #315460;border-radius:11px;background:#12303d}.spa-safety-item input{width:20px;height:20px;flex:none;margin-top:1px}.spa-safety-item span{color:#d5e4e4}.spa-expansion .spa-status{color:#b9cbd0}.spa-expansion button:disabled{opacity:.65}@media(max-width:1000px){.spa-expansion-tools{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.spa-expansion-tools,.spa-planner-grid,.spa-safety-list{grid-template-columns:1fr}.spa-expansion-tools article p{min-height:0}.spa-planner{padding:17px}.spa-local-row{grid-template-columns:1fr}.spa-local-row button{width:auto!important}.spa-planner .spa-actions button{width:100%}}
.spa-tech-lab{margin:48px 0;padding:clamp(19px,4vw,40px);border:1px solid #2d6670;border-radius:25px;background:radial-gradient(ellipse at 6% 0,#153f52 0,transparent 38%),linear-gradient(145deg,#071923,#0b2634 62%,#102c3b);color:#eaf6f5}.spa-tech-head{max-width:900px;margin-bottom:26px}.spa-tech-head h2{margin:0 0 12px;font-size:clamp(30px,4vw,48px)}.spa-tech-pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}.spa-tech-pills span{padding:7px 12px;border:1px solid #35606c;border-radius:999px;background:#102f3c;color:#c5e7e4;font-size:13px}.spa-tech-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.spa-tech-card{min-width:0;padding:clamp(17px,2.7vw,26px);border:1px solid #315460;border-radius:19px;background:linear-gradient(155deg,#102f3d,#0c2532);box-shadow:0 14px 36px #020d1440;scroll-margin-top:20px}.spa-tech-card-head>span{color:#79e0d1;font-size:11px;letter-spacing:.13em;font-weight:800}.spa-tech-card h3{margin:8px 0;font-size:23px}.spa-tech-card p{font-size:14px}.spa-tech-device-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:15px 0}.spa-tech-device-options label{display:flex;gap:8px;align-items:center;padding:9px;border:1px solid #284d5a;border-radius:10px;color:#d8e9e9;font-size:13px}.spa-tech-device-options input{width:18px;height:18px;accent-color:#79e0d1}.spa-tech-card button{display:inline-block;margin:4px 6px 4px 0;padding:10px 13px;border:1px solid #4d8b8e;border-radius:10px;background:#79e0d1;color:#082a34;font-weight:750;cursor:pointer}.spa-tech-card button:hover{filter:brightness(1.07)}.spa-tech-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0}.spa-tech-form label{display:block;color:#d1e7e8;font-size:13px}.spa-tech-form input,.spa-tech-form select{display:block;width:100%;margin-top:5px;padding:10px 11px;border:1px solid #496d78;border-radius:9px;background:#0a202c;color:#ecf5f4;font:inherit}.spa-tech-form input:focus-visible,.spa-tech-form select:focus-visible,.spa-tech-card button:focus-visible{outline:3px solid #ffcb83;outline-offset:2px}.spa-topology-output{margin-top:14px;overflow:auto;border:1px solid #284b58;border-radius:14px;background:radial-gradient(circle at 50% 48%,#123846,#071720)}.spa-topology-svg{display:block;width:100%;min-width:550px;height:auto}.spa-topology-label{fill:#eaf6f5;font:700 13px system-ui,sans-serif}.spa-topology-sub{fill:#9cc4c5;font:600 10px system-ui,sans-serif;letter-spacing:1px}.spa-tech-status{min-height:22px!important;color:#a9d2cf!important;font-size:12px!important}.spa-telemetry-chart{display:block;width:100%;height:auto;margin:13px 0;border:1px solid #284b58;border-radius:12px;background:#0b202c}.spa-reading-line{display:block;margin:5px 0;color:#bad0d2!important}.spa-tech-disclaimer{margin:22px 0 0;padding:15px 18px;border-left:4px solid #e0aa66;border-radius:8px;background:#372d20;color:#f1ddbf;font-size:13px}.spa-tech-lab [data-integration-result]{margin-top:15px;padding:0 14px;border-radius:10px;background:#0b202c}.spa-tech-lab [data-integration-result]:not(:empty){padding:14px}.spa-tech-lab [data-integration-result] li{margin:7px 0;color:#d2e2e3;font-size:13px}.spa-tech-lab [data-integration-result] h4{color:#eaf6f5}.spa-tech-print-target{display:block!important}@media(max-width:850px){.spa-tech-grid{grid-template-columns:1fr}}@media(max-width:600px){.spa-tech-lab{padding:18px 14px;border-radius:0;margin:30px -2px}.spa-tech-form,.spa-tech-device-options{grid-template-columns:1fr}.spa-tech-card{padding:16px}.spa-tech-card button{width:100%;margin:5px 0}.spa-topology-svg{min-width:520px}}@media print{body.spa-tech-printing *{visibility:hidden!important}body.spa-tech-printing .spa-tech-print-target,body.spa-tech-printing .spa-tech-print-target *{visibility:visible!important}body.spa-tech-printing .spa-tech-print-target{position:absolute!important;left:0!important;top:0!important;width:100%!important;background:#fff!important;color:#111!important;border:0!important;box-shadow:none!important}body.spa-tech-printing .spa-tech-print-target h3,body.spa-tech-printing .spa-tech-print-target p,body.spa-tech-printing .spa-tech-print-target li,body.spa-tech-printing .spa-tech-print-target label{color:#111!important}body.spa-tech-printing .spa-tech-print-target button{display:none!important}body.spa-tech-printing .spa-tech-print-target canvas{max-height:400px}}
.spa-tech-plus{margin-top:45px;padding-top:32px;border-top:1px solid #315460}.spa-tech-plus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.spa-tech-wide{grid-column:1/-1}.spa-layout-toolbar{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0}.spa-layout-toolbar button{font-size:12px;padding:8px 10px}.spa-layout-wrap{overflow:auto;border:1px solid #315460;border-radius:14px;background:#091d27}.spa-layout-wrap svg{display:block;width:100%;min-width:540px;height:auto;touch-action:none}.spa-layout-room{fill:#0f2a36;stroke:#79e0d1;stroke-width:3}.spa-layout-gridline{stroke:#315460;stroke-width:1;stroke-dasharray:3 5}.spa-layout-dimension{fill:#d9f2f5;font:700 15px system-ui,sans-serif}.spa-layout-node{cursor:grab}.spa-layout-node:active{cursor:grabbing}.spa-layout-node.selected>rect,.spa-layout-node.selected>circle{stroke:#fff;stroke-width:6}.spa-layout-label{fill:#f3fbfa;font:700 11px system-ui,sans-serif;pointer-events:none}.spa-tech-card [data-asset-list],.spa-tech-card [data-scene-list],.spa-tech-card [data-scene-flow]{margin-top:13px}.spa-tech-card [data-scene-flow]:not(:empty){padding:12px;border:1px solid #315460;border-radius:12px;background:#0a202c}.spa-tech-card [data-scene-flow] li{margin:7px 0;color:#d2e2e3}.spa-tech-card [data-scene-flow] p,.spa-tech-card [data-scene-flow] h4{color:#eaf6f5}.spa-tech-card [data-asset-list] a{display:inline-block;margin-top:6px;color:#79e0d1}.spa-tech-card [data-energy-result]:not(:empty){margin-top:14px}.spa-tech-card .spa-error{margin:5px 0;padding:9px;border-radius:8px}.spa-tech-plus .spa-tech-card{height:fit-content}@media(max-width:850px){.spa-tech-plus-grid{grid-template-columns:1fr}}@media(max-width:600px){.spa-layout-toolbar{display:grid;grid-template-columns:1fr 1fr}.spa-layout-toolbar button{width:100%;margin:0}.spa-tech-wide{grid-column:auto}}@media print{body.spa-tech-printing .spa-tech-print-target{color:#111!important}body.spa-tech-printing .spa-tech-print-target .spa-safety-item{border:1px solid #bbb!important;background:#fff!important}body.spa-tech-printing .spa-tech-print-target .spa-safety-item span{color:#111!important}}
.spa-tech-next{margin-top:42px;padding-top:30px;border-top:1px solid #315460}.spa-tech-next .spa-tech-plus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.spa-tech-check{display:flex;gap:9px;align-items:flex-start;margin:12px 0;color:#d1e7e8;font-size:13px}.spa-tech-check input{width:18px;height:18px;flex:none;accent-color:#79e0d1}.spa-tech-next [data-net-result],.spa-tech-next [data-cal-result],.spa-tech-next [data-mqtt-result],.spa-tech-next [data-fw-list],.spa-tech-next [data-thermal-result],.spa-tech-next [data-ops-result]{margin-top:13px}.spa-tech-next [data-mqtt-result] pre{max-width:100%;overflow:auto;padding:12px;border:1px solid #315460;border-radius:10px;background:#081c26;color:#cde8e4;white-space:pre-wrap;overflow-wrap:anywhere}.spa-ops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.spa-ops-stat{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid #315460;border-radius:12px;background:#0a202c}.spa-ops-stat span{color:#79e0d1;font-size:24px;font-weight:800}.spa-ops-stat small{color:#c0d3d4;font-size:12px}.spa-tech-next [data-incident-status]{min-height:30px}.spa-tech-next [data-thermal-result] table{margin:9px 0}.spa-tech-next .spa-local-row a{display:block}.spa-tech-next [data-backup-file]{display:none}@media(max-width:850px){.spa-tech-next .spa-tech-plus-grid{grid-template-columns:1fr}}@media(max-width:600px){.spa-ops-grid{grid-template-columns:1fr}.spa-tech-next .spa-tech-actions{display:grid;grid-template-columns:1fr}.spa-tech-next .spa-tech-actions button{width:100%}}
.spa-tech-next .spa-wifi-radius{fill:#56c7d255;stroke:#79e0d1;stroke-width:2;stroke-dasharray:7 5}.spa-tech-next .spa-wifi-ap{fill:#f5c36b;stroke:#fff;stroke-width:2}.spa-tech-next [data-wifi-map]{display:block;width:100%;height:auto;min-width:520px}.spa-tech-next .spa-tech-check input{margin-top:3px}.spa-tech-next [data-cmp-matrix] select{min-width:130px;padding:8px;border:1px solid #496d78;border-radius:8px;background:#0a202c;color:#ecf5f4}.spa-tech-next [data-cmp-matrix]{overflow:auto}.spa-hash-ok{color:#86e6bc!important;font-weight:800}.spa-tech-next [data-hash-result] code{display:block;padding:12px;overflow-wrap:anywhere;border-radius:9px;background:#071923;color:#a6e8ce}@media(max-width:600px){.spa-tech-next [data-cmp-matrix] table{min-width:620px}.spa-tech-next [data-wifi-map]{min-width:520px}}
