html,body{background:#cfd8dc;height:100%;margin:0;font-family:system-ui,Segoe UI,sans-serif;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block}#app canvas{cursor:grab}#app canvas.tool{cursor:crosshair}#app canvas.looking{cursor:grabbing}#overlay{cursor:pointer;background:#141c248c;place-items:center;display:grid;position:fixed;inset:0}#overlay.hidden{display:none}#overlay .card{color:#1c2530;background:#fff;border-radius:10px;max-width:460px;padding:24px 32px;box-shadow:0 10px 40px #0000004d}#overlay h1{margin:0 0 4px;font-size:22px}#overlay .hint{color:#2e7d32;margin:0 0 16px;font-weight:600}#overlay ul{margin:0;padding-left:18px;line-height:1.7}#overlay h2{color:#546e7a;margin:12px 0 2px;font-size:14px}#hud{color:#fff;white-space:pre;pointer-events:none;background:#141c24a6;border-radius:6px;padding:6px 10px;font:12px/1.5 ui-monospace,Consolas,monospace;position:fixed;bottom:12px;left:12px}#side{z-index:10;flex-direction:column;gap:10px;max-height:calc(100vh - 110px);display:flex;position:fixed;top:12px;left:12px}#building{color:#fff;cursor:pointer;background:#2e7d32;border:0;border-radius:6px;padding:6px 8px;font:600 13px system-ui,Segoe UI,sans-serif}#building[hidden]{display:none}#floors,#tools{flex-direction:column;gap:4px;display:flex}#floors[hidden],#tools[hidden],#notes[hidden]{display:none}#floors button,#tools button,#notes button{color:#fff;text-align:left;cursor:pointer;background:#141c24b8;border:0;border-radius:6px;min-width:120px;padding:6px 10px;font:13px system-ui,Segoe UI,sans-serif}#floors button:hover,#tools button:hover,#notes button:hover{background:#283848d9}#floors button.active{background:#2e7d32}#floors button[data-mode]{margin-top:6px}#floors button[data-mode].active,#tools button.active{background:#1565c0}#notes{color:#fff;background:#141c24cc;border-radius:8px;width:220px;padding:8px;font:12px/1.4 system-ui,Segoe UI,sans-serif;overflow-y:auto}#notes .note{cursor:pointer;align-items:flex-start;gap:6px;margin:4px 0;display:flex}#notes .note b{color:#ffd54f}#notes .note span{flex:1}#notes .note button{background:0 0;min-width:0;padding:0 6px}#notes .row{gap:4px;margin-top:6px;display:flex}#notes .row button{text-align:center;flex:1;min-width:0}#labels{z-index:4;pointer-events:none;position:fixed;inset:0;overflow:hidden}.measure-label,.note-pin{white-space:nowrap;font:600 12px system-ui,Segoe UI,sans-serif;position:absolute;top:0;left:0;translate:-50% -50%}.measure-label{color:#ffd54f;background:#141c24d9;border-radius:4px;padding:2px 6px}.measure-label.live{outline:1px dashed #ffd54f}.measure-label.opening{color:#a5d6a7;translate:-50% -140%}.note-pin{color:#fff;background:#e53935;border:2px solid #fff;border-radius:50%;place-items:center;width:22px;height:22px;display:grid;box-shadow:0 1px 3px #00000080}#note-form{z-index:20;background:#fff;border-radius:10px;flex-direction:column;gap:8px;width:320px;padding:14px;font:13px system-ui,Segoe UI,sans-serif;display:flex;position:fixed;top:50%;left:50%;translate:-50% -50%;box-shadow:0 10px 40px #00000059}#note-form[hidden]{display:none}#note-form textarea{font:inherit;resize:vertical;padding:6px}#minimap{z-index:10;cursor:crosshair;border-radius:8px;width:360px;height:150px;position:fixed;bottom:12px;right:12px}#minimap.big{width:min(80vw,1100px);height:min(34vw,470px)}#minimap[hidden]{display:none}#overlay{z-index:5}#joystick{z-index:11;touch-action:none;background:#141c2459;border:2px solid #ffffff80;border-radius:50%;place-items:center;width:130px;height:130px;display:grid;position:fixed;bottom:24px;left:24px}#joystick>div{pointer-events:none;background:#ffffffbf;border-radius:50%;width:56px;height:56px}@media (width<=700px){#overlay{z-index:12}#overlay .card{margin:0 16px;padding:18px 20px}#side{gap:6px;max-height:50vh;overflow-y:auto}#floors button,#tools button,#notes button{min-width:0;padding:5px 8px;font-size:12px}#minimap{width:46vw;height:22vw}#hud{font-size:10px;bottom:calc(22vw + 20px);left:auto;right:12px}}#hint{color:#fff;pointer-events:none;background:#141c24a6;border-radius:6px;padding:6px 12px;font-size:13px;position:fixed;top:12px;left:50%;transform:translate(-50%)}#hint[hidden]{display:none}@media (width<=1100px){#hint{font-size:12px;top:40px;left:160px;right:12px;transform:none}}#crosshair{pointer-events:none;background:#ffffffd9;border-radius:50%;width:6px;height:6px;margin:-3px 0 0 -3px;position:fixed;top:50%;left:50%;box-shadow:0 0 2px #000c}#crosshair[hidden]{display:none}