@font-face {
  font-family: "Cormorant Garamond";
  src: url("./fonts/cormorant-web-2fd93370964a.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("./fonts/cormorant-italic.ttf") format("truetype");
  font-style: italic;
  font-weight: 400 700;
  font-display: swap;
}

:root {
  --ivory: #f8f6f2;
  --paper: #fffefc;
  --paper-strong: #fffefc;
  --burgundy: #502c38;
  --burgundy-2: #704555;
  --burgundy-soft: #e9dce0;
  --rose: #b98282;
  --sage: #75826c;
  --sage-soft: #dfe5d9;
  --gold: #b3945d;
  --ink: #2f2628;
  --muted: #776c68;
  --line: #ded3c7;
  --danger: #9b4146;
  --shadow: 0 18px 55px rgba(67, 42, 39, .13);
  --serif: "Cormorant Garamond", "Iowan Old Style", "Baskerville", Georgia, serif;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { color-scheme: light; background: var(--ivory); }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--ink); background: var(--ivory); font-family: var(--sans); font-size: 14px; }
button, input, select, textarea { font: inherit; color: inherit; }
button, select { cursor: pointer; }
button { border: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid rgba(179, 148, 93, .55); outline-offset: 2px; }

h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: var(--serif); color: var(--burgundy); font-weight: 600; letter-spacing: -.025em; }
h1 { margin-bottom: 4px; font-size: clamp(30px, 3vw, 42px); line-height: 1; }
h2 { margin-bottom: 8px; font-size: 25px; line-height: 1.1; }
h3 { margin-bottom: 10px; font-size: 14px; }
.eyebrow { margin-bottom: 6px; color: var(--gold); font-size: 10px; font-weight: 800; letter-spacing: .19em; text-transform: uppercase; }

.button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 9px 16px; border: 1px solid transparent; border-radius: 9px; font-weight: 700; transition: transform .15s, background .15s, box-shadow .15s; }
.button:hover { transform: translateY(-1px); }
.button:disabled { cursor: not-allowed; opacity: .52; transform: none; }
.button.primary { color: #fff; background: var(--burgundy); box-shadow: 0 8px 20px rgba(80, 44, 56, .18); }
.button.primary:hover { background: #42222d; }
.button.secondary { color: var(--burgundy); border-color: #ccbfc0; background: transparent; }
.button.secondary:hover { background: #f3e9e4; }
.button.compact { min-height: 34px; padding: 7px 12px; font-size: 12px; }
.wide { width: 100%; }
.text-button, .subtle-button { padding: 4px; color: var(--burgundy); background: transparent; font-size: 12px; font-weight: 750; }
.text-button:hover, .subtle-button:hover { text-decoration: underline; }
.icon-button { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; color: var(--burgundy); background: var(--paper); font-size: 17px; }

input, select, textarea { width: 100%; min-height: 42px; border: 1px solid #d7d0c8; border-radius: 8px; background: var(--paper-strong); padding: 9px 11px; }
textarea { min-height: 120px; resize: vertical; line-height: 1.5; }
label { display: grid; gap: 6px; color: #655b57; font-size: 12px; font-weight: 700; }
fieldset { margin: 0; padding: 0; border: 0; }
legend { margin-bottom: 8px; color: #655b57; font-size: 12px; font-weight: 700; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.field-row.buttons { margin-top: 8px; }
.field-hint { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.form-error { min-height: 18px; margin: 0; color: var(--danger); font-size: 12px; font-weight: 650; }

.loading-view, .auth-view { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 50% 20%, #fff 0 8%, transparent 48%), var(--ivory); }
.loading-view { align-content: center; color: var(--burgundy); text-align: center; }
.loading-view .brand-mark { font-family: Georgia, serif; }
.loading-view .boot-retry { animation: reveal-boot-retry 0s 10s both; }
@keyframes reveal-boot-retry { from { visibility:hidden; } to { visibility:visible; } }
.loading-view p { margin-top: 18px; letter-spacing: .08em; }
.auth-card { width: min(440px, 100%); padding: 46px; border: 1px solid rgba(80, 44, 56, .13); border-radius: 6px; background: var(--paper-strong); box-shadow: 0 22px 70px rgba(67, 42, 39, .1); }
.brand-mark { width: 66px; height: 66px; display: grid; place-items: center; margin: 0 auto 18px; border: 1px solid var(--gold); border-radius: 50%; color: var(--burgundy); font: 600 22px/1 var(--serif); letter-spacing: .05em; }
.brand-mark span { margin: 0 3px; color: var(--gold); font-size: 15px; }
.auth-card > .eyebrow, .auth-card > h1, .auth-copy { text-align: center; }
.auth-card h1 { font-size: 44px; }
.event-date { margin: 1px 0 18px; color: var(--burgundy); font: 600 12px/1 var(--serif); letter-spacing: .18em; text-align: center; text-transform: uppercase; }
.auth-copy { margin: 10px 0 28px; color: var(--muted); line-height: 1.5; }
.auth-form label small { color: var(--muted); font-size: 10px; font-weight: 500; }
.auth-form { display: grid; gap: 16px; }
.password-field { display: flex; position: relative; }
.password-field input { padding-right: 72px; }
.show-password { position: absolute; right: 5px; top: 5px; height: 32px; padding: 0 9px; border-radius: 6px; color: var(--burgundy); background: transparent; font-size: 11px; font-weight: 750; }

.app { min-height: 100vh; }
.topbar { height: 68px; display: grid; grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr); align-items: center; gap: 18px; padding: 0 24px; border-bottom: 1px solid var(--line); background: rgba(255, 254, 252, .96); position: sticky; top: 0; z-index: 30; backdrop-filter: blur(16px); }
.brand { display: inline-flex; width: fit-content; align-items: center; gap: 11px; color: inherit; text-decoration: none; }
.brand-monogram { width: 38px; height: 38px; display: grid; grid-template-columns: auto auto auto; place-content: center; border: 1px solid var(--gold); border-radius: 50%; color: var(--burgundy); font: 600 13px var(--serif); }
.brand-monogram span { margin: 0 2px; color: var(--gold); font-size: 10px; }
.brand strong { display: block; color: var(--burgundy); font: 600 18px/1 var(--serif); }
.brand small { color: var(--muted); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.main-tabs { height: 100%; display: flex; align-items: stretch; gap: 24px; }
.tab { position: relative; padding: 0 3px; color: var(--muted); background: transparent; font-size: 13px; font-weight: 700; }
.tab::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: transparent; }
.tab.active { color: var(--burgundy); }
.tab.active::after { background: var(--burgundy); }
.topbar-actions { display: flex; justify-content: flex-end; align-items: center; gap: 10px; }
.save-status { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.save-status i { width: 7px; height: 7px; border-radius: 50%; background: var(--sage); box-shadow: 0 0 0 3px var(--sage-soft); }
.save-status.saving i { background: var(--gold); box-shadow: 0 0 0 3px #eee2ca; }
.save-status.error i { background: var(--danger); box-shadow: 0 0 0 3px #f1d7d9; }
.avatar { width: 36px; height: 36px; border-radius: 50%; color: #fff; background: var(--burgundy); font: 600 15px var(--serif); }

.planbar { min-height: 55px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 8px 24px; border-bottom: 1px solid var(--line); background: #f0ede8; }
.plan-select-wrap, .view-select-wrap { display: flex; align-items: center; gap: 8px; }
.planbar label { display: inline; color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.planbar select { min-height: 34px; width: auto; max-width: 220px; padding: 6px 30px 6px 9px; border-color: transparent; background-color: rgba(255,255,255,.58); font-size: 12px; font-weight: 700; }
.count-summary { display: flex; align-items: baseline; gap: 7px; color: var(--muted); font-size: 11px; }
.count-summary strong { color: var(--burgundy); font: 600 24px var(--serif); }
.count-summary b { color: var(--ink); }
.plan-status-tools { display: flex; align-items: center; gap: 16px; }
.undo-button { padding: 7px 10px; border: 1px solid rgba(80,44,56,.2); border-radius: 8px; text-decoration: none !important; }

.salon-panel { height: calc(100vh - 123px); display: grid; grid-template-columns: 228px minmax(520px, 1fr) 294px; overflow: hidden; }
.venue-overview { display: contents; }
.salon-tools { display:grid; grid-template-columns:auto auto minmax(0,1fr); align-items:center; gap:6px 8px; margin:0 0 8px; }
.scene-guide { position:relative; min-width:0; }
.scene-guide .scene-legend { justify-content:flex-end; }
.scene-guide:has(.selection-banner:not([hidden])) .scene-legend { visibility:hidden; }
@media (max-width: 1130px) {
  .salon-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .scene-guide { grid-column:1 / -1; }
  .scene-guide .scene-legend { justify-content:center; }
}
.salon-tools .button { min-height:36px; }
.directory-seat:is(button) { cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.table-locator-ring { fill:#f8de9d; fill-opacity:.5; stroke:#7f3d51; stroke-width:3; stroke-dasharray:6 3; }
.masa-table.not-suggested { opacity:.45; }
@media(max-width:820px) { .salon-tools .button { flex:1; min-height:42px; } }
@media (min-width:821px) {
  .salon-panel { height:auto; min-height:calc(100vh - 123px); overflow:visible; align-items:start; }
  .salon-panel > .panel { overflow:visible; min-width:0; }
  .salon-panel .scene { flex:none; height:clamp(360px, calc(100vh - 300px), 760px); }
  #quick-guest-list { max-height:clamp(240px,42vh,440px); overflow-y:auto; }

  html { scrollbar-gutter:stable; }
  .salon-panel:has(.scene[data-mode="plan"]) {
    grid-template-columns: clamp(170px,15vw,224px) minmax(0,1fr) clamp(212px,19vw,292px);
  }
  .venue-column:has(.scene[data-mode="plan"]) { padding-inline: 12px; }
  .venue-column:has(.scene[data-mode="plan"]) .venue-overview {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding-bottom: 8px;
  }
  .venue-column:has(.scene[data-mode="plan"]) .venue-toolbar { flex: 1 1 295px; }
  .venue-column:has(.scene[data-mode="plan"]) .venue-stats { flex: 1.3 1 340px; margin: 0; grid-template-columns: repeat(5, minmax(0,1fr)); }
  .salon-panel .scene[data-mode="plan"] { height: auto; aspect-ratio: 1000 / 650; }
  .scene[data-mode="plan"] .masa-scene-shell { position: absolute; inset: 0; }
  .scene[data-mode="plan"] :is(.masa-scene-shell, .masa-scene-svg) { min-height: 0; }
}
@media (min-width:821px) and (min-height:680px) {
  .salon-panel > .venue-column:not(:has(.scene[data-mode="plan"])) { position:sticky; top:68px; }
  .salon-panel:has(.scene[data-mode="plan"]) > .panel { position:sticky; top:68px; max-height:calc(100vh - 68px); overflow-y:auto; scrollbar-gutter:stable; }
}
.panel { padding: 22px 18px; background: var(--paper); overflow: auto; scrollbar-width: thin; }
.palette-panel { border-right: 1px solid var(--line); }
.inspector-panel { border-left: 1px solid var(--line); }
.panel-heading { display: flex; justify-content: space-between; align-items: flex-start; }
.panel-heading h2 { margin-bottom: 2px; }
.panel-note { margin: 8px 0 16px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.sheet-close, .sheet-handle { display: none; }
.palette-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.palette-item { min-height: 122px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 10px 4px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper-strong); }
.palette-item:hover { border-color: var(--burgundy-2); box-shadow: 0 6px 16px rgba(80,44,56,.08); }
.palette-item strong { color: var(--burgundy); font: 600 14px var(--serif); }
.palette-item small { color: var(--muted); font-size: 9px; }
.table-glyph { width: 64px; height: 58px; display: grid; place-items: center; margin-bottom: 3px; }
.table-glyph img { display:block; max-width:100%; max-height:100%; object-fit:contain; filter:drop-shadow(0 4px 5px rgba(55,30,18,.18)); }
.table-glyph.round img { width:56px; height:56px; }
.table-glyph.rect { width:72px; }
.table-glyph.rect img { width:72px; }
.custom-table-form { display: grid; gap: 10px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.custom-table-form input, .custom-table-form select { min-height: 38px; }
.palette-help { margin-top: 20px; padding: 12px; border-radius: 9px; background: #eee5d8; }
.palette-help span { color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.palette-help p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.45; }

.venue-column { min-width: 0; display: flex; flex-direction: column; padding: 18px 20px 10px; background: #efebe5; }
.venue-toolbar { min-height: 57px; display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.venue-toolbar h1 { margin-bottom: 1px; font-size: 34px; }
.venue-title > p:last-child { margin: 0; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.venue-actions { display: flex; align-items: center; gap: 8px; }
.venue-stats { display: grid; grid-template-columns: repeat(5, minmax(66px, 1fr)); gap: 6px; margin: 10px 0; }
.stat-item { min-width: 0; padding: 7px 9px; border: 1px solid rgba(80,44,56,.1); border-radius: 7px; background: rgba(255,254,252,.86); }
.stat-item strong { display: block; color: var(--burgundy); font: 600 20px/1 var(--serif); }
.stat-item span { display: block; margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .08em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.stat-item[data-tone="alert"] { border-color: rgba(155,65,70,.28); background: #fbefee; }
.stat-item[data-tone="good"] { border-color: rgba(117,130,108,.3); background: #f1f4ee; }
.inspector-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin: 12px 0 4px; }
.inspector-stats .stat-item { padding: 6px 7px; }
.inspector-stats .stat-item strong { font-size: 17px; }
.inspector-stats .stat-item span { font-size: 7px; }
.scene { min-height: 0; flex: 1; position: relative; overflow: hidden; border: 1px solid #c8b9a8; border-radius: 12px; background: #d7c5b0; box-shadow: inset 0 0 0 6px rgba(255,255,255,.15), 0 12px 30px rgba(76,54,44,.11); touch-action: none; }
.scene[data-mode="side"] .masa-selection-card,
.scene[data-mode="stage"] .masa-selection-card { top: auto; bottom: 12px; }
.scene:empty::before { content: "Salon görünümü hazırlanıyor…"; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(80,44,56,.58); font: 600 18px var(--serif); }
.scene-legend { display: flex; align-items: center; gap: 15px; min-height: 35px; color: var(--muted); font-size: 9px; }
.table-interaction-hint { display: none; margin: 0; color: var(--muted); font-size: 9px; line-height: 1.25; text-align: center; }
.legend-dot { width: 8px; height: 8px; display: inline-block; margin-right: 5px; border-radius: 50%; }
.legend-dot.available { background: #f7f1e5; border: 1px solid var(--sage); }
.legend-dot.partial { background: var(--gold); }
.legend-dot.full { background: var(--burgundy); }
.selection-banner { position:absolute; inset:0; display:flex; align-items:center; justify-content:space-between; gap:6px; padding-inline:8px; border:1px solid #cdb789; border-radius:8px; color:var(--burgundy); background:#f5ead0; font-size:11px; line-height:1.2; font-weight:700; }
.selection-banner button { align-self:stretch; padding-inline:6px; color:inherit; background:transparent; text-decoration:underline; font-size:inherit; }
.mobile-tool, .mobile-inspector-fab { display: none; }

.empty-state { padding: 38px 8px 28px; color: var(--muted); text-align: center; }
.empty-state > span { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto 13px; border: 1px solid var(--line); border-radius: 50%; color: var(--burgundy); font-size: 26px; }
.empty-state h3 { color: var(--burgundy); font: 600 18px var(--serif); }
.empty-state p { font-size: 11px; line-height: 1.5; }
.table-form { display: grid; gap: 11px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.table-form input, .table-form select { min-height: 38px; }
.table-form input[type="range"] { min-height: 18px; padding: 0; accent-color: var(--burgundy); }
#rotation-output { float: right; color: var(--burgundy); }
.rotation-control { min-width: 0; margin: 0; padding: 0; border: 0; }
.rotation-control legend { width: 100%; margin-bottom: 5px; font-weight: 650; }
.rotation-inputs { display: grid; grid-template-columns: minmax(0,1fr) 76px; align-items: end; gap: 10px; }
.rotation-inputs > input[type="range"] { align-self: center; }
.rotation-inputs label { gap: 3px; color: var(--muted); font-size: 8px; text-transform: uppercase; }
.rotation-inputs input[type="number"] { width: 100%; min-height: 38px; padding-inline: 7px; color: var(--burgundy); font-weight: 800; text-align: center; }
.inspector-actions { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.inspector-actions button { min-height: 38px; padding: 5px; border: 1px solid var(--line); border-radius: 7px; color: var(--burgundy); background: transparent; font-size: 9px; font-weight: 750; }
.inspector-actions .danger { color: var(--danger); }
.group-control, .table-guests { padding: 14px 0; border-bottom: 1px solid var(--line); }
.group-control select { min-height: 38px; }
.seat-editor-entry { display: grid; gap: 6px; margin: 10px 0 3px; padding: 10px; border: 1px solid #ddcba9; border-radius: 10px; background: linear-gradient(135deg,#fffaf1,#f6ecdd); box-shadow: 0 5px 15px rgba(86,53,29,.05); }
.seat-editor-trigger { min-height: 40px; margin: 0; }
.seat-editor-entry .field-hint { margin: 0; line-height: 1.4; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.section-heading h3 { margin: 0; }
.section-heading span { color: var(--muted); font-size: 10px; }
.guest-mini-list { display: grid; gap: 5px; margin-top: 10px; }
.guest-chip { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 7px; min-height: 34px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 8px; background: var(--paper-strong); }
.guest-chip input { width: 14px; min-height: 14px; accent-color: var(--burgundy); }
.guest-chip .guest-initial { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; color: var(--burgundy); background: var(--burgundy-soft); font-size: 9px; font-weight: 800; }
.guest-chip strong { min-width: 0; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.guest-chip small { display: block; color: var(--muted); font-size: 8px; font-weight: 500; }
.guest-chip .guest-copy { display: grid; min-width: 0; gap: 1px; }
.seat-status { display: inline-block; width: fit-content; max-width: 100%; padding: 2px 7px; overflow: hidden; border-radius: 1em; color: #74522b; background: #f5ead9; font-size: 11px; font-weight: 700; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.seat-status.seated { color: #38563e; background: #e6eee5; }
.guest-chip .seat-status { margin-top: 2px; }
.guest-chip button { padding: 3px; color: var(--muted); background: transparent; font-size: 11px; }
.guest-chip.selected { border-color: var(--burgundy); background: #f3e6e5; }
.guest-chip[draggable="true"] { cursor: grab; }
.quick-assign { padding-top: 16px; }
.search-field { display: flex; align-items: center; position: relative; }
.search-field span { position: absolute; left: 10px; z-index: 1; color: var(--muted); font-size: 16px; }
.search-field input { padding-left: 31px; }
.quick-assign .search-field { margin: 10px 0 8px; }

.workspace-panel { min-height: calc(100vh - 123px); padding: 42px clamp(22px, 5vw, 72px) 60px; background: var(--ivory); }
.workspace-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; max-width: 1180px; margin: 0 auto 26px; }
.workspace-header > div > p:last-child { max-width: 620px; margin: 9px 0 0; color: var(--muted); }
.guest-dashboard { max-width: 1180px; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 22px; margin: auto; }
.guest-list-card, .guest-side-card, .output-card { border: 1px solid var(--line); border-radius: 14px; background: var(--paper-strong); box-shadow: 0 10px 35px rgba(67,42,39,.06); }
.guest-list-card { overflow: hidden; }
.list-toolbar { display: flex; gap: 10px; padding: 16px; border-bottom: 1px solid var(--line); }
.list-toolbar .search-field { flex: 1; }
.list-toolbar select { width: 170px; }
.table-header, .directory-row { display: grid; grid-template-columns: minmax(160px, 1.3fr) minmax(110px, .8fr) minmax(110px, .8fr) 95px; align-items: center; gap: 12px; padding: 10px 16px; }
.table-header { color: var(--muted); background: #f0e8dd; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.directory-row { min-height: 60px; border-top: 1px solid #eee5da; }
.directory-row:first-child { border-top: 0; }
.directory-row .person { display: flex; align-items: center; gap: 10px; min-width: 0; }
.person-initial { width: 32px; height: 32px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 50%; color: var(--burgundy); background: var(--burgundy-soft); font: 700 11px var(--serif); }
.directory-row strong, .directory-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.directory-row .muted { color: var(--muted); font-size: 12px; }
.directory-row .directory-seat { min-width: 0; font-size: 12px; }
.row-actions { display: flex; justify-content: flex-end; gap: 3px; }
.row-actions button { width: 29px; height: 29px; border-radius: 6px; color: var(--burgundy); background: transparent; }
.row-actions button:hover { background: #eee5da; }
.row-actions button.danger { color: var(--danger); }
.guest-side-card { align-self: start; padding: 22px; }
.guest-side-card form { display: grid; gap: 13px; }
.target-card { display: grid; gap: 11px; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.target-card > div { display: flex; justify-content: space-between; align-items: baseline; }
.target-card span { color: var(--muted); font-size: 11px; text-transform: uppercase; }
.target-card strong { color: var(--burgundy); font: 600 34px var(--serif); }
.empty-list { padding: 40px 20px; color: var(--muted); text-align: center; }

.output-grid { max-width: 1080px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin: 0 auto; }
.output-card { padding: 20px; }
.output-card h2 { margin-top: 0; }
.output-card > p:not(.eyebrow) { min-height: 58px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.output-preview { height: 180px; position: relative; margin-bottom: 20px; overflow: hidden; border: 1px solid #d8cab9; border-radius: 9px; background: #eee3d5; }
.room-preview { background: linear-gradient(90deg, transparent 49.5%, rgba(80,44,56,.12) 50%, transparent 50.5%), linear-gradient(0deg, transparent 49.5%, rgba(80,44,56,.12) 50%, transparent 50.5%), #eee3d5; }
.room-preview i { width: 36px; height: 36px; position: absolute; border: 4px double var(--burgundy-2); border-radius: 50%; background: #e7d4cf; }
.room-preview i:nth-child(1){left:20%;top:20%}.room-preview i:nth-child(2){right:22%;top:28%}.room-preview i:nth-child(3){left:35%;bottom:18%}.room-preview i:nth-child(4){right:12%;bottom:12%}
.list-preview { padding: 24px; background: var(--paper); }
.list-preview i { display: block; height: 14px; margin: 10px 0; border-bottom: 1px solid #cabdb0; box-shadow: inset 55px 0 var(--burgundy-soft); }
.card-preview { display: grid; place-items: center; background: radial-gradient(circle, transparent 48%, rgba(179,148,93,.18) 49% 50%, transparent 51%), var(--paper); }
.card-preview span { color: var(--burgundy); font: 600 38px var(--serif); }

.modal { width: min(500px, calc(100vw - 32px)); max-height: calc(100vh - 32px); padding: 0; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: var(--paper); box-shadow: var(--shadow); }
.modal::backdrop { background: rgba(35,26,27,.5); backdrop-filter: blur(3px); }
.modal form { display: grid; gap: 14px; padding: 28px; }
.modal h2 { margin: -5px 0 2px; font-size: 32px; }
.modal-close { width: 32px; height: 32px; position: absolute; top: 14px; right: 14px; border-radius: 50%; color: var(--muted); background: #efe6db; font-size: 22px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 5px; }
.radio-card { grid-template-columns: auto 1fr; align-items: center; margin-bottom: 7px; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper-strong); }
.radio-card:has(input:checked) { border-color: var(--burgundy); background: #f3e8e5; }
.radio-card input { width: 16px; min-height: 16px; accent-color: var(--burgundy); }
.radio-card strong, .radio-card small { display: block; }
.radio-card small { margin-top: 2px; color: var(--muted); font-weight: 500; }
.wide-modal { width: min(650px, calc(100vw - 32px)); }
.seat-editor-dialog { width: min(940px, calc(100vw - 24px)); overflow: auto; }
.seat-editor-shell { display: grid; gap: 14px; padding: 28px; }
.seat-editor-shell h2 { margin: -5px 0 0; }
.seat-editor-layout { min-height: 390px; display: grid; grid-template-columns: minmax(190px,240px) minmax(0,1fr); gap: 16px; }
.seat-editor-layout h3 { margin: 0 0 9px; color: var(--burgundy); font-size: 13px; }
.seat-people, .seat-targets { min-width: 0; }
.seat-person-list { max-height: 490px; display: grid; gap: 7px; overflow-y: auto; padding: 2px 4px 2px 2px; scrollbar-gutter: stable; }
.seat-person { min-height: 52px; display: grid; grid-template-columns: 31px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; gap: 1px 8px; padding: 7px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--paper-strong); text-align: left; }
.seat-person > span { grid-row: 1 / 3; width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: var(--burgundy); background: var(--burgundy-soft); font-weight: 850; }
.seat-person strong, .seat-person small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.seat-person strong { font-size: 11px; }
.seat-person small { color: var(--muted); font-size: 9px; }
.seat-person.is-selected { border-color: var(--burgundy); background: #f4e6e5; box-shadow: 0 0 0 2px rgba(91,36,54,.11); }
.seat-map-scroll { max-width: 100%; overflow: auto; padding: 10px; border: 1px solid var(--line); border-radius: 14px; background: #eee5d9; overscroll-behavior: contain; }
.seat-map { min-width: 320px; min-height: 320px; position: relative; margin: auto; border-radius: 12px; background: radial-gradient(circle at center, rgba(255,255,255,.72), rgba(255,252,244,.22) 58%, transparent 59%); }
.seat-table-top { width: 46%; height: 34%; display: grid; place-content: center; position: absolute; top: 50%; left: 50%; z-index: 0; transform: translate(-50%,-50%); border: 3px double #a98951; border-radius: 13px; color: #fff8e9; background: linear-gradient(145deg,#5a321e,#2e170f); box-shadow: 0 12px 25px rgba(63,35,22,.24); text-align: center; }
.seat-map.is-round .seat-table-top { width: 44%; height: 44%; border-radius: 50%; }
.seat-table-top strong { font: 600 23px/1.05 var(--serif); }
.seat-table-top span { margin-top: 5px; color: #e7c993; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.seat-target { width: var(--seat-width,78px); min-height: 60px; display: grid; grid-template-rows: 20px auto; place-items: center; gap: 3px; position: absolute; z-index: 1; padding: 5px; transform: translate(-50%,-50%); border: 2px solid #b8a789; border-radius: 10px; color: #38241d; background: #fffdf7; box-shadow: 0 4px 10px rgba(58,38,29,.16); text-align: center; }
.seat-target > span { min-width: 23px; height: 20px; display: grid; place-items: center; padding-inline: 4px; border-radius: 10px; color: #fff; background: #9a7a49; font-size: 9px; font-weight: 850; }
.seat-target strong { min-width: 0; max-width: 100%; display: -webkit-box; overflow: hidden; font-size: 10px; font-weight: 750; line-height: 1.08; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.seat-target.is-empty { border-style: dashed; color: var(--muted); background: #faf6ee; }
.seat-target.is-current { border-color: var(--burgundy); background: #f5e1e2; box-shadow: 0 0 0 3px rgba(91,36,54,.16); }
.seat-target:focus-visible, .seat-person:focus-visible { outline: 3px solid #d89b38; outline-offset: 2px; }
.seat-map.is-grid { min-width: 0; min-height: 0; display: grid; grid-template-columns: repeat(auto-fill,minmax(92px,1fr)); gap: 8px; padding: 68px 8px 8px; background: #f6efe4; }
.seat-map.is-grid .seat-table-top { width: calc(100% - 16px); height: 50px; top: 8px; left: 8px; transform: none; border-radius: 10px; }
.seat-map.is-grid .seat-table-top strong { font-size: 17px; }
.seat-map.is-grid .seat-target { width: auto; min-height: 58px; position: static; transform: none; }
.sheet-backdrop { position: fixed; inset: 0; z-index: 50; background: rgba(35,26,27,.45); }
.toast-region { position: fixed; right: 18px; bottom: 18px; z-index: 100; display: grid; gap: 8px; pointer-events: none; }
.toast { max-width: min(380px, calc(100vw - 36px)); padding: 12px 15px; border-radius: 10px; color: #fff; background: var(--burgundy); box-shadow: var(--shadow); font-size: 12px; animation: toast-in .22s ease-out; }
.toast.error { background: var(--danger); }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

@media (max-width: 1060px) {
  .salon-panel { grid-template-columns: 198px minmax(420px, 1fr) 250px; }
  .brand > span:last-child { display: none; }
  .topbar { grid-template-columns: 80px 1fr auto; }
  .save-status { display: none; }
}

@media (max-width: 820px) {
  body { padding-bottom: env(safe-area-inset-bottom); }
  .topbar { height: 59px; grid-template-columns: auto 1fr auto; padding: 0 14px; }
  .brand-monogram { width: 34px; height: 34px; }
  .main-tabs { position: fixed; right: 0; bottom: 0; left: 0; z-index: 40; height: calc(58px + env(safe-area-inset-bottom)); justify-content: space-around; gap: 0; padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid var(--line); background: rgba(255,254,252,.97); box-shadow: 0 -8px 24px rgba(67,42,39,.08); }
  .tab { flex: 1; }
  .tab::after { top: 0; bottom: auto; }
  .topbar-actions { gap: 6px; }
  .planbar { min-height: 53px; padding: 7px 12px; }
  .planbar #rename-plan-button, .count-summary, .view-select-wrap label { display: none; }
  .planbar select { max-width: 150px; }
  .salon-panel { height: calc(100svh - 170px - env(safe-area-inset-bottom)); display: block; overflow: hidden; }
  .venue-column { height: 100%; padding: 12px 10px 8px; }
  .venue-toolbar { min-height: 49px; }
  .venue-toolbar h1 { font-size: 24px; }
  .venue-toolbar .eyebrow { margin-bottom: 3px; font-size: 8px; }
  .venue-title > p:last-child { display: none; }
  .venue-stats { gap: 4px; margin: 7px 0; }
  .venue-stats .stat-item { padding: 5px 6px; }
  .venue-stats .stat-item strong { font-size: 17px; }
  .venue-stats .stat-item span { font-size: 7px; letter-spacing: .03em; }
  .scene[data-mode] .masa-selection-card { top: auto; right: 8px; bottom: 8px; left: 8px; max-width: calc(100% - 16px); }
  .mobile-tool { display: inline-flex; min-height: 36px; align-items: center; padding: 0 11px; border-radius: 8px; color: #fff; background: var(--burgundy); font-size: 11px; font-weight: 700; }
  .scene { border-radius: 9px; }
  .scene-legend { justify-content: center; }
  .table-interaction-hint { display: block; }
  .mobile-sheet { width: min(92vw, 390px); max-height: 82svh; position: fixed; right: 0; bottom: calc(58px + env(safe-area-inset-bottom)); left: 0; z-index: 60; margin: auto; padding: 18px 18px calc(20px + env(safe-area-inset-bottom)); border: 1px solid var(--line); border-radius: 18px 18px 0 0; box-shadow: 0 -18px 55px rgba(35,26,27,.2); transform: translateY(110%); visibility: hidden; transition: transform .24s ease, visibility .24s; }
  .mobile-sheet.open { transform: translateY(0); visibility: visible; }
  .sheet-close { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: var(--muted); background: #efe6db; font-size: 21px; }
  .sheet-handle { width: 42px; height: 4px; display: block; margin: -9px auto 12px; border-radius: 4px; background: #c9bcb0; }
  .mobile-inspector-fab { display: block; position: fixed; right: 14px; bottom: calc(72px + env(safe-area-inset-bottom)); z-index: 25; padding: 10px 14px; border-radius: 22px; color: #fff; background: var(--burgundy); box-shadow: 0 8px 20px rgba(80,44,56,.25); font-size: 11px; font-weight: 750; }
  .workspace-panel { min-height: calc(100svh - 112px); padding: 26px 14px calc(86px + env(safe-area-inset-bottom)); }
  .workspace-header { align-items: flex-start; }
  .guest-dashboard { grid-template-columns: 1fr; }
  .guest-side-card { order: -1; }
  .output-grid { grid-template-columns: 1fr; }
  .output-card > p:not(.eyebrow) { min-height: auto; }
  .seat-editor-dialog { width: calc(100vw - 12px); max-height: calc(100svh - 12px); }
  .seat-editor-shell { padding: 22px 12px calc(14px + env(safe-area-inset-bottom)); }
  .seat-editor-layout { min-height: 0; grid-template-columns: 1fr; }
  .seat-editor-trigger { min-height: 44px; }
  .seat-person-list { max-height: none; display: flex; overflow-x: auto; overflow-y: hidden; padding: 2px 2px 8px; scroll-snap-type: x proximity; }
  .seat-person { min-width: 190px; min-height: 56px; scroll-snap-align: start; }
  .seat-map-scroll { max-height: 52svh; padding: 7px; }
  .seat-target { min-height: 56px; }
}

@media (max-width: 560px) {
  .auth-card { padding: 32px 22px; }
  .auth-card h1 { font-size: 36px; }
  .plan-select-wrap label, #rename-plan-button { display: none; }
  .planbar .button.compact { padding: 6px 8px; }
  .view-select-wrap select { max-width: 130px; }
  .workspace-header { display: grid; }
  .workspace-header .button { width: 100%; }
  .list-toolbar { display: grid; }
  .list-toolbar select { width: 100%; }
  .table-header { display: none; }
  .directory-row { grid-template-columns: minmax(0,1fr) auto; gap: 5px 10px; padding: 12px; }
  .directory-row > .muted { grid-column: 1; padding-left: 42px; }
  .directory-row .directory-seat { grid-column: 1; margin-left: 42px; max-width: calc(100% - 42px); }
  .directory-row .row-actions { grid-column: 2; grid-row: 1 / span 3; }
  .modal form { padding: 24px 18px; }
  .modal-actions .button { flex: 1; }
  .output-preview { height: 145px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media print {
  .topbar, .planbar, .main-tabs, .toast-region { display: none !important; }
  body, .workspace-panel { background: #fff; }
}

/* Salon görünümü ve dokunma denetimleri */
.masa-scene-shell{position:relative;width:100%;height:100%;min-height:360px;overflow:hidden;border-radius:22px;background:#2a1710;color:#3c271a;box-shadow:0 18px 50px rgba(46,24,12,.24);isolation:isolate;touch-action:none}
    .masa-scene-svg{display:block;width:100%;height:100%;min-height:360px;outline:none;user-select:none;-webkit-user-select:none;touch-action:none}
    .masa-scene-svg:focus-visible{outline:4px solid #ed9b2f;outline-offset:-5px}
    .masa-table{cursor:grab;outline:none}.masa-table:active{cursor:grabbing}.masa-table:focus-visible>*{filter:drop-shadow(0 0 7px #ff9e24)}
    .masa-table.is-selected{filter:drop-shadow(0 0 8px rgba(255,169,43,.78))}
    .masa-table-name{font:700 12px/1.1 system-ui,sans-serif;fill:#39281e;paint-order:stroke;stroke:#fffdf2;stroke-width:3px;stroke-linejoin:round}
    .masa-table-count{font:800 10px/1 system-ui,sans-serif;fill:#8b4f20;paint-order:stroke;stroke:#fffaf0;stroke-width:2.5px}
    .masa-group-chip{font:800 8px/1 system-ui,sans-serif;letter-spacing:.08em;fill:#6c411b;paint-order:stroke;stroke:#fff8e8;stroke-width:2px}
    .masa-zone-label{font:800 12px/1 system-ui,sans-serif;letter-spacing:.13em;fill:#7b5c3b;paint-order:stroke;stroke:#fff7e7;stroke-width:3px}.masa-zone-label.is-stage{fill:#ffe9aa;stroke:#562821}
    .masa-toolbar{position:absolute;z-index:4;top:12px;right:12px;display:flex;gap:7px;padding:6px;border-radius:14px;background:rgba(43,25,16,.82);backdrop-filter:blur(8px);box-shadow:0 5px 18px rgba(24,11,5,.25)}
    .masa-toolbar button{min-width:38px;height:36px;border:1px solid rgba(255,255,255,.22);border-radius:9px;background:#fff8e9;color:#472b1c;font:800 14px system-ui,sans-serif;cursor:pointer}.masa-toolbar button:hover{background:#ffd993}.masa-toolbar button:focus-visible{outline:3px solid #f9ad3d;outline-offset:2px}
    .masa-selection-card{position:absolute;z-index:3;left:12px;top:12px;max-width:min(54%,390px);padding:9px 13px;border:1px solid rgba(255,255,255,.44);border-radius:13px;background:rgba(255,250,238,.91);box-shadow:0 5px 18px rgba(50,27,13,.18);backdrop-filter:blur(8px);font:700 12px/1.35 system-ui,sans-serif;pointer-events:none}
    .masa-selection-card strong{display:block;font-size:14px;color:#6c381b}.masa-selection-card span{color:#6a5548}
    .masa-drop-active{filter:drop-shadow(0 0 11px #ffad27)}
    @media(max-width:680px){.masa-scene-shell,.masa-scene-svg{min-height:320px;border-radius:15px}.masa-toolbar{top:auto;bottom:9px;right:9px}.masa-toolbar button{min-width:43px;height:42px}.masa-selection-card{top:8px;left:8px;max-width:70%;padding:7px 10px}.masa-table-name{font-size:14px}.masa-table-count{font-size:12px}}
    @media(prefers-reduced-motion:reduce){.masa-scene-shell *{scroll-behavior:auto!important;transition:none!important}}

/* On phones the tab bar is fixed to the viewport, not the sticky header. */
@media (max-width:820px){
  .topbar{backdrop-filter:none}
  .planbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 10px}
  .plan-select-wrap{min-width:0;gap:5px}
  .plan-select-wrap select{min-width:0;width:auto;flex:1}
  .planbar .button.compact,.planbar .subtle-button{white-space:nowrap}
  .view-select-wrap{grid-column:1/-1;justify-content:space-between}
  .view-select-wrap label{display:block}
  .view-select-wrap select{max-width:none;min-height:35px;flex:1}
  .scene{flex:none;min-height:0;height:auto;aspect-ratio:1.3}
  .masa-scene-shell,.masa-scene-svg{min-height:0}
  .scene[data-mode] .masa-selection-card{left:8px;right:auto;bottom:7px;max-width:calc(100% - 174px);padding:5px 7px;line-height:1.15;font-size:10px}
  .masa-selection-card strong{font-size:12px}.masa-toolbar{padding:3px;gap:3px}
  .masa-toolbar button{height:36px;min-width:36px}
  .masa-table-name{font-size:20px}.masa-table-count{font-size:14px}
}
.masa-scene-shell{background:#eee5d9;border-radius:12px;box-shadow:none}
.masa-toolbar{background:#f8f6f2e8;border:1px solid #d7cbbd;box-shadow:0 2px 7px #3c242111}
.masa-toolbar button{background:#fffcfa;color:#502c38}
.masa-table.is-selected{filter:drop-shadow(0 0 4px #815b65)}

.backup-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:16px 24px;border-bottom:1px solid var(--line)} .backup-tools strong{flex-basis:100%}
.plan-archive-tools { border-bottom: 1px solid var(--line); }
.plan-archive-tools > summary { min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 24px; cursor: pointer; color: var(--burgundy); font-weight: 800; list-style-position: inside; }
.plan-archive-tools > summary small { color: var(--muted); font-size: 9px; font-weight: 650; }
.plan-archive-body { display: grid; gap: 11px; padding: 0 24px 18px; }
.archive-current-plan { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3px 10px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper-strong); }
.archive-current-plan > span { color: var(--muted); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.archive-current-plan > strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archive-current-plan > button { grid-column: 2; grid-row: 1 / span 2; }
.archived-plan-list { display: grid; gap: 6px; }
.archived-plan-list .empty-list { padding: 14px; }
.archived-plan-row { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: #f8f2e9; }
.archived-plan-row > span { min-width: 0; display: grid; }
.archived-plan-row strong, .archived-plan-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archived-plan-row small { color: var(--muted); font-size: 8px; }
@media(max-width:560px){.plan-archive-tools>summary,.plan-archive-body{padding-inline:16px}.archive-current-plan{grid-template-columns:minmax(0,1fr)}.archive-current-plan>button{grid-column:1;grid-row:auto;width:100%}.archived-plan-row{align-items:stretch;flex-direction:column}.archived-plan-row button{width:100%}}
.touch-guest-grip, .guest-touch-tip { display: none; }
.touch-guest-chip {
  position: fixed; z-index: 200; pointer-events: none;
  transform: translate(-50%, calc(-100% - 14px)); max-width: min(66vw, 230px);
  padding: 8px 12px; border-radius: 10px; background: var(--burgundy); color: white;
  font: 650 13px/1.3 var(--sans); text-align: center; box-shadow: 0 3px 12px #35242b35;
}
.guest-dragging .mobile-sheet, .guest-dragging .sheet-backdrop,
.guest-dragging .masa-toolbar, .guest-dragging .mobile-inspector-fab { pointer-events: none; }
.guest-dragging .masa-table.masa-drop-active {
  filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 9px #873d58);
}
.guest-dragging .masa-drop-active .masa-table-name { fill: #702f49; stroke: #fff; }
@media (any-pointer: coarse), (max-width: 820px) {
  .guest-touch-tip { display: block; margin: 6px 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
  .directory-touch-tip { margin: 0; padding: 12px 16px 0; }
  .guest-chip { grid-template-columns: auto minmax(0, 1fr) auto auto; }
  .guest-chip .touch-guest-grip, .row-actions .touch-guest-grip {
    display: inline-flex; width: auto; min-width: 54px; min-height: 44px; align-items: center; justify-content: center; gap: 3px;
    padding: 4px 8px; border-radius: 8px; background: var(--burgundy-soft); color: var(--burgundy);
    font-size: 11px; font-weight: 700; touch-action: none; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none;
  }
  .guest-chip > span { min-width: 0; }
  .directory-row, .table-header { grid-template-columns: minmax(150px, 1.3fr) minmax(96px, .8fr) minmax(80px, .8fr) auto; }
}
@media (max-width: 560px) {
  .directory-row { grid-template-columns: minmax(0, 1fr) auto; }
  .directory-row .row-actions { display: grid; grid-template-columns: repeat(3, 29px); }
  .row-actions .touch-guest-grip { grid-column: 1 / -1; grid-row: 1; }
}

/* Gece Işığı — onaylı salon arayüzü */
.topbar {
  border-bottom-color: rgba(255,255,255,.12);
  color:#fff8ef;
  background:#4b2030;
  box-shadow:0 5px 20px rgba(55,24,36,.12);
}
.brand-monogram { border-color:#c9a76c; color:#fff8ef; }
.brand-monogram span, .brand strong, .brand small { color:#fff8ef; }
.main-tabs { align-items:center; gap:14px; }
.tab { height:38px; padding:0 24px; border-radius:24px; color:rgba(255,248,239,.78); }
.tab::after { display:none; }
.tab:hover, .tab.active { color:#fff; background:rgba(255,255,255,.13); }
.topbar .save-status { color:rgba(255,248,239,.72); }
.topbar .icon-button { border-color:rgba(255,255,255,.3); color:#fff8ef; background:transparent; }
.topbar .avatar { color:#4b2030; background:#f7e9d7; }
.planbar { border-color:#e5d8c7; background:#fbf8f2; }
.salon-panel { background:#f6f1e9; }
.salon-hero { display:none; }
.panel { background:#fffdf9; }
.venue-column { background:#f8f5ef; }
.palette-item { min-height:112px; border-color:#dfd1bc; background:#fbf5ea; }
.palette-item:hover { border-color:#b88c4f; background:#fffaf0; box-shadow:0 8px 20px rgba(79,42,25,.09); }
.palette-item strong { color:#3f2d29; }
.palette-item small { letter-spacing:.06em; }
.stage-label-button {
  width:100%; display:flex; align-items:center; gap:11px; margin-top:14px; padding:11px 12px;
  border:1px solid #d8c6a8; border-radius:10px; color:#4b2030; background:linear-gradient(135deg,#fffaf1,#f5eadb);
  text-align:left; box-shadow:0 5px 16px rgba(86,53,29,.06);
}
.stage-label-button > span:first-child { width:30px; height:30px; display:grid; place-items:center; flex:0 0 auto; border:1px solid #c6a467; border-radius:50%; color:#a6793e; background:#fffdf8; }
.stage-label-button > span:last-child { min-width:0; }
.stage-label-button strong, .stage-label-button small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stage-label-button strong { font-size:11px; }
.stage-label-button small { margin-top:2px; color:#8b744e; font:italic 14px/1.1 var(--serif); }
.selected-table-preview { height:118px; display:grid; place-items:center; margin:10px 0 3px; border:1px solid #e6d9c8; border-radius:12px; background:linear-gradient(150deg,#f8efe2,#fffdf8); overflow:hidden; }
.selected-table-preview > :is(img, svg) { display:block; max-width:82%; max-height:96px; object-fit:contain; filter:drop-shadow(0 7px 7px rgba(57,30,17,.2)); }
.selected-table-preview img.is-rect { width:132px; }
.stage-label-dialog .field-hint { margin:-2px 0 13px; line-height:1.45; }
.stage-label-dialog input { font:600 19px var(--serif); }
.scene[data-mode="plan"]:has(.masa-table-art) .masa-table-name,
.scene[data-mode="plan"]:has(.masa-table-art) .masa-table-count,
.scene[data-mode="plan"]:has(.masa-table-art) .masa-group-chip {
  fill:#fff8e9; stroke:#402719; stroke-width:3.25px; stroke-linejoin:round;
  paint-order:stroke; font-family:var(--sans);
}
.scene[data-mode="plan"] .masa-room-zone { stroke:#fff9ed; stroke-width:.65px; }
.scene[data-mode="plan"] .masa-room-zone-caption { stroke:none; fill:#806039; }
.scene { border-color:#d9c6a9; background:#eee5d9; box-shadow:0 12px 36px rgba(67,43,26,.1); }
.venue-toolbar h1 { color:#352725; font-weight:500; }
.stat-item { border-color:#e4d7c5; background:#fffdf8; }
.stat-item strong { color:#4b2030; }

@media (min-width:821px) {
  .salon-panel { grid-template-columns:clamp(188px,13vw,218px) minmax(0,1fr) clamp(250px,18vw,286px); }
  .salon-panel > .panel { min-width:0; }
  .venue-column { padding-inline:15px; }
  .salon-panel .scene[data-mode="plan"] { width:100%; min-width:0; }
  .palette-panel, .inspector-panel { scrollbar-color:#c9b59a transparent; }
}

@media (min-width:1100px) {
  .salon-panel { grid-template-rows:auto auto; align-items:stretch; }
  .salon-hero {
    grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:36px;
    min-height:112px; padding:20px 32px 17px; border-bottom:1px solid #dfd1be; background:#fbf8f2;
  }
  .salon-hero-title h1 { margin:0; color:#352725; font-size:44px; font-weight:500; }
  .salon-hero-title .eyebrow { margin-bottom:10px; }
  .salon-hero-stats { display:grid; grid-template-columns:repeat(3,minmax(120px,1fr)); min-width:430px; }
  .salon-hero-stats > div { min-height:55px; display:grid; align-content:center; padding:0 22px; border-left:1px solid #dfd1be; }
  .salon-hero-stats strong { color:#3b2928; font:500 28px/1 var(--serif); }
  .salon-hero-stats span { margin-top:7px; color:#83746b; font-size:10px; }
  #hero-access-status[data-open="false"] { color:#6d2f44; }
  #hero-access-status[data-open="true"] { color:#667a5e; }
  .salon-panel > :is(.palette-panel,.venue-column,.inspector-panel) { grid-row:2; }
  .salon-panel:has(.scene[data-mode="plan"]) > .panel,
  .salon-panel > .venue-column { position:relative; top:auto; max-height:none; }
  .venue-column:has(.scene[data-mode="plan"]) .venue-overview { padding-bottom:5px; }
  .venue-column:has(.scene[data-mode="plan"]) .venue-toolbar { flex:1 1 auto; min-height:43px; align-items:center; }
  .venue-toolbar h1 { font-size:26px; }
  .venue-toolbar .eyebrow { margin-bottom:3px; font-size:8px; }
  .venue-title > p:last-child { font-size:8px; }
  .venue-stats, .inspector-stats { display:none; }
  .salon-tools { margin-bottom:6px; }
  .salon-tools .button { min-height:32px; padding-block:5px; }
}

@media (max-width:820px) {
  .main-tabs { align-items:stretch; gap:0; background:rgba(255,254,252,.98); }
  .tab { height:auto; padding:0 3px; border-radius:0; color:var(--muted); }
  .tab:hover { color:var(--burgundy); background:#f7efe7; }
  .tab.active { color:var(--burgundy); background:#f3e5df; box-shadow:inset 0 3px 0 var(--burgundy); }
  .topbar .brand > span:last-child { display:none; }
  .palette-item { min-height:104px; }
  .selected-table-preview { height:104px; }
}

/* Şematik 3B görünümler, üstten planla aynı çalışma kadrajını kullanır. */
@media (min-width:821px) {
  .salon-panel .scene:is([data-mode="plan"],[data-mode="3d-a"],[data-mode="3d-b"]) {
    width:100%; height:auto; min-height:0; aspect-ratio:1000 / 650;
  }
  .scene:is([data-mode="plan"],[data-mode="3d-a"],[data-mode="3d-b"]) .masa-scene-shell {
    position:absolute; inset:0; min-height:0;
  }
  .scene:is([data-mode="plan"],[data-mode="3d-a"],[data-mode="3d-b"]) .masa-scene-svg { min-height:0; }
  .salon-panel > .venue-column:has(.scene:is([data-mode="3d-a"],[data-mode="3d-b"])) {
    position:relative; top:auto;
  }
}

@media (max-width:820px) {
  .scene:is([data-mode="plan"],[data-mode="3d-a"],[data-mode="3d-b"]) {
    height:auto; min-height:0; aspect-ratio:1000 / 650;
  }
  .scene:is([data-mode="plan"],[data-mode="3d-a"],[data-mode="3d-b"]) :is(.masa-scene-shell,.masa-scene-svg) { min-height:0; }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) .masa-toolbar { top:auto; right:6px; bottom:6px; }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) .masa-selection-card {
    top:auto; right:auto; bottom:6px; left:6px; max-width:calc(100% - 166px);
  }
  /* Keep the entire room visible on a small screen, including the entrance. */
  .salon-panel:has(.scene:is([data-mode="3d-a"],[data-mode="3d-b"])) {
    height:auto; overflow:visible; padding-bottom:calc(112px + env(safe-area-inset-bottom));
  }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) { aspect-ratio:auto; }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) .masa-scene-shell {
    display:grid; height:auto; grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"salon salon" "selection zoom"; align-items:center; background:#faf5ec;
  }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) .masa-scene-svg {
    grid-area:salon; height:auto; aspect-ratio:1000 / 650; border-radius:0;
  }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) .masa-toolbar {
    position:static; grid-area:zoom; margin:4px; border:0; box-shadow:none;
  }
  .scene:is([data-mode="3d-a"],[data-mode="3d-b"]) .masa-selection-card {
    position:static; grid-area:selection; max-width:none; min-width:0;
    border:0; border-radius:0; box-shadow:none; background:none; backdrop-filter:none;
  }
}