/* One Guide destination: a request, a useful follow-up when needed, then the map. */
#guides-view[data-guide-ui="dialogue"] { height:calc(100dvh - var(--header-height)); min-height:0; display:flex; flex-direction:column; gap:0; overflow-y:auto; padding:24px clamp(20px,6vw,100px); }
#guides-view .guide-page-intro { display:flex; justify-content:space-between; align-items:center; margin:0; width:100%; max-width:860px; }
#guides-view .guide-page-intro h1 { font-size:18px; line-height:1.3; letter-spacing:-.25px; margin:0; }

#guides-view .guide-page-intro .text-button { font-size:14px; min-height:40px; }
.guide-concierge { width:100%; max-width:660px; margin:24px auto 18px; padding:12px 0; display:flex; flex-direction:column; flex:0 1 auto; min-width:0; min-height:0; }
.guide-step-content { display:flex; flex-direction:column; flex:0 1 auto; min-height:0; }
.guide-concierge .guide-conversation { padding:0; flex:0 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
#guide-search-title { font-size:clamp(25px,3vw,34px); line-height:1.15; letter-spacing:-.7px; font-weight:600; margin:0 0 14px; max-width:620px; }
#guide-prompt-help { color:var(--muted); font-size:15px; line-height:1.65; margin:0 0 22px; max-width:550px; }
.guide-request-summary { color:var(--muted); font-size:14px; line-height:1.5; margin:0 0 20px; padding-left:12px; border-left:2px solid var(--line); overflow-wrap:anywhere; max-height:70px; overflow-y:auto; }
.guide-concierge .guide-question-form { border:0; background:transparent; padding:0; margin:0; }
/* Keep the field's fill inside the field, including the dark theme's form reset. */
html[data-theme] .guide-concierge .guide-question-form { background:transparent; box-shadow:none; }
#guide-question-label { display:block; font-size:14px; font-weight:600; margin:0 0 8px; color:var(--ink); }
.guide-concierge #guide-question { width:100%; box-sizing:border-box; display:block; min-height:100px; max-height:160px; resize:vertical; border:1px solid var(--line); border-radius:10px; padding:15px; margin:0; font-family:inherit; font-size:16px; line-height:1.55; background:var(--theme-panel,var(--surface)); color:var(--ink); }
.guide-concierge #guide-question:focus { outline:none; border-color:var(--blue); box-shadow:inset 0 0 0 1px var(--blue); }
.guide-concierge #guide-question::placeholder { color:var(--muted); opacity:1; }
.guide-dialogue-actions { display:flex; justify-content:flex-end; gap:12px; margin-top:14px; align-items:center; }
#guide-dialogue-back { margin-right:auto; min-height:44px; padding-inline:4px; font-size:14px; }
#guide-submit { min-height:46px; padding:12px 18px; font-size:14px; border-radius:6px; }
.guide-dialogue-status { margin:12px 0 0; font-size:14px; color:var(--muted); line-height:1.5; }
.guide-dialogue-status:empty { display:none; }
#guide-dialogue-retry { margin-top:10px; }
.guide-clarification-options { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.guide-clarification-options button { padding:11px 14px; min-height:44px; border:1px solid var(--line); border-radius:7px; color:var(--ink); font-size:15px; text-align:left; background:var(--theme-panel,var(--surface)); }
.guide-clarification-options button:hover { border-color:var(--blue); color:var(--blue); background:var(--theme-raised,#f5f9fc); }
.guide-clarification-options button:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.guide-clarification-options[data-selection-mode="multiple"] button { display:flex; align-items:center; gap:9px; }
.guide-choice-mark { width:17px; height:17px; flex:none; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--muted); border-radius:4px; }
.guide-choice-mark svg { width:13px; height:13px; visibility:hidden; }
.guide-clarification-options button[aria-pressed="true"] { border-color:var(--blue); color:var(--blue); background:var(--theme-raised,#f5f9fc); box-shadow:inset 0 0 0 1px var(--blue); }
.guide-clarification-options button[aria-pressed="true"] .guide-choice-mark { background:var(--blue); border-color:var(--blue); color:var(--theme-panel,#fff); }
.guide-clarification-options button[aria-pressed="true"] .guide-choice-mark svg { visibility:visible; }
.guide-concierge button:disabled { opacity:.55; cursor:wait; }
.guide-resume { margin-top:18px; min-height:44px; font-size:14px; }
.guide-concierge .guide-disclosure { margin:20px 0 0; color:var(--muted); font-size:12.5px; }
.guide-structured { max-width:660px; width:100%; margin:8px auto 0; flex:none; }
.guide-structured>summary { color:var(--muted); font-size:14px; cursor:pointer; min-height:44px; display:flex; align-items:center; padding:6px 0; list-style:none; }
.guide-structured>summary::-webkit-details-marker { display:none; }
.guide-structured[open]>summary { color:var(--blue); }
.guide-structured[open]>summary::before { content:'←'; margin-right:8px; }
.guide-structured:not([open])>.itinerary-builder { display:none!important; }
#guides-view[data-guide-ui="structured"] { overflow:hidden; }
#guides-view[data-guide-ui="structured"]>.guide-structured { display:flex; flex-direction:column; flex:1; min-height:0; }
#guides-view[data-guide-ui="structured"]>.guide-structured>summary { flex:none; }
#guides-view[data-guide-ui="structured"] .itinerary-builder { flex:1; min-height:0; }
@media(max-width:650px) {
  #guides-view[data-guide-ui="dialogue"] { padding:12px 20px max(12px,env(safe-area-inset-bottom)); }
  .guide-concierge { padding:14px 0; margin:6px auto 18px; }
  #guide-search-title { font-size:27px; margin-bottom:10px; letter-spacing:-.5px; }
  #guide-prompt-help { font-size:14px; line-height:1.55; margin-bottom:18px; }
  .guide-concierge #guide-question { min-height:94px; padding:12px; }
  .guide-request-summary { font-size:14px; margin-bottom:16px; max-height:52px; }
  .guide-clarification-options { margin-bottom:15px; gap:7px; }
  .guide-clarification-options button { font-size:14px; padding:9px 12px; }
  #guide-submit { padding:11px 13px; }
}
@media(max-height:650px) and (max-width:650px) {
  .guide-concierge { padding:8px 0; }
  #guide-search-title { font-size:24px; }
  #guide-prompt-help { margin-bottom:12px; }
  .guide-concierge #guide-question { min-height:82px; }
  .guide-dialogue-actions { margin-top:10px; }
}
@media(prefers-reduced-motion:reduce) { #guide-concierge[data-step="clarification"] .guide-conversation { animation:none; } }

/* Keep the answer and Back action reachable while longer choice lists scroll. */
#guides-view[data-guide-ui="dialogue"][data-guide-step="clarification"] { overflow:hidden; }
#guide-concierge[data-step="clarification"] { flex:0 1 auto; min-height:0; margin:24px auto 0; padding:12px 0; }
#guide-concierge[data-step="clarification"] .guide-request-summary { flex:none; }
#guide-concierge[data-step="clarification"] .guide-conversation { min-height:0; flex:0 1 auto; overflow-y:auto; overscroll-behavior:contain; padding:2px 4px 2px 2px; margin:0 -4px 12px -2px; }
#guide-concierge[data-step="clarification"] .guide-question-form,
#guide-concierge[data-step="clarification"] .guide-dialogue-status,
#guide-concierge[data-step="clarification"] #guide-dialogue-retry { flex:none; }
#guide-concierge[data-step="clarification"] #guide-question { min-height:68px; max-height:100px; }
#guides-view[data-guide-ui="dialogue"][data-guide-step="clarification"]>.guide-structured { display:none; }
@media(max-width:650px) {
  #guide-concierge[data-step="clarification"] { margin-top:8px; padding:8px 0 0; }
  #guide-concierge[data-step="clarification"] .guide-request-summary { max-height:36px; margin-bottom:12px; }
  #guide-concierge[data-step="clarification"] #guide-prompt-help { margin-bottom:10px; }
  #guide-concierge[data-step="clarification"] #guide-search-title { font-size:22px; }
  #guide-concierge[data-step="clarification"] #guide-question { height:62px; min-height:62px; }
  #guide-concierge[data-step="clarification"] .guide-clarification-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  #guide-concierge[data-step="clarification"] .guide-clarification-options button { min-width:0; overflow-wrap:anywhere; }
}
@media(max-height:520px) {
  #guides-view[data-guide-ui="dialogue"][data-guide-step="clarification"] { overflow-y:auto; }
  #guide-concierge[data-step="clarification"],
  #guide-concierge[data-step="clarification"] .guide-conversation { flex:none; }
  #guide-concierge[data-step="clarification"] .guide-conversation { overflow:visible; }
}

/* A landscape phone has desktop width, but not desktop vertical space. */
@media (max-height: 520px) {
  #guides-view[data-guide-ui="dialogue"] { padding-block: 10px; }
  #guide-concierge[data-step="start"] { margin: 6px auto 8px; padding-block: 4px; }
  #guide-concierge[data-step="start"] #guide-search-title { font-size: 23px; margin-bottom: 8px; }
  #guide-concierge[data-step="start"] #guide-question { min-height: 64px; height: 64px; padding: 10px 12px; }
  #guide-concierge[data-step="start"] .guide-dialogue-actions { margin-top: 8px; }
}

/* The details content box must participate in the fixed-height question layout. */
#guides-view[data-guide-ui="structured"] > .guide-structured::details-content {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
@supports not selector(details::details-content) {
  #guides-view[data-guide-ui="structured"] { overflow-y: auto; }
  #guides-view[data-guide-ui="structured"] > .guide-structured { display: block; flex: none; }
  #guides-view[data-guide-ui="structured"] .itinerary-builder { min-height: 520px; }
}
#guides-view[data-guide-ui="structured"] .planner-question-footer:empty { display: none; }
@media (max-height: 520px) {
  #guides-view[data-guide-ui="structured"] > .guide-page-intro,
  #guides-view[data-guide-ui="structured"] .planner-answers { display: none; }
  #guides-view[data-guide-ui="structured"] .planner-header { padding-top: 6px; }
  #guides-view[data-guide-ui="structured"] .planner-question-content > h3 { font-size: 21px; }
  #guides-view[data-guide-ui="structured"] .planner-choice { min-height: 52px; padding-block: 10px; }
  #guides-view[data-guide-ui="structured"] .planner-choice-copy small { display: none; }
}
/* When the keyboard leaves very little height, allow the whole form to scroll. */
@media (max-height: 360px) {
  #guides-view[data-guide-ui="structured"] { overflow-y: auto; }
  #guides-view[data-guide-ui="structured"] > .guide-structured { flex: none; min-height: 360px; }
}