/* Fade Street Booking — scoped to .fsb-root so it doesn't fight the theme. */
.fsb-root {
  --fsb-accent: #43D8F2;
  --bg: #ffffff; --surface: #ffffff; --surface2: #f6f6f5; --line: #e7e6e3; --line2: #f0efed;
  --text: #121212; --muted: #686661; --ink-on-accent: #062a31;
  --booked-bg: #fde4e2; --booked-bd: #e0564d; --booked-tx: #8f1d16;
  --hold-bg: #fff3d1; --hold-bd: #d79a00; --hold-tx: #7a5100;
  --blocked-bg: #ecebe8; --blocked-tx: #5d5b57;
  --closed: #f3f2ef; --free: #ffffff; --past: rgba(243, 242, 239, .72);
  --paid: #137a43; --paid-bg: #dff3e7; --part-bg: #fff3d1; --unpaid: #b42318; --unpaid-bg: #fde4e2;
  --radius: 10px;
  color: var(--text); background: var(--bg);
  font-size: 15px; line-height: 1.45; position: relative;
  -webkit-font-smoothing: antialiased;
  max-width: 1240px; margin: 0 auto; padding: 4px 0 24px;
}
.fsb-root[data-theme="dark"] {
  --bg: #141413; --surface: #1c1c1b; --surface2: #232322; --line: #34332f; --line2: #2a2a28;
  --text: #f2f1ee; --muted: #a9a79f; --ink-on-accent: #062a31;
  --booked-bg: #4a1f1c; --booked-bd: #d0584f; --booked-tx: #ffb4ad;
  --hold-bg: #47370f; --hold-bd: #d9a52c; --hold-tx: #ffd98a;
  --blocked-bg: #2b2b29; --blocked-tx: #b5b3ab;
  --closed: #1a1a19; --free: #1c1c1b; --past: rgba(20, 20, 19, .6);
  --paid: #7fdca5; --paid-bg: #183826; --part-bg: #47370f; --unpaid: #ffb4ad; --unpaid-bg: #4a1f1c;
}
.fsb-wrap .fsb-root { max-width: none; margin: 12px 0 0; padding: 0 0 24px; background: transparent; }
.fsb-root *, .fsb-root *::before, .fsb-root *::after { box-sizing: border-box; }
.fsb-root button { font: inherit; color: inherit; cursor: pointer; text-transform: none; letter-spacing: normal; line-height: 1.3; }
.fsb-root button:hover, .fsb-root button:focus { background-color: var(--surface2); color: var(--text); border-color: var(--line); }
.fsb-root button:disabled { cursor: not-allowed; opacity: .45; }
.fsb-root input, .fsb-root select, .fsb-root textarea { font: inherit; color: var(--text); }
.fsb-root :focus-visible { outline: 2px solid var(--fsb-accent); outline-offset: 2px; }
.fsb-root .muted { color: var(--muted); }
.fsb-root .small, .fsb-root small { font-size: 12.5px; }
.fsb-root .fsb-exvat { font-size: .78em; font-weight: 500; color: var(--muted); white-space: nowrap; }

/* header */
.fsb-root .fsb-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin: 0 0 16px; }
.fsb-root .fsb-title { margin: 0 0 2px; font-size: 30px; line-height: 1.1; font-weight: 700; color: var(--text); }
.fsb-root .fsb-sub { color: var(--muted); font-size: 14px; }
.fsb-root .fsb-head-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* buttons, chips, segmented */
.fsb-root .fsb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 7px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); text-decoration: none; font-weight: 600; font-size: 14px; white-space: nowrap; }
.fsb-root .fsb-btn:hover { background: var(--surface2); color: var(--text); }
.fsb-root .fsb-btn.primary { background: var(--text); border-color: var(--text); color: var(--bg); }
.fsb-root .fsb-btn.primary:hover { opacity: .88; background: var(--text); color: var(--bg); }
.fsb-root .fsb-btn.danger { color: #c0392b; }
.fsb-root .fsb-btn.icon { width: 38px; padding: 0; font-size: 20px; }
.fsb-root .fsb-btn.sm { min-height: 30px; padding: 4px 10px; font-size: 13px; }
.fsb-root .fsb-btn.wide { width: 100%; min-height: 46px; font-size: 15px; margin: 6px 0 4px; }
.fsb-root .fsb-btn.dim { color: var(--muted); }
.fsb-root .fsb-btn.link { border: 0; min-height: 0; padding: 0; background: none; text-decoration: underline; font-weight: 600; }
.fsb-root .fsb-linkbtn { border: 0; background: none; padding: 0; text-decoration: underline; color: inherit; font-size: inherit; }
.fsb-root .fsb-seg { display: inline-flex; background: var(--surface2); border: 1px solid var(--line); border-radius: 9px; padding: 3px; gap: 2px; }
.fsb-root .fsb-seg.wrap { flex-wrap: wrap; margin: 4px 0 12px; }
.fsb-root .fsb-seg button { border: 0; background: none; padding: 6px 14px; border-radius: 7px; font-weight: 600; font-size: 14px; color: var(--muted); }
.fsb-root .fsb-seg button.on { background: var(--surface); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.fsb-root .fsb-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.fsb-root .fsb-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--surface); padding: 6px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 600; }
.fsb-root .fsb-chip.sm { padding: 3px 9px; font-size: 12.5px; }
.fsb-root .fsb-chip i, .fsb-root .fsb-colhead i, .fsb-root .fsb-mtitle i, .fsb-root .fsb-wrow i, .fsb-root .fsb-mbars i, .fsb-root .fsb-uprow .s i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex: none; }
.fsb-root .fsb-chip.on { background: var(--text); color: var(--bg); border-color: var(--text); }

/* toolbar */
.fsb-root .fsb-toolbar { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 10px; }
.fsb-root .fsb-nav { display: flex; gap: 6px; align-items: center; }
.fsb-root .fsb-date { height: 38px; border: 1px solid var(--line); border-radius: 8px; padding: 0 10px; background: var(--surface); }
.fsb-root .fsb-period { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 4px 0 10px; }
.fsb-root .fsb-period strong { font-size: 18px; }
.fsb-root .fsb-period span { color: var(--muted); font-size: 13.5px; }

/* calendar wrapper */
.fsb-root .fsb-cal { position: relative; }
.fsb-root .fsb-cal.is-loading::after { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.35); pointer-events: none; }
.fsb-root[data-theme="dark"] .fsb-cal.is-loading::after { background: rgba(0,0,0,.25); }
.fsb-root .fsb-loading, .fsb-root .fsb-empty { padding: 32px; text-align: center; color: var(--muted); }
.fsb-root .fsb-error { padding: 12px 14px; border-radius: 8px; background: var(--unpaid-bg); color: var(--unpaid); margin-bottom: 10px; }
.fsb-root .fsb-notice { padding: 10px 14px; border-radius: 8px; background: var(--hold-bg); color: var(--hold-tx); margin: 0 0 10px; font-size: 14px; }
.fsb-root .fsb-dayinfo { color: var(--muted); font-size: 13px; margin-top: 8px; }

/* week strip */
.fsb-root .fsb-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 10px; }
.fsb-root .fsb-strip-day { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.fsb-root .fsb-strip-day .dw { font-size: 11.5px; text-transform: uppercase; color: var(--muted); letter-spacing: .04em; }
.fsb-root .fsb-strip-day .dn { font-size: 20px; font-weight: 700; }
.fsb-root .fsb-strip-day .bar { width: 70%; height: 4px; border-radius: 4px; background: var(--line2); overflow: hidden; }
.fsb-root .fsb-strip-day .bar b { display: block; height: 100%; background: var(--booked-bd); opacity: .7; }
.fsb-root .fsb-strip-day .dl { font-size: 10.5px; color: var(--hold-tx); text-align: center; line-height: 1.1; }
.fsb-root .fsb-strip-day.on { border-color: var(--text); box-shadow: inset 0 0 0 1px var(--text); }
.fsb-root .fsb-strip-day.today .dn { color: var(--booked-bd); }
.fsb-root .fsb-strip-day.past { opacity: .55; }
.fsb-root .fsb-strip-day.closed { background: var(--closed); }

/* time grids */
.fsb-root .fsb-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); -webkit-overflow-scrolling: touch; }
.fsb-root .fsb-grid { display: grid; position: relative; }
.fsb-root .fsb-grid.day { grid-template-columns: 52px repeat(var(--cols), minmax(150px, 1fr)); }
.fsb-root .fsb-grid.week { grid-template-columns: 52px repeat(7, minmax(calc(var(--sub) * 27px), 1fr)); }
.fsb-root .fsb-gh { border-bottom: 1px solid var(--line); background: var(--surface); position: sticky; left: 0; z-index: 4; }
.fsb-root .fsb-colhead { padding: 10px 12px; border-bottom: 1px solid var(--line); border-left: 1px solid var(--line); }
.fsb-root .fsb-colhead .n { display: flex; align-items: center; gap: 7px; font-weight: 700; }
.fsb-root .fsb-colhead .d { color: var(--muted); font-size: 12.5px; }
.fsb-root .fsb-colhead .p { font-weight: 700; font-size: 13.5px; margin-top: 2px; }
.fsb-root .fsb-dayhead { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 8px 6px; border: 0; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); background: none; text-align: left; font-weight: 700; font-size: 13.5px; }
.fsb-root .fsb-dayhead em { font-style: normal; font-size: 11px; font-weight: 600; color: var(--hold-tx); }
.fsb-root .fsb-dayhead .subs { display: flex; gap: 0; width: 100%; font-size: 10.5px; font-weight: 600; color: var(--muted); }
.fsb-root .fsb-dayhead .subs i { width: 6px; height: 6px; border-radius: 50%; display: inline-block; margin: 0 3px 0 0; align-self: center; }
.fsb-root .fsb-dayhead .subs { justify-content: space-around; }
.fsb-root .fsb-dayhead.today span:first-child { color: var(--booked-bd); }
.fsb-root .fsb-dayhead.on { background: var(--surface2); }
.fsb-root .fsb-gutter { position: sticky; left: 0; z-index: 3; background: var(--surface); }
.fsb-root .fsb-gutter span { position: absolute; right: 8px; transform: translateY(-50%); font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.fsb-root .fsb-gutter span:first-child { transform: none; }
.fsb-root .fsb-weekday { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; border-left: 1px solid var(--line); }
.fsb-root .fsb-weekday .fsb-col { border-left: 1px dotted var(--line2); }
.fsb-root .fsb-weekday .fsb-col:first-child { border-left: 0; }
.fsb-root .fsb-col { position: relative; border-left: 1px solid var(--line); background: var(--free); touch-action: pan-x pan-y; user-select: none; -webkit-user-select: none; }
.fsb-root .fsb-hr { position: absolute; left: 0; right: 0; border-top: 1px solid var(--line2); pointer-events: none; }
.fsb-root .fsb-slot { position: absolute; left: 0; right: 0; border: 0; background: transparent; padding: 0; z-index: 1; }
.fsb-root .fsb-slot:hover { background: color-mix(in srgb, var(--fsb-accent) 16%, transparent); }
.fsb-root .fsb-closed { position: absolute; left: 0; right: 0; background: repeating-linear-gradient(135deg, var(--closed) 0 6px, var(--surface2) 6px 12px); z-index: 0; display: flex; align-items: center; justify-content: center; }
.fsb-root .fsb-closed span { font-size: 11.5px; color: var(--muted); background: var(--closed); padding: 2px 6px; border-radius: 4px; }
.fsb-root .fsb-past { position: absolute; left: 0; right: 0; background: var(--past); z-index: 2; }
.fsb-root .fsb-now { position: absolute; left: 0; right: 0; border-top: 2px solid var(--booked-bd); z-index: 6; pointer-events: none; }
.fsb-root .fsb-now::before { content: ''; position: absolute; left: -4px; top: -5px; width: 8px; height: 8px; border-radius: 50%; background: var(--booked-bd); }
.fsb-root .fsb-ghost { position: absolute; left: 3px; right: 3px; z-index: 7; border: 2px solid var(--fsb-accent); background: color-mix(in srgb, var(--fsb-accent) 22%, transparent); border-radius: 6px; font-size: 12px; font-weight: 700; padding: 3px 6px; pointer-events: none; }

/* bookings */
.fsb-root .fsb-block { position: absolute; left: 3px; right: 3px; z-index: 5; border-radius: 6px; padding: 4px 7px; overflow: hidden; display: flex; flex-direction: column; gap: 1px; text-align: left; font-size: 12.5px; border: 1px solid; }
.fsb-root .fsb-block strong { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fsb-root .fsb-block span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .9; }
.fsb-root .fsb-block em { font-style: normal; font-size: 11px; font-weight: 700; align-self: flex-start; border-radius: 4px; padding: 0 5px; margin-top: 2px; }
.fsb-root .fsb-block.k-booked { background: var(--booked-bg); border-color: var(--booked-bd); color: var(--booked-tx); }
.fsb-root .fsb-block.k-hold { background: var(--hold-bg); border-color: var(--hold-bd); border-style: dashed; color: var(--hold-tx); }
.fsb-root .fsb-block.k-blocked { background: repeating-linear-gradient(135deg, var(--blocked-bg) 0 7px, var(--surface2) 7px 14px); border-color: var(--line); color: var(--blocked-tx); }
.fsb-root button.fsb-block { cursor: pointer; }
.fsb-root button.fsb-block:hover { filter: brightness(.97); box-shadow: 0 2px 6px rgba(0,0,0,.12); }
/* team: confirmed bookings carry the studio colour as a left rail */
.fsb-root[data-fsb-mode="team"] .fsb-block.k-booked { border-left: 4px solid var(--sc, var(--booked-bd)); }
.fsb-root .fsb-grid.week .fsb-block { left: 1px; right: 1px; padding: 2px 4px; font-size: 11px; }
.fsb-root .fsb-grid.week .fsb-block span { display: none; }
.fsb-root .fsb-grid.week .fsb-block strong { white-space: normal; word-break: break-word; font-size: 10.5px; line-height: 1.2; }
.fsb-root .fsb-dayhead .subs b { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 3px; font-weight: 600; }
.b-paid { background: var(--paid-bg); color: var(--paid); }
.b-part { background: var(--part-bg); color: var(--hold-tx); }
.b-unpaid { background: var(--unpaid-bg); color: var(--unpaid); }
.b-hold { background: var(--hold-bg); color: var(--hold-tx); }
.b-none { background: var(--surface2); color: var(--muted); }

/* legend */
.fsb-root .fsb-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; margin-top: 12px; font-size: 13px; color: var(--muted); }
.fsb-root .fsb-legend span { display: inline-flex; align-items: center; gap: 6px; }
.fsb-root .fsb-legend i { width: 14px; height: 14px; border-radius: 4px; border: 1px solid var(--line); display: inline-block; }
.fsb-root .fsb-legend .sw-free { background: var(--free); }
.fsb-root .fsb-legend .sw-booked { background: var(--booked-bg); border-color: var(--booked-bd); }
.fsb-root .fsb-legend .sw-hold { background: var(--hold-bg); border: 1px dashed var(--hold-bd); }
.fsb-root .fsb-legend .sw-blocked { background: repeating-linear-gradient(135deg, var(--blocked-bg) 0 3px, var(--surface2) 3px 6px); }
.fsb-root .fsb-legend .sw-closed { background: repeating-linear-gradient(135deg, var(--closed) 0 3px, var(--line) 3px 6px); }
.fsb-root .fsb-legend-note { flex-basis: 100%; font-size: 12.5px; }

/* month */
.fsb-root .fsb-month { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface); }
.fsb-root .fsb-mhead, .fsb-root .fsb-mgrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.fsb-root .fsb-mhead span { padding: 8px 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); border-bottom: 1px solid var(--line); }
.fsb-root .fsb-mcell { min-height: 108px; border-top: 1px solid var(--line2); border-left: 1px solid var(--line2); padding: 4px; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.fsb-root .fsb-mcell:nth-child(7n+1) { border-left: 0; }
.fsb-root .fsb-mcell.out { background: var(--surface2); }
.fsb-root .fsb-mcell.out .fsb-mday b, .fsb-root .fsb-mcell.past .fsb-mday b { color: var(--muted); }
.fsb-root .fsb-mcell.today .fsb-mday b { background: var(--booked-bd); color: #fff; border-radius: 999px; padding: 0 7px; }
.fsb-root .fsb-mcell.on { box-shadow: inset 0 0 0 2px var(--text); }
.fsb-root .fsb-mday { display: flex; gap: 6px; align-items: baseline; border: 0; background: none; padding: 2px 4px; text-align: left; width: 100%; border-radius: 6px; }
.fsb-root .fsb-mday:hover { background: var(--surface2); }
.fsb-root .fsb-mday em { font-style: normal; font-size: 11px; font-weight: 700; color: var(--hold-tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fsb-root .fsb-mbars { display: flex; flex-direction: column; gap: 4px; padding: 2px 4px; }
.fsb-root .fsb-mbars span { display: flex; align-items: center; gap: 5px; }
.fsb-root .fsb-mbars i { width: 7px; height: 7px; }
.fsb-root .fsb-mbars b { flex: 1; height: 5px; border-radius: 4px; background: var(--line2); overflow: hidden; }
.fsb-root .fsb-mbars u { display: block; height: 100%; background: var(--booked-bd); opacity: .75; text-decoration: none; }
.fsb-root .fsb-mchip { display: block; width: 100%; text-align: left; font-size: 11.5px; padding: 2px 6px; border-radius: 5px; border: 0; border-left: 3px solid var(--sc); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fsb-root .fsb-mchip.k-booked { background: var(--booked-bg); color: var(--booked-tx); }
.fsb-root .fsb-mchip.k-hold { background: var(--hold-bg); color: var(--hold-tx); }
.fsb-root .fsb-mchip.k-blocked { background: var(--blocked-bg); color: var(--blocked-tx); }
.fsb-root .fsb-more { border: 0; background: none; font-size: 11.5px; color: var(--muted); text-align: left; padding: 0 6px; }

/* mobile week list */
.fsb-root .fsb-wlist { display: flex; flex-direction: column; gap: 8px; }
.fsb-root .fsb-wcard { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
.fsb-root .fsb-wcard.today { border-color: var(--text); }
.fsb-root .fsb-wcard-h { display: flex; width: 100%; gap: 8px; align-items: baseline; border: 0; background: var(--surface2); padding: 9px 12px; text-align: left; }
.fsb-root .fsb-wcard-h em { font-style: normal; font-size: 12px; color: var(--hold-tx); font-weight: 700; }
.fsb-root .fsb-wcard-h span { margin-left: auto; font-size: 12.5px; color: var(--muted); }
.fsb-root .fsb-wrow { display: flex; gap: 10px; padding: 8px 12px; border-top: 1px solid var(--line2); align-items: flex-start; }
.fsb-root .fsb-wrow .n { width: 88px; flex: none; display: flex; gap: 6px; align-items: center; font-weight: 600; font-size: 13.5px; padding-top: 4px; }
.fsb-root .fsb-wrow .v { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; font-size: 13px; }
.fsb-root .fsb-wrow .muted { padding-top: 4px; }
.fsb-root .fsb-pill { border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; font-size: 12.5px; font-weight: 600; background: var(--surface); }
.fsb-root .fsb-pill.free { border-color: color-mix(in srgb, var(--fsb-accent) 70%, var(--text)); }
.fsb-root .fsb-pill.k-booked { background: var(--booked-bg); color: var(--booked-tx); border-color: var(--booked-bd); }
.fsb-root .fsb-pill.k-hold { background: var(--hold-bg); color: var(--hold-tx); border-color: var(--hold-bd); }
.fsb-root .fsb-pill.k-blocked { background: var(--blocked-bg); color: var(--blocked-tx); }

/* modal */
.fsb-root .fsb-modal-host { position: relative; z-index: 100050; }
.fsb-root .fsb-overlay { position: fixed; inset: 0; background: rgba(10, 10, 10, .45); z-index: 100050; }
.fsb-root .fsb-modal { position: fixed; z-index: 100051; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(640px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow: auto; background: var(--surface); color: var(--text); border-radius: 14px; padding: 18px 20px 20px; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.fsb-root .fsb-mhead-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.fsb-root .fsb-mtitle { display: flex; align-items: center; gap: 8px; font-size: 20px; font-weight: 700; }
.fsb-root .fsb-mtitle small { font-size: 12px; color: var(--muted); font-weight: 600; }
.fsb-root .fsb-msub { color: var(--muted); font-size: 14px; margin-top: 2px; }
.fsb-root .fsb-x { border: 1px solid var(--line); background: var(--surface); border-radius: 50%; width: 32px; height: 32px; font-size: 18px; line-height: 1; flex: none; padding: 0; }
.fsb-root .fsb-x.sm { width: 26px; height: 26px; font-size: 15px; }
.fsb-root .fsb-adjust { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 4px 0 10px; font-size: 13px; color: var(--muted); }
.fsb-root .fsb-adjust span { margin-left: 6px; }
.fsb-root .fsb-adjust span:first-child { margin-left: 0; }
.fsb-root .fsb-adjust b { color: var(--text); min-width: 18px; text-align: center; }
.fsb-root .fsb-warn { background: var(--unpaid-bg); color: var(--unpaid); border-radius: 8px; padding: 9px 12px; font-size: 13.5px; margin: 8px 0; }
.fsb-root .fsb-note { background: var(--surface2); border-radius: 8px; padding: 8px 12px; font-size: 13.5px; margin: 8px 0; }
.fsb-root .fsb-bigprice { font-size: 32px; font-weight: 800; letter-spacing: -.01em; margin: 6px 0 2px; }
.fsb-root .fsb-bigprice > span { font-size: 15px; font-weight: 600; color: var(--muted); }
.fsb-root .fsb-bigprice small { display: block; font-size: 13px; font-weight: 500; color: var(--muted); letter-spacing: 0; }
.fsb-root .fsb-price { width: 100%; border-collapse: collapse; font-size: 13.5px; margin: 8px 0 4px; }
.fsb-root .fsb-price td { padding: 4px 0; border: 0; vertical-align: top; }
.fsb-root .fsb-price td:last-child { text-align: right; white-space: nowrap; padding-left: 12px; }
.fsb-root .fsb-price tr.sub td { border-top: 1px solid var(--line); padding-top: 7px; font-weight: 700; }
.fsb-root .fsb-price tr.vat td { color: var(--muted); }
.fsb-root .fsb-price tr.tot td { font-weight: 800; font-size: 14.5px; }
.fsb-root .fsb-price tr.quoted td { color: var(--muted); font-size: 12.5px; }
.fsb-root .fsb-sec { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin: 18px 0 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fsb-root .fsb-sec small { text-transform: none; letter-spacing: 0; font-weight: 600; }
.fsb-root .fsb-extras { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.fsb-root .fsb-extra { display: flex; justify-content: space-between; gap: 8px; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; background: var(--surface); text-align: left; font-size: 13px; }
.fsb-root .fsb-extra b { white-space: nowrap; }
.fsb-root .fsb-extra.on { border-color: var(--text); box-shadow: inset 0 0 0 1px var(--text); background: color-mix(in srgb, var(--fsb-accent) 12%, var(--surface)); }
.fsb-root .fsb-eq { border: 1px solid var(--line); border-radius: 8px; margin-top: 8px; padding: 0 10px; }
.fsb-root .fsb-eq-h { display: flex; justify-content: space-between; width: 100%; border: 0; background: none; padding: 10px 0; font-weight: 700; font-size: 13.5px; }
.fsb-root .fsb-eq-h span:last-child { color: var(--muted); font-weight: 500; }
.fsb-root .fsb-eq-cat { font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin: 10px 0 4px; }
.fsb-root .fsb-eq-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line2); font-size: 13.5px; }
.fsb-root .fsb-eq-row > span:first-child { flex: 1; }
.fsb-root .fsb-eq-row b { white-space: nowrap; font-size: 13px; }
.fsb-root .fsb-step { display: inline-flex; align-items: center; gap: 4px; }
.fsb-root .fsb-step button { width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--line); background: var(--surface); padding: 0; }
.fsb-root .fsb-step output { min-width: 16px; text-align: center; font-weight: 700; }
.fsb-root .fsb-form { display: flex; flex-wrap: wrap; gap: 10px 12px; }
.fsb-root .fsb-field { display: flex; flex-direction: column; gap: 4px; flex: 1 1 100%; min-width: 0; margin: 0; }
.fsb-root .fsb-field.half { flex: 1 1 calc(50% - 6px); }
.fsb-root .fsb-field > span:first-child { font-size: 12.5px; font-weight: 700; color: var(--muted); }
.fsb-root .fsb-field > span:first-child a, .fsb-root .fsb-field > span:first-child button { font-weight: 600; color: var(--text); }
.fsb-root .fsb-field input, .fsb-root .fsb-field select, .fsb-root .fsb-field textarea, .fsb-root .fsb-ck-row input, .fsb-root .fsb-ck-row select, .fsb-root .fsb-mrow input, .fsb-root .fsb-tbl input { width: 100%; min-height: 40px; border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; background: var(--surface); box-shadow: none; margin: 0; max-width: none; }
.fsb-root .fsb-field textarea { min-height: 60px; resize: vertical; }
.fsb-root .fsb-inline { display: flex; gap: 6px; }
.fsb-root .fsb-inline input { flex: 1; }
.fsb-root .fsb-check { display: flex; gap: 8px; align-items: center; font-size: 13.5px; margin: 12px 0 0; flex: 1 1 100%; }
.fsb-root .fsb-check.half { flex: 1 1 calc(50% - 6px); }
.fsb-root .fsb-check input { width: 16px; height: 16px; margin: 0; }
.fsb-root .fsb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.fsb-root .fsb-commercial { background: var(--surface2); border-radius: 10px; padding: 12px 14px; margin-top: 14px; font-size: 13.5px; }
.fsb-root .fsb-commercial p { margin: 4px 0 10px; color: var(--muted); }
.fsb-root .fsb-links { display: flex; gap: 6px; flex-wrap: wrap; }
.fsb-root .fsb-success .big { font-size: 24px; font-weight: 800; margin-bottom: 6px; }
.fsb-root .fsb-success p { margin: 6px 0; }
.fsb-root .fsb-holdbar { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; background: var(--hold-bg); color: var(--hold-tx); border-radius: 10px; padding: 10px 12px; margin-bottom: 12px; font-size: 13.5px; }
.fsb-root .fsb-holdbar .muted { color: inherit; opacity: .8; }
.fsb-root .fsb-holdbtns { display: flex; gap: 6px; }
.fsb-root .fsb-reqbox { background: var(--surface2); border-radius: 10px; padding: 8px 12px; font-size: 13.5px; }
.fsb-root .fsb-reqbox p { margin: 6px 0; }
.fsb-root .fsb-badge { display: inline-block; font-style: normal; font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; text-transform: none; letter-spacing: 0; }
.fsb-root .fsb-payline { flex: 1 1 100%; font-size: 13px; color: var(--muted); }
.fsb-root .fsb-payline b { color: var(--text); }
.fsb-root .fsb-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 4px 0 10px; font-size: 13px; }
.fsb-root .fsb-ck { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; align-items: flex-start; }
.fsb-root .fsb-ck-row { display: grid; grid-template-columns: 18px 1fr 120px 26px; gap: 6px; align-items: center; width: 100%; }
.fsb-root .fsb-ck-row input[type=checkbox] { width: 16px; height: 16px; min-height: 0; }
.fsb-root .fsb-mfoot { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.fsb-root .fsb-mfoot .sp { flex: 1; }
.fsb-root .fsb-members { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.fsb-root .fsb-mrow { display: grid; grid-template-columns: 1fr 1.4fr 1fr auto 26px; gap: 6px; align-items: center; }
.fsb-root .fsb-mrow .fsb-check { margin: 0; white-space: nowrap; font-size: 12.5px; }
.fsb-root .fsb-tbl { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; overflow-x: auto; }
.fsb-root .fsb-tbl .th, .fsb-root .fsb-tbl .tr { display: grid; gap: 6px; align-items: center; grid-auto-flow: column; grid-auto-columns: minmax(70px, 1fr); }
.fsb-root .fsb-tbl .th span { font-size: 11.5px; font-weight: 700; color: var(--muted); }
.fsb-root .fsb-tbl input[type=color] { padding: 2px; min-height: 36px; }
.fsb-root .fsb-tbl input[type=checkbox] { width: 16px; height: 16px; min-height: 0; justify-self: center; }
.fsb-root .fsb-tbl .fsb-x { justify-self: end; }
.fsb-root .fsb-modal p { margin: 6px 0; }

/* team: upcoming */
.fsb-root .fsb-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 4px 0 12px; }
.fsb-root .fsb-stats div { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--surface); }
.fsb-root .fsb-stats span { display: block; font-size: 12.5px; color: var(--muted); }
.fsb-root .fsb-stats b { font-size: 22px; }
.fsb-root .fsb-uplist { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface); }
.fsb-root .fsb-upday { padding: 8px 14px; background: var(--surface2); font-weight: 700; font-size: 13.5px; border-top: 1px solid var(--line); }
.fsb-root .fsb-upday:first-child { border-top: 0; }
.fsb-root .fsb-uprow { display: grid; grid-template-columns: 96px 40px 1fr auto; gap: 10px; width: 100%; text-align: left; border: 0; border-top: 1px solid var(--line2); background: none; padding: 10px 14px; font-size: 14px; }
.fsb-root .fsb-uprow:hover { background: var(--surface2); }
.fsb-root .fsb-uprow .t { font-variant-numeric: tabular-nums; font-weight: 600; }
.fsb-root .fsb-uprow .s { display: flex; gap: 5px; align-items: flex-start; padding-top: 5px; font-weight: 700; font-size: 13px; }
.fsb-root .fsb-uprow small.done { text-decoration: line-through; color: var(--muted); }
.fsb-root .fsb-uprow .r { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.fsb-root .fsb-uprow .avs { display: flex; gap: 3px; }
.fsb-root .fsb-uprow .avs i { width: 22px; height: 22px; border-radius: 50%; background: var(--text); color: var(--bg); font-style: normal; font-size: 11px; display: grid; place-items: center; font-weight: 700; }
.fsb-root .fsb-toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: var(--text); color: var(--bg); padding: 10px 16px; border-radius: 8px; z-index: 100060; font-weight: 600; font-size: 14px; }
.fsb-root .fsb-login { max-width: 360px; }

/* ---------- mobile ---------- */
@media (max-width: 760px) {
.fsb-root { font-size: 14.5px; }
.fsb-root .fsb-title { font-size: 24px; }
.fsb-root .fsb-toolbar { gap: 8px; }
.fsb-root .fsb-nav { width: 100%; }
.fsb-root .fsb-date { flex: 1; min-width: 0; }
.fsb-root .fsb-seg { width: 100%; }
.fsb-root .fsb-seg button { flex: 1; }
.fsb-root .fsb-seg.wrap button { flex: 0 1 auto; }
.fsb-root .fsb-chips { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
.fsb-root .fsb-chip { white-space: nowrap; }
.fsb-root .fsb-strip { gap: 3px; }
.fsb-root .fsb-strip-day { padding: 6px 2px; border-radius: 8px; }
.fsb-root .fsb-strip-day .dn { font-size: 16px; }
.fsb-root .fsb-strip-day .dl { display: none; }
.fsb-root .fsb-grid.day { grid-template-columns: 44px repeat(var(--cols), minmax(118px, 1fr)); }
.fsb-root .fsb-colhead { padding: 8px; }
.fsb-root .fsb-colhead .d { display: none; }
.fsb-root .fsb-mcell { min-height: 58px; padding: 2px; }
.fsb-root .fsb-mday { padding: 2px; flex-direction: column; gap: 0; }
.fsb-root .fsb-mday em { font-size: 9.5px; white-space: normal; line-height: 1.1; }
.fsb-root .fsb-mhead span { padding: 6px 4px; font-size: 10.5px; text-align: center; }
.fsb-root .fsb-mbars { padding: 2px 1px; gap: 3px; }
.fsb-root .fsb-mbars i { display: none; }
.fsb-root .fsb-more { font-size: 10.5px; padding: 0 2px; }
.fsb-root .fsb-modal { top: auto; bottom: 0; left: 0; transform: none; width: 100%; max-height: 92vh; border-radius: 16px 16px 0 0; padding: 16px 16px calc(20px + env(safe-area-inset-bottom)); }
.fsb-root .fsb-extras { grid-template-columns: 1fr; }
.fsb-root .fsb-field.half, .fsb-root .fsb-check.half { flex-basis: 100%; }
.fsb-root .fsb-stats { grid-template-columns: 1fr 1fr; }
.fsb-root .fsb-uprow { grid-template-columns: 76px 1fr; }
.fsb-root .fsb-uprow .s { display: none; }
.fsb-root .fsb-uprow .r { grid-column: 2; align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
.fsb-root .fsb-mrow { grid-template-columns: 1fr 1fr; }
.fsb-root .fsb-ck-row { grid-template-columns: 18px 1fr 26px; }
.fsb-root .fsb-ck-row select { grid-column: 2; }
.fsb-root .fsb-head-actions { width: 100%; }
}

/* Team & alerts */
.fsb-root .fsb-members2 { display: flex; flex-direction: column; gap: 10px; margin-bottom: 8px; }
.fsb-root .fsb-mcard { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--surface); }
.fsb-root .fsb-mcard-row { display: grid; grid-template-columns: 1fr 1.3fr 1.1fr 0.9fr 26px; gap: 8px; align-items: end; }
.fsb-root .fsb-mcard-row .fsb-x { margin-bottom: 7px; }
.fsb-root .fsb-evs { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; }
.fsb-root .fsb-evs .fsb-check { flex: 0 1 auto; margin: 4px 0 0; font-size: 13px; }
.fsb-root .fsb-mcard-foot { margin-top: 8px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.fsb-root .fsb-kv { display: grid; grid-template-columns: 180px 1fr; gap: 4px 12px; font-size: 13px; margin: 8px 0 10px; }
.fsb-root .fsb-kv span { color: var(--muted); }
.fsb-root .fsb-kv b { font-weight: 600; min-width: 0; }
.fsb-root .fsb-kv b.wrap { word-break: break-all; font-family: ui-monospace, Menlo, monospace; font-size: 12px; }
.fsb-root .fsb-logtbl { border: 1px solid var(--line); border-radius: 8px; font-size: 12.5px; max-height: 280px; overflow: auto; }
.fsb-root .fsb-logtbl > div { display: grid; grid-template-columns: 90px 1fr 1.4fr auto; gap: 8px; padding: 6px 10px; border-top: 1px solid var(--line2); align-items: center; }
.fsb-root .fsb-logtbl > div:first-child { border-top: 0; }
.fsb-root .fsb-logtbl em { grid-column: 1 / -1; font-style: normal; color: var(--unpaid); font-size: 12px; }
.fsb-root .fsb-syslog { margin-top: 10px; font-size: 12px; }
.fsb-root .fsb-syslog summary { cursor: pointer; color: var(--muted); font-weight: 600; }
.fsb-root .fsb-syslog div { padding: 3px 0; border-top: 1px solid var(--line2); }
.fsb-root .fsb-syslog .lv-error { color: var(--unpaid); }
.fsb-root .fsb-syslog .lv-warn { color: var(--hold-tx); }
.fsb-root code { font-size: 12px; background: var(--surface2); padding: 1px 4px; border-radius: 4px; }
@media (max-width: 760px) {
  .fsb-root .fsb-mcard-row { grid-template-columns: 1fr 1fr; }
  .fsb-root .fsb-kv { grid-template-columns: 1fr; }
  .fsb-root .fsb-kv span { margin-top: 4px; }
  .fsb-root .fsb-logtbl > div { grid-template-columns: 1fr; gap: 2px; }
}

.fsb-root .fsb-conn { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; margin: 8px 0 10px; }
.fsb-root .fsb-conn summary { cursor: pointer; font-weight: 700; font-size: 14px; }
.fsb-root .fsb-conn .fsb-field small { font-size: 11.5px; }

/* Team notes thread + team page */
.fsb-root .fsb-thread { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }
.fsb-root .fsb-note-item { background: var(--surface2); border-radius: 10px; padding: 8px 10px; font-size: 13.5px; max-width: 92%; }
.fsb-root .fsb-note-item.mine { align-self: flex-end; background: color-mix(in srgb, var(--fsb-accent) 16%, var(--surface)); }
.fsb-root .fsb-note-item .nh { display: flex; gap: 8px; align-items: baseline; font-size: 12.5px; margin-bottom: 2px; }
.fsb-root .fsb-note-item .nh span { color: var(--muted); }
.fsb-root .fsb-note-item .nh button { margin-left: auto; color: var(--muted); font-size: 12px; }
.fsb-root .fsb-note-new { display: flex; gap: 8px; align-items: flex-end; }
.fsb-root .fsb-note-new textarea { flex: 1; min-height: 44px; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; background: var(--surface); resize: vertical; }
.fsb-teamwrap { max-width: 1240px; margin: 0 auto; }
.fsb-teambar { display: flex; justify-content: flex-end; gap: 12px; align-items: center; font-size: 13px; padding: 6px 0; color: #555; }
.fsb-teambar form { margin: 0; }
.fsb-teambar .fsb-linkbtn { background: none; border: 0; padding: 0; text-decoration: underline; cursor: pointer; font: inherit; color: inherit; }
.fsb-root.fsb-gate { padding: 40px 16px; }
.fsb-root .fsb-gate-card { max-width: 420px; margin: 0 auto; border: 1px solid var(--line); border-radius: 14px; padding: 24px; background: var(--surface); }
.fsb-root .fsb-gate-card p { margin: 10px 0; }
.fsb-root .fsb-gate-form { margin-top: 8px; }
