*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:#222;background:#fff}#toolbar{height:50px;padding:9px 12px;background:#f2f2f2;border-bottom:1px solid #ccc;display:flex;align-items:center;gap:8px}button{padding:6px 10px}button:disabled{cursor:not-allowed;opacity:.45}#saveStatus{margin-left:auto;font-size:13px;color:#666}#container{display:flex;height:calc(100vh - 50px);min-height:650px}#editor{width:30%;padding:15px;border-right:1px solid #ccc;overflow-y:auto}#preview{width:70%;padding:15px;min-width:0}h2{margin-top:0}.table-actions{display:flex;gap:8px;margin-bottom:8px}.table-help{margin:0 0 12px;color:#666;font-size:12px;line-height:1.35}.example-controls{display:grid;grid-template-columns:1fr auto;gap:6px;margin-bottom:12px}.example-controls label{grid-column:1/-1;font-size:12px;color:#555}.example-controls select{min-width:0;padding:6px}.table-wrap{width:100%;overflow-x:hidden}table{width:100%;border-collapse:collapse;table-layout:fixed}th,td{padding:8px;border:1px solid #ccc;text-align:left;overflow-wrap:anywhere}th:nth-child(1),td:nth-child(1),th:nth-child(2),td:nth-child(2){width:36%}th:nth-child(3),td:nth-child(3){width:18%}th:nth-child(4),td:nth-child(4){width:10%;text-align:center}td[contenteditable=true]:focus,#diagramTitle:focus,#nodeHexInput:focus,select:focus,input[type=range]:focus{outline:2px solid #4f8cff}.deleteRowBtn{cursor:pointer;color:#b42318;padding:3px 7px}.panel{margin-top:18px;padding:12px;background:#f7f7f7;border:1px solid #ccc;border-radius:4px}.panel h3{margin:0 0 10px}.panel label{display:block;margin-top:10px;font-size:13px}.panel select,.panel input[type=range]{width:100%;margin-top:5px}.check-label{display:flex!important;align-items:center;gap:7px}.check-label input{margin:0}.check-label.is-disabled{color:#9aa3ad}.colour-controls{display:flex;align-items:center;gap:10px}#nodeColourPicker{width:50px;height:34px}#nodeHexInput{width:110px;padding:7px;font-family:Consolas,monospace;text-transform:uppercase}#colourError{min-height:18px;margin:8px 0 0;color:#c62828;font-size:13px}#output{white-space:pre-wrap;font-size:12px}details{margin-top:16px}summary{cursor:pointer;font-weight:600}#diagramTitle{width:100%;font-size:28px;font-weight:700;border:0;background:transparent;margin-bottom:12px;padding:4px;text-align:center}#diagram-area{height:calc(100vh - 105px);min-height:560px;border:2px dashed #999;overflow:hidden;background:#fff;position:relative}#sankeySvg{display:block;width:100%;height:100%}#sankeySvg text{paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}td.autocomplete-match{background:#eef6ff;box-shadow:inset 0 -2px 0 #4f8cff;position:relative}td.autocomplete-match::after{content:attr(data-ghost);color:#9aa3ad;pointer-events:none;white-space:pre}td.invalid-cell{background:#fff0f0}.stage-guide{stroke:#a9b4c0;stroke-width:1;stroke-dasharray:5 5}.stage-guide-label{fill:#687583;font-size:11px;stroke:none!important}
#fitViewBtn{width:100%;margin-top:12px}#viewInfo{margin-top:7px;color:#687583;font-size:12px;text-align:center}

#labelBehaviour{width:100%;margin-top:5px}

.validation-panel.ok{background:#f2fbf4;border-color:#79ad84}
.validation-panel.warning{background:#fff9ec;border-color:#d5a43c}
.validation-panel.error{background:#fff2f2;border-color:#cf6666}
#validationSummary{font-size:13px;line-height:1.45}
#validationSummary ul{margin:6px 0 0;padding-left:18px}
tr.row-warning td{background:#fff9e8}
tr.row-error td{background:#fff0f0}
#sankeySvg path{transition:fill-opacity .12s ease}

.position-controls{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:12px}
.position-controls .wide{grid-column:1/-1}
#positionReadout{grid-column:1/-1;text-align:center;color:#687583;font-size:12px;padding-top:3px}
#resetAllPositionsBtn{width:100%;margin-top:7px}

#exportBackground{width:100%;margin-top:5px}

.theme-colours{margin-top:12px}.theme-colours-title{font-size:12px;color:#555;margin-bottom:7px}.theme-swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}.theme-swatch{width:100%;aspect-ratio:1;border:2px solid #fff;border-radius:4px;box-shadow:0 0 0 1px #aab2ba;cursor:pointer;padding:0}.theme-swatch:hover,.theme-swatch:focus{box-shadow:0 0 0 3px #4f8cff}.theme-swatch.selected{box-shadow:0 0 0 3px #222}.theme-swatch:disabled{cursor:not-allowed;opacity:.45}

/* Table and Diagram Polish */
.table-wrap{position:relative;border:1px solid #d9dee3;border-radius:8px;overflow:auto;background:#fff}
#dataTable{border-collapse:separate;border-spacing:0;background:#fff}
#dataTable thead th{position:sticky;top:0;z-index:3;background:#1E293B;color:#fff;font-weight:700;border-color:#0F172A;white-space:nowrap}
#dataTable thead th:first-child{border-top-left-radius:7px}
#dataTable thead th:last-child{border-top-right-radius:7px}
#dataTable tbody td{background:#fff;border-color:#e1e5e9;transition:background-color .12s ease}
#dataTable tbody tr:hover td{background:#f8fafc}
#dataTable tbody tr.row-warning td{background:#fff9e8}
#dataTable tbody tr.row-error td{background:#fff0f0}
#dataTable tbody tr.row-warning:hover td{background:#fff4d6}
#dataTable tbody tr.row-error:hover td{background:#ffe4e4}
#dataTable td[contenteditable=true]:focus{background:#fff!important;outline:2px solid #2563EB;outline-offset:-2px}
.deleteHeader{width:46px!important;min-width:46px;text-align:center!important;font-size:19px;line-height:1;overflow-wrap:normal!important}
.deleteRowBtn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid #d7dce1;border-radius:7px;background:#fff;color:#B42318;font-size:15px;font-weight:700;line-height:1;cursor:pointer;transition:background-color .12s ease,border-color .12s ease,color .12s ease,transform .08s ease,box-shadow .12s ease}
.deleteRowBtn:hover{background:#fff0f0;border-color:#DC2626;color:#DC2626;box-shadow:0 2px 6px rgba(180,35,24,.14)}
.deleteRowBtn:active{transform:translateY(1px)}
.deleteRowBtn:focus-visible{outline:3px solid rgba(37,99,235,.28);outline-offset:1px}
#diagram-area.show-grid{background-color:#fff;background-image:linear-gradient(to right,rgba(100,116,139,.14) 1px,transparent 1px),linear-gradient(to bottom,rgba(100,116,139,.14) 1px,transparent 1px);background-size:25px 25px;background-position:0 0}

/* Label Box Styles & Layout Readouts */
.label-box{fill:#fff;fill-opacity:.94;stroke:#d9dee3;stroke-width:1;pointer-events:none}
.label-box.rounded{rx:7;ry:7}
#sankeySvg .sankey-label{paint-order:stroke;stroke:#fff;stroke-width:1.25px;stroke-linejoin:round}
.slider-control{margin-top:12px}
.slider-head{display:flex;justify-content:space-between;align-items:center}
.panel .slider-head label{margin:0;font-size:13px}
.slider-readout{display:flex;align-items:center;gap:8px;font-size:13px;color:#222;font-variant-numeric:tabular-nums}
.slider-reset{padding:1px 7px;font-size:11px;color:#555;background:#fff;border:1px solid #c5ccd3;border-radius:4px;cursor:pointer}
.slider-reset:hover:not(:disabled){border-color:#2563EB;color:#2563EB}
.slider-ends{display:flex;justify-content:space-between;margin-top:2px;color:#687583;font-size:11px}

/* Number format panel */
.affix-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.panel .affix-row input[type=text]{width:100%;margin-top:5px;padding:6px;font-size:13px}
.panel .affix-row input[type=text]:focus{outline:2px solid #4f8cff}
.number-preview{margin-top:10px;font-size:12px;color:#687583}

/* Data formatting help (link, expanding section, AI prompt) and the wrong-paste message */
.table-help{margin-bottom:4px}
.help-toggle,.link-button{padding:0;border:0;background:none;color:#2563EB;font:inherit;cursor:pointer;text-align:left}
.help-toggle{display:block;margin:0 0 12px;font-size:12px;line-height:1.35}
.help-toggle:hover,.link-button:hover{text-decoration:underline}
.help-toggle:focus-visible,.link-button:focus-visible,.paste-offer-dismiss:focus-visible,#copyPromptBtn:focus-visible{outline:2px solid #2563EB;outline-offset:2px}
.help-arrow{font-size:11px}
.help-panel{margin:0 0 12px;padding:12px;background:#f7f7f7;border:1px solid #ccc;border-radius:4px;font-size:12px;line-height:1.45;color:#334155}
.help-panel h3{margin:12px 0 4px;font-size:13px;color:#1E293B}
.help-panel h3:first-child{margin-top:0}
.help-panel p{margin:0 0 8px}
.help-panel p:last-child{margin-bottom:0}
.ai-prompt{display:block;width:100%;height:170px;padding:8px;border:1px solid #c5ccd3;border-radius:4px;background:#fff;color:#1E293B;font-family:Consolas,monospace;font-size:11px;line-height:1.4;resize:none;overflow-y:auto}
.ai-prompt:focus{outline:2px solid #2563EB}
.copy-row{display:flex;align-items:center;gap:10px;margin:8px 0}
.copy-status{font-size:12px;color:#687583}
.paste-offer{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px;padding:8px 10px;background:#fff9ec;border:1px solid #d5a43c;border-radius:4px;font-size:12px;line-height:1.4}
.paste-offer[hidden]{display:none}
.paste-offer-dismiss{padding:0 6px;border:0;background:none;color:#555;font-size:16px;line-height:1.2;cursor:pointer}
.paste-offer-dismiss:hover{color:#1E293B}

/* ===== v1.1.3: Ocean theme, compact table, collapsible panels, Data Check pill ===== */
:root{--ocean-deep:#0b4f6c;--ocean-teal:#0fa3b1;--ocean-orange:#ff8a1f;--ocean-side:#dcedf3;--ocean-panel:#f3fafc;--ocean-border:#a9d3e0;--ocean-text:#143642;--ocean-muted:#4d7381}
#editor{background:var(--ocean-side);border-right:1px solid var(--ocean-border);padding-top:0;color:var(--ocean-text)}
#editor::before{content:"";display:block;height:5px;margin:0 -15px 12px;background:linear-gradient(90deg,#0b4f6c,#0fa3b1,#ff8a1f)}
#editor h2{margin:0;font-size:20px;color:var(--ocean-deep)}
.ed-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.pill{padding:4px 10px;border:0;border-radius:999px;font-size:12px;font-weight:700;cursor:pointer;background:#d9f5e0;color:#17652b}
.pill.ok{cursor:default}
.pill.warn{background:#ffe9b8;color:#8a5a00}
.pill.err{background:#ffd6d6;color:#9b1c1c}
.validation-drop{margin:0 0 10px;padding:8px 10px;border-radius:8px;border:1px solid var(--ocean-border);background:var(--ocean-panel)}
.validation-drop[hidden]{display:none}
.validation-drop h3{margin:0 0 4px;font-size:13px}
.validation-drop.warning{background:#fff9ec;border-color:#d5a43c}
.validation-drop.error{background:#fff2f2;border-color:#cf6666}
.table-actions .grow{margin-left:auto}
.table-help,.example-controls label{color:var(--ocean-muted)}
.help-panel{background:var(--ocean-panel);border-color:var(--ocean-border)}
.table-wrap{max-height:260px;border-color:var(--ocean-border)}
#dataTable{font-size:12px}
#dataTable th,#dataTable td{padding:3px 7px}
#dataTable thead th{background:#0b4f6c;color:#fff;border-color:#0b4f6c}
#dataTable tbody tr:nth-child(even) td{background:#f4f8fa}
.deleteHeader{width:34px!important;min-width:34px;font-size:15px}
.deleteRowBtn{width:20px;height:20px;font-size:12px;border-radius:5px}
.table-summary{padding:9px 11px;border-radius:8px;background:var(--ocean-panel);border:1px solid var(--ocean-border);font-size:12px;cursor:pointer}
.table-summary[hidden],#tableBox[hidden]{display:none}
.collapse-all{display:flex;justify-content:flex-end;margin-top:10px}
.collapse-all button{padding:0;border:0;background:none;color:var(--ocean-deep);font-size:12px;font-weight:700;cursor:pointer}
.collapse-all button:hover{text-decoration:underline}
.panel{margin-top:12px;padding:0;overflow:hidden;background:var(--ocean-panel);border:1px solid var(--ocean-border);border-left:4px solid var(--ocean-teal);border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.08)}
.panel-head{width:100%;display:flex;align-items:center;gap:8px;padding:8px 10px;border:0;border-radius:0;background:var(--ocean-deep);color:#fff;font-size:13px;font-weight:700;text-align:left;cursor:pointer}
.panel-head:focus-visible{outline:2px solid #ff8a1f;outline-offset:-2px}
.panel-head .dot{width:9px;height:9px;border-radius:50%;background:var(--ocean-orange)}
.panel-head .chev{margin-left:auto;font-size:11px;transition:transform .15s}
.panel.closed .chev{transform:rotate(-90deg)}
.panel-body{padding:4px 12px 12px}
.panel.closed .panel-body{display:none}
.panel label,.number-preview,.slider-ends,#viewInfo,#positionReadout{color:var(--ocean-muted)}
.panel select,.panel input[type=text]{border:1px solid var(--ocean-border);border-radius:5px}
#editor{min-width:300px}
.ed-head h2{white-space:nowrap}
.pill{white-space:nowrap}
.table-actions button{padding:4px 9px;font-size:12px;white-space:nowrap}
#dataTable th:nth-child(1),#dataTable td:nth-child(1),#dataTable th:nth-child(2),#dataTable td:nth-child(2){width:33%}
#dataTable th:nth-child(3),#dataTable td:nth-child(3){width:24%}
#dataTable th:nth-child(4),#dataTable td:nth-child(4){width:34px;padding:3px 2px}
.table-actions{flex-wrap:wrap}

/* ===== v1.1.3 round 2: table chevron, help bar, compact swatches and move pad ===== */
.deleteHeader{padding:0!important}
.table-chevron{display:block;width:100%;padding:0;border:0;background:none;color:#fff;font-size:14px;line-height:1;cursor:pointer}
.table-chevron:hover{color:#ff8a1f}
.table-chevron:focus-visible{outline:2px solid #ff8a1f;outline-offset:-2px}
.table-summary{display:flex;align-items:center;gap:8px}
.table-summary[hidden]{display:none}
.sum-chev{display:inline-block;width:7px;height:7px;border-right:2px solid var(--ocean-deep);border-bottom:2px solid var(--ocean-deep);transform:rotate(-45deg);flex:none}
.table-summary:hover{border-color:var(--ocean-deep)}
.table-summary:focus-visible{outline:2px solid #ff8a1f;outline-offset:1px}
.help-toggle{display:flex;align-items:center;justify-content:space-between;width:100%;margin:0 0 12px;padding:7px 10px;border:1px solid var(--ocean-border);border-radius:8px;background:var(--ocean-panel);color:var(--ocean-deep);font-size:12px;font-weight:700;text-align:left}
.help-toggle:hover{text-decoration:none;border-color:var(--ocean-deep)}
.help-arrow{display:inline-block;width:8px;height:8px;margin-right:3px;border-right:2px solid var(--ocean-deep);border-bottom:2px solid var(--ocean-deep);transform:rotate(45deg);transition:transform .15s;flex:none}
.help-toggle[aria-expanded=true] .help-arrow{transform:rotate(-135deg)}
.theme-swatches{display:flex;flex-wrap:wrap;gap:6px}
.theme-swatch{width:22px;height:22px;aspect-ratio:auto;border-width:1px;border-radius:4px}
.position-controls{display:flex;align-items:center;gap:14px;margin-top:10px}
.dpad{display:grid;grid-template-columns:repeat(3,28px);grid-template-rows:repeat(2,28px);gap:3px}
.dpad button{padding:0;font-size:11px;line-height:1;border:1px solid var(--ocean-border);border-radius:5px;background:#fff;color:var(--ocean-deep);cursor:pointer}
.dpad button:hover:not(:disabled){background:var(--ocean-deep);color:#fff}
.dp-up{grid-column:2;grid-row:1}.dp-left{grid-column:1;grid-row:2}.dp-down{grid-column:2;grid-row:2}.dp-right{grid-column:3;grid-row:2}
.pos-side{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
#positionReadout{grid-column:auto;text-align:left;padding-top:0}
.pos-side .link-button{font-size:12px;color:var(--ocean-deep);font-weight:700}
.pos-side .link-button:disabled{color:#9aa3ad;cursor:not-allowed;text-decoration:none}
.table-chevron{font-size:18px}

/* ===== v1.1.3 round 3 ===== */
.ed-head{align-items:baseline}
#dataTable thead{cursor:pointer}
#dataTable thead:hover th{background:#0d6285}
.help-toggle{background:var(--ocean-deep);color:#fff;border-color:var(--ocean-deep)}
.help-toggle:hover{background:#0d6285;border-color:#0d6285}
.help-arrow{border-color:#fff}
.help-toggle:focus-visible{outline:2px solid #ff8a1f;outline-offset:2px}

/* ===== v1.1.3 round 4: collapsed table looks like the other section headers; distribute control ===== */
.table-summary{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--ocean-deep);border-radius:10px;background:var(--ocean-deep);color:#fff;font-size:13px;font-weight:700;cursor:pointer}
.table-summary:hover{background:#0d6285;border-color:#0d6285}
.table-summary .dot{width:9px;height:9px;border-radius:50%;background:var(--ocean-orange);flex:none}
.table-summary .sum-detail{margin-left:4px;font-size:11px;font-weight:400;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.table-summary .chev{margin-left:auto;font-size:11px;transform:rotate(-90deg)}
.table-summary[hidden]{display:none}
.distribute-box{margin-top:12px}
.distribute-row{display:flex;gap:6px;margin-top:4px}
.panel .distribute-row select{margin-top:0;flex:1;min-width:0}
.distribute-row button{padding:4px 10px;font-size:12px}
.distribute-note{min-height:16px;margin-top:4px;font-size:12px;color:var(--ocean-muted)}
.table-summary{white-space:nowrap}.table-summary .sum-detail{flex:1;min-width:0}

/* ===== Odd jobs (still v1.1.3): centred toolbar, orange exports, Load button, no panel dots ===== */
#toolbar{height:50px;padding:0 12px;background:var(--ocean-deep);border-bottom:4px solid var(--ocean-teal);justify-content:center;position:relative}
#toolbar button{background:#fff;color:var(--ocean-deep);border:2px solid var(--ocean-deep);border-radius:6px;padding:6px 14px;font-size:14px;font-weight:700;cursor:pointer}
#toolbar button:hover:not(:disabled){background:var(--ocean-side)}
#toolbar button:disabled{opacity:.45;cursor:not-allowed}
#toolbar #exportBtn,#toolbar #exportSvgBtn{background:var(--ocean-orange);border-color:var(--ocean-orange);color:#fff}
#toolbar #exportBtn:hover:not(:disabled),#toolbar #exportSvgBtn:hover:not(:disabled){background:#e87a10;border-color:#e87a10}
#saveStatus{position:absolute;right:14px;top:50%;transform:translateY(-50%);margin:0;color:#fff;font-size:13px;opacity:.9}
#loadExampleBtn{background:#fff;color:var(--ocean-deep);border:2px solid var(--ocean-deep);border-radius:6px;padding:5px 14px;font-size:13px;font-weight:700;cursor:pointer}
#loadExampleBtn:hover:not(:disabled){background:var(--ocean-side)}
.panel-head .dot,.table-summary .dot{display:none}

/* v1.1.3: even spacing above and below the data table */
.table-actions-top{margin-bottom:10px}
.table-actions-bottom{margin-top:10px;margin-bottom:0}
.recent-title{margin-top:10px}
.theme-swatch.empty{background:#fff;border:1px dashed #aab2ba;box-shadow:none;opacity:.7;cursor:default}

/* Launch additions: notices and footer */
.notice-bar{margin:0;padding:8px 14px;background:#fff4e5;color:#7a4300;border-bottom:1px solid #ffd9a8;font-size:13px;text-align:center}
.narrow-notice{display:none}
@media (max-width:900px){.narrow-notice{display:block}}
.app-footer{margin-top:18px;padding:10px 2px 4px;border-top:1px solid var(--ocean-border);color:#4d7381;font-size:12px;line-height:1.6}
.app-footer a{color:var(--ocean-deep)}.row-limit-note{margin:0 0 8px;padding:6px 10px;background:#fff4e5;color:#7a4300;border:1px solid #ffd9a8;border-radius:6px;font-size:12px;line-height:1.35}