.marker-adjust{margin:8px 0 0;min-height:44px}
.marker-note{max-width:360px;text-align:center;margin:8px 0}
.marker-open{overflow:hidden}
.marker-editor{width:min(820px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:20px;border:1px solid var(--line);border-radius:14px;color:var(--ink);background:var(--paper,#fffdf8);overflow:auto}
.marker-editor::backdrop{background:rgba(25,23,20,.65)}
.marker-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.marker-head h2{font-size:1.35rem;margin:0}
.marker-close{min-width:44px;min-height:44px;font-size:1.6rem;background:none;border:0;cursor:pointer}
.marker-editor p{margin:6px 0 12px;font-size:.9rem;line-height:1.4}
.marker-canvas{display:flex;justify-content:center;background:#ebe8e1;padding:8px;border-radius:6px}
.marker-board{position:relative;display:inline-block;line-height:0;touch-action:none;cursor:crosshair;user-select:none;max-width:100%}
.marker-board:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.marker-board img{display:block;max-width:100%;max-height:calc(100dvh - 400px);width:auto;height:auto;user-select:none;-webkit-user-drag:none}
.marker-target{position:absolute;width:28px;height:28px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 2px #1d1b1a;transform:translate(-50%,-50%);pointer-events:auto;cursor:move;touch-action:none;background:rgba(255,255,255,.18)}
.marker-target:before,.marker-target:after{content:'';position:absolute;left:50%;top:50%;background:#1d1b1a;box-shadow:0 0 0 1px #fff;transform:translate(-50%,-50%)}
.marker-target:before{width:14px;height:2px}.marker-target:after{width:2px;height:14px}
.marker-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:12px 0 8px}
.marker-arrows{display:flex;gap:6px}.marker-arrows button{min-height:44px;min-width:44px;background:white;border:1px solid var(--line);border-radius:7px;font-size:1.1rem;cursor:pointer}
.marker-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:12px}
.marker-actions .btn{padding:12px 14px;font-size:.95rem;white-space:nowrap}
.marker-editor #markerStatus{min-height:2.8em;font-size:.85rem}
.marker-editor button:disabled{opacity:.5;cursor:default}
.marker-editor .btn-ghost{min-height:44px}
.marker-editor .btn-ghost:hover{background:var(--paper-2);color:var(--ink)!important;transform:none}
@media(max-width:480px){.marker-editor{padding:12px}.marker-tools{justify-content:center}.marker-actions>*{flex:1}.marker-board img{max-height:calc(100dvh - 420px)}}
@media(max-height:500px){.marker-board img{max-height:240px}}

.marker-zoom{display:flex;align-items:center;justify-content:center;gap:8px;margin:8px 0}
.marker-zoom button{min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:600 .95rem var(--sans);cursor:pointer;padding:8px 12px}
.marker-zoom output{min-width:42px;text-align:center;font-variant-numeric:tabular-nums}
.marker-viewport{overflow:auto;max-width:100%;overscroll-behavior:contain;touch-action:none;line-height:0;scrollbar-width:thin}
.marker-viewport .marker-board{max-width:none;display:block;margin-inline:auto}
.marker-viewport.zoomed{cursor:grab}.marker-viewport.zoomed .marker-board{cursor:grab}
.marker-viewport .marker-target{cursor:move}