/* ─── Hermes Portal CSS ─── */
#hermes-bubble {
  position: fixed; bottom: 20px; right: 20px; z-index: 99999;
  display: flex; align-items: center; gap: 8px;
  padding: 10px 18px; background: #fff;
  border: 1px solid #eaeaea; border-radius: 999px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  cursor: pointer; font-size: 12px; color: #666;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  transition: all 0.2s ease; user-select: none;
}
#hermes-bubble:hover { border-color: #8B7355; transform: translateY(-1px); box-shadow: 0 6px 24px rgba(139,115,85,0.15); }
#hermes-bubble svg { flex-shrink: 0; color: #8B7355; }
#hermes-bubble .hkbd { font-size:9px;padding:1px 5px;border:1px solid #eaeaea;border-radius:3px;color:#999;margin-left:4px;font-family:inherit; }

#hermes-panel {
  display: none; position: fixed; bottom: 76px; right: 20px;
  width: 400px; max-height: 60vh; z-index: 99999;
  background: #fff; border: 1px solid #eaeaea; border-radius: 12px;
  box-shadow: 0 16px 64px rgba(0,0,0,0.12);
  flex-direction: column; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  animation: hFadeIn 0.2s ease;
}
#hermes-panel.open { display: flex; }
@keyframes hFadeIn { from { opacity:0; transform:scale(0.96) translateY(8px); } to { opacity:1; transform:scale(1) translateY(0); } }

.hp-header { display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #eaeaea;flex-shrink:0; }
.hp-header-left { display:flex;align-items:center;gap:6px; }
.hp-header-left svg { color:#8B7355; }
.hp-header-left span { font-size:12px;font-weight:500;color:#111; }
.hp-tabs { display:flex;gap:2px;padding:0 16px;border-bottom:1px solid #eaeaea;flex-shrink:0; }
.hp-tab { padding:6px 10px;border:none;background:none;font-size:10px;cursor:pointer;color:#999;font-family:inherit;border-bottom:2px solid transparent;transition:all 0.15s; }
.hp-tab:hover { color:#666; }
.hp-tab.active { color:#8B7355;border-bottom-color:#8B7355; }
.hp-msgs { flex:1;overflow-y:auto;padding:12px 16px;display:flex;flex-direction:column;gap:8px;min-height:0; }
.hp-msg { display:flex;gap:6px;align-items:flex-start; }
.hp-msg-user { flex-direction:row-reverse; }
.hp-avatar { width:24px;height:24px;border-radius:999px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:10px; }
.hp-avatar-user { background:#f0f0f0;color:#666; }
.hp-avatar-ai { background:rgba(139,115,85,0.1);color:#8B7355; }
.hp-bubble { flex:1;min-width:0;padding:6px 10px;border-radius:8px;font-size:11px;color:#444;line-height:1.5; }
.hp-bubble-user { background:#f5f5f5; }
.hp-bubble-ai { background:#fafafa; }
.hp-action { display:inline-block;padding:2px 8px;border:1px solid #8B7355;border-radius:4px;font-size:9px;cursor:pointer;color:#8B7355;margin-top:4px;transition:background 0.15s; }
.hp-action:hover { background:rgba(139,115,85,0.08); }
.hp-chips { display:flex;flex-wrap:wrap;gap:4px;padding:0 16px 8px; }
.hp-chip { padding:3px 10px;border:1px solid #eaeaea;border-radius:999px;background:#f5f5f5;font-size:10px;cursor:pointer;color:#666;font-family:inherit;white-space:nowrap;transition:all 0.15s; }
.hp-chip:hover { border-color:#8B7355;background:rgba(139,115,85,0.08);color:#8B7355; }
.hp-input-row { display:flex;gap:8px;padding:10px 16px;border-top:1px solid #eaeaea;flex-shrink:0; }
.hp-input-row input { flex:1;padding:8px 10px;border:1px solid #eaeaea;border-radius:6px;font-size:11px;background:#f5f5f5;outline:none;color:#111;font-family:inherit; }
.hp-input-row input:focus { border-color:#8B7355; }
.hp-input-row button { padding:8px 14px;background:#111;color:#fff;border:none;border-radius:6px;font-size:11px;cursor:pointer;font-family:inherit;font-weight:500;flex-shrink:0;transition:opacity 0.15s; }
.hp-input-row button:hover { opacity:0.85; }

#hermes-palette {
  display: none; position: fixed; inset: 0; z-index: 999999;
  background: rgba(0,0,0,0.4); backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  align-items: flex-start; justify-content: center;
  padding: 10vh 1rem 1rem; animation: hFadeIn 0.15s ease;
}
#hermes-palette.open { display: flex; }
.hp-palette-box { background:#fff;border:1px solid #eaeaea;border-radius:12px;width:100%;max-width:520px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(0,0,0,0.15); }
.hp-palette-search { display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid #eaeaea; }
.hp-palette-search .hkbd { font-size:10px;padding:2px 6px;border:1px solid #eaeaea;border-radius:4px;color:#999;font-family:inherit; }
.hp-palette-search input { flex:1;border:none;background:none;font-size:13px;outline:none;color:#111;font-family:inherit; }
.hp-palette-search .esc { font-size:10px;color:#999;font-family:inherit; }
.hp-palette-results { flex:1;overflow-y:auto;padding:4px 0; }
.hp-palette-item { display:flex;align-items:center;gap:8px;padding:8px 16px;cursor:pointer;font-size:12px;color:#666;transition:background 0.1s; }
.hp-palette-item:hover { background:#f5f5f5; }

/* Mobile */
@media (max-width: 768px) {
  #hermes-panel { width: 90vw; right: 5vw; bottom: 72px; }
  #hermes-bubble { bottom: 12px; right: 12px; }
}
@media (max-width: 480px) {
  #hermes-panel { width: 96vw; right: 2vw; bottom: 68px; border-radius: 12px 12px 0 0; max-height: 70vh; }
  #hermes-bubble { bottom: 8px; right: 8px; padding: 8px 14px; font-size: 11px; }
  #hermes-palette { padding: 5vh 0.5rem 0.5rem; }
}

.hp-sess-btn { background:none;border:none;cursor:pointer;color:#999;padding:2px 6px;font-size:13px;border-radius:4px;transition:all 0.15s;line-height:1; }
.hp-sess-btn:hover { background:rgba(139,115,85,0.08);color:#8B7355; }

@keyframes hDot { 0%,80%,100% { opacity:0.3; } 40% { opacity:1; } }