:root {
  --sheet-width: 1492px;
  --sheet-height: 886px;
  --sheet-gutter: 36px;
  --sheet-head: 22px;
  --sheet-cell-w: 28px;
  --sheet-cell-h: 18px;
  --sheet-paper: #f1f0ec;
  --sheet-paper-2: #e7e6e2;
  --sheet-grid: rgba(27, 27, 27, 0.19);
  --sheet-grid-strong: rgba(27, 27, 27, 0.34);
  --sheet-ink: #11110f;
  --sheet-ui: #252525;
  --sheet-select: #2b61ca;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.arkusz-entry-page {
  background:
    radial-gradient(circle at 50% 18%, rgba(179, 107, 255, 0.055), transparent 30%),
    var(--bg);
}

.arkusz-entry-main {
  width: min(1540px, 96vw);
  padding-top: 62px;
}

.arkusz-heading {
  width: min(760px, 92vw);
  margin: 0 auto 44px;
}

.workbook {
  width: 100%;
  overflow: hidden;
  border: 2px solid #090909;
  background: #d9d9d7;
  color: var(--sheet-ui);
  box-shadow: 8px 8px 0 var(--accent);
  font-family: var(--mono);
  font-size-adjust: var(--mono-cap);
}

.workbook-titlebar,
.workbook-menu,
.workbook-toolbar,
.workbook-formula,
.workbook-tabs {
  display: flex;
  align-items: center;
  min-width: 0;
  border-bottom: 1px solid #8c8c8a;
  background: linear-gradient(#efefed, #d9d9d7);
}

.workbook-titlebar {
  min-height: 39px;
  gap: 10px;
  padding: 5px 13px;
  font-size: 12px;
  letter-spacing: 0.02em;
}

.workbook-titlebar strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workbook-state {
  margin-left: 0;
  color: #575755;
  font-size: 10px;
  letter-spacing: 0.14em;
}

.workbook-menu {
  min-height: 31px;
  gap: clamp(15px, 2vw, 28px);
  padding: 4px 14px;
  font-size: 11px;
}

.workbook-toolbar {
  min-height: 38px;
  gap: 14px;
  padding: 5px 14px;
  font-size: 13px;
}

.workbook-toolbar i {
  align-self: stretch;
  width: 1px;
  background: #aaa;
}

.workbook-toolbar strong:first-of-type {
  min-width: 132px;
  padding: 5px 9px;
  border: 1px solid #aaa;
  background: #f3f3f1;
  font-weight: normal;
  font-size: 10px;
}

.workbook-toolbar strong:nth-of-type(2) {
  min-width: 38px;
  padding: 5px 7px;
  border: 1px solid #aaa;
  background: #f3f3f1;
  font-weight: normal;
  font-size: 10px;
}

.workbook-formula {
  min-height: 34px;
  padding: 0;
  font-size: 11px;
}

.formula-address {
  align-self: stretch;
  display: flex;
  align-items: center;
  width: 92px;
  padding: 0 12px;
  border-right: 1px solid #999;
  background: #efefed;
}

.formula-fx {
  align-self: stretch;
  display: grid;
  place-items: center;
  width: 39px;
  border-right: 1px solid #999;
  font-style: italic;
}

.formula-value {
  min-width: 0;
  overflow: hidden;
  padding: 0 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sheet-stage {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 220px;
  background: #bcbcb9;
  scrollbar-color: var(--sheet-select) #bcbcb9;
  scrollbar-width: thin;
}

.sheet-stage:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: -3px;
}

.sheet-stage[data-zoom='100'] {
  overflow: auto;
  overscroll-behavior: contain;
  touch-action: pan-x pan-y;
}

.sheet-scaler {
  position: relative;
  transform-origin: 0 0;
}

.sheet {
  position: absolute;
  inset: 0 auto auto 0;
  width: var(--sheet-width);
  height: var(--sheet-height);
  overflow: hidden;
  transform-origin: 0 0;
  background: var(--sheet-paper);
  color: var(--sheet-ink);
  font-family: 'IBM Plex Mono', monospace;
  font-size-adjust: var(--mono-cap);
}

.dust-layer,
.sheet-grid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}


.sheet-grid {
  z-index: 2;
  left: var(--sheet-gutter);
  top: var(--sheet-head);
  right: auto;
  bottom: auto;
  width: calc(52 * var(--sheet-cell-w));
  height: calc(48 * var(--sheet-cell-h));
  background-image:
    repeating-linear-gradient(to right, var(--sheet-grid) 0 1px, transparent 1px var(--sheet-cell-w)),
    repeating-linear-gradient(to bottom, var(--sheet-grid) 0 1px, transparent 1px var(--sheet-cell-h));
}

.sheet-copy {
  position: absolute;
  z-index: 5;
  inset: 0;
}

.cell-copy,
.cell-redacted {
  position: absolute;
  left: calc(var(--sheet-gutter) + (var(--col) - 1) * var(--sheet-cell-w));
  top: calc(var(--sheet-head) + (var(--row) - 1) * var(--sheet-cell-h));
  width: calc(var(--span) * var(--sheet-cell-w));
  height: var(--sheet-cell-h);
}

.cell-copy {
  margin: 0;
  padding: 1px 5px 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--sheet-ink);
  font: 12.5px/16px 'IBM Plex Mono', monospace;
  font-size-adjust: var(--mono-cap);
  text-align: left;
  white-space: nowrap;
  cursor: cell;
}

.cell-copy:hover,
.cell-copy:focus-visible {
  z-index: 8;
  background: rgba(255, 255, 255, 0.76);
  outline: 2px solid var(--sheet-select);
  outline-offset: -1px;
}

.cell-copy--system {
  color: rgba(17, 17, 15, 0.82);
  font-size: 10.5px;
  letter-spacing: -0.015em;
}

.cell-copy--strong {
  color: #090908;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.dust-layer { z-index: 3; }

.sheet-redacted {
  position: absolute;
  z-index: 4;
  inset: 0;
  filter: blur(0.6px);
  pointer-events: none;
}

.cell-redacted {
  display: flex;
  align-items: center;
  gap: 1ch;
  padding: 1px 5px 0;
  color: rgba(17, 17, 15, 0.34);
  font: 10.5px/16px 'IBM Plex Mono', monospace;
  font-size-adjust: var(--mono-cap);
}

.cell-redacted i {
  width: calc(var(--w, 1) * 1ch);
  height: 8px;
  margin-top: 1px;
  background: rgba(17, 17, 15, 0.26);
}

.sheet-light {
  position: absolute;
  z-index: 1;
  left: calc(var(--sheet-gutter) + 18 * var(--sheet-cell-w));
  top: calc(var(--sheet-head) + 1 * var(--sheet-cell-h));
  width: calc(13 * var(--sheet-cell-w));
  height: var(--sheet-cell-h);
  background-color: #f8f1da;
  box-shadow: 0 0 11px 3px rgba(216, 179, 0, 0.17);
  transition: background-color 240ms ease-out, box-shadow 240ms ease-out;
  pointer-events: none;
}

.sheet-light.is-struck {
  background-color: #fff7cd;
  box-shadow: 0 0 34px 12px rgba(216, 179, 0, 0.42);
  transition-duration: 60ms;
}

.sheet-selection {
  position: absolute;
  z-index: 6;
  transition: left 0.22s ease-out, top 0.22s ease-out, width 0.22s ease-out;
  left: calc(var(--sheet-gutter) + var(--selection-col, 1) * var(--sheet-cell-w));
  top: calc(var(--sheet-head) + var(--selection-row, 1) * var(--sheet-cell-h));
  width: calc(var(--selection-span, 1) * var(--sheet-cell-w));
  height: var(--sheet-cell-h);
  border: 2px solid var(--sheet-select);
  pointer-events: none;
}

.sheet-selection::after {
  content: '';
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 6px;
  height: 6px;
  background: var(--sheet-select);
}

.sheet-columns,
.sheet-rows,
.sheet-corner {
  position: absolute;
  z-index: 7;
  background: var(--sheet-paper-2);
  color: #282826;
  font: 9px/1 'IBM Plex Mono', monospace;
  font-size-adjust: var(--mono-cap);
}

.sheet-columns {
  left: var(--sheet-gutter);
  top: 0;
  display: grid;
  grid-template-columns: repeat(52, var(--sheet-cell-w));
  width: calc(52 * var(--sheet-cell-w));
  height: var(--sheet-head);
  border-bottom: 1px solid var(--sheet-grid-strong);
}

.sheet-columns span {
  display: grid;
  place-items: center;
  border-right: 1px solid var(--sheet-grid-strong);
}

.sheet-rows {
  left: 0;
  top: var(--sheet-head);
  display: grid;
  grid-template-rows: repeat(48, var(--sheet-cell-h));
  width: var(--sheet-gutter);
  height: calc(48 * var(--sheet-cell-h));
  border-right: 1px solid var(--sheet-grid-strong);
}

.sheet-rows span {
  display: grid;
  place-items: center;
  border-bottom: 1px solid var(--sheet-grid-strong);
}

.sheet-corner {
  left: 0;
  top: 0;
  width: var(--sheet-gutter);
  height: var(--sheet-head);
  border-right: 1px solid var(--sheet-grid-strong);
  border-bottom: 1px solid var(--sheet-grid-strong);
}

.workbook-tabs {
  min-height: 39px;
  border-top: 1px solid #888;
  border-bottom: 0;
}

.sheet-tab {
  align-self: stretch;
  display: flex;
  align-items: center;
  padding: 0 24px;
  border-right: 1px solid #aaa;
  background: #d7d7d4;
  font-size: 10px;
  letter-spacing: 0.06em;
}

.sheet-tab.is-active {
  border-top: 3px solid var(--sheet-select);
  background: #f5f5f2;
  font-weight: 600;
}

.sheet-tabs-fill { flex: 1; }

.sheet-zoom {
  align-self: stretch;
  display: flex;
  border-left: 1px solid #aaa;
}

.sheet-zoom button {
  min-width: 86px;
  min-height: 44px;
  border: 0;
  border-left: 1px solid #aaa;
  background: transparent;
  color: #4b4b49;
  font: 10px/1 var(--mono);
  font-size-adjust: var(--mono-cap);
  letter-spacing: 0.08em;
  cursor: pointer;
}

.sheet-zoom button:hover,
.sheet-zoom button:focus-visible {
  background: #f6f6f3;
  color: #111;
  outline: 2px solid var(--sheet-select);
  outline-offset: -3px;
}

.sheet-zoom button.is-active {
  background: #f6f6f3;
  color: var(--sheet-select);
  box-shadow: inset 0 3px 0 var(--sheet-select);
}

@media (max-width: 720px) {
  .arkusz-entry-main {
    width: calc(100vw - 20px);
    padding-top: 44px;
  }

  .arkusz-heading {
    width: calc(100% - 22px);
    margin-bottom: 30px;
  }

  .workbook {
    box-shadow: 5px 5px 0 var(--accent);
  }

  .workbook-titlebar {
    min-height: 44px;
    padding-inline: 10px;
  }

  .workbook-state,
  .workbook-menu,
  .workbook-toolbar {
    display: none;
  }

  .workbook-formula {
    min-height: 42px;
  }

  .formula-address { width: 62px; padding-inline: 8px; }
  .formula-fx { width: 34px; }
  .formula-value { padding-inline: 8px; }

  .sheet-stage[data-zoom='100'] {
    height: min(70svh, 640px) !important;
  }

  .sheet-tab { padding-inline: 16px; }
  .sheet-tab--secondary { display: none; }
  .sheet-zoom button { min-width: 74px; }
}

@media (max-width: 430px) {
  .workbook-titlebar strong { font-size: 10px; }
  .sheet-tab { padding-inline: 12px; }
  .sheet-zoom button { min-width: 68px; }
}

@media (prefers-reduced-motion: reduce) {
  .sheet-selection,
  .sheet-light { transition: none; }
  .sheet,
  .sheet-scaler { transition: none !important; }
}