/* Ask Zena, the page (ask-page.js, 2026-11-10; mock-up accounts/final/chat-1440.png, chat-390.png). Tokens only
   (zena-tokens.css): one ink (--z-title) on one ground, hairlines, radii var(--rad) or 0, a 12px floor, and the
   one hover grammar (--z-lift, --z-lift-shadow, --z-lift-edge, --z-lift-ease) on everything that opens something.
   Purple (--z-estimate) is Zena's estimate only: the line on a price chart, the mark in a book bracket and on a number
   line, and the words that name it. */

/* The page takes the board's place under the mode switch; the board, its topic row and the corner button step aside. */
html[data-zap-open] #pnlBoard>#bfBoard{display:none!important}
html[data-zap-open] :is(#zenaVisualLauncher,.za-bar){display:none!important}
html[data-zap-open] .zc-category-bar>.zc-topics{display:none!important}
/* On a phone the News page lifts the top rows out of the flow and scrolls them away with its own board
   (news-keycard.css, data-zw-away); with the board hidden behind this page they stand in the flow again. */
html[data-zap-open][data-zw-away]>body>.nav,html[data-zap-open][data-zw-away] #main>.zc-home-tabs,html[data-zap-open][data-zw-away] #pnlBoard>.zc-board-header{position:relative!important;top:auto!important;animation:none!important;transform:none!important}
.zc-category-bar>.zc-mode-switch>.zc-mode-ask{white-space:nowrap}
@media(max-width:430px){:root .zc-category-bar>.zc-mode-switch>.zc-mode-ask{font-size:0!important}:root .zc-category-bar>.zc-mode-switch>.zc-mode-ask::before{content:"Ask";content:"Ask"/"";font-size:12px}}

.zap{flex:1 1 0;min-height:0;display:grid;grid-template-columns:288px minmax(0,1fr);grid-template-rows:minmax(0,1fr);background:var(--z-surface);color:var(--z-title);font:var(--zt-body);border-top:1px solid var(--z-hairline)}
.zap *{box-sizing:border-box}
.zap button{font:inherit;color:inherit;cursor:pointer}
.zap :is(button,a,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--z-title);outline-offset:2px}
.zap-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
/* the hover grammar, one rule for every control that opens or asks something */
.zap :is(.zap-new,.zap-chat,.zap-connect,.zap-chip-row,.zap-sug,.zap-ctx-x,.zap-send,.zap-mic,.zap-desk,.zap-gap,a.zap-trade,.zap-chip:is(a),.zap-story-title:is(a),.zap-chats-btn),
.zap .zap-card-host :is(.zv-answer-followups button,.zv-strategy-others button,.zv-open-contract,.zv-answer-source-button,.zv-strategy-choice-primary,.zv-strategy-choice-link){transition:var(--z-lift-ease);border:1px solid var(--z-hairline-strong);border-radius:var(--rad)}
.zap :is(.zap-new,.zap-chat,.zap-connect,.zap-chip-row,.zap-sug,.zap-ctx-x,.zap-send,.zap-mic,.zap-desk,.zap-gap,a.zap-trade,.zap-chip:is(a),.zap-story-title:is(a),.zap-chats-btn):is(:hover,:focus-visible,:focus-within),
.zap .zap-card-host :is(.zv-answer-followups button,.zv-strategy-others button,.zv-open-contract,.zv-answer-source-button,.zv-strategy-choice-primary,.zv-strategy-choice-link):is(:hover,:focus-visible){transform:var(--z-lift);box-shadow:var(--z-lift-shadow);border-color:var(--z-lift-edge);text-decoration:none}

/* the rail: New chat, this session's chats, Your accounts */
.zap-rail{display:flex;flex-direction:column;gap:8px;min-height:0;overflow:auto;padding:24px 20px 20px;border-right:1px solid var(--z-hairline);background:var(--z-surface)}
.zap-new{display:flex;align-items:center;gap:8px;width:100%;min-height:48px;padding:0 16px;background:none;font:var(--zt-card);color:var(--z-title)}
.zap-new>span{font-size:20px;line-height:1}
.zap-rail-h{margin:20px 0 4px;font:var(--zt-card);color:var(--z-title)}
.zap-chats{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.zap .zap-chat{display:grid;gap:2px;width:100%;padding:10px 12px;text-align:left;background:none;border-color:transparent}
.zap .zap-chat[aria-current=true]{border-color:var(--z-hairline-strong)}
.zap-chat b{font:500 15px/21px var(--sans);color:var(--z-title);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zap-chat .z-meta{margin:0}
.zap-accounts{margin-top:auto;padding-top:16px;border-top:1px solid var(--z-hairline);display:grid;gap:8px}
.zap-accounts .zap-rail-h{margin:0}
.zap-connect{display:block;width:100%;min-height:44px;padding:0 16px;background:none;font:var(--zt-card);color:var(--z-title);text-align:center}

/* the main column: the hero and start cards before a question, the thread after; one composer moves between them */
.zap-main{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0}
.zap-scroll{flex:1 1 0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.zap-col{max-width:808px;margin:0 auto;padding:72px 24px 40px}
.zap[data-state=thread] .zap-col{padding-top:32px}
.zap[data-state=thread] .zap-hero,.zap[data-state=empty] .zap-thread{display:none}
.zap[data-state=empty] .zap-dock{display:none}
.zap-h1{margin:0;font:var(--zt-page);font-size:clamp(28px,2.6vw,36px);line-height:1.15;color:var(--z-title);letter-spacing:0}
.zap-slot{margin-bottom:28px}
.zap .zap-chip-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;padding:9px 14px;background:none;text-align:left;font:var(--zt-small);font-size:14px;line-height:20px;color:var(--z-title)}
.zap-chip-row>span:last-child{color:var(--z-title);font-size:16px}

/* the composer: the context card and its three questions above the box; desk, voice and send in its row */
.zap-compose{display:grid;gap:10px}
.zap-ctx-host:empty,.zap-suggest:empty{display:none}
.zap-form{display:grid;gap:8px;padding:14px 14px 12px 18px;border:1px solid var(--z-hairline-strong);border-radius:var(--rad);background:var(--z-surface);transition:var(--z-lift-ease)}
.zap-form:focus-within{border-color:var(--z-lift-edge)}
.zap-form textarea{display:block;width:100%;min-height:28px;max-height:160px;resize:none;border:0;outline:none;background:none;padding:2px 0;font:400 17px/26px var(--sans);color:var(--z-title)}
.zap-form textarea::placeholder{color:var(--z-title);opacity:1}
.zap .zap-form textarea:focus-visible{outline:none}
.zap .zap-mic,.zap .zap-send{display:grid;place-items:center;width:40px;height:40px;padding:0;background:none}
.zap .zap-send{background:var(--z-title);border-color:var(--z-title);color:var(--z-surface)}
.zap .zap-send:is(:hover,:focus-visible){border-color:var(--z-title)}
.zap-mic svg,.zap-send svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.zap-mic[aria-pressed=true]{border-color:var(--z-title)}
.zap-mic[hidden]{display:none}
.zap-ctx{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:14px;padding:12px 12px 12px 16px;border:1px solid var(--z-hairline-strong);border-radius:var(--rad)}
.zap-ctx-kind{align-self:start;padding-top:2px;font:var(--zt-small);font-weight:600;color:var(--z-title)}
.zap-ctx-body{display:grid;gap:2px;min-width:0}
.zap-ctx-body strong{font:var(--zt-card);color:var(--z-title);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zap-ctx-body a{color:inherit;text-decoration:none}.zap-ctx-body a:hover{text-decoration:underline;text-underline-offset:3px}
.zap-ctx-body .z-meta{margin:0}
.zap-ctx-contract{display:flex;align-items:baseline;gap:6px;min-width:0;margin-top:4px;font:var(--zt-small);color:var(--z-title)}
.zap-ctx-contract>span:first-child{flex:none;color:var(--z-title)}
.zap-ctx-contract-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zap-ctx-contract b{flex:none;font-weight:600;font-variant-numeric:tabular-nums}
.zap-ctx-viz{width:168px}
.zap-ctx-viz:empty{display:none}
.zap-ctx-price{font:var(--zt-figure);font-size:22px;font-variant-numeric:tabular-nums;color:var(--z-title)}
.zap .zap-ctx-x{display:grid;place-items:center;width:36px;height:36px;padding:0;background:none;font-size:20px;line-height:1;color:var(--z-title)}
.zap-suggest{display:flex;flex-wrap:wrap;gap:8px}
.zap .zap-sug{min-height:36px;padding:7px 12px;background:none;font:var(--zt-small);color:var(--z-title);text-align:left}
.zap-dock{flex:none;padding:12px 24px calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--z-hairline);background:var(--z-surface)}
.zap-dock>.zap-compose{max-width:760px;margin:0 auto}
.zap-dock .zap-form textarea{font-size:16px;line-height:24px}
/* in the thread the context is one line over the composer, and the card's own follow-ups take the starters' place */
.zap[data-state=thread] .zap-suggest,.zap[data-state=thread] .zap-ctx-viz,.zap[data-state=thread] .zap-ctx-kind,.zap[data-state=thread] .zap-ctx-contract{display:none}
.zap[data-state=thread] .zap-ctx{grid-template-columns:minmax(0,1fr) auto auto;gap:12px;padding:6px 6px 6px 14px}
.zap[data-state=thread] .zap-ctx-body{grid-template-columns:auto minmax(0,1fr);align-items:baseline;column-gap:10px}
.zap[data-state=thread] .zap-ctx-body strong{-webkit-line-clamp:1;font-size:15px}
.zap[data-state=thread] .zap-ctx-body .z-meta{grid-column:1;grid-row:1}
.zap[data-state=thread] .zap-ctx-body .z-meta>:not(:first-child){display:none}
.zap[data-state=thread] .zap-ctx-price{font-size:17px;line-height:22px}
.zap[data-state=thread] .zap-ctx-x{width:32px;height:32px}

/* the thread: the question at the right, the answer in a hairline frame */
.zap-thread{display:grid;gap:28px}
.zap-turn{display:grid;gap:12px}
.zap-q{justify-self:end;display:grid;gap:4px;max-width:min(80%,560px);padding:10px 14px;border:1px solid var(--z-hairline-strong);border-radius:var(--rad)}
.zap-q p{margin:0;font:var(--zt-body);color:var(--z-title);overflow-wrap:anywhere}
.zap-a{min-width:0;padding:20px 22px;border:1px solid var(--z-hairline);border-radius:var(--rad)}
.zap-a:empty{display:none}
.zap-view p{margin:0 0 12px;color:var(--z-title)}
.zap-view .zap-chip-row{width:auto;display:inline-flex}
.zap-viz{display:grid;gap:18px;margin-bottom:18px}
.zap-viz:empty,.zap-contract-host:empty{display:none}
.zap-viz:empty+.zap-card-host{margin-top:0}

/* the panel's cards drawn in the page: the panel's own stylesheet, framed as the page's, without what the thread says
   already (the question echo and the Back button) and with the page's number line in place of the small rail */
.zap .zap-scope.zv-guide,.zap .zap-scope.zv-guide:not([open]),.zap #zenaVisualGuide.zv-docked{position:static;inset:auto;display:block;width:auto;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;z-index:auto;font:var(--zt-body);color:var(--z-title)}
.zap #zenaVisualGuide.zv-docked[data-zap-live="0"]{display:none!important}
.zap #zenaVisualGuide.zv-docked :is(.zv-header,.zv-prompt,.zv-story-context,.zv-context-tabs,.zv-scene-tools){display:none!important}
.zap #zenaVisualGuide.zv-docked .zv-workspace{overflow:visible;padding:0}
.zap :is(.zap-scope,#zenaVisualGuide.zv-docked) :is(.zv-answer-back,.zv-asked){display:none!important}
.zap .zap-card-host .zv-strategy-rail{display:none}
.zap .zap-a:has(.zap-contract:not(.zap-contract-compact)) .zap-card-host .zv-strategy-contract{display:none}
.zap .zap-frozen{opacity:.9}
.zap .zap-frozen button{pointer-events:none}

/* visualizations. The contract strip: venue, title and price; the price line with the estimate; the book bracket */
.zap-contract{display:grid;gap:10px;min-width:0}
.zap-contract>header{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:16px;align-items:end}
.zap-venue{grid-column:1;font:var(--zt-small);color:var(--z-title)}
.zap-contract h4{grid-column:1;margin:0;font:var(--zt-card);color:var(--z-title);overflow-wrap:anywhere}
.zap-price{grid-column:2;grid-row:1/3;font:var(--zt-figure);font-variant-numeric:tabular-nums;color:var(--z-title)}
.zap-spark-wrap{display:grid;gap:0}
.zap-spark-box{position:relative}
.zap-spark{display:block;width:100%;overflow:visible}
.zap-spark-dot{position:absolute;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;background:var(--z-title);box-shadow:0 0 0 2px var(--z-surface)}
.zap-spark path{fill:none;stroke:var(--z-title);stroke-width:1.75;stroke-linejoin:round;stroke-linecap:round}
.zap-est line{stroke:var(--z-estimate);stroke-width:1.75;stroke-dasharray:5 4}
.zap-est:focus{outline:none}.zap-est:focus line{stroke-width:3}
.zap-est-text,.zap-est-text b{color:var(--z-estimate)!important}
.zap-spark-meta{margin:6px 0 0}
.zap-bracket{margin:0;display:grid;gap:8px}
.zap-bracket-track{position:relative;height:18px}
.zap-bracket-track::before{content:'';position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--z-hairline-strong)}
.zap-bracket-book{position:absolute;top:4px;height:10px;min-width:3px;background:var(--z-title);border-radius:var(--rad)}
.zap-bracket-fair{position:absolute;top:0;width:3px;height:18px;margin-left:-1px;background:var(--z-estimate);border-radius:0}
.zap-bracket-legend{display:flex;flex-wrap:wrap;gap:4px 16px;font:var(--zt-small);color:var(--z-title)}
.zap-bracket-legend b{font-weight:600;color:var(--z-title);font-variant-numeric:tabular-nums}
.zap-contract-compact{gap:6px}
.zap-contract-compact .zap-spark-meta,.zap-contract-compact .zap-bracket-legend{display:none}
.zap-contract-compact .zap-bracket-track{height:12px}.zap-contract-compact .zap-bracket-book{top:3px;height:6px}.zap-contract-compact .zap-bracket-fair{height:12px}

/* a strategy's number line on the Yes price, and its key */
.zap-line{margin:16px 0 20px;display:grid;gap:12px}
.zap-line svg{display:block;width:100%;overflow:visible}
.zap-line .zap-axis{stroke:var(--z-hairline-strong);stroke-width:1}
.zap-band rect{fill:var(--z-title);fill-opacity:.08;stroke:var(--z-hairline-strong);stroke-dasharray:3 3}
.zap-book rect{fill:var(--z-title)}
.zap-cross rect{fill:var(--z-title)}
.zap-trigger line{stroke:var(--z-title);stroke-width:2.5;stroke-linecap:round}
.zap-entry circle{fill:var(--z-surface);stroke:var(--z-title);stroke-width:2.5}
.zap-line .zap-est line{stroke:var(--z-estimate);stroke-width:3;stroke-dasharray:none;stroke-linecap:round}
.zap-line .zap-est text{fill:var(--z-estimate);font:600 12px/16px var(--sans)}
.zap-line .zap-tick{fill:var(--z-title);font:400 12px/16px var(--sans);font-variant-numeric:tabular-nums}
.zap-line g:focus{outline:none}.zap-line g:focus :is(line,rect,circle){stroke:var(--z-title);stroke-width:3}
.zap-legend{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 20px;font:var(--zt-small);color:var(--z-title)}
.zap-legend li{display:flex;align-items:center;gap:8px;min-width:0}
.zap-legend b{color:var(--z-title);font-weight:600;font-variant-numeric:tabular-nums}
.zap-legend i,.zap-gaps-key i{flex:none;display:inline-block;width:14px;height:10px}
.zap-k-trigger{width:3px!important;height:14px!important;margin:0 5px;background:var(--z-title)}
.zap-k-book{background:var(--z-title);border-radius:var(--rad)}
.zap-k-est{width:3px!important;height:14px!important;margin:0 5px;background:var(--z-estimate)}
.zap-k-band{background:color-mix(in srgb,var(--z-title) 8%,transparent);border:1px dashed var(--z-hairline-strong)}
.zap-k-cross{height:5px!important;background:var(--z-title);border-radius:var(--rad)}
.zap-k-entry{width:12px!important;height:12px!important;border:2.5px solid var(--z-title);border-radius:50%}

/* a gap request: each candidate's gap against its half-spread, ranked; a row plans that contract */
.zap-gaps{display:grid;gap:10px}
.zap-gaps>header{display:grid;gap:2px}
.zap-gaps h4{margin:0;font:var(--zt-card);color:var(--z-title)}
.zap-gaps .z-caption{margin:0}
/* a caption part that is a phrase, not a figure, may wrap inside itself on a narrow column */
.zap :is(.zap-gaps>header .z-caption,.zap-foot)>*{white-space:normal}
.zap-gaps ol{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.zap .zap-gap{display:grid;grid-template-columns:20px minmax(0,1fr) minmax(96px,180px) 92px;align-items:center;gap:12px;width:100%;padding:10px 12px;background:none;text-align:left;border-color:var(--z-hairline)}
.zap .zap-gap[aria-current=true]{border-color:var(--z-hairline-strong);box-shadow:inset 3px 0 0 var(--z-title)}
.zap-gap-rank{font:var(--zt-small);color:var(--z-title);font-variant-numeric:tabular-nums}
.zap-gap-title{display:grid;gap:2px;min-width:0}
.zap-gap-title b{font:500 14px/20px var(--sans);color:var(--z-title);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zap-gap-title .z-meta{margin:0}
.zap-gap-bars{position:relative;height:20px}
/* one ruler a row: the book's middle as a hairline, the book as a band, the compared price as a mark */
.zap-gap-mid{position:absolute;left:50%;top:0;bottom:0;border-left:1px dashed var(--z-hairline-strong)}
.zap-gap-bars::before{content:'';position:absolute;left:0;right:0;top:50%;border-top:1px solid var(--z-hairline)}
.zap-gap-book{position:absolute;top:6px;height:8px;min-width:3px;background:var(--z-title);border-radius:var(--rad)}
.zap-gap-at{position:absolute;top:0;width:3px;height:20px;margin-left:-1px;background:var(--z-title);border-radius:0}
.zap-gap-at.zap-gap-est{background:var(--z-estimate)}
.zap-gap-at.zap-clears{width:4px;margin-left:-2px}
.zap-gap-value{font:var(--zt-small);color:var(--z-title);text-align:right;white-space:nowrap}
.zap-gap-value b{font:600 15px/20px var(--sans);color:var(--z-title);font-variant-numeric:tabular-nums}
.zap-gaps-key{margin:0;gap:4px 16px}
.zap-gaps-key>span{display:inline-flex;align-items:center;gap:6px}
.zap-gaps-key>span::after{display:none}

/* a story answer: the story, its sources and the contract, as chips above the answer */
.zap-storyhead{display:grid;gap:8px}
.zap-kicker{font:var(--zt-small);font-weight:600;color:var(--z-title)}
.zap-story-title{margin:0;font:var(--zt-card);font-size:17px;line-height:24px;color:var(--z-title);text-decoration:none}
.zap .zap-story-title:is(a){border:0;border-radius:0;justify-self:start}
.zap .zap-story-title:is(a):is(:hover,:focus-visible){box-shadow:none;text-decoration:underline;text-underline-offset:4px}
.zap-chips{display:flex;flex-wrap:wrap;gap:8px}
.zap-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:5px 10px;border:1px solid var(--z-hairline-strong);border-radius:var(--rad);font:var(--zt-small);color:var(--z-title);text-decoration:none}
.zap-chip-static{color:var(--z-title)}
.zap-chip-contract>span{color:var(--z-title)}
.zap-chip-contract b{font-variant-numeric:tabular-nums}

/* Your accounts, on this device */
.zap-acct h3{margin:0 0 8px;font:var(--zt-section);font-size:18px;color:var(--z-title)}
.zap-acct p{margin:0 0 12px;color:var(--z-title)}
.zap-acct-list,.zap-acct-sample{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.zap-acct-list li,.zap-acct-sample li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:10px 0;border-top:1px solid var(--z-hairline)}
.zap-acct-list li>span,.zap-acct-sample li>span:not(.zap-tag){grid-column:1;font:var(--zt-small);color:var(--z-title)}
.zap-acct-list a{grid-column:2;grid-row:1/3;align-self:center;font:var(--zt-small);color:var(--z-title);text-decoration:none}
.zap-acct-list a:hover{text-decoration:underline;text-underline-offset:3px}
.zap-tag{grid-column:2;grid-row:1;justify-self:end;font:var(--zt-small);font-weight:600;color:var(--z-title)}
.zap-acct .zap-connect{width:auto;display:inline-block}
.zap-acct-foot{font:var(--zt-small)!important;margin:12px 0 0!important}
/* an account answer drawn by ask-accounts.js (ZenaAskAccounts.answerCard) carries its own frame: the turn adds none */
.zap-a:has(>.zap-acct-answer){padding:0;border:0}
.zap-acct .zac{margin:4px 0 0}

/* tablets and phones: the rail becomes the Chats sheet, the composer sits at the foot over the safe area */
@media(max-width:899px){
  .zap{grid-template-columns:minmax(0,1fr)}
  .zap-rail{position:fixed;inset:var(--zap-sheet-top,0px) auto 0 0;z-index:240;width:min(86vw,340px);padding-top:20px;transform:translateX(-102%);transition:transform .2s ease;box-shadow:none;border-top:1px solid var(--z-hairline)}
  .zap[data-sheet] .zap-rail{transform:none;box-shadow:0 0 40px rgba(0,0,0,.6)}
  .zap-scrim{position:fixed;inset:var(--zap-sheet-top,0px) 0 0 0;z-index:239;background:rgba(0,0,0,.55)}
  .zap-scrim[hidden]{display:none}
  .zap-col{padding:28px 16px 32px}
  .zap[data-state=thread] .zap-col{padding-top:20px}
  .zap-dock{padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px))}
  .zap-legend{grid-template-columns:minmax(0,1fr)}
  .zap-a{padding:16px}
}
@media(max-width:600px){
  .zap-ctx{grid-template-columns:minmax(0,1fr) auto auto;gap:10px;padding:10px 8px 10px 12px}
  .zap-ctx-kind{display:none}
  .zap-ctx-viz{grid-column:1/-1;grid-row:2;width:auto}
  .zap-ctx-price{font-size:18px}
  .zap .zap-gap{grid-template-columns:20px minmax(0,1fr) auto;grid-template-areas:"r t v" ". b b"}
  /* the gap caption's phrases and each row's meta stack on a phone, so no separator is left hanging at a line end */
  .zap :is(.zap-gaps>header .z-caption,.zap-gap-title .z-meta){display:grid}
  .zap :is(.zap-gaps>header .z-caption,.zap-gap-title .z-meta)>::after{content:none}
  .zap-gap-rank{grid-area:r}.zap-gap-title{grid-area:t}.zap-gap-value{grid-area:v}.zap-gap-bars{grid-area:b}
  .zap-q{max-width:92%}
  .zap-a{padding:14px}
  .zap-dock .zap-form{grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px;padding:6px 6px 6px 14px}
}
@media(prefers-reduced-motion:reduce){.zap-rail{transition:none}}

/* ASK ZENA v2 (2026-11-10. Palash approved "Ask as a two-column guide that keeps the story beside the chat", and asked:
   "get rid of all this gray text, make it super clean"). Two columns, never three: the left column is the context (the
   story or market the page was opened from, as a real card; with neither, where the reader left off), this session's
   chats and the one accounts row; the right column is the conversation. One ink: nothing on this page is set in
   --z-body; what repeated something on screen is gone, what carries information found nowhere else (venue, clock,
   window, bid and ask labels, publisher) stays in title ink at the small step. Hierarchy is weight, size and position. */
.zap{grid-template-columns:376px minmax(0,1fr)}
.zap[data-solo]{grid-template-columns:minmax(0,1fr)}
.zap[data-solo] .zap-rail{display:none}
.zap :is(.z-chg,.z-meta,.z-caption,.z-label,.z-source){color:var(--z-title)}
.zap :is(.z-meta,.z-caption,.z-chg)>:not(:last-child)::after{color:var(--z-title)}
.zap-rail{gap:24px;padding:24px}
.zap-side{display:grid;gap:24px;min-width:0}
.zap-side:empty,.zap-session[hidden]{display:none}
.zap-rail-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;font:600 13px/18px var(--sans);color:var(--z-title)}
.zap .zap-new{display:grid;place-items:center;width:28px;height:28px;min-height:0;padding:0;border-radius:6px}
.zap .zap-new>span{font-size:18px;line-height:1}
.zap-cc{position:relative;display:grid;gap:10px;min-width:0;padding:16px;border:1px solid var(--z-hairline-strong);border-radius:10px}
.zap-cc-kicker{font:600 13px/18px var(--sans);color:var(--z-title)}
.zap-cc-title{margin:0;padding-right:28px;font:650 18px/24px var(--sans);color:var(--z-title);overflow-wrap:anywhere}
.zap-cc-sub{display:flex;flex-wrap:wrap;margin:0;font:400 13px/18px var(--sans);color:var(--z-title);font-variant-numeric:tabular-nums}
.zap-cc-sub>:not(:last-child)::after{content:var(--z-sep,"\00b7");margin:0 var(--z-sep-space,.45em)}
@supports (content:"x" / ""){.zap-cc-sub>:not(:last-child)::after{content:var(--z-sep,"\00b7") / ""}}
.zap .zap-cc-x{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid transparent;border-radius:6px;background:none;transition:var(--z-lift-ease)}
.zap .zap-cc-x:is(:hover,:focus-visible){border-color:var(--z-title)}
.zap-cc-x svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.zap-cc-market{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding-top:12px;border-top:1px solid var(--z-hairline)}
.zap-cc-market b{display:block;font:600 15px/21px var(--sans);color:var(--z-title)}
.zap-cc-market .z-chg b{display:inline;font:inherit;font-weight:600}
.zap-cc-market .zap-cc-price{font:650 22px/26px var(--sans);font-variant-numeric:tabular-nums}
.zap-cc-hero{display:flex;align-items:baseline;gap:12px;min-height:44px}
.zap-cc-figure{font:var(--zt-figure-hero);font-variant-numeric:tabular-nums;color:var(--z-title)}
.zap-cc-pairs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.zap-cc-pairs span{display:block;font:400 12px/16px var(--sans)}
.zap-cc-pairs b{font:600 15px/21px var(--sans);font-variant-numeric:tabular-nums}
.zap-cc-actions{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}
.zap-cc-actions a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;border:1px solid var(--z-hairline-strong);border-radius:var(--rad);color:var(--z-title);font:500 13px/18px var(--sans);text-decoration:none;transition:var(--z-lift-ease)}
.zap-cc-actions a:is(:hover,:focus-visible){transform:var(--z-lift);box-shadow:var(--z-lift-shadow);border-color:var(--z-title)}
.zap-pick,.zap-watch{display:grid;min-width:0}
.zap-pick{gap:8px}.zap-pick>.zap-rail-h{margin:0}
.zap .zap-pick-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:12px 14px;border:1px solid var(--z-hairline-strong);border-radius:10px;background:none;text-align:left;transition:var(--z-lift-ease)}
.zap .zap-pick-card:is(:hover,:focus-visible){transform:var(--z-lift);box-shadow:var(--z-lift-shadow);border-color:var(--z-title)}
.zap-pick-card b{display:block;font:600 15px/21px var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zap-pick-card>span:first-child{min-width:0}
.zap .zap-watch-row{display:flex;align-items:center;width:100%;min-height:40px;padding:0;border:0;border-top:1px solid var(--z-hairline);border-radius:0;background:none;text-align:left}
.zap-watch-row b{font:400 15px/21px var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zap .zap-watch-row:is(:hover,:focus-visible) b{text-decoration:underline;text-underline-offset:3px}
.zap-chat .zap-cc-sub{margin:0}
.zap-accounts{display:flex;align-items:center;justify-content:space-between;gap:12px}
.zap-accounts .zap-rail-h{margin:0;font:600 15px/21px var(--sans)}
.zap .zap-connect{width:auto;min-height:36px;padding:0 14px;font:500 13px/18px var(--sans)}
/* the right column: the opening brief and the composer centred before a question; the thread, then the docked composer */
.zap-col{display:flex;flex-direction:column;max-width:808px;min-height:100%;padding:24px 24px 16px}
.zap[data-state=thread] .zap-col{padding-top:24px}
.zap[data-state=empty] .zap-col{justify-content:center}
.zap-hero{display:grid;gap:20px}
.zap-brief{display:grid;gap:12px}
.zap-brief:empty{display:none}
.zap-h1{font:650 32px/38px var(--sans);font-size:32px;line-height:38px}
.zap-verdict{margin:0;max-width:27em;font:650 24px/31px var(--sans);color:var(--z-title);text-wrap:balance}
.zap-chips{display:flex;flex-wrap:wrap;gap:8px}
.zap .zap-chips .zap-sug{min-height:34px;padding:0 14px;border-radius:17px;font:500 13px/18px var(--sans);white-space:nowrap}
.zap-slot{margin:0}
.zap-ctx-host,.zap-suggest{display:none!important}
.zap-form{grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:8px 8px 8px 16px;border-color:var(--z-title);border-radius:12px}
.zap-form textarea,.zap-dock .zap-form textarea{font:400 16px/24px var(--sans)}
.zap-form textarea::placeholder{color:var(--z-title)}
.zap .zap-mic,.zap .zap-send{width:36px;height:36px;border-radius:8px}
.zap-thread{gap:32px}
.zap-turn{gap:20px}
.zap-q{padding:8px 14px;border-radius:12px}
.zap-q p{font:500 15px/22px var(--sans)}
.zap-a[data-card]{padding:0;border:0;border-radius:0}
.zap-a[data-card]+.zap-viz,.zap-a .zap-card-host+.zap-viz{margin:20px 0 0}
.zap-dock{position:relative;border-top:0;padding:8px 24px calc(16px + env(safe-area-inset-bottom,0px))}
.zap .zap-more{position:absolute;right:24px;top:-44px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--z-title);border-radius:50%;background:var(--z-surface);color:var(--z-title)}
.zap .zap-more[hidden]{display:none}
/* the text running under the More below cue fades into the page, so the cue never sits on a readable line */
.zap .zap-dock:has(>.zap-more:not([hidden]))::before{content:"";position:absolute;left:0;right:0;top:-56px;height:56px;background:linear-gradient(to bottom,transparent,var(--z-surface) 70%);pointer-events:none}
.zap-more svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.zap-strip{display:none}
.zap-glyph-host{display:contents}
@media(max-width:899px){
  .zap,.zap[data-solo]{grid-template-columns:minmax(0,1fr)}
  .zap[data-solo] .zap-rail{display:flex}
  .zap-rail{width:min(92vw,376px);padding:20px 16px}
  .zap .zap-strip{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:center;gap:12px;flex:none;width:100%;min-height:56px;padding:8px 16px;border:0;border-bottom:1px solid var(--z-hairline);border-radius:0;background:var(--z-surface);text-align:left}
  .zap .zap-strip[hidden]{display:none}
  .zap-strip-body{display:grid;min-width:0}
  .zap-strip-body b{font:600 15px/21px var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .zap-strip-body span{font:400 12px/16px var(--sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .zap-strip-price{font:650 17px/22px var(--sans);font-variant-numeric:tabular-nums}
  .zap-strip svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .zap-col,.zap[data-state=thread] .zap-col{padding:20px 16px 12px}
  .zap-verdict{font:650 20px/26px var(--sans)}
  .zap-h1{font-size:27px;line-height:33px}
  .zap-dock{padding:8px 16px calc(10px + env(safe-area-inset-bottom,0px))}
  .zap-dock .zap-form{grid-template-columns:minmax(0,1fr) auto auto;padding:8px 8px 8px 16px}
  .zap-a[data-card]{padding:0}
}
/* b3 (production check, 390): on a phone the opening starts under the strip. Centred in a tall narrow column it left a
   190px empty band between "Pick up where you were" and the question. */
@media(max-width:600px){.zap[data-state=empty] .zap-col{justify-content:flex-start}}
/* index.html sets every <b> under #main to weight 400 with !important; the page's own weights are restated over it */
#main .zap :is(.zap-cc-market b,.zap-cc-pairs b,.zap-pick-card b,.zap-strip-body b,.zap-chat b,.zap-cc .z-chg b){font-weight:600!important}
#main .zap :is(.zap-cc-price,.zap-cc-figure,.zap-strip-price){font-weight:650!important}
#main .zap .zap-watch-row b{font-weight:400!important}
/* lf-a (review #12): the thread ends a cue's height above the dock, so its last line (the source line) is never cut by the
   composer or covered by "More below" once it is reached */
.zap[data-state=thread] .zap-thread{padding-bottom:48px}

/* Find a trade (2026-11-10, Palash: "it should ask me questions like what I want to trade, and then it should give me the
   proper event that I should be trading in a nicer format"). Step one, the one question: the board's desks as chips.
   Step two, the trades: two or three rows, best first, each a link to its market with its call, the price you would pay,
   Zena's estimate (the one purple), the gap, one plain sentence and its sources' clocks. One ink, hairlines, 12px floor. */
.zap-pick,.zap-trades{display:grid;gap:14px;max-width:760px}
.zap-pick-q,.zap-trades-verdict{margin:0;font:600 20px/28px var(--sans);color:var(--z-title);letter-spacing:0}
.zap-trade-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.zap .zap-trade{display:grid;grid-template-columns:24px minmax(0,1fr) auto;column-gap:12px;row-gap:8px;align-items:start;padding:14px 16px;border:1px solid var(--z-hairline-strong);border-radius:var(--rad);color:var(--z-title);text-decoration:none;background:none}
.zap-trade-rank{grid-row:1;font:600 15px/22px var(--sans);font-variant-numeric:tabular-nums;color:var(--z-title)}
.zap-trade-head{grid-column:2;display:grid;gap:2px;min-width:0}
.zap-trade-head b{font:600 16px/22px var(--sans);color:var(--z-title);overflow-wrap:anywhere}
.zap .zap-trade-sub{font:400 13px/18px var(--sans);color:var(--z-title);gap:0 12px}
.zap-trade-call{grid-column:3;justify-self:end;padding:3px 10px;border:1px solid var(--z-hairline-strong);border-radius:12px;font:600 13px/18px var(--sans);color:var(--z-title);white-space:nowrap}
.zap-trade-call[data-clears=true]{background:var(--z-title);border-color:var(--z-title);color:var(--z-surface)}
.zap-trade-nums{grid-column:2/4;display:flex;flex-wrap:wrap;gap:4px 28px;margin:0}
.zap-trade-nums>div{display:grid;gap:0}
.zap-trade-nums dt{font:400 12px/16px var(--sans);color:var(--z-title)}
.zap-trade-nums dd{margin:0;font:600 17px/24px var(--sans);font-variant-numeric:tabular-nums;color:var(--z-title)}
.zap-trade-nums .zap-est-text :is(dt,dd){color:var(--z-estimate)}
.zap-trade-why{grid-column:2/4;margin:0;font:400 15px/22px var(--sans);color:var(--z-title)}
.zap-trade-src{grid-column:2/4;display:flex;flex-wrap:wrap;gap:2px 14px;margin:0;font:400 12px/16px var(--sans);color:var(--z-title)}
.zap-trade-wait{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;padding:14px 16px;border:1px solid var(--z-hairline);border-radius:var(--rad)}
.zap-trades-note{margin:0;font:400 12px/16px var(--sans);color:var(--z-title)}
@media(max-width:600px){
  .zap .zap-trade{grid-template-columns:20px minmax(0,1fr);padding:12px}
  .zap-trade-call{grid-column:2;grid-row:2;justify-self:start}
  .zap-trade-nums,.zap-trade-why,.zap-trade-src{grid-column:2}
  .zap-trade-nums{gap:4px 20px}
  .zap-pick-q,.zap-trades-verdict{font-size:18px;line-height:25px}
}
