:root {
  --ink:#151515; --line:#8d8d8d; --paper:#fff; --canvas:#e9e9e7; --green:#334c3a;
  font-family:Arial,Helvetica,sans-serif; color:var(--ink);
}
* { box-sizing:border-box; }
body { margin:0; background:var(--canvas); font-family:Arial,Helvetica,sans-serif; }
.utility-bar { height:56px; background:#fff; border-bottom:1px solid #cfcfcb; display:flex; align-items:center; justify-content:space-between; padding:0 22px; position:sticky; top:0; z-index:20; }
.brand,.utility-actions,.language { display:flex; align-items:center; }
.brand { gap:12px; font-size:13px; color:#4d4d4d; }
.brand img { width:168px; height:32px; object-fit:contain; }
.utility-actions { gap:10px; }
.language { border:1px solid #babcb7; border-radius:4px; overflow:hidden; }
.language button,.manage-button { font:700 11px/1 Arial,sans-serif; letter-spacing:.04em; border:0; background:#fff; color:#354237; min-height:29px; padding:0 11px; cursor:pointer; }
.language button+button { border-left:1px solid #d3d4d1; }
.language button[aria-pressed=true] { background:var(--green); color:#fff; }
.language button.has-pending { color:#8a3f16; background:#fff3e8; }
.language button.has-pending[aria-pressed=true] { color:#fff; background:#9b4d20; }
.management-actions { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.management-actions[hidden] { display:none; }
.manage-button { border:1px solid #314b39; border-radius:4px; }
.save-header { font:700 11px/1 Arial,sans-serif; letter-spacing:.02em; min-height:29px; padding:0 11px; cursor:pointer; border:1px solid #314b39; border-radius:4px; background:var(--green); color:#fff; }
.save-header:disabled { cursor:not-allowed; opacity:.48; }
.last-saved { color:#5d665f; font:11px/1.2 Arial,sans-serif; white-space:nowrap; }
.translation-warning { width:min(1180px,calc(100% - 40px)); box-sizing:border-box; margin:20px auto -8px; padding:12px 14px; display:grid; gap:4px; border:1px solid #c66f35; border-left:5px solid #9b4d20; border-radius:5px; background:#fff3e8; color:#54260f; font-size:12px; line-height:1.4; }
.translation-warning strong { font-size:13px; }

.sheet { width:min(1180px,calc(100% - 40px)); margin:26px auto; background:var(--paper); border:2px solid #1f1f1f; box-shadow:0 8px 24px #00000012; padding:0 26px 22px; }
.sheet-head { min-height:230px; display:grid; grid-template-columns:minmax(360px,1fr) minmax(400px,1.12fr); gap:22px; align-items:center; border-bottom:0; padding:24px 0 18px; position:relative; }
.sheet-head::after { content:""; position:absolute; right:0; bottom:0; left:0; height:1px; background:#b7b7b7; z-index:2; }
.sheet-head__copy { padding-left:8px; border-left:6px solid var(--ink); position:relative; z-index:3; }
.sheet-head__copy h1 { font-size:27px; line-height:1.08; letter-spacing:.01em; margin:0 0 13px; }
.sheet-head__copy p { max-width:405px; margin:0; font-size:13px; line-height:1.52; color:#484848; font-style:italic; }
.map { margin:0; display:flex; justify-content:center; align-items:center; position:relative; z-index:0; }
.map-trigger { display:block; border:0; background:transparent; padding:0; cursor:zoom-in; }
/* +20% visual sin alterar la altura reservada para la cabecera ni la tabla. */
.map img { display:block; max-width:100%; max-height:200px; object-fit:contain; transform:scale(1.2); transform-origin:center; }
.table-title { font-size:18px; margin:18px 0 8px; letter-spacing:.01em; }
.table-wrap { overflow-x:auto; border:1px solid var(--line); }
.word-table { border-collapse:collapse; width:100%; min-width:1040px; table-layout:fixed; }
.word-table th,.word-table td { border:1px solid var(--line); }
.word-table th { background:#fff; font-size:13px; line-height:1.15; text-align:center; vertical-align:middle; font-weight:700; padding:9px 7px; }
.word-table td { font-size:12px; line-height:1.39; vertical-align:top; padding:10px; }
.word-table .ref { width:6%; text-align:center; vertical-align:middle; font-weight:700; font-size:16px; background:#fbfbfb; }
.word-table col.visual { width:14%; }
.word-table col.narrative { width:27%; }
.word-table .image-cell { padding:8px; text-align:center; vertical-align:middle; background:#fdfdfd; }
.media-slot { display:inline-grid; gap:6px; justify-items:center; width:100%; border:0; background:transparent; padding:0; cursor:zoom-in; font:inherit; color:inherit; }
.media-slot img { width:112px; height:112px; object-fit:contain; background:#f5f5f3; border:1px solid #b8b8b8; padding:3px; }
.media-slot figcaption { font-size:10px; line-height:1.28; max-width:140px; color:#444; }
.empty-slot { display:grid; place-items:center; min-height:112px; color:#555; font-size:15px; }
.proposal { vertical-align:middle!important; }
.proposal p { margin:0; }

.footer { display:grid; grid-template-columns:1.05fr 1.15fr 1fr; gap:10px; align-items:stretch; padding:18px 2px 2px; font-size:11px; color:#343434; }
.footer-card { min-height:0; border:1px solid #c5c8c3; border-radius:6px; background:#fafaf8; padding:10px 12px; display:flex; flex-direction:column; justify-content:center; line-height:1.35; }
.footer-card b { display:block; margin-bottom:3px; font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#455447; }
.footer-card span { font-size:15px; font-weight:700; color:#242424; }
.footer-card small { font-size:11px; color:#464646; }
.footer-card--notice { background:#f1f3ee; gap:4px; align-items:stretch; text-align:center; }
.footer-card__brandline { display:flex; align-items:center; justify-content:center; gap:8px; }
.footer-card--notice img { width:134px; max-height:31px; object-fit:contain; object-position:center; }
.footer-card--notice b { margin:0; color:#303d33; text-transform:none; letter-spacing:.02em; font-size:11px; white-space:nowrap; }
.footer-card--notice small { line-height:1.3; }

.joins-head { grid-template-columns:minmax(360px,1fr) minmax(400px,1.12fr); gap:22px; }
.joins-head .sheet-head__copy p { max-width:405px; margin:0; font-size:13px; line-height:1.52; color:#484848; font-style:italic; }
.joins-map { margin:0; text-align:right; }
.joins-map .map-trigger { display:inline-block; }
.joins-map img { width:min(100%,380px); max-height:175px; object-fit:contain; }
.joins .table-title { margin-top:14px; }
.hover-preview { position:fixed; z-index:60; width:260px; padding:8px; background:#fff; border:1px solid #666; box-shadow:0 12px 32px #0004; pointer-events:none; visibility:hidden; opacity:0; transform:translate(-50%,-50%) scale(.88); transform-origin:center; transition:opacity .16s ease,transform .16s ease,visibility 0s linear .16s; }
.hover-preview.is-visible { visibility:visible; opacity:1; transform:translate(-50%,-50%) scale(1); transition:opacity .16s ease,transform .16s ease; }
.hover-preview img { width:auto; max-width:100%; height:auto; max-height:300px; display:block; margin:0 auto; object-fit:contain; image-rendering:auto; }
.hover-preview span { display:block; padding:6px 2px 0; font-size:11px; color:#343434; }
.hover-preview.is-map-preview { padding:0; border:0; background:transparent; box-shadow:none; }
.hover-preview.is-map-preview img { width:100%; max-width:none; max-height:340px; }
.hover-preview.is-map-preview span { display:none; }
.image-modal { display:none; position:fixed; z-index:70; inset:0; background:#000a; padding:30px; }
.image-modal[aria-hidden=false] { display:grid; place-items:center; }
.image-modal__card { position:relative; width:min(880px,100%); height:min(80vh,720px); display:grid; place-items:center; background:#fff; padding:30px; }
.image-modal__card img { display:block; max-width:100%; max-height:100%; object-fit:contain; }
.image-modal__card button { position:absolute; right:8px; top:6px; border:0; background:transparent; font-size:30px; cursor:pointer; }
.editor { position:fixed; z-index:50; right:0; top:0; width:min(385px,100vw); height:100vh; background:#fff; box-shadow:-10px 0 32px #0003; transform:translateX(105%); transition:transform .2s ease; padding:20px; overflow:auto; }
.editor.open { transform:translateX(0); }
.editor header { display:flex; justify-content:space-between; align-items:start; border-bottom:1px solid #d6d6d2; padding-bottom:12px; }
.editor h2 { margin:4px 0 0; font-size:21px; }
.editor header button { border:0; background:transparent; font-size:28px; cursor:pointer; }
.editor>p { font-size:12px; line-height:1.45; color:#555; }
.translation-status { margin:12px 0; padding:9px 10px; border-radius:4px; font-size:12px; line-height:1.4; }
.translation-status--source { color:#284030; background:#edf4ef; border:1px solid #adc2b3; }
.translation-status--pending { color:#54260f; background:#fff3e8; border:1px solid #c66f35; }
.translation-status--current { color:#284030; background:#edf4ef; border:1px solid #adc2b3; }
.transfer-panel { display:grid; gap:7px; margin:0 0 14px; padding:10px; border:1px solid #c8cec8; border-radius:4px; background:#f7f8f5; font-size:12px; line-height:1.35; }
.transfer-panel>strong { color:#273d2e; }
.transfer-actions { display:flex; flex-wrap:wrap; gap:6px; }
.transfer-actions button,.import-button { box-sizing:border-box; border:1px solid #667168; border-radius:3px; background:#fff; color:#26352b; padding:7px 9px; cursor:pointer; font:700 11px/1.2 Arial,sans-serif; }
.transfer-actions button:disabled { cursor:not-allowed; opacity:.46; }
.transfer-actions #export-final:not(:disabled) { background:var(--green); border-color:var(--green); color:#fff; }
#transfer-status[data-tone="error"] { color:#8a281d; }
#transfer-status[data-tone="success"] { color:#23613b; }
.editor label>small { display:block; margin-top:4px; color:#626b64; font-size:10px; line-height:1.3; }
.editor label { display:grid; gap:6px; font-size:12px; font-weight:700; margin:15px 0; }
.editor select,.editor textarea,.editor input { width:100%; font:13px/1.4 Arial,sans-serif; padding:8px; border:1px solid #b9bdb8; border-radius:3px; background:#fff; }
.rich-field { display:grid; gap:6px; margin:15px 0; font-size:12px; font-weight:700; }
.rich-toolbar { display:flex; gap:5px; padding:5px; border:1px solid #d2d5d0; border-radius:3px; background:#f6f7f4; }
.rich-toolbar button { width:27px; height:25px; border:1px solid #acb2ab; border-radius:3px; background:#fff; cursor:pointer; font:700 13px/1 Arial,sans-serif; }
.rich-toolbar .tone-button { position:relative; }.rich-toolbar .tone-button::after { content:""; position:absolute; inset:6px; border-radius:50%; background:currentColor; }
.tone-button--black { color:#151515; }.tone-button--red { color:#d32f2f; }.tone-button--green { color:#2e7d32; }
.rich-editor { min-height:118px; padding:8px; border:1px solid #b9bdb8; border-radius:3px; background:#fff; font:13px/1.42 Arial,sans-serif; font-weight:400; outline:none; white-space:pre-wrap; }
.rich-editor:focus { border-color:#334c3a; box-shadow:0 0 0 2px #334c3a1f; }
.tone-red { color:#d32f2f; }.tone-green { color:#2e7d32; }
.editor-actions { display:flex; gap:8px; justify-content:flex-end; }
.editor-actions button { border:1px solid #818881; background:#fff; padding:8px 10px; cursor:pointer; border-radius:3px; font-size:12px; }
.editor-actions .primary { background:var(--green); border-color:var(--green); color:#fff; }
.scrim { display:none; position:fixed; z-index:40; inset:0; background:#0004; }
.scrim.show { display:block; }

@media(max-width:720px) {
  .utility-bar { padding:0 12px; }.brand span { display:none; }
  .sheet { width:calc(100% - 20px); padding:0 12px 18px; margin:10px auto; }
  .sheet-head,.joins-head { grid-template-columns:1fr; gap:12px; padding:16px 0; }
  .sheet-head__copy h1 { font-size:22px; }.map img { max-height:170px; transform:none; }
  .joins-map { text-align:center; }.footer { grid-template-columns:1fr; gap:10px; }
  .word-table { min-width:920px; }.media-slot img { width:96px; height:96px; }
}