:root {
  font-family: Arial, "DM Sans", sans-serif;
  color: var(--text, #f2f5f7);
  background: var(--theme-page-bg, #010304);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  --deep: var(--text, #f2f5f7);
  --green: var(--accent, #f2f5f7);
  --leaf: var(--muted, #aab2ba);
  --soft: var(--theme-surface-strong, #070a0c);
  --pale: var(--theme-surface, #030506);
  --line: var(--tronxvi-line, rgba(242, 245, 247, 0.16));
  --white: var(--theme-surface-strong, #ffffff);
  --excel-block-border: var(--line-strong, var(--line, rgba(242, 245, 247, 0.32)));
  --excel-grid-line: var(--theme-page-bg, var(--bg, #010304));
}
* { box-sizing: border-box; accent-color: var(--green); }
html, body { height: 100%; margin: 0; }
body { min-width: 760px; overflow: hidden; color: var(--deep); background: var(--white); }
.app-shell { height: 100vh; width: 100vw; display: grid; grid-template-columns: minmax(0, 1fr) 286px; background: var(--white); }
.sheet-workspace { height: 100vh; min-width: 0; display: flex; flex-direction: column; background: var(--white); }
.sheet-topline { height: 46px; flex: none; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid var(--leaf); background: var(--green); }
.workbook-title { min-width: 120px; width: 300px; border: 1px solid transparent; border-radius: 4px; background: transparent; padding: 6px 8px; font-size: 14px; font-weight: 600; color: var(--white); outline: none; }
.workbook-title:hover, .workbook-title:focus { border-color: #c5dfcd; background: var(--leaf); }
.save-indicator { display: flex; align-items: center; gap: 8px; color: var(--white); font-size: 11px; }
.save-dot { width: 7px; height: 7px; border-radius: 50%; background: #c5dfcd; box-shadow: 0 0 0 3px #c5dfcd35; }
.grid-viewport { flex: 1; min-height: 0; overflow: auto; position: relative; scrollbar-color: #a9cfb5 var(--pale); scrollbar-width: thin; overscroll-behavior: contain; }
.grid { display: grid; width: max-content; grid-template-columns: 48px repeat(26, 112px); grid-auto-rows: 29px; font-size: 12px; --col-size: 112px; }
.grid-cell { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; align-items: center; padding: 0 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--deep); outline: none; background: var(--white); position: relative; }
.grid-cell.col-head, .grid-cell.row-head, .grid-cell.corner { background: var(--pale); color: var(--green); justify-content: center; padding: 0; font-size: 11px; font-weight: 500; }
.grid-cell.col-head { position: sticky; top: 0; z-index: 3; border-bottom-color: var(--excel-block-border); }
.grid-cell.corner { position: sticky; top: 0; left: 0; z-index: 6; }
.grid-cell.row-head { position: sticky; left: 0; z-index: 3; }
.grid-cell.selected { box-shadow: inset 0 0 0 2px var(--excel-block-border); z-index: 1; }
.grid-cell.audit-reference { outline: 2px solid var(--leaf); outline-offset: -2px; }
.grid-cell.range-selected:not(.selected) { box-shadow: inset 0 0 0 1px var(--excel-block-border); cursor: move; }
.grid-cell.frozen-row { position: sticky; z-index: 1; background: var(--white); }
.grid-cell.row-head.frozen-row { z-index: 4; background: var(--pale); }
.grid-cell.frozen-col { position: sticky; z-index: 2; background: var(--white); }
.grid-cell.col-head.frozen-col { z-index: 5; background: var(--pale); }
.grid-cell.frozen-row.frozen-col { z-index: 3; }
.grid-spacer { border: 0; padding: 0; background: transparent; pointer-events: none; }
.fill-handle { position: absolute; width: 7px; height: 7px; right: -4px; bottom: -4px; z-index: 8; border: 1px solid var(--excel-block-border); background: var(--green); cursor: crosshair; }
.column-resize-handle { position: absolute; z-index: 6; width: 5px; height: 100%; right: 0; top: 0; cursor: col-resize; }
.column-resize-handle:hover { background: var(--green); }
.row-resize-handle { position: absolute; z-index: 6; height: 5px; width: 100%; bottom: 0; left: 0; cursor: row-resize; }
.row-resize-handle:hover { background: var(--green); }
.grid-cell.selected::after { content: ""; position: absolute; width: 5px; height: 5px; background: var(--green); right: -2px; bottom: -2px; }
.grid-cell.formula-cell { color: var(--leaf); }
.grid-cell.error-cell { color: var(--deep); }
.grid-cell.editing { padding: 0; overflow: visible; z-index: 4; }
.cell-editor { border: 2px solid var(--green); outline: none; width: 100%; height: 100%; padding: 0 7px; font: 12px Arial, sans-serif; color: var(--deep); background: var(--white); }
.sheet-tabs-row { height: 39px; flex: none; display: flex; align-items: center; border-top: 1px solid var(--line); background: var(--pale); padding: 0 12px; gap: 4px; }
.sheet-tabs { display: flex; gap: 4px; height: 100%; align-items: flex-end; max-width: 75%; overflow: auto; }
.sheet-tab { height: 31px; border: 0; background: transparent; padding: 0 14px; border-radius: 5px 5px 0 0; color: var(--green); font-size: 11px; font-weight: 600; position: relative; white-space: nowrap; }
.sheet-tab:hover { background: var(--soft); color: var(--deep); }
.sheet-tab.active { background: var(--white); color: var(--green); box-shadow: 0 -2px 0 var(--green) inset; }
.add-sheet { width: 27px; height: 27px; border: 0; border-radius: 5px; background: transparent; color: var(--green); font-size: 19px; line-height: 1; }
.add-sheet:hover { background: var(--soft); color: var(--deep); }
.sheet-tab-fill { flex: 1; }
.zoom-control { display: flex; align-items: center; gap: 8px; color: var(--green); font-size: 12px; }
.zoom-control button { width: 23px; height: 23px; border: 1px solid var(--line); background: var(--white); border-radius: 4px; color: var(--green); font-size: 15px; line-height: 15px; }
.zoom-control button:hover { border-color: #a9cfb5; background: var(--soft); }
.zoom-control span { font-size: 10px; color: var(--green); min-width: 34px; text-align: right; }
.statusbar { height: 24px; flex: none; padding: 0 16px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--line); color: var(--green); font-size: 10px; background: var(--white); }
.control-sidebar { height: 100vh; overflow-y: auto; border-left: 1px solid var(--leaf); background: var(--green); padding: 0 18px 18px; scrollbar-width: thin; scrollbar-color: #c5dfcd var(--green); }
.sidebar-heading { padding: 21px 1px 17px; border-bottom: 1px solid var(--leaf); }
.eyebrow { font-size: 9px; font-weight: 700; letter-spacing: 1.25px; color: #c5dfcd; }
.sidebar-heading h1 { font-size: 19px; line-height: 1.2; margin: 5px 0 0; font-weight: 650; letter-spacing: -.3px; color: var(--white); }
.control-section { padding: 17px 0 18px; border-bottom: 1px solid var(--leaf); }
.control-section h2 { margin: 0 0 13px; font-size: 12px; font-weight: 700; color: var(--white); }
.cell-address-row { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.cell-address-row label, .control-label { font-size: 10px; color: #e4f2e9; }
.name-box { height: 30px; width: 76px; border: 1px solid #c5dfcd; border-radius: 5px; background: var(--white); text-align: center; font: 600 12px Arial; color: var(--deep); outline: none; }
.name-box:focus, .formula-input:focus, select:focus { border-color: var(--green); box-shadow: 0 0 0 2px #176b4520; }
.control-label { display: flex; flex-direction: column; gap: 6px; }
.formula-field { margin-top: 6px; height: 34px; display: flex; align-items: center; gap: 8px; border: 1px solid #c5dfcd; border-radius: 5px; background: var(--white); padding: 0 8px; }
.fx-mark { font: italic 600 13px Georgia, serif; color: var(--green); }
.formula-input { min-width: 0; flex: 1; height: 29px; border: 0; outline: 0; font: 11px Arial; color: var(--deep); background: transparent; }
.formula-input:focus { box-shadow: none; }
.formula-tools { display: grid; gap: 7px; margin-top: 10px; }
.formula-tools select { width: 100%; color-scheme: light; }
.formula-audit-actions { gap: 6px; }
.formula-audit-actions .action-button { min-height: 30px; padding: 0 6px; justify-content: center; font-size: 10px; }
.formula-audit-output { display: block; min-height: 17px; color: #e4f2e9; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.two-controls { display: grid; grid-template-columns: 1fr 78px; gap: 10px; }
.control-section select { height: 31px; max-width: 100%; border: 1px solid #c5dfcd; border-radius: 5px; background: var(--white); padding: 0 7px; color: var(--deep); font: 11px Arial; outline: none; }
.format-row { display: flex; align-items: center; gap: 4px; margin-top: 12px; }
.format-button { height: 29px; min-width: 24px; border: 1px solid transparent; background: transparent; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; color: var(--white); font: 12px Arial; }
.format-button:hover { border-color: #c5dfcd; background: var(--white); color: var(--green); }
.format-button.active { background: var(--soft); color: var(--deep); border-color: #c5dfcd; }
.control-divider { height: 20px; width: 1px; background: #c5dfcd; margin: 0 4px; }
.color-select-wrap { height: 29px; width: 60px; border-bottom: 3px solid #c5dfcd; border-radius: 4px; display: flex; align-items: center; justify-content: center; gap: 2px; color: var(--white); font: bold 13px Georgia, serif; }
.color-select-wrap:hover { background: var(--soft); }
.color-select-wrap select { width: 45px; height: 25px; border: 1px solid #c5dfcd; border-radius: 4px; background: var(--white); padding: 0 2px; color: var(--green); font: 9px Arial; outline: none; }
.color-select-wrap select:focus { border: 0; box-shadow: none; }
.fill-select-wrap { width: 60px; border-bottom: 0; }
.fill-select-wrap select { width: 45px; }
.alignment-row { flex-wrap: wrap; }
.format-select-label { flex: 1; min-width: 108px; font-size: 9px; }
.format-select-label select { width: 100%; }
.two-controls select, .format-select-label select { color-scheme: light; }
.button-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.action-button { min-height: 33px; border: 1px solid #c5dfcd; border-radius: 5px; background: var(--white); color: var(--green); font: 12px Arial; display: flex; align-items: center; justify-content: flex-start; gap: 9px; padding: 0 10px; transition: background .12s, border-color .12s; }
.action-button:hover { background: var(--soft); border-color: #a9cfb5; }
.action-button > span { font-size: 11px; }
.full-button { width: 100%; margin-top: 8px; }
.export-button { background: var(--white); color: var(--green); border-color: var(--white); }
.export-button:hover { background: var(--soft); border-color: var(--soft); }
.sidebar-help { padding: 17px 2px 5px; color: #e4f2e9; font-size: 10px; line-height: 1.65; }
.sidebar-input { width: 100%; height: 31px; border: 1px solid #c5dfcd; border-radius: 5px; background: var(--white); padding: 0 8px; color: var(--deep); font: 11px Arial; outline: none; }
.sidebar-input:focus { border-color: var(--green); box-shadow: 0 0 0 2px #176b4520; }
.replace-input-label { margin-top: 10px; }
.search-actions { margin-top: 9px; }
.conditional-row { display: grid; gap: 8px; margin-top: 12px; }
.data-controls { margin-top: 10px; grid-template-columns: minmax(0, 1fr) 82px; }
.data-actions { margin-top: 8px; }
.sheet-actions { margin-top: 8px; }
.data-actions .action-button { font-size: 10px; padding: 0 7px; }
.data-label { margin-top: 10px; }
.data-input { margin-top: 7px; }
.note-input { min-height: 66px; height: 66px; padding: 8px; resize: vertical; }
.control-section [hidden] { display: none !important; }
.chart-dock { flex: none; height: 214px; overflow: auto; display: flex; align-items: stretch; gap: 10px; padding: 8px 12px; border-top: 1px solid var(--line); background: var(--pale); }
.chart-dock[hidden] { display: none; }
.chart-card { min-width: min(480px, 88%); max-width: 480px; border: 1px solid var(--line); border-radius: 6px; background: var(--white); padding: 7px 10px; }
.chart-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2px; color: var(--green); font-size: 11px; }
.chart-remove { border: 1px solid var(--line); border-radius: 4px; background: var(--white); color: var(--green); font-size: 9px; padding: 3px 7px; }
.chart-remove:hover { background: var(--soft); }
.chart-card svg { width: 100%; height: 166px; }
.grid-cell .sparkline { position: absolute; right: 2px; top: 4px; width: 38px; height: 20px; pointer-events: none; background: var(--white); }
.grid-cell.has-note::before { content: ""; position: absolute; top: 0; right: 0; border-top: 7px solid var(--green); border-left: 7px solid transparent; }
.grid-cell.has-note { cursor: help; }
.context-menu { position: fixed; z-index: 20; min-width: 190px; padding: 5px; border: 1px solid var(--green); border-radius: 6px; background: var(--white); box-shadow: 0 6px 20px #17453030; }
.context-menu[hidden] { display: none; }
.context-menu button { display: block; width: 100%; min-height: 31px; padding: 0 9px; border: 0; border-radius: 4px; background: var(--white); color: var(--deep); text-align: left; font: 11px Arial; }
.context-menu button:hover, .context-menu button:focus { outline: none; background: var(--soft); color: var(--green); }
kbd { font: 10px Arial; background: var(--white); border: 1px solid #c5dfcd; border-radius: 3px; padding: 2px 4px; color: var(--green); }
.grid-viewport:focus { outline: none; }
@media (max-width: 800px) {
  body { min-width: 640px; }
  .app-shell { grid-template-columns: minmax(0, 1fr) 245px; }
  .control-sidebar { padding-left: 14px; padding-right: 14px; }
  .grid { grid-template-columns: 42px repeat(26, 100px); }
}

/* A calmer, card-based sidebar keeps every workbook tool easy to scan. */
.app-shell { grid-template-columns: minmax(0, 1fr) 318px; }
.control-sidebar {
  padding: 0 13px 18px;
  border-left: 1px solid var(--green);
  background: var(--green);
  scrollbar-color: #c5dfcd var(--green);
}
.sidebar-heading {
  position: sticky;
  top: 0;
  z-index: 12;
  margin: 0 -13px;
  padding: 17px 18px 14px;
  border-bottom: 1px solid #ffffff30;
  background: var(--green);
}
.eyebrow { color: #e4f2e9; font-size: 9px; letter-spacing: 1.5px; }
.sidebar-heading h1 { margin-top: 5px; font-size: 20px; letter-spacing: -.35px; }
.sidebar-subtitle { margin: 5px 0 0; color: #e4f2e9; font-size: 11px; line-height: 1.4; }
.control-section {
  margin: 12px 0 0;
  padding: 14px;
  border: 1px solid #c5dfcd;
  border-radius: 10px;
  background: var(--white);
  box-shadow: 0 3px 12px #17453018;
}
.control-section h2 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 14px;
  padding: 0 0 10px;
  border-bottom: 1px solid var(--line);
  color: var(--deep);
  font-size: 13px;
  font-weight: 700;
}
.control-section h2::before {
  width: 4px;
  height: 15px;
  border-radius: 4px;
  background: var(--green);
  content: "";
}
.cell-address-row label, .control-label { color: var(--green); font-size: 10px; font-weight: 600; }
.name-box,
.sidebar-input,
.formula-field,
.control-section select:not(#text-color):not(#fill-color) {
  border: 1px solid #c5dfcd;
  border-radius: 7px;
  background-color: var(--white);
  color: var(--deep);
}
.name-box { height: 34px; font-size: 12px; }
.control-section select:not(#text-color):not(#fill-color) {
  width: 100%;
  min-width: 0;
  height: 35px;
  padding: 0 9px;
  font: 12px Arial, sans-serif;
  color-scheme: light;
}
.sidebar-input { height: 35px; padding: 0 10px; font: 12px Arial, sans-serif; }
.sidebar-input::placeholder { color: #258451; opacity: .72; }
.formula-field { height: 38px; padding: 0 10px; }
.formula-input { font-size: 12px; }
.name-box:focus,
.formula-field:focus-within,
.sidebar-input:focus,
.control-section select:focus {
  border-color: var(--green);
  box-shadow: 0 0 0 3px #176b4520;
}
.formula-input:focus { box-shadow: none; }
.control-section .control-label { gap: 7px; }
.formula-tools { gap: 8px; margin-top: 12px; }
.formula-tools .full-button { margin-top: 0; }
.formula-audit-actions { gap: 7px; }
.formula-audit-output { min-height: 0; color: var(--green); font-size: 10px; }
.two-controls { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.data-controls { grid-template-columns: minmax(0, 1fr) 82px; }
.format-row { gap: 5px; margin-top: 10px; }
.format-button {
  min-width: 30px;
  height: 32px;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--green);
}
.format-button:hover { border-color: var(--line); background: var(--pale); color: var(--deep); }
.format-button.active { border-color: #a9cfb5; background: var(--soft); color: var(--deep); }
.control-divider { background: var(--line); }
.color-select-wrap { color: var(--green); }
.color-select-wrap:hover { background: var(--pale); }
.color-select-wrap select {
  border-color: var(--line);
  border-radius: 5px;
  color: var(--deep);
}
.fill-select-wrap { border-bottom: 0; }
.format-select-label { min-width: 98px; color: var(--green); }
.format-select-label select { width: 100%; }
.button-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.action-button {
  min-width: 0;
  min-height: 36px;
  border: 1px solid #a9cfb5;
  border-radius: 7px;
  background: var(--white);
  color: var(--green);
  font: 11px Arial, sans-serif;
  line-height: 1.25;
  justify-content: center;
  gap: 7px;
  padding: 6px 8px;
  text-align: center;
  transition: background .15s, border-color .15s, transform .15s;
}
.action-button:hover { border-color: var(--green); background: var(--pale); }
.action-button:active { transform: translateY(1px); }
.action-button:focus-visible,
.format-button:focus-visible,
.chart-remove:focus-visible { outline: 2px solid var(--leaf); outline-offset: 2px; }
.action-button > span { font-size: 11px; }
.full-button { margin-top: 8px; }
.formula-tools .full-button, .formula-audit-actions .action-button { margin-top: 0; }
#create-table,
#apply-validation,
#create-chart,
#goal-seek,
#export-xlsx-button {
  border-color: var(--green);
  background: var(--green);
  color: var(--white);
  font-weight: 700;
}
#create-table:hover,
#apply-validation:hover,
#create-chart:hover,
#goal-seek:hover,
#export-xlsx-button:hover { border-color: var(--leaf); background: var(--leaf); }
.export-button { background: var(--green); color: var(--white); }
.sidebar-help {
  margin: 12px 0 0;
  padding: 12px 5px 3px;
  border-top: 1px solid #ffffff30;
  color: #e4f2e9;
  font-size: 10px;
  line-height: 1.6;
}
.sidebar-help kbd { border-color: #c5dfcd; background: var(--white); color: var(--green); }
.note-input { min-height: 78px; height: 78px; padding: 9px 10px; }
.conditional-row { gap: 8px; margin-top: 14px; }
.data-controls, .data-actions, .sheet-actions, .data-label { margin-top: 10px; }
.data-input { margin-top: 8px; }
.control-section [hidden] { display: none !important; }
@media (max-width: 800px) {
  .app-shell { grid-template-columns: minmax(0, 1fr) 245px; }
  .control-sidebar { padding-left: 10px; padding-right: 10px; }
  .sidebar-heading { margin-left: -10px; margin-right: -10px; padding-right: 14px; padding-left: 14px; }
  .control-section { padding: 12px; }
  .action-button { padding-right: 6px; padding-left: 6px; font-size: 10px; }
}

/* Keep compact controls inside their cards at every sidebar width. */
.control-sidebar { scrollbar-gutter: stable; }
.control-section { min-width: 0; }
.control-section > *,
.control-section label,
.control-section input,
.control-section select,
.control-section textarea,
.control-section button { min-width: 0; max-width: 100%; }
.format-row { min-width: 0; }
.format-row:not(.alignment-row) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) 2px minmax(0, 1fr) minmax(0, 1fr);
  gap: 4px;
  align-items: center;
}
.format-row:not(.alignment-row) .format-button { min-width: 0; width: 100%; }
.format-row:not(.alignment-row) .control-divider { width: 2px; margin: 0; }
.color-select-wrap {
  display: grid;
  grid-template-columns: 13px minmax(0, 1fr);
  width: auto;
  min-width: 0;
  height: 32px;
  gap: 2px;
  align-items: center;
  justify-content: stretch;
}
.color-select-wrap select,
.fill-select-wrap select { width: 100%; min-width: 0; }
.alignment-row { display: flex; flex-wrap: wrap; }
.alignment-row .format-button { flex: 0 1 30px; }
.alignment-row .control-divider { flex: 0 0 1px; }
.alignment-row .format-select-label { flex: 1 1 120px; min-width: 0; }
#wrap-text { width: 100%; margin-top: 10px; justify-content: flex-start; }
.action-button { overflow-wrap: anywhere; white-space: normal; }
.data-actions .action-button { min-height: 38px; }

/* The top bar exposes the everyday actions without taking space from the sheet. */
.sheet-topline {
  height: 80px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 0 14px;
}
.sheet-topline-main {
  height: 42px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}
.workbook-title { width: min(300px, 44%); }
.workbook-nav {
  height: 38px;
  flex: none;
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
}
.workbook-nav::-webkit-scrollbar { display: none; }
.nav-group { display: flex; align-items: center; gap: 4px; flex: none; }
.nav-divider { width: 1px; height: 21px; flex: none; margin: 0 4px; background: #ffffff55; }
.nav-button {
  width: 29px;
  height: 28px;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 7px;
  border: 1px solid #ffffff55;
  border-radius: 5px;
  background: #ffffff12;
  color: var(--white);
  font: 12px Arial, sans-serif;
  line-height: 1;
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.nav-button:hover,
.nav-button:focus-visible {
  border-color: var(--white);
  background: var(--white);
  color: var(--green);
  outline: none;
}
.nav-button:active { transform: translateY(1px); }
.nav-button.nav-labeled { width: auto; min-width: 59px; font-size: 11px; }
.nav-button.nav-format { font-size: 13px; }
.nav-file-actions .nav-labeled:last-child { min-width: 70px; }
@media (max-width: 800px) {
  .sheet-topline { height: 78px; padding: 0 10px; }
  .sheet-topline-main { height: 40px; }
  .workbook-nav { height: 38px; }
  .workbook-title { width: 44%; }
}

/* Keep the title and quick actions on one clean desktop line. */
.save-indicator { display: none; }
.sheet-topline {
  height: 46px;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  padding: 0 14px;
}
.sheet-topline-main {
  height: auto;
  flex: 0 0 auto;
  width: auto;
  justify-content: flex-start;
}
.workbook-title { width: 220px; }
.workbook-nav { height: 46px; flex: 1 1 auto; }
@media (max-width: 800px) {
  .sheet-topline { height: 46px; gap: 8px; padding: 0 10px; }
  .sheet-topline-main { height: auto; }
  .workbook-title { width: 180px; }
  .workbook-nav { height: 46px; }
}

/* Simplify the quick-action strip after removing the sidebar branding block. */
.sheet-topline { gap: 10px; }
.workbook-title { width: 205px; font-size: 13px; }
.workbook-nav { gap: 8px; }
.nav-group {
  gap: 2px;
  padding: 3px;
  border: 1px solid #ffffff2b;
  border-radius: 7px;
  background: #ffffff12;
}
.nav-divider { display: none; }
.nav-button { border-color: transparent; background: transparent; }
.nav-button.nav-labeled { min-width: 56px; }
.nav-file-actions .nav-labeled:last-child { min-width: 68px; }
@media (max-width: 800px) {
  .workbook-title { width: 180px; }
  .workbook-nav { gap: 6px; }
}

/* TronXVI neutral direction. Keep the spreadsheet surface white as document content while matching the application shell. */
:root {
  --tronxvi-black: var(--theme-page-bg, #010304);
  --tronxvi-black-soft: var(--theme-surface-strong, #070a0c);
  --tronxvi-rail: var(--theme-surface, #030506);
  --tronxvi-white: var(--text, #f2f5f7);
  --tronxvi-secondary: var(--muted, #aab2ba);
  --tronxvi-line: var(--line, rgba(242, 245, 247, 0.16));
}

body,
body .app-shell,
body .sheet-workspace {
  color: var(--tronxvi-white);
  background: var(--tronxvi-black);
}

body .sheet-topline {
  border-bottom-color: var(--tronxvi-line);
  background: var(--tronxvi-black-soft);
}

body .workbook-title,
body .save-indicator,
body .nav-button {
  color: var(--tronxvi-white);
}

body .workbook-title:hover,
body .workbook-title:focus,
body .nav-group {
  border-color: var(--tronxvi-line);
  background: var(--tronxvi-rail);
}

body .save-dot {
  background: var(--tronxvi-secondary);
  box-shadow: 0 0 0 3px rgba(170, 178, 186, 0.22);
}

body .nav-button {
  border-color: transparent;
  background: transparent;
}

body .nav-button:hover,
body .nav-button:focus-visible {
  border-color: var(--tronxvi-white);
  background: var(--tronxvi-white);
  color: var(--tronxvi-black);
}

body .grid-viewport {
  background: var(--tronxvi-black);
  scrollbar-color: var(--tronxvi-secondary) var(--tronxvi-black-soft);
}

/* Spreadsheet cells remain white document content. */
body .grid-cell:not(.col-head):not(.row-head):not(.corner),
body .grid-cell.frozen-row,
body .grid-cell.frozen-col,
body .cell-editor {
  color: #1f2933;
  background: #ffffff;
}

body .grid-cell.col-head,
body .grid-cell.row-head,
body .grid-cell.corner,
body .grid-cell.row-head.frozen-row,
body .grid-cell.col-head.frozen-col {
  color: var(--tronxvi-white);
  background: var(--tronxvi-rail);
}

body .grid-cell,
body .grid-cell.col-head,
body .grid-cell.row-head,
body .grid-cell.corner {
  border-color: var(--excel-grid-line);
}

body .grid-cell.selected {
  box-shadow: inset 0 0 0 2px var(--excel-block-border);
}

body .grid-cell.audit-reference {
  outline-color: var(--tronxvi-secondary);
}

body .grid-cell.range-selected:not(.selected),
body .fill-handle,
body .grid-cell.selected::after,
body .column-resize-handle:hover,
body .row-resize-handle:hover,
body .grid-cell.has-note::before {
  background-color: var(--tronxvi-secondary);
}

body .sheet-tabs-row,
body .chart-dock,
body .statusbar {
  border-color: var(--tronxvi-line);
  color: var(--tronxvi-secondary);
  background: var(--tronxvi-rail);
}

body .sheet-tab,
body .add-sheet,
body .zoom-control,
body .zoom-control span {
  color: var(--tronxvi-white);
}

body .sheet-tab:hover,
body .add-sheet:hover,
body .zoom-control button:hover {
  color: var(--tronxvi-white);
  background: var(--tronxvi-black-soft);
}

body .sheet-tab.active {
  color: var(--tronxvi-black);
  background: var(--tronxvi-white);
  box-shadow: 0 -2px 0 var(--tronxvi-white) inset;
}

body .zoom-control button {
  border-color: var(--tronxvi-line);
  color: var(--tronxvi-white);
  background: var(--tronxvi-black-soft);
}

body .control-sidebar {
  border-left-color: var(--tronxvi-line);
  background: var(--tronxvi-rail);
  scrollbar-color: var(--tronxvi-secondary) var(--tronxvi-rail);
}

body .sidebar-heading {
  border-bottom-color: var(--tronxvi-line);
  background: var(--tronxvi-rail);
}

body .eyebrow,
body .sidebar-subtitle,
body .sidebar-help,
body .control-label,
body .cell-address-row label,
body .formula-audit-output {
  color: var(--tronxvi-secondary);
}

body .sidebar-heading h1,
body .control-section h2,
body .format-button,
body .color-select-wrap,
body .format-select-label,
body .formula-field .fx-mark {
  color: var(--tronxvi-white);
}

body .control-section {
  border-color: var(--tronxvi-line);
  background: var(--tronxvi-black-soft);
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.28);
}

body .control-section h2 {
  border-bottom-color: var(--tronxvi-line);
}

body .control-section h2::before {
  background: var(--tronxvi-white);
}

body .name-box,
body .sidebar-input,
body .formula-field,
body .control-section select:not(#text-color):not(#fill-color),
body .color-select-wrap select,
body .formula-input {
  border-color: var(--tronxvi-line);
  color: var(--tronxvi-white);
  background-color: var(--tronxvi-rail);
}

body .sidebar-input::placeholder {
  color: var(--tronxvi-secondary);
}

body .name-box:focus,
body .formula-field:focus-within,
body .sidebar-input:focus,
body .control-section select:focus {
  border-color: var(--tronxvi-white);
  box-shadow: 0 0 0 3px rgba(242, 245, 247, 0.16);
}

body .format-button:hover,
body .format-button.active,
body .color-select-wrap:hover,
body .action-button:hover,
body .chart-remove:hover,
body .context-menu button:hover,
body .context-menu button:focus {
  border-color: var(--tronxvi-white);
  color: var(--tronxvi-white);
  background: var(--tronxvi-black);
}

body .control-divider,
body .sidebar-help {
  border-color: var(--tronxvi-line);
}

body .action-button,
body .chart-remove,
body .context-menu,
body .context-menu button,
body kbd {
  border-color: var(--tronxvi-line);
  color: var(--tronxvi-white);
  background: var(--tronxvi-rail);
}

body #create-table,
body #apply-validation,
body #create-chart,
body #goal-seek,
body #export-xlsx-button,
body .export-button {
  border-color: var(--tronxvi-white);
  color: var(--tronxvi-black);
  background: var(--tronxvi-white);
}

body #create-table:hover,
body #apply-validation:hover,
body #create-chart:hover,
body #goal-seek:hover,
body #export-xlsx-button:hover,
body .export-button:hover {
  border-color: #ffffff;
  color: var(--tronxvi-black);
  background: #ffffff;
}

body .chart-card {
  border-color: var(--tronxvi-line);
  background: #ffffff;
  color: #1f2933;
}

body .chart-heading {
  color: #1f2933;
}

body .chart-remove {
  color: #1f2933;
  background: #ffffff;
}

body .sidebar-help {
  border-top-color: var(--tronxvi-line);
}

/* Final accent contract: workbook chrome follows Customize > Accent. Cell
   values, fills, charts, and imported workbook content remain user data. */
html[data-appearance][data-theme] body {
  --excel-chrome-text: var(--theme-lock-text, var(--accent, var(--text)));
  --excel-chrome-border: var(--theme-lock-ui-border, var(--line));
  --excel-chrome-surface: var(--theme-surface, var(--panel));
  --excel-chrome-surface-strong: var(--theme-surface-strong, var(--panel-strong));
}

body :where(.sheet-topline, .workbook-nav, .nav-group, .grid-viewport,
  .sheet-tabs-row, .statusbar, .control-sidebar, .sidebar-heading,
  .control-section, .chart-dock, .context-menu, .zoom-control) {
  border-color: var(--excel-chrome-border) !important;
  color: var(--excel-chrome-text) !important;
}

body :where(.sheet-topline, .workbook-nav, .nav-group, .sheet-tabs-row,
  .statusbar, .control-sidebar, .sidebar-heading, .control-section,
  .chart-dock, .context-menu, .zoom-control) {
  background-color: var(--excel-chrome-surface) !important;
}

body :where(.sheet-topline, .workbook-nav, .sheet-tabs-row, .statusbar,
  .control-sidebar, .sidebar-heading, .control-section, .chart-dock,
  .context-menu, .zoom-control) :where(h1, h2, h3, h4, h5, h6, p, span,
  label, strong, small, output, button) {
  color: var(--excel-chrome-text) !important;
}

body :where(.workbook-title, .nav-button, .zoom-control button,
  .name-box, .sidebar-input, .formula-field, .formula-input,
  .control-section select, .color-select-wrap select, .format-button,
  .action-button, .chart-remove, .context-menu button, kbd) {
  border-color: var(--excel-chrome-border) !important;
  color: var(--excel-chrome-text) !important;
}

body :where(.workbook-title, .nav-button, .zoom-control button,
  .name-box, .sidebar-input, .formula-field, .formula-input,
  .control-section select, .color-select-wrap select, .format-button,
  .action-button, .chart-remove, .context-menu button, kbd) {
  background-color: var(--excel-chrome-surface) !important;
}

body :where(.nav-button:hover, .nav-button:focus-visible,
  .zoom-control button:hover, .format-button:hover, .format-button.active,
  .action-button:hover, .chart-remove:hover, .context-menu button:hover,
  .context-menu button:focus, .name-box:focus, .formula-field:focus-within,
  .sidebar-input:focus, .control-section select:focus) {
  border-color: var(--accent) !important;
  color: var(--accent) !important;
  outline-color: var(--accent) !important;
}

body :where(.eyebrow, .sidebar-subtitle, .sidebar-help, .control-label,
  .cell-address-row label, .formula-audit-output, .save-indicator) {
  color: var(--excel-chrome-text) !important;
}

body .save-dot,
body .control-divider,
body .nav-divider {
  background-color: var(--accent) !important;
}

body :where(#create-table, #apply-validation, #create-chart, #goal-seek,
  #export-xlsx-button, .export-button) {
  border-color: var(--accent) !important;
  background-color: var(--accent) !important;
  color: var(--theme-button-text, var(--appearance-text, var(--accent-contrast))) !important;
}

body :where(#create-table:hover, #apply-validation:hover, #create-chart:hover,
  #goal-seek:hover, #export-xlsx-button:hover, .export-button:hover) {
  border-color: var(--accent-strong) !important;
  background-color: var(--accent-strong) !important;
  color: var(--theme-button-text, var(--appearance-text, var(--accent-contrast))) !important;
}

/* Pointer-focus contract for tabs and select controls. */
:where([role="tab"], [role="option"], select, [aria-selected="true"], [data-state="active"], .active, .selected):focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}