:root{color-scheme:light dark;font-family:system-ui,sans-serif}body{margin:0;height:100vh}.chat{display:flex;flex-direction:column;height:100vh;max-width:720px;margin:0 auto;padding:1rem;box-sizing:border-box}.chat-header{display:flex;align-items:center;justify-content:space-between}.chat-account{display:flex;align-items:center;gap:.75rem;font-size:.875rem;opacity:.8}.voice-setting{display:flex;align-items:center;gap:.35rem;cursor:pointer}.auth{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:320px;margin:4rem auto;padding:1rem}.auth-form{display:flex;flex-direction:column;gap:.6rem;width:100%}.auth-form input{padding:.6rem .8rem;border-radius:.5rem;border:1px solid rgba(128,128,128,.4)}.auth-form button{padding:.6rem 1.2rem;border-radius:.5rem;border:none;background:#2563eb;color:#fff;cursor:pointer}.auth-form button:disabled{opacity:.6;cursor:default}.auth-error{color:#dc2626;font-size:.875rem}.auth-toggle{background:none;border:none;color:#2563eb;cursor:pointer;font-size:.875rem}.auth-pending{text-align:center;opacity:.8}.messages{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;padding:.5rem 0}.message{padding:.6rem .9rem;border-radius:.75rem;white-space:pre-wrap;max-width:80%}.message.user{align-self:flex-end;background:#2563eb;color:#fff}.message.assistant{align-self:flex-start;background:#80808033}.composer{display:flex;gap:.5rem;padding-top:.5rem}.composer input{flex:1;padding:.6rem .8rem;border-radius:.5rem;border:1px solid rgba(128,128,128,.4)}.composer button{padding:.6rem 1.2rem;border-radius:.5rem;border:none;background:#2563eb;color:#fff;cursor:pointer}.composer button:disabled{opacity:.6;cursor:default}.mic{background:#80808033;color:inherit}.mic.recording{background:#dc2626;color:#fff;animation:mic-pulse 1.4s ease-in-out infinite}@keyframes mic-pulse{0%,to{opacity:1}50%{opacity:.6}}.thought-bubble{border:1px dashed rgba(128,128,128,.5);border-radius:.75rem;margin-top:.5rem;font-size:.85rem;opacity:.85}.thought-bubble.settled{opacity:.5}.thought-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.4rem .7rem;background:none;border:none;color:inherit;font:inherit;cursor:pointer}.thought-title{display:flex;align-items:baseline;gap:.15rem}.thought-elapsed{font-variant-numeric:tabular-nums;opacity:.7}.thought-dots:after{content:"";animation:thought-dots 1.5s steps(4,end) infinite}@keyframes thought-dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}.thought-stream{max-height:7rem;overflow-y:auto;padding:0 .7rem .5rem;white-space:pre-wrap;opacity:.75;font-size:.8rem;line-height:1.35}@media (prefers-reduced-motion: reduce){.thought-dots:after{animation:none;content:"..."}}.metrics-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:10}.metrics-panel{background:Canvas;color:CanvasText;border-radius:.75rem;padding:1rem 1.25rem;width:min(46rem,100%);max-height:85vh;overflow-y:auto}.metrics-header{display:flex;align-items:center;justify-content:space-between}.metrics-header h2{margin:0}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.5rem;margin:.75rem 0}.metrics-stat{display:flex;flex-direction:column;padding:.5rem .6rem;border-radius:.5rem;background:#80808026}.metrics-stat-value{font-size:1.25rem;font-variant-numeric:tabular-nums}.metrics-stat-label{font-size:.75rem;opacity:.7}.metrics-models{margin:.25rem 0;padding-left:1.1rem;font-size:.9rem}.metrics-idle{font-size:.9rem;opacity:.7}.metrics-error{color:#dc2626;font-size:.9rem}.metrics-table{width:100%;border-collapse:collapse;font-size:.85rem;font-variant-numeric:tabular-nums}.metrics-table th,.metrics-table td{text-align:right;padding:.25rem .4rem;border-bottom:1px solid rgba(128,128,128,.2)}.metrics-table th:first-child,.metrics-table td:first-child{text-align:left}.metrics-table tr.failed td{color:#dc2626}
