/* Version: 01.01.004 */
/* Panel structure adapted from the supplied Writer reference. */
body { font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif; background:#f4f4f9; color:#333; margin:0; padding:20px; height:100vh; box-sizing:border-box; display:flex; flex-direction:column; }
* { box-sizing:border-box; }
#three-column-layout-container { display:flex; gap:0; flex:1; overflow-x:auto; overflow-y:hidden; min-height:0; }
#left-control-panel { flex:none; width:30%; min-width:260px; background:white; padding:25px; border-radius:8px 0 0 8px; box-shadow:0 4px 6px #0000001a; overflow-y:auto; }
#vertical-layout-divider, #center-layout-divider { flex:none; width:12px; background:#e0e0e0; cursor:col-resize; z-index:10; touch-action:none; }
#vertical-layout-divider:hover, #vertical-layout-divider:focus-visible, #center-layout-divider:hover, #center-layout-divider:focus-visible { background:#007bff; }
#right-graphical-panel { flex:1; min-width:280px; background:white; border-radius:0 8px 8px 0; box-shadow:0 4px 6px #0000001a; border:2px solid #ccc; border-left:none; position:relative; overflow:hidden; }
#vector_graphics_canvas { width:100%; height:100%; background:#fafafa; touch-action:none; }
.interface-section { margin-bottom:25px; padding-bottom:20px; border-bottom:1px solid #e0e0e0; }
h1 { margin-top:0; font-size:1.7rem; } h2 { font-size:1.15rem; } h3 { font-size:1rem; }
button, .feedback-link { background:#0056b3; color:white; border:0; padding:8px 12px; border-radius:4px; cursor:pointer; font-size:13px; margin:0 5px 5px 0; }
button:hover, .feedback-link:hover { background:#004494; } button:disabled { opacity:.4; cursor:default; }
.btn-secondary { background:#6c757d; }
label { display:block; font-weight:600; margin:10px 0; }
textarea,input,select { font:inherit; border:1px solid #b8c3d1; border-radius:4px; padding:8px; max-width:100%; }
textarea { width:100%; resize:vertical; min-height:170px; line-height:1.6; }
input[type=number] { width:135px; } select { width:100%; }
.entry-help { color:#596579; font-size:.85rem; line-height:1.5; }
#entry-status { color:#174575; font-size:.9rem; }
#description-review { white-space:pre-wrap; overflow-wrap:anywhere; line-height:2.1; padding:20px 14px; border:1px solid #bcc6d3; border-radius:6px; max-height:500px; min-height:150px; overflow:auto; background:#fcfdff; user-select:text; }
#description-review:empty::before { content:'Your read-only description will appear here.'; color:#788394; }
.entry-box { display:block; margin:1em 0; border:1px solid var(--entry-color); border-radius:3px; background:var(--entry-background); box-shadow:0 0 0 1px #687384; padding:3px 0; box-decoration-break:clone; -webkit-box-decoration-break:clone; cursor:pointer; }
.entry-box.selected { outline:3px solid #263649; font-weight:700; background:#e8eef8; }
.range-handle { display:inline-block; width:10px; height:23px; vertical-align:middle; background:var(--entry-color); border:2px solid white; border-radius:4px; cursor:ew-resize; touch-action:none; user-select:none; padding:0; margin:0; }
.entry-card { border:1px solid #cbd5e1; border-left:5px solid var(--entry-color); padding:14px; border-radius:6px; margin:14px 0; background:white; }
.entry-card.selected { outline:3px solid #263649; background:#e8eef8; }
.entry-card.selected .entry-text, .entry-card.selected .entry-heading button, .entry-card.selected label, .entry-card.selected input, .entry-card.selected select { font-weight:700; }
.entry-heading { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; align-items:center; }
.entry-text { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.5; background:#f4f7fb; padding:10px; }
.coordinates { display:flex; flex-wrap:wrap; gap:10px; }
.warning { color:#8a4600; background:#fff6e8; padding:8px; border-radius:4px; font-size:.85rem; }
.connection-label { color:#41546e; font-size:.85rem; }
.drawing-toolbar { position:absolute; top:12px; left:12px; right:12px; display:flex; align-items:center; justify-content:space-between; gap:8px; background:#ffffffdf; padding:8px; border-radius:5px; z-index:1; }
#drawing-status { position:absolute; bottom:8px; left:12px; right:12px; font-size:.85rem; background:#ffffffdf; padding:8px; pointer-events:none; }
.north-indicator { position:absolute; top:80px; right:20px; color:#41546e; }
.geometry { fill:none; stroke-width:2.5; vector-effect:non-scaling-stroke; cursor:pointer; }
.geometry { filter:drop-shadow(0 0 1px #263649); }
.geometry.selected { stroke-width:6; }
.geometry-label { cursor:pointer; }
.geometry-label.selected { font-weight:700; font-size:14px; }
.geometry-label { font-size:12px; fill:#263649; stroke:white; stroke-width:3px; paint-order:stroke; }
:focus-visible { outline:3px solid #e69622; outline-offset:3px; }
#center-control-panel { flex:none; width:30%; min-width:280px; padding:25px; background:white; overflow-y:auto; }
#map-controls { border:0; padding:0; margin:0; min-width:0; }
#map-controls input:not([type=range]) { display:block; width:100%; }
#map-opacity { width:100%; }
#map-imagery { position:absolute; inset:0; pointer-events:none; }
#vector_graphics_canvas { position:relative; display:block; }
#vector_graphics_canvas.has-map-imagery { background:transparent; }
#map-attribution { position:absolute; right:12px; bottom:70px; font-size:11px; background:#ffffffdf; padding:4px; pointer-events:none; }
#map-loading { position:absolute; top:80px; left:12px; background:white; padding:8px; pointer-events:none; }
.geometry.map-anchor-selected { stroke-dasharray:8 4; }
.map-anchor-pin { fill:#f7b500; stroke:#333; stroke-width:2; vector-effect:non-scaling-stroke; pointer-events:none; }
.selecting-map-anchor .geometry { cursor:crosshair; }
@media(max-width:950px) { body { padding:6px; } #left-control-panel,#center-control-panel { padding:15px; } }

.call-fields input { display:block; width:100%; }
.interpreted-call { display:block; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; color:#174575; }
.coordinate-row { display:flex; align-items:center; flex-wrap:wrap; gap:5px; margin:10px 0; font-variant-numeric:tabular-nums; }
.coordinate-row input[type=number] { width:calc((100% - 110px) / 2); min-width:65px; flex:1; padding:6px; }
.coordinate-row input::placeholder { color:#788394; opacity:1; }
.computed-coordinate { color:#667085; background:#f4f7fb; }

#author-format-section summary { cursor:pointer; font-weight:600; }
#author-format-section input { display:block; width:100%; }
#author-notes { min-height:70px; }

/* Generated labels do not add characters to source-range calculations. */
.entry-box::before { content:attr(data-entry-label); display:block; font-size:.8rem; font-weight:700; line-height:1.5; color:#263649; background:#eef2f7; padding:2px 6px; user-select:none; }

.feedback-link { display:inline-block; text-decoration:none; }

.project-actions { margin-top:12px; }
.map-anchor-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
#map-anchor-reminder.anchor-required { color:#b42318; }