:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#111;background:#f4f1ea;font-synthesis:none}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}button{font:inherit;color:inherit}main{height:100%;display:grid;grid-template-rows:74px 1fr 48px;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}header{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;gap:16px}.brand{height:42px;min-width:260px;border:2px solid #111;display:flex;align-items:center;padding:0 18px;position:relative;letter-spacing:.1em}.brand .line{flex:1}.handle{position:absolute;width:13px;height:13px;background:#f4f1ea;border:2px solid #111}.handle.square{left:-7px;top:-7px}.handle.circle{right:-7px;bottom:-7px;border-radius:50%}.status{display:flex;gap:12px;color:#555;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.workspace-shell{min-height:0;position:relative;overflow:hidden;border-block:1px solid #bdbab3}canvas{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.tools{position:absolute;left:50%;bottom:max(16px,env(safe-area-inset-bottom));transform:translate(-50%);display:flex;gap:4px;padding:6px;background:#f4f1eaeb;border:2px solid #111;box-shadow:5px 5px #111}.tools button,.benchmark button{border:0;background:transparent;min-width:44px;min-height:44px;font-size:22px;border-radius:2px}.tools button:hover,.tools button.active,.benchmark button:hover{color:#fff;background:#111}.tools button:disabled{opacity:.25}.tools span{width:1px;background:#aaa;margin:6px 3px}.benchmark{position:absolute;top:14px;right:14px;display:flex;align-items:center;gap:2px;background:#f4f1ea;border:1px solid #111;padding:2px}.benchmark span{font-size:10px;letter-spacing:.08em;padding:0 8px}.benchmark button{min-width:38px;min-height:34px;font-size:11px;font-weight:700}.inspector{position:absolute;left:14px;top:14px;width:min(260px,calc(100% - 28px));padding:10px;background:#f4f1eaf5;border:1px solid #111;box-shadow:3px 3px #111;font-size:12px}.inspector label{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px}.inspector input{width:100%;accent-color:#2457ff}.inspector div{display:flex;gap:5px;margin-top:8px}.inspector button{min-height:38px;flex:1;border:1px solid #111;background:#fff}.inspector button:disabled{opacity:.35}.inspector small{display:block;margin-top:6px}footer{display:flex;justify-content:center;align-items:center;gap:8px;font-size:14px;letter-spacing:.04em}.triangle{width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;border-bottom:20px solid #111}.bar{width:8px;height:20px;background:#111}@media(max-width:680px){main{grid-template-rows:62px 1fr 34px}.brand{min-width:178px;height:36px;padding:0 12px;font-size:13px}.status span:last-child{display:none}header{padding:10px 12px}.tools{width:calc(100% - 24px);justify-content:flex-start;bottom:12px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.tools::-webkit-scrollbar{display:none}.tools button{flex:0 0 44px}.tools span{display:none}.benchmark{top:8px;right:8px}.benchmark span{display:none}footer{font-size:11px}.inspector{top:8px;left:8px;width:210px}}