:root{color-scheme:light;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:#243c4a;background:#f4f6f7}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #2184af;outline-offset:3px}button:focus-visible{border-radius:5px}[hidden]{display:none!important}
.app{max-width:1450px;margin:0 auto;padding:30px 38px 22px}.top{display:flex;justify-content:space-between;align-items:center;gap:22px;margin-bottom:22px}.eyebrow{font-size:11px;letter-spacing:.14em;color:#7b919d;margin:0 0 7px;font-weight:650}h1{font-size:27px;line-height:1.15;letter-spacing:-.035em;font-weight:550;margin:0}.top-tag{font-size:13px;color:#557a8e;padding:9px 13px;border:1px solid #d3dfe5;border-radius:20px}
.workspace{display:grid;grid-template-columns:minmax(0,1fr) 335px;gap:24px;align-items:start}.model-wrap{position:relative;background:#e9eff3;border:1px solid #dce6ec;border-radius:12px;overflow:hidden}.model{height:570px;width:100%;position:relative;touch-action:none}.model>canvas{width:100%;height:100%;display:block;cursor:grab;touch-action:none}.model>canvas:active{cursor:grabbing}.model-caption{position:absolute;left:20px;right:20px;top:18px;display:flex;justify-content:space-between;gap:12px;pointer-events:none;color:#8296a3;font-size:11px;letter-spacing:.075em}.views{display:flex;justify-content:center;gap:6px;padding:0 16px 16px;flex-wrap:wrap}.views button{padding:10px 15px;background:#ffffffb0;border:1px solid #d7e1e8;border-radius:6px;color:#48687c;font-size:13px;min-height:40px}.views button[aria-pressed=true]{background:#183c50;color:#e7f8ff;border-color:#183c50}.model-load{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;font-size:14px;color:#6b8191}
.side{padding:4px 0}.side h2{font-size:17px;font-weight:550;margin:0 0 18px}.order{padding-bottom:20px;border-bottom:1px solid #dae3e8}.order-title{font-size:20px;color:#23465b;margin-bottom:8px}.order-meta{display:flex;justify-content:space-between;gap:16px;color:#7b919d;font-size:14px}.order-price{color:#24485e;font-size:19px;font-variant-numeric:tabular-nums}.controls{padding:22px 0;border-bottom:1px solid #dae3e8}.label{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:#8296a2;margin:0 0 12px}.sensor-state{display:flex;align-items:center;gap:8px;font-size:15px;margin-bottom:13px}.sensor-dot{width:7px;height:7px;border-radius:50%;background:#9daeba}.sensor-dot.present{background:#2386a9;box-shadow:0 0 0 4px #27c4ff13}.presence{min-height:46px;width:100%;border:1px solid #b6cdd9;background:#fff;border-radius:6px;color:#28556f;font-size:14px}.presence[aria-pressed=true]{background:#e2f6fc;border-color:#77c4df}.hint{color:#718793;font-size:13px;line-height:1.55;margin:12px 0 0}.zones{padding:22px 0;border-bottom:1px solid #dae3e8}.zone{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:13px 0;color:#6d8593;font-size:14px}.zone:last-child{margin-bottom:0}.zone i{display:block;width:27px;height:3px;background:#c5d0d7;border-radius:2px}.zones.on .zone{color:#315e75}.zones.on .zone i{background:#59dcff;box-shadow:0 0 10px #2fc9ff85}.zone-note{font-size:12px;color:#7f95a2;margin-top:14px}.demos{padding-top:21px}.demo-buttons{display:flex;gap:7px}.demo-buttons button{min-height:42px;flex:1;padding:8px;border:1px solid #ccdae3;background:transparent;border-radius:6px;color:#547489;font-size:13px}.demo-buttons button:hover{background:#e6eef3}
.panel-section{margin-top:25px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.panel-heading h2{font-size:16px;font-weight:550;margin:0}.panel-heading span{font-size:12px;color:#8196a3}.panel-surface{position:relative;width:100%;aspect-ratio:480/98.3208674;clip-path:polygon(0 0,100% 0,100% 48.78%,94.75% 100%,5.25% 100%,0 48.78%);background:#050b10}.panel-surface canvas{display:block;width:100%;height:100%}.panel-hit{position:absolute;border:0;background:transparent;color:transparent;padding:0;font-size:0}.panel-hit:not(:disabled):hover{background:#61deff0a}.panel-hit:focus-visible{outline:2px solid #adf2ff;outline-offset:-4px;border-radius:3px}.panel-note{margin:12px 0 0;color:#768f9d;font-size:13px;line-height:1.5}.progress-text{margin:12px 0 0;font-size:14px;line-height:1.5;color:#496a7e;min-height:21px}
.footer{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:26px;padding-top:17px;border-top:1px solid #dce4e9;color:#8a9ca7;font-size:12px;line-height:1.5}.footer a{color:#668596;text-decoration:none}.footer a:hover{text-decoration:underline}.fallback{object-fit:contain;width:100%;height:100%}
@media(min-width:1200px){.panel-section{max-width:calc(100% - 359px)}}
@media(max-width:1050px){.app{padding:26px 24px}.workspace{grid-template-columns:minmax(0,1fr) 270px;gap:20px}.model{height:500px}.side h2{font-size:16px}.controls,.zones{padding:18px 0}.zone{font-size:13px}}
@media(max-width:760px){.app{padding:22px 16px}.top{margin-bottom:20px}.top-tag{font-size:11px;padding:8px 10px}h1{font-size:24px}.workspace{grid-template-columns:1fr;gap:18px}.model{height:410px}.model-caption{left:14px;right:14px;top:14px;font-size:10px}.views{padding:0 10px 12px;gap:5px}.views button{padding:9px 12px;min-height:42px}.side{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;padding:0}.side h2{display:none}.order{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-bottom:16px}.order-title{margin:0;font-size:18px}.order-meta{align-items:center;gap:15px}.order-price{font-size:18px}.controls,.zones{padding:17px 0 13px;border-bottom:0}.sensor-state{font-size:13px;min-height:18px}.label{font-size:10px;margin-bottom:10px}.presence{font-size:13px;min-height:44px}.hint{font-size:12px}.zone{font-size:12px;margin:12px 0}.zone i{width:18px}.zone-note{font-size:11px}.demos{grid-column:1/-1;border-top:1px solid #dce4e9;padding-top:15px}.demos>.label{display:none}.panel-section{margin-top:22px}.panel-heading h2{font-size:15px}.panel-heading span{font-size:11px}.footer{flex-direction:column;align-items:flex-start;gap:5px;margin-top:22px}.panel-note{font-size:12px}.progress-text{font-size:13px}}
@media(max-width:400px){.app{padding:18px 11px}.top-tag{display:none}.model{height:375px}.side{gap:0 13px}.order-title{font-size:16px}.order-meta{font-size:12px;gap:10px}.order-price{font-size:16px}.panel-heading span{display:none}.zone{font-size:11px}.sensor-state{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.workspace>.side{grid-column:2;grid-row:1/3}.workspace>.panel-section{grid-column:1;grid-row:2;max-width:none;margin-top:0}
@media(max-width:760px){.workspace>.side{grid-column:1;grid-row:3}.workspace>.panel-section{grid-column:1;grid-row:2}}
.finish-controls,.condition-controls{margin:0 0 22px;padding:0 0 20px;border:0;border-bottom:1px solid #dae3e8;min-width:0}.finish-controls legend,.condition-controls legend{font-size:14px;font-weight:550;margin-bottom:12px;padding:0}.finish-options{display:grid;gap:8px}.finish-options button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #ccdae3;border-radius:6px;padding:11px 13px;background:#ffffff9c;color:#385768;min-height:48px;font-size:14px}.finish-options button[aria-pressed=true]{border-color:#2b617a;background:#e9f4f8}.finish-options i{display:block;flex:0 0 25px;height:25px;background:var(--swatch);border:1px solid #849ca347;border-radius:50%}.finish-options small{display:block;font-size:11px;margin-top:2px;color:#778f9b}.condition-options{display:flex;gap:6px;flex-wrap:wrap}.condition-options button{border:1px solid #ccdae3;background:#ffffff9c;min-height:42px;padding:8px 10px;border-radius:6px;color:#466576;font-size:13px}.condition-options button[aria-pressed=true]{background:#25485d;color:#fff;border-color:#25485d}.condition-options button[data-condition]:not([data-condition=normal])[aria-pressed=true]{background:#891e29;border-color:#891e29}.impact-demo{width:100%;border:1px solid #ccdae3;background:#ffffff80;min-height:42px;border-radius:6px;margin-top:12px;color:#41697e;font-size:13px}.displays-section{grid-column:1;grid-row:3}.workspace>.side{grid-row:1/4}.ad-preview{width:100%;aspect-ratio:1408/804;background:#040b11;border-radius:8px;overflow:hidden;position:relative}.ad-preview video,.ad-preview canvas{width:100%;height:100%;display:block}.ad-preview canvas{position:absolute;inset:0}.impact-heading{margin-top:24px}.eco-panel{display:block;width:100%;aspect-ratio:1412/400;background:#040b11}.impact-note{font-size:13px;line-height:1.55;color:#748e9c;margin:8px 0 0}.zones.fault .zone{color:#ad3343}.zones.fault .zone i{background:#ff4b55;box-shadow:0 0 11px #ff4b5577}.app[data-condition=fault] .progress-text,.app[data-condition=filter] .progress-text{color:#ae3241}.demo-buttons button:disabled{opacity:.35}.model-caption span:last-child{font-weight:550}.app[data-condition=fault] #model-phase,.app[data-condition=filter] #model-phase{color:#b72439}
@media(max-width:760px){.workspace>.side{grid-row:3}.workspace>.displays-section{grid-row:4}.side .finish-controls,.side .condition-controls{grid-column:1/-1}.finish-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.finish-options button{padding:10px 8px;gap:7px;font-size:12px}.finish-options i{flex-basis:18px;height:18px}.finish-options small{font-size:10px}.condition-options button{flex:1;font-size:12px}.ad-preview{border-radius:6px}.impact-note{font-size:13px}.displays-section{margin-top:10px}.order{padding-top:3px}}

.app[data-finish="school"] .panel-surface,.app[data-finish="school"] .eco-panel,.app[data-finish="school"] .ad-preview{background:#fbfcff}.app[data-finish="school"] .panel-hit:focus-visible{outline-color:#087ba3}
