html,body{margin:0;min-height:100%;background:#0b0f14;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#root{min-height:100%}.toolbar{position:fixed;top:12px;left:12px;z-index:100;display:flex;gap:8px;align-items:center;background:#0000008c;padding:10px 12px;border-radius:14px;color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.page{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;gap:16px;padding:110px 12px 24px;box-sizing:border-box}.leftPane{width:min(32vw,360px);min-width:260px;color:#fff}.rightPane{flex:1;display:flex;flex-direction:column;align-items:center;gap:12px}.panelTitle{font-weight:700;margin:0 0 8px;opacity:.9}.noteArea{width:100%;height:min(70vh,700px);resize:vertical;border-radius:14px;padding:12px;box-sizing:border-box;border:1px solid rgba(255,255,255,.18);background:#00000059;color:#fff;outline:none;line-height:1.5}.noteArea:focus{border-color:#b478ff8c;box-shadow:0 0 0 3px #b478ff2e}@media (max-width: 900px){.page{flex-direction:column;align-items:center}.leftPane{width:min(96vw,900px);min-width:0}.noteArea{height:240px}}.canvasBox{position:relative;width:min(96vw,900px);aspect-ratio:1 / 1;border-radius:18px;overflow:hidden;box-shadow:0 30px 80px #0000008c;background:#111}.mapImage{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none}.labelLayer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;object-fit:contain;pointer-events:none}.iconLayer{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;z-index:20}.mapIcon{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:auto;touch-action:none;width:32px!important;height:32px!important;max-width:32px!important;max-height:32px!important}.drawCanvas{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none;-webkit-user-select:none;user-select:none;z-index:10}.cursorCircle{position:absolute;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:20;mix-blend-mode:difference}