/* Delivery through 2 October: shared chrome, Projects, Persona, Chat and Sample.
   Questionnaire, preview, results and validation retain the V4 baseline. */
.has-app-chrome { --app-header-h: 76px; --app-footer-h: 30px; }
.app-header { position: relative; z-index: 5; min-height: var(--app-header-h); display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px clamp(16px, 3vw, 40px); background: #f7f8fc; border-bottom: 1px solid #dde2ee; color: #29324e; }
.app-header__brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; font: 600 17px Sora, sans-serif; }
.app-header__brand small { display: block; margin-top: 5px; font: 400 12px Outfit, sans-serif; color: #66728c; }
.app-header__mark { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: white; background: #3e30d9; }
.app-header__nav { display: flex; align-items: center; gap: 16px; font-size: 14px; }
.app-header__nav a { text-decoration: none; color: #3e30d9; border-radius: 10px; padding: 10px 12px; }
.app-header__logout { border: 1px solid #dde2ee; }
.app-header__nav a:hover { background: #eceafb; }
.app-header__user { color: #66728c; }
.app-footer { min-height: var(--app-footer-h); display: flex; justify-content: space-between; gap: 12px; padding: 7px clamp(16px, 3vw, 40px); background: #f7f8fc; color: #66728c; border-top: 1px solid #dde2ee; font-size: 11px; }
/* Reference palette is scoped so later deliverables do not acquire a redesign. */
.phase-oct2 { --accent: #3e30d9; --accent-hover: #3024b2; --accent-soft: rgb(62 48 217 / 9%); --accent-ring: rgb(62 48 217 / 24%); --text: #29324e; --text-strong: #222b44; --border: #dce2ee; --muted: #68758e; --shadow-md: 0 12px 32px rgb(35 46 73 / 9%); background: radial-gradient(ellipse at 80% 20%, #c4c7e2, transparent 50%), linear-gradient(150deg, #697793, #8794ad); }
.phase-oct2 :is(input, select, textarea, button, a):focus-visible, .app-header a:focus-visible { outline: 3px solid #766beb; outline-offset: 3px; }
.phase-oct2 :is(input, select, textarea) { accent-color: var(--accent); }
.phase-oct2 .projects-page { min-height: calc(100dvh - var(--app-header-h) - var(--app-footer-h)); background: transparent; padding: 28px 20px; }
.phase-oct2 .projects-backdrop { display: none; }
.phase-oct2 .projects-page-layout { width: min(1360px, 100%); margin: auto; gap: 24px; }
.phase-oct2 .projects-main-panel, .phase-oct2 .projects-account-menu { border: 1px solid rgb(255 255 255 / 60%); border-radius: 22px; background: #f7f8fc; box-shadow: 0 18px 48px rgb(35 46 73 / 12%); }
.phase-oct2 .projects-main-panel { padding: 28px; }
.phase-oct2 .projects-panel-head h1 { color: #29324e; font-size: clamp(22px, 2vw, 30px); letter-spacing: -.035em; }
.phase-oct2 .projects-instruction { color: #68758e; max-width: 64ch; line-height: 1.6; }
.phase-oct2 .projects-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 20px; min-width: 0; border: 1px solid #dde2ee; border-radius: 16px; box-shadow: 0 4px 12px rgb(35 46 73 / 4%); }
.phase-oct2 .projects-row__info { grid-column: 1; grid-row: auto; min-width: 0; max-width: none; }
.phase-oct2 .projects-row__name { color: #29324e; overflow-wrap: anywhere; }
.phase-oct2 .projects-row__toolbar { grid-column: 2; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; min-width: 0; }
.phase-oct2 .projects-row__action-store[hidden] { display: none; }
.phase-oct2 .projects-action-hint { grid-column: 1 / -1; margin: 0; }
.phase-oct2 .projects-hub-btn { min-width: 132px; min-height: 44px; border-radius: 12px; background: #eeecfc; color: #3e30d9; border: 1px solid #dcd8f8; }
.phase-oct2 .projects-hub-btn:hover { background: #dedaf8; color: #3024b2; }
.phase-oct2 .projects-hub-action { border-color: #dce2ee; border-radius: 16px; box-shadow: 0 4px 14px rgb(35 46 73 / 5%); }
.phase-oct2 .projects-hub-action__icon { background: #eeecfc; color: #3e30d9; }
.phase-oct2 .projects-create-toggle, .phase-oct2 .projects-submit { background: #3e30d9; box-shadow: 0 8px 18px rgb(62 48 217 / 18%); min-height: 44px; }
.phase-oct2 .projects-modal__panel { border-color: #dde2ee; }
.phase-oct2 #createProjectModal .projects-form-grid { gap: 20px; }
.phase-oct2 #createProjectModal .projects-field :is(input,textarea,select) { min-height: 44px; border: 1px solid #cdd5e5; background: #fbfcff; border-radius: 10px; }
.phase-oct2 #createProjectModal .projects-field label { color: #29324e; }
.phase-oct2 .app-shell { height: calc(100dvh - var(--app-header-h) - var(--app-footer-h)); max-height: none; padding: 16px; gap: 16px; }
.phase-oct2 .history-sidebar { border: 1px solid rgb(255 255 255 / 65%); border-radius: 18px; background: #f7f8fc; box-shadow: var(--shadow-md); }
.phase-oct2 .main-pane { padding: 0; gap: 16px; }
.phase-oct2 .persona-setup-panel { border-radius: 18px; padding: 18px; box-shadow: var(--shadow-md); }
.phase-oct2 .feature-grid { gap: 16px; }
.phase-oct2 .feature-control { background: #f7f8fc; border: 1px solid #e2e6f0; border-radius: 12px; padding: 12px; }
.phase-oct2 .feature-control > span { color: #4e5c77; font-weight: 500; }
.phase-oct2 .feature-control select { min-height: 40px; }
.phase-oct2 .persona-setup-actions button { min-height: 44px; background: #3e30d9; }
.phase-oct2 .chat-pane { background: #fff; border: 1px solid #dce2ee; border-radius: 18px; box-shadow: var(--shadow-md); padding: 16px; grid-template-rows: minmax(0, 1fr) auto; gap: 12px; }
.phase-oct2 .chat-log { grid-row: 1; border: 0; box-shadow: none; padding: 4px; gap: 16px; }
.phase-oct2 .chat-form { grid-row: 2; margin: 0; border-top: 1px solid #e2e6f0; padding-top: 12px; }
.phase-oct2 .chat-form textarea { background: #f7f8fc; border-radius: 12px; min-height: 54px; }
.phase-oct2 .chat-form button { min-width: 88px; border-radius: 12px; background: #3e30d9; }
.phase-oct2 .bubble { border-radius: 14px; padding: 14px 18px; max-width: min(82%, 740px); line-height: 1.65; overflow-wrap: anywhere; }
.phase-oct2 .bubble.user { justify-self: end; background: #eeecfc; border-color: #ded9f9; }
.phase-oct2 .bubble.assistant { background: #f5f7fb; border-color: #e2e6f0; }
.phase-oct2 .history-item { border-radius: 12px; margin-bottom: 8px; }
.phase-oct2 .history-item.is-active { background: #eeecfc; border-color: #bcb4f1; }
.phase-oct2 [data-survey-panel="1"] .survey-demo-balance__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.phase-oct2 [data-survey-panel="1"] .survey-demo-dim { background: #f8f9fd; border-radius: 14px; padding: 16px; border-color: #dde2ee; }
.phase-oct2 [data-survey-panel="1"] .survey-demo-dim.is-invalid { border-color: #bb3c4a; background: #fff7f8; }
.phase-oct2 [data-survey-panel="1"] .survey-demo-option__input { min-height: 40px; border-radius: 8px; }
.phase-oct2 [data-survey-panel="1"] .survey-demo-option__input[aria-invalid="true"] { border-color: #bb3c4a; }
.phase-oct2 [data-survey-panel="1"] .survey-demo-balance__status { padding: 12px 14px; border-radius: 10px; line-height: 1.5; }
/* Minimal independent spacing repair for existing Visualization actions. */
.sentiment-topbar__actions { align-items: center; gap: 12px; }
.sentiment-topbar__actions > :is(a,button) { margin: 0; min-height: 42px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 900px) {
  .phase-oct2 .projects-page-layout { grid-template-columns: minmax(0, 1fr); }
  .phase-oct2 .projects-account-rail { display: none; }
  .phase-oct2 .projects-row { grid-template-columns: minmax(0, 1fr); }
  .phase-oct2 .projects-row__toolbar { grid-column: 1; justify-content: flex-start; }
  .phase-oct2 .projects-main-panel { padding: 20px; }
}
@media (max-width: 640px) {
  .has-app-chrome { --app-header-h: 72px; --app-footer-h: 30px; }
  .app-header { gap: 8px; padding: 10px 12px; }
  .app-header__brand { font-size: 13px; gap: 8px; }
  .app-header__brand small, .app-header__user, .app-footer span:last-child { display: none; }
  .app-header__mark { width: 32px; height: 32px; }
  .app-header__nav { gap: 4px; font-size: 12px; }
  .app-header__nav a { padding: 8px; }
  .phase-oct2 .projects-page { padding: 16px 10px; }
  .phase-oct2 .projects-row { padding: 16px; }
  .phase-oct2 .projects-row__toolbar { display: grid; grid-template-columns: 1fr 1fr auto; width: 100%; gap: 8px; }
  .phase-oct2 .projects-hub-btn { min-width: 0; }
  .phase-oct2 .app-shell { padding: 8px; gap: 8px; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); overflow-y: auto; }
  .phase-oct2 .history-sidebar { max-height: 160px; overflow-y: auto; }
  .phase-oct2 .history-sidebar .sidebar-partners { display: none; }
  .phase-oct2 .chat-pane { padding: 12px; }
  .phase-oct2 .bubble { max-width: 94%; }
  .phase-oct2 [data-survey-panel="1"] .survey-demo-balance__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .phase-oct2 *, .phase-oct2 *::before, .phase-oct2 *::after { animation-duration: .01ms; transition-duration: .01ms; }
}
.phase-oct2 .bubble.user, .phase-oct2 .bubble.user p, .phase-oct2 .bubble.user .role { color: #29324e; }
/* Keep the later survey steps at their supplied V4 palette. */
.phase-oct2 #runSurveyModal:has([data-survey-step="2"]),
.phase-oct2 #runSurveyModal:has([data-survey-step="3"]),
.phase-oct2 #runSurveyModal:has([data-survey-step="4"]) { --accent: #2d9c4a; --accent-hover: #248a3f; --accent-soft: rgb(45 156 74 / 12%); --accent-ring: rgb(45 156 74 / 28%); }

.phase-oct2 .history-item.active { background: #eeecfc; border-color: #bcb4f1; }

.phase-oct2 :is(#surveyQuestionEditorModal, #surveyImportReviewModal, #surveyBankModal, #surveyDeleteQuestionModal, #surveyDeleteBankQuestionModal) { --accent: #2d9c4a; --accent-hover: #248a3f; --accent-soft: rgb(45 156 74 / 12%); --accent-ring: rgb(45 156 74 / 28%); }
.has-app-chrome .sentiment-topbar__actions a[href="/projects"] { display: none; }