.lp-workspace { display: grid; grid-template-columns: minmax(230px, 0.82fr) minmax(360px, 1.7fr) minmax(230px, 0.82fr); gap: 1rem; align-items: stretch; }
.lp-panel { min-width: 0; }
.lp-stage-card { min-height: 620px; overflow: hidden; }
#lp-local-canvas, #lp-map { display: block; width: 100%; height: 620px; }
.lp-canvas-toolbar { position: absolute; z-index: 500; top: .75rem; left: .75rem; right: .75rem; display: flex; justify-content: space-between; gap: .75rem; padding: .45rem .65rem; border-radius: .5rem; background: rgb(255 255 255 / .9); color: #475569; font: 12px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; pointer-events: none; }
.lp-source-item { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .65rem .75rem; border-bottom: 1px solid #e2e8f0; text-align: left; }
.lp-source-item:hover, .lp-source-item[aria-selected="true"] { background: #eff6ff; }
.lp-source-item:last-child { border-bottom: 0; }
.lp-source-item small { color: #64748b; }
.lp-metrics dt { color: #64748b; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.lp-metrics dd { margin: .15rem 0 0; color: #0f172a; font-size: 1.2rem; font-weight: 800; }
.lp-legend { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .5rem; color: #64748b; font-size: .75rem; }
.lp-legend i { height: .65rem; border-radius: 99px; background: linear-gradient(90deg, #172554, #0369a1, #22c55e, #facc15, #ef4444); }
.lp-source-marker { display: grid; place-items: center; width: 26px; height: 26px; border: 2px solid white; border-radius: 50%; background: #2563eb; box-shadow: 0 1px 4px rgb(15 23 42 / .4); color: white; font-weight: 800; }
.lp-area-handle { width: 14px; height: 14px; border: 2px solid white; border-radius: 3px; background: #f97316; box-shadow: 0 1px 4px rgb(15 23 42 / .5); }
@media (max-width: 1100px) { .lp-workspace { grid-template-columns: minmax(240px, 1fr) minmax(360px, 1.5fr); } .lp-results { grid-column: 1 / -1; } }
@media (max-width: 720px) { .lp-workspace { display: flex; flex-direction: column; } .lp-stage-card { order: -1; min-height: 430px; } #lp-local-canvas, #lp-map { height: 430px; } .lp-canvas-toolbar { font-size: 10px; } }
@media print { .site-header, .site-footer, .lighting-planner > .card:first-child, .lp-panel:first-child, .btn, .lp-canvas-toolbar { display: none !important; } .lp-workspace { display: block; } .lp-stage-card { min-height: auto; border: 0; box-shadow: none; } #lp-local-canvas { height: 520px; } .lp-results { margin-top: 1rem; } }