/* Master editor: same visual language as the player atlas, but a compact
 * working layout. No map layers, Leaflet positioning or geometry touched.
 * Auth, published view, and private objects keep their existing behavior.
 */
#right-ui-panel {
    width: 286px;
    gap: 12px;
    padding: 2px 4px 12px 2px;
    font-family: var(--ds-font-body);
    scrollbar-color: #adbdaf transparent;
    scrollbar-width: thin;
}

#right-ui-panel > .control-panel,
#right-ui-panel > #map-drawing-controls {
    box-sizing: border-box;
    color: var(--ds-color-text);
    background: var(--ds-color-panel);
    border: 1px solid var(--ds-color-border);
    border-radius: 10px;
    box-shadow: var(--ds-shadow-panel);
    font-family: var(--ds-font-body);
}

#right-ui-panel > #map-drawing-controls,
#right-ui-panel > #location-controls {
    padding: 14px;
}
#right-ui-panel .map-layer-panel,
#right-ui-panel .biome-catalog-panel {
    overflow: hidden;
    padding: 0;
}
#right-ui-panel details > summary {
    color: var(--ds-color-heading);
    font: 700 17px/1.3 var(--ds-font-display);
    padding: 14px 15px;
    border-radius: 10px;
    cursor: pointer;
}
#right-ui-panel details[open] > summary {
    border-radius: 10px 10px 0 0;
    border-bottom: 1px solid var(--ds-color-border-soft);
}
#right-ui-panel details > summary:hover {
    background: var(--ds-color-surface-hover);
}
#right-ui-panel .map-layer-panel-content,
#right-ui-panel .biome-catalog-content {
    padding: 11px 15px 15px;
}

#right-ui-panel .master-panel-heading {
    font: 700 18px/1.35 var(--ds-font-display);
    color: var(--ds-color-heading);
    margin: 0 0 12px;
    letter-spacing: .01em;
}
#right-ui-panel .map-layer-row,
#right-ui-panel .area-label-mode-row {
    color: var(--ds-color-text);
    font: 13px/1.45 var(--ds-font-body);
}
#right-ui-panel .map-layer-row input,
#right-ui-panel input[type="checkbox"] {
    accent-color: var(--ds-color-primary);
}
#right-ui-panel .map-layer-hint,
#right-ui-panel .biome-catalog-hint,
#right-ui-panel .quick-search-hint,
#right-ui-panel .edit-mode-hint {
    color: var(--ds-color-muted);
    line-height: 1.5;
}
#right-ui-panel .map-layer-separator {
    background: var(--ds-color-border-soft);
}
#right-ui-panel .area-label-settings-title,
#right-ui-panel .biome-layer-editor-heading {
    color: var(--ds-color-heading);
}

#right-ui-panel input:not([type="checkbox"]):not([type="range"]):not([type="file"]),
#right-ui-panel select {
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    min-height: 36px;
    padding: 8px 9px;
    background: var(--ds-color-paper);
    border: 1px solid #b8c7bb;
    border-radius: var(--ds-radius-control);
    color: var(--ds-color-text);
    font: 13px/1.35 var(--ds-font-body);
}
#right-ui-panel button {
    box-sizing: border-box;
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid var(--ds-color-primary-border);
    border-radius: var(--ds-radius-control);
    background: var(--ds-color-paper);
    color: var(--ds-color-primary);
    font: 600 12px/1.4 var(--ds-font-body);
    cursor: pointer;
    transition: background-color 120ms ease, border-color 120ms ease;
}
#right-ui-panel button:not(:disabled):hover {
    background: var(--ds-color-surface-hover);
    border-color: var(--ds-color-primary);
}
#right-ui-panel button:disabled { opacity: .55; cursor: default; }
#right-ui-panel #edit-mode-button,
#right-ui-panel #draw-road-button,
#right-ui-panel #draw-area-button {
    width: 100%;
    font-size: 13px;
    text-align: left;
}
#right-ui-panel #edit-mode-button.active,
#right-ui-panel #draw-road-button.active,
#right-ui-panel #draw-area-button.active,
#right-ui-panel .edit-submode-buttons button.active {
    color: #fff;
    background: var(--ds-color-primary);
    border-color: var(--ds-color-primary);
}
#right-ui-panel #edit-mode-button.active:hover,
#right-ui-panel #draw-road-button.active:hover,
#right-ui-panel #draw-area-button.active:hover,
#right-ui-panel .edit-submode-buttons button.active:hover {
    background: var(--ds-color-header);
}
#right-ui-panel #edit-submode-controls { width: 100%; }
#right-ui-panel .edit-mode-hint,
#right-ui-panel #road-options,
#right-ui-panel #biome-layer-editor-controls {
    background: var(--ds-color-surface-tint);
    border: 1px solid var(--ds-color-border-soft);
    border-radius: 7px;
    box-shadow: none;
}
#right-ui-panel #biome-layer-editor-save {
    background: #deede0;
    color: var(--ds-color-heading);
}
#right-ui-panel #biome-layer-editor-delete-vertex:not(:disabled) {
    color: var(--ds-color-danger);
}
#right-ui-panel .biome-audit-panel {
    background: var(--ds-color-paper);
    border-color: var(--ds-color-border);
    border-radius: 7px;
}
#right-ui-panel .biome-audit-panel > summary {
    font: 600 12px/1.4 var(--ds-font-body);
    padding: 10px;
}
#right-ui-panel .biome-catalog-entry,
#right-ui-panel .biome-audit-result {
    border-color: var(--ds-color-border-soft);
    border-radius: 6px;
}
#right-ui-panel .biome-catalog-entry:hover,
#right-ui-panel .biome-audit-result:hover { background: var(--ds-color-surface-hover); }

#coordinates {
    padding: 7px 11px;
    border: 1px solid var(--ds-color-border);
    border-radius: 6px;
    background: var(--ds-color-panel);
    box-shadow: 0 2px 9px rgba(31, 54, 40, .12);
    color: var(--ds-color-text);
    font-size: 12px;
}

/* Editor login and workspace status use the same quiet green palette. */
.auth-gate { background: var(--ds-color-canvas); }
.auth-window {
    background: var(--ds-color-panel);
    border-color: var(--ds-color-border);
}
.auth-window h1 { color: var(--ds-color-heading); }
.auth-workspace-notice {
    background: rgba(247, 247, 243, .98);
    border-color: var(--ds-color-border);
    color: var(--ds-color-text);
    box-shadow: var(--ds-shadow-panel);
    font-family: var(--ds-font-body);
}
.auth-workspace-notice button,
.auth-workspace-notice .auth-publication-link {
    color: var(--ds-color-primary);
    font-family: var(--ds-font-body);
}
.auth-workspace-notice button { border-color: var(--ds-color-border); }
.auth-workspace-notice a:hover { text-decoration: underline; }

/* Only edit forms: shared read-only cards and timeline stay pixel-parallel. */
#location-form .form-window,
#road-form .form-window,
#area-form .form-window,
#biome-catalog-form .form-window {
    background: var(--ds-color-panel);
    border: 1px solid var(--ds-color-border);
    border-radius: var(--ds-radius-panel);
    box-shadow: var(--ds-shadow-panel);
    color: var(--ds-color-text);
    font-family: var(--ds-font-body);
}
#location-form .form-window h2,
#road-form .form-window h2,
#area-form .form-window h2,
#biome-catalog-form .form-window h2 {
    color: var(--ds-color-heading);
    font-family: var(--ds-font-display);
}
#location-form .form-window input:not([type="range"]):not([type="checkbox"]),
#location-form .form-window textarea,
#location-form .form-window select,
#road-form .form-window input:not([type="range"]):not([type="checkbox"]),
#road-form .form-window textarea,
#road-form .form-window select,
#area-form .form-window input:not([type="range"]):not([type="checkbox"]),
#area-form .form-window textarea,
#area-form .form-window select,
#biome-catalog-form .form-window input,
#biome-catalog-form .form-window textarea {
    border: 1px solid #b8c7bb;
    border-radius: var(--ds-radius-control);
    background: var(--ds-color-paper);
    color: var(--ds-color-text);
}
#location-form .form-window :is(input, textarea, select, button):focus-visible,
#road-form .form-window :is(input, textarea, select, button):focus-visible,
#area-form .form-window :is(input, textarea, select, button):focus-visible,
#biome-catalog-form .form-window :is(input, textarea, select, button):focus-visible,
#right-ui-panel :is(input, select, button, summary):focus-visible,
.auth-workspace-notice :is(a, button):focus-visible {
    outline: var(--ds-focus-outline);
    outline-offset: 2px;
}

@media (max-width: 900px) {
    #right-ui-panel { right: 12px; width: 268px; }
}
@media (max-width: 520px) {
    #right-ui-panel {
        width: auto;
        left: 10px;
        right: 10px;
        max-height: min(54vh, 460px);
    }
    #right-ui-panel > #map-drawing-controls,
    #right-ui-panel > #location-controls { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    #right-ui-panel button { transition: none; }
}
