/* MavsHQ walkthrough (How we work). Every selector is scoped to .hq-shell-section.
   The section is one app panel like the homepage panels (100svh - 36px, 18px margin). It mirrors the
   MavsHQ shell: three rails - left (questions), top (page title) and right (Mav chat). The Mavericks
   logo sits where the left and top rails meet; Mav sits where the top and right rails meet.
   Each view is a subgrid over the top rail, main area and chat, so switching never changes the height. */
.hq-shell-section{--hq-ink:#293e32;--hq-muted:#5a695c;--hq-line:#e4e7df;--hq-soft:#f7f6f1;--hq-acc:#8463bd;--hq-acc-ink:#6b4aa8;--hq-acc-soft:#f2edfb;--hq-mint:#c3edc7;--hq-ok:#2c6b3a;--hq-dark:#131b18;height:calc(100svh - 36px);min-height:560px;margin:18px;padding:0;display:flex}
.hq-shell-section .hq-window{flex:1;min-width:0;display:grid;grid-template-columns:248px minmax(0,1fr) 360px;grid-template-rows:60px minmax(0,1fr);background:#fff;border:1px solid #dbe0d6;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px -44px rgba(19,27,24,.35);color:var(--hq-ink);font-family:'Manrope',Arial,sans-serif;text-align:left}
.hq-shell-section .hq-window p{line-height:1.5;margin:0}
.hq-shell-section .hq-window em{font-style:normal}
.hq-shell-section .hq-window h3,.hq-shell-section .hq-window h4{margin:0;letter-spacing:-.015em;font-weight:600;line-height:1.3}
.hq-shell-section .hq-window ul{margin:0;padding:0;list-style:none}
.hq-shell-section .hq-window button{font:inherit;color:inherit;background:none;border:0;padding:0;text-align:left}
.hq-shell-section .hq-window button:focus-visible{outline:2px solid var(--hq-acc);outline-offset:2px}
.hq-shell-section .hq-ico{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.hq-shell-section .hq-ico-sm{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* Corner cells: Mavericks logo (left x top) and Mav (top x right) */
.hq-shell-section .hq-logo{grid-column:1;grid-row:1;display:flex;align-items:center;gap:10px;padding:0 22px;border-right:1px solid var(--hq-line);border-bottom:1px solid var(--hq-line);background:#fff}
.hq-shell-section .hq-mark{width:22px;height:18px;flex:none;background:var(--hq-acc);mask:url('/assets/mavericks-mark.svg') center/contain no-repeat;-webkit-mask:url('/assets/mavericks-mark.svg') center/contain no-repeat}
.hq-shell-section .hq-logo img{width:104px;height:auto;filter:brightness(0);opacity:.82}
.hq-shell-section .hq-mavhead,.hq-shell-section .hq-chat-head{display:flex;align-items:center;gap:10px;padding:0 18px;background:#fff}
.hq-shell-section .hq-mavhead{grid-column:3;grid-row:1;border-left:1px solid var(--hq-line);border-bottom:1px solid var(--hq-line)}
.hq-shell-section .hq-mavhead img,.hq-shell-section .hq-chat-head img{width:32px;height:32px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--hq-acc)}
.hq-shell-section .hq-mavhead b,.hq-shell-section .hq-chat-head b{display:block;font-size:13.5px}
.hq-shell-section .hq-mavhead small,.hq-shell-section .hq-chat-head small{display:block;font-size:11px;color:var(--hq-muted)}
.hq-shell-section .hq-chat-head{display:none}

/* Left rail */
.hq-shell-section .hq-side{grid-column:1;grid-row:2;display:flex;flex-direction:column;min-height:0;padding:18px 12px 14px;background:#fff;border-right:1px solid var(--hq-line)}
.hq-shell-section .hq-side-label{margin:0 10px 10px!important;font:500 10px 'Space Grotesk',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#5a695c}
.hq-shell-section .hq-tablist{display:flex;flex-direction:column;gap:3px;overflow:auto;min-height:0}
.hq-shell-section .hq-window .hq-nav{position:relative;display:flex;align-items:flex-start;gap:10px;width:100%;padding:10px 11px;border-radius:10px;font-size:13.5px;font-weight:500;line-height:1.35;color:#3e5246;transition:background .15s,color .15s}
.hq-shell-section .hq-nav .hq-ico{margin-top:1px;color:#7b8a7f}
.hq-shell-section .hq-nav:hover{background:var(--hq-soft)}
.hq-shell-section .hq-nav[aria-selected="true"]{background:var(--hq-acc-soft);color:var(--hq-acc-ink)}
.hq-shell-section .hq-nav[aria-selected="true"] .hq-ico{color:var(--hq-acc)}
.hq-shell-section .hq-nav>span{flex:1}
.hq-shell-section .hq-nav>em{align-self:center;padding:2px 7px;border-radius:99px;background:var(--hq-acc-soft);color:var(--hq-acc-ink);font-size:10px;font-weight:600}
.hq-shell-section .hq-nav[aria-selected="true"]>em{background:#fff}
.hq-shell-section .hq-tablist .hq-rule{height:1px;margin:8px 10px;background:var(--hq-line);flex:none}
.hq-shell-section .hq-shared{margin-top:auto!important;display:flex;gap:8px;align-items:flex-start;padding:12px 10px 0;border-top:1px solid var(--hq-line);font-size:11px;color:var(--hq-muted)}
.hq-shell-section .hq-shared .hq-ico-sm{margin-top:2px;color:var(--hq-acc)}

/* Views: subgrid over [top rail | Mav cell] and [main | chat] */
.hq-shell-section .hq-view{grid-column:2/4;grid-row:1/3;display:grid;grid-template-columns:subgrid;grid-template-rows:subgrid;min-height:0;min-width:0;visibility:hidden;pointer-events:none}
.hq-shell-section .hq-view.is-active{visibility:visible;pointer-events:auto}
.hq-shell-section .hq-view.is-active>.hq-center,.hq-shell-section .hq-view.is-active>.hq-chat,.hq-shell-section .hq-view.is-active>.hq-top>div{animation:hq-in .35s ease both}
.hq-shell-section .hq-view.is-active>.hq-chat{animation-delay:.06s}
@keyframes hq-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hq-shell-section .hq-top{grid-column:1;grid-row:1;display:flex;align-items:center;gap:12px;padding:0 24px;border-bottom:1px solid var(--hq-line);background:#fff;min-width:0}
.hq-shell-section .hq-top>div{flex:1;min-width:0}
.hq-shell-section .hq-crumbs{display:flex;gap:6px;font-size:10.5px;color:var(--hq-muted)}
.hq-shell-section .hq-crumbs i{font-style:normal;color:#b5beb6}
.hq-shell-section .hq-top h3{font-size:17px;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hq-shell-section .hq-range{padding:4px 10px;border:1px solid var(--hq-line);border-radius:8px;font-size:12px;color:var(--hq-muted);white-space:nowrap}
.hq-shell-section .hq-demo{font:400 9.5px 'Space Grotesk',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#5a695c;white-space:nowrap}
.hq-shell-section .hq-center{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:12px;min-height:0;overflow:auto;padding:20px 24px;background:#fafaf6}

/* "How we work" callout inside the main area */
.hq-shell-section .hq-explain{margin-top:auto;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;padding:16px 20px;border-radius:14px;background:var(--hq-acc-soft);border:1px solid #e6dcf7;color:#3f3657}
.hq-shell-section .hq-eyebrow{font:500 10px 'Space Grotesk',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--hq-acc)}
.hq-shell-section .hq-explain h4{margin:3px 0 5px!important;font-size:15px;letter-spacing:-.02em;color:var(--hq-ink)}
.hq-shell-section .hq-explain p:not(.hq-eyebrow){font-size:12.5px}
.hq-shell-section .hq-explain ul{display:flex;flex-direction:column;gap:7px;align-self:center}
.hq-shell-section .hq-explain li{display:flex;gap:8px;align-items:flex-start;font-size:12px;line-height:1.4}
.hq-shell-section .hq-explain li .hq-ico-sm{margin-top:1px;padding:2px;width:16px;height:16px;border-radius:50%;background:#fff;color:var(--hq-ok)}
.hq-shell-section .hq-explain li.hq-weekly{color:var(--hq-acc-ink);font-weight:600}
.hq-shell-section .hq-explain li.hq-weekly .hq-ico-sm{color:var(--hq-acc)}

/* Mav chat rail */
.hq-shell-section .hq-chat{grid-column:2;grid-row:2;display:flex;flex-direction:column;min-height:0;border-left:1px solid var(--hq-line);background:linear-gradient(180deg,#faf8fe,#f7f6f1)}
.hq-shell-section .hq-chat-body{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:12px;padding:18px 16px}
.hq-shell-section .hq-bubble{padding:11px 13px;border-radius:14px;font-size:12.5px}
.hq-shell-section .hq-bubble.is-recruiter{align-self:flex-end;max-width:88%;background:var(--hq-dark);color:#eef4ee;border-bottom-right-radius:4px}
.hq-shell-section .hq-bubble.is-mav{background:#fff;border:1px solid var(--hq-line);border-bottom-left-radius:4px;box-shadow:0 6px 16px -10px rgba(19,27,24,.2)}
.hq-shell-section .hq-speaker{display:block;margin-bottom:3px;font:500 9.5px 'Space Grotesk',sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.65}
.hq-shell-section .is-mav .hq-speaker{color:var(--hq-acc-ink);opacity:1}
.hq-shell-section .hq-mav-visual{margin-top:10px}
.hq-shell-section .hq-chat-input{display:flex;align-items:center;justify-content:space-between;margin:0 14px 14px;padding:10px 12px;border:1px solid var(--hq-line);border-radius:12px;background:#fff;font-size:12px;color:#5a695c}
.hq-shell-section .hq-chat-input i{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--hq-acc-soft);color:var(--hq-acc)}

/* Mav visuals */
.hq-shell-section .hq-seg{display:flex;gap:3px;height:10px}
.hq-shell-section .hq-seg i{border-radius:3px}
.hq-shell-section .hq-seg .is-ok{background:#7fcf8b}
.hq-shell-section .hq-seg .is-warn{background:#e7bf6c}
.hq-shell-section .hq-mav-legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:7px!important;font-size:11px;color:var(--hq-muted)}
.hq-shell-section .hq-mav-legend span:before{content:'';display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:2px;background:#7fcf8b;vertical-align:-1px}
.hq-shell-section .hq-mav-legend .is-warn:before{background:#e7bf6c}
.hq-shell-section .hq-mav-legend .is-actual:before{background:var(--hq-acc)}
.hq-shell-section .hq-mav-legend .is-forecast:before{background:none;border:1.5px dashed var(--hq-acc);width:6px;height:6px}
.hq-shell-section .hq-matches{display:flex;flex-direction:column;gap:6px}
.hq-shell-section .hq-matches li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 9px;border:1px solid #eeefe9;border-radius:10px;background:var(--hq-soft)}
.hq-shell-section .hq-matches img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.hq-shell-section .hq-matches b{display:block;font-size:12px}
.hq-shell-section .hq-matches small{display:block;font-size:10.5px;line-height:1.35;color:var(--hq-muted)}
.hq-shell-section .hq-matches em{display:block;color:var(--hq-ok);font-weight:600}
.hq-shell-section .hq-matches em.is-new{color:var(--hq-muted);font-weight:500}
.hq-shell-section .hq-matches strong{font:500 13px 'Space Grotesk',sans-serif;color:var(--hq-acc-ink)}
.hq-shell-section .hq-line{display:block;width:100%;height:auto}
.hq-shell-section .hq-line text{font:9px 'Space Grotesk',sans-serif;fill:#8d998f}
.hq-shell-section .hq-line .grid{stroke:#eceee8}
.hq-shell-section .hq-line .fill{fill:rgba(184,153,244,.16)}
.hq-shell-section .hq-line .actual{fill:none;stroke:var(--hq-acc);stroke-width:2.2;stroke-linejoin:round}
.hq-shell-section .hq-line .forecast{fill:none;stroke:var(--hq-acc);stroke-width:2;stroke-dasharray:4 4}
.hq-shell-section .hq-line .today{stroke:#c9cfc6;stroke-dasharray:2 3}
.hq-shell-section .hq-line .today-label{fill:var(--hq-muted)}
.hq-shell-section .hq-line circle.is-actual{fill:var(--hq-acc);stroke:#fff;stroke-width:1.5}
.hq-shell-section .hq-line circle.is-forecast{fill:#fff;stroke:var(--hq-acc);stroke-width:1.5}
.hq-shell-section .hq-pass li{display:grid;grid-template-columns:96px minmax(0,1fr) 30px;align-items:center;gap:8px;padding:3px 0;font-size:11.5px}
.hq-shell-section .hq-pass i{height:7px;border-radius:99px;background:linear-gradient(90deg,#c9b2f6,var(--hq-acc)) 0/var(--w) 100% no-repeat,#efecf4}
.hq-shell-section .hq-pass .is-low i{background:linear-gradient(90deg,#f3d38f,#d9a03a) 0/var(--w) 100% no-repeat,#f6efe0}
.hq-shell-section .hq-pass b{font:500 11.5px 'Space Grotesk',sans-serif;text-align:right}
.hq-shell-section .hq-pass .is-low span,.hq-shell-section .hq-pass .is-low b{color:#8a5a12}
.hq-shell-section .hq-suggest{margin-top:9px!important;padding:8px 10px;border-radius:9px;background:var(--hq-acc-soft);font-size:11.5px;color:#4a3d66}
.hq-shell-section .hq-suggest b{display:block;font-size:10.5px;color:var(--hq-acc-ink)}
.hq-shell-section .hq-todo{display:flex;flex-direction:column;gap:6px}
.hq-shell-section .hq-todo li{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:9px;background:var(--hq-soft);font-size:12px}
.hq-shell-section .hq-todo i{width:8px;height:8px;border-radius:50%;flex:none;background:#e2a093}
.hq-shell-section .hq-todo i.is-info{background:#c2a8ef}
.hq-shell-section .hq-todo i.is-plan{background:none;border:1.5px solid #b899f4}
.hq-shell-section .hq-todo span{flex:1}
.hq-shell-section .hq-todo b{font-size:11px;font-weight:600;color:var(--hq-muted)}

/* Center parts */
.hq-shell-section .hq-card{position:relative;padding:16px 18px;background:#fff;border:1px solid var(--hq-line);border-radius:14px;min-width:0}
.hq-shell-section .hq-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.hq-shell-section .hq-card-head h4{font-size:14px}
.hq-shell-section .hq-pill{display:inline-flex;align-items:center;padding:3px 9px;border-radius:99px;background:#f0f1ec;color:#55655a;font-size:11px;font-weight:600;white-space:nowrap}
.hq-shell-section .hq-pill.is-ok{background:#e0f3e2;color:var(--hq-ok)}
.hq-shell-section .hq-pill.is-warn{background:#fbedd3;color:#8a5a12}
.hq-shell-section .hq-pill.is-lav{background:var(--hq-acc-soft);color:var(--hq-acc-ink)}
.hq-shell-section .hq-avatar{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;font:600 11px 'Space Grotesk',sans-serif}
.hq-shell-section .hq-avatar.t0{background:#e9e0fa;color:var(--hq-acc-ink)}
.hq-shell-section .hq-avatar.t1{background:#d9f1dc;color:var(--hq-ok)}
.hq-shell-section .hq-avatar.t2{background:#f6e6d3;color:#8a5a12}
.hq-shell-section .hq-avatar.t3{background:#dde8f2;color:#2d5677}
.hq-shell-section .hq-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hq-shell-section .hq-stat{padding:13px 16px;background:#fff;border:1px solid var(--hq-line);border-radius:14px;min-width:0}
.hq-shell-section .hq-stat>span{display:block;font-size:11.5px;color:var(--hq-muted)}
.hq-shell-section .hq-stat>b{display:block;margin:2px 0;font:500 28px/1.15 'Space Grotesk',sans-serif;letter-spacing:-.03em}
.hq-shell-section .hq-stat>small{display:block;font-size:11.5px;color:var(--hq-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hq-shell-section .hq-stat>small.is-up{color:#2f7d46}
.hq-shell-section .hq-stat>small.is-lav{color:var(--hq-acc-ink)}
.hq-shell-section .hq-roles li,.hq-shell-section .hq-people li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #f0f1ec}
.hq-shell-section .hq-roles li:last-child,.hq-shell-section .hq-people li:last-child{border-bottom:0}
.hq-shell-section .hq-roles li>span:first-child,.hq-shell-section .hq-people li>span:not(.hq-pill):not(.hq-avatar){flex:1;min-width:0}
.hq-shell-section .hq-roles b,.hq-shell-section .hq-people b{display:block;font-size:13px;font-weight:600}
.hq-shell-section .hq-roles small,.hq-shell-section .hq-people small{display:block;font-size:11.5px;color:var(--hq-muted)}
.hq-shell-section .hq-steps{display:flex;gap:4px;margin-top:6px;max-width:220px}
.hq-shell-section .hq-steps i{flex:1;height:5px;border-radius:99px;background:#ecebe4}
.hq-shell-section .hq-steps i.is-on{background:linear-gradient(90deg,#c9b2f6,var(--hq-acc))}
.hq-shell-section .hq-key{margin-top:8px!important;font-size:10.5px;color:#5a695c}
.hq-shell-section .hq-big{font:500 52px/1 'Space Grotesk',sans-serif;letter-spacing:-.04em}
.hq-shell-section .hq-big span{font:400 14px 'Manrope',sans-serif;letter-spacing:0;color:var(--hq-muted)}
.hq-shell-section .hq-weeks{display:flex;gap:8px;margin-top:16px}
.hq-shell-section .hq-weeks span{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px}
.hq-shell-section .hq-weeks i{display:grid;place-items:center;width:100%;height:38px;border-radius:9px;background:#f1f2ec;color:var(--hq-ok)}
.hq-shell-section .hq-weeks .is-hire i{background:var(--hq-mint)}
.hq-shell-section .hq-weeks .hq-ico-sm{width:16px;height:16px;stroke-width:2.6}
.hq-shell-section .hq-weeks small{font-size:11px;color:var(--hq-muted)}
.hq-shell-section .hq-funnel li{display:grid;grid-template-columns:112px minmax(0,1fr) 38px;align-items:center;gap:12px;padding:5px 0;font-size:12.5px}
.hq-shell-section .hq-funnel i{height:12px;border-radius:4px;background:linear-gradient(90deg,#c9b2f6,var(--hq-acc)) 0/var(--w) 100% no-repeat}
.hq-shell-section .hq-funnel .is-neck i{background:linear-gradient(90deg,#f3d38f,#d9a03a) 0/var(--w) 100% no-repeat}
.hq-shell-section .hq-funnel b{font:500 14px 'Space Grotesk',sans-serif;text-align:right}
.hq-shell-section .hq-reasons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.hq-shell-section .hq-reasons li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 12px;border-radius:10px;background:var(--hq-soft);font-size:12px}
.hq-shell-section .hq-reasons li:first-child{background:#fbf3e3}
.hq-shell-section .hq-reasons b{font:500 15px 'Space Grotesk',sans-serif}
.hq-shell-section .hq-attn{display:flex;flex-direction:column;gap:10px}
.hq-shell-section .hq-attn li{display:flex;gap:14px;padding:16px 18px;border:1px solid var(--hq-line);border-left:3px solid #e2a093;border-radius:14px;background:#fff}
.hq-shell-section .hq-attn li.is-info{border-left-color:#c2a8ef}
.hq-shell-section .hq-attn li.is-ok{border-left-color:#7fcf8b;background:#fbfdfb}
.hq-shell-section .hq-attn li>i{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:#fbe1dc;color:#ad3f2b;font:700 13px 'Space Grotesk',sans-serif;font-style:normal}
.hq-shell-section .hq-attn li.is-info>i{background:var(--hq-acc-soft);color:var(--hq-acc-ink)}
.hq-shell-section .hq-attn li.is-ok>i{background:#e0f3e2;color:var(--hq-ok)}
.hq-shell-section .hq-attn b{display:block;font-size:14px;font-weight:600}
.hq-shell-section .hq-attn small{display:block;font-size:11.5px;color:var(--hq-muted)}
.hq-shell-section .hq-attn p{margin-top:6px!important;font-size:12.5px;color:#475a4d}
.hq-shell-section .hq-soon{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.hq-shell-section .hq-soon-card{border-style:dashed;border-color:#d4c7ec}
.hq-shell-section .hq-soon-card .hq-card-head{margin-bottom:8px}
.hq-shell-section .hq-soon-ico{display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--hq-acc-soft);color:var(--hq-acc)}
.hq-shell-section .hq-soon-card h4{font-size:14px}
.hq-shell-section .hq-soon-card>p{margin-top:3px!important;font-size:12.5px;color:#4d5f53}
.hq-shell-section .hq-bool{margin-top:10px!important;padding:8px 11px;border-radius:9px;background:var(--hq-dark);color:#e6f1e7;font:400 11.5px/1.6 'Space Grotesk',sans-serif}
.hq-shell-section .hq-bool span{color:#e6f1e7}
.hq-shell-section .hq-bool b{color:#b899f4;font-weight:500}
.hq-shell-section .hq-dots{display:grid;grid-template-columns:repeat(18,1fr);gap:5px;margin-top:10px}
.hq-shell-section .hq-dots i{aspect-ratio:1;border-radius:50%;background:#ecebe4}
.hq-shell-section .hq-dots i.is-on{background:#b899f4}
.hq-shell-section .hq-draftlines{display:flex;align-items:center;gap:6px;margin-top:10px}
.hq-shell-section .hq-draftlines i{height:6px;border-radius:99px;background:#ecebe4;flex:3}
.hq-shell-section .hq-draftlines i:nth-child(2){flex:2}.hq-shell-section .hq-draftlines i:nth-child(3){flex:1}

.hq-shell-section .hq-up{font-size:11.5px;font-weight:600;color:#2f7d46}
.hq-shell-section .hq-cols{display:flex;align-items:flex-end;gap:10px;height:96px}
.hq-shell-section .hq-cols span{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}
.hq-shell-section .hq-cols i{width:100%;height:var(--h);border-radius:6px 6px 2px 2px;background:#e9e0fa}
.hq-shell-section .hq-cols i.is-now{background:linear-gradient(#c9b2f6,var(--hq-acc))}
.hq-shell-section .hq-cols small{font-size:10px;color:#5a695c;white-space:nowrap}
.hq-shell-section .hq-mix{display:flex;gap:3px;height:14px}
.hq-shell-section .hq-mix i{border-radius:4px}
.hq-shell-section .is-a{background:var(--hq-acc)}.hq-shell-section .is-b{background:#b899f4}.hq-shell-section .is-c{background:#7fcf8b}.hq-shell-section .is-d{background:#d6dccf}
.hq-shell-section .hq-mix-key{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 16px;margin-top:12px!important}
.hq-shell-section .hq-mix-key li{display:flex;align-items:center;gap:7px;font-size:12px}
.hq-shell-section .hq-mix-key i{width:9px;height:9px;border-radius:3px;flex:none}
.hq-shell-section .hq-mix-key b{margin-left:auto;font:500 12px 'Space Grotesk',sans-serif}

/* Shorter desktop windows */
@media(min-width:761px) and (max-height:940px){
  .hq-shell-section .hq-extra{display:none}
}
@media(min-width:761px) and (max-height:820px){
  .hq-shell-section .hq-center{padding:16px 22px;gap:10px}
  .hq-shell-section .hq-card{padding:13px 16px}
  .hq-shell-section .hq-card-head{margin-bottom:8px}
  .hq-shell-section .hq-stat{padding:10px 14px}
  .hq-shell-section .hq-stat>b{font-size:24px}
  .hq-shell-section .hq-roles li,.hq-shell-section .hq-people li{padding:7px 0}
  .hq-shell-section .hq-big{font-size:44px}
  .hq-shell-section .hq-attn li{padding:12px 16px}
  .hq-shell-section .hq-soon{gap:9px}
  .hq-shell-section .hq-soon-card .hq-card-head{margin-bottom:4px}
  .hq-shell-section .hq-explain{padding:13px 16px}
  .hq-shell-section .hq-chat-body{padding:14px;gap:10px}
  .hq-shell-section .hq-window .hq-nav{padding:8px 11px}
}
/* Narrower windows */
@media(max-width:1199px){
  .hq-shell-section .hq-window{grid-template-columns:212px minmax(0,1fr) 300px}
  .hq-shell-section .hq-logo{padding:0 16px}
  .hq-shell-section .hq-logo img{width:92px}
  .hq-shell-section .hq-top{padding:0 18px}
  .hq-shell-section .hq-demo{display:none}
  .hq-shell-section .hq-center{padding:16px 18px}
  .hq-shell-section .hq-explain{grid-template-columns:minmax(0,1fr);gap:8px;padding:12px 14px}
  .hq-shell-section .hq-explain ul li:not(.hq-weekly){display:none}
  .hq-shell-section .hq-stats{gap:8px}
  .hq-shell-section .hq-stat{padding:10px 12px}
  .hq-shell-section .hq-stat>b{font-size:22px}
  .hq-shell-section .hq-reasons{grid-template-columns:minmax(0,1fr)}
  .hq-shell-section .hq-reasons li{padding:6px 10px}
  .hq-shell-section .hq-big{font-size:40px}
  .hq-shell-section .hq-matches li{padding:5px 8px}
  .hq-shell-section .hq-chat-body{gap:9px;padding:12px 14px}
  .hq-shell-section .hq-mavhead{padding:0 14px}
}
/* Phones: one column; the page scrolls instead of the panel */
@media(max-width:760px){
  .hq-shell-section{height:auto;min-height:0;margin:10px}
  .hq-shell-section .hq-window{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;border-radius:18px}
  .hq-shell-section .hq-logo{grid-row:1;height:52px;border-right:0}
  .hq-shell-section .hq-mavhead{display:none}
  .hq-shell-section .hq-side{grid-row:2;padding:8px;border-right:0;border-bottom:1px solid var(--hq-line);min-width:0}
  .hq-shell-section .hq-side-label,.hq-shell-section .hq-shared,.hq-shell-section .hq-tablist .hq-rule{display:none}
  .hq-shell-section .hq-tablist{flex-direction:row;gap:4px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
  .hq-shell-section .hq-tablist::-webkit-scrollbar{display:none}
  .hq-shell-section .hq-window .hq-nav{flex:none;width:auto;max-width:210px;padding:8px 11px;font-size:12.5px}
  .hq-shell-section .hq-view{grid-column:1;grid-row:3;display:flex;flex-direction:column}
  .hq-shell-section .hq-top{padding:14px 16px 12px;flex-wrap:wrap}
  .hq-shell-section .hq-top h3{white-space:normal}
  .hq-shell-section .hq-demo{display:block;width:100%;order:3}
  .hq-shell-section .hq-center{overflow:visible;padding:14px 16px}
  .hq-shell-section .hq-explain ul li:not(.hq-weekly){display:flex}
  .hq-shell-section .hq-chat{border-left:0;border-top:1px solid var(--hq-line)}
  .hq-shell-section .hq-chat-head{display:flex;height:56px;border-bottom:1px solid var(--hq-line)}
  .hq-shell-section .hq-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .hq-shell-section .hq-stat{padding:9px 10px}
  .hq-shell-section .hq-stat>b{font-size:20px}
  .hq-shell-section .hq-stat>small{display:none}
}
@media(prefers-reduced-motion:reduce){
  .hq-shell-section .hq-view.is-active>*,.hq-shell-section .hq-view.is-active>.hq-top>div{animation:none}
  .hq-shell-section .hq-nav{transition:none}
}
/* Mavericks logo mark in the brand green, as in the site header and footer (Christian, Oct 20 evening). */
.hq-shell-section .hq-logo .hq-mark{background:#41794d!important}
/* Phone shell (Christian, Oct 20 mobile pass): Mav's answer sits right under the question chips so a tap shows its
   result on screen, the board follows, and only the active question's view takes up height. */
@media(max-width:760px){.hq-shell-section .hq-view{flex-direction:column}.hq-shell-section .hq-view>.hq-top{order:1}.hq-shell-section .hq-view>.hq-chat{order:2;border-bottom:1px solid var(--hq-line,#e3e8e0)}.hq-shell-section .hq-view>.hq-center{order:3}.hq-shell-section .hq-view:not(.is-active){display:none}}
/* Mav's insight button: phones only. Mav's face with a speech bubble that breathes and shows typing dots. */
.hq-shell-section .hq-ask{display:none}
@media(max-width:760px){
.hq-shell-section .hq-top .hq-range{display:none}
.hq-shell-section .hq-ask{display:flex;align-items:center;gap:8px;flex:none;align-self:center;padding:0;border:0;background:none;cursor:pointer;font:inherit;color:inherit}
.hq-shell-section .hq-ask img{width:36px;height:36px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #fff,0 0 0 3.5px #8463bd;animation:hq-ask-ring 2.4s ease-in-out infinite}
.hq-shell-section .hq-ask-bubble{position:relative;display:flex;align-items:center;gap:6px;padding:7px 11px;border-radius:14px 14px 14px 4px;background:#efeaf9;color:#4b3a78;font-size:12px;font-weight:600;white-space:nowrap;animation:hq-ask-bob 2.4s ease-in-out infinite}
.hq-shell-section .hq-ask-bubble i{width:18px;height:6px;background:radial-gradient(circle,#8463bd 2.2px,transparent 2.6px) 0 50%/6px 6px repeat-x;animation:hq-ask-dots 1.2s steps(3) infinite}
.hq-shell-section .hq-ask[aria-expanded=true] .hq-ask-bubble i{display:none}
.hq-shell-section .hq-ask:focus-visible{outline:3px solid #8463bd;outline-offset:3px;border-radius:20px}
.hq-shell-section .hq-chat>.hq-chat-head{display:none!important}
.hq-shell-section .hq-chat:not(.is-open){display:none!important}
.hq-shell-section .hq-top>div:first-child{flex:1;min-width:0}
.hq-shell-section .hq-top .hq-crumbs,.hq-shell-section .hq-top h3{white-space:nowrap}
.hq-shell-section .hq-ask img{width:32px;height:32px}
}
@keyframes hq-ask-ring{0%,100%{box-shadow:0 0 0 2px #fff,0 0 0 3.5px #8463bd}50%{box-shadow:0 0 0 2px #fff,0 0 0 7px #8463bd40}}
@keyframes hq-ask-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes hq-ask-dots{from{width:6px}to{width:18px}}
@media(prefers-reduced-motion:reduce){.hq-shell-section .hq-ask img,.hq-shell-section .hq-ask-bubble,.hq-shell-section .hq-ask-bubble i{animation:none}}
/* Mav's insight button, second pass (Christian, Oct 21): Mav's face holds still at the full height of the header
   row, and the speech bubble floats a layer above it with a shadow. The demo-data line is dropped on phones. */
@media(max-width:760px){
.hq-shell-section .hq-top{position:relative;align-items:stretch}
.hq-shell-section .hq-top .hq-demo{display:none}
.hq-shell-section .hq-ask{position:relative;align-self:stretch;padding:0;gap:0}
.hq-shell-section .hq-ask img{height:100%;width:auto;aspect-ratio:1;max-height:64px;min-height:44px;animation:none;box-shadow:0 0 0 2px #fff,0 0 0 3.5px #8463bd}
.hq-shell-section .hq-ask-bubble{position:absolute;z-index:3;right:calc(100% - 14px);top:-6px;box-shadow:0 8px 22px #2b1f4d2e,0 0 0 1px #8463bd22;background:#fff}
}
/* Insight bubble, third pass (Christian, Oct 21): a filled bubble whose tail points down-right at Mav, three dots
   that bounce in turn, and a soft halo that pulses so it reads as something to tap. */
@media(max-width:760px){
.hq-shell-section .hq-ask-bubble{background:#8463bd;color:#fff;border-radius:16px 16px 4px 16px;padding:8px 13px;font-size:12.5px;box-shadow:0 8px 22px #2b1f4d40;animation:hq-ask-bob 2.4s ease-in-out infinite,hq-ask-halo 2.4s ease-out infinite}
.hq-shell-section .hq-ask-bubble i{display:inline-flex;gap:3px;width:auto;height:auto;background:none;animation:none}
.hq-shell-section .hq-ask-bubble i span{width:5px;height:5px;border-radius:50%;background:#fff;opacity:.55;animation:hq-ask-dot 1.2s ease-in-out infinite}
.hq-shell-section .hq-ask-bubble i span:nth-child(2){animation-delay:.15s}
.hq-shell-section .hq-ask-bubble i span:nth-child(3){animation-delay:.3s}
.hq-shell-section .hq-ask[aria-expanded=true] .hq-ask-bubble{background:#efeaf9;color:#4b3a78;animation:none}
}
@keyframes hq-ask-dot{0%,60%,100%{transform:translateY(0);opacity:.55}30%{transform:translateY(-3px);opacity:1}}
@keyframes hq-ask-halo{0%{box-shadow:0 8px 22px #2b1f4d40,0 0 0 0 #8463bd66}70%,100%{box-shadow:0 8px 22px #2b1f4d40,0 0 0 9px #8463bd00}}
@media(prefers-reduced-motion:reduce){.hq-shell-section .hq-ask-bubble,.hq-shell-section .hq-ask-bubble i span{animation:none!important}}