/* =============================================================================
   Ask Aurelia — floating concierge (x-ask.js). Always a velvet-night glass panel;
   the accent follows the shop clock theme (--gold / --gold-hi from site.css:
   champagne by day, rose-gold in the evening).
   ============================================================================= */
.aa-fab, .aa-wrap { --aa-ink: #f3ecdc; --aa-mut: #a7abbf; --aa-bg: #070b1c; --aa-bg2: #0e1532; --aa-line: rgba(232, 214, 170, .14);
  --aa-gold: var(--gold-hi, #f3dc9e); --aa-gold2: var(--gold, #b68c3e); font-family: var(--sans, "Jost", system-ui, sans-serif); }
html[data-part="morning"] .aa-fab, html[data-part="afternoon"] .aa-fab, html[data-part="morning"] .aa-wrap, html[data-part="afternoon"] .aa-wrap { --aa-gold: #f3dc9e; --aa-gold2: #c79a45; }

/* ---------- floating button ---------- */
.aa-fab { position: fixed; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 85;
  display: inline-flex; align-items: center; gap: 12px; padding: 6px 20px 6px 6px; min-height: 64px; border: 0; border-radius: 999px; cursor: pointer;
  color: var(--aa-ink); background: radial-gradient(120% 140% at 0% 0%, #1c2550, var(--aa-bg) 60%);
  box-shadow: 0 18px 44px -14px rgba(4, 7, 20, .7), inset 0 0 0 1px rgba(243, 220, 158, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
  transition: transform .35s var(--ease-out, ease), box-shadow .35s, opacity .3s; isolation: isolate; }
.aa-fab::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; z-index: -1; pointer-events: none;
  background: conic-gradient(from var(--aa-a, 0deg), transparent 0 70%, var(--aa-gold) 80%, #fff 84%, var(--aa-gold) 88%, transparent 96%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: aa-orbit 6s linear infinite; }
@property --aa-a { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes aa-orbit { to { --aa-a: 360deg; } }
.aa-fab:hover { transform: translateY(-3px); box-shadow: 0 24px 54px -14px rgba(4, 7, 20, .8), inset 0 0 0 1px rgba(243, 220, 158, .45); }
.aa-fab:focus-visible { outline: 2px solid var(--aa-gold); outline-offset: 4px; }
.aa-fab-orb { position: relative; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #2a3570, #0a1029 70%); box-shadow: inset 0 0 0 1px rgba(243, 220, 158, .3), inset 0 -8px 18px rgba(0, 0, 0, .4); overflow: hidden; }
.aa-fab-orb .aa-gem { width: 34px; height: 34px; filter: drop-shadow(0 2px 6px rgba(243, 220, 158, .45)); animation: aa-float 5s ease-in-out infinite; }
.aa-fab-halo { position: absolute; inset: 0; border-radius: 50%; background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .5) 50%, transparent 65%); transform: translateX(-120%); animation: aa-sweep 4.8s var(--ease, ease) infinite 1.2s; }
.aa-fab-txt { display: grid; text-align: left; line-height: 1.1; font-family: var(--serif, Georgia, serif); font-size: 1.1rem; letter-spacing: .01em; }
.aa-fab-txt small { font-family: var(--mono, monospace); font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; color: var(--aa-gold); margin-bottom: 3px; }
@keyframes aa-float { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-2px) rotate(4deg); } }
@keyframes aa-sweep { 0%, 55% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
.aa-gem-spark { transform-origin: 50px 12px; animation: aa-twinkle 3.4s ease-in-out infinite; }
@keyframes aa-twinkle { 0%, 70%, 100% { opacity: 0; transform: scale(.4); } 82% { opacity: 1; transform: scale(1); } }
html.aa-open .aa-fab { opacity: 0; pointer-events: none; transform: translateY(10px) scale(.94); }
html.jw-lock .aa-fab { opacity: 0; pointer-events: none; }
@media (max-width: 640px) {
  .aa-fab { padding: 5px; min-height: 0; right: 14px; bottom: 14px; }
  .aa-fab-txt { display: none; }
  .aa-fab-orb { width: 46px; height: 46px; }
  .aa-fab-orb .aa-gem { width: 30px; height: 30px; }
}
@media print { .aa-fab, .aa-wrap { display: none !important; } }

/* ---------- dialog ---------- */
.aa-wrap { position: fixed; inset: 0; z-index: 110; pointer-events: none; }
.aa-wrap[hidden] { display: none; }
.aa-scrim { position: absolute; inset: 0; background: rgba(4, 7, 20, .35); opacity: 0; transition: opacity .28s; pointer-events: auto; }
.aa-wrap.on .aa-scrim { opacity: 1; }
.aa-panel { position: absolute; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); width: min(440px, calc(100vw - 36px)); height: min(720px, calc(100dvh - 36px));
  display: flex; flex-direction: column; pointer-events: auto; overflow: hidden; border-radius: 28px; color: var(--aa-ink);
  background: radial-gradient(90% 50% at 100% 0%, rgba(243, 220, 158, .12), transparent 70%), radial-gradient(70% 40% at 0% 100%, rgba(90, 110, 220, .14), transparent 70%), linear-gradient(180deg, #0c1331, var(--aa-bg) 60%);
  box-shadow: 0 50px 120px -30px rgba(0, 0, 0, .75), inset 0 0 0 1px rgba(243, 220, 158, .2), inset 0 1px 0 rgba(255, 255, 255, .06);
  transform: translateY(24px) scale(.97); transform-origin: 100% 100%; opacity: 0; transition: transform .42s var(--ease-out, ease), opacity .3s; }
.aa-wrap.on .aa-panel { transform: none; opacity: 1; }
.aa-panel::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--aa-gold), transparent); opacity: .7; }
@media (max-width: 640px) {
  .aa-panel { right: 0; bottom: 0; left: 0; width: 100%; height: min(100dvh, 100%); border-radius: 0; transform: translateY(30px); }
}

.aa-head { display: flex; align-items: center; gap: 12px; padding: 16px 14px 12px 18px; }
.aa-head-gem { position: relative; flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px;
  background: radial-gradient(circle at 35% 30%, #27326a, #0a1029 75%); box-shadow: inset 0 0 0 1px rgba(243, 220, 158, .3); overflow: hidden; }
.aa-head-gem .aa-gem { width: 30px; height: 30px; }
.aa-panel.thinking .aa-head-gem .aa-gem-body { animation: aa-spin 1.2s linear infinite; transform-origin: 32px 32px; }
.aa-panel.listening .aa-head-gem { box-shadow: inset 0 0 0 1px var(--aa-gold), 0 0 0 5px rgba(243, 220, 158, .15); }
@keyframes aa-spin { to { transform: rotateY(360deg); } }
.aa-ttl { flex: 1; min-width: 0; }
.aa-kick { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 0 2px; font-family: var(--mono, monospace); font-size: .58rem; letter-spacing: .22em; color: var(--aa-gold); opacity: .85; }
.aa-ttl h2 { margin: 0; font-family: var(--serif, Georgia, serif); font-weight: 500; font-size: 1.45rem; line-height: 1.05; color: var(--aa-ink); letter-spacing: -.01em; }
.aa-ttl p#aa-sub { white-space: nowrap; overflow: hidden; margin: 4px 0 0; display: flex; align-items: center; gap: 7px; font-size: .74rem; color: var(--aa-mut); }
.aa-dot { width: 7px; height: 7px; border-radius: 50%; background: #48d18a; box-shadow: 0 0 0 3px rgba(72, 209, 138, .18); flex: none; }
.aa-ico { flex: none; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--aa-line); background: rgba(255, 255, 255, .03); color: var(--aa-ink); cursor: pointer; transition: border-color .2s, background .2s; }
.aa-ico:hover { border-color: var(--aa-gold); background: rgba(243, 220, 158, .08); }
.aa-ico:focus-visible, .aa-send:focus-visible, .aa-chip:focus-visible, .aa-in:focus-visible { outline: 2px solid var(--aa-gold); outline-offset: 2px; }
.aa-ico[aria-pressed="true"] { border-color: var(--aa-gold); color: var(--aa-gold); }
.aa-ico[hidden] { display: none; }

/* bullion ticker */
.aa-ticker { display: flex; gap: 16px; align-items: center; padding: 8px 18px; font-family: var(--mono, monospace); font-size: .7rem; color: var(--aa-mut);
  border-top: 1px solid var(--aa-line); border-bottom: 1px solid var(--aa-line); background: rgba(255, 255, 255, .02); overflow-x: auto; scrollbar-width: none; white-space: nowrap; }
.aa-ticker::-webkit-scrollbar { display: none; }
.aa-ticker b { color: var(--aa-gold); font-weight: 500; }
.aa-ticker span { color: var(--aa-ink); }
.aa-ticker em { font-style: normal; font-size: .64rem; }
.aa-ticker .aa-ticker-l { color: var(--aa-mut); font-size: .62rem; }
.aa-wrap .up { color: #6fd39c; } .aa-wrap .dn { color: #f08c84; } .aa-wrap .eq { color: var(--aa-mut); }

/* log */
.aa-log { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px 8px; display: flex; flex-direction: column; gap: 10px; scrollbar-width: thin; scrollbar-color: rgba(243, 220, 158, .25) transparent; }
.aa-msg { max-width: 92%; font-size: .93rem; line-height: 1.5; animation: aa-in .35s var(--ease-out, ease) both; }
@keyframes aa-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.aa-msg p { margin: 0; }
.aa-msg b { color: #fff; font-weight: 600; }
.aa-msg.bot { align-self: flex-start; padding: 11px 15px; border-radius: 6px 18px 18px 18px; background: rgba(255, 255, 255, .055); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06); }
.aa-msg.bot.bare { padding: 0; background: none; box-shadow: none; max-width: 100%; width: 100%; }
.aa-msg.me { align-self: flex-end; padding: 10px 15px; border-radius: 18px 6px 18px 18px; color: #1a1306; font-weight: 500;
  background: linear-gradient(135deg, var(--aa-gold) 0%, var(--aa-gold2) 100%); box-shadow: 0 8px 20px -10px rgba(243, 220, 158, .6); }
.aa-msg.me b { color: inherit; }
.aa-msg.note { align-self: flex-start; font-size: .74rem; color: var(--aa-mut); display: flex; gap: 6px; align-items: baseline; padding: 0 4px; }
.aa-msg.note i { color: var(--aa-gold); }
.aa-msg.typing { padding: 12px 16px; }
.aa-typing { display: inline-flex; gap: 5px; }
.aa-typing i { width: 6px; height: 6px; border-radius: 50%; background: var(--aa-gold); opacity: .4; animation: aa-dot 1s infinite; }
.aa-typing i:nth-child(2) { animation-delay: .15s; } .aa-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes aa-dot { 0%, 100% { opacity: .3; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-3px); } }
.aa-link { color: var(--aa-gold); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(243, 220, 158, .4); }
.aa-link:hover { color: #fff; }
.aa-msg.bare > .aa-link { font-size: .84rem; padding-left: 4px; }

/* rate board */
.aa-rates { display: grid; gap: 1px; border-radius: 16px; overflow: hidden; background: var(--aa-line); box-shadow: inset 0 0 0 1px var(--aa-line); }
.aa-rate { display: grid; grid-template-columns: 1fr auto 74px; align-items: baseline; gap: 10px; padding: 10px 14px; background: #0b1230; font-family: var(--mono, monospace); font-size: .8rem; }
.aa-rate span { color: var(--aa-mut); }
.aa-rate b { color: var(--aa-ink); font-weight: 500; font-size: .98rem; }
.aa-rate b small { color: var(--aa-mut); font-size: .7rem; }
.aa-rate em { font-style: normal; text-align: right; font-size: .72rem; }

/* product cards */
.aa-items { display: grid; gap: 8px; }
.aa-pc { display: grid; grid-template-columns: 62px 1fr auto; align-items: center; gap: 12px; padding: 8px 12px 8px 8px; border-radius: 18px; text-decoration: none; color: var(--aa-ink);
  background: linear-gradient(135deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .02)); box-shadow: inset 0 0 0 1px var(--aa-line); position: relative; overflow: hidden; transition: box-shadow .25s, transform .25s; }
.aa-pc::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -60%; background: linear-gradient(100deg, transparent, rgba(255, 248, 225, .14), transparent); transform: skewX(-18deg); transition: left .9s var(--ease, ease); pointer-events: none; }
.aa-pc:hover { box-shadow: inset 0 0 0 1px rgba(243, 220, 158, .45); transform: translateY(-1px); color: var(--aa-ink); }
.aa-pc:hover::after { left: 130%; }
.aa-pc:focus-visible { outline: 2px solid var(--aa-gold); outline-offset: 2px; }
.aa-pc-art { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 14px; background: radial-gradient(circle at 50% 20%, rgba(255, 240, 205, .22), rgba(255, 255, 255, .02) 70%); }
.aa-pc-art img, .aa-pc-art svg { width: 54px; height: 54px; object-fit: contain; }
.aa-pc-t { display: grid; min-width: 0; line-height: 1.3; }
.aa-pc-t b { font-weight: 500; font-size: .92rem; color: var(--aa-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-pc-t small { color: var(--aa-mut); font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.aa-pc-p { font-family: var(--mono, monospace); font-size: .86rem; color: var(--aa-gold); margin-top: 2px; }
.aa-pc-p .hold { font-style: normal; font-family: var(--sans, sans-serif); font-size: .64rem; padding: 1px 7px; border-radius: 99px; background: rgba(214, 160, 80, .2); color: #f0c98a; margin-left: 4px; }
.aa-pc > i { color: var(--aa-mut); }

/* order track */
.aa-card { padding: 14px; border-radius: 16px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--aa-line); }
.aa-track { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); position: relative; }
.aa-track::before { content: ""; position: absolute; left: 12.5%; right: 12.5%; top: 6px; height: 2px; background: rgba(255, 255, 255, .1); }
.aa-track li { position: relative; display: grid; justify-items: center; gap: 6px; text-align: center; font-size: .68rem; color: var(--aa-mut); line-height: 1.2; }
.aa-track li i { width: 14px; height: 14px; border-radius: 50%; background: #1b2244; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .18); position: relative; z-index: 1; }
.aa-track li.done i { background: var(--aa-gold2); box-shadow: none; }
.aa-track li.done { color: var(--aa-ink); }
.aa-track li.now i { background: var(--aa-gold); box-shadow: 0 0 0 5px rgba(243, 220, 158, .2); animation: aa-now 1.8s ease-in-out infinite; }
.aa-track li.now { color: var(--aa-gold); font-weight: 600; }
@keyframes aa-now { 50% { box-shadow: 0 0 0 9px rgba(243, 220, 158, 0); } }

/* slots + actions */
.aa-slots { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.aa-slot { display: grid; place-items: center; min-height: 44px; padding: 4px; border-radius: 12px; text-decoration: none; font-family: var(--mono, monospace); font-size: .78rem; color: var(--aa-ink);
  box-shadow: inset 0 0 0 1px var(--aa-line); background: rgba(255, 255, 255, .03); line-height: 1.1; transition: box-shadow .2s, background .2s; }
.aa-slot small { font-family: var(--sans, sans-serif); font-size: .58rem; color: #f0c98a; }
.aa-slot:hover { box-shadow: inset 0 0 0 1px var(--aa-gold); background: rgba(243, 220, 158, .08); color: var(--aa-ink); }
.aa-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.aa-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 16px; border-radius: 999px; text-decoration: none; font-size: .86rem; font-weight: 500; color: var(--aa-ink);
  box-shadow: inset 0 0 0 1px rgba(243, 220, 158, .3); background: rgba(255, 255, 255, .03); transition: box-shadow .2s, background .2s; }
.aa-btn:hover { color: var(--aa-ink); box-shadow: inset 0 0 0 1px var(--aa-gold); background: rgba(243, 220, 158, .08); }
.aa-btn.gold { color: #1a1306; background: linear-gradient(135deg, var(--aa-gold), var(--aa-gold2)); box-shadow: 0 8px 20px -10px rgba(243, 220, 158, .6); font-weight: 600; }
.aa-btn.gold:hover { color: #1a1306; filter: brightness(1.06); }
.aa-btn:focus-visible, .aa-slot:focus-visible, .aa-link:focus-visible { outline: 2px solid var(--aa-gold); outline-offset: 2px; }

/* chips + input */
.aa-chips { display: flex; gap: 6px; padding: 8px 16px 4px; overflow-x: auto; scrollbar-width: none; flex: none; mask-image: linear-gradient(90deg, #000 88%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); }
.aa-chips::-webkit-scrollbar { display: none; }
.aa-chips:empty { display: none; }
.aa-chip { flex: none; min-height: 36px; padding: 0 13px; border-radius: 999px; border: 1px solid var(--aa-line); background: rgba(255, 255, 255, .03); color: var(--aa-ink); font-size: .8rem; white-space: nowrap; cursor: pointer; transition: border-color .2s, background .2s; }
.aa-chip:hover { border-color: var(--aa-gold); background: rgba(243, 220, 158, .08); }
.aa-form { display: flex; align-items: center; gap: 8px; margin: 8px 12px 6px; padding: 6px 6px 6px 16px; border-radius: 999px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--aa-line); flex: none; }
.aa-form:focus-within { box-shadow: inset 0 0 0 1px rgba(243, 220, 158, .55), 0 0 0 4px rgba(243, 220, 158, .08); }
.aa-in { flex: 1; min-width: 0; height: 42px; border: 0; background: transparent; color: var(--aa-ink); font-size: 16px; font-family: inherit; }
.aa-in:focus { outline: none; }
.aa-in::placeholder { color: var(--aa-mut); }
.aa-form .aa-ico { width: 40px; height: 40px; }
.aa-mic.live { color: #1a1306; background: var(--aa-gold); border-color: var(--aa-gold); animation: aa-mic 1.2s ease-in-out infinite; }
@keyframes aa-mic { 50% { box-shadow: 0 0 0 7px rgba(243, 220, 158, .18); } }
.aa-send { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 0; cursor: pointer; color: #1a1306; background: linear-gradient(135deg, var(--aa-gold), var(--aa-gold2)); }
.aa-foot { margin: 0; padding: 2px 18px 12px; font-size: .64rem; color: var(--aa-mut); text-align: center; flex: none; }
.aa-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (prefers-reduced-motion: reduce) {
  .aa-fab::after, .aa-fab-orb .aa-gem, .aa-fab-halo, .aa-gem-spark, .aa-track li.now i, .aa-typing i { animation: none !important; }
  .aa-panel, .aa-scrim, .aa-msg { transition: none !important; animation: none !important; }
}