/* "Ask Dino" help popup (public/dino-help.js): a panel beside the page on desktop, a sheet on phones.
   Uses the design tokens from premium.css, so it follows light and dark. */
#dino-help.dino-help{position:fixed;z-index:60;right:18px;bottom:calc(92px + env(safe-area-inset-bottom,0px));width:min(380px,calc(100vw - 36px));height:min(560px,calc(100vh - 140px));display:flex;flex-direction:column;box-sizing:border-box;margin:0;padding:0;background:var(--surface,#fff);color:var(--ink,#1c1b1f);border:1px solid var(--line-strong,#d5d0c5);border-radius:18px;box-shadow:0 18px 48px -16px rgba(0,0,0,.35);font:15px/1.5 var(--font-body,Inter,system-ui,sans-serif);overflow:hidden}
#dino-help.dino-help[hidden],.dh-backdrop[hidden]{display:none!important}
#dino-help .dh-head{display:flex;align-items:center;gap:12px;padding:12px 10px 12px 14px;border-bottom:1px solid var(--line,#e6e2d9);flex:none}
#dino-help .dh-face-box{position:relative;flex:none;width:44px;height:44px;border-radius:50%;overflow:hidden;background:#c7c6df;border:1px solid #aaa9cf}
#dino-help .dh-face{position:absolute;left:-15%;top:-4%;width:130%;height:130%;max-width:none;object-fit:cover;object-position:center top}
#dino-help .dh-titles{flex:1;min-width:0}
#dino-help .dh-title{margin:0;font:600 18px/1.2 var(--font-display,Georgia,serif);color:var(--ink,#1c1b1f);letter-spacing:-.01em}
#dino-help .dh-sub{margin:2px 0 0;font-size:12.5px;line-height:1.35;color:var(--muted,#66636b)}
#dino-help button.dh-close{flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:12px;background:transparent;color:var(--ink,#1c1b1f);cursor:pointer;box-shadow:none}
#dino-help button.dh-close:hover{background:var(--soft,#f3f1eb)}
#dino-help .dh-log{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px;display:flex;flex-direction:column;gap:10px}
#dino-help .dh-log:focus{outline:none}
#dino-help .dh-msg{max-width:88%;padding:9px 12px;border-radius:14px;overflow-wrap:anywhere}
#dino-help .dh-msg p{margin:0}
#dino-help .dh-msg p+p,#dino-help .dh-msg p+ul,#dino-help .dh-msg ul+p{margin-top:6px}
#dino-help .dh-msg ul{margin:4px 0 0;padding-left:18px}
#dino-help .dh-dino{align-self:flex-start;background:var(--soft,#f3f1eb);color:var(--ink,#1c1b1f);border-bottom-left-radius:4px}
#dino-help .dh-me{align-self:flex-end;background:var(--teal,#0d5c55);color:var(--teal-ink,#fff);border-bottom-right-radius:4px}
#dino-help .dh-dots{display:inline-block;width:28px;height:8px;background:radial-gradient(circle,currentColor 3px,transparent 3.5px) 0 0/10px 8px repeat-x;opacity:.55}
#dino-help .dh-prompts{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:0 14px 12px;flex:none}
#dino-help .dh-prompts[hidden],#dino-help .dh-status[hidden]{display:none}
#dino-help button.dh-chip{display:inline-block;max-width:100%;padding:7px 12px;margin:0;border:1px solid var(--line-strong,#d5d0c5);border-radius:999px;background:var(--surface,#fff);color:var(--ink,#1c1b1f);font:500 14px/1.3 var(--font-body,Inter,system-ui,sans-serif);text-align:left;cursor:pointer;box-shadow:none}
#dino-help button.dh-chip:hover{border-color:var(--teal,#0d5c55);background:var(--teal-soft,#e7f0ee)}
#dino-help .dh-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 14px 10px;padding:9px 12px;border-radius:12px;background:var(--lav,#efecf6);color:var(--lav-ink,#4a4170);font-size:14px;flex:none}
#dino-help .dh-status p{margin:0;flex:1 1 180px}
#dino-help button.dh-retry{padding:6px 12px;margin:0;border:1px solid currentColor;border-radius:10px;background:transparent;color:inherit;font:600 14px/1.2 var(--font-body,Inter,system-ui,sans-serif);cursor:pointer;box-shadow:none}
#dino-help form.dh-form{display:flex;background:transparent!important;border-width:1px 0 0!important;border-radius:0!important;box-shadow:none!important;align-items:flex-end;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line,#e6e2d9);flex:none;margin:0}
#dino-help textarea.dh-input{background:var(--surface,#fff);color:var(--ink,#1c1b1f);border:1px solid var(--line-strong,#d5d0c5);border-radius:12px;flex:1;min-width:0;min-height:44px!important;max-height:132px;height:44px;resize:none;margin:0;padding:10px 12px;font:16px/1.4 var(--font-body,Inter,system-ui,sans-serif);box-sizing:border-box}
#dino-help button.dh-send{flex:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;margin:0;border:0;border-radius:12px;background:var(--teal,#0d5c55);color:var(--teal-ink,#fff);cursor:pointer;box-shadow:none}
#dino-help button.dh-send:hover{background:var(--accent-hover,#0a4c46)}
#dino-help button.dh-send:disabled{opacity:.55;cursor:default}
#dino-help :is(button,textarea):focus-visible{outline:2px solid var(--focus,#0d5c55)!important;outline-offset:2px}
#dino-help .dh-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Signed-in pages: which trip Dino helps with, and the link to open it in the planner */
#dino-help .dh-pick{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:10px 14px;border-bottom:1px solid var(--line,#e6e2d9);flex:none;font-size:14px;font-weight:600}
#dino-help .dh-pick[hidden],#dino-help .dh-handoff[hidden]{display:none}
#dino-help .dh-pick select{background:var(--surface,#fff);color:var(--ink,#1c1b1f);border:1px solid var(--line-strong,#d5d0c5);flex:1 1 160px;min-width:0;min-height:40px;margin:0;padding:6px 10px;font:500 15px/1.3 var(--font-body,Inter,system-ui,sans-serif);border-radius:10px}
#dino-help a.dh-handoff{flex:none;align-self:flex-start;margin:0 14px 10px;font-size:14px;font-weight:600;color:var(--teal,#0d5c55)}
#dino-help select:focus-visible,#dino-help a:focus-visible{outline:2px solid var(--focus,#0d5c55)!important;outline-offset:2px}
/* Phone: a sheet over the page, sized to what's visible above the keyboard */
.dh-backdrop{position:fixed;inset:0;z-index:59;background:rgba(10,12,16,.45)}
#dino-help.dino-help.dh-sheet{left:0;right:0;bottom:auto;top:calc(var(--dh-top,0px) + max(12px, env(safe-area-inset-top,0px)));width:100%;height:calc(var(--dh-vh,100dvh) - max(12px, env(safe-area-inset-top,0px)));max-height:none;border-radius:18px 18px 0 0;border-width:1px 0 0}
html.dh-locked,html.dh-locked body{overflow:hidden}
@media (max-width:640px){#dino-help.dino-help{right:0;left:0;width:100%}}
html body .site-crew-link.crew-fab.dh-launcher-open{box-shadow:0 0 0 3px var(--surface,#fff),0 0 0 5px var(--teal,#0d5c55)!important}
@media (prefers-reduced-motion:reduce){#dino-help *{transition:none!important;animation:none!important}}
@media print{#dino-help,.dh-backdrop{display:none!important}}
