.table-plan-overlay {
  position: fixed;
  inset: 0;
  z-index: 66;
  overflow: hidden;
  background: #f6f0e3;
  padding: 0;
}

.table-plan-shell {
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  background: linear-gradient(180deg, var(--ivory), #faf4e8);
  border: 0;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.tp-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding: 10px 18px;
  border-bottom: 1px solid var(--gold);
  flex-shrink: 0;
}

.tp-head h3 {
  margin: 0;
  font-family: "Cinzel", serif;
  color: var(--brown);
}

.tp-head-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.tp-history {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.tp-history .nav-btn {
  width: 36px;
  height: 36px;
  font-size: 22px;
  padding: 0;
}

.tp-history .nav-btn:disabled {
  opacity: 0.35;
  cursor: default;
}

.tp-history-label {
  min-width: 3.4em;
  text-align: center;
  font-family: "Cinzel", serif;
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--brown);
}

.tp-stats {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--brown-soft);
}

.tp-body {
  display: grid;
  grid-template-columns: 204px minmax(0, 1fr) 236px;
  min-height: 0;
  flex: 1;
}

.tp-toolbar,
.tp-inspector {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-color: var(--gold);
  border-style: solid;
  border-width: 0;
}

.tp-toolbar {
  border-right-width: 1px;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-gutter: stable;
}

.tp-inspector {
  border-left-width: 1px;
  overflow: auto;
  max-height: none;
}

.tp-toolbar .ghost-btn {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  line-height: 1.3;
  padding: 8px 8px;
  font-size: 10px;
  letter-spacing: 0.03em;
  white-space: normal;
}

.tp-inspector .ghost-btn {
  width: auto;
}

.tp-floor-wrap {
  padding: 8px 12px 12px;
  background: #f3ead8;
  min-width: 0;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  container-type: size;
}

.tp-view-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  flex-shrink: 0;
  padding: 2px 0 8px;
  z-index: 4;
}

.tp-view-switch .ghost-btn.is-on {
  background: var(--brown);
  color: #fffaf0;
  border-color: var(--brown);
}

.table-plan-floor {
  position: relative;
  flex: 1;
  width: auto;
  height: 100%;
  min-height: 0;
  aspect-ratio: 0.64 / 1;
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
  container-type: size;
  --round-d: min(12.4cqw, 5.6cqh);
  --chair-d: min(1.5cqw, 0.72cqh);
  --rect-thick: min(7.2cqw, 3.4cqh);
  --rect-len: 18cqh;
  background:
    radial-gradient(ellipse at 50% 34%, rgba(196, 163, 90, 0.1), transparent 38%),
    linear-gradient(180deg, #fffaf0, #f7edd9);
  border: 2px solid #c4a35a;
  overflow: hidden;
  touch-action: none;
}

.tp-floor-wrap[data-view="stage"] .tp-zone-stage-band {
  background: rgba(196, 163, 90, 0.18);
  box-shadow: inset 0 0 0 2px rgba(92, 51, 23, 0.45);
}

.tp-floor-wrap[data-view="hall"] .tp-zone-dance {
  border-color: rgba(92, 51, 23, 0.55);
}

.tp-floor-wrap[data-view="balcony"] .tp-balcony-stroke {
  stroke: rgba(92, 40, 80, 0.95);
  stroke-width: 0.75;
}

.tp-floor-wrap[data-view="entrance"] .tp-entry-box {
  fill: rgba(255, 250, 240, 0.95);
  stroke: #000;
  stroke-width: 0.85;
}

.tp-floor-wrap[data-view="entrance"] .tp-entry-label {
  fill: #111;
  font-weight: 700;
}

.tp-zone {
  position: absolute;
  font-family: "Cinzel", serif;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(92, 51, 23, 0.45);
  pointer-events: none;
  z-index: 1;
}

.tp-balcony-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}

.tp-balcony-fill {
  fill: rgba(122, 62, 116, 0.08);
}

.tp-balcony-stroke {
  fill: none;
  stroke: rgba(122, 62, 116, 0.72);
  stroke-width: 0.55;
  stroke-linejoin: round;
  stroke-linecap: round;
  stroke-dasharray: 1.6 0.9;
}

.tp-zone-stage-band {
  left: 1.4%;
  right: 1.4%;
  top: 1.2%;
  height: 20%;
  border: 1.4px dashed rgba(196, 163, 90, 0.55);
  border-radius: 8px;
  background: rgba(196, 163, 90, 0.08);
}

.tp-zone-stage {
  top: 2.2%;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(92, 51, 23, 0.55);
  letter-spacing: 0.2em;
}

.tp-zone-stairs {
  left: 28%;
  right: 28%;
  top: 21.6%;
  height: 5.4%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.tp-zone-stairs span {
  display: block;
  height: 0;
  border-top: 1.5px solid rgba(92, 51, 23, 0.38);
}

.tp-zone-stairs-label {
  top: 22.4%;
  left: 3%;
  font-size: 9px;
  letter-spacing: 0.18em;
}

.tp-zone-dance {
  top: 34%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 3.6cqh 7cqw;
  border: 1.5px dashed rgba(196, 163, 90, 0.6);
  border-radius: 50%;
  color: rgba(92, 51, 23, 0.5);
}

.tp-entry-box {
  fill: rgba(255, 250, 240, 0.72);
  stroke: #1a1a1a;
  stroke-width: 0.55;
}

.tp-entry-label {
  fill: rgba(26, 26, 26, 0.7);
  font-family: "Cinzel", serif;
  font-size: 2.2px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.tp-zone-balcony {
  top: auto;
  bottom: 3%;
  right: 4%;
  color: rgba(122, 62, 116, 0.85);
  font-size: 12px;
  letter-spacing: 0.22em;
}

.tp-table.is-balcony .tp-table-body {
  border-color: #8a4a7a;
}

.tp-table.is-stage .tp-table-body {
  border-color: #8a6230;
}

.tp-table.is-entrance .tp-table-body {
  border-color: #1a1a1a;
}

.tp-table {
  position: absolute;
  z-index: 2;
  transform: translate(-50%, -50%) rotate(var(--rot, 0deg)) scale(var(--s, 1));
  cursor: grab;
  user-select: none;
}

.tp-table:active {
  cursor: grabbing;
}

.tp-table.is-on .tp-table-body {
  border-color: var(--brown);
  box-shadow: 0 0 0 2px rgba(196, 163, 90, 0.55);
}

.tp-table-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  background: #fffdf8;
  border: 1px solid #c4a35a;
  color: var(--brown);
  text-align: center;
  position: relative;
  z-index: 1;
  padding: 2px 3px;
  box-sizing: border-box;
}

.tp-table-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  max-width: 100%;
  pointer-events: none;
  transform: rotate(calc(-1 * var(--rot, 0deg)));
}

.tp-table-body strong {
  font-family: "Cinzel", serif;
  font-size: clamp(8px, 1.12cqw, 15px);
  line-height: 1.05;
  font-weight: 700;
}

.tp-table-body span {
  font-size: clamp(7px, 0.85cqw, 11px);
  line-height: 1.1;
  max-width: 100%;
  font-weight: 600;
  overflow: visible;
  white-space: normal;
  word-break: break-word;
}

.tp-table-body em {
  font-style: normal;
  font-size: clamp(7px, 0.82cqw, 11px);
  line-height: 1.05;
  color: var(--gold-deep);
  font-weight: 600;
}

.tp-round .tp-table-body,
.tp-cake .tp-table-body,
.tp-cocktail .tp-table-body {
  width: var(--round-d);
  height: var(--round-d);
  border-radius: 50%;
}

.tp-cocktail .tp-table-body {
  width: calc(var(--round-d) * 0.68);
  height: calc(var(--round-d) * 0.68);
}

.tp-cake .tp-table-body {
  width: calc(var(--round-d) * 0.72);
  height: calc(var(--round-d) * 0.72);
}

.tp-rect .tp-table-body {
  width: 11cqw;
  height: 4.6cqw;
  border-radius: 4px;
}

.tp-prezidiu .tp-table-body {
  width: var(--prezidiu-w, 22cqw);
  height: 4.8cqw;
}

.tp-dreptunghi .tp-table-body {
  width: var(--rect-w, var(--rect-len));
  height: var(--rect-thick);
  border-radius: 4px;
}

.tp-prezidiu .tp-table-body strong,
.tp-dreptunghi .tp-table-body strong,
.tp-bar .tp-table-body strong,
.tp-candy .tp-table-body strong,
.tp-dj .tp-table-body strong {
  font-size: clamp(8px, 1cqw, 13px);
}

.tp-bar .tp-table-body {
  width: var(--bar-w, 12cqw);
  height: 5cqw;
  border-radius: 6px;
}

.tp-candy .tp-table-body,
.tp-dj .tp-table-body {
  width: 10cqw;
  height: 4.4cqw;
}

.tp-chair {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--chair-d);
  height: var(--chair-d);
  margin: calc(var(--chair-d) / -2) 0 0 calc(var(--chair-d) / -2);
  border: 1px solid #8a6230;
  border-radius: 50%;
  background: #f4e6c8;
  transform: rotate(var(--a)) translate(calc(var(--round-d) / 2 + var(--chair-d) * 0.75));
  padding: 0;
  cursor: pointer;
  z-index: 2;
}

.tp-cocktail .tp-chair {
  transform: rotate(var(--a)) translate(calc(var(--round-d) * 0.34 + var(--chair-d) * 0.75));
}

.tp-prezidiu .tp-chair,
.tp-bar .tp-chair,
.tp-dreptunghi .tp-chair {
  transform: translate(var(--dx, 0px), var(--dy, calc(var(--rect-thick) / -2 - var(--chair-d))));
}

.tp-scale-handle {
  position: absolute;
  right: -6px;
  bottom: -6px;
  width: 14px;
  height: 14px;
  padding: 0;
  border: 2px solid var(--brown);
  background: #fffdf8;
  cursor: nwse-resize;
  z-index: 4;
}

.tp-table:not(.is-on) .tp-scale-handle {
  opacity: 0.4;
}

.tp-chair.is-named {
  background: #5c3317;
  border-color: #5c3317;
}

.tp-chair.is-on {
  outline: 2px solid var(--gold);
}

.tp-chairs-ctrl {
  display: flex;
  align-items: center;
  gap: 8px;
}

.tp-chairs-ctrl .ghost-btn {
  min-width: 34px;
}

.tp-seat-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 240px;
  overflow: auto;
}

.tp-empty {
  margin: 0;
  font-size: 13px;
  color: var(--brown-soft);
  line-height: 1.45;
}

.tp-guest-import {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 0 4px;
  border-top: 1px solid rgba(92, 51, 23, 0.14);
  margin-top: 4px;
}

.tp-guest-title {
  margin: 0;
  font-family: "Cinzel", serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #9a7840;
}

.tp-guest-hint {
  font-size: 12px;
}

.tp-guest-status {
  margin: 0;
  font-size: 12px;
  line-height: 1.4;
  color: #5c3317;
  background: rgba(196, 163, 90, 0.14);
  padding: 6px 8px;
  border: 1px solid rgba(196, 163, 90, 0.35);
}

.tp-inspector label,
.tp-toolbar label {
  font-size: 11px;
}

.tp-toolbar select,
.tp-inspector select,
.tp-inspector input,
.tp-inspector textarea {
  width: 100%;
}

@media print {
  @page table-plan {
    size: A4 portrait;
    margin: 0;
  }

  @page table-plan {
    @top-left { content: none; }
    @top-center { content: none; }
    @top-right { content: none; }
    @bottom-left { content: none; }
    @bottom-center { content: none; }
    @bottom-right { content: none; }
  }

  body.table-plan-print {
    page: table-plan;
  }

  body.table-plan-print > *:not(#table-plan-overlay) {
    display: none !important;
  }

  body.table-plan-print,
  body.table-plan-print #table-plan-overlay {
    background: #fff;
  }

  .table-plan-overlay.is-printing {
    position: static;
    background: #fff;
    padding: 10mm;
    overflow: visible;
    width: 100%;
    height: auto;
    box-sizing: border-box;
  }

  .table-plan-overlay.is-printing .table-plan-shell {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 277mm;
    max-height: 277mm;
    background: #fff;
    border: 0;
    box-shadow: none;
  }

  .table-plan-overlay.is-printing .tp-head {
    flex-shrink: 0;
    padding: 0 0 6px;
    border: 0;
    gap: 8px;
  }

  .table-plan-overlay.is-printing .tp-head h3 {
    font-size: 18px;
  }

  .table-plan-overlay.is-printing .tp-stats {
    font-size: 11px;
    margin: 2px 0 0;
  }

  .table-plan-overlay.is-printing .tp-toolbar,
  .table-plan-overlay.is-printing .tp-inspector,
  .table-plan-overlay.is-printing .tp-head-actions,
  .table-plan-overlay.is-printing .tp-view-switch,
  .table-plan-overlay.is-printing .tp-scale-handle,
  .table-plan-overlay.is-printing .app-credit {
    display: none !important;
  }

  .table-plan-overlay.is-printing .tp-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    height: auto;
  }

  .table-plan-overlay.is-printing .tp-floor-wrap {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    height: auto;
    padding: 0;
    background: #fff;
    overflow: visible;
  }

  .table-plan-overlay.is-printing .table-plan-floor {
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    height: 100%;
    max-height: none;
    min-height: 0;
    aspect-ratio: auto;
    margin: 0;
    break-inside: avoid;
    transform: none !important;
  }
}

@media (max-width: 980px) {
  .table-plan-overlay {
    overflow: auto;
  }

  .table-plan-shell {
    height: auto;
    min-height: 100%;
    min-height: 100dvh;
  }

  .tp-head {
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 12px;
  }

  .tp-head h3 {
    font-size: 16px;
    flex: 1 1 auto;
  }

  .tp-head-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .tp-history {
    grid-column: 1 / -1;
    justify-content: center;
  }

  .tp-head-actions .ghost-btn,
  .tp-head-actions .gold-btn {
    width: 100%;
    min-height: 44px;
  }

  .tp-body {
    grid-template-columns: 1fr;
    height: auto;
  }

  .tp-floor-wrap {
    order: -1;
    min-height: 62vh;
    height: 62vh;
  }

  .table-plan-floor {
    min-height: 58vh;
  }

  .tp-toolbar,
  .tp-inspector {
    border-width: 0;
    max-height: none;
    padding: 12px;
  }

  .tp-toolbar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .tp-toolbar .ghost-btn,
  .tp-toolbar .gold-btn,
  .tp-toolbar label {
    min-height: 44px;
  }

  .tp-seat {
    min-width: 44px;
    min-height: 44px;
  }
}

@media (max-width: 640px) {
  .tp-floor-wrap {
    min-height: 55vh;
    height: 55vh;
  }

  .tp-head-actions,
  .tp-toolbar {
    grid-template-columns: 1fr;
  }
}