.excel-grid {
  display: grid; gap: 1rem;
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 960px) {
  .excel-grid { grid-template-columns: 1fr; }
}
.excel-grid > .excel-panel:nth-child(1) { grid-column: 1; }
.excel-grid > .excel-panel:nth-child(2) { grid-column: 2; }
.excel-grid > .excel-panel:nth-child(3) { grid-column: 1 / -1; }
@media (max-width: 960px) {
  .excel-grid > .excel-panel:nth-child(1),
  .excel-grid > .excel-panel:nth-child(2),
  .excel-grid > .excel-panel:nth-child(3) { grid-column: 1; }
}

.excel-panel {
  background: var(--bg-3, var(--bg-3));
  border: 1px solid var(--rule);
  border-radius: var(--radius);
  padding: 1.1rem 1.25rem;
  display: flex; flex-direction: column; gap: .75rem;
}
.excel-panel h2 {
  font-size: 0.7rem; text-transform: uppercase; letter-spacing: .08em;
  color: var(--fg-3, var(--fg-2)); margin: 0; font-weight: 600;
}

.excel-tabs { display: flex; gap: .25rem; border-bottom: 1px solid var(--rule); padding-bottom: .5rem; }
.excel-tabs button {
  padding: .35rem .7rem;
  background: transparent; color: var(--fg-2);
  border: 1px solid transparent; border-radius: var(--radius-sm, 6px);
  font: inherit; font-size: 0.875rem; font-weight: 500; cursor: pointer;
}
.excel-tabs button:hover { color: var(--fg); background: var(--bg-2); }
.excel-tabs button[aria-selected="true"] { background: var(--bg-2); color: var(--fg); }

.excel-hint { color: var(--fg-2); font-size: var(--fs-small); margin: 0; }
.excel-hint code {
  background: var(--bg-2); padding: .05em .35em;
  border-radius: 4px; border: 1px solid var(--rule); font-size: 0.85em;
}

.excel-panel textarea {
  width: 100%; padding: .55rem .7rem;
  background: var(--bg-3, var(--bg-3)); color: var(--fg);
  border: 1px solid var(--rule);
  border-radius: var(--radius-sm, 6px);
  font: inherit; font-family: var(--font-mono); font-size: 0.875rem;
  resize: vertical;
}
[data-paste]   { min-height: 180px; }
[data-output]  { min-height: 220px; }

.excel-drop {
  display: flex; align-items: center; justify-content: center;
  padding: 2rem 1rem; border: 1.5px dashed var(--rule-strong, var(--rule));
  border-radius: var(--radius); color: var(--fg-2);
  cursor: pointer; transition: border-color var(--dur-quick, 120ms) ease;
}
.excel-drop:hover, .excel-drop[data-active="true"] {
  border-color: var(--accent); color: var(--fg);
}

.excel-options {
  display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;
  font-size: var(--fs-small); color: var(--fg-2);
}
.excel-options__sep select {
  margin-left: .5rem;
  padding: .25rem .4rem;
  border: 1px solid var(--rule); border-radius: var(--radius-sm, 6px);
  background: var(--bg-3, var(--bg-3)); color: var(--fg);
  font: inherit;
}

.excel-preview {
  max-height: 320px; overflow: auto;
  border: 1px solid var(--rule); border-radius: var(--radius-sm, 6px);
  background: var(--bg-3, var(--bg-3));
}
.excel-preview:empty { display: none; }
.excel-preview table {
  width: 100%; border-collapse: collapse;
  font-size: 0.8125rem; font-family: var(--font-mono);
}
.excel-preview th, .excel-preview td {
  padding: .35rem .55rem; border-bottom: 1px solid var(--rule);
  text-align: left; white-space: nowrap;
  max-width: 240px; overflow: hidden; text-overflow: ellipsis;
}
.excel-preview th {
  background: var(--bg-2);
  position: sticky; top: 0;
  font-weight: 600; color: var(--fg);
  border-bottom: 1px solid var(--rule-strong, var(--rule));
}

.excel-export-actions { display: flex; gap: .5rem; justify-content: flex-end; flex-wrap: wrap; }