:root{font:16px system-ui;color:#e5edf3;background:#10171d;color-scheme:dark}*{box-sizing:border-box}body{margin:0;padding:32px;max-width:1600px;margin-inline:auto}header,.toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px}small,.muted,footer{color:#98adb9}h1{font-size:30px;margin:8px 0}h2{font-size:18px}main{display:grid;grid-template-columns:300px 1fr;gap:24px;margin-top:24px}aside,section{border:1px solid #30424e;border-radius:16px;padding:20px;background:#17232c}button{font:inherit;border:1px solid #456071;border-radius:8px;background:#243743;color:inherit;padding:9px 12px;cursor:pointer}button:hover,button.selected{border-color:#5ee2bb;background:#224c46}#panel{display:flex;flex-wrap:wrap;gap:8px}.breaker{min-height:90px;min-width:70px}.breaker span{display:block;font-size:12px;margin-top:12px;color:#9fe3d0}.viewport{position:relative;height:55vh;min-height:320px;margin-top:12px}canvas{width:100%;height:100%;display:block;background:#101b23;border-radius:10px;touch-action:none}#empty{position:absolute;inset:0;display:grid;align-content:center;text-align:center;pointer-events:none;line-height:2}#objects{display:flex;gap:8px;flex-wrap:wrap}footer{margin-top:24px;font-size:13px}#detail{line-height:1.7;overflow-wrap:anywhere}@media(max-width:760px){body{padding:16px}header{align-items:start;flex-direction:column}main{grid-template-columns:1fr}section{grid-row:1}.viewport{height:45vh}h1{font-size:25px}.toolbar{gap:8px}.toolbar button{padding:8px}}
#empty[hidden]{display:none}

.photo-scroll{overflow-x:auto;margin-top:24px;border-radius:14px}.photo-wrap{position:relative;min-width:900px}.photo-wrap img{display:block;width:100%}.photo-device{position:absolute;background:transparent;border:2px solid #65bfa977;border-radius:5px;padding:0}.photo-device:hover,.photo-device.selected{background:#5ee2bb44;border-color:#5ee2bb}.photo-device:focus-visible{outline:3px solid white}

.view-modes{display:flex;gap:8px;margin-top:12px}.view-modes [aria-pressed="true"]{border-color:#5ee2bb;background:#224c46}#objects[hidden]{display:none}