.composer {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.speech-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 52px; padding: 0 16px; border: 1px solid rgba(18,59,103,.12); border-radius: 15px; background: rgba(255,255,255,.78); color: #123b67; font: inherit; font-weight: 800; cursor: pointer; }
.speech-toggle[aria-pressed="true"] { background: #d9edff; border-color: #68a9e6; box-shadow: inset 0 0 0 1px rgba(28,100,181,.12); }
.speech-toggle span:first-child { font-size: 1.2rem; }
.quick-actions-toggle { display: inline-grid; place-items: center; flex: 0 0 52px; width: 52px; min-height: 52px; padding: 0; border: 1px solid rgba(18,59,103,.12); border-radius: 15px; background: rgba(255,255,255,.78); color: #123b67; font: inherit; font-size: 1.25rem; cursor: pointer; }
.quick-actions-toggle:hover { background: #eaf4ff; }

.assistant-card {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 190px);
  height: calc(100dvh - 190px);
  min-height: 360px;
}

.messages {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
}

.message.loading { display: flex; align-items: center; gap: 10px; }
.message.loading::before { content: ""; flex: 0 0 auto; width: 15px; height: 15px; border: 2px solid #bfd3e8; border-top-color: #1c64b5; border-radius: 50%; animation: assistant-spin .8s linear infinite; }
.message.loading::after { content: "..."; width: 1.2em; overflow: hidden; animation: assistant-dots 1.2s steps(4, end) infinite; }
.message.external-link a { color: #145ca8; font-weight: 750; overflow-wrap: anywhere; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.external-link-introduction { margin-bottom: 10px; }
.message.assistant p { margin: 0 0 10px; }
.message.assistant p:last-child { margin-bottom: 0; }
.message-delete { display: block; margin: 12px 0 0 auto; padding: 7px 10px; border: 1px solid #d9e1eb; border-radius: 9px; background: #fff; color: #8a2d2d; font: inherit; font-size: .78rem; font-weight: 750; cursor: pointer; }
.message-delete:hover { background: #fff3f3; border-color: #e4bcbc; }
.message.assistant ul, .message.assistant ol { margin: 6px 0 12px; padding-left: 24px; }
.assistant-heading { display: block; margin: 12px 0 7px; color: #123b67; font-size: 1.06em; }
.assistant-heading:first-child { margin-top: 0; }
.assistant-table-wrap { width: 100%; margin: 12px 0; overflow-x: auto; border: 1px solid #d9e1eb; border-radius: 12px; background: #fff; }
.assistant-table { width: 100%; min-width: 480px; border-collapse: collapse; box-shadow: none; }
.assistant-table th, .assistant-table td { padding: 9px 11px; border: 0; border-bottom: 1px solid #e5ebf2; text-align: left; font-size: .92rem; }
.assistant-table th { background: #eaf4ff; color: #123b67; }
.table-download { display: block; margin: 10px 10px 10px auto; padding: 8px 12px; border: 1px solid #bdd2e9; border-radius: 9px; background: #f4f9ff; color: #145ca8; font: inherit; font-size: .82rem; font-weight: 750; cursor: pointer; }
.table-download:hover { background: #e8f3ff; border-color: #8eb6dd; }
.table-download:disabled { cursor: wait; opacity: .65; }
.message.has-chart { width: min(100%, 820px); max-width: 96%; }
.assistant-chart { margin-top: 15px; padding: 13px; border: 1px solid #d9e1eb; border-radius: 16px; background: #fff; }
.chart-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; color: #123b67; }
.chart-expand, .chart-close { border: 0; border-radius: 10px; padding: 8px 12px; background: #eaf4ff; color: #123b67; font: inherit; font-weight: 750; cursor: pointer; }
.chart-visual svg { display: block; width: 100%; height: auto; min-height: 230px; }
.chart-grid { stroke: #dfe6ee; stroke-width: 1; }
.chart-axis, .chart-label, .chart-pie-label { fill: #526277; font: 12px Arial, sans-serif; }
.chart-empty { fill: #627188; font: 16px Arial, sans-serif; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: center; font-size: .82rem; color: #526277; }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; }
.chart-legend i { width: 11px; height: 11px; border-radius: 3px; }
.chart-dialog { width: min(1000px, 94vw); border: 0; border-radius: 22px; padding: 22px; box-shadow: 0 24px 80px rgba(0,0,0,.3); }
.chart-dialog::backdrop { background: rgba(8,25,45,.68); }
.chart-dialog h2 { color: #123b67; }
.chart-dialog .chart-close { float: right; }
@keyframes assistant-spin { to { transform: rotate(360deg); } }
@keyframes assistant-dots { 0% { width: 0; } 100% { width: 1.2em; } }

.modal-open { overflow: hidden; }
.quick-actions-modal[hidden] { display: none; }
.quick-actions-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; background: rgba(9,28,50,.58); backdrop-filter: blur(5px); }
.quick-actions-card { width: min(520px,100%); padding: 26px; border-radius: 26px; background: #fff; box-shadow: 0 24px 70px rgba(5,25,50,.3); }
.quick-actions-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.quick-actions-header h2 { margin: 4px 0 0; color: #123b67; }
.quick-actions-header>button { width: 42px; height: 42px; flex: 0 0 auto; border: 0; border-radius: 12px; background: #eef4fa; color: #123b67; font: inherit; font-size: 1.6rem; font-weight: 700; line-height: 1; cursor: pointer; }
.quick-actions-card>p { margin: 12px 0 20px; color: #627188; }
.quick-actions-list { display: grid; gap: 12px; }
.quick-actions-list>button { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 12px; width: 100%; padding: 15px; border: 1px solid #d9e1eb; border-radius: 16px; background: #fff; color: #122033; text-align: left; font: inherit; cursor: pointer; }
.quick-actions-list>button:hover { border-color: #76a9dc; background: #f5faff; }
.quick-actions-list>button>span:first-child { font-size: 1.6rem; text-align: center; }
.quick-actions-list strong,.quick-actions-list small { display: block; }
.quick-actions-list small { margin-top: 4px; color: #627188; line-height: 1.35; }
.voice-modal[hidden] { display: none; }
.voice-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 20px; background: rgba(9, 28, 50, .58); backdrop-filter: blur(5px); }
.voice-modal-card { width: min(390px, 100%); padding: 32px 24px 24px; border-radius: 28px; background: #fff; text-align: center; box-shadow: 0 24px 70px rgba(5, 25, 50, .3); }
.voice-listening { position: relative; display: grid; place-items: center; width: 150px; height: 150px; margin: 0 auto 18px; }
.voice-modal-icon { position: relative; z-index: 2; display: grid; place-items: center; width: 94px; height: 94px; border-radius: 50%; background: #1c64b5; font-size: 3rem; box-shadow: 0 12px 30px rgba(28, 100, 181, .35); }
.voice-ring { position: absolute; width: 104px; height: 104px; border: 3px solid rgba(28, 100, 181, .38); border-radius: 50%; animation: voice-pulse 1.8s ease-out infinite; }
.voice-ring-delay { animation-delay: .9s; }
.voice-modal-card h2 { margin-bottom: 8px; }
.voice-modal-card p { min-height: 44px; margin: 0 0 22px; color: #627188; }
.voice-modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.voice-modal-actions button { min-height: 50px; border-radius: 14px; font: inherit; font-weight: 800; cursor: pointer; }
.voice-cancel { border: 1px solid #d9e1eb; background: #fff; color: #123b67; }
.voice-modal.processing .voice-listening, .voice-modal.processing h2, .voice-modal.processing .voice-modal-actions { display: none; }
.voice-modal.processing .voice-modal-card { display: grid; min-height: 210px; place-items: center; align-content: center; }
.voice-modal.processing #voice-modal-status { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 0; margin: 0; color: #123b67; font-weight: 750; }
.voice-modal.processing #voice-modal-status::before { content: ""; width: 20px; height: 20px; flex: 0 0 auto; border: 3px solid #c9ddf1; border-top-color: #1c64b5; border-radius: 50%; animation: assistant-spin .8s linear infinite; }
@keyframes voice-pulse { 0% { transform: scale(.82); opacity: .9; } 100% { transform: scale(1.42); opacity: 0; } }

@media (max-width: 600px) {
  .speech-toggle { width: 52px; padding: 0; }
  .speech-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .composer {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 6px;
  }

  .send {
    grid-column: auto;
    height: 48px;
    padding-inline: 12px;
  }

  .mic { width: 44px; height: 48px; }
  .assistant-card { height: calc(100dvh - 170px); min-height: 320px; padding: 16px 12px 12px; }
  .composer { margin-top: 8px; padding-top: 8px; }
  .hint { margin-top: 4px; }
  .voice-modal-card { padding: 26px 18px 18px; }
  .quick-actions-card { padding: 20px 16px; }
  .message.has-chart { max-width: 100%; }
  .assistant-chart { padding: 8px; }
  .chart-visual svg { min-height: 190px; }
}
.camera-live{display:grid;gap:.75rem;margin-top:.8rem;padding:.75rem;border-radius:14px;background:#071829;color:#fff}.camera-live img{display:block;width:100%;max-height:70vh;object-fit:contain;background:#000;border-radius:10px;aspect-ratio:16/9}.camera-live img[hidden]{display:none}.camera-live-placeholder{display:grid;min-height:120px;margin:0;padding:1rem;place-items:center;text-align:center;border-radius:10px;background:#0d253a;color:#d8e8f7}.camera-live-placeholder[hidden]{display:none}.camera-live-actions{display:flex;gap:.6rem;flex-wrap:wrap}.camera-live-actions button{min-height:42px}.camera-live:fullscreen{padding:0;background:#000;place-content:center}.camera-live:fullscreen img{width:100vw;height:100vh;max-height:none;border-radius:0}.camera-live:fullscreen .camera-live-actions{position:fixed;right:1rem;top:1rem;z-index:2}.camera-live:fullscreen .camera-live-status{display:none}.camera-live-status{margin:0;color:#d8e8f7}
.camera-snapshot{display:grid;gap:.45rem;margin:.8rem 0 0}.camera-snapshot img{display:block;width:100%;max-height:70vh;object-fit:contain;border-radius:12px;background:#071829}.camera-snapshot figcaption{font-size:.86rem;color:#60758a}
