/* Adapted from sndr-chat: isolated paper card, using Visiting Iceland's tokens.
   The same sheet is linked in the document (host) and in the shadow (contents). */
vi-concierge  { position:fixed; z-index:70; right:max(18px,env(safe-area-inset-right)); bottom:calc(var(--concierge-clearance, 0px) + max(18px,env(safe-area-inset-bottom))); }
:host  { font-family:var(--sans,"Switzer",sans-serif); color:var(--ink,#12151A); line-height:1.5; font-size:14px; }
:host * { box-sizing:border-box; }
:host [hidden] { display:none!important; }
:host button,:host input { font:inherit; color:inherit; }
:host button,:host a { touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
:host button { cursor:pointer; user-select:none; }
:host button:disabled { cursor:default; opacity:.5; }
:host button:focus-visible,:host a:focus-visible,:host input:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
:host([data-input="pointer"]) :focus-visible:not(input)  { outline:none; }
:host [tabindex="-1"]:focus { outline:none; }
:host a { color:var(--accent); text-underline-offset:3px; }
:host .launch { display:flex; align-items:center; gap:9px; padding:12px 18px 12px 13px; min-height:48px; border:1px solid var(--hairline); border-radius:999px; background:var(--surface); box-shadow:0 4px 20px rgb(18 21 26 / .12); font-weight:500; transition:transform .16s var(--ease),border-color .16s; }
:host .orb { display:inline-block; flex:none; width:20px; height:20px; border:1px solid var(--accent); border-radius:50%; position:relative; overflow:hidden; }
:host /* at rest a still point in a ring; only while thinking does it open into a turning arc (motion = meaning) */
.orb::before { content:""; position:absolute; inset:5px; background:var(--accent); border-radius:50%; }
:host .panel { width:400px; height:600px; max-height:calc(100svh - 36px - var(--concierge-clearance,0px)); display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--hairline); border-radius:10px; overflow:hidden; box-shadow:0 16px 60px rgb(18 21 26 / .16); transform-origin:100% 100%; }
:host .head { flex:none; display:flex; align-items:center; gap:10px; padding:16px 16px 8px; }
:host .head strong { flex:1; font-family:var(--serif); font-size:23px; font-weight:500; line-height:1.15; }
:host .close { border:0; background:transparent; border-radius:50%; font-size:24px; width:44px; height:44px; flex:none; }
:host .disclosure { flex:none; margin:0; padding:0 18px 12px; color:var(--muted); font-size:11px; }
:host .actions { flex:none; display:flex; justify-content:space-between; align-items:center; padding:0 18px 12px; border-bottom:1px solid var(--hairline); font-size:12px; }
:host .reset { border:0; background:transparent; padding:8px 0; text-decoration:underline; text-underline-offset:3px; }
:host .log { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:20px 18px; display:flex; flex-direction:column; gap:18px; overflow-wrap:anywhere; }
:host .log > * { flex:none; }
:host .msg { margin:0; white-space:pre-wrap; }
:host .me { align-self:flex-end; max-width:90%; background:var(--paper); border-radius:10px; padding:10px 13px; }
:host .answer { display:flex; flex-direction:column; gap:12px; }
:host .refusal { padding:2px 0 2px 12px; border-left:2px solid var(--hairline); }
:host .refusal a { display:inline-block; margin-top:10px; }
:host .tool { color:var(--muted); font-size:11px; display:flex; align-items:center; gap:6px; }
:host .tool::before { content:'✓'; color:var(--accent); }
:host .tour { display:block; color:var(--ink); text-decoration:none; border:1px solid var(--hairline); border-radius:10px; overflow:hidden; background:var(--surface); }
:host .tour img { display:block; width:100%; height:126px; object-fit:cover; }
:host .tour-body { display:block; padding:12px; }
:host .tour strong { display:block; font-family:var(--serif); font-weight:500; font-size:21px; line-height:1.2; }
:host .meta { display:block; margin-top:7px; font-family:var(--mono); font-size:11px; color:var(--body); }
:host .availability { padding:12px; background:var(--paper); font-family:var(--mono); font-size:11px; }
:host .availability p { margin:6px 0; }
:host .chips { flex:none; display:flex; flex-wrap:wrap; gap:7px; padding:0 16px 12px; }
:host .chips button { background:transparent; border:1px solid var(--hairline); border-radius:999px; padding:8px 12px; min-height:40px; font-size:12px; }
:host .composer { flex:none; display:flex; align-items:center; gap:8px; padding:10px 14px; border-top:1px solid var(--hairline); }
:host .composer input { min-width:0; flex:1; padding:12px; border:1px solid var(--hairline); border-radius:8px; background:var(--surface); font-size:16px; }
:host .send { width:44px; height:44px; border:0; border-radius:50%; background:var(--accent); color:var(--surface); font-size:22px; }
:host .count { flex:none; margin:0; padding:0 18px 6px; color:var(--muted); font-size:12px; }
:host .log:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.foot { flex:none; padding:0 18px 12px; margin:0; color:var(--muted); font-size:11px; }
:host .think { display:flex; gap:10px; align-items:center; color:var(--muted); }
:host .think .orb::before { inset:3px; background:none; border:2px solid var(--accent); border-right-color:transparent; animation:orbspin 1.1s linear infinite; }
@media (prefers-reduced-motion: reduce) { :host .think .orb::before { animation:none; } }
@keyframes orbspin  { to  { transform:rotate(325deg); } }
:host button:active { transform:scale(.97); }
@media (hover:hover) and (pointer:fine)  {
:host .launch:hover { transform:translateY(-2px); border-color:var(--muted); }
:host .chips button:hover,:host .close:hover { background:var(--paper); }
:host .tour:hover { border-color:var(--accent); } }
@media (max-width:767px), (max-height:500px)  {
  vi-concierge[data-open],vi-concierge[data-closing]  { inset:0; bottom:auto; }
:host .panel { width:100vw; height:100svh; height:var(--concierge-vh,100svh); max-height:none; border:0; border-radius:0; padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom); transform-origin:50% 100%; }
:host .head { padding-top:12px; }
:host .msg { font-size:15px; }
}
@media (prefers-reduced-motion:reduce)  {
:host *,:host *::before { transition:none!important; animation:none!important; } }

/* Keep the returning pill at its own anchor while the card finishes closing. */
:host([data-closing]) .launch { position:absolute; right:0; bottom:0; }

/* Waits out the home intro (data-wait set by concierge.js), then rises in once. */
:host([data-wait]) .launch { opacity:0; pointer-events:none; visibility:hidden; }
/* opacity only: transform keeps its quick .16s for the press, the visibility flip is instant */
:host .launch { transition:transform .16s var(--ease),border-color .16s,opacity .45s var(--ease),visibility 0s; }
@media (prefers-reduced-motion: reduce) { :host .launch { transition:none; } }