:root {
  --navy: #071b32;
  --navy-2: #0d2949;
  --blue: #1769ff;
  --blue-soft: #eaf1ff;
  --cyan: #48d6d2;
  --ink: #14243a;
  --muted: #617087;
  --line: #dce4ef;
  --paper: #ffffff;
  --canvas: #f3f6fa;
  --success: #1ba381;
  --shadow: 0 18px 50px rgba(7, 27, 50, .12);
}

* { box-sizing: border-box; }
html { font-size: 16px; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  background: var(--canvas);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}
button, textarea, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, textarea:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid rgba(23,105,255,.6); outline-offset: 2px; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.app-shell {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 300px;
  grid-template-rows: 76px minmax(0, 1fr);
  min-height: 100vh;
}
.topbar {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 28px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 20;
}
.topbar-actions { display: flex; align-items: center; gap: 18px; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--navy); text-decoration: none; }
.brand-mark {
  display: grid; place-items: center; width: 42px; height: 42px; color: white; background: var(--navy);
  font-size: .9rem; font-weight: 800; letter-spacing: -.04em; border-radius: 7px 15px 7px 7px;
}
.brand span:last-child { display: grid; line-height: 1.08; }
.brand strong { font-size: 1rem; letter-spacing: -.01em; }
.brand small { margin-top: 5px; color: var(--muted); font-size: .78rem; }
.trust { display: flex; align-items: center; gap: 8px; color: #3e5068; font-size: .84rem; font-weight: 650; }
.trust-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px rgba(27,163,129,.12); }
.mobile-topics { display: none; }

.sidebar {
  grid-column: 1;
  grid-row: 2;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 28px 20px 22px;
  background: var(--navy);
  color: white;
  overflow-y: auto;
}
.side-intro { padding: 0 10px 17px; }
.eyebrow { color: var(--blue); font-size: .72rem; font-weight: 800; letter-spacing: .13em; }
.sidebar .eyebrow { color: var(--cyan); }
.side-intro h2 { margin: 5px 0 0; font-size: 1.35rem; letter-spacing: -.025em; }
.side-intro p { margin: 7px 0 0; color: #bdcee2; font-size: .82rem; }
.topic-search { margin: 0 0 16px; }
.topic-search label { display: block; margin: 0 0 6px 10px; font-size: .78rem; color: #bdcee2; }
.topic-search input { width: 100%; min-height: 44px; padding: 10px; border: 1px solid #486078; border-radius: 9px; background: #112d48; color: white; font-size: .8rem; }
.topic-search input::placeholder { color: #b3c5d9; }
.topic-search-status { margin: 12px 10px; color: #dce7f4; font-size: .82rem; }
.topic-list { display: grid; gap: 4px; }
.topic-group { min-width: 0; border-radius: 10px; }
.topic-group[open] { background: rgba(255,255,255,.05); }
.topic-group summary { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 10px; border-radius: 10px; color: #dce7f4; cursor: pointer; list-style: none; font-size: .88rem; font-weight: 600; }
.topic-group summary::-webkit-details-marker { display: none; }
.topic-group summary:hover { background: rgba(255,255,255,.08); color: white; }
.topic-name { flex: 1; }
.topic-chevron { color: #a4bdd8; transition: transform .16s; }
.topic-group[open] .topic-chevron { transform: rotate(180deg); }
.subtopics { display: grid; gap: 3px; margin: 0 9px 10px 23px; padding-left: 10px; border-left: 1px solid #486078; }
.topic-list button {
  display: flex; align-items: center; gap: 12px; min-height: 44px; width: 100%; padding: 8px 11px;
  border: 0; border-radius: 10px; background: transparent; color: #dce7f4; text-align: left; cursor: pointer;
  font-size: .91rem; font-weight: 550; transition: background .16s, color .16s, transform .16s;
}
.topic-list button:hover { background: rgba(255,255,255,.08); color: white; transform: translateX(2px); }
.subtopics button { min-height: 44px; padding: 9px 10px; font-size: .82rem; line-height: 1.4; font-weight: 450; }
.subtopics button[aria-current="true"] { color: white; background: #214768; box-shadow: inset 3px 0 var(--cyan); }
.sidebar :focus-visible { outline-color: var(--cyan); }
.topic-list + .topic-search-status + .helpdesk-card { margin-top: 24px; }
.topic-icon { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 auto; color: var(--cyan); background: rgba(72,214,210,.1); border-radius: 8px; font-weight: 750; }
.helpdesk-card {
  margin-top: auto; padding: 18px; border: 2px solid var(--cyan); border-radius: 16px;
  background: linear-gradient(145deg, rgba(72,214,210,.22), rgba(23,105,255,.2));
  box-shadow: 0 0 0 4px rgba(72,214,210,.08), 0 16px 32px rgba(0,0,0,.2);
}
.helpdesk-badge { display: flex; align-items: center; gap: 7px; color: white; font-size: .78rem; font-weight: 850; letter-spacing: .1em; }
.helpdesk-badge span { color: var(--cyan); font-size: .72rem; text-shadow: 0 0 10px var(--cyan); }
.helpdesk-card strong { display: block; margin: 7px 0 12px; font-size: 1rem; }
.helpdesk-card .helpdesk-action {
  display: block; width: 100%; margin-top: 8px; padding: 9px 11px; border: 1px solid rgba(255,255,255,.42);
  border-radius: 9px; background: rgba(7,27,50,.35); color: white; font-size: .86rem; font-weight: 750;
  text-align: center; text-decoration: none;
}
.helpdesk-card button.helpdesk-action { font: inherit; cursor: pointer; }
.helpdesk-card .helpdesk-action:hover { border-color: white; background: rgba(7,27,50,.62); }
.helpdesk-card .helpdesk-phone { background: var(--cyan); color: var(--navy); border-color: var(--cyan); }
.helpdesk-card .helpdesk-phone:hover { background: #7be5e2; border-color: #7be5e2; }
.helpdesk-card small { display: block; margin-top: 12px; color: #e4f8f7; font-size: .78rem; line-height: 1.45; }

.chat-panel {
  grid-column: 2;
  grid-row: 2;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  padding: 34px clamp(20px, 2vw, 36px) 20px;
  background:
    radial-gradient(circle at 95% 0%, rgba(72,214,210,.09), transparent 30%),
    linear-gradient(180deg, #f8fafc 0, var(--canvas) 100%);
}
.chat-heading { display: flex; justify-content: space-between; gap: 24px; width: min(900px, 100%); margin: 0 auto; }
.chat-heading h1 { margin: 6px 0 7px; color: var(--navy); font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.16; letter-spacing: -.045em; }
.chat-heading p { max-width: 680px; margin: 0; color: var(--muted); font-size: .94rem; }
.new-chat { align-self: start; padding: 9px 13px; border: 1px solid var(--line); border-radius: 10px; background: white; color: #42536a; cursor: pointer; white-space: nowrap; }
.new-chat:hover { border-color: #b7c6da; color: var(--navy); }

.messages { flex: 1; width: min(1100px, 100%); min-height: 190px; margin: 24px auto 12px; overflow-y: auto; scrollbar-width: thin; container-type: inline-size; container-name: conversation; }
.message { display: flex; align-items: flex-start; gap: 11px; margin: 0 0 18px; animation: rise .24s ease-out; }
.message.user { justify-content: flex-end; }
.avatar { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 auto; border-radius: 7px 12px 7px 7px; background: var(--navy); color: white; font-size: .7rem; font-weight: 800; }
.bubble { max-width: min(680px, 86%); padding: 14px 17px; border: 1px solid var(--line); border-radius: 5px 17px 17px 17px; background: white; box-shadow: 0 7px 22px rgba(12,39,73,.06); }
.user .bubble { border: 0; border-radius: 17px 5px 17px 17px; background: var(--blue); color: white; box-shadow: 0 8px 22px rgba(23,105,255,.18); }
.bubble p { margin: 0 0 8px; }
.bubble p:last-child { margin-bottom: 0; }
.bubble ol, .bubble ul { margin: 8px 0 4px; padding-left: 22px; }
.bubble li { margin: 6px 0; }
.bubble a { color: #075acb; font-weight: 650; text-underline-offset: 3px; }
.support-contact {
  margin-top: 14px; padding: 13px 14px; border-left: 4px solid var(--blue); border-radius: 8px;
  background: var(--blue-soft); color: #173b6d;
}
.support-contact > strong { display: block; margin-bottom: 4px; color: var(--navy); }
.support-contact p { font-size: .91rem; }
.source-tag { display: inline-block; margin-top: 10px; padding: 5px 9px; border-radius: 999px; background: var(--blue-soft); color: #315d9f; font-size: .72rem; font-weight: 700; text-decoration: none; }
.source-tag:hover { background: #dbe7ff; color: #164f9e; text-decoration: underline; }
.device-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.device-actions button { padding: 8px 11px; border: 1px solid #b9c9df; border-radius: 9px; background: white; color: var(--navy); font-size: .84rem; font-weight: 650; cursor: pointer; }
.device-actions button:hover { border-color: var(--blue); background: var(--blue-soft); }

.starter-prompts { display: flex; flex-wrap: wrap; gap: 8px; width: min(900px, 100%); margin: 0 auto 10px; }
.starter-prompts button { padding: 8px 12px; border: 1px solid #ced9e7; border-radius: 999px; background: rgba(255,255,255,.8); color: #3b506a; font-size: .82rem; cursor: pointer; }
.starter-prompts button:hover { border-color: var(--blue); color: var(--blue); }
.composer-row { display: flex; align-items: stretch; gap: 10px; width: min(900px, 100%); margin: 0 auto; }
.composer { display: flex; align-items: end; gap: 10px; flex: 1; min-width: 0; margin: 0; padding: 8px 9px 8px 17px; border: 1px solid #c8d4e3; border-radius: 16px; background: white; box-shadow: var(--shadow); }
.composer:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(23,105,255,.09), var(--shadow); }
.composer textarea { flex: 1; max-height: 126px; resize: none; padding: 8px 0; border: 0; outline: 0; color: var(--ink); background: transparent; line-height: 1.45; }
.composer textarea::placeholder { color: #8a98aa; }
.send { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 auto; border: 0; border-radius: 12px; background: var(--blue); color: white; cursor: pointer; font-size: 1.15rem; transition: transform .15s, background .15s; }
.send:hover { background: #0759e9; transform: translateY(-1px); }
.new-chat-composer { align-self: stretch; display: inline-flex; align-items: center; gap: 6px; border-color: #b9c9df; background: var(--navy); color: white; font-weight: 750; }
.new-chat-composer:hover { border-color: var(--navy-2); background: var(--navy-2); color: white; }
.privacy-note { width: min(900px, 100%); margin: 10px auto 0; color: #78869a; text-align: center; font-size: .74rem; }
.privacy-note span { margin-right: 5px; color: var(--success); }

.hours-rail {
  grid-column: 3; grid-row: 2; min-width: 0; min-height: 0; padding: 26px 22px 24px;
  overflow-y: auto; border-left: 1px solid var(--line); background: var(--paper);
  box-shadow: -12px 0 34px rgba(7,27,50,.05);
}
.hours-rail-heading { padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.hours-rail-heading h2 { margin: 4px 0 12px; color: var(--navy); font-size: 1.55rem; letter-spacing: -.035em; }
.hours-rail-heading a { display: grid; color: var(--blue); font-size: 1.08rem; font-weight: 800; text-decoration: none; }
.hours-rail-heading a span { color: var(--muted); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; }
.hours-rail-heading a:hover { text-decoration: underline; text-underline-offset: 3px; }
.hours-rail-lead { display: grid; gap: 2px; margin: 16px 0 22px; padding: 13px 14px; border-radius: 11px; background: var(--navy); color: white; font-size: .9rem; }
.hours-rail-lead strong { margin-bottom: 4px; }
.hours-rail-sections { display: grid; gap: 26px; }
.hours-rail-sections > section + section { padding-top: 24px; border-top: 1px solid var(--line); }
.language-label { display: inline-block; padding: 4px 8px; border-radius: 999px; background: var(--blue-soft); color: #315d9f; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hours-rail-sections h3 { margin: 9px 0 8px; color: var(--navy); font-size: 1rem; }
.hours-rail-list { display: grid; margin: 0; }
.hours-rail-list > div { display: grid; grid-template-columns: 42px 1fr; gap: 8px; padding: 7px 0; border-top: 1px solid var(--line); }
.hours-rail-list dt { color: var(--blue); font-weight: 850; }
.hours-rail-list dd { display: grid; margin: 0; font-size: .9rem; }
.hours-rail-list dd strong { color: var(--navy); }
.hours-rail-list dd span { color: var(--muted); }
.hours-rail-friday { margin: 10px 0 0; padding: 11px 12px; border-left: 4px solid var(--cyan); border-radius: 8px; background: #effafa; color: #52647a; font-size: .88rem; }
.hours-rail-friday strong { color: var(--navy); }

@keyframes rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 1320px) {
  .app-shell { grid-template-columns: 260px minmax(0, 1fr); grid-template-rows: 76px minmax(0, 1fr) auto; }
  .hours-rail { grid-column: 2; grid-row: 3; display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 22px; border-top: 1px solid var(--line); border-left: 0; }
  .hours-rail-heading { border-bottom: 0; }
  .hours-rail-lead { align-self: start; margin: 0; }
  .hours-rail-sections { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hours-rail-sections > section + section { padding: 0 0 0 22px; border-top: 0; border-left: 1px solid var(--line); }
}
@media (max-width: 820px) {
  .app-shell { display: block; min-height: 100svh; }
  .topbar { height: 68px; padding: 0 17px; }
  .trust { display: none; }
  .topbar-actions { gap: 8px; }
  .mobile-topics { display: inline-flex; padding: 8px 11px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--navy); font-weight: 650; }
  .sidebar { position: fixed; inset: 68px 0 0 0; z-index: 15; transform: translateX(-102%); transition: transform .22s ease; padding: 24px 18px; }
  .sidebar.open { transform: none; }
  .topic-list { grid-template-columns: 1fr; }
  .chat-panel { min-height: calc(100svh - 68px); padding: 24px 16px 14px; }
  .chat-heading { align-items: start; }
  .chat-heading h1 { font-size: 1.7rem; }
  .chat-heading p { font-size: .88rem; }
  .new-chat span { display: none; }
  .new-chat-composer { min-width: 48px; justify-content: center; padding: 9px 12px; }
  .messages { margin-top: 19px; }
  .hours-rail { display: block; padding: 24px 18px; }
  .hours-rail-lead { margin: 16px 0 22px; }
  .hours-rail-sections { grid-template-columns: 1fr; }
  .hours-rail-sections > section + section { padding: 24px 0 0; border-top: 1px solid var(--line); border-left: 0; }
}
@media (max-width: 470px) {
  .topic-list { grid-template-columns: 1fr; }
  .bubble { max-width: 90%; padding: 13px 14px; }
  .starter-prompts { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; }
  .starter-prompts button { white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

.answer-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; flex: 1; min-width: 0; }
.answer-layout > .bubble { min-width: 0; width: 100%; max-width: 100%; overflow-wrap: anywhere; }
.guide-email-card { min-width: 0; align-self: start; border: 1px solid #c9d9ec; border-radius: 14px; background: white; color: var(--ink); box-shadow: 0 5px 18px rgba(12,39,73,.045); overflow: hidden; }
.guide-email-toggle { display: flex; align-items: center; gap: 10px; min-height: 76px; padding: 14px; list-style: none; cursor: pointer; }
.guide-email-toggle::-webkit-details-marker { display: none; }
.guide-email-toggle:hover { background: #f3f8ff; }
.guide-email-toggle:focus-visible { outline-offset: -3px; border-radius: 13px; }
.guide-email-icon { display: grid; place-items: center; width: 36px; height: 36px; flex-shrink: 0; border-radius: 10px; background: #e9f4ff; color: #1461ce; }
.guide-email-title { display: grid; gap: 3px; min-width: 0; flex: 1; }
.guide-email-title strong { font-size: .9rem; color: var(--navy); line-height: 1.3; }
.guide-email-title > span { font-size: .71rem; color: #5d7088; }
.guide-email-chevron { color: #50729b; transition: transform .16s; }
.guide-email-card[open] .guide-email-chevron { transform: rotate(180deg); }
.guide-email-card[open] { border-color: #8eb4e8; }
.guide-email-card[open] .guide-email-toggle { background: #f3f8ff; border-bottom: 1px solid #dfebf8; }
.guide-email { padding: 14px; margin: 0; }
.guide-email p { margin: 0; }
.guide-email .guide-email-intro { margin-bottom: 14px; color: #52647b; font-size: .78rem; line-height: 1.5; }
.guide-email label { display: block; margin: 12px 0 6px; font-size: .78rem; font-weight: 700; }
.guide-email-roles { border: 0; padding: 0; margin: 0 0 14px; min-width: 0; }
.guide-email-roles legend { padding: 0; margin-bottom: 6px; font-size: .78rem; font-weight: 700; }
.guide-email-role-options { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 10px; background: #edf2f8; }
.guide-email-role-options label { position: relative; margin: 0; cursor: pointer; }
.guide-email-role-options input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.guide-email-role-options span { display: grid; place-items: center; min-height: 38px; border: 1px solid transparent; border-radius: 7px; color: #576c86; font-size: .78rem; }
.guide-email-role-options input:checked + span { border-color: #cfdded; background: white; color: #1258b6; box-shadow: 0 2px 5px rgba(7,27,50,.06); }
.guide-email-role-options input:focus-visible + span { outline: 3px solid #88b5f7; outline-offset: 1px; }
.guide-email-address { display: flex; align-items: stretch; overflow: hidden; width: 100%; border: 1px solid #b1c5df; border-radius: 9px; background: white; }
.guide-email-address:focus-within { outline: 3px solid rgba(23,105,255,.18); border-color: var(--blue); }
.guide-email-address input { min-width: 0; width: 100%; flex: 1; min-height: 44px; padding: 9px 8px; border: 0; border-radius: 0; background: white; color: var(--ink); font-size: .86rem; }
.guide-email-address span { display: flex; align-items: center; flex-shrink: 0; padding: 9px 7px; border-left: 1px solid #dce6f3; background: #f0f5fc; color: #31557f; font-size: .71rem; font-weight: 650; }
.guide-email .guide-email-hint { margin-top: 7px; color: #5b6e85; font-size: .73rem; }
.guide-email .guide-email-error { margin-top: 8px; color: #a32121; font-size: .76rem; font-weight: 650; }
.guide-email .guide-email-preview { margin-top: 10px; padding: 8px; border-radius: 7px; background: #eaf5f0; color: #215b48; font-size: .75rem; overflow-wrap: anywhere; }
.guide-email .guide-email-notice { margin: 14px 0; padding: 10px 11px; border-left: 3px solid #a16e00; border-radius: 7px; background: #fff4d4; color: #553900; }
.guide-email-notice strong { display: block; font-size: .8rem; line-height: 1.45; }
.guide-email-send { min-height: 42px; width: 100%; padding: 10px 12px; border: 0; border-radius: 8px; background: var(--blue); color: white; font-size: .82rem; font-weight: 750; }
.guide-email-send:disabled { background: #e2e9f2; color: #4c5f76; cursor: not-allowed; }
.guide-email .guide-email-availability { margin-top: 8px; color: #617087; font-size: .72rem; line-height: 1.5; }
@container conversation (min-width: 660px) {
  .answer-layout { grid-template-columns: minmax(0, 1fr) 260px; gap: 16px; }
}
@media (max-width: 470px) {
  .message.bot { gap: 8px; }
  .message.bot > .avatar { width: 28px; height: 28px; }
  .guide-email-toggle { min-height: 68px; padding: 12px; }
  .guide-email { padding: 12px; }
}

.session-notice { width: min(1100px, 100%); margin: 16px auto 0; padding: 11px 14px; border-radius: 10px; background: #e9f5ef; color: #245b45; font-size: .85rem; }
.session-dialog { width: min(460px, calc(100vw - 32px)); max-height: calc(100svh - 32px); overflow-y: auto; margin: auto; padding: 30px; border: 1px solid #d7e3f0; border-radius: 22px; background: white; color: var(--ink); box-shadow: 0 24px 80px rgba(7,27,50,.28); text-align: center; }
.session-dialog::backdrop { background: rgba(7,27,50,.6); backdrop-filter: blur(3px); }
.session-dialog-icon { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 14px; border-radius: 15px; background: var(--blue-soft); color: var(--blue); font-size: 2rem; }
.session-dialog h2 { margin: 0 0 10px; color: var(--navy); font-size: 1.5rem; letter-spacing: -.03em; }
.session-dialog p { margin: 0; color: #53657b; font-size: .9rem; }
.session-countdown { display: grid; gap: 2px; margin: 22px 0 16px; padding: 14px; border: 1px solid #dbe7f8; border-radius: 14px; background: #f5f8ff; }
.session-countdown > span:first-child { color: var(--navy); font-size: 2.7rem; font-weight: 800; line-height: 1.2; font-variant-numeric: tabular-nums; }
.session-countdown > span:last-child { color: #5c708c; font-size: .8rem; }
.session-dialog .session-dialog-hint { font-size: .8rem; }
.session-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.session-dialog-actions button { min-height: 46px; padding: 11px 10px; border: 1px solid #bdcce0; border-radius: 10px; background: white; color: #314966; cursor: pointer; font-size: .86rem; font-weight: 700; }
.session-dialog-actions #continueSession { border-color: var(--blue); background: var(--blue); color: white; }
.session-dialog-actions #continueSession:hover { background: #0759e9; }
.session-dialog-actions #endSessionNow:hover { background: #edf2f8; }
@media (max-width: 400px) { .session-dialog { padding: 23px 18px; } .session-dialog-actions { grid-template-columns: 1fr; } }

.stats-link{font-size:12px;color:#506b83;text-decoration:none}.stats-link:hover{text-decoration:underline}
.answer-feedback{border-top:1px solid #dce5ee;margin-top:20px;padding-top:14px}.feedback-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.feedback-row>span{font-size:13px;font-weight:650;margin-right:auto}.answer-feedback button{font:inherit;font-size:12px;min-height:36px;border:1px solid #cbd8e4;border-radius:9px;background:#fff;padding:7px 11px;cursor:pointer;color:#263d54}.answer-feedback button:hover{background:#edf4fa}.answer-feedback button[aria-pressed=true]{background:#dcece7;border-color:#28765b;color:#164f3c}.answer-feedback [data-vote="-1"][aria-pressed=true]{background:#fff0e9;border-color:#c86a43;color:#873c21}.answer-feedback button:focus-visible{outline:3px solid #4287be;outline-offset:2px}.answer-feedback button:disabled{opacity:.5;cursor:wait}.feedback-reasons{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.feedback-reasons[hidden]{display:none}.feedback-reasons>span{width:100%;font-size:12px;color:#566779}.feedback-status{display:block;font-size:12px;color:#28644e;margin-top:8px}.feedback-status:empty{display:none}.feedback-privacy{display:block;font-size:10px;line-height:1.5;color:#697a8a;margin-top:8px}

/* Standard keeps the original workspace; Simple is a guided, button-only view. */
.brand-and-mode{display:flex;align-items:center;gap:26px;min-width:0}.mode-switch{display:flex;gap:3px;padding:4px;border:1px solid #d7e1ed;border-radius:12px;background:#eff3f8}.mode-switch button{min-height:38px;padding:7px 15px;border:0;border-radius:8px;background:transparent;color:#52657b;font-size:.82rem;font-weight:700;cursor:pointer}.mode-switch button[aria-pressed=true]{background:var(--navy);color:white;box-shadow:0 2px 5px #071b3220}.mode-switch button:hover:not([aria-pressed=true]){background:#dfe8f3;color:var(--navy)}
.simple-picker{width:min(1100px,100%);margin:8px auto 20px;padding:24px;border:1px solid var(--line);border-radius:20px;background:white;box-shadow:0 12px 36px #0d294909}.simple-picker-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.simple-picker h2{margin:6px 0;color:var(--navy);font-size:1.4rem;letter-spacing:-.025em}.simple-hint{margin:5px 0 20px;color:var(--muted);font-size:.9rem}.simple-back{padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:white;color:var(--navy);font-size:.82rem;cursor:pointer;white-space:nowrap}.simple-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.simple-topic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.simple-option{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:72px;width:100%;padding:15px;border:1px solid #d5e0ed;border-radius:12px;background:#f8fafc;text-align:left;color:var(--navy);cursor:pointer;transition:border-color .15s,background .15s}.simple-option:hover{background:#edf4ff;border-color:#6a98dc}.simple-option strong{display:block;font-size:.91rem;font-weight:700;line-height:1.35}.simple-option small{display:block;margin-top:5px;color:var(--muted);font-size:.74rem}.simple-option>span:last-child{color:#607d9b}.simple-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:9px;background:#e4eef8;color:#21578a!important;font-weight:750}.simple-topic>span:nth-child(2){flex:1}.simple-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #e5ebf3;margin-top:20px;padding-top:15px;color:var(--muted);font-size:.77rem}.simple-footer button{background:transparent;border:0;color:#195cb0;font:inherit;font-weight:700;cursor:pointer;min-height:40px}
body[data-mode=simple] .app-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:76px 1fr}body[data-mode=simple] .sidebar,body[data-mode=simple] .hours-rail,body[data-mode=simple] .mobile-topics,body[data-mode=simple] .starter-prompts{display:none}body[data-mode=simple] .chat-panel{grid-column:1;width:100%;padding-inline:max(24px,calc((100% - 1150px)/2))}body[data-mode=simple] .chat-heading{width:min(1100px,100%)}body[data-mode=simple] .messages{flex:0 1 auto;min-height:0}body[data-mode=simple] .device-actions button{min-height:48px;padding:12px 18px;font-size:.95rem}body[data-mode=simple] .new-chat span{display:inline}body[data-mode=simple] .message[tabindex]:focus{outline:none}body[data-mode=simple] .message[tabindex]:focus-visible{outline:3px solid #91b5e4;outline-offset:4px;border-radius:12px}
@media(max-width:1050px){.brand-and-mode{gap:16px}.topbar .trust{display:none}}
@media(max-width:820px){.simple-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-mode=simple] .chat-panel{padding:24px 16px 14px}.brand-and-mode{gap:12px}.mode-switch button{padding:7px 10px}.brand{gap:8px}.brand strong{font-size:.9rem}.brand small{font-size:.7rem}.brand-mark{width:36px;height:36px}}
@media(max-width:560px){.app-shell,body[data-mode=simple] .app-shell{grid-template-rows:auto minmax(0,1fr)}.topbar{height:auto;min-height:120px;align-items:flex-start;padding:12px 14px;gap:8px}.brand-and-mode{flex-wrap:wrap;gap:10px;flex:1}.mode-switch{flex-basis:auto}.topbar-actions{padding-top:8px}.sidebar{top:120px}.simple-picker{padding:17px;border-radius:15px}.simple-picker-heading{align-items:flex-start}.simple-picker h2{font-size:1.22rem}.simple-options{grid-template-columns:1fr}.simple-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.simple-topic{display:block;padding:12px;min-height:110px}.simple-icon{margin-bottom:9px}.simple-arrow{display:none}.simple-footer{align-items:flex-start;flex-direction:column;gap:4px}.simple-back{font-size:.75rem;padding:8px}.chat-heading{gap:10px}body[data-mode=simple] .new-chat{font-size:.75rem;padding:9px}.simple-option strong{font-size:.85rem}}

/* One scrollable page lets visitors read back naturally in both modes. */
.messages{overflow:visible}
body[data-mode=standard] .composer-row{position:sticky;bottom:max(12px,env(safe-area-inset-bottom));z-index:5;padding:8px 0;border-radius:16px;background:var(--canvas)}
.simple-picker,.device-actions{scroll-margin-block:16px}

/* Compact mode link sits immediately to the left of Statistics. */
.topbar .mode-link{font:inherit;font-size:12px;color:#506b83;background:none;border:0;padding:0;cursor:pointer;white-space:nowrap}.topbar .mode-link:hover{text-decoration:underline}#confirmStandard{background:var(--blue);border-color:var(--blue);color:white}#modeDialog p+p{margin-top:12px}
@media(max-width:560px){.topbar{flex-wrap:wrap;min-height:110px}.topbar-actions{flex-wrap:wrap;padding-top:0}.sidebar{top:110px}}
