/* Compact image workspace. Shared by all seven locales. */
.controls .upload-hint,.controls .file-types,.controls .heif-note{text-align:left}
.controls .upload-hint{font-size:14px;line-height:1.65;margin-top:12px}
.controls .file-types,.controls .heif-note{font-size:13px;line-height:1.65;color:#657184}
.controls .file-types{margin:12px 0 0}
.controls .heif-note{margin-top:8px}
.controls .control-description{margin:12px 0 16px}
.controls .control-caption{font-size:14px;line-height:1.65;margin-top:8px;color:#657184}
.controls .control-divider{margin:22px 0}
.file-unit{white-space:nowrap}
.preview-area .preview-heading{margin-bottom:16px;gap:16px;line-height:1.5}
#dimensions{white-space:nowrap;font-variant-numeric:tabular-nums}
.preview-area #region-tools{padding:16px;margin:0 0 20px;border:1px solid #e1e6ee;border-radius:10px;box-shadow:0 2px 5px #24374703}
#region-tools .selection-toolbar{margin:0;gap:12px;display:flex;flex-wrap:wrap}
.selection-tool-buttons{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.selection-tool-buttons button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:9px 12px;border:1px solid transparent;border-radius:6px;background:#f4f6f9;color:#475467;font:500 15px/1.3 var(--body);cursor:pointer;white-space:nowrap}
.selection-tool-buttons button img{flex:none;opacity:.75}
.selection-tool-buttons button:hover:not(:disabled){background:#e9eef6;color:var(--ink)}
.selection-tool-buttons button[aria-pressed="true"]{color:#2e50cd;background:#edf1ff;border-color:#c9d4ff}
.selection-tool-buttons button[aria-pressed="true"] img{opacity:1}
.selection-tool-buttons button:disabled{opacity:.5;cursor:default}
#region-tools button:focus-visible,#region-tools summary:focus-visible,#region-tools select:focus-visible,#region-tools input:focus-visible{outline:3px solid #3459df;outline-offset:3px}
#region-tools #brush-control{width:100%;padding:10px 12px;border-radius:6px;background:#f7f8fb;gap:10px;font-size:14px}
#region-tools #brush-control label{font-size:14px;width:auto}
#region-tools #brush-size{flex:1;min-width:80px;max-width:220px}
#region-tools #brush-size-value{font-size:14px;color:var(--ink)}
.selection-management{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;margin-top:14px;padding-top:14px;border-top:1px solid #edf0f4}
#region-tools .region-select-label{margin:0;display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;color:#536073}
#region-tools #region-select{font-size:14px;min-height:38px;min-width:126px;padding:6px 8px;max-width:240px;border-radius:6px}
#region-tools .region-actions{display:flex;flex-wrap:wrap;gap:4px}
#region-tools .region-actions button{font:400 14px/1.4 var(--body);min-height:38px;padding:7px 10px;background:transparent;border:1px solid transparent;border-radius:6px;color:#536073}
#region-tools .region-actions #add-region{color:#3156ce;border-color:#dfe5f1;background:#fff}
#region-tools .region-actions button:hover:not(:disabled){background:#f1f4fa;border-color:#dfe5f1}
#region-tools .region-actions #delete-region:hover:not(:disabled),#region-tools .region-actions #clear-regions:hover:not(:disabled){color:#aa3434;background:#fff4f3;border-color:#f4d5d2}
#region-tools .region-actions button:disabled{opacity:.4}
#region-tools #region-count{margin:0 0 0 auto;font-size:12px;line-height:1.5;color:#657184}
.selection-secondary{display:flex;flex-direction:column;gap:8px;margin-top:12px}
#region-tools summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;min-height:44px;padding:10px 12px;border:1px solid #dce3ee;border-radius:6px;background:#f6f8fb;font-size:14px;font-weight:500;line-height:1.6;color:#35445b;list-style:none}
#region-tools summary::marker{content:''}
#region-tools summary::-webkit-details-marker{display:none}
#region-tools summary::after{content:'';display:block;width:18px;height:18px;flex:0 0 18px;background:url('/vendor/editor-icons/chevron-down.svg') center/18px no-repeat;opacity:.7}
#region-tools summary:hover{background:#edf2fa;border-color:#b8c7e1}
#region-tools details[open]>summary{background:#edf1ff;border-color:#c9d4ff;color:#2e50cd}
#region-tools details[open]>summary::after{transform:rotate(180deg)}
/* The site's older FAQ rule rotates summary spans. Only the arrow may rotate. */
#region-tools #region-help{font-size:14px;font-weight:500;line-height:1.6;margin:0;color:inherit;flex:1 1 auto;min-width:0;transform:none;overflow-wrap:anywhere}
#region-tools .selection-help[open]{padding-bottom:4px}
#region-tools #region-gesture-help,#region-tools #history-note{font-size:13px;line-height:1.75;margin:6px 0 0;color:#657184;max-width:82ch}
#region-tools #region-fields{padding:4px 0 12px;max-width:560px}
#region-tools #region-fields label{font-size:13px}
#region-tools #selection-message:empty{display:none}
.region-editing .image-mat{border-radius:8px}
@media(min-width:901px){.preview-area{padding:24px}.controls{padding:24px}.workspace{grid-template-columns:288px minmax(0,1fr)}}
@media(min-width:1400px){.workspace{grid-template-columns:300px minmax(0,1fr)}}
@media(max-width:600px){
 .preview-area #region-tools{padding:12px;margin-bottom:16px}
 .selection-tool-buttons{gap:6px}
 .selection-tool-buttons button{min-height:44px;padding:9px 10px;font-size:14px;flex:1 1 auto}
 #region-tools .selection-toolbar{align-items:center}
 .selection-management{gap:8px;margin-top:12px;padding-top:12px}
 #region-tools .region-select-label{width:100%;justify-content:space-between}
 #region-tools #region-select{max-width:65%;min-height:44px}
 #region-tools .region-actions{width:100%;gap:4px}
 #region-tools .region-actions button{flex:1 1 auto;min-height:44px;padding-inline:6px;font-size:13px}
 #region-tools #region-count{margin:0}
 #region-tools summary{min-height:44px}
 .preview-area .preview-heading{font-size:12px;flex-wrap:wrap;gap:4px 12px}
}