/* ═══════════════════════════════════════════════════════════

   NNI — Booking slot picker · 2026 edition

   Gen-Z UI: gradient rails, chunky controls, micro-interactions.

   Light mode = SOLID opaque fills only (no alpha tints).

   ═══════════════════════════════════════════════════════════ */



.nni-book {

  --nb-bg: #08081C;

  --nb-surface: #12122C;

  --nb-surface-2: #1A1A3D;

  --nb-line: #2C2A5E;

  --nb-line-soft: #22224A;

  --nb-text: #F2F0FF;

  --nb-dim: #A9A5CC;

  --nb-faint: #7C78A8;

  --nb-brand: #8B5CF6;

  --nb-brand-2: #D946EF;

  --nb-brand-3: #22D3EE;

  --nb-grad: linear-gradient(120deg, #8B5CF6 0%, #D946EF 52%, #22D3EE 100%);

  --nb-grad-soft: linear-gradient(120deg, #6D28D9 0%, #A21CAF 100%);

  --nb-ok: #34D399;

  --nb-warn: #FBBF24;

  --nb-shadow: 0 30px 80px -32px rgba(0, 0, 0, .85);



  position: relative;

  overflow: hidden;

  padding: 5rem 0 6rem;

  background: var(--nb-bg);

  color: var(--nb-text);

  border-top: 1px solid var(--nb-line-soft);

  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

}



/* ambient orbs */

.nni-book-glow {

  position: absolute;

  inset: 0;

  pointer-events: none;

  z-index: 0;

}



.nni-book-glow::before,

.nni-book-glow::after {

  content: '';

  position: absolute;

  border-radius: 50%;

  filter: blur(90px);

  opacity: .5;

}



.nni-book-glow::before {

  width: 520px;

  height: 520px;

  top: -180px;

  left: -140px;

  background: radial-gradient(circle, #7C3AED 0%, rgba(10, 10, 30, 0) 70%);

}



.nni-book-glow::after {

  width: 460px;

  height: 460px;

  bottom: -200px;

  right: -120px;

  background: radial-gradient(circle, #0891B2 0%, rgba(10, 10, 30, 0) 70%);

}



.nni-book-inner {

  position: relative;

  z-index: 1;

  max-width: 1040px;

  margin: 0 auto;

  padding: 0 1.25rem;

}



/* ── header ─────────────────────────────────────────────── */

.nni-book-head {

  text-align: center;

  max-width: 760px;

  margin: 0 auto 2rem;

}



.nni-book-badge {

  display: inline-flex;

  align-items: center;

  gap: .5rem;

  padding: .45rem 1.05rem;

  border-radius: 999px;

  font-size: .72rem;

  font-weight: 800;

  letter-spacing: .1em;

  text-transform: uppercase;

  background: #221046;

  color: #D8B4FE;

  border: 1px solid #4C1D95;

}



.nni-book-badge .dot {

  width: 7px;

  height: 7px;

  border-radius: 50%;

  background: #34D399;

  box-shadow: 0 0 0 0 rgba(52, 211, 153, .7);

  animation: nni-pulse 2.2s infinite;

}



@keyframes nni-pulse {

  0%   { box-shadow: 0 0 0 0 rgba(52, 211, 153, .6); }

  70%  { box-shadow: 0 0 0 9px rgba(52, 211, 153, 0); }

  100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); }

}



.nni-book-head h2 {

  font-family: 'Space Grotesk', system-ui, sans-serif;

  font-size: clamp(2rem, 5.2vw, 3.4rem);

  font-weight: 700;

  letter-spacing: -.03em;

  margin: 1.1rem 0 .7rem;

  line-height: 1.05;

  background: var(--nb-grad);

  -webkit-background-clip: text;

  background-clip: text;

  color: transparent;

}



.nni-book-head p {

  color: var(--nb-dim);

  font-size: 1.02rem;

  margin: 0 auto;

  max-width: 620px;

  line-height: 1.6;

}



.nni-book-perks {

  display: flex;

  flex-wrap: wrap;

  gap: .5rem;

  justify-content: center;

  list-style: none;

  margin: 1.5rem 0 0;

  padding: 0;

}



.nni-book-perks li {

  display: inline-flex;

  align-items: center;

  gap: .4rem;

  padding: .42rem .85rem;

  border-radius: 999px;

  background: var(--nb-surface-2);

  border: 1px solid var(--nb-line);

  color: #CFCBF0;

  font-size: .8rem;

  font-weight: 700;

}



.nni-book-perks li b { color: #fff; font-weight: 800; }



.nni-book-proof {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: .75rem;

  margin-top: 1.4rem;

  color: var(--nb-faint);

  font-size: .82rem;

  font-weight: 600;

}



.nni-book-proof .faces { display: flex; }



.nni-book-proof .faces span {

  width: 30px;

  height: 30px;

  border-radius: 50%;

  border: 2px solid var(--nb-bg);

  margin-left: -9px;

  display: grid;

  place-items: center;

  font-size: .68rem;

  font-weight: 800;

  color: #fff;

  background: #6D28D9;

}



.nni-book-proof .faces span:first-child { margin-left: 0; }

.nni-book-proof .faces span:nth-child(2) { background: #C026D3; }

.nni-book-proof .faces span:nth-child(3) { background: #0891B2; }

.nni-book-proof .faces span:nth-child(4) { background: #4F46E5; }

.nni-book-proof b { color: var(--nb-text); }



/* ── control bar ────────────────────────────────────────── */

.nni-book-controls {

  display: flex;

  flex-wrap: wrap;

  gap: 1rem;

  align-items: center;

  justify-content: space-between;

  background: var(--nb-surface);

  border: 1px solid var(--nb-line);

  border-radius: 20px;

  padding: 1rem 1.15rem;

  margin-bottom: 1.25rem;

}



.nni-book-ctrl { display: flex; align-items: center; gap: .7rem; }



.nni-book-ctrl-label {

  font-size: .7rem;

  font-weight: 800;

  letter-spacing: .12em;

  text-transform: uppercase;

  color: var(--nb-faint);

  white-space: nowrap;

}



.nni-book-durs,

.nni-book-tz {

  display: flex;

  gap: .25rem;

  padding: .28rem;

  background: #0D0D24;

  border: 1px solid var(--nb-line-soft);

  border-radius: 14px;

}



.nni-book-durs button,

.nni-book-tz button {

  border: 0;

  background: transparent;

  color: var(--nb-dim);

  font-family: inherit;

  font-size: .84rem;

  font-weight: 800;

  padding: .5rem .85rem;

  border-radius: 11px;

  cursor: pointer;

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), background .18s, color .18s;

  white-space: nowrap;

}



.nni-book-durs button:hover,

.nni-book-tz button:hover { color: #fff; transform: translateY(-1px); }



.nni-book-durs button.is-active,

.nni-book-tz button.is-active {

  background: var(--nb-grad);

  color: #fff;

  box-shadow: 0 8px 20px -10px rgba(139, 92, 246, .9);

}



.nni-book-tz button.is-active { background: var(--nb-grad-soft); }



/* ── progress rail ──────────────────────────────────────── */

.nni-book-rail {

  display: flex;

  align-items: center;

  gap: .9rem;

  margin-bottom: 1.25rem;

  padding: 0 .35rem;

}



.nni-book-rail-track {

  flex: 1;

  height: 6px;

  border-radius: 999px;

  background: var(--nb-line-soft);

  overflow: hidden;

}



.nni-book-rail-track span {

  display: block;

  height: 100%;

  width: 0%;

  border-radius: 999px;

  background: var(--nb-grad);

  transition: width .45s cubic-bezier(.4, 0, .2, 1);

}



.nni-book-rail-steps {

  display: flex;

  gap: .4rem;

  list-style: none;

  margin: 0;

  padding: 0;

}



.nni-book-rail-steps li {

  display: flex;

  align-items: center;

  gap: .45rem;

  font-size: .78rem;

  font-weight: 800;

  color: var(--nb-faint);

  padding: .35rem .7rem;

  border-radius: 999px;

  border: 1px solid transparent;

  transition: .2s;

}



.nni-book-rail-steps li i {

  width: 22px;

  height: 22px;

  border-radius: 50%;

  display: grid;

  place-items: center;

  font-style: normal;

  font-size: .68rem;

  font-weight: 800;

  background: var(--nb-surface-2);

  border: 1px solid var(--nb-line);

  color: var(--nb-faint);

  transition: .2s;

}



.nni-book-rail-steps li.is-active {

  color: var(--nb-text);

  background: var(--nb-surface);

  border-color: var(--nb-line);

}



.nni-book-rail-steps li.is-active i {

  background: var(--nb-grad);

  border-color: transparent;

  color: #fff;

}



.nni-book-rail-steps li.is-done { color: var(--nb-dim); }

.nni-book-rail-steps li.is-done i { background: #14532D; border-color: #166534; color: #6EE7B7; }



/* ── panel ──────────────────────────────────────────────── */

.nni-book-panel {

  background: var(--nb-surface);

  border: 1px solid var(--nb-line);

  border-radius: 26px;

  padding: 1.9rem;

  box-shadow: var(--nb-shadow);

}



.nni-book-step + .nni-book-step {

  margin-top: 1.9rem;

  padding-top: 1.9rem;

  border-top: 1px solid var(--nb-line-soft);

}



.nni-book-step-head {

  display: flex;

  align-items: center;

  gap: .85rem;

  margin-bottom: 1.1rem;

}



.nni-book-num {

  flex-shrink: 0;

  width: 34px;

  height: 34px;

  border-radius: 12px;

  display: grid;

  place-items: center;

  font-weight: 800;

  font-size: .85rem;

  background: var(--nb-grad);

  color: #fff;

  transform: rotate(-4deg);

}



.nni-book-step-head strong {

  display: block;

  font-family: 'Space Grotesk', system-ui, sans-serif;

  font-size: 1.1rem;

  font-weight: 700;

  letter-spacing: -.01em;

  color: var(--nb-text);

}



.nni-book-hint {

  display: block;

  font-size: .82rem;

  color: var(--nb-faint);

  margin-top: .1rem;

}



.nni-book-nav {

  margin-left: auto;

  display: flex;

  gap: .4rem;

}



.nni-book-arrow {

  width: 38px;

  height: 38px;

  border-radius: 13px;

  border: 1px solid var(--nb-line);

  background: var(--nb-surface-2);

  color: #C4B5FD;

  font-size: 1.2rem;

  line-height: 1;

  cursor: pointer;

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), background .18s;

}



.nni-book-arrow:hover:not(:disabled) {

  background: #2A2159;

  color: #fff;

  transform: translateY(-2px);

}



.nni-book-arrow:disabled { opacity: .3; cursor: not-allowed; }



/* ── notice (2-hour cutoff) ─────────────────────────────── */

.nni-book-notice {

  display: flex;

  gap: .7rem;

  align-items: flex-start;

  padding: .85rem 1rem;

  border-radius: 16px;

  background: #1A1436;

  border: 1px solid #3B2A6B;

  color: #D6D2F0;

  font-size: .84rem;

  line-height: 1.5;

  margin-bottom: 1.25rem;

}



.nni-book-notice .ico {

  flex-shrink: 0;

  width: 22px;

  height: 22px;

  border-radius: 8px;

  display: grid;

  place-items: center;

  background: #FBBF24;

  color: #3B2600;

  font-size: .8rem;

  font-weight: 800;

}



.nni-book-notice b { color: #fff; }



/* ── quick picks ────────────────────────────────────────── */

.nni-book-quick {

  display: flex;

  flex-wrap: wrap;

  gap: .45rem;

  margin-bottom: 1.1rem;

}



.nni-book-quick button {

  display: inline-flex;

  align-items: center;

  gap: .4rem;

  padding: .5rem .9rem;

  border-radius: 999px;

  border: 1px dashed var(--nb-line);

  background: #0D0D24;

  color: var(--nb-dim);

  font-family: inherit;

  font-size: .82rem;

  font-weight: 700;

  cursor: pointer;

  transition: .16s;

}



.nni-book-quick button:hover {

  border-style: solid;

  border-color: var(--nb-brand);

  color: #fff;

  transform: translateY(-2px);

}



.nni-book-quick button b { color: #C4B5FD; }



/* ── month grid ─────────────────────────────────────────── */

.nni-book-cal-head {

  display: grid;

  grid-template-columns: repeat(7, 1fr);

  gap: .4rem;

  margin-bottom: .5rem;

}



.nni-book-cal-head span {

  text-align: center;

  font-size: .68rem;

  font-weight: 800;

  letter-spacing: .1em;

  text-transform: uppercase;

  color: var(--nb-faint);

}



.nni-book-cal-grid {

  display: grid;

  grid-template-columns: repeat(7, 1fr);

  gap: .4rem;

}



.nni-book-cal-cell {

  position: relative;

  aspect-ratio: 1 / 1;

  min-height: 46px;

  border-radius: 14px;

  border: 1px solid var(--nb-line-soft);

  background: #14142E;

  color: #D6D2EE;

  font-family: inherit;

  font-size: .95rem;

  font-weight: 800;

  cursor: pointer;

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), background .18s, border-color .18s, box-shadow .18s;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 2px;

  padding: 0;

}



.nni-book-cal-cell .d { line-height: 1; }

.nni-book-cal-cell .n { font-size: .55rem; font-weight: 800; opacity: .7; line-height: 1; letter-spacing: .02em; }



.nni-book-cal-cell .dot {

  width: 5px;

  height: 5px;

  border-radius: 50%;

  background: #34D399;

  display: block;

}



.nni-book-cal-cell.is-quiet .dot { background: var(--nb-warn); }

.nni-book-cal-cell.is-busy .dot { background: #FB7185; }



.nni-book-cal-cell.is-open:hover {

  border-color: var(--nb-brand);

  background: #211A4C;

  color: #fff;

  transform: translateY(-3px);

  box-shadow: 0 14px 28px -16px rgba(139, 92, 246, .95);

}



.nni-book-cal-cell.is-active {

  background: var(--nb-grad);

  border-color: transparent;

  color: #fff;

  transform: translateY(-3px);

  box-shadow: 0 16px 32px -14px rgba(139, 92, 246, .95);

}



.nni-book-cal-cell.is-active .dot { background: #fff; }



.nni-book-cal-cell.is-out {

  opacity: .28;

  cursor: not-allowed;

  background: #0E0E22;

  border-color: #1C1C3C;

}



.nni-book-cal-cell.is-blank {

  border: 0;

  background: transparent;

  cursor: default;

  opacity: 0;

}



.nni-book-cal-legend {

  display: flex;

  flex-wrap: wrap;

  gap: .9rem;

  margin-top: .95rem;

  font-size: .76rem;

  color: var(--nb-faint);

  font-weight: 600;

}



.nni-book-cal-legend span { display: inline-flex; align-items: center; gap: .35rem; }



.nni-book-cal-legend i {

  width: 7px;

  height: 7px;

  border-radius: 50%;

  display: block;

}



.nni-book-cal-legend .lg-quiet { background: var(--nb-warn); }

.nni-book-cal-legend .lg-ok { background: #34D399; }

.nni-book-cal-legend .lg-busy { background: #FB7185; }



/* ── time slots ─────────────────────────────────────────── */

.nni-book-group + .nni-book-group { margin-top: 1.5rem; }



.nni-book-group-title {

  font-size: .72rem;

  font-weight: 800;

  letter-spacing: .14em;

  text-transform: uppercase;

  color: var(--nb-faint);

  margin: 0 0 .65rem;

  display: flex;

  align-items: center;

  gap: .5rem;

}



.nni-book-group-title em {

  font-style: normal;

  letter-spacing: 0;

  text-transform: none;

  font-weight: 600;

  color: #6F6B9B;

}



.nni-book-slots {

  display: flex;

  flex-wrap: wrap;

  gap: .5rem;

}



.nni-book-slot {

  padding: .6rem .9rem;

  border-radius: 13px;

  border: 1px solid var(--nb-line-soft);

  background: #14142E;

  color: #D6D2EE;

  cursor: pointer;

  font-family: inherit;

  font-size: .88rem;

  font-weight: 800;

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), background .18s, border-color .18s, box-shadow .18s;

  text-align: left;

  line-height: 1.25;

}



.nni-book-slot:hover {

  border-color: var(--nb-brand);

  background: #211A4C;

  color: #fff;

  transform: translateY(-2px);

}



.nni-book-slot.is-active {

  background: var(--nb-grad);

  border-color: transparent;

  color: #fff;

  box-shadow: 0 14px 30px -14px rgba(139, 92, 246, .95);

  transform: translateY(-2px);

}



.nni-book-slot small {

  display: block;

  font-size: .66rem;

  font-weight: 600;

  opacity: .72;

  margin-top: 1px;

}



.nni-book-empty {

  font-size: .88rem;

  color: var(--nb-faint);

  padding: 1rem 0;

}



/* skeleton shimmer */

.nni-book-skel {

  border-radius: 12px;

  background: #171733;

  position: relative;

  overflow: hidden;

}



.nni-book-skel::after {

  content: '';

  position: absolute;

  inset: 0;

  transform: translateX(-100%);

  background: linear-gradient(90deg, transparent, #23234A, transparent);

  animation: nni-shimmer 1.3s infinite;

}



@keyframes nni-shimmer {

  100% { transform: translateX(100%); }

}



/* ── form ───────────────────────────────────────────────── */

.nni-book-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 1rem;

}



.nni-book-field-wide { grid-column: 1 / -1; }



.nni-book-field label {

  display: block;

  font-size: .74rem;

  font-weight: 800;

  letter-spacing: .07em;

  text-transform: uppercase;

  color: var(--nb-faint);

  margin-bottom: .45rem;

}



.nni-book-field input,

.nni-book-field textarea {

  width: 100%;

  padding: .85rem 1rem;

  border-radius: 14px;

  border: 1px solid var(--nb-line);

  background: #0E0E24;

  color: var(--nb-text);

  font-family: inherit;

  font-size: .95rem;

  transition: .18s;

}



.nni-book-field input::placeholder,

.nni-book-field textarea::placeholder { color: #5E5A85; }



.nni-book-field input:focus,

.nni-book-field textarea:focus {

  outline: none;

  border-color: var(--nb-brand);

  box-shadow: 0 0 0 4px rgba(139, 92, 246, .22);

}



.nni-book-field.is-bad input,

.nni-book-field.is-bad textarea {

  border-color: #FB7185;

  box-shadow: 0 0 0 4px rgba(251, 113, 133, .18);

}



.nni-book-field-err {

  display: none;

  margin-top: .35rem;

  font-size: .78rem;

  font-weight: 700;

  color: #FDA4AF;

}



.nni-book-field.is-bad .nni-book-field-err { display: block; }



/* topic chips */

.nni-book-topics {

  display: flex;

  flex-wrap: wrap;

  gap: .45rem;

  margin: .25rem 0 1rem;

}



.nni-book-topics button {

  padding: .5rem .85rem;

  border-radius: 999px;

  border: 1px solid var(--nb-line);

  background: #0E0E24;

  color: var(--nb-dim);

  font-family: inherit;

  font-size: .8rem;

  font-weight: 700;

  cursor: pointer;

  transition: .16s;

}



.nni-book-topics button:hover { color: #fff; border-color: var(--nb-brand); }



.nni-book-topics button.is-on {

  background: var(--nb-grad-soft);

  border-color: #A21CAF;

  color: #fff;

}



.nni-book-hp {

  position: absolute !important;

  left: -9999px !important;

  width: 1px;

  height: 1px;

  opacity: 0;

}



.nni-book-error {

  margin-top: 1rem;

  padding: .85rem 1rem;

  border-radius: 14px;

  background: #3B1024;

  border: 1px solid #9F1239;

  color: #FECDD3;

  font-size: .88rem;

  font-weight: 600;

}



.nni-book-submit {

  margin-top: 1.35rem;

  width: 100%;

  justify-content: center;

  border-radius: 999px !important;

  font-weight: 800 !important;

  letter-spacing: .01em;

  box-shadow: 0 18px 40px -18px rgba(139, 92, 246, .95);

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), box-shadow .2s;

}



.nni-book-submit:hover:not(:disabled) { transform: translateY(-2px); }

.nni-book-submit:disabled { opacity: .7; cursor: wait; }



.nni-book-note {

  margin: .95rem 0 0;

  font-size: .8rem;

  color: var(--nb-faint);

  text-align: center;

  line-height: 1.55;

}



/* ── success ────────────────────────────────────────────── */

.nni-book-done {

  text-align: center;

  padding: 1.5rem 0 .5rem;

  position: relative;

}



.nni-book-confetti {

  position: absolute;

  inset: 0;

  pointer-events: none;

  overflow: hidden;

}



.nni-book-confetti i {

  position: absolute;

  top: -14px;

  width: 9px;

  height: 14px;

  border-radius: 2px;

  opacity: 0;

  animation: nni-fall 2.4s ease-in forwards;

}



@keyframes nni-fall {

  0%   { opacity: 1; transform: translateY(0) rotate(0deg); }

  100% { opacity: 0; transform: translateY(320px) rotate(540deg); }

}



.nni-book-done-icon {

  width: 66px;

  height: 66px;

  margin: 0 auto 1.1rem;

  border-radius: 24px;

  display: grid;

  place-items: center;

  background: #0C3B2A;

  border: 1px solid #1E6B4E;

  color: #34D399;

  transform: rotate(-6deg);

  animation: nni-pop .5s cubic-bezier(.34, 1.56, .64, 1);

}



.nni-book-done-icon svg { width: 30px; height: 30px; }



@keyframes nni-pop {

  0%   { transform: scale(.4) rotate(-30deg); opacity: 0; }

  100% { transform: scale(1) rotate(-6deg); opacity: 1; }

}



.nni-book-done h3 {

  font-family: 'Space Grotesk', system-ui, sans-serif;

  font-size: 1.8rem;

  font-weight: 700;

  letter-spacing: -.02em;

  margin: 0 0 .5rem;

  color: var(--nb-text);

}



.nni-book-done p {

  color: var(--nb-dim);

  margin: 0 auto 1.4rem;

  max-width: 520px;

  font-size: .95rem;

  line-height: 1.6;

}



.nni-book-ticket {

  max-width: 460px;

  margin: 0 auto 1.5rem;

  border-radius: 18px;

  border: 1px dashed var(--nb-line);

  background: #0E0E24;

  padding: 1.1rem 1.25rem;

  text-align: left;

}



.nni-book-ticket dl {

  display: grid;

  grid-template-columns: auto 1fr;

  gap: .5rem 1rem;

  margin: 0;

  font-size: .87rem;

}



.nni-book-ticket dt { color: var(--nb-faint); font-weight: 700; }

.nni-book-ticket dd { margin: 0; color: var(--nb-text); font-weight: 800; text-align: right; }



.nni-book-done-actions {

  display: flex;

  gap: .7rem;

  justify-content: center;

  flex-wrap: wrap;

}



.nni-book-done-actions .btn { border-radius: 999px !important; font-weight: 800 !important; }



/* ── sticky mobile summary ──────────────────────────────── */

.nni-book-sticky {

  display: none;

  position: sticky;

  bottom: 0;

  z-index: 40;

  margin: 1rem -1.25rem -1.9rem;

  padding: .8rem 1.25rem 1rem;

  background: #10102A;

  border-top: 1px solid var(--nb-line);

  align-items: center;

  gap: .8rem;

}



.nni-book-sticky .when { min-width: 0; }

.nni-book-sticky .when b {

  display: block;

  font-size: .88rem;

  color: var(--nb-text);

  font-weight: 800;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

}

.nni-book-sticky .when span { font-size: .74rem; color: var(--nb-faint); font-weight: 600; }

.nni-book-sticky .go {

  margin-left: auto;

  flex-shrink: 0;

  border-radius: 999px !important;

  font-weight: 800 !important;

  font-size: .84rem !important;

  padding: .6rem 1.1rem !important;

}



/* ── compact mode ───────────────────────────────────────── */

.nni-book-compact .nni-book-panel {

  background: transparent;

  border: 0;

  box-shadow: none;

  padding: 0;

}



.nni-book-compact .nni-book-step + .nni-book-step { border-top-color: var(--nb-line-soft); }

.nni-book-compact .nni-book-head { display: none; }

.nni-book-compact .nni-book-rail { margin-top: 0; }

.nni-book-compact .nni-book-controls { border-radius: 16px; padding: .8rem .9rem; }

.nni-book-compact .nni-book-sticky { margin-left: 0; margin-right: 0; border-radius: 0 0 18px 18px; }

.nni-book-compact .nni-book-grid { grid-template-columns: 1fr; }



/* ═══════════════════════════════════════════════════════

   LIGHT MODE — solid opaque fills only

   ═══════════════════════════════════════════════════════ */

[data-theme="light"] .nni-book {

  --nb-bg: #F6F4FF;

  --nb-surface: #FFFFFF;

  --nb-surface-2: #F1EDFC;

  --nb-line: #DCD3F4;

  --nb-line-soft: #E7E1F7;

  --nb-text: #1B1233;

  --nb-dim: #5B4B7A;

  --nb-faint: #7A6BA0;

  --nb-grad: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%);

  --nb-grad-soft: linear-gradient(120deg, #5B21B6 0%, #86198F 100%);

  --nb-ok: #047857;

  --nb-warn: #B45309;

  --nb-shadow: 0 24px 60px -30px rgba(76, 29, 149, .35);

  background: #F6F4FF;

  color: #1B1233;

  border-top-color: #E3DCF7;

}



[data-theme="light"] .nni-book-glow::before { background: radial-gradient(circle, #DDD6FE 0%, #F6F4FF 70%); opacity: .85; }

[data-theme="light"] .nni-book-glow::after  { background: radial-gradient(circle, #CFFAFE 0%, #F6F4FF 70%); opacity: .85; }



[data-theme="light"] .nni-book-badge { background: #EDE9FE; color: #5B21B6; border-color: #C4B5FD; }

[data-theme="light"] .nni-book-badge .dot { background: #047857; }

[data-theme="light"] .nni-book-head p { color: #5B4B7A; }

[data-theme="light"] .nni-book-perks li { background: #FFFFFF; border-color: #DDD6F2; color: #4C3D72; }

[data-theme="light"] .nni-book-perks li b { color: #1B1233; }

[data-theme="light"] .nni-book-proof { color: #7A6BA0; }

[data-theme="light"] .nni-book-proof .faces span { border-color: #F6F4FF; }

[data-theme="light"] .nni-book-proof b { color: #1B1233; }



[data-theme="light"] .nni-book-controls { background: #FFFFFF; border-color: #DDD6F2; }

[data-theme="light"] .nni-book-durs,

[data-theme="light"] .nni-book-tz { background: #F4F1FC; border-color: #E4DEF3; }

[data-theme="light"] .nni-book-durs button,

[data-theme="light"] .nni-book-tz button { color: #5B4B7A; }

[data-theme="light"] .nni-book-durs button.is-active,

[data-theme="light"] .nni-book-tz button.is-active { color: #fff; }

[data-theme="light"] .nni-book-tz button.is-active { background: linear-gradient(120deg, #5B21B6 0%, #86198F 100%); }



[data-theme="light"] .nni-book-rail-track { background: #E7E1F7; }

[data-theme="light"] .nni-book-rail-steps li { color: #7A6BA0; }

[data-theme="light"] .nni-book-rail-steps li i { background: #F1EDFC; border-color: #DDD6F2; color: #7A6BA0; }

[data-theme="light"] .nni-book-rail-steps li.is-active { color: #1B1233; background: #FFFFFF; border-color: #DDD6F2; }

[data-theme="light"] .nni-book-rail-steps li.is-done { color: #5B4B7A; }

[data-theme="light"] .nni-book-rail-steps li.is-done i { background: #D1FAE5; border-color: #6EE7B7; color: #065F46; }



[data-theme="light"] .nni-book-panel { background: #FFFFFF; border-color: #DDD6F2; box-shadow: 0 18px 50px -30px rgba(76, 29, 149, .35); }

[data-theme="light"] .nni-book-step + .nni-book-step { border-top-color: #E7E1F7; }

[data-theme="light"] .nni-book-step-head strong { color: #1B1233; }

[data-theme="light"] .nni-book-hint { color: #7A6BA0; }

[data-theme="light"] .nni-book-arrow { background: #F4F1FC; border-color: #DDD6F2; color: #6D28D9; }

[data-theme="light"] .nni-book-arrow:hover:not(:disabled) { background: #EDE9FE; color: #5B21B6; }



[data-theme="light"] .nni-book-notice { background: #FEF3C7; border-color: #FCD34D; color: #78350F; }

[data-theme="light"] .nni-book-notice .ico { background: #B45309; color: #FFFFFF; }

[data-theme="light"] .nni-book-notice b { color: #451A03; }



[data-theme="light"] .nni-book-quick button { background: #FFFFFF; border-color: #C9BCF5; color: #5B4B7A; }

[data-theme="light"] .nni-book-quick button b { color: #6D28D9; }



[data-theme="light"] .nni-book-cal-head span { color: #7A6BA0; }

[data-theme="light"] .nni-book-cal-cell { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-cal-cell.is-open:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }

[data-theme="light"] .nni-book-cal-cell.is-active { color: #fff; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); border-color: transparent; }

[data-theme="light"] .nni-book-cal-cell.is-out { background: #F1EEF9; border-color: #E7E1F7; color: #B7AED4; }

[data-theme="light"] .nni-book-cal-cell .dot { background: #047857; }

[data-theme="light"] .nni-book-cal-cell.is-quiet .dot { background: #B45309; }

[data-theme="light"] .nni-book-cal-cell.is-busy .dot { background: #BE123C; }

[data-theme="light"] .nni-book-cal-legend { color: #7A6BA0; }

[data-theme="light"] .nni-book-cal-legend .lg-ok { background: #047857; }

[data-theme="light"] .nni-book-cal-legend .lg-quiet { background: #B45309; }

[data-theme="light"] .nni-book-cal-legend .lg-busy { background: #BE123C; }



[data-theme="light"] .nni-book-group-title { color: #7A6BA0; }

[data-theme="light"] .nni-book-group-title em { color: #9A8FC0; }

[data-theme="light"] .nni-book-slot { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-slot:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }

[data-theme="light"] .nni-book-slot.is-active { color: #fff; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); border-color: transparent; }

[data-theme="light"] .nni-book-empty { color: #7A6BA0; }

[data-theme="light"] .nni-book-skel { background: #EFEBFA; }

[data-theme="light"] .nni-book-skel::after { background: linear-gradient(90deg, #EFEBFA, #E2DCF6, #EFEBFA); }



[data-theme="light"] .nni-book-field label { color: #7A6BA0; }

[data-theme="light"] .nni-book-field input,

[data-theme="light"] .nni-book-field textarea { background: #FFFFFF; border-color: #DDD6F2; color: #1B1233; }

[data-theme="light"] .nni-book-field input::placeholder,

[data-theme="light"] .nni-book-field textarea::placeholder { color: #9A8FC0; }

[data-theme="light"] .nni-book-field input:focus,

[data-theme="light"] .nni-book-field textarea:focus { border-color: #7C3AED; box-shadow: 0 0 0 4px rgba(109, 40, 217, .15); }

[data-theme="light"] .nni-book-field.is-bad input,

[data-theme="light"] .nni-book-field.is-bad textarea { border-color: #BE123C; box-shadow: 0 0 0 4px rgba(190, 18, 60, .12); }

[data-theme="light"] .nni-book-field-err { color: #9F1239; }

[data-theme="light"] .nni-book-topics button { background: #FFFFFF; border-color: #DDD6F2; color: #5B4B7A; }

[data-theme="light"] .nni-book-topics button.is-on { background: linear-gradient(120deg, #5B21B6 0%, #86198F 100%); border-color: transparent; color: #fff; }

[data-theme="light"] .nni-book-error { background: #FFE4E6; border-color: #FDA4AF; color: #9F1239; }

[data-theme="light"] .nni-book-note { color: #7A6BA0; }



[data-theme="light"] .nni-book-done-icon { background: #D1FAE5; border-color: #6EE7B7; color: #047857; }

[data-theme="light"] .nni-book-done h3 { color: #1B1233; }

[data-theme="light"] .nni-book-done p { color: #5B4B7A; }

[data-theme="light"] .nni-book-ticket { background: #FAF8FF; border-color: #C9BCF5; }

[data-theme="light"] .nni-book-ticket dt { color: #7A6BA0; }

[data-theme="light"] .nni-book-ticket dd { color: #1B1233; }

[data-theme="light"] .nni-book-sticky { background: #FFFFFF; border-top-color: #DDD6F2; }

[data-theme="light"] .nni-book-sticky .when b { color: #1B1233; }

[data-theme="light"] .nni-book-sticky .when span { color: #7A6BA0; }



[data-theme="light"] .nni-book-compact .nni-book-panel { background: transparent; border: 0; box-shadow: none; padding: 0; }

[data-theme="light"] .nni-book-compact .nni-book-step + .nni-book-step { border-top-color: #E7E1F7; }

[data-theme="light"] .nni-book-compact .nni-book-step-head strong { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-hint,

[data-theme="light"] .nni-book-compact .nni-book-group-title,

[data-theme="light"] .nni-book-compact .nni-book-field label,

[data-theme="light"] .nni-book-compact .nni-book-note,

[data-theme="light"] .nni-book-compact .nni-book-empty { color: #5B4B7A; }

[data-theme="light"] .nni-book-compact .nni-book-group-title em { color: #9A8FC0; }

[data-theme="light"] .nni-book-compact .nni-book-arrow { background: #F4F1FC; border-color: #DDD6F2; color: #6D28D9; }

[data-theme="light"] .nni-book-compact .nni-book-notice { background: #FEF3C7; border-color: #FCD34D; color: #78350F; }

[data-theme="light"] .nni-book-compact .nni-book-notice b { color: #451A03; }

[data-theme="light"] .nni-book-compact .nni-book-quick button { background: #FFFFFF; border-color: #C9BCF5; color: #5B4B7A; }

[data-theme="light"] .nni-book-compact .nni-book-cal-head span { color: #7A6BA0; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell.is-open:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell.is-active { color: #fff; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); border-color: transparent; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell.is-out { background: #F1EEF9; border-color: #E7E1F7; color: #B7AED4; }

[data-theme="light"] .nni-book-compact .nni-book-cal-legend { color: #7A6BA0; }

[data-theme="light"] .nni-book-compact .nni-book-slot { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-compact .nni-book-slot:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-slot.is-active { color: #fff; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); border-color: transparent; }

[data-theme="light"] .nni-book-compact .nni-book-field input,

[data-theme="light"] .nni-book-compact .nni-book-field textarea { background: #FFFFFF; border-color: #DDD6F2; color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-field input::placeholder,

[data-theme="light"] .nni-book-compact .nni-book-field textarea::placeholder { color: #9A8FC0; }

[data-theme="light"] .nni-book-compact .nni-book-field.is-bad input,

[data-theme="light"] .nni-book-compact .nni-book-field.is-bad textarea { border-color: #BE123C; }

[data-theme="light"] .nni-book-compact .nni-book-field-err { color: #9F1239; }

[data-theme="light"] .nni-book-compact .nni-book-topics button { background: #FFFFFF; border-color: #DDD6F2; color: #5B4B7A; }

[data-theme="light"] .nni-book-compact .nni-book-topics button.is-on { background: linear-gradient(120deg, #5B21B6 0%, #86198F 100%); border-color: transparent; color: #fff; }

[data-theme="light"] .nni-book-compact .nni-book-error { background: #FFE4E6; border-color: #FDA4AF; color: #9F1239; }

[data-theme="light"] .nni-book-compact .nni-book-done-icon { background: #D1FAE5; border-color: #6EE7B7; color: #047857; }

[data-theme="light"] .nni-book-compact .nni-book-done h3 { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-done p { color: #5B4B7A; }

[data-theme="light"] .nni-book-compact .nni-book-ticket { background: #FAF8FF; border-color: #C9BCF5; }

[data-theme="light"] .nni-book-compact .nni-book-ticket dt { color: #7A6BA0; }

[data-theme="light"] .nni-book-compact .nni-book-ticket dd { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-sticky { background: #FFFFFF; border-top-color: #DDD6F2; }

[data-theme="light"] .nni-book-compact .nni-book-sticky .when b { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-sticky .when span { color: #7A6BA0; }



/* ── responsive ─────────────────────────────────────────── */

@media (max-width: 860px) {

  .nni-book-rail-steps li span { display: none; }

}



@media (max-width: 640px) {

  .nni-book { padding: 3.25rem 0 3.5rem; }

  .nni-book-inner { padding: 0 1rem; }

  .nni-book-panel { padding: 1.25rem; border-radius: 20px; }

  .nni-book-grid { grid-template-columns: 1fr; }

  .nni-book-controls { flex-direction: column; align-items: stretch; gap: .8rem; }

  /* stack each control so the row never needs more than the phone's width */

  .nni-book-ctrl { flex-direction: column; align-items: stretch; gap: .45rem; }

  .nni-book-ctrl { justify-content: space-between; }

  .nni-book-ctrl-label { text-align: left; }

  .nni-book-durs, .nni-book-tz { flex: 1; }

  .nni-book-durs button, .nni-book-tz button { flex: 1; padding: .55rem .5rem; font-size: .8rem; }

  .nni-book-step-head { flex-wrap: wrap; }

  .nni-book-nav { margin-left: 0; width: 100%; justify-content: space-between; }

  .nni-book-cal-cell { min-height: 40px; border-radius: 12px; font-size: .86rem; }

  .nni-book-done-actions { flex-direction: column; }

  .nni-book-done-actions .btn { width: 100%; justify-content: center; }

  .nni-book-ticket dl { font-size: .8rem; }

  .nni-book-sticky { display: flex; margin: 1rem -1rem -1.25rem; padding: .8rem 1rem 1rem; }

}



@media (prefers-reduced-motion: reduce) {

  .nni-book *,

  .nni-book *::before,

  .nni-book *::after {

    animation-duration: .01ms !important;

    animation-iteration-count: 1 !important;

    transition-duration: .01ms !important;

  }

}



/* ═══════════════════════════════════════════════════════════

   v6 — compact wizard, thick active states, real calendar grid

   ═══════════════════════════════════════════════════════════ */



/* ── step titles (head + hint stack) ─────────────────────── */

.nni-book-step-title { min-width: 0; }

.nni-book-step-title strong {

  font-family: 'Space Grotesk', system-ui, sans-serif;

  font-size: 1.08rem;

  font-weight: 700;

  letter-spacing: -.01em;

  color: var(--nb-text);

  display: block;

  line-height: 1.25;

}

.nni-book-step-title .nni-book-hint { margin-top: .15rem; }



/* ── collapsed step summary ───────────────────────────────── */

.nni-book-chosen {

  display: flex;

  align-items: center;

  gap: .7rem;

  padding: .8rem .9rem;

  border-radius: 16px;

  background: #14142E;

  border: 1px solid var(--nb-line);

  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);

}



.nni-book-chosen .tick {

  flex-shrink: 0;

  width: 26px;

  height: 26px;

  border-radius: 9px;

  display: grid;

  place-items: center;

  background: #0C3B2A;

  border: 1px solid #1E6B4E;

  color: #34D399;

  font-size: .8rem;

  font-weight: 800;

}



.nni-book-chosen .txt { flex: 1; min-width: 0; line-height: 1.3; }

.nni-book-chosen .txt b { display: block; font-size: .92rem; font-weight: 800; color: var(--nb-text); }

.nni-book-chosen .txt small { display: block; font-size: .76rem; font-weight: 600; color: var(--nb-faint); margin-top: .1rem; }



.nni-book-change {

  flex-shrink: 0;

  padding: .45rem .8rem;

  border-radius: 999px;

  border: 1px solid var(--nb-line);

  background: transparent;

  color: #C4B5FD;

  font-family: inherit;

  font-size: .78rem;

  font-weight: 800;

  cursor: pointer;

  transition: .16s;

}



.nni-book-change:hover {

  border-color: var(--nb-brand);

  color: #fff;

  background: #211A4C;

  transform: translateY(-1px);

}



/* ── thicker, unmissable active states ────────────────────── */

.nni-book-durs button,

.nni-book-tz button {

  border: 2px solid transparent;

  padding: .45rem .8rem;

}



.nni-book-durs button.is-active,

.nni-book-tz button.is-active {

  background: var(--nb-grad);

  border-color: #E9D5FF;

  color: #fff;

  box-shadow:

    0 0 0 1px rgba(233, 213, 255, .55),

    0 0 0 4px rgba(139, 92, 246, .30),

    0 10px 24px -10px rgba(139, 92, 246, .95);

  transform: translateY(-1px);

}



.nni-book-tz button.is-active {

  background: linear-gradient(120deg, #C026D3 0%, #7C3AED 100%);

  border-color: #F5D0FE;

}



.nni-book-durs button:not(.is-active),

.nni-book-tz button:not(.is-active) {

  border-color: var(--nb-line);

  color: var(--nb-dim);

}



/* topic chips — thick ring when selected */

.nni-book-topics button { border: 2px solid var(--nb-line); padding: .4rem .75rem; }



.nni-book-topics button.is-on {

  background: var(--nb-grad-soft);

  border-color: #F0ABFC;

  color: #fff;

  box-shadow:

    0 0 0 1px rgba(240, 171, 252, .5),

    0 0 0 4px rgba(192, 38, 211, .28),

    0 8px 20px -10px rgba(192, 38, 211, .9);

}



/* quick-pick chips */

.nni-book-quick button {

  border: 2px solid var(--nb-line);

  padding: .45rem .85rem;

}

.nni-book-quick button:hover {

  border-color: var(--nb-brand);

  box-shadow: 0 0 0 3px rgba(139, 92, 246, .22);

}

.nni-book-quick button b { color: #E9D5FF; }



.nni-book-quick-label {

  align-self: center;

  font-size: .7rem;

  font-weight: 800;

  letter-spacing: .12em;

  text-transform: uppercase;

  color: var(--nb-faint);

  margin-right: .15rem;

}



.nni-book-quick-time {

  padding: .45rem .8rem;

  border-radius: 999px;

  border: 2px solid var(--nb-line);

  background: #14142E;

  color: #D6D2EE;

  font-family: inherit;

  font-size: .82rem;

  font-weight: 800;

  cursor: pointer;

  transition: .16s;

}



.nni-book-quick-time:hover {

  border-color: var(--nb-brand);

  color: #fff;

  background: #211A4C;

  transform: translateY(-2px);

}



/* ── calendar grid: real, legible cells ───────────────────── */

.nni-book-cal-head { margin-bottom: .55rem; }



.nni-book-cal-head span {

  font-size: .66rem;

  letter-spacing: .08em;

  color: var(--nb-faint);

}



.nni-book-cal-grid { gap: .45rem; }



.nni-book-cal-cell {

  aspect-ratio: 1 / 1;

  min-height: 48px;

  border-radius: 15px;

  border: 2px solid var(--nb-line-soft);

  background: #14142E;

  color: #D6D2EE;

  font-size: 1.02rem;

  gap: 3px;

}



.nni-book-cal-cell .d { line-height: 1; font-weight: 800; }

.nni-book-cal-cell .dot { width: 6px; height: 6px; border-radius: 50%; background: #34D399; }



.nni-book-cal-cell.is-open:hover {

  border-color: #C4B5FD;

  background: #211A4C;

  color: #fff;

  transform: translateY(-2px);

  box-shadow: 0 0 0 3px rgba(139, 92, 246, .28), 0 14px 28px -16px rgba(139, 92, 246, .95);

}



.nni-book-cal-cell.is-active {

  background: var(--nb-grad);

  border-color: #E9D5FF;

  color: #fff;

  transform: translateY(-2px);

  box-shadow:

    0 0 0 1px rgba(233, 213, 255, .6),

    0 0 0 4px rgba(139, 92, 246, .32),

    0 16px 32px -14px rgba(139, 92, 246, .95);

}



.nni-book-cal-cell.is-active .dot { background: #fff; }



/* today gets its own marker so it is never confused with "selected" */

.nni-book-cal-cell.is-today { border-color: #22D3EE; }

.nni-book-cal-cell.is-today .d { color: #67E8F9; }

.nni-book-cal-cell.is-today.is-active .d { color: #fff; }



.nni-book-cal-cell.is-out {

  opacity: .22;

  cursor: not-allowed;

  background: #0E0E22;

  border-color: #1C1C3C;

}



/* ── time slots: grid of compact chips ────────────────────── */

.nni-book-group-title { margin: 1.1rem 0 .55rem; }

.nni-book-group:first-child .nni-book-group-title { margin-top: .2rem; }



.nni-book-slotrow {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));

  gap: .45rem;

  margin-bottom: .3rem;

}



.nni-book-slot {

  padding: .5rem .6rem;

  border-radius: 12px;

  border: 2px solid var(--nb-line-soft);

  background: #14142E;

  color: #D6D2EE;

  font-size: .86rem;

  text-align: center;

  line-height: 1.2;

}



.nni-book-slot:hover {

  border-color: #C4B5FD;

  background: #211A4C;

  color: #fff;

  transform: translateY(-2px);

  box-shadow: 0 0 0 3px rgba(139, 92, 246, .25);

}



.nni-book-slot.is-active {

  background: var(--nb-grad);

  border-color: #E9D5FF;

  color: #fff;

  box-shadow:

    0 0 0 1px rgba(233, 213, 255, .6),

    0 0 0 4px rgba(139, 92, 246, .32),

    0 12px 26px -12px rgba(139, 92, 246, .95);

  transform: translateY(-2px);

}



.nni-book-slot small { font-size: .62rem; margin-top: 2px; }



/* ── tighter vertical rhythm ──────────────────────────────── */

.nni-book-notice { padding: .7rem .9rem; font-size: .82rem; margin-bottom: 1rem; }

.nni-book-panel { padding: 1.5rem; }

.nni-book-step-head { margin-bottom: .9rem; }

.nni-book-body { min-height: 0; }

.nni-book-step + .nni-book-step { margin-top: 1.1rem; padding-top: 1.1rem; }

.nni-book-rail { margin-bottom: 1rem; }

.nni-book-controls { padding: .8rem 1rem; margin-bottom: 1rem; border-radius: 18px; }

.nni-book-grid { gap: .8rem; }

.nni-book-field input,

.nni-book-field textarea { padding: .7rem .85rem; border-radius: 12px; }

.nni-book-submit { margin-top: 1.1rem; }

.nni-book-cal-legend { margin-top: .8rem; }



/* ── light mode ───────────────────────────────────────────── */

[data-theme="light"] .nni-book-chosen { background: #FAF8FF; border-color: #DDD6F2; }

[data-theme="light"] .nni-book-chosen .tick { background: #D1FAE5; border-color: #6EE7B7; color: #047857; }

[data-theme="light"] .nni-book-chosen .txt b { color: #1B1233; }

[data-theme="light"] .nni-book-chosen .txt small { color: #7A6BA0; }

[data-theme="light"] .nni-book-change { background: #FFFFFF; border-color: #DDD6F2; color: #5B21B6; }

[data-theme="light"] .nni-book-change:hover { background: #EDE9FE; border-color: #7C3AED; color: #5B21B6; }



[data-theme="light"] .nni-book-durs button:not(.is-active),

[data-theme="light"] .nni-book-tz button:not(.is-active) { border-color: #DDD6F2; color: #5B4B7A; }

[data-theme="light"] .nni-book-durs button.is-active { border-color: #5B21B6; box-shadow: 0 0 0 1px rgba(91, 33, 182, .5), 0 0 0 4px rgba(109, 40, 217, .18), 0 10px 24px -12px rgba(91, 33, 182, .6); }

[data-theme="light"] .nni-book-tz button.is-active { border-color: #86198F; background: linear-gradient(120deg, #86198F 0%, #5B21B6 100%); box-shadow: 0 0 0 1px rgba(134, 25, 143, .5), 0 0 0 4px rgba(134, 25, 143, .18), 0 10px 24px -12px rgba(134, 25, 143, .55); }



[data-theme="light"] .nni-book-topics button { border-color: #DDD6F2; }

[data-theme="light"] .nni-book-topics button.is-on { border-color: #86198F; background: linear-gradient(120deg, #5B21B6 0%, #86198F 100%); box-shadow: 0 0 0 1px rgba(134, 25, 143, .45), 0 0 0 4px rgba(134, 25, 143, .16), 0 8px 20px -12px rgba(134, 25, 143, .6); }



[data-theme="light"] .nni-book-quick button { border-color: #C9BCF5; background: #FFFFFF; color: #5B4B7A; }

[data-theme="light"] .nni-book-quick button:hover { border-color: #7C3AED; box-shadow: 0 0 0 3px rgba(124, 58, 237, .16); }

[data-theme="light"] .nni-book-quick button b { color: #5B21B6; }

[data-theme="light"] .nni-book-quick-label { color: #7A6BA0; }

[data-theme="light"] .nni-book-quick-time { background: #FFFFFF; border-color: #DDD6F2; color: #3A2F5C; }

[data-theme="light"] .nni-book-quick-time:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }



[data-theme="light"] .nni-book-cal-cell { border-color: #E0D9F5; background: #F7F5FF; color: #3A2F5C; }

[data-theme="light"] .nni-book-cal-cell.is-open:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; box-shadow: 0 0 0 3px rgba(124, 58, 237, .18), 0 12px 26px -16px rgba(124, 58, 237, .7); }

[data-theme="light"] .nni-book-cal-cell.is-active { border-color: #5B21B6; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); box-shadow: 0 0 0 1px rgba(91, 33, 182, .5), 0 0 0 4px rgba(109, 40, 217, .2), 0 14px 28px -14px rgba(91, 33, 182, .7); }

[data-theme="light"] .nni-book-cal-cell.is-today { border-color: #0E7490; }

[data-theme="light"] .nni-book-cal-cell.is-today .d { color: #0E7490; }

[data-theme="light"] .nni-book-cal-cell.is-today.is-active .d { color: #fff; }



[data-theme="light"] .nni-book-slot { border-color: #E0D9F5; background: #F7F5FF; color: #3A2F5C; }

[data-theme="light"] .nni-book-slot:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; box-shadow: 0 0 0 3px rgba(124, 58, 237, .18); }

[data-theme="light"] .nni-book-slot.is-active { border-color: #5B21B6; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); box-shadow: 0 0 0 1px rgba(91, 33, 182, .5), 0 0 0 4px rgba(109, 40, 217, .2), 0 12px 26px -14px rgba(91, 33, 182, .7); }



[data-theme="light"] .nni-book-step-title strong { color: #1B1233; }

[data-theme="light"] .nni-book-step-title .nni-book-hint { color: #7A6BA0; }

[data-theme="light"] .nni-book-compact .nni-book-step-title strong { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-step-title .nni-book-hint { color: #5B4B7A; }

[data-theme="light"] .nni-book-compact .nni-book-chosen { background: #FAF8FF; border-color: #DDD6F2; }

[data-theme="light"] .nni-book-compact .nni-book-chosen .txt b { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-chosen .txt small { color: #7A6BA0; }

[data-theme="light"] .nni-book-compact .nni-book-change { background: #FFFFFF; border-color: #DDD6F2; color: #5B21B6; }

[data-theme="light"] .nni-book-compact .nni-book-durs button:not(.is-active),

[data-theme="light"] .nni-book-compact .nni-book-tz button:not(.is-active) { border-color: #DDD6F2; color: #5B4B7A; }

[data-theme="light"] .nni-book-compact .nni-book-durs button.is-active { border-color: #5B21B6; }

[data-theme="light"] .nni-book-compact .nni-book-tz button.is-active { border-color: #86198F; }

[data-theme="light"] .nni-book-compact .nni-book-topics button { border-color: #DDD6F2; }

[data-theme="light"] .nni-book-compact .nni-book-topics button.is-on { border-color: #86198F; }

[data-theme="light"] .nni-book-compact .nni-book-quick button { border-color: #C9BCF5; }

[data-theme="light"] .nni-book-compact .nni-book-quick-time { background: #FFFFFF; border-color: #DDD6F2; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell { border-color: #E0D9F5; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell.is-active { border-color: #5B21B6; }

[data-theme="light"] .nni-book-compact .nni-book-cal-cell.is-today { border-color: #0E7490; }

[data-theme="light"] .nni-book-compact .nni-book-slot { border-color: #E0D9F5; }

[data-theme="light"] .nni-book-compact .nni-book-slot.is-active { border-color: #5B21B6; }



/* ── mobile ───────────────────────────────────────────────── */

@media (max-width: 640px) {

  .nni-book-panel { padding: 1.1rem; }

  .nni-book-slotrow { grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); }

  .nni-book-cal-cell { min-height: 42px; border-radius: 12px; font-size: .9rem; }

  .nni-book-chosen { padding: .7rem .75rem; }

  .nni-book-chosen .txt b { font-size: .86rem; }

  .nni-book-chosen .txt small { font-size: .72rem; }

}



/* ── v6: hidden must actually hide (several components set display) ── */

.nni-book [hidden] { display: none !important; }

.nni-book-slots { display: block; }

.nni-book-quick { display: flex; }

/* v6: sibling dividers must ignore hidden steps */

.nni-book-step:not([hidden]) + .nni-book-step:not([hidden]) {

  margin-top: 1.1rem;

  padding-top: 1.1rem;

  border-top: 1px solid var(--nb-line-soft);

}

[data-theme="light"] .nni-book-step:not([hidden]) + .nni-book-step:not([hidden]) { border-top-color: #E7E1F7; }



/* ── v6b: real calendar proportions + bounded time list ────── */



/* The grid cells were square (aspect-ratio), which made each one ~130px tall on a

   wide panel and blew the whole form up. Real calendars use fixed-height cells. */

.nni-book-cal-cell {

  aspect-ratio: auto;

  height: 56px;

  min-height: 0;

  padding: 0;

}



.nni-book-cal-cell .d { font-size: 1rem; }

.nni-book-cal-cell .dot { width: 5px; height: 5px; }



/* The 47-slot list is bounded so step 2 never gets tall. */

.nni-book-slots {

  max-height: 330px;

  overflow-y: auto;

  overscroll-behavior: contain;

  padding: 0 .3rem .3rem 0;

  scrollbar-width: thin;

  scrollbar-color: #3A2F63 transparent;

}



.nni-book-slots::-webkit-scrollbar { width: 7px; }

.nni-book-slots::-webkit-scrollbar-track { background: #0E0E24; border-radius: 99px; }

.nni-book-slots::-webkit-scrollbar-thumb { background: #3A2F63; border-radius: 99px; }

.nni-book-slots::-webkit-scrollbar-thumb:hover { background: #4C3F85; }



.nni-book-group-title { padding: .2rem 0 .3rem; margin: .3rem 0 .45rem; }

.nni-book-slotrow { margin-bottom: .15rem; }



[data-theme="light"] .nni-book-slots { scrollbar-color: #C9BCF5 transparent; }

[data-theme="light"] .nni-book-slots::-webkit-scrollbar-track { background: #F4F1FC; }

[data-theme="light"] .nni-book-slots::-webkit-scrollbar-thumb { background: #C9BCF5; }

[data-theme="light"] .nni-book-group-title { background: #FFFFFF; }



@media (max-width: 640px) {

  .nni-book-cal-cell { height: 46px; border-radius: 11px; }

  .nni-book-cal-cell .d { font-size: .88rem; }

  .nni-book-slots { max-height: 280px; }

}



/* ── v6c: compact mode trims the chrome further ───────────── */

.nni-book-compact .nni-book-controls { padding: .65rem .8rem; }

.nni-book-compact .nni-book-ctrl-label { font-size: .64rem; }

.nni-book-compact .nni-book-durs button,

.nni-book-compact .nni-book-tz button { padding: .38rem .7rem; font-size: .8rem; }

.nni-book-compact .nni-book-notice { font-size: .78rem; padding: .6rem .75rem; }

.nni-book-compact .nni-book-rail-steps li { font-size: .74rem; padding: .3rem .6rem; }

.nni-book-compact .nni-book-step-head { margin-bottom: .7rem; }

.nni-book-compact .nni-book-step-title strong { font-size: 1rem; }

.nni-book-compact .nni-book-cal-cell { height: 48px; }

.nni-book-compact .nni-book-cal-grid { gap: .35rem; }

.nni-book-compact .nni-book-slots { max-height: 300px; }



/* ═══════════════════════════════════════════════════════════

   v7 — clock-style time picker, clearer quick picks

   ═══════════════════════════════════════════════════════════ */



/* ── quick picks: label + date, no duplicates ─────────────── */

.nni-book-quick {

  display: flex;

  flex-wrap: wrap;

  gap: .5rem;

  margin-bottom: 1rem;

}



.nni-book-quickbtn {

  display: inline-flex;

  align-items: baseline;

  gap: .5rem;

  padding: .5rem .9rem;

  border-radius: 999px;

  border: 2px solid var(--nb-line);

  background: #0E0E24;

  color: var(--nb-dim);

  font-family: inherit;

  cursor: pointer;

  transition: .16s;

  line-height: 1.3;

}



.nni-book-quickbtn .ql { font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #8E8AAE; }

.nni-book-quickbtn .qs { font-size: .92rem; font-weight: 800; color: #F2F0FF; }

.nni-book-quickbtn .qn { font-size: .72rem; font-weight: 600; color: var(--nb-faint); }



.nni-book-quickbtn:hover {

  border-color: #C4B5FD;

  background: #211A4C;

  transform: translateY(-2px);

  box-shadow: 0 0 0 3px rgba(139, 92, 246, .25);

}



.nni-book-quickbtn.is-pop .qs { color: #E9D5FF; }



/* ── timezone row inside step 2 ──────────────────────────── */

.nni-book-tzrow {

  display: flex;

  align-items: center;

  gap: .7rem;

  flex-wrap: wrap;

  margin-bottom: .9rem;

}



.nni-book-tzrow .nni-book-ctrl-label { margin: 0; }



.nni-book-hint-inline { font-size: .76rem; color: var(--nb-faint); font-weight: 600; }



/* ── hour grid (the clock) ───────────────────────────────── */

.nni-book-hourhint {

  margin: 0 0 .5rem;

  font-size: .76rem;

  font-weight: 700;

  color: var(--nb-faint);

  letter-spacing: .02em;

}



.nni-book-hours {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));

  gap: .4rem;

}



.nni-book-hour {

  position: relative;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: .35rem;

  padding: .5rem .6rem;

  border-radius: 12px;

  border: 2px solid var(--nb-line-soft);

  background: #14142E;

  color: #D6D2EE;

  font-family: inherit;

  font-size: .8rem;

  font-weight: 800;

  cursor: pointer;

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), background .18s, border-color .18s, box-shadow .18s;

}



.nni-book-hour .hh { letter-spacing: -.01em; white-space: nowrap; }

.nni-book-hour .hn {

  font-size: .6rem;

  font-weight: 800;

  opacity: .6;

  line-height: 1;

  flex-shrink: 0;

}



.nni-book-hour.is-open:hover {

  border-color: #C4B5FD;

  background: #211A4C;

  color: #fff;

  transform: translateY(-2px);

  box-shadow: 0 0 0 3px rgba(139, 92, 246, .25);

}



.nni-book-hour.is-active {

  background: var(--nb-grad);

  border-color: #E9D5FF;

  color: #fff;

  box-shadow:

    0 0 0 1px rgba(233, 213, 255, .6),

    0 0 0 4px rgba(139, 92, 246, .32),

    0 12px 26px -12px rgba(139, 92, 246, .95);

  transform: translateY(-2px);

}



.nni-book-hour.is-active .hn { opacity: .85; }



.nni-book-hour.is-out {

  opacity: .22;

  cursor: not-allowed;

  background: #0E0E22;

  border-color: #1C1C3C;

}



/* ── slots for the chosen hour ───────────────────────────── */

.nni-book-hour-slots { margin-top: .7rem; }



.nni-book-hour-slots .nni-book-slotrow {

  display: grid;

  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));

  gap: .5rem;

}



.nni-book-hour-slots .nni-book-slot {

  padding: .6rem .7rem;

  border-radius: 13px;

  border: 2px solid var(--nb-line-soft);

  background: #14142E;

  color: #D6D2EE;

  font-size: .92rem;

  font-weight: 800;

  text-align: center;

  line-height: 1.2;

  cursor: pointer;

  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1), background .18s, border-color .18s, box-shadow .18s;

}



.nni-book-hour-slots .nni-book-slot:hover {

  border-color: #C4B5FD;

  background: #211A4C;

  color: #fff;

  transform: translateY(-2px);

  box-shadow: 0 0 0 3px rgba(139, 92, 246, .25);

}



.nni-book-hour-slots .nni-book-slot.is-active {

  background: var(--nb-grad);

  border-color: #E9D5FF;

  color: #fff;

  box-shadow:

    0 0 0 1px rgba(233, 213, 255, .6),

    0 0 0 4px rgba(139, 92, 246, .32),

    0 12px 26px -12px rgba(139, 92, 246, .95);

  transform: translateY(-2px);

}



.nni-book-hour-slots .nni-book-slot small { font-size: .66rem; margin-top: 2px; }



/* ── control bar hint ────────────────────────────────────── */

.nni-book-ctrl-hint { margin-left: auto; }

.nni-book-ctrl-hint-txt { font-size: .78rem; font-weight: 700; color: var(--nb-faint); }



/* ── light mode ──────────────────────────────────────────── */

[data-theme="light"] .nni-book-quickbtn { background: #FFFFFF; border-color: #DDD6F2; color: #5B4B7A; }

[data-theme="light"] .nni-book-quickbtn .ql { color: #7A6BA0; }

[data-theme="light"] .nni-book-quickbtn .qs { color: #1B1233; }

[data-theme="light"] .nni-book-quickbtn .qn { color: #9A8FC0; }

[data-theme="light"] .nni-book-quickbtn:hover { border-color: #7C3AED; background: #EDE9FE; box-shadow: 0 0 0 3px rgba(124, 58, 237, .18); }

[data-theme="light"] .nni-book-quickbtn.is-pop .qs { color: #5B21B6; }



[data-theme="light"] .nni-book-hour { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-hour.is-open:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }

[data-theme="light"] .nni-book-hour.is-active { border-color: #5B21B6; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); color: #fff; box-shadow: 0 0 0 1px rgba(91, 33, 182, .5), 0 0 0 4px rgba(109, 40, 217, .2), 0 12px 26px -14px rgba(91, 33, 182, .7); }

[data-theme="light"] .nni-book-hour.is-out { background: #F1EEF9; border-color: #E7E1F7; color: #B7AED4; }

[data-theme="light"] .nni-book-hourhint { color: #7A6BA0; }



[data-theme="light"] .nni-book-hour-slots .nni-book-slot { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-hour-slots .nni-book-slot:hover { border-color: #7C3AED; background: #EDE9FE; color: #1B1233; }

[data-theme="light"] .nni-book-hour-slots .nni-book-slot.is-active { border-color: #5B21B6; background: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%); color: #fff; }



[data-theme="light"] .nni-book-ctrl-hint-txt { color: #7A6BA0; }



[data-theme="light"] .nni-book-compact .nni-book-quickbtn { background: #FFFFFF; border-color: #DDD6F2; }

[data-theme="light"] .nni-book-compact .nni-book-quickbtn .qs { color: #1B1233; }

[data-theme="light"] .nni-book-compact .nni-book-hour { background: #F7F5FF; border-color: #E0D9F5; color: #3A2F5C; }

[data-theme="light"] .nni-book-compact .nni-book-hour.is-active { border-color: #5B21B6; }

[data-theme="light"] .nni-book-compact .nni-book-hour.is-out { color: #B7AED4; }

[data-theme="light"] .nni-book-compact .nni-book-hour-slots .nni-book-slot { background: #F7F5FF; border-color: #E0D9F5; }

[data-theme="light"] .nni-book-compact .nni-book-hour-slots .nni-book-slot.is-active { border-color: #5B21B6; }



/* ── mobile ──────────────────────────────────────────────── */

@media (max-width: 640px) {

  .nni-book-hours { grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: .35rem; }

  .nni-book-hour { padding: .45rem .5rem; font-size: .76rem; border-radius: 11px; }

  .nni-book-hour-slots .nni-book-slotrow { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); }

  .nni-book-quickbtn { padding: .45rem .75rem; gap: .4rem; }

  .nni-book-quickbtn .ql { font-size: .68rem; }

  .nni-book-quickbtn .qs { font-size: .86rem; }

  .nni-book-ctrl-hint { margin-left: 0; }

}



/* ── v7 mobile: comfortable tap targets ───────────────────── */

@media (max-width: 640px) {

  .nni-book-hour { min-height: 44px; }

  .nni-book-hour-slots .nni-book-slot { min-height: 44px; display: flex; flex-direction: column; align-items: center; justify-content: center; }

  .nni-book-quickbtn { min-height: 44px; }

  .nni-book-cal-cell { min-height: 44px; }

  .nni-book-durs button, .nni-book-tz button { min-height: 40px; }

  .nni-book-arrow { width: 42px; height: 42px; }

  .nni-book-chosen { min-height: 52px; }

  .nni-book-num { width: 32px; height: 32px; }

  .nni-book-step-head { gap: .7rem; }

  .nni-book-tzrow { gap: .55rem; }

  .nni-book-tzrow .nni-book-ctrl-label { font-size: .62rem; }

  .nni-book-hourhint { font-size: .74rem; }

}



/* ── v8: popular pills carry the second timezone ─────────── */

.nni-book-quickbtn.is-pop {

  flex-direction: column;

  align-items: flex-start;

  gap: 3px;

  padding: .45rem .8rem;

  border-radius: 14px;

}



.nni-book-quickbtn.is-pop .qs { font-size: .95rem; line-height: 1.15; }

.nni-book-quickbtn.is-pop .qn { font-size: .64rem; font-weight: 700; line-height: 1.2; }

.nni-book-quickbtn.is-pop .qs, .nni-book-quickbtn.is-pop .qn { white-space: nowrap; }



[data-theme="light"] .nni-book-quickbtn.is-pop .qn { color: #9A8FC0; }



@media (max-width: 640px) {

  .nni-book-quickbtn.is-pop { padding: .4rem .6rem; }

  .nni-book-quickbtn.is-pop .qs { font-size: .9rem; }

  .nni-book-quickbtn.is-pop .qn { font-size: .62rem; }

  /* topic chips: roomier tap targets on a phone */

  .nni-book-topics { gap: .5rem; }

  .nni-book-topics button { padding: .5rem .7rem; }

}



/* ── v8b: the popular row is one line; the pills scroll inside a strip ── */
.nni-book-quick[data-nni-popular] {
  flex-wrap: nowrap;
  align-items: center;
  gap: .6rem;
}

.nni-book-quick[data-nni-popular] .nni-book-quick-label { flex: 0 0 auto; }

.nni-book-pop-wrap {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}

.nni-book-pop-strip {
  display: flex;
  flex: 1 1 auto;
  gap: .45rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: .3rem;
  scrollbar-width: thin;
  scrollbar-color: #3A3570 transparent;
  -webkit-overflow-scrolling: touch;
}

.nni-book-pop-strip::-webkit-scrollbar { height: 6px; }
.nni-book-pop-strip::-webkit-scrollbar-track { background: transparent; }
.nni-book-pop-strip::-webkit-scrollbar-thumb { background: #3A3570; border-radius: 99px; }
.nni-book-pop-strip::-webkit-scrollbar-thumb:hover { background: #564FA0; }

.nni-book-pop-strip .nni-book-quickbtn { flex: 0 0 auto; }

[data-theme="light"] .nni-book-pop-strip { scrollbar-color: #CFC7EC transparent; }
[data-theme="light"] .nni-book-pop-strip::-webkit-scrollbar-thumb { background: #CFC7EC; }
[data-theme="light"] .nni-book-pop-strip::-webkit-scrollbar-thumb:hover { background: #A896E0; }

/* soft right edge, only while there is something to scroll */
.nni-book-pop-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: .3rem;
  width: 26px;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, rgba(18, 18, 44, 0), rgba(18, 18, 44, .95));
  border-radius: 0 14px 14px 0;
}

.nni-book-pop-wrap.is-scrollable::after { opacity: 1; }

/* light mode keeps solid opaque surfaces - the scroll cue is the scrollbar */
[data-theme="light"] .nni-book-pop-wrap::after { display: none; }

/* the short form of the second-clock label is used on a phone */
.nni-book-quickbtn.is-pop .qw-short { display: none; }

/* On a phone the popular times stay on one line and scroll sideways - the
   row is shorter than the old three-row layout and nothing is cut off. */
@media (max-width: 640px) {
  /* the label sits above the strip so the pills get the full width */
  .nni-book-quick[data-nni-popular] {
    flex-direction: column;
    align-items: stretch;
    gap: .4rem;
  }

  .nni-book-quick[data-nni-popular] .nni-book-quick-label { align-self: flex-start; }

  .nni-book-pop-strip { gap: .35rem; padding-right: .3rem; }

  .nni-book-quickbtn.is-pop { padding: .4rem .55rem; }
  .nni-book-quickbtn.is-pop .qs { font-size: .86rem; }
  .nni-book-quickbtn.is-pop .qn { font-size: .58rem; }

  .nni-book-quickbtn.is-pop .qw-long { display: none; }
  .nni-book-quickbtn.is-pop .qw-short { display: inline; }
}


/* ── compact root also needs the --nb-* variable set ─────────
   The compact variant's root element is .nni-book-compact, which never
   received the variable declarations (they live only on .nni-book).
   Any color set via var() therefore resolved to nothing in compact mode —
   that is why the amber "Filling up" legend dot (and the amber calendar
   dots) rendered invisible on book-consultation.php. Green/pink dots kept
   working because they use literal hex values. */
.nni-book-compact {
  --nb-bg: #08081C;
  --nb-surface: #12122C;
  --nb-surface-2: #1A1A3D;
  --nb-line: #2C2A5E;
  --nb-line-soft: #22224A;
  --nb-text: #F2F0FF;
  --nb-dim: #A9A5CC;
  --nb-faint: #7C78A8;
  --nb-brand: #8B5CF6;
  --nb-brand-2: #D946EF;
  --nb-brand-3: #22D3EE;
  --nb-grad: linear-gradient(120deg, #8B5CF6 0%, #D946EF 52%, #22D3EE 100%);
  --nb-grad-soft: linear-gradient(120deg, #6D28D9 0%, #A21CAF 100%);
  --nb-ok: #34D399;
  --nb-warn: #FBBF24;
  --nb-shadow: 0 30px 80px -32px rgba(0, 0, 0, .85);
}

[data-theme="light"] .nni-book-compact {
  --nb-bg: #F6F4FF;
  --nb-surface: #FFFFFF;
  --nb-surface-2: #F1EDFC;
  --nb-line: #DCD3F4;
  --nb-line-soft: #E7E1F7;
  --nb-text: #1B1233;
  --nb-dim: #5B4B7A;
  --nb-faint: #7A6BA0;
  --nb-grad: linear-gradient(120deg, #6D28D9 0%, #A21CAF 52%, #0E7490 100%);
  --nb-grad-soft: linear-gradient(120deg, #5B21B6 0%, #86198F 100%);
  --nb-ok: #047857;
  --nb-warn: #B45309;
}


/* ── legend breathing room (v6 fix) ─────────────────────────
   On book-consultation.php the calendar grid renders taller than on the
   homepage (the compact card is narrower), and the legend's small margin
   let it sit flush against the calendar's bottom edge. Give the row real
   separation and a touch more gap between the three items. */
.nni-book-cal-legend {
  margin-top: 1.1rem;
  padding-top: .8rem;
  border-top: 1px solid var(--nb-line-soft);
  gap: 1.25rem;
}

.nni-book-cal-legend span { gap: .45rem; }

/* compact card on mobile: give the legend bottom breathing room too */
.nni-book-compact .nni-book-cal-legend { margin-bottom: 1rem; }