:root {
  --multispa-ink: #12312e;
  --multispa-muted: #607572;
  --multispa-line: #d9e5e3;
  --multispa-wash: #f3f8f7;
  --multispa-teal: #08766d;
  --multispa-blue: #2563eb;
  --multispa-amber: #b45309;
  --multispa-rose: #be123c;
  --multispa-violet: #7c3aed;
}

.page-multispa { max-width: 100%; overflow-x: clip; }
.page-multispa .main-shell { width: min(100%, 1440px); min-width: 0; max-width: 100%; padding-inline: clamp(14px, 2.5vw, 36px); }
.multispa-page { display: grid; min-width: 0; max-width: 100%; gap: 22px; color: var(--multispa-ink); }
.multispa-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; padding: clamp(22px, 4vw, 42px); border: 1px solid #cfe3df; border-radius: 24px; background: linear-gradient(135deg, #e9f7f4 0%, #f9fcfb 58%, #edf5ff 100%); box-shadow: 0 18px 50px rgba(19, 78, 74, .08); }
.multispa-hero h1 { margin: 0; max-width: 760px; font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1.02; letter-spacing: -.045em; }
.multispa-hero p { max-width: 760px; margin: 12px 0 0; color: var(--multispa-muted); font-size: clamp(1rem, 1.6vw, 1.18rem); line-height: 1.65; }
.multispa-freshness { min-width: 190px; padding: 16px 18px; border-left: 3px solid var(--multispa-teal); background: rgba(255,255,255,.72); }
.multispa-freshness span, .multispa-freshness small { display: block; color: var(--multispa-muted); font-size: .8rem; }
.multispa-freshness strong { display: block; margin: 5px 0; }
.multispa-panel { min-width: 0; max-width: 100%; padding: clamp(18px, 2.6vw, 30px); border: 1px solid var(--multispa-line); border-radius: 20px; background: #fff; box-shadow: 0 10px 35px rgba(23, 60, 56, .05); }
.multispa-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.multispa-section-head h2 { margin: 0; font-size: clamp(1.3rem, 2vw, 1.8rem); letter-spacing: -.02em; }
.multispa-section-head p { margin: 6px 0 0; color: var(--multispa-muted); line-height: 1.55; }
.multispa-status { display: inline-flex; align-items: center; min-height: 28px; padding: 4px 9px; border-radius: 999px; font-size: .78rem; font-weight: 800; white-space: nowrap; }
.multispa-status--safe, .multispa-status--active { color: #066158; background: #dcf6ef; }
.multispa-status--scheduled { color: #1d4ed8; background: #dbeafe; }
.multispa-status--expired, .multispa-status--superseded { color: #596a67; background: #edf1f0; }
.multispa-status--revoked { color: #9f1239; background: #ffe4e6; }

.multispa-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.multispa-form label, .multispa-filter label { display: grid; gap: 7px; min-width: 0; color: #2d4743; font-size: .88rem; font-weight: 750; }
.multispa-form__wide { grid-column: 1 / -1; }
.multispa-form__actions { display: flex; justify-content: flex-end; }
.multispa-form--compact { margin-top: 12px; padding: 16px; border-radius: 14px; background: var(--multispa-wash); }
.multispa-filter { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; align-items: end; gap: 12px; margin-bottom: 20px; }
.multispa-form :is(input, select, textarea), .multispa-filter :is(input, select) { border-color: #cbdcd9; border-radius: 10px; background: #fbfdfd; }
.multispa-form :is(input, select, textarea):focus-visible, .multispa-filter :is(input, select):focus-visible, .page-multispa :is(a, button, summary):focus-visible, .branch-switcher :is(select, button):focus-visible { outline: 3px solid rgba(8,118,109,.28); outline-offset: 2px; }
.multispa-empty { padding: 30px; text-align: center; color: var(--multispa-muted); border: 1px dashed #bdd2ce; border-radius: 15px; background: var(--multispa-wash); }
.multispa-empty p { margin: 7px 0 0; }

.multispa-grant-list { display: grid; gap: 12px; }
.multispa-grant { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; padding: 18px; border: 1px solid var(--multispa-line); border-radius: 16px; }
.multispa-grant h3 { margin: 8px 0 4px; font-size: 1.08rem; }
.multispa-grant code, .multispa-table code { color: #075e57; font-size: .8rem; word-break: break-word; }
.multispa-grant dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 16px 0 0; }
.multispa-grant dl div { min-width: 0; }
.multispa-grant dt { color: var(--multispa-muted); font-size: .75rem; }
.multispa-grant dd { margin: 3px 0 0; font-weight: 750; overflow-wrap: anywhere; }
.multispa-grant__reason { margin: 14px 0 0; color: var(--multispa-muted); }
.multispa-grant__actions { display: flex; align-items: flex-start; gap: 8px; }
.multispa-grant__actions details { min-width: 130px; }
.multispa-grant__actions summary { list-style: none; min-height: 44px; cursor: pointer; }
.multispa-grant__actions summary::-webkit-details-marker { display: none; }

.multispa-table-wrap { min-width: 0; max-width: 100%; overflow-x: auto; border: 1px solid var(--multispa-line); border-radius: 14px; }
.multispa-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.multispa-table th, .multispa-table td { padding: 13px 14px; text-align: left; vertical-align: middle; border-bottom: 1px solid #e7efed; }
.multispa-table th { color: #46625e; background: #f4f8f7; font-size: .78rem; letter-spacing: .02em; text-transform: uppercase; }
.multispa-table tr:last-child td { border-bottom: 0; }
.multispa-table tr.is-inactive { color: #71807e; background: #fafbfb; }

.operations-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.operations-card { min-height: 196px; padding: 20px; border: 1px solid var(--multispa-line); border-top: 4px solid var(--multispa-teal); border-radius: 16px; background: #fff; box-shadow: 0 8px 25px rgba(23,60,56,.055); }
.operations-card--blue { border-top-color: var(--multispa-blue); }
.operations-card--amber { border-top-color: var(--multispa-amber); }
.operations-card--rose { border-top-color: var(--multispa-rose); }
.operations-card--violet { border-top-color: var(--multispa-violet); }
.operations-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.operations-card h2 { margin: 0; font-size: 1rem; }
.operations-card__head span { color: var(--multispa-muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.operations-card__value { display: block; margin-top: 24px; font-size: clamp(2rem, 4vw, 3rem); line-height: 1; letter-spacing: -.04em; }
.operations-card__money { margin: 8px 0 0; color: var(--multispa-teal); font-size: 1.15rem; font-weight: 800; }
.operations-card > p:last-child { margin: 14px 0 0; color: var(--multispa-muted); line-height: 1.45; }
.multispa-actions { display: flex; flex-wrap: wrap; gap: 10px; }

.tower-totals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--multispa-line); border-radius: 18px; overflow: hidden; background: #fff; }
.tower-totals article { min-width: 0; padding: 22px; border-right: 1px solid var(--multispa-line); }
.tower-totals article:last-child { border-right: 0; }
.tower-totals span, .tower-totals small { display: block; color: var(--multispa-muted); }
.tower-totals strong { display: block; margin: 10px 0 6px; font-size: clamp(1.4rem, 2.5vw, 2.2rem); letter-spacing: -.035em; overflow-wrap: anywhere; }
.tower-exceptions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tower-exceptions a { display: grid; gap: 8px; min-height: 132px; padding: 16px; color: var(--multispa-ink); border: 1px solid var(--multispa-line); border-radius: 14px; }
.tower-exceptions a:hover { border-color: var(--multispa-teal); text-decoration: none; }
.tower-exceptions strong { font-size: 1.8rem; }
.tower-exceptions small { color: var(--multispa-muted); }
.tower-table td:first-child { min-width: 190px; }
.tower-table td:first-child strong { display: block; margin-bottom: 7px; }
.multispa-inline-context { display: flex; align-items: center; gap: 12px; }

.branch-switcher { display: flex; align-items: end; gap: 8px; margin-left: auto; }
.branch-switcher label { display: grid; gap: 3px; color: #526764; font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.branch-switcher select { width: min(27vw, 260px); min-height: 44px; padding: 7px 34px 7px 10px; border-radius: 10px; font-size: .85rem; }
.branch-switcher button { min-height: 44px; padding: 8px 12px; color: #fff; border: 0; border-radius: 10px; background: var(--multispa-teal); font: 750 .84rem/1 system-ui, sans-serif; cursor: pointer; }
.branch-switcher button:disabled { cursor: wait; opacity: .65; }
.branch-switcher__status { position: absolute; top: 100%; color: #b91c1c; font-size: .75rem; }
.multispa-header-links { display: flex; align-items: center; gap: 4px; }
.multispa-header-links a { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 10px; color: #34524e; border-radius: 9px; font-size: .82rem; font-weight: 750; }
.multispa-header-links a:hover, .multispa-header-links a.is-active { color: #075e57; background: #e4f3f0; text-decoration: none; }

@media (max-width: 1120px) {
  .operations-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .multispa-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .multispa-filter > button { align-self: end; }
  .app-header { flex-wrap: wrap; }
  .branch-switcher { order: 4; flex: 1 1 100%; margin-left: 0; }
  .branch-switcher label { flex: 1; }
  .branch-switcher select { width: 100%; }
}

@media (max-width: 760px) {
  html, body.page-multispa { max-width: 100%; overflow-x: hidden; }
  .page-multispa .app-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas:
      "brand notification logout"
      "links links links"
      "switch switch switch";
    width: 100%;
    max-width: 100%;
    align-items: center;
    gap: 8px;
  }
  .page-multispa .app-header > .brand { grid-area: brand; min-width: 0; max-width: 100%; }
  .page-multispa .app-header > #notification-center-link { grid-area: notification; }
  .page-multispa .app-header > .header-logout,
  .page-multispa .app-header > .logout-form { grid-area: logout; }
  .page-multispa .multispa-header-links {
    grid-area: links;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
  }
  .page-multispa .branch-switcher {
    grid-area: switch;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
  }
  .page-multispa .branch-switcher label { flex: 1 1 0; min-width: 0; }
  .page-multispa .branch-switcher select { width: 100%; max-width: 100%; }
  .page-multispa .multispa-hero h1 {
    max-width: 100%;
    font-size: clamp(2rem, 9vw, 2.5rem);
    overflow-wrap: anywhere;
  }
  .page-multispa .multispa-hero p { max-width: 100%; overflow-wrap: anywhere; }
  .page-multispa .mobile-bottom-nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .page-multispa .mobile-bottom-nav a {
    min-width: 0;
    padding-inline: 4px;
    text-align: center;
    overflow-wrap: anywhere;
  }
  .page-multispa .main-shell { padding: 14px 12px calc(116px + env(safe-area-inset-bottom)); }
  .multispa-page { gap: 14px; }
  .multispa-hero { display: grid; align-items: start; padding: 22px 18px; border-radius: 18px; }
  .multispa-hero h1 { font-size: clamp(2rem, 10vw, 3rem); }
  .multispa-freshness { width: 100%; min-width: 0; }
  .multispa-panel { padding: 17px 14px; border-radius: 16px; }
  .multispa-section-head { display: grid; }
  .multispa-form, .multispa-filter, .operations-grid, .tower-totals, .tower-exceptions { grid-template-columns: 1fr; }
  .multispa-form__wide { grid-column: auto; }
  .multispa-form__actions { justify-content: stretch; }
  .multispa-form__actions button { width: 100%; }
  .multispa-grant { grid-template-columns: 1fr; }
  .multispa-grant dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .multispa-grant__actions { display: grid; }
  .multispa-grant, .multispa-grant__main, .multispa-grant__actions, .multispa-grant__actions details, .multispa-form--compact { min-width: 0; max-width: 100%; }
  .multispa-grant__actions details, .multispa-grant__actions summary { width: 100%; }
  .tower-totals article { border-right: 0; border-bottom: 1px solid var(--multispa-line); }
  .tower-totals article:last-child { border-bottom: 0; }
  .operations-card { min-height: 168px; }
  .branch-switcher { min-width: 0; max-width: 100%; align-items: end; gap: 6px; }
  .branch-switcher label { min-width: 0; }
  .branch-switcher button { min-width: 76px; min-height: 44px; }
  .branch-switcher select { min-height: 44px; }
  .multispa-header-links { width: 100%; overflow-x: auto; }
  .multispa-header-links a { min-height: 44px; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  .page-multispa *, .branch-switcher * { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Gate 22 · bounded multibranch operations */
.branch-operations-table{display:grid;gap:12px}.branch-operations-table article{display:grid;grid-template-columns:minmax(180px,1fr) 2fr;gap:16px;align-items:center;padding:14px 16px;border:1px solid var(--border-soft,#dde4ef);border-radius:16px;background:rgba(255,255,255,.78)}.branch-operations-table small{display:block;color:var(--text-muted,#667085);margin-top:3px}.branch-operations-table dl{display:grid;grid-template-columns:repeat(5,minmax(70px,1fr));gap:8px;margin:0}.branch-operations-table dl div{padding:8px;border-radius:10px;background:rgba(99,72,255,.06);text-align:center}.branch-operations-table dt{font-size:12px;color:var(--text-muted,#667085)}.branch-operations-table dd{font-weight:800;margin:3px 0 0}.branch-template-action{margin-top:12px}.branch-template-action form{display:grid;gap:10px;margin-top:10px;padding:12px;border:1px solid var(--border-soft,#dde4ef);border-radius:14px}.branch-template-action p{font-size:12px;color:var(--text-muted,#667085)}@media(max-width:760px){.branch-operations-table article{grid-template-columns:1fr}.branch-operations-table dl{grid-template-columns:repeat(3,1fr)}}