/* ── Design tokens — Dark UI standard palette ───────────────────── */
:root {
  --bg-0:#0f0f11; --bg-1:#1a1a1f; --bg-2:#222228; --bg-3:#2c2c34; --bg-4:#38383f;
  --text-0:#f0f0f2; --text-1:#c8c8d0; --text-2:#8888a0; --text-3:#55556a;
  --border:#2e2e38; --border-hi:#44444f;
  --rose:#2cc4b0; --rose-mid:#4dd6c4;
  --rose-dim:rgba(44,196,176,.12); --rose-border:rgba(44,196,176,.28);
  --gold:#2cc4b0; --gold-dim:rgba(44,196,176,.10); --gold-border:rgba(44,196,176,.28);
  --blush:#0d2422; --blush-deep:#0f2d2a;
  --ok:#3aaa6e; --warn:#d4892a; --err:#e05252;
  --sans:'Space Grotesk', system-ui, sans-serif;
  --mono:'JetBrains Mono', 'Courier New', monospace;
  --radius:8px; --radius-lg:14px; --card:var(--bg-1);
  --media-btn-size:42px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.35),0 1px 2px rgba(0,0,0,.25);
  --shadow-md:0 4px 14px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.3);
}
*,*::before,*::after{box-sizing:border-box}
html,body,body.mindmirror-shell,#page,#primary,#content,.site,.site-content{background:var(--bg-0)!important;color:var(--text-0)}
body{font-family:var(--sans)!important;margin:0;min-height:100vh;-webkit-font-smoothing:antialiased}
body.mindmirror-shell,body.mindmirror-shell *{font-family:var(--sans)!important}
.ff-shell{max-width:1320px;margin:0 auto;padding:12px 14px;min-height:100vh}
.saap-crumbs{display:flex;align-items:center;font-family:var(--mono)!important;font-size:.82rem;color:var(--text-3);margin-bottom:10px;flex-wrap:wrap;gap:2px}
.saap-crumbs .c+.c::before{content:' | ';padding:0 5px;color:var(--border-hi)}
.saap-crumbs a{color:var(--rose);text-decoration:none}
.ff-hero{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--border)}
.ff-kicker{margin:0 0 6px;text-transform:uppercase;letter-spacing:.15em;color:var(--rose);font-size:.68rem;font-weight:600}
.ff-hero h1{margin:0 0 4px;font-size:1.75rem;line-height:1.1;color:var(--text-0);font-weight:700}
.ff-sub{margin:0;font-size:.92rem;line-height:1.45;color:var(--text-2);max-width:52ch}
.ff-token-pill{background:var(--rose-dim);border:1px solid var(--rose-border);border-radius:999px;padding:9px 16px;font-size:.92rem;white-space:nowrap;color:var(--rose);font-weight:500}
.ff-token-stack{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}

.ff-grid{display:grid;grid-template-columns:1fr;gap:16px}
.ff-main,.ff-side{min-width:0}
.ff-side{display:none}
.tab-panel{display:none}
.tab-panel.is-active{display:block}
.ff-card{background:var(--bg-1);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;margin-bottom:14px;box-shadow:var(--shadow-sm)}
.ff-panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.ff-panel-head h2{margin:0;font-size:1.3rem;color:var(--text-0)}
.ff-card h3{margin:0 0 2px;font-size:1rem;color:var(--text-0)}
.ff-btn{background:var(--rose);color:#fff;border:1px solid transparent;border-radius:10px;padding:11px 18px;cursor:pointer;font-family:var(--sans)!important;font-size:.9rem;font-weight:600;transition:all .15s;box-shadow:0 2px 6px rgba(44,196,176,.2)}
.ff-btn:hover{filter:brightness(1.06);box-shadow:0 3px 10px rgba(44,196,176,.3)}
.ff-btn-ghost{background:var(--bg-1);color:var(--text-1);border-color:var(--border);box-shadow:var(--shadow-sm)}
.ff-btn-ghost:hover{border-color:var(--rose);color:var(--rose);background:var(--rose-dim);box-shadow:none}
.ff-btn-sm{padding:7px 13px;font-size:.82rem}
.ff-icon-btn{width:var(--media-btn-size);height:var(--media-btn-size);min-width:var(--media-btn-size);padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:10px;flex-shrink:0}
.ff-icon-btn svg{pointer-events:none}
.ff-chat-form{display:flex;gap:8px;margin-top:8px;align-items:center}
.ff-chat-form .ff-input{flex:1}
.ff-chat-form .ff-icon-btn{width:42px;height:42px;min-width:42px;background:var(--rose);border-color:transparent;color:#fff;box-shadow:0 2px 6px rgba(44,196,176,.2)}
.ff-chatlog{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px;min-height:150px;max-height:300px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.ff-bubble{max-width:80%;padding:10px 14px;border-radius:14px;font-size:.875rem;line-height:1.5;word-wrap:break-word}
.ff-bubble-user{align-self:flex-end;background:var(--rose);color:#fff;border-radius:14px 14px 4px 14px}
.ff-bubble-assistant{align-self:flex-start;background:var(--bg-1);border:1px solid var(--border);color:var(--text-0);border-radius:14px 14px 14px 4px;box-shadow:var(--shadow-sm)}
.ff-bubble-system{align-self:center;color:var(--text-3);font-style:italic;font-size:.78rem;border:none;background:none;padding:2px 0}
.ff-media-bar{display:flex;align-items:center;gap:6px;margin-top:10px;flex-wrap:wrap}
.ff-media-btn{width:var(--media-btn-size);height:var(--media-btn-size);border-radius:10px;color:var(--text-2);border-color:var(--border);background:var(--bg-1);box-shadow:var(--shadow-sm);transition:all .15s}
.ff-media-btn:hover{color:var(--rose);border-color:var(--rose-border);background:var(--rose-dim)}
.ff-media-btn.is-active-voice{color:var(--rose);border-color:var(--rose-border);background:var(--rose-dim)}
.ff-media-btn.is-active-stop{color:var(--err);border-color:rgba(192,57,43,.3);background:rgba(192,57,43,.07)}
.ff-media-btn.is-muted{color:var(--warn);border-color:rgba(184,110,0,.3);background:rgba(184,110,0,.07)}
.ff-media-divider{width:1px;height:24px;background:var(--border);margin:0 2px;flex-shrink:0}
.ff-input,select.ff-input{width:100%;background:var(--bg-1);color:var(--text-0);border:1px solid var(--border);border-radius:10px;padding:10px 14px;font-family:var(--sans)!important;font-size:.9rem;box-shadow:var(--shadow-sm);transition:border-color .15s,box-shadow .15s}
.ff-input::placeholder{color:var(--text-3);opacity:1}
.ff-input:focus{outline:none;border-color:var(--rose-mid);box-shadow:0 0 0 3px var(--rose-dim)}
.ff-form-grid{display:grid;grid-template-columns:1fr;gap:14px}
.ff-form-grid label span{display:block;font-size:.8rem;color:var(--text-2);margin-bottom:5px;font-weight:500;letter-spacing:.03em}
.full-span{grid-column:1/-1}
.ff-fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:14px;grid-column:1/-1}
.ff-fieldset legend{padding:0 6px;color:var(--text-2);font-size:.85rem}
.ff-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ff-checkline{display:flex;align-items:center;gap:8px;color:var(--text-1);font-size:.9rem}
.ff-settings-grid{display:grid;grid-template-columns:1fr;gap:16px}
.ff-settings-card h3{margin:0 0 8px}
.ff-toggle-list{display:flex;flex-direction:column}
.ff-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--border);cursor:pointer;gap:12px}
.ff-toggle-row:last-child{border-bottom:none}
.ff-toggle-row span{font-size:.9rem;color:var(--text-1);flex:1}
.ff-toggle-switch{position:relative;flex-shrink:0}
.ff-toggle-check{position:absolute;opacity:0;width:0;height:0}
.ff-toggle-pill{display:block;width:42px;height:24px;background:var(--bg-3);border:1px solid var(--border-hi);border-radius:999px;position:relative;transition:all .2s;cursor:pointer}
.ff-toggle-pill::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.ff-toggle-check:checked+.ff-toggle-pill{background:var(--rose);border-color:var(--rose)}
.ff-toggle-check:checked+.ff-toggle-pill::after{transform:translateX(18px)}
.ff-vad-bar{display:flex;align-items:center;gap:4px;margin-top:0;padding:6px 12px;background:var(--bg-2);border:1px solid var(--rose-border);border-radius:10px;width:fit-content}
.ff-vad-dot{width:4px;height:16px;border-radius:2px;background:var(--rose);opacity:.3;transform-origin:center bottom}
.ff-vad-bar.is-speaking .ff-vad-dot:nth-child(1){animation:ff-vad .8s ease-in-out infinite 0s}
.ff-vad-bar.is-speaking .ff-vad-dot:nth-child(2){animation:ff-vad .8s ease-in-out infinite .1s}
.ff-vad-bar.is-speaking .ff-vad-dot:nth-child(3){animation:ff-vad .8s ease-in-out infinite .2s}
.ff-vad-bar.is-speaking .ff-vad-dot:nth-child(4){animation:ff-vad .8s ease-in-out infinite .1s}
.ff-vad-bar.is-speaking .ff-vad-dot:nth-child(5){animation:ff-vad .8s ease-in-out infinite 0s}
@keyframes ff-vad{0%,100%{height:4px;opacity:.2}50%{height:20px;opacity:1}}
.ff-vad-label{font-size:.75rem;color:var(--rose);margin-left:6px;font-family:var(--mono)!important}
/* ── Stepper ── */
.ns-stepper{display:flex;align-items:center;margin-bottom:20px;overflow-x:auto;scrollbar-width:none;gap:0;padding:4px 0}
.ns-stepper::-webkit-scrollbar{display:none}
.ns-step{display:flex;flex-direction:column;align-items:center;flex-shrink:0}
.ns-step-dot{width:32px;height:32px;border-radius:50%;border:2px solid var(--border);background:var(--bg-1);display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:600;color:var(--text-3);position:relative;z-index:1;transition:all .25s;box-shadow:var(--shadow-sm)}
.ns-step.done .ns-step-dot{background:var(--rose);border-color:var(--rose);color:#fff;box-shadow:0 2px 8px rgba(44,196,176,.3)}
.ns-step.active .ns-step-dot{border-color:var(--rose);color:var(--rose);background:var(--blush)}
.ns-step-label{font-size:.7rem;color:var(--text-3);margin-top:5px;white-space:nowrap;letter-spacing:.04em}
.ns-step.active .ns-step-label{color:var(--rose);font-weight:600}
.ns-step.done .ns-step-label{color:var(--text-2)}
.ns-step-line{flex:1;height:1.5px;background:var(--border);margin-bottom:20px;min-width:20px}
.ns-step-line.done{background:var(--rose)}
/* ── Chips ── */
.ns-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ns-chip{padding:8px 16px;border-radius:999px;font-size:.85rem;font-weight:500;border:1.5px solid var(--border);background:var(--bg-1);color:var(--text-1);cursor:pointer;transition:all .15s;box-shadow:var(--shadow-sm)}
.ns-chip:hover{border-color:var(--rose-border);color:var(--rose);background:var(--bg-3)}
.ns-chip.selected{border-color:var(--rose);background:var(--rose);color:#fff;box-shadow:0 2px 6px rgba(44,196,176,.2)}
/* ── Pack cards ── */
.ns-pack-scroll{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none}
.ns-pack-scroll::-webkit-scrollbar{display:none}
.ns-pack-card{min-width:155px;flex-shrink:0;background:var(--bg-1);border:2px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm)}
.ns-pack-card:hover{border-color:var(--rose-border);box-shadow:var(--shadow-md);transform:translateY(-1px)}
.ns-pack-card.selected{border-color:var(--rose);box-shadow:0 4px 14px rgba(44,196,176,.2)}
.ns-pack-thumb{height:86px;display:flex;align-items:center;justify-content:center;font-size:38px;background:var(--bg-3);overflow:hidden}
.ns-pack-card.selected .ns-pack-thumb{background:var(--blush-deep)}
.ns-pack-body{padding:12px 14px}
.ns-pack-name{font-size:.9rem;font-weight:600;color:var(--text-0)}
.ns-pack-price{font-size:.82rem;color:var(--rose);margin-top:3px;font-weight:600}
.ns-pack-time{font-size:.78rem;color:var(--text-3);margin-top:1px}
/* ── Shape grid ── */
.ns-shape-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:12px}
.ns-shape-item{display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer}
.ns-shape-icon{width:48px;height:64px;border-radius:10px;border:2px solid var(--border);background:var(--bg-3);display:flex;align-items:center;justify-content:center;font-size:24px;transition:all .15s;box-shadow:var(--shadow-sm)}
.ns-shape-item:hover .ns-shape-icon{border-color:var(--rose-border);background:var(--bg-4)}
.ns-shape-item.selected .ns-shape-icon{border-color:var(--rose);background:var(--blush);box-shadow:0 2px 8px rgba(44,196,176,.25)}
.ns-shape-label{font-size:.7rem;color:var(--text-2);text-align:center;font-weight:500}
.ns-shape-item.selected .ns-shape-label{color:var(--rose);font-weight:600}
/* ── Color grid ── */
.ns-color-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin-top:12px}
.ns-color-swatch{aspect-ratio:1;border-radius:50%;cursor:pointer;border:2px solid transparent;box-shadow:0 1px 3px rgba(0,0,0,.15),inset 0 0 0 1px rgba(0,0,0,.06);transition:all .15s;position:relative}
.ns-color-swatch:hover{transform:scale(1.12);box-shadow:0 3px 8px rgba(0,0,0,.2)}
.ns-color-swatch.selected{border-color:var(--text-0);transform:scale(1.2);box-shadow:0 3px 10px rgba(0,0,0,.25)}
.ns-color-swatch.selected::after{content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:white;text-shadow:0 1px 3px rgba(0,0,0,.8);font-weight:700}
/* ── Date/Time ── */
.ns-date-scroll{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-top:10px;padding-bottom:4px}
.ns-date-scroll::-webkit-scrollbar{display:none}
.ns-date-pill{min-width:58px;padding:10px;border-radius:var(--radius-lg);text-align:center;cursor:pointer;border:1.5px solid var(--border);background:var(--bg-1);transition:all .15s;flex-shrink:0;box-shadow:var(--shadow-sm)}
.ns-date-pill:hover{border-color:var(--rose-border);background:var(--bg-3)}
.ns-date-pill.selected{background:var(--rose);border-color:var(--rose);color:#fff;box-shadow:0 2px 8px rgba(44,196,176,.25)}
.ns-date-day{font-size:.68rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:inherit;opacity:.8}
.ns-date-num{font-size:1.3rem;font-weight:700;line-height:1.1;color:inherit}
.ns-time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.ns-time-pill{padding:10px 6px;border-radius:var(--radius);text-align:center;font-size:.85rem;font-weight:500;cursor:pointer;border:1.5px solid var(--border);background:var(--bg-1);transition:all .15s;box-shadow:var(--shadow-sm)}
.ns-time-pill:hover{border-color:var(--rose-border);background:var(--bg-3)}
.ns-time-pill.selected{background:var(--rose);border-color:var(--rose);color:#fff;box-shadow:0 2px 8px rgba(181,97,74,.2)}
.ns-time-pill.taken{opacity:.35;cursor:not-allowed;background:var(--bg-2);box-shadow:none}
/* ── Techs ── */
.ns-tech-scroll{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin-top:10px}
.ns-tech-scroll::-webkit-scrollbar{display:none}
.ns-tech-card{min-width:108px;flex-shrink:0;background:var(--bg-1);border:2px solid var(--border);border-radius:var(--radius-lg);padding:16px 12px;text-align:center;cursor:pointer;transition:all .2s;box-shadow:var(--shadow-sm)}
.ns-tech-card:hover{border-color:var(--rose-border);box-shadow:var(--shadow-md);transform:translateY(-1px)}
.ns-tech-card.selected{border-color:var(--rose);background:var(--blush);box-shadow:0 3px 10px rgba(44,196,176,.2)}
.ns-tech-avatar{width:46px;height:46px;border-radius:50%;margin:0 auto 10px;font-size:24px;display:flex;align-items:center;justify-content:center;background:var(--bg-4)}
.ns-tech-name{font-size:.82rem;font-weight:600;color:var(--text-0)}
.ns-tech-tag{font-size:.72rem;color:var(--text-2);margin-top:3px}
/* ── Order summary ── */
.ns-price-row{display:flex;justify-content:space-between;font-size:.88rem;padding:7px 0;border-bottom:1px solid var(--border);color:var(--text-1)}
.ns-price-total{display:flex;justify-content:space-between;font-size:1.05rem;font-weight:700;padding:10px 0;color:var(--text-0)}
.ns-price-deposit{display:flex;justify-content:space-between;font-size:1.05rem;font-weight:700;padding:8px 0;color:var(--rose)}
/* ── Dashboard ── */
.ns-appt-row{background:var(--bg-1);border:1px solid var(--border);border-left:4px solid var(--rose);border-radius:var(--radius-lg);padding:14px 16px;margin-bottom:10px;display:flex;gap:14px;align-items:flex-start;cursor:pointer;transition:all .15s;box-shadow:var(--shadow-sm)}
.ns-appt-row:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}
.ns-appt-row.flagged{border-left-color:var(--warn)}
.ns-appt-time{font-size:1.3rem;font-weight:700;color:var(--rose);min-width:52px;line-height:1}
.ns-appt-time small{display:block;font-size:.7rem;color:var(--text-3);font-weight:500;margin-top:1px}
.ns-appt-info{flex:1}
.ns-appt-name{font-size:.95rem;font-weight:600;color:var(--text-0)}
.ns-appt-detail{font-size:.83rem;color:var(--text-2);margin-top:3px}
.ns-appt-expand{margin-top:12px;padding-top:12px;border-top:1px solid var(--border);display:flex;gap:8px;flex-wrap:wrap}
/* ── Badges ── */
.ns-badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;font-size:.72rem;font-weight:600;margin-top:5px;margin-right:4px;letter-spacing:.02em}
.ns-badge-new{background:var(--rose-dim);border:1px solid var(--rose-border);color:var(--rose)}
.ns-badge-ready{background:rgba(45,122,90,.07);border:1px solid rgba(45,122,90,.25);color:var(--ok)}
.ns-badge-pending{background:rgba(184,110,0,.07);border:1px solid rgba(184,110,0,.25);color:var(--warn)}
.ns-badge-deposit{background:var(--bg-2);border:1px solid var(--border-hi);color:var(--text-2)}
/* ── Style board ── */
.ns-board-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}
.ns-board-item{border-radius:var(--radius);overflow:hidden;border:2px solid var(--border);background:var(--blush);cursor:pointer;transition:all .15s;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:38px;box-shadow:var(--shadow-sm)}
.ns-board-item:hover{border-color:var(--rose-border);box-shadow:var(--shadow-md)}
.ns-board-add{border-style:dashed;color:var(--text-3);flex-direction:column;gap:6px;font-size:.82rem;background:var(--bg-2)}
.ns-board-add span{font-size:24px}
/* ── Misc ── */
.ff-mini-stats{display:grid;grid-template-columns:1fr;gap:8px}
.ff-mini-stats div{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);font-size:.88rem}
.ff-mini-stats span{color:var(--text-2)}
.ff-history-list{display:grid;gap:10px}
.ff-history-item{background:var(--bg-1);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px;box-shadow:var(--shadow-sm)}
.ff-hidden{display:none!important}
.ff-help{color:var(--text-2);line-height:1.6;font-size:.88rem;margin:0}
.ff-status-row{display:flex;justify-content:space-between;gap:10px;margin:0 0 12px;color:var(--text-2);font-size:.82rem;flex-wrap:wrap}
.ff-columns{display:grid;grid-template-columns:1fr;gap:14px}
.ff-build-footer{margin-top:20px;text-align:right;font-family:var(--mono)!important;font-size:.78rem;color:var(--text-3)}
audio#remoteAudio{width:0;height:0;opacity:0;position:absolute;pointer-events:none}
/* ── Profile section headers ── */
.ns-section-title{font-size:.75rem;font-weight:600;color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid var(--border)}
/* ── Dashboard header ── */
.ns-dash-date{font-size:.88rem;color:var(--text-2);font-weight:500}
/* ── Loyalty bar ── */
.ns-loyalty-bar{height:6px;border-radius:999px;background:var(--bg-3);overflow:hidden;margin:8px 0 4px}
.ns-loyalty-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--rose),var(--gold))}
/* ── Profile avatar ── */
.ns-profile-avatar{width:64px;height:64px;border-radius:50%;background:var(--bg-4);display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;border:3px solid var(--rose-border)}
/* ── Responsive ── */
@media(min-width:640px){
  .ff-shell{padding:16px 20px}
  .ff-hero h1{font-size:2rem}
  .ff-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ff-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ff-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ff-settings-grid .full-span{grid-column:1/-1}
  .ns-color-grid{grid-template-columns:repeat(10,1fr)}
  .ns-time-grid{grid-template-columns:repeat(4,1fr)}
  .ns-board-grid{grid-template-columns:repeat(4,1fr)}
}
@media(min-width:960px){
  .ff-shell{padding:20px 28px}
  .ff-grid{grid-template-columns:minmax(0,2fr) minmax(280px,1fr)}
  .ff-side{display:block}
  .ff-chatlog{max-height:380px}
  .ns-color-grid{grid-template-columns:repeat(12,1fr)}
}

/* ── Live booking summary strip ──────────────────────────────────── */
.ns-summary-strip {
  background: var(--bg-2);
  border: 1px solid var(--rose-border);
  border-radius: var(--radius-lg);
  padding: 10px 14px;
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
  animation: ns-strip-in .2s ease;
}
@keyframes ns-strip-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
.ns-sum-pills { display:flex; flex-wrap:wrap; gap:5px; flex:1; }
.ns-sum-pill {
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: .78rem;
  color: var(--text-1);
  font-weight: 500;
  white-space: nowrap;
}
.ns-sum-pill.ns-sum-pill-hi {
  background: var(--rose-dim);
  border-color: var(--rose-border);
  color: var(--rose);
  font-weight: 600;
}
.ns-sum-price {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  padding-top: 2px;
}
.ns-sum-dur {
  font-size: .8rem;
  color: var(--text-2);
  font-weight: 500;
}
.ns-sum-total {
  font-size: 1rem;
  font-weight: 700;
  color: var(--rose);
}

/* ── Pack card description line ─────────────────────────────────── */
.ns-pack-desc {
  font-size: .74rem;
  color: var(--text-2);
  margin-top: 2px;
  margin-bottom: 4px;
  line-height: 1.35;
  font-style: italic;
}

/* ── Add-on grid ─────────────────────────────────────────────────── */
.ns-addon-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.ns-addon-chip {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 13px;
  border-radius: var(--radius);
  border: 1.5px solid var(--border);
  background: var(--bg-1);
  cursor: pointer;
  transition: all .15s;
  box-shadow: var(--shadow-sm);
  gap: 6px;
}
.ns-addon-chip:hover { border-color: var(--rose-border); background: var(--blush); }
.ns-addon-chip.selected { border-color: var(--rose); background: var(--rose-dim); }
.ns-addon-name { font-size: .84rem; font-weight: 500; color: var(--text-0); }
.ns-addon-price {
  font-size: .8rem;
  font-weight: 700;
  color: var(--text-2);
  white-space: nowrap;
}
.ns-addon-chip.selected .ns-addon-price { color: var(--rose); }

/* ── Assist card ─────────────────────────────────────────────────── */
.ns-assist-card {
  border-style: dashed;
  border-color: var(--border-hi);
  background: var(--bg-2);
}

/* ── Voice hints ─────────────────────────────────────────────────── */
.ns-voice-hints { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }
.ns-voice-hint {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: .82rem;
  color: var(--text-1);
  font-weight: 500;
  cursor: default;
  transition: background .15s;
}
.ns-voice-hint:hover { background: var(--blush); border-color: var(--rose-border); color: var(--rose); }

/* ── Compact chips for column layout (length/art) ────────────────── */
.ns-chips-col { flex-direction: column; }
.ns-chips-col .ns-chip { width: 100%; }

/* ── Responsive add-on grid ─────────────────────────────────────── */
@media (min-width: 640px) {
  .ns-addon-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 960px) {
  .ns-addon-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ══════════════════════════════════════════════════════════════════
   CAMERA / MEDIA MODULE
   ══════════════════════════════════════════════════════════════════ */

/* ── Camera card in style board ─────────────────────────────────── */
.ns-camera-card { border-color: var(--rose-border); background: var(--bg-2); }

.ns-camera-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.ns-cam-btn {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 130px;
  justify-content: center;
}

/* ── Photo grid ──────────────────────────────────────────────────── */
.ns-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 10px;
}
.ns-photo-grid-item {
  position: relative;
  aspect-ratio: 1;
  border-radius: var(--radius);
  overflow: hidden;
  border: 2px solid var(--border);
  background: var(--bg-2);
  box-shadow: var(--shadow-sm);
  animation: ns-grid-in .2s ease;
}
@keyframes ns-grid-in { from { opacity:0; transform:scale(.92); } to { opacity:1; transform:none; } }
@keyframes ns-fade-out { to { opacity:0; transform:scale(.88); } }

.ns-grid-img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: filter .3s;
}
.ns-photo-uploading { filter: blur(2px) brightness(.85); }

.ns-photo-badge {
  position: absolute;
  bottom: 4px; left: 4px;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: .68rem;
  font-weight: 600;
  pointer-events: none;
}
.ns-photo-badge-ok   { background: rgba(45,122,90,.85); color: #fff; }
.ns-photo-badge-warn { background: rgba(184,110,0,.85);  color: #fff; }

.ns-photo-remove {
  position: absolute;
  top: 4px; right: 4px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: .72rem;
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transition: opacity .15s;
}
.ns-photo-grid-item:hover .ns-photo-remove { opacity: 1; }

/* Loading placeholder */
.ns-photo-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--text-3);
  font-size: .74rem;
  background: var(--bg-3);
}
.ns-photo-spinner {
  width: 20px; height: 20px;
  border: 2px solid var(--border);
  border-top-color: var(--rose);
  border-radius: 50%;
  animation: ns-spin .7s linear infinite;
}
@keyframes ns-spin { to { transform: rotate(360deg); } }

/* Upload status message */
.ns-upload-status {
  font-size: .8rem;
  font-weight: 500;
  margin-top: 8px;
  padding: 6px 10px;
  border-radius: 8px;
  background: var(--bg-2);
  animation: ns-grid-in .2s ease;
}

/* ── Console photo bubble ────────────────────────────────────────── */
.ns-photo-bubble {
  display: flex;
  flex-direction: column;
  gap: 5px;
  max-width: 200px;
}
.ns-photo-preview {
  width: 100%;
  border-radius: 10px;
  display: block;
  object-fit: cover;
  max-height: 200px;
  transition: filter .4s;
}
.ns-photo-uploading { filter: blur(3px) brightness(.8); }
.ns-photo-status {
  font-size: .75rem;
  font-weight: 600;
  color: var(--text-2);
  transition: opacity .4s;
}

/* ── Mobile bottom sheet ─────────────────────────────────────────── */
.ns-sheet-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.35);
  display: flex; align-items: flex-end;
  animation: ns-overlay-in .15s ease;
}
@keyframes ns-overlay-in { from { opacity:0; } to { opacity:1; } }
.ns-sheet-out { animation: ns-overlay-out .2s ease forwards; }
@keyframes ns-overlay-out { to { opacity:0; } }

.ns-sheet {
  background: var(--bg-1);
  border-top-left-radius: 18px;
  border-top-right-radius: 18px;
  padding: 24px 20px 32px;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 -8px 32px rgba(0,0,0,.15);
  animation: ns-sheet-up .2s cubic-bezier(.22,1,.36,1);
}
@keyframes ns-sheet-up { from { transform:translateY(60px); opacity:.4; } to { transform:none; opacity:1; } }

.ns-sheet-title {
  text-align: center;
  font-weight: 600;
  color: var(--text-1);
  margin: 0 0 4px;
  font-size: .95rem;
}
.ns-sheet-btn { width: 100%; justify-content: center; }
.ns-sheet-cancel { color: var(--text-2); }

/* ── Camera button active state ──────────────────────────────────── */
.ff-media-btn[data-feature="camera"]:hover {
  color: var(--rose);
  border-color: var(--rose-border);
  background: var(--rose-dim);
}

/* ── Responsive photo grid ───────────────────────────────────────── */
@media (min-width: 640px) {
  .ns-photo-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 960px) {
  .ns-photo-grid { grid-template-columns: repeat(5, 1fr); }
}

/* ══════════════════════════════════════════════════════════════════
   v1.0.5 ADDITIONS
   ══════════════════════════════════════════════════════════════════ */

/* ── Service type image grid (Workflow step) ────────────────────── */
.ns-service-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-top: 12px;
}
.ns-service-card {
  position: relative;
  border-radius: var(--radius-lg);
  border: 2px solid var(--border);
  overflow: hidden;
  cursor: pointer;
  transition: all .18s;
  background: var(--bg-3);
  box-shadow: var(--shadow-sm);
}
.ns-service-card:hover { border-color: var(--rose-border); box-shadow: var(--shadow-md); }
.ns-service-card.selected {
  border-color: var(--rose);
  box-shadow: 0 0 0 2px rgba(44,196,176,.25), var(--shadow-md);
}
.ns-service-img-wrap {
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--bg-4);
}
.ns-service-img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .3s;
}
.ns-service-card:hover .ns-service-img { transform: scale(1.04); }
.ns-service-label {
  padding: 9px 12px;
  font-size: .85rem;
  font-weight: 600;
  color: var(--text-0);
  background: var(--bg-2);
  border-top: 1px solid var(--border);
}
.ns-service-card.selected .ns-service-label { color: var(--rose); background: var(--blush); }
.ns-service-check {
  position: absolute;
  top: 8px; right: 8px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--rose);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transition: opacity .15s, transform .15s;
  transform: scale(.7);
  box-shadow: 0 2px 6px rgba(0,0,0,.35);
}
.ns-service-card.selected .ns-service-check { opacity: 1; transform: scale(1); }

/* ── Pack card image upgrade ────────────────────────────────────── */
.ns-pack-img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .3s;
}
.ns-pack-card:hover .ns-pack-img { transform: scale(1.05); }
.ns-pack-card.selected .ns-pack-thumb { border-bottom: 2px solid var(--rose); }
.ns-pack-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 6px;
}
.ns-pack-check {
  position: absolute;
  top: 7px; right: 7px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--rose);
  color: #fff;
  font-size: .7rem;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  transition: opacity .15s;
  box-shadow: 0 2px 6px rgba(0,0,0,.4);
}
.ns-pack-card { position: relative; }

/* ── Try Saying collapsible panel (mobile Console) ──────────────── */
.ns-try-saying-panel {
  margin-top: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--bg-2);
}
.ns-try-saying-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: none;
  border: none;
  cursor: pointer;
  font-family: var(--sans);
  font-size: .88rem;
  font-weight: 600;
  color: var(--text-1);
  text-align: left;
}
.ns-try-saying-toggle:hover { background: var(--bg-3); }
.ns-chevron { transition: transform .2s; flex-shrink: 0; }
.ns-try-saying-body { padding: 0 16px; }

/* Try saying panel always visible — sidebar no longer duplicates it */
.ns-try-saying-panel { display: block; }

/* ── Voice hint hover for dark theme ────────────────────────────── */
.ns-voice-hint:hover { background: var(--bg-3); border-color: var(--rose-border); color: var(--rose); }

/* ── Assist card dark fix ───────────────────────────────────────── */
.ns-assist-card { border-style: dashed; border-color: var(--border-hi); background: var(--bg-2); }

/* ── Service grid responsive ────────────────────────────────────── */
@media (min-width: 640px) {
  .ns-service-grid { grid-template-columns: repeat(4, 1fr); }
}

/* ══════════════════════════════════════════════════════════════════
   VOICENAV HIGHLIGHT STATES
   ══════════════════════════════════════════════════════════════════ */

/* vn-flash: one-shot pulse for focusElement (input fields, buttons) */
.vn-flash {
  animation: vn-flash-anim 1.1s ease forwards !important;
  outline: 2px solid var(--rose) !important;
  outline-offset: 2px;
}
@keyframes vn-flash-anim {
  0%   { box-shadow: 0 0 0 0   rgba(44,196,176,.6); }
  40%  { box-shadow: 0 0 0 8px rgba(44,196,176,.2); }
  100% { box-shadow: 0 0 0 0   rgba(44,196,176,0);  outline-color: transparent; }
}

/* vn-highlight: persistent pulse for option cards/chips — stays until selectOption clears it */
.vn-highlight {
  outline: 2.5px solid var(--rose) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 5px rgba(44,196,176,.18), var(--shadow-md) !important;
  animation: vn-highlight-pulse 1.4s ease-in-out infinite !important;
  position: relative;
  z-index: 10;
}
@keyframes vn-highlight-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(44,196,176,.15), var(--shadow-md); }
  50%       { box-shadow: 0 0 0 8px rgba(44,196,176,.30), var(--shadow-md); }
}

/* Works on links too (Contact tab call/text buttons) */
a.vn-highlight, a.vn-flash {
  outline: 2.5px solid var(--rose) !important;
}

/* ══════════════════════════════════════════════════════════════════
   v1.0.6 — VIEW MODE TOGGLE + WIZARD GUIDE + STRONGER SELECTED STATES
   ══════════════════════════════════════════════════════════════════ */

/* ── View Mode segmented pill ───────────────────────────────────── */
.vm-pill {
  display: inline-flex;
  flex-direction: column;
  gap: 10px;
}
.vm-track {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--bg-3);
  border: 1px solid var(--border-hi);
  border-radius: 999px;
  padding: 4px;
  cursor: pointer;
  font-family: var(--sans);
  font-size: .88rem;
  gap: 0;
  width: 280px;
  max-width: 100%;
  overflow: hidden;
}
.vm-track:disabled { opacity: .45; cursor: not-allowed; }
.vm-track span:not(.vm-slider) {
  position: relative;
  z-index: 2;
  padding: 8px 12px;
  text-align: center;
  color: var(--text-1);
  font-weight: 500;
  font-size: .85rem;
  transition: color .2s;
  white-space: nowrap;
  pointer-events: none;
}
.vm-slider {
  position: absolute !important;
  top: 4px; left: 4px;
  width: calc(50% - 4px);
  height: calc(100% - 8px);
  background: var(--rose);
  border-radius: 999px;
  transition: transform .22s cubic-bezier(.4,0,.2,1);
  z-index: 1 !important;
  padding: 0 !important;
  box-shadow: 0 2px 8px rgba(224,114,90,.35);
}
/* Business mode: slider on left, business label white */
[data-mode="business"] .vm-label-business { color: #fff; font-weight: 700 !important; }
[data-mode="business"] .vm-slider { transform: translateX(0) !important; }
/* Customer mode: slider on right, customer label white */
[data-mode="customer"] .vm-label-customer { color: #fff; font-weight: 700 !important; }
[data-mode="customer"] .vm-slider { transform: translateX(calc(100% + 0px)) !important; }

.vm-lock {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .8rem;
  color: var(--text-3);
  margin-top: 8px;
}
.vm-desc { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.vm-desc-item {
  padding: 10px 14px;
  border-radius: var(--radius);
  background: var(--bg-2);
  border: 1px solid var(--border);
  font-size: .85rem;
  color: var(--text-2);
  line-height: 1.5;
}
.vm-desc-item strong { color: var(--text-0); }

/* ── Wizard guide banner ────────────────────────────────────────── */
.ns-wizard-guide {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: var(--bg-2);
  border: 1px solid var(--border-hi);
  border-left: 3px solid var(--rose);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  margin-bottom: 14px;
}
.ns-wizard-guide-icon {
  font-size: 1.4rem;
  flex-shrink: 0;
  line-height: 1;
  margin-top: 1px;
}
.ns-wizard-guide-title {
  font-size: .92rem;
  font-weight: 700;
  color: var(--text-0);
  margin-bottom: 3px;
}
.ns-wizard-guide-text {
  font-size: .83rem;
  color: var(--text-2);
  line-height: 1.5;
}

/* ══════════════════════════════════════════════════════════════════
   DRAMATICALLY STRONGER SELECTED STATES
   Every selectable element needs to be UNMISTAKABLY selected
   ══════════════════════════════════════════════════════════════════ */

/* ── Chip: unselected vs selected ───────────────────────────────── */
.ns-chip {
  padding: 9px 18px;
  border-radius: 999px;
  font-size: .88rem;
  font-weight: 500;
  border: 2px solid var(--border-hi);
  background: var(--bg-2);
  color: var(--text-2);
  cursor: pointer;
  transition: all .15s;
  user-select: none;
}
.ns-chip:hover { border-color: var(--rose-border); color: var(--rose); background: var(--bg-3); }
.ns-chip.selected {
  border-color: var(--rose) !important;
  background: var(--rose) !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 10px rgba(224,114,90,.4) !important;
  transform: scale(1.04);
}

/* ── Service card: unselected vs selected ───────────────────────── */
.ns-service-card.selected {
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(224,114,90,.3), var(--shadow-md) !important;
}
.ns-service-card.selected .ns-service-label {
  background: var(--rose) !important;
  color: #fff !important;
  font-weight: 700;
}

/* ── Pack card: unselected vs selected ──────────────────────────── */
.ns-pack-card.selected {
  border-color: var(--rose) !important;
  box-shadow: 0 0 0 3px rgba(224,114,90,.3), var(--shadow-md) !important;
  transform: translateY(-3px);
}
.ns-pack-card.selected .ns-pack-name { color: var(--rose) !important; }
.ns-pack-card.selected .ns-pack-thumb { border-bottom: 3px solid var(--rose); }

/* ── Shape item: unselected vs selected ─────────────────────────── */
.ns-shape-item.selected .ns-shape-icon {
  border-color: var(--rose) !important;
  background: var(--rose) !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(224,114,90,.4) !important;
  transform: scale(1.08);
}
.ns-shape-item.selected .ns-shape-label {
  color: var(--rose) !important;
  font-weight: 700 !important;
}

/* ── Date pill: selected ────────────────────────────────────────── */
.ns-date-pill.selected {
  background: var(--rose) !important;
  border-color: var(--rose) !important;
  color: #fff !important;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(224,114,90,.4) !important;
  transform: scale(1.06);
}

/* ── Time pill: selected ────────────────────────────────────────── */
.ns-time-pill.selected {
  background: var(--rose) !important;
  border-color: var(--rose) !important;
  color: #fff !important;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(224,114,90,.4) !important;
}

/* ── Tech card: selected ────────────────────────────────────────── */
.ns-tech-card.selected {
  border-color: var(--rose) !important;
  background: var(--blush) !important;
  box-shadow: 0 0 0 3px rgba(44,196,176,.25), var(--shadow-md) !important;
}
.ns-tech-card.selected .ns-tech-name { color: var(--rose) !important; font-weight: 700; }

/* ── Addon chip: selected ───────────────────────────────────────── */
.ns-addon-chip.selected {
  border-color: var(--rose) !important;
  background: var(--rose) !important;
  color: #fff !important;
}
.ns-addon-chip.selected .ns-addon-name,
.ns-addon-chip.selected .ns-addon-price { color: #fff !important; }

/* ══════════════════════════════════════════════════════════════════
   v1.0.7 — WEEK CALENDAR + PACK EDITOR + VIEW MODE GATES
   ══════════════════════════════════════════════════════════════════ */

/* ── Upcoming appointments week calendar (business history) ─────── */
.ns-cal-week {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.ns-cal-col {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-width: 80px;
}
.ns-cal-today {
  border-color: var(--rose);
  box-shadow: 0 0 0 1px var(--rose);
}
.ns-cal-day-header {
  background: var(--bg-3);
  padding: 8px 6px;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
.ns-cal-today .ns-cal-day-header { background: var(--rose); }
.ns-cal-day-name {
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-3);
}
.ns-cal-today .ns-cal-day-name { color: rgba(255,255,255,.8); }
.ns-cal-day-num {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--text-0);
  line-height: 1.1;
}
.ns-cal-today .ns-cal-day-num { color: #fff; }
.ns-cal-slots { padding: 6px 4px; display: flex; flex-direction: column; gap: 4px; min-height: 60px; }
.ns-cal-empty {
  font-size: .72rem;
  color: var(--text-3);
  text-align: center;
  padding: 8px 0;
  font-style: italic;
}
.ns-cal-appt {
  border-radius: 6px;
  padding: 5px 6px;
  border-left: 3px solid var(--rose);
  background: var(--bg-1);
  cursor: pointer;
  transition: box-shadow .15s;
}
.ns-cal-appt:hover { box-shadow: var(--shadow-sm); }
.ns-cal-status-ready  { border-left-color: var(--ok); }
.ns-cal-status-pending { border-left-color: var(--warn); }
.ns-cal-appt-time { font-size: .62rem; color: var(--text-3); font-weight: 600; }
.ns-cal-appt-name { font-size: .72rem; font-weight: 700; color: var(--text-0); margin-top: 1px; }
.ns-cal-appt-svc  { font-size: .65rem; color: var(--text-2); }

/* Responsive: scroll horizontally on mobile */
@media (max-width: 640px) {
  .ns-cal-week { grid-template-columns: repeat(7, minmax(72px, 1fr)); }
}

/* ── Pack editor button (business only) ─────────────────────────── */
.ns-pack-edit-btn {
  position: absolute;
  bottom: 8px; right: 8px;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--bg-3);
  border: 1px solid var(--border-hi);
  font-size: .8rem;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity .15s;
  z-index: 20;
  color: var(--text-1);
}
.ns-pack-card:hover .ns-pack-edit-btn { opacity: 1; }

/* ── Pack editor sheet ───────────────────────────────────────────── */
.ns-sheet-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.ns-sheet-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-2);
  font-size: 1rem;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius);
}
.ns-sheet-close:hover { background: var(--bg-3); color: var(--text-0); }

/* ══════════════════════════════════════════════════════════════════
   v1.0.9 — PARTY BOOKING + EDITABLE SELECTIONS SIDEBAR
   ══════════════════════════════════════════════════════════════════ */

/* ── Party member rows on Step 0 ────────────────────────────────── */
.ns-party-members { display: flex; flex-direction: column; gap: 8px; }

.ns-party-row {
  display: grid;
  grid-template-columns: 36px 1fr auto auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: var(--bg-1);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  transition: border-color .15s;
}
.ns-party-row.active {
  border-color: var(--rose);
  background: var(--blush);
}

.ns-party-avatar {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--bg-3);
  border: 2px solid var(--border);
  font-size: 1.1rem;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: border-color .15s, transform .15s;
}
.ns-party-row.active .ns-party-avatar {
  border-color: var(--rose);
  transform: scale(1.08);
}

.ns-party-name-input {
  font-size: .88rem !important;
  padding: 6px 10px !important;
  height: 34px !important;
}

.ns-party-status { font-size: .72rem; white-space: nowrap; }
.ns-party-badge {
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 600;
  font-size: .7rem;
}
.ns-party-badge.done    { background: rgba(82,196,130,.18); color: var(--ok); }
.ns-party-badge.partial { background: rgba(240,180,0,.15);  color: var(--warn); }
.ns-party-badge.empty   { background: var(--bg-3);          color: var(--text-3); }

.ns-party-remove {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: none;
  border: 1px solid var(--border);
  color: var(--text-3);
  font-size: .75rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s, color .12s;
}
.ns-party-remove:hover { background: var(--rose); color: #fff; border-color: var(--rose); }

.ns-party-add {
  width: 100%;
  border-style: dashed !important;
}

/* ── Party tabs in sidebar ───────────────────────────────────────── */
.ns-party-tabs {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.ns-party-tab {
  padding: 4px 10px;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 600;
  border: 1.5px solid var(--border-hi);
  background: var(--bg-2);
  color: var(--text-2);
  cursor: pointer;
  transition: all .12s;
}
.ns-party-tab.active {
  background: var(--rose);
  border-color: var(--rose);
  color: #fff;
}

/* ── Editable summary rows in sidebar ───────────────────────────── */
.ns-sum-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 4px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
}
.ns-sum-row:last-of-type { border-bottom: none; }

.ns-sum-row-label {
  font-size: .78rem;
  color: var(--text-3);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 600;
  grid-column: 1;
  grid-row: 1;
}
.ns-sum-row-value {
  font-size: .85rem;
  font-weight: 700;
  color: var(--text-0);
  text-align: right;
  grid-column: 1 / 3;
  grid-row: 2;
}
.ns-sum-row-actions {
  display: flex;
  gap: 3px;
  align-items: center;
  grid-column: 3;
  grid-row: 1 / 3;
}
.ns-sum-edit, .ns-sum-clear {
  width: 24px; height: 24px;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--bg-2);
  font-size: .72rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .12s, border-color .12s;
  color: var(--text-2);
  flex-shrink: 0;
}
.ns-sum-edit:hover  { background: var(--bg-3); border-color: var(--rose); color: var(--rose); }
.ns-sum-clear:hover { background: rgba(44,196,176,.15); border-color: var(--rose); color: var(--rose); }

.ns-sum-empty {
  font-size: .82rem;
  color: var(--text-3);
  font-style: italic;
  padding: 8px 0;
}
.ns-sum-grand-total {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border-hi);
  font-size: .82rem;
  color: var(--text-2);
  text-align: right;
}
.ns-sum-grand-total strong { color: var(--rose); }

/* ══════════════════════════════════════════════════════════════════
   MINDMIRROR-SPECIFIC COMPONENTS
   ══════════════════════════════════════════════════════════════════ */

/* ── MindMirror list items (sessions, entries, loops, anchors) ───── */
.mm-list { display: flex; flex-direction: column; gap: 8px; }
.mm-item {
  background: var(--bg-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 12px 14px;
  box-shadow: var(--shadow-sm);
}
.mm-item-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  font-weight: 600;
  font-size: .9rem;
  color: var(--text-0);
  flex-wrap: wrap;
}
.mm-item-meta {
  color: var(--text-2);
  font-size: .82rem;
  margin-top: 5px;
  line-height: 1.5;
  white-space: pre-wrap;
}
.mm-item-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  flex-shrink: 0;
}
.mm-item-empty {
  color: var(--text-3);
  font-size: .88rem;
  font-style: italic;
  padding: 10px 0;
  text-align: center;
}

/* ── Session active indicator ───────────────────────────────────── */
.mm-item.is-active {
  border-color: var(--rose-border);
  background: var(--blush);
}

/* ── Insight card ────────────────────────────────────────────────── */
.ff-notice {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  font-size: .88rem;
  line-height: 1.5;
}
.ff-notice.info { background: rgba(44,196,176,.07); border-color: rgba(44,196,176,.25); }
.ff-notice.warn { background: rgba(212,168,67,.07); border-color: rgba(212,168,67,.28); }
.ff-notice.ok   { background: rgba(58,170,110,.07); border-color: rgba(58,170,110,.28); }

/* ── Active session sidebar card ─────────────────────────────────── */
#activeSesionCard { border-color: var(--rose-border); }

/* Voice button: red/active state when session is live */
#ffConsoleStart[aria-pressed="true"],
#voiceToggle[aria-pressed="true"] {
  background: rgba(220,38,38,.15) !important;
  border-color: rgba(220,38,38,.5) !important;
  color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(220,38,38,.15);
}
/* Hide LIVE pill — voice button color conveys live state */
#ffVoicePill { display: none !important; }
/* ── Tab nav — underline style (factory standard) ───────────────────────── */
.ff-tabs {
  display: flex; gap: 0; flex-wrap: nowrap;
  padding: 10px 0 0; border-bottom: 2px solid var(--border);
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; overscroll-behavior-x: contain;
  align-items: flex-end;
}
.ff-tabs::-webkit-scrollbar { display: none; }
.ff-tab {
  background: none; border: none;
  border-bottom: 2px solid transparent; margin-bottom: -2px;
  color: var(--text-2, var(--muted)); padding: 8px 16px;
  font-size: .88rem; font-weight: 500; cursor: pointer;
  font-family: inherit; white-space: nowrap; transition: color .15s;
}
.ff-tab:hover:not(.is-active) { color: var(--text-1, var(--text)); }
.ff-tab.is-active { color: var(--gold); border-bottom-color: var(--gold); font-weight: 600; }
/* ── Space between nav and content ──────────────────────────────────────── */
.tab-panel.is-active { padding-top: 14px; }
