/* Ask about the Green Paper: the full-screen chat (assets/chat.js), in the site's harbour-at-night look.
   A centred reading column, the question as a heading, the answer as plain text with its sources beneath,
   and a large rounded box at the bottom to ask the next question. */
.chat{
  --c-bg:#FFFFFF;--c-panel:#EBF0F8;--c-panel-2:#DCE5F1;--c-line:#D9E1EC;--c-line-2:#B5C3D5;
  --c-ink:#1F2A37;--c-ink-2:#46525F;--c-ink-3:#5F6A77;--c-head:#003566;--c-accent:#003566;--c-accent-h:#101C42;--c-accent-t:#E1EAF5;--c-on:#FFFFFF;--c-gold:#FFD500;--c-on-gold:#101C42;--c-focus:#FFD500;
  --c-tint:rgba(0,53,102,.06);--c-tint-2:rgba(0,53,102,.1);--c-error:#B42318;
  width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;
  background:var(--c-bg);color:var(--c-ink);font:400 17px/1.6 var(--text,system-ui,sans-serif);color-scheme:light;overflow:hidden
}
:root[data-theme="dark"] .chat{
  --c-bg:#07131C;--c-panel:#0F2230;--c-panel-2:#16304A;--c-line:#1E3341;--c-line-2:#34505F;
  --c-ink:#EEF4F6;--c-ink-2:#C3D2DA;--c-ink-3:#93A9B5;--c-head:#FFFFFF;--c-accent:#8FC6FF;--c-accent-h:#BBDCFF;--c-accent-t:#15314A;--c-on:#07131C;--c-focus:#FFD500;
  --c-tint:rgba(255,255,255,.08);--c-tint-2:rgba(255,255,255,.14);--c-error:#FF9B9B;color-scheme:dark
}
.chat[open]{display:flex;flex-direction:column}
.chat::backdrop{background:var(--c-bg)}
.chat *{box-sizing:border-box}
.chat :focus-visible{outline:3px solid var(--c-on);outline-offset:0;box-shadow:0 0 0 6px var(--c-focus)!important}
html.chat-on{overflow:hidden}
.chat-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.chat-col{width:100%;max-width:760px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-left,0px)) 0 max(20px,env(safe-area-inset-right,0px))}

/* Top bar */
.chat-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(12px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 12px max(20px,env(safe-area-inset-left,0px));border-bottom:1px solid var(--c-line)}
.chat-brand{display:flex;align-items:center;gap:10px;margin:0;font:650 16px/1.2 var(--text,system-ui,sans-serif)}
.chat-dot{width:10px;height:10px;border-radius:50%;background:var(--c-accent);box-shadow:0 0 0 4px var(--c-accent-t)}
.chat-bar-r{display:flex;align-items:center;gap:8px}
.chat-new{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:0;border-radius:2px;background:var(--c-tint);color:var(--c-ink);font:600 15px/1 var(--text,system-ui,sans-serif);cursor:pointer}
.chat-new:hover{background:var(--c-tint-2)}
.chat-close{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:2px;background:var(--c-tint);color:var(--c-ink);cursor:pointer}
.chat-close:hover{background:var(--c-tint-2)}
.chat svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* Conversation */
.chat-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-padding-top:16px}
.chat-empty{padding:clamp(40px,10vh,120px) 0 32px}
.chat-h{margin:0;font:400 clamp(34px,4.6vw,56px)/1.08 var(--disp,Georgia,serif);letter-spacing:-.01em;color:var(--c-head);text-wrap:balance}
.chat-lede{margin:18px 0 0;max-width:56ch;font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:var(--c-ink-2)}
.chat-try{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:32px 0 0;padding:0;list-style:none}
.chat-chip{display:grid;gap:4px;width:100%;height:100%;padding:16px 18px;border:0;border-radius:0;background:var(--c-panel);color:var(--c-ink);font:550 16px/1.35 var(--text,system-ui,sans-serif);text-align:left;cursor:pointer;transition:background-color .2s}
.chat-chip:hover{background:var(--c-panel-2)}
.chat-chip-k{font-size:13.5px;font-weight:650;color:var(--c-accent)}
.chat-thread{display:grid;gap:0;padding-bottom:24px}
.chat-turn{padding:36px 0 32px;border-bottom:1px solid var(--c-line);scroll-margin-top:12px}
.chat-turn:last-child{border-bottom:0}
.chat-q{margin:0 0 18px;font:400 clamp(24px,2.6vw,32px)/1.2 var(--disp,Georgia,serif);color:var(--c-head);text-wrap:balance}
.chat-answer p{margin:0;max-width:68ch;font-size:17.5px;line-height:1.7;color:var(--c-ink)}
.chat-answer p + p{margin-top:14px}
a.chat-cite{text-decoration:none}
a.chat-cite:hover{text-decoration:underline;text-underline-offset:3px}
.chat-cite{display:inline;padding:1px 7px;margin:0 2px;border-radius:0;background:var(--c-accent-t);color:var(--c-accent);font-size:.84em;font-weight:600;white-space:nowrap}
.chat-wait{display:flex;align-items:center;gap:10px;color:var(--c-ink-3)!important}
.chat-dots{display:inline-flex;gap:4px}
.chat-dots i{width:6px;height:6px;border-radius:50%;background:var(--c-accent);animation:chat-dot 1.2s ease-in-out infinite}
.chat-dots i:nth-child(2){animation-delay:.15s}.chat-dots i:nth-child(3){animation-delay:.3s}
@keyframes chat-dot{0%,80%,100%{opacity:.25;transform:none}40%{opacity:1;transform:translateY(-3px)}}
.chat-error{color:var(--c-error)!important;font-weight:600}
.chat-src{margin-top:24px;display:grid;gap:10px;justify-items:start}
.chat-src-h{margin:0;font:650 14px/1 var(--text,system-ui,sans-serif);color:var(--c-ink-3)}
.chat-src-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.chat-ref{display:grid;gap:2px;padding:10px 14px;border-radius:0;background:var(--c-panel);color:var(--c-ink);text-decoration:none;font-size:14px;line-height:1.3}
.chat-ref b{font-weight:650}
.chat-ref span{color:var(--c-ink-3);font-size:13px}
a.chat-ref:hover{background:var(--c-panel-2)}
a.chat-ref b{color:var(--c-accent)}
.chat-copy{display:inline-flex;align-items:center;gap:8px;margin-top:4px;padding:8px 12px;border:0;border-radius:2px;background:transparent;color:var(--c-ink-3);font:600 14px/1 var(--text,system-ui,sans-serif);cursor:pointer}
.chat-copy:hover{background:var(--c-tint);color:var(--c-ink)}
.chat-copy svg{width:15px;height:15px}

/* The question box */
.chat-foot{padding:12px 0 calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--c-line);background:var(--c-bg)}
.chat-form{display:flex;align-items:flex-end;gap:10px;padding:8px 8px 8px 22px;border-radius:0;background:var(--c-panel);box-shadow:inset 0 0 0 1px var(--c-line-2)}
.chat-form:focus-within{box-shadow:inset 0 0 0 2px var(--c-accent)}
.chat-input{flex:1;min-width:0;min-height:44px;max-height:180px;resize:none;padding:10px 0;border:0;outline:0;background:transparent;color:var(--c-ink);font:400 17px/1.45 var(--text,system-ui,sans-serif)}
.chat-input::placeholder{color:var(--c-ink-3)}
.chat-input:focus-visible{box-shadow:none!important;outline:0}
.chat-send{display:grid;place-items:center;width:48px;height:48px;flex:none;border:0;border-radius:2px;background:var(--c-gold,var(--c-accent));color:var(--c-on-gold,var(--c-on));cursor:pointer}
.chat-send:hover{filter:brightness(1.06)}
.chat-send:disabled{background:var(--c-line-2);color:var(--c-ink-3);cursor:default}
.chat-note{margin:10px 4px 0;font-size:13px;line-height:1.45;color:var(--c-ink-3);text-align:center}

@media (max-width: 640px){
  .chat-try{grid-template-columns:minmax(0,1fr)}
  .chat-empty{padding-top:28px}
  .chat-new{width:44px;height:44px;padding:0;justify-content:center}
  .chat-new-l{display:none}
  .chat-brand{font-size:15px;white-space:nowrap}
  .chat-note{text-align:left}
}
@media (prefers-reduced-motion: reduce){ .chat-dots i{animation:none;opacity:.7} }