/* ============================================================
   ACTIVA ADMIN — the real thing.
   Palette is the Activa styleguide, nothing else.
   coral #FFAD8F · coral-deep #FA9575 · coral-soft #FFEAE1
   cacao #401505 · cacao-soft #521E09 · paper #FFFCFA · ink #454745
   No green. Ever.
   ============================================================ */
:root{
  --coral:#FFAD8F;
  --coral-deep:#FA9575;
  --coral-soft:#FFEAE1;
  --coral-wash:#FFF4EE;
  --cacao:#401505;
  --cacao-soft:#521E09;
  --paper:#FFFCFA;
  --white:#FFFFFF;
  --ink:#454745;
  --line:rgba(64,21,5,.12);
  --line-strong:rgba(64,21,5,.22);
  --surface:#FFFFFF;
  --surface-subdued:#FBF6F3;
  --surface-hover:#FDF8F5;
  --surface-pressed:#F8EFE9;
  --ink-subdued:#8A6F60;
  --ink-faint:#B39F93;

  /* functional tones — warm register only, no green */
  --tone-live-bg:#FFEAE1;   --tone-live-dot:#FA9575; --tone-live-text:#401505;
  --tone-warn-bg:#FBEBD2;   --tone-warn-dot:#B07A17; --tone-warn-text:#5C3D00;
  --tone-stop-bg:#F7DED6;   --tone-stop-dot:#B3402A; --tone-stop-text:#66210F;
  --tone-quiet-bg:#F1E9E4;  --tone-quiet-dot:#A08B7E; --tone-quiet-text:#5E4A3D;

  --radius-card:14px;
  --radius-ctl:9px;
  --shadow-card:0 1px 0 rgba(64,21,5,.04), 0 1px 3px rgba(64,21,5,.06);
  --shadow-pop:0 4px 14px rgba(64,21,5,.10), 0 18px 44px rgba(64,21,5,.14);
  --font-ui:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-display:'Bricolage Grotesque','Inter',sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:16px}
body{
  font-family:var(--font-ui);font-size:13px;line-height:1.45;
  color:var(--ink);background:var(--paper);
  -webkit-font-smoothing:antialiased;overflow:hidden;
}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;color:inherit;font-size:13px}
a{color:var(--cacao)}
::selection{background:var(--coral-soft);color:var(--cacao)}
:focus-visible{outline:2px solid var(--coral-deep);outline-offset:2px;border-radius:6px}
[hidden]{display:none !important}

/* ============ wordmark ============ */
.wm{font-family:var(--font-display);font-weight:800;letter-spacing:-.02em;
  color:var(--cacao);display:inline-flex;align-items:baseline;line-height:1;user-select:none}
.wm .d{width:.30em;height:.30em;border-radius:50%;background:var(--coral);
  display:inline-block;margin-left:.11em;flex:none}

/* ============ SIGN IN ============ */
.gate{position:fixed;inset:0;display:grid;place-items:center;background:var(--paper);padding:24px;z-index:200}
.gate-card{width:min(400px,100%);background:var(--surface);border:1px solid var(--line);
  border-radius:24px;box-shadow:var(--shadow-pop);padding:36px 32px 30px}
.gate-card .wm{font-size:34px;margin-bottom:6px}
.gate-lede{color:var(--ink-subdued);margin-bottom:26px;font-size:13.5px}
.gate form{display:grid;gap:14px}
.gate label{font-size:12px;font-weight:600;color:var(--cacao);display:block;margin-bottom:5px}
.gate input{width:100%;height:42px;padding:0 13px;border:1px solid var(--line-strong);
  border-radius:var(--radius-ctl);background:var(--white);transition:border-color .15s,box-shadow .15s}
.gate input:focus{outline:none;border-color:var(--coral-deep);box-shadow:0 0 0 3px var(--coral-soft)}
.gate .btn{width:100%;height:44px;font-size:14px;justify-content:center}
.gate-err{background:var(--tone-stop-bg);color:var(--tone-stop-text);border-radius:var(--radius-ctl);
  padding:10px 12px;font-size:12.5px;font-weight:500}
.gate-err.ok{background:var(--tone-live-bg, #e7f5ec);color:var(--tone-live-text, #1d6b3a)}
.gate-alt{margin-top:12px;text-align:center}
.gate-foot{margin-top:22px;padding-top:18px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--ink-faint);line-height:1.6}

/* ============ ORG PICKER ============ */
.orglist{display:grid;gap:8px;margin-top:8px}
.orgrow{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:13px 14px;
  border:1px solid var(--line);border-radius:var(--radius-card);background:var(--white);
  transition:border-color .15s,background .15s}
.orgrow:hover{border-color:var(--coral);background:var(--coral-wash)}
.orgrow b{font-size:13.5px;display:block;color:var(--cacao)}
.orgrow small{color:var(--ink-subdued)}

/* ============ APP FRAME ============ */
.frame{display:grid;grid-template-rows:56px 1fr;grid-template-columns:236px 1fr;height:100vh;
  grid-template-areas:"top top" "side main";transition:grid-template-columns .25s var(--ease)}
.frame.rail{grid-template-columns:66px 1fr}

.topbar{grid-area:top;display:flex;align-items:center;gap:14px;padding:0 16px;
  background:var(--paper);border-bottom:1px solid var(--line);z-index:40}
.topbar .wm{font-size:22px;width:206px;flex:none}
.frame.rail .topbar .wm{width:36px;overflow:hidden}
.ctx{display:flex;align-items:center;gap:9px;padding:5px 12px 5px 6px;border-radius:999px;
  background:var(--surface-subdued);border:1px solid var(--line)}
.ctx-mark{width:26px;height:26px;border-radius:50%;background:var(--cacao);color:var(--coral);
  display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:10px;flex:none}
.ctx b{font-size:12.5px;font-weight:600;color:var(--cacao)}
.ctx small{font-size:11px;color:var(--ink-subdued);margin-left:2px}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.who{font-size:12px;color:var(--ink-subdued);font-weight:500}
/* B07: the remembered venue in the top bar. */
.venuepref{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-subdued);font-weight:600}
.venuepref select{height:30px;padding:0 8px;border:1px solid var(--line-strong);border-radius:8px;background:var(--white);
  color:var(--cacao);font:600 12px var(--font-ui);max-width:180px}
.venuepref select:disabled{opacity:1;background:var(--surface)}
@media (max-width:760px){.venuepref span,.who{display:none}.venuepref select{max-width:34vw}}
@media (max-width:600px){.venuepref select{max-width:96px}}
.iconbtn{width:34px;height:34px;border-radius:var(--radius-ctl);display:grid;place-items:center;
  color:var(--ink-subdued);transition:background .15s,color .15s}
.iconbtn:hover{background:var(--surface-pressed);color:var(--cacao)}

/* ---- sidebar ---- */
.side{grid-area:side;display:flex;flex-direction:column;padding:12px 8px;
  border-right:1px solid var(--line);background:var(--paper);overflow-y:auto}
.navitem{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:var(--radius-ctl);
  font-weight:500;font-size:13px;color:var(--ink-subdued);width:100%;text-align:left;
  position:relative;transition:background .15s,color .15s;margin-bottom:1px}
.navitem:hover{background:var(--surface-hover);color:var(--cacao)}
.navitem.active{background:var(--coral-soft);color:var(--cacao);font-weight:600}
.navitem.active::before{content:"";position:absolute;left:-8px;top:6px;bottom:6px;width:3px;
  border-radius:0 3px 3px 0;background:var(--coral-deep)}
.navitem svg{flex:none;opacity:.8}
.navitem.active svg{opacity:1}
.navitem .count{margin-left:auto;font-size:11px;font-weight:600;color:var(--ink-subdued);
  background:var(--surface-pressed);border-radius:10px;padding:1px 7px}
.navitem.active .count{background:var(--white)}
.navsep{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-faint);padding:16px 10px 6px}
.navspacer{flex:1}

/* --- collapsible module menus --- */
.navgroup{display:flex;flex-direction:column}
.navbranch{width:100%;background:none;border:0;font:inherit;text-align:left;cursor:pointer}
.navbranch .navlabel{flex:1}
.navchevron{transition:transform .16s ease;opacity:.55}
.navbranch.open .navchevron{transform:rotate(90deg)}
.navkids{display:flex;flex-direction:column;gap:1px;margin:1px 0 3px}
.navchild{padding-left:16px;font-size:13px}
/* The dot column keeps children optically aligned under the parent's label
   rather than under its icon. */
.navdot{flex:none;width:17px;display:flex;justify-content:center}
.navdot::before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.35}
.navchild.active .navdot::before{opacity:1}
.navexternal svg:last-child{margin-left:auto;opacity:.5}
.navexternal:hover svg:last-child{opacity:.9}

/* Collapsed rail: children would be unreadable at 66px, so a branch behaves as
   a single icon and the menu reopens when the rail does. */
.frame.rail .navkids{display:none}
.frame.rail .navchevron{display:none}
.frame.rail .navexternal svg:last-child{display:none}
.frame.rail .navlabel{display:none}
.frame.rail .navitem{justify-content:center;padding:9px 0;font-size:0;gap:0}
.frame.rail .navitem .count{display:none}
.frame.rail .navsep{font-size:0;padding:8px 0;border-top:1px solid var(--line);margin:8px 6px 0}
.frame.rail .navitem svg{font-size:13px}

/* ---- main ---- */
.main{grid-area:main;overflow-y:auto;background:var(--surface-subdued);position:relative}
.page{max-width:1180px;margin:0 auto;padding:24px 28px 90px}
/* Navigating: the page being left stays put (dimmed after a beat, inert) until
   the next page's header is ready, so the main area never flashes blank. */
.page.leaving{opacity:.55;pointer-events:none;transition:opacity .2s ease .12s}
.page-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px 16px;margin-bottom:20px}
/* The title block keeps a readable measure; when the controls cannot fit beside
   it they wrap onto their own row below instead of squeezing the subtitle. The
   cap is wide enough for the longest subtitle (Settlement, ~76ch) to sit on one
   line once it has the row to itself; text-wrap:pretty keeps a lone word off
   the last line where it still has to wrap. */
.page-header>div:first-child{flex:1 1 360px;min-width:0}
.page-sub{max-width:96ch;text-wrap:pretty}
.page-title{font-family:var(--font-display);font-weight:800;font-size:25px;letter-spacing:-.025em;
  line-height:1.12;color:var(--cacao)}
.page-sub{color:var(--ink-subdued);margin-top:4px;font-size:13px}
.header-actions{display:flex;gap:8px;flex:none;padding-top:3px}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 15px;
  border-radius:999px;font-weight:600;font-size:13px;border:1px solid transparent;
  transition:background .15s,color .15s,border-color .15s,transform .12s,box-shadow .15s;white-space:nowrap}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.5;cursor:default;transform:none}
.btn-primary{background:var(--coral);color:var(--cacao)}
.btn-primary:hover:not(:disabled){background:var(--coral-deep);box-shadow:0 8px 18px -10px rgba(64,21,5,.5)}
.btn-dark{background:var(--cacao);color:var(--paper)}
.btn-dark:hover:not(:disabled){background:var(--cacao-soft)}
.btn-secondary{background:var(--surface);border-color:var(--line-strong);color:var(--cacao)}
.btn-secondary:hover:not(:disabled){background:var(--surface-hover);border-color:var(--cacao)}
.btn-plain{color:var(--ink-subdued);font-weight:600;height:auto;padding:3px 6px;border-radius:6px}
.btn-plain:hover{color:var(--cacao);background:var(--surface-pressed)}
.btn-sm{height:28px;padding:0 11px;font-size:12px}
.btn-danger{background:var(--tone-stop-bg);color:var(--tone-stop-text)}
.btn-danger:hover:not(:disabled){background:#F0CEC3}

/* ---- cards ---- */
.card{background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);
  border:1px solid var(--line);margin-bottom:16px;overflow:hidden}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:15px 18px;border-bottom:1px solid var(--line)}
.card-head h2{font-size:13.5px;font-weight:700;color:var(--cacao)}
.card-head .sub{font-size:11.5px;color:var(--ink-subdued);font-weight:500;margin-top:1px}
.card-body{padding:16px 18px}
.card-body.flush{padding:0}

/* ---- metrics ---- */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
@media (max-width:1000px){.metrics{grid-template-columns:repeat(2,1fr)}}
/* A fifth tile (Transactions' provider fees, I2) joins the row instead of
   wrapping alone onto a second one. */
@media (min-width:1001px){.metrics:has(> .metric:nth-child(5)){grid-template-columns:repeat(5,1fr)}}
/* A phone: one tile per row, so a money figure never pushes the page sideways. */
@media (max-width:560px){.metrics{grid-template-columns:1fr}}
.metric{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);
  box-shadow:var(--shadow-card);padding:15px 17px}
.metric-label{font-size:11.5px;font-weight:600;color:var(--ink-subdued);
  letter-spacing:.02em;display:flex;align-items:center;gap:6px}
.metric-value{font-family:var(--font-display);font-weight:800;font-size:29px;letter-spacing:-.03em;
  margin:7px 0 2px;color:var(--cacao);font-variant-numeric:tabular-nums;line-height:1}
.metric-foot{font-size:11.5px;color:var(--ink-subdued);font-weight:500}
.metric-foot b{color:var(--cacao);font-weight:700}

.cols{display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start}
@media (max-width:1000px){.cols{grid-template-columns:1fr}}

/* ---- tables ---- */
.tablewrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
thead th{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink-subdued);text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);
  white-space:nowrap;user-select:none;background:var(--surface)}
thead th:first-child,tbody td:first-child{padding-left:18px}
thead th:last-child,tbody td:last-child{padding-right:18px}
tbody td{padding:11px 12px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:middle}
tbody tr{transition:background .12s}
tbody tr[tabindex]{cursor:pointer}
tbody tr[tabindex]:hover,tbody tr[tabindex]:focus-visible{background:var(--coral-wash);outline:none}
tbody tr[tabindex]:focus-visible td:first-child{box-shadow:inset 3px 0 0 var(--coral-deep)}
tbody tr:last-child td{border-bottom:none}
.cell-main{font-weight:600;color:var(--cacao)}
.cell-sub{font-size:11.5px;color:var(--ink-subdued);margin-top:1px}
.num{font-variant-numeric:tabular-nums;text-align:right}
th.num{text-align:right}
.rowav{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  font-weight:700;font-size:11px;flex:none;background:var(--coral-soft);color:var(--cacao)}
.namecell{display:flex;align-items:center;gap:10px}

/* ---- badges ---- */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;
  padding:3px 9px;border-radius:999px;white-space:nowrap}
.badge i{width:6px;height:6px;border-radius:50%;flex:none}
.b-live{background:var(--tone-live-bg);color:var(--tone-live-text)}.b-live i{background:var(--tone-live-dot)}
.b-warn{background:var(--tone-warn-bg);color:var(--tone-warn-text)}.b-warn i{background:var(--tone-warn-dot)}
.b-stop{background:var(--tone-stop-bg);color:var(--tone-stop-text)}.b-stop i{background:var(--tone-stop-dot)}
.b-quiet{background:var(--tone-quiet-bg);color:var(--tone-quiet-text)}.b-quiet i{background:var(--tone-quiet-dot)}
.pill{display:inline-flex;align-items:center;font-size:11px;font-weight:600;padding:3px 10px;
  border-radius:999px;background:var(--coral);color:var(--cacao)}
.pill.ghost{background:transparent;border:1px solid var(--line-strong);color:var(--ink-subdued)}

/* ---- inline bar, for revenue-by-day shape at a glance ---- */
.bar-track{width:100%;min-width:80px;height:6px;border-radius:999px;background:var(--tone-quiet-bg)}
.bar-fill{height:100%;border-radius:999px;background:var(--tone-live-dot)}

/* ---- meter ---- */
.meter{height:6px;border-radius:3px;background:var(--surface-pressed);overflow:hidden;margin-top:6px}
.meter i{display:block;height:100%;border-radius:3px;background:var(--coral-deep);transition:width .4s var(--ease)}

/* ---- lists ---- */
.rows{list-style:none}
.rows li{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line)}
.rows li:last-child{border-bottom:none}
.rows .r-main{font-weight:600;font-size:13px;color:var(--cacao)}
.rows .r-sub{font-size:11.5px;color:var(--ink-subdued);margin-top:1px}
.rows .r-right{margin-left:auto;text-align:right;flex:none}

/* ---- states ---- */
.skel{background:linear-gradient(90deg,var(--surface-pressed) 25%,var(--surface-hover) 37%,var(--surface-pressed) 63%);
  background-size:400% 100%;animation:shimmer 1.4s ease infinite;border-radius:6px;height:13px}
@keyframes shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}
.skel-rows{padding:16px 18px;display:grid;gap:13px}
.skel-rows .skel:nth-child(2){width:82%}.skel-rows .skel:nth-child(3){width:64%}
.skel-rows .skel:nth-child(4){width:74%}.skel-rows .skel:nth-child(5){width:56%}

.empty{padding:44px 24px;text-align:center}
.empty-mark{width:46px;height:46px;border-radius:50%;background:var(--coral-soft);
  display:grid;place-items:center;margin:0 auto 14px;color:var(--cacao)}
.empty h3{font-family:var(--font-display);font-weight:800;font-size:16px;letter-spacing:-.02em;
  color:var(--cacao);margin-bottom:5px}
.empty p{color:var(--ink-subdued);font-size:12.5px;max-width:400px;margin:0 auto;line-height:1.6}
.empty .btn{margin-top:16px}

.errbox{background:var(--tone-stop-bg);color:var(--tone-stop-text);border-radius:var(--radius-card);
  padding:14px 16px;font-size:12.5px;margin-bottom:16px}
.errbox b{display:block;margin-bottom:3px;font-size:13px}
.errbox code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;word-break:break-word}

/* ---- toasts ---- */
.toasts{position:fixed;right:18px;bottom:18px;z-index:300;display:grid;gap:9px;
  width:min(390px,calc(100vw - 36px))}
/* follow-up #10: an open drawer's footer buttons stay clickable under a toast */
body:has(.drawer-foot) .toasts{bottom:86px}
.toast{background:var(--cacao);color:var(--paper);border-radius:var(--radius-card);
  padding:12px 15px;box-shadow:var(--shadow-pop);font-size:12.5px;line-height:1.5;
  display:flex;gap:10px;align-items:flex-start;animation:slidein .3s var(--ease) both}
.toast.err{background:var(--tone-stop-text)}
.toast b{display:block;margin-bottom:2px;font-size:13px}
.toast code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;opacity:.9;word-break:break-word}
.toast .x{margin-left:auto;opacity:.6;flex:none;font-size:15px;line-height:1}
.toast .x:hover{opacity:1}
@keyframes slidein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---- drawer ---- */
.scrim{position:fixed;inset:0;background:rgba(64,21,5,.28);z-index:100;
  animation:fade .2s ease both;backdrop-filter:blur(2px)}
@keyframes fade{from{opacity:0}to{opacity:1}}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(620px,100vw);background:var(--paper);
  z-index:110;box-shadow:var(--shadow-pop);display:flex;flex-direction:column;
  animation:slidex .3s var(--ease) both}
@keyframes slidex{from{transform:translateX(24px);opacity:.4}to{transform:none;opacity:1}}
.drawer-head{display:flex;align-items:flex-start;gap:14px;padding:20px 22px 16px;
  border-bottom:1px solid var(--line);background:var(--surface)}
.drawer-head h2{font-family:var(--font-display);font-weight:800;font-size:19px;
  letter-spacing:-.02em;color:var(--cacao);line-height:1.2}
.drawer-head .sub{font-size:12px;color:var(--ink-subdued);margin-top:4px}
.drawer-head .x{margin-left:auto;flex:none}
.drawer-body{flex:1;overflow-y:auto;padding:18px 22px 40px}
.drawer-foot{padding:13px 22px;border-top:1px solid var(--line);background:var(--surface);
  display:flex;gap:8px;align-items:center}
.drawer-foot .spacer{flex:1}

/* ---- forms ---- */
.form{display:grid;gap:14px}
.form-row{display:grid;gap:14px;grid-template-columns:1fr 1fr}
@media (max-width:560px){.form-row{grid-template-columns:1fr}}
.field label{font-size:11.5px;font-weight:700;color:var(--cacao);display:block;margin-bottom:5px;
  letter-spacing:.02em}
.field input,.field select,.field textarea,.pe-trow input,.evvenue-row input,.evvenue-row select{width:100%;min-height:38px;padding:9px 12px;
  border:1px solid var(--line-strong);border-radius:var(--radius-ctl);background:var(--white);
  transition:border-color .15s,box-shadow .15s}
.field textarea{min-height:82px;resize:vertical;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus,.pe-trow input:focus,.evvenue-row input:focus,.evvenue-row select:focus{outline:none;
  border-color:var(--coral-deep);box-shadow:0 0 0 3px var(--coral-soft)}
.field input:invalid:not(:placeholder-shown){border-color:var(--tone-stop-dot)}
.field .hint{font-size:11px;color:var(--ink-faint);margin-top:4px;line-height:1.5}
.field-err{font-size:11.5px;color:var(--tone-stop-text);font-weight:600;margin-top:4px}
fieldset{border:none}
.section-label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-faint);margin:24px 0 10px}
.section-label:first-child{margin-top:0}

.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;font-size:12.5px}
.kv dt{color:var(--ink-subdued);font-weight:500}
.kv dd{color:var(--cacao);font-weight:600;text-align:right}

.subcard{border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);
  overflow:hidden;margin-bottom:14px}
.subcard h3{font-size:12px;font-weight:700;color:var(--cacao);padding:12px 15px;
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px}
.subcard h3 .r{margin-left:auto;font-weight:500;color:var(--ink-subdued);font-size:11.5px}
.subcard .pad{padding:14px 15px}
/* an empty state inside a drawer subcard is not a subcard heading */
.subcard .empty h3{display:block;padding:0;border:0;font-size:16px;font-weight:800;margin-bottom:5px}

/* ---- tabs ---- */
.tabs{display:flex;gap:2px;padding:6px 10px 0;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{padding:8px 13px 10px;font-weight:600;font-size:12.5px;color:var(--ink-subdued);
  position:relative;white-space:nowrap;transition:color .15s}
.tab:hover{color:var(--cacao)}
.tab.active{color:var(--cacao)}
.tab.active::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:3px;
  border-radius:3px 3px 0 0;background:var(--coral-deep)}

/* ---- filter bar ---- */
.filterbar{display:flex;gap:8px;padding:11px 14px;border-bottom:1px solid var(--line);
  align-items:center;flex-wrap:wrap}
.filterbar input[type=search]{flex:1;min-width:180px;height:32px;padding:0 12px;
  border:1px solid var(--line-strong);border-radius:var(--radius-ctl);background:var(--white)}
.filterbar input[type=search]:focus{outline:none;border-color:var(--coral-deep);
  box-shadow:0 0 0 3px var(--coral-soft)}
.filterbar select{height:32px;padding:0 10px;border:1px solid var(--line-strong);
  border-radius:var(--radius-ctl);background:var(--white);font-weight:500}
.filterbar select:focus{outline:none;border-color:var(--coral-deep);box-shadow:0 0 0 3px var(--coral-soft)}

.tfoot{padding:11px 18px;border-top:1px solid var(--line);color:var(--ink-subdued);
  font-size:11.5px;font-weight:500}

/* ---- misc ---- */
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;
  background:var(--surface-pressed);padding:2px 7px;border-radius:5px;letter-spacing:.04em}
.stack{display:grid;gap:10px}
.inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.note{font-size:12px;color:var(--ink-subdued);line-height:1.6;
  background:var(--coral-wash);border:1px solid var(--coral-soft);
  border-radius:var(--radius-card);padding:13px 15px}
.note b{color:var(--cacao)}

a.navitem{text-decoration:none}

/* ============ Round 2 · Week 2 ============ */
/* stacked drawer: a second form over the first, a touch narrower so the
   one underneath still shows at its edge */
.drawer.stacked{width:min(580px,100vw);box-shadow:var(--shadow-pop),-1px 0 0 var(--line)}

/* ---- media uploader ---- */
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.media-tile,.media-add{position:relative;aspect-ratio:4/5;border-radius:var(--radius-ctl);
  overflow:hidden;border:1px solid var(--line);background:var(--surface-subdued)}
.media-tile img{width:100%;height:100%;object-fit:cover;display:block}
.media-video{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:6px;color:var(--ink-subdued);font-size:11.5px;font-weight:600}
.media-video a{font-size:11px;color:var(--ink-subdued)}
.media-cover{position:absolute;left:6px;top:6px;font-size:10px;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;background:var(--paper);color:var(--cacao);border-radius:999px;padding:2px 8px;
  border:1px solid var(--line)}
.media-tools{position:absolute;left:0;right:0;bottom:0;display:flex;gap:4px;padding:6px;
  background:linear-gradient(to top,rgba(64,21,5,.55),rgba(64,21,5,0))}
.media-tools .spacer{flex:1}
.media-btn{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--paper);color:var(--cacao);border:1px solid var(--line)}
.media-btn:disabled{opacity:.4;cursor:default}
.media-btn:hover:not(:disabled){background:var(--white)}
.media-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  border-style:dashed;border-color:var(--line-strong);color:var(--ink-subdued);font-size:12px;font-weight:600;
  transition:background .15s,color .15s,border-color .15s}
.media-add:hover{background:var(--coral-wash);color:var(--cacao);border-color:var(--cacao)}
.media-field .hint{margin-top:8px}
.media-add small{font-size:10.5px;font-weight:500;color:var(--ink-faint)}
/* Drag-and-drop (M-04): the whole field is the drop zone. While files hover it
   the field gets a dashed coral edge and a centred "Drop images" note. */
.media-field{position:relative;border-radius:calc(var(--radius-ctl) + 4px);outline:2px dashed transparent;
  outline-offset:4px;transition:outline-color .12s,background .12s}
.media-field.dropping{outline-color:var(--coral-deep);background:var(--coral-wash)}
.media-drop-note{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;border-radius:var(--radius-ctl);background:rgba(255,244,238,.88);color:var(--cacao);font-weight:700;
  font-size:13px;pointer-events:none;z-index:2}
.media-field.dropping .media-drop-note{display:flex}
.media-tile.uploading{display:flex;align-items:center;justify-content:center;border-style:dashed;
  border-color:var(--line-strong)}
.media-wait{display:flex;flex-direction:column;align-items:center;gap:8px;padding:8px;max-width:100%;
  color:var(--ink-subdued);font-size:10.5px;font-weight:600;text-align:center}
.media-wait span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.media-wait i{width:22px;height:22px;border-radius:50%;border:2.5px solid var(--coral-soft);
  border-top-color:var(--coral-deep);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.media-wait i{animation-duration:2.4s}}
.media-strip{display:flex;gap:8px;overflow-x:auto}
.media-strip img{width:72px;aspect-ratio:4/5;object-fit:cover;border-radius:8px;border:1px solid var(--line);flex:none}
/* Poster thumbnails: the 4:5 box is there before the image, shimmering, and the
   picture fades in once decoded. A broken link keeps a quiet empty frame. */
.media-strip .poster{position:relative;display:block;flex:none;width:72px;aspect-ratio:4/5;border-radius:8px;
  overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(90deg,var(--surface-pressed) 25%,var(--surface-hover) 37%,var(--surface-pressed) 63%);
  background-size:400% 100%;animation:shimmer 1.4s ease infinite}
.media-strip .poster img{width:100%;height:100%;border:0;border-radius:0;display:block;opacity:0;transition:opacity .28s ease}
.media-strip .poster.loaded{animation:none;background:var(--surface-pressed)}
.media-strip .poster.loaded img{opacity:1}
.media-strip .poster.failed{animation:none;background:var(--surface-subdued)}
@media (prefers-reduced-motion:reduce){.media-strip .poster{animation:none}.media-strip .poster img{transition:none}}

/* ---- segmented toggle (basis, week/month) ---- */
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:999px;padding:2px;background:var(--white)}
.seg button{height:28px;padding:0 12px;border-radius:999px;font-weight:600;font-size:12px;color:var(--ink-subdued)}
.seg button:hover{color:var(--cacao)}
.seg button.on{background:var(--coral-soft);color:var(--cacao)}

/* ---- header controls that are not buttons ---- */
.header-actions select,.header-actions input[type=date]{height:34px;padding:0 10px;border:1px solid var(--line-strong);
  border-radius:var(--radius-ctl);background:var(--white);font-weight:500}
/* Beside the title the row sits right (the title grows); wrapped onto its own
   row it starts at the left edge under the subtitle. */
.header-actions{flex-wrap:wrap;justify-content:flex-start;flex:0 1 auto;max-width:100%}
.nowrap{white-space:nowrap}

/* ---- checklists (venues, plans, events, benefit picker) ---- */
.checklist{display:grid;gap:0;border:1px solid var(--line);border-radius:var(--radius-ctl);
  background:var(--white);max-height:240px;overflow-y:auto}
.checklist label{display:flex;align-items:flex-start;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line);
  cursor:pointer;font-weight:500;color:var(--ink);margin:0;letter-spacing:0;font-size:12.5px}
.checklist label:last-child{border-bottom:none}
.checklist label:hover{background:var(--surface-hover)}
.checklist input{width:auto;min-height:0;margin-top:2px;accent-color:var(--cacao);flex:none}
.checklist .cl-main{font-weight:600;color:var(--cacao)}
.checklist .cl-sub{font-size:11.5px;color:var(--ink-subdued);margin-top:1px}
.checklist.cols2{grid-template-columns:1fr 1fr}
.checklist.cols2 label:nth-last-child(2):nth-child(odd){border-bottom:none}
.checklist-empty{padding:12px;font-size:12px;color:var(--ink-faint)}

/* ---- day picker ---- */
.daypick{display:flex;gap:6px;flex-wrap:wrap}
.daypick label{margin:0;cursor:pointer}
.daypick input{position:absolute;opacity:0;pointer-events:none;width:0;min-height:0}
.daypick span{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:30px;padding:0 10px;
  border:1px solid var(--line-strong);border-radius:999px;font-size:12px;font-weight:600;color:var(--ink-subdued);
  background:var(--white);transition:background .15s,color .15s,border-color .15s}
.daypick input:checked + span{background:var(--coral-soft);color:var(--cacao);border-color:var(--cacao)}
.daypick input:focus-visible + span{outline:2px solid var(--coral-deep);outline-offset:2px}

/* ---- totals row + section label inside cards ---- */
tr.totalrow td{font-weight:700;color:var(--cacao);background:var(--surface-subdued)}
.card-section{padding:12px 18px 8px;display:flex;align-items:baseline;gap:10px;border-top:1px solid var(--line)}
.card-section:first-child{border-top:none}
.card-section h3{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-subdued)}
.card-section .r{margin-left:auto;font-size:11.5px;color:var(--ink-subdued);font-weight:500}
.card-note{padding:0 18px 14px;font-size:11.5px;color:var(--ink-subdued);line-height:1.55}
.card-note.recon{padding-top:11px;border-top:1px solid var(--line)}
.card-note.recon b{color:var(--cacao)}

/* ---- role matrix ---- */
.matrix td,.matrix th{text-align:center}
.matrix td:first-child,.matrix th:first-child{text-align:left}
.cell-dash{color:var(--ink-faint)}
/* The matrix is wider than the card once an org runs every module. It scrolls
   sideways inside its own box (scrollbar always shown, so it is discoverable)
   while the role column stays pinned; headers never wrap or clip. */
.matrixwrap{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;
  scrollbar-color:var(--line-strong) transparent}
.matrixwrap::-webkit-scrollbar{height:9px}
.matrixwrap::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:9px}
.matrixwrap::-webkit-scrollbar-track{background:var(--surface-subdued)}
.matrix{width:max-content;min-width:100%}
.matrix th,.matrix td{min-width:112px;white-space:nowrap}
/* The pinned role column is opaque on every row state and carries a hard right
   edge plus a soft shadow, so the cells scrolling underneath read as passing
   under it instead of bleeding out at its edge ('ult (manage)'). */
.matrix th:first-child,.matrix td:first-child{position:sticky;left:0;z-index:3;background:var(--surface);
  background-clip:padding-box;min-width:210px;max-width:240px;white-space:normal;
  box-shadow:inset -1px 0 0 var(--line-strong)}
.matrix th:first-child::after,.matrix td:first-child::after{content:'';position:absolute;top:0;bottom:0;right:-10px;
  width:10px;pointer-events:none;background:linear-gradient(to right,rgba(64,21,5,.10),rgba(64,21,5,0))}
.matrixwrap .matrix th:first-child::after,.matrixwrap .matrix td:first-child::after{opacity:0;transition:opacity .15s}
.matrixwrap.scrolled .matrix th:first-child::after,.matrixwrap.scrolled .matrix td:first-child::after{opacity:1}
.matrix tbody tr:hover td:first-child{background:var(--surface)}

.matrix td:first-child .cell-sub{line-height:1.45}

/* ---- timeline (Member 360) ---- */
.timeline{list-style:none}
.timeline li{display:grid;grid-template-columns:92px 1fr auto;gap:12px;padding:10px 15px;border-bottom:1px solid var(--line);align-items:start}
.timeline li:last-child{border-bottom:none}
.timeline .t-when{font-size:11.5px;color:var(--ink-subdued);font-variant-numeric:tabular-nums;padding-top:1px}
.timeline .t-time{font-size:10.5px;color:var(--ink-faint);margin-top:1px}
.timeline .t-main{font-weight:600;color:var(--cacao);font-size:12.5px}
.timeline .t-sub{font-size:11.5px;color:var(--ink-subdued);margin-top:1px}
.timeline .t-right{text-align:right;font-weight:600;color:var(--cacao);font-size:12.5px;font-variant-numeric:tabular-nums}

/* ---- tonight board ---- */
/* A tier card holds a row of door actions (Check in, No-show, Cancel) beside
   the table, party, guests and status. Side by side the cards were too narrow
   for that row and clipped it to a lone "C", so each tier takes the full width
   and the actions sit on one line; only a phone-width card wraps them. */
.tiergrid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.tiergrid .card{margin-bottom:0}
.rowacts{display:flex;gap:4px;justify-content:flex-end;flex-wrap:wrap}
.tiertable td:last-child{width:1%;min-width:96px}
@media (min-width:700px){.tiertable .rowacts{flex-wrap:nowrap}}

/* ---- event guest list (drawer) ---- */
/* Four columns that fit the 620px drawer: the status pill and the door/refund
   actions share one column, the party size sits under the code, and a long
   email truncates (full text on hover) instead of pushing the pill off. */
.guestlist table{table-layout:fixed}
.guestlist th,.guestlist td{padding-left:10px;padding-right:10px}
.guestlist th:first-child,.guestlist td:first-child{padding-left:15px}
.guestlist th:last-child,.guestlist td:last-child{padding-right:15px}
.guestlist col.c-who{width:auto}
.guestlist col.c-code{width:104px}
.guestlist col.c-pay{width:118px}
.guestlist col.c-status{width:122px}
.guestlist .cell-main,.guestlist .cell-sub{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.guestlist .gl-status{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.guestlist .gl-status .btn{white-space:nowrap}

/* ---- Member 360 ---- */
.spend2 td b{color:var(--cacao)}
.spend2 .muted{color:var(--ink-faint)}
.ledger-sub{font-size:11.5px;color:var(--ink-subdued);margin-top:1px}

/* ---- plans list ---- */
.hidden-toggle{display:flex;align-items:center;gap:8px;width:100%;padding:11px 18px;border:0;
  border-top:1px solid var(--line);background:var(--surface-subdued);color:var(--ink-subdued);
  font:inherit;font-size:12.5px;font-weight:600;text-align:left;cursor:pointer}
.hidden-toggle:hover{color:var(--cacao);background:var(--surface-hover)}
tr.planhidden td{color:var(--ink-subdued)}
tr.planhidden .cell-main{color:var(--ink-subdued)}

/* ---- settings: unset member-app fields ---- */
.unset{display:inline-flex;align-items:center;gap:6px;margin-top:6px;font-size:11.5px;font-weight:600;
  color:var(--tone-quiet-text);background:var(--tone-quiet-bg);border-radius:999px;padding:3px 10px}
.unset::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--tone-quiet-dot)}
.snapshot{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;white-space:pre-wrap;
  word-break:break-word;color:var(--ink-subdued);background:var(--surface-subdued);border-radius:var(--radius-ctl);padding:10px 12px;margin-top:10px}
.pill{white-space:nowrap}

/* ---- member picker (sell forms) ---- */
.memberpick input[type=search]{width:100%}
.picklist{display:grid;gap:2px;margin-top:6px;max-height:240px;overflow:auto}
.pickrow{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;padding:8px 10px;
  border:1px solid var(--line);border-radius:var(--radius-ctl);background:var(--white)}
.pickrow:hover{border-color:var(--coral);background:var(--coral-wash)}
.picknone{font-size:12px;color:var(--ink-subdued);padding:6px 2px}
.picked{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;
  border:1px solid var(--coral);border-radius:var(--radius-ctl);background:var(--coral-wash)}
.resultbox{border:1px solid var(--line);border-radius:var(--radius-ctl);padding:12px 14px;background:var(--white)}
.resultbox .big{font-family:'Bricolage Grotesque',sans-serif;font-size:20px;font-weight:700;color:var(--cacao)}
.switchrow{display:flex;align-items:center;justify-content:space-between;gap:14px}
tr.voidrow td{color:var(--ink-subdued);text-decoration:line-through}
tr.voidrow td:last-child{text-decoration:none}
select.accsel{height:28px;padding:0 6px;font-size:12px;border:1px solid var(--line);border-radius:6px;background:var(--white);color:var(--ink-subdued)}
select.accsel.org{border-color:var(--coral);color:var(--cacao);font-weight:600}

/* Venues (M-12, M-13): Show archived filter, archived rows, drawer tabs, archive confirm. */
.checkline{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--ink-subdued);
  cursor:pointer;user-select:none;white-space:nowrap}
.checkline input{width:15px;height:15px;accent-color:var(--cacao);margin:0}
.checkline:hover{color:var(--cacao)}
tr.archivedrow td{color:var(--ink-subdued)}
tr.archivedrow .cell-main{color:var(--ink-subdued)}
tr.archivedrow img{filter:grayscale(1);opacity:.7}
.drawer-tabs{margin:-18px -22px 16px;padding:4px 14px 0;background:var(--surface)}
.archive-points{list-style:none;display:grid;gap:10px}
.archive-points li{font-size:12.5px;line-height:1.55;color:var(--ink);padding:10px 12px;border:1px solid var(--line);
  border-radius:var(--radius-ctl);background:var(--surface)}
.archive-points b{color:var(--cacao)}
.tier-summary{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:4px}

/* Go-live checklist (CONTRACT-I1 section 3). Warm tones only: done is the coral
   live tone, to do the stop tone, review the warn tone. */
.golive-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:10px 16px;margin-bottom:16px;
  padding:18px 20px;border-radius:var(--radius-card);border:1px solid var(--line);background:var(--surface);
  box-shadow:var(--shadow-card)}
.golive-head.tone-stop{background:var(--tone-stop-bg);border-color:transparent}
.golive-head.tone-live{background:var(--tone-live-bg);border-color:transparent}
.golive-head>div{flex:1 1 220px;min-width:0}
.golive-head h2{font-family:var(--font-display);font-weight:800;font-size:21px;letter-spacing:-.02em;color:var(--cacao);line-height:1.15}
.golive-head p{font-size:13px;color:var(--ink);margin-top:5px;text-wrap:pretty}
.golive-head .golive-scope{color:var(--ink-subdued);font-size:12px}
.golive-metrics .metric-value{font-size:25px}
.golist{list-style:none;margin:0;padding:0}
.golive-row{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:14px;align-items:start;
  padding:16px 18px;border-bottom:1px solid var(--line)}
.golive-row:last-child{border-bottom:none}
.gomark{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;margin-top:1px}
.gomark svg{stroke-width:2.6}
.gomark.s-ok{background:var(--tone-live-bg);color:var(--tone-live-text)}
.gomark.s-todo{background:var(--tone-stop-bg);color:var(--tone-stop-dot)}
.gomark.s-todo svg{fill:currentColor}
.gomark.s-warn{background:var(--tone-warn-bg);color:var(--tone-warn-dot)}
.gotitle{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.gotitle b{font-size:13.5px;color:var(--cacao)}
.godetail{font-size:12.5px;line-height:1.55;color:var(--ink);margin-top:4px;max-width:82ch;text-wrap:pretty}
.golive-row.s-ok .godetail{color:var(--ink-subdued)}
.goitems{list-style:none;margin:9px 0 0;padding:0;display:grid;gap:5px}
.goitems li{display:flex;align-items:baseline;gap:8px;font-size:12.5px;min-width:0}
.goitems a{color:var(--cacao);font-weight:600;text-decoration:underline;text-decoration-color:var(--coral);
  text-underline-offset:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46ch}
.goitems a:hover{text-decoration-color:var(--cacao)}
.goitems .cell-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.goitems .gomore{color:var(--ink-subdued);font-size:12px}
.goaction{padding-top:1px;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.golive-note{display:inline-block;font-size:12px;color:var(--ink-subdued);max-width:22ch;text-align:right;line-height:1.45}
@media (max-width:640px){
  .golive-row{grid-template-columns:26px minmax(0,1fr)}
  .goaction{grid-column:2;align-items:flex-start}
  .golive-note{text-align:left;max-width:none}
}
.golive-banner{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-bottom:16px;padding:12px 16px;
  border-radius:var(--radius-card);background:var(--tone-stop-bg);color:var(--tone-stop-text);font-size:12.5px;
  text-decoration:none;transition:background .15s}
.golive-banner b{color:var(--cacao);font-size:13px}
.golive-banner:hover{background:#F2D3C8}

/* ---- I4 platform: organisations, provision, onboarding (CONTRACT-I4) ---- */
.header-actions input[type=month]{height:34px;padding:0 10px;border:1px solid var(--line-strong);
  border-radius:var(--radius-ctl);background:var(--white);font-weight:500}
.pf-monthpick{gap:6px;flex-wrap:nowrap}
.pf-monthpick .btn-sm{width:30px;padding:0;justify-content:center;font-size:16px}
.pf-totals{display:grid;gap:2px}
.pf-totals div+div{font-size:.62em;letter-spacing:-.01em}
.pf-invoice-total{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:10px;
  border-top:1px solid var(--line);font-size:12.5px;color:var(--ink-subdued);font-weight:600}
.pf-invoice-total b{font-family:var(--font-display);font-size:21px;font-weight:800;letter-spacing:-.02em;
  color:var(--cacao);font-variant-numeric:tabular-nums}
.golive-head.tone-warn{background:var(--tone-warn-bg);border-color:transparent}
.gomark.s-done{background:var(--tone-live-bg);color:var(--tone-live-text)}
.gomark.s-doing{background:var(--tone-warn-bg);color:var(--tone-warn-dot)}
.gomark.s-skipped{background:var(--tone-quiet-bg);color:var(--tone-quiet-dot)}
.onb-row.s-done .godetail,.onb-row.s-skipped .godetail{color:var(--ink-subdued)}
.onb-meta{font-size:11.5px;color:var(--ink-subdued);margin-top:5px;font-variant-numeric:tabular-nums}
.onb-actions{flex-direction:row;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.onb-status{height:28px;padding:0 8px;font-size:12px;font-weight:600;border:1px solid var(--line-strong);
  border-radius:var(--radius-ctl);background:var(--white);color:var(--cacao)}
.onb-status:focus{outline:none;border-color:var(--coral-deep);box-shadow:0 0 0 3px var(--coral-soft)}
.onb-quick{gap:6px}
@media (max-width:640px){.onb-actions{justify-content:flex-start}}
.pv-modules{max-height:none}
.pv-line{font-size:13px;color:var(--cacao);line-height:1.55}
[data-test="pf-activity"] div{white-space:nowrap}
.cell-main>.badge{margin-left:7px;vertical-align:1px}
.pf-demo-total{color:var(--ink-subdued);font-weight:600}
/* ---- I3 messaging: log, templates, approvals ---- */
.tab .muted{color:var(--ink-faint);font-weight:500;margin-left:2px}
details.subcard>summary{cursor:pointer;font-size:12px;font-weight:700;color:var(--cacao);list-style:none}
details.subcard>summary::-webkit-details-marker{display:none}
details.subcard>summary::before{content:"+";display:inline-block;width:14px;color:var(--ink-subdued)}
details.subcard[open]>summary::before{content:"\2212"}
details.subcard[open]>summary{border-bottom:1px solid var(--line)}
details.subcard textarea{width:100%;min-height:120px;padding:9px 12px;border:1px solid var(--line-strong);
  border-radius:var(--radius-ctl);background:var(--white);resize:vertical;line-height:1.5}
.msg-preview{border-radius:var(--radius-card);padding:14px;font-size:13px;line-height:1.55;color:var(--cacao)}
.msg-preview.line{background:var(--tone-quiet-bg)}
.msg-preview.line .msg-from{font-size:11px;font-weight:600;color:var(--ink-subdued);margin:0 0 5px 4px}
.msg-preview.line .msg-body{display:inline-block;max-width:92%;background:var(--white);border-radius:4px 16px 16px 16px;
  padding:10px 13px;box-shadow:var(--shadow-card)}
.msg-preview.email{background:var(--white);border:1px solid var(--line)}
.msg-preview.email .msg-from{font-size:11px;color:var(--ink-subdued)}
.msg-preview.email .msg-subject{font-weight:700;font-size:14px;margin:4px 0 10px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.msg-preview .msg-body{white-space:pre-wrap;word-break:break-word}
.msg-preview:not(.line):not(.email) .msg-subject{font-weight:700;margin-bottom:6px}
.msg-preview:not(.line):not(.email){background:var(--surface-subdued);border:1px solid var(--line)}
.tpl-cell{display:grid;gap:4px}
.tpl-slot{display:flex;align-items:center;gap:6px}
.tpl-loc{font-size:10.5px;font-weight:700;color:var(--ink-subdued);width:20px;letter-spacing:.04em}
.tpl-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.tpl-chip{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;padding:3px 8px;border-radius:999px;
  border:1px solid var(--line-strong);background:var(--white);color:var(--cacao)}
.tpl-chip:hover:not(:disabled){background:var(--surface-hover)}
.tpl-chip.used{background:var(--tone-quiet-bg);border-color:transparent}
.tpl-chip:disabled{cursor:default}
.tpl-dirty{color:var(--tone-warn-dot)}
.apr-row.apr-expired td,.apr-row.apr-rejected td,.msg-row.msg-cancelled td,.msg-row.msg-suppressed td{color:var(--ink-subdued)}
.msg-channels{display:grid;border:1px solid var(--line);border-radius:var(--radius-ctl);background:var(--surface)}
.msg-channel{padding:4px 0;border-bottom:1px solid var(--line)}
.msg-channel:last-child{border-bottom:none}
.msg-channels .msg-channel-head{display:flex;align-items:flex-start;gap:10px;padding:9px 12px;cursor:pointer;
  margin:0;font-size:13px;font-weight:400;color:var(--ink);text-transform:none;letter-spacing:0}
.msg-channels .msg-channel-head input{width:auto;min-height:0;height:auto;padding:0;margin-top:2px;accent-color:var(--cacao);flex:none}
.msg-channel-fields{padding:2px 12px 12px 36px}
.msg-channel .cl-main{font-weight:600;color:var(--cacao)}
.msg-channel .cl-sub{font-size:11.5px;color:var(--ink-subdued);margin-top:1px}
.br-accent{display:flex;align-items:center;gap:8px}
.br-accent input{flex:1}
.br-swatch{width:26px;height:26px;border-radius:7px;border:1px solid var(--line-strong);flex:none;
  background-image:linear-gradient(45deg,var(--surface-pressed) 25%,transparent 25%,transparent 75%,var(--surface-pressed) 75%)}

/* ---- I5: groups, discounts, developers ---- */
.verdict{border-radius:var(--radius-card);padding:12px 14px;font-size:12.5px;line-height:1.55;color:var(--cacao);
  border:1px solid var(--line);background:var(--surface)}
.verdict b{display:block;font-size:13px;margin-bottom:2px}
.verdict.v-live{background:var(--tone-live-bg);border-color:transparent}
.verdict.v-warn{background:var(--tone-warn-bg);border-color:transparent}
.verdict.v-stop{background:var(--tone-stop-bg);border-color:transparent}
.verdict.v-quiet{background:var(--tone-quiet-bg);border-color:transparent}
.secret{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px dashed var(--line-strong);
  border-radius:var(--radius-ctl);padding:10px 12px;background:var(--white)}
.secret-value{flex:1;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;
  word-break:break-all;color:var(--cacao);user-select:all}
ul.sample{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px;font-size:12.5px}
ul.sample li{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.checklist input[type=number]{width:76px;min-height:34px;margin:0;padding:4px 10px;text-align:right;
  border:1px solid var(--line-strong);border-radius:var(--radius-ctl);background:var(--white)}

/* ---- I6: courts, studios and rooms (CONTRACT-I6) ---- */
.ct-toolbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 18px;margin-bottom:14px}
.ct-label{display:grid;gap:5px;font-size:11.5px;font-weight:700;color:var(--cacao);min-width:0}
.ct-label>select,.ct-label input[type=date]{height:34px;padding:0 10px;border:1px solid var(--line-strong);border-radius:var(--radius-ctl);
  background:var(--white);font-weight:500;color:var(--cacao);max-width:min(420px,calc(100vw - 32px))}
.ct-head{flex-wrap:wrap}
.ct-head>div:first-child{flex:1 1 260px;min-width:0}
.ct-label>select:focus,.ct-label input:focus{outline:none;border-color:var(--coral-deep);box-shadow:0 0 0 3px var(--coral-soft)}
/* the week editor */
.wk{display:grid;border:1px solid var(--line);border-radius:var(--radius-ctl);background:var(--surface)}
.wk-row{display:grid;grid-template-columns:96px 132px minmax(0,1fr);gap:10px;align-items:start;padding:9px 12px;border-bottom:1px solid var(--line)}
.wk-row:last-child{border-bottom:none}
.wk-day{font-size:12.5px;font-weight:700;color:var(--cacao);padding-top:7px}
.wk-mode,.wk-window input{height:32px;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--radius-ctl);background:var(--white);font-size:12.5px;color:var(--cacao)}
.wk-mode:focus,.wk-window input:focus{outline:none;border-color:var(--coral-deep);box-shadow:0 0 0 3px var(--coral-soft)}
.wk-windows{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;min-width:0}
.wk-window{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.wk-window input{width:104px}
.wk-to{font-size:12px;color:var(--ink-subdued)}
.wk-next{font-size:11px;font-weight:600;color:var(--tone-warn-text);background:var(--tone-warn-bg);border-radius:999px;padding:0 8px;line-height:20px}
.wk-next:empty{display:none}
.wk-quiet{font-size:12.5px;color:var(--ink-subdued);padding-top:7px}
.wk-warn{flex-basis:100%;font-size:11.5px;color:var(--tone-warn-text)}
.wk .btn-sm{height:30px}
@media (max-width:640px){
  .wk-row{grid-template-columns:1fr;gap:6px}
  .wk-day{padding-top:0}
  .wk-mode{width:100%}
}
/* the day timeline */
.tl-scroll{overflow-x:auto;margin:0 -2px;padding:0 2px 4px}
.tl{min-width:680px;display:grid}
.tl-row{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:stretch;border-bottom:1px solid var(--line)}
.tl-row:last-child{border-bottom:none}
.tl-row.tl-head{border-bottom:1px solid var(--line-strong)}
.tl-name{padding:9px 10px 9px 0;min-width:0}
.tl-name .cell-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-off .tl-name{opacity:.55}
.tl-axis{position:relative;height:26px}
.tl-tick{position:absolute;bottom:5px;transform:translateX(-50%);font-size:10.5px;font-weight:600;color:var(--ink-subdued);font-variant-numeric:tabular-nums}
.tl{padding-right:20px}
.tl-row.tl-head .tl-name{padding:0}
.tl-track{position:relative;min-height:48px;background:repeating-linear-gradient(90deg,var(--surface-pressed) 0 1px,transparent 1px 100%);
  background-color:var(--tone-quiet-bg)}
.tl-open{position:absolute;top:0;bottom:0;background:var(--white)}
.tl-closure{position:absolute;top:0;bottom:0;background:repeating-linear-gradient(135deg,var(--tone-quiet-bg) 0 6px,var(--surface-pressed) 6px 12px)}
.tl-closure.tl-extra{background:var(--white);box-shadow:inset 0 -3px 0 var(--tone-live-dot)}
.tl-booking{position:absolute;top:6px;bottom:6px;min-width:6px;border-radius:7px;padding:3px 7px;text-align:left;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center;gap:1px;font-size:11px;line-height:1.25;cursor:pointer;
  border:1px solid transparent;color:var(--cacao);background:var(--tone-live-bg);transition:box-shadow .15s}
.tl-booking b,.tl-booking span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-booking b{font-weight:700;font-size:11.5px}
.tl-booking:hover,.tl-booking:focus-visible{outline:none;box-shadow:0 0 0 2px var(--cacao)}
.t-booked{background:var(--tone-live-bg);border-color:var(--tone-live-dot)}
.t-unpaid{background:var(--tone-warn-bg);border-color:var(--tone-warn-dot)}
.t-held{background:var(--white);border:1px dashed var(--tone-warn-dot);color:var(--tone-warn-text)}
.t-done{background:var(--tone-quiet-bg);border-color:var(--tone-quiet-dot);color:var(--ink-subdued)}
.t-noshow{background:var(--tone-stop-bg);border-color:var(--tone-stop-dot);color:var(--tone-stop-text)}
.tl-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:12px;font-size:11.5px;color:var(--ink-subdued)}
.tl-legend span{display:inline-flex;align-items:center;gap:6px}
.tl-swatch{display:inline-block;width:16px;height:12px;border-radius:3px;border:1px solid var(--line-strong);position:static}
.tl-swatch.tl-open{background:var(--white)}
/* Test this price */
.pq-step ul.sample li{white-space:normal}
.pq-won{font-weight:700;color:var(--cacao)}
/* Platform: module switches */
.pf-modlist{display:grid}
.pf-modrow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.pf-modrow:last-child{border-bottom:none}
.pf-modname .cell-sub{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--radius-ctl);overflow:hidden;background:var(--white)}
.seg-btn{height:28px;padding:0 11px;font-size:12px;font-weight:600;color:var(--ink-subdued);border-right:1px solid var(--line)}
.seg-btn:last-child{border-right:none}
.seg-btn:hover{background:var(--surface-hover);color:var(--cacao)}
.seg-btn.on{background:var(--cacao);color:var(--white)}
.seg-btn:focus-visible{outline:2px solid var(--coral-deep);outline-offset:-2px}
@media (max-width:640px){.pf-modrow{grid-template-columns:minmax(0,1fr) auto}.pf-modrow .seg{grid-column:1 / -1;justify-self:start}}

/* ---- CONTRACT-BC: event venues, the Page tab and its phone preview ---- */
.drawer.wide{width:min(1180px,100vw)}
.evvenues{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.evvenue-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 64px auto;gap:8px;align-items:center;width:100%}
@media (max-width:560px){.evvenue-row{grid-template-columns:1fr}}
.pe-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;align-items:start}
@media (max-width:980px){.pe-grid{grid-template-columns:1fr}.pe-side{position:static}}
.pe-side{position:sticky;top:0}
.pe-section h3 .pe-sub{font-weight:500;color:var(--ink-faint);font-size:11.5px}
.pe-item{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--white);display:flex;flex-direction:column;gap:10px}
.pe-item-head{display:flex;align-items:center;gap:4px}
.pe-item-head b{font-size:12.5px;color:var(--cacao)}
.pe-item-head .spacer{flex:1}
.pe-check{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--cacao);padding-top:20px}
.pe-trow{display:grid;grid-template-columns:1.2fr 1.2fr .6fr 1fr auto;gap:6px;align-items:center}
.pe-trow input{min-width:0}
.pe-trow-head span{font-size:10.5px;font-weight:600;color:var(--ink-subdued);text-transform:uppercase;letter-spacing:.04em}
@media (max-width:560px){.pe-trow{grid-template-columns:1fr 1fr}.pe-trow-head{display:none}}
.pe-phone{width:340px;max-width:100%;margin:0 auto;height:680px;border-radius:38px;background:#111;padding:12px;box-shadow:var(--shadow-pop);position:relative}
.pe-notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:110px;height:22px;background:#111;border-radius:0 0 14px 14px;z-index:2}
.pe-screen{height:100%;overflow-y:auto;border-radius:28px;background:#14100E;color:#F6EFE9;font-size:12.5px;padding-bottom:18px}
.pv-hero{min-height:220px;background:linear-gradient(160deg,#5a1a07,#1d0c06);background-size:cover;background-position:center;display:flex;align-items:flex-end}
.pv-hero-in{padding:44px 16px 16px;width:100%;background:linear-gradient(transparent,rgba(0,0,0,.75))}
.pv-hero small{font-size:10px;letter-spacing:.12em;opacity:.8}
.pv-hero h2{font-family:var(--font-display);font-size:24px;line-height:1.1;margin:4px 0}
.pv-hero p{margin:2px 0;opacity:.9}
.pv-dates{font-weight:600;color:#FFAD8F}
.pv-sec{padding:14px 14px 0}
.pv-sec h4{font-family:var(--font-display);font-size:15px;margin:0 0 8px}
.pv-chips{display:flex;gap:6px;flex-wrap:wrap}
.pv-chips span{border:1px solid rgba(255,255,255,.25);border-radius:99px;padding:5px 11px;font-weight:600}
.pv-card{display:flex;align-items:center;gap:10px;justify-content:space-between;background:rgba(255,255,255,.07);border-radius:12px;padding:10px 12px;margin-bottom:6px}
.pv-card>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.pv-card span{opacity:.85}.pv-card small{opacity:.65}
.pv-card.out{opacity:.55}
.pv-buy{background:#FFAD8F;color:#401505;font-weight:700;border-radius:99px;padding:6px 12px;flex:none;opacity:1!important}
.pv-zone{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:rgba(255,255,255,.07);border:0;color:inherit;border-radius:12px;padding:9px 10px;margin-bottom:6px;font:inherit;cursor:pointer}
.pv-zone>span:last-child{display:flex;flex-direction:column;min-width:0}.pv-zone small{opacity:.7}
.pv-letter{width:26px;height:26px;border-radius:50%;background:#FFAD8F;color:#401505;display:grid;place-items:center;font-weight:800;flex:none}
.pv-zonebox{background:rgba(255,255,255,.04);border-radius:12px;padding:0 0 8px;margin-bottom:6px}
.pv-poster{width:100%;border-radius:10px;display:block;margin:4px 0}
.pv-lineup{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px 10px}
.pv-lineup small{display:block;opacity:.7}
.pv-tables{padding:4px 10px}
.pv-trow{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:6px;padding:5px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.pv-trow span:last-child{text-align:right}
.pv-note{opacity:.75;margin:6px 0;font-size:11.5px;line-height:1.45}
.pv-map{width:100%;border-radius:10px;display:block}
.pv-rules{margin:0;padding-left:16px;line-height:1.5}
.pv-faq p{margin:2px 0 8px;opacity:.8}
.pv-cta{margin:16px 14px 0;background:#FFAD8F;color:#401505;text-align:center;font-weight:800;border-radius:99px;padding:11px}

/* ---- CONTRACT-BC: event lists ---- */
.bc-live{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--ink-subdued)}
.bc-live i{width:8px;height:8px;border-radius:50%;background:#2E9E5B;box-shadow:0 0 0 3px rgba(46,158,91,.18)}
.bc-live.off i{background:var(--ink-faint);box-shadow:none}
.bc-bar{height:8px;border-radius:99px;background:var(--coral-wash);overflow:hidden;min-width:80px}
.bc-bar i{display:block;height:100%;background:var(--coral-deep)}
.bc-tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;padding:14px}
.bc-table{border:1px solid var(--line);border-radius:12px;background:var(--white);padding:10px 12px}
.bc-table-head{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.bc-table-head b{font-family:var(--font-display);font-size:15px;color:var(--cacao)}
.bc-table-head span{margin-left:auto;font-size:11.5px;color:var(--ink-subdued);font-weight:600}
.bc-seat{display:flex;align-items:center;gap:8px;padding:5px 0;border-top:1px solid var(--line);font-size:12.5px;cursor:pointer}
.bc-seat:first-of-type{border-top:0}
.bc-seat .dot{width:9px;height:9px;border-radius:50%;background:var(--line-strong);flex:none}
.bc-seat .dot.registered{background:var(--coral)}
.bc-seat .dot.inside{background:#2E9E5B}
.bc-seat em{margin-left:auto;font-style:normal;font-size:11.5px;color:var(--ink-subdued)}
.bc-preview{max-height:260px;overflow:auto;border:1px solid var(--line);border-radius:10px}
.bc-skips{margin:0;padding-left:18px;font-size:12px;line-height:1.55;max-height:180px;overflow:auto}
.row-hl td{background:var(--coral-wash)}
.row-total td{background:var(--surface);font-weight:600}
.header-actions select,.filterbar select{max-width:100%;min-width:0}
.pe-section .stack>.btn,.pe-section .form>.btn{align-self:flex-start}
.pe-tier{display:grid;grid-template-columns:1.3fr 1fr .8fr auto auto;gap:6px;align-items:center}
.pe-tier input:not([type=checkbox]),.pe-tier select{min-width:0;height:34px;padding:0 9px;border:1px solid var(--line-strong);border-radius:var(--radius-ctl);background:var(--white)}
@media (max-width:560px){.pe-tier{grid-template-columns:1fr 1fr}.pe-tier.pe-trow-head{display:none}}
.pv-card small.pv-out{text-decoration:line-through;opacity:.5}
.bc-banner{margin-bottom:12px}