:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}}#root{width:100%;height:100vh;display:flex;justify-content:center;align-items:center;padding:0;box-sizing:border-box}body{background:radial-gradient(circle at top,#1e1e38,#0c0c14);color:#f3f4f6;font-family:Outfit,Inter,system-ui,-apple-system,sans-serif;margin:0;display:flex;justify-content:center;align-items:center;width:100vw;height:100vh;overflow:hidden;box-sizing:border-box}.main-container{background:#ffffff08;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);border-radius:0;padding:2.5rem 2rem;max-width:650px;width:100%;height:100vh;max-height:100vh;box-shadow:0 20px 40px #0000004d,inset 0 1px #ffffff1a;display:flex;flex-direction:column;gap:1.5rem;box-sizing:border-box}.auth-screen{justify-content:center;align-items:center;text-align:center}.logo{width:150px;height:auto;margin:0 auto;animation:heartbeat 1.8s ease-in-out infinite;transform-origin:center}@keyframes heartbeat{0%,to{transform:scale(1)}14%{transform:scale(1.12)}28%{transform:scale(1)}42%{transform:scale(1.12)}70%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.logo{animation:none}}.header{font-weight:800;background:linear-gradient(135deg,#a5b4fc,#6366f1,#4f46e5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin:0;letter-spacing:-.025em;text-shadow:0 2px 10px rgba(99,102,241,.2);flex-shrink:0;text-align:center}.top-bar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-shrink:0}.top-bar-brand{display:flex;align-items:center;flex:1;gap:.6rem;min-width:0}.top-bar-brand .logo{width:72px;height:72px;margin:0;flex-shrink:0;object-fit:contain}.top-bar-brand .header{flex:1;font-size:2.2rem;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-bar-actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.greeting{margin:0;text-align:center;color:#a5b4fc;font-size:1.5rem;font-weight:500;flex-shrink:0}.status-badge-anchor{position:relative;width:26px;height:26px;flex-shrink:0}.status-badge-anchor .status-badge{position:absolute;top:0;right:0;z-index:10}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:#ffffff08;color:#cbd5e1;cursor:pointer;flex-shrink:0;transition:all .2s ease}.icon-button svg{width:17px;height:17px}.icon-button:hover{color:#f3f4f6;border-color:#6366f166;background:#6366f11a}.icon-button:focus-visible{outline:none;border-color:#6366f199;box-shadow:0 0 0 3px #6366f140}.settings-button{width:44px;height:44px}.settings-button svg{width:24px;height:24px}.settings-overlay{position:fixed;inset:0;background:#05050c99;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:1.5rem;z-index:100;animation:fadeIn .2s ease-out}.settings-panel{width:100%;max-width:400px;max-height:min(600px,90vh);overflow-y:auto;background:#17172b;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:1.5rem;box-shadow:0 20px 40px #0006,inset 0 1px #ffffff14;display:flex;flex-direction:column;gap:1.25rem}.settings-panel-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.settings-panel-title{font-size:1.2rem;font-weight:800;margin:0;background:linear-gradient(135deg,#a5b4fc,#6366f1,#4f46e5);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.settings-panel-body{display:flex;flex-direction:column;gap:1.25rem}.settings-field{display:flex;flex-direction:column;gap:.6rem;width:100%}.settings-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:50px;background:#ffffff1a;outline:none;cursor:pointer}.settings-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#a5b4fc,#6366f1);box-shadow:0 2px 6px #0000004d;cursor:pointer;transition:transform .15s ease}.settings-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.settings-slider::-moz-range-thumb{width:18px;height:18px;border:none;border-radius:50%;background:linear-gradient(135deg,#a5b4fc,#6366f1);box-shadow:0 2px 6px #0000004d;cursor:pointer}.account-label{font-size:.9rem;color:#cbd5e1;padding-left:.5rem;text-align:center}.app-version-footer{margin:0;padding-top:.75rem;border-top:1px solid rgba(255,255,255,.06);text-align:center;font-size:.75rem;color:#cbd5e180}.content-area{flex:1;display:flex;flex-direction:column;gap:1.5rem;overflow-y:auto;padding-right:.5rem;box-sizing:border-box}.content-area::-webkit-scrollbar{width:8px}.content-area::-webkit-scrollbar-track{background:#ffffff05;border-radius:8px}.content-area::-webkit-scrollbar-thumb{background:#6366f14d;border-radius:8px;border:2px solid transparent}.content-area::-webkit-scrollbar-thumb:hover{background:#6366f199}.text-container{width:100%;min-height:80px;background:#0003;border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:1.2rem;box-sizing:border-box;text-align:left;font-size:1.1rem;line-height:1.6;color:#e2e8f0;white-space:pre-wrap;transition:all .3s ease;box-shadow:inset 0 2px 4px #0003;flex-shrink:0}.text-container:hover{border-color:#6366f166;box-shadow:inset 0 2px 4px #0003,0 0 15px #6366f11a}.input-mode-switcher{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;flex-shrink:0;margin-top:auto}.input-mode-content{display:flex;align-items:center;justify-content:center;width:100%;min-height:96px}.toggle-switch{display:flex;align-items:center;justify-content:center;gap:.75rem}.toggle-switch-disabled{opacity:.5;pointer-events:none}.toggle-switch-label{font-size:.85rem;font-weight:600;letter-spacing:.02em;color:#f3f4f666;transition:color .3s ease;-webkit-user-select:none;user-select:none}.toggle-switch-label-active{color:#a5b4fc}.toggle-switch-track{position:relative;display:inline-block;width:52px;height:28px;flex-shrink:0;cursor:pointer}.toggle-switch-input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.toggle-switch-thumb{position:absolute;inset:0;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-radius:50px;transition:background .3s ease,border-color .3s ease}.toggle-switch-thumb:before{content:"";position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#a5b4fc,#6366f1);box-shadow:0 2px 6px #0000004d;transition:transform .3s cubic-bezier(.4,0,.2,1)}.toggle-switch-input:checked+.toggle-switch-thumb{background:#6366f133;border-color:#6366f166}.toggle-switch-input:checked+.toggle-switch-thumb:before{transform:translate(24px)}.toggle-switch-input:focus-visible+.toggle-switch-thumb{box-shadow:0 0 0 3px #6366f166}.button-group{display:flex;align-items:center;gap:1rem;width:100%;justify-content:center;flex-shrink:0}.mic-button{position:relative;width:96px;height:96px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:50%;padding:0;background:linear-gradient(135deg,#34d399,#059669);color:#fff;cursor:pointer;box-shadow:0 10px 30px #05966973,inset 0 1px #ffffff26;transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s ease,background .25s ease;outline:none}.mic-button svg{position:relative;z-index:1;width:40px;height:40px}.mic-button:hover:not(:disabled){transform:scale(1.06);background:linear-gradient(135deg,#6ee7b7,#059669);box-shadow:0 14px 36px #0596698c,0 0 0 10px #10b9811f}.mic-button:active:not(:disabled){transform:scale(.96)}.mic-button:focus-visible{box-shadow:0 10px 30px #05966973,0 0 0 4px #10b98180}.mic-button:disabled{background:#374151;color:#9ca3af;box-shadow:none;cursor:not-allowed}.mic-button.mic-button-recording{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 10px 30px #dc262673,inset 0 1px #ffffff26}.mic-button.mic-button-recording:hover{background:linear-gradient(135deg,#f87171,#dc2626);box-shadow:0 14px 36px #dc26268c,0 0 0 10px #ef44441f}.mic-button.mic-button-recording:focus-visible{box-shadow:0 10px 30px #dc262673,0 0 0 4px #ef444480}.mic-button-pulse{position:absolute;inset:-10px;border-radius:50%;border:2px solid rgba(239,68,68,.5);animation:mic-pulse 1.6s ease-out infinite}@keyframes mic-pulse{0%{transform:scale(.9);opacity:.8}to{transform:scale(1.5);opacity:0}}.reading-control-button{width:72px;height:72px}.reading-control-button svg{width:28px;height:28px}.reading-pause-button{background:linear-gradient(135deg,#fbbf24,#d97706);box-shadow:0 10px 30px #d9770673,inset 0 1px #ffffff26}.reading-pause-button:hover:not(:disabled){background:linear-gradient(135deg,#fcd34d,#d97706);box-shadow:0 14px 36px #d977068c,0 0 0 10px #d977061f}.reading-pause-button:focus-visible{box-shadow:0 10px 30px #d9770673,0 0 0 4px #d9770680}.reading-stop-button{background:linear-gradient(135deg,#ef4444,#dc2626);box-shadow:0 10px 30px #dc262673,inset 0 1px #ffffff26}.reading-stop-button:hover:not(:disabled){background:linear-gradient(135deg,#f87171,#dc2626);box-shadow:0 14px 36px #dc26268c,0 0 0 10px #ef44441f}.reading-stop-button:focus-visible{box-shadow:0 10px 30px #dc262673,0 0 0 4px #ef444480}.button{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;border:none;border-radius:50px;padding:1rem 2.5rem;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 15px #4f46e566;display:flex;align-items:center;gap:.75rem;outline:none}.button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #4f46e580,0 0 15px #6366f14d;background:linear-gradient(135deg,#818cf8,#4f46e5)}.button:active:not(:disabled){transform:translateY(1px)}.logout-button{width:100%;justify-content:center;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;box-shadow:0 4px 14px #dc262659;font-size:1rem;padding:.75rem 1.5rem}.logout-button:hover:not(:disabled){background:linear-gradient(135deg,#f87171,#dc2626);box-shadow:0 6px 18px #dc262680;transform:none}.button:disabled{background:#374151!important;color:#9ca3af!important;cursor:not-allowed;box-shadow:none}.prompt-form{display:flex;gap:.75rem;width:100%;flex-shrink:0;align-items:stretch}.prompt-input{flex:1;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:50px;padding:.9rem 1.5rem;color:#f3f4f6;font-size:1rem;font-family:inherit;outline:none;transition:all .3s ease;box-sizing:border-box}.prompt-input::placeholder{color:#f3f4f666}.prompt-input:hover:not(:disabled),.prompt-input:focus{border-color:#6366f180;background-color:#ffffff14;box-shadow:0 0 15px #6366f11a}.prompt-input:disabled{opacity:.5;cursor:not-allowed}.prompt-send-btn{padding:.9rem 1.75rem;font-size:1rem}.login-form{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:320px}.login-form .prompt-input{border-radius:16px;text-align:left}.login-error{color:#ef4444;font-size:.9rem;text-align:left;padding-left:.5rem}.login-submit-btn{justify-content:center;width:100%}.spinner-wrapper{display:flex;flex-direction:column;align-items:center;gap:.75rem;margin:.5rem 0;flex-shrink:0}.spinner{width:36px;height:36px;border:3px solid rgba(99,102,241,.1);border-radius:50%;border-top-color:#6366f1;animation:spin .8s linear infinite;box-shadow:0 0 10px #6366f133}.loading-text{font-size:.9rem;color:#a5b4fc;font-weight:500;letter-spacing:.05em;animation:pulse 1.5s ease-in-out infinite}.response-wrapper{width:100%;display:flex;flex-direction:column;gap:.5rem;text-align:left;flex:1;min-height:150px}.section-title{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:#818cf8;font-weight:700;padding-left:.5rem;flex-shrink:0}.response-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-shrink:0}.replay-link-button{flex-shrink:0;background:#3b82f61f;color:#93c5fd;border:1px solid rgba(59,130,246,.3);border-radius:50px;padding:.35rem .9rem;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease}.replay-link-button:hover{background:#3b82f638;border-color:#3b82f680;color:#bfdbfe}.replay-link-button:active{background:#3b82f64d}.response-container{width:100%;flex:1;background:#6366f10d;border:1px solid rgba(99,102,241,.15);border-radius:16px;padding:1.5rem;box-sizing:border-box;font-size:1.1rem;line-height:1.6;color:#f1f5f9;white-space:pre-wrap;box-shadow:inset 0 2px 4px #0000001a;animation:fadeIn .4s ease-out;overflow-y:auto}.response-container::-webkit-scrollbar{width:6px}.response-container::-webkit-scrollbar-track{background:transparent}.response-container::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:4px}.response-container::-webkit-scrollbar-thumb:hover{background:#6366f166}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.voice-selector-wrapper{display:flex;flex-direction:column;gap:.5rem;width:100%;text-align:left;margin-top:.5rem;margin-bottom:.5rem;box-sizing:border-box;flex-shrink:0}.voice-label{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:#818cf8;font-weight:700;padding-left:.5rem}.voice-select{width:100%;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:.75rem 2.5rem .75rem 1rem;color:#f3f4f6;font-size:1rem;font-family:inherit;outline:none;cursor:pointer;transition:all .3s ease;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23818cf8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:1.25em}.voice-select:hover,.voice-select:focus{border-color:#6366f180;background-color:#ffffff14;box-shadow:0 0 15px #6366f11a}.voice-select option{background-color:#1e1e38;color:#f3f4f6}.signalr-panel{background:#ffffff05;border:1px solid rgba(255,255,255,.06);border-radius:20px;padding:1.25rem 1.5rem;margin-top:.5rem;display:flex;flex-direction:column;gap:1rem;box-shadow:0 8px 32px #0003;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all .3s ease;animation:fadeIn .5s ease-out}.signalr-panel:hover{border-color:#6366f133;box-shadow:0 10px 35px #00000040,0 0 20px #6366f10d}.signalr-panel-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.04);padding-bottom:.5rem}.signalr-panel-header .section-title{padding-left:0;margin:0}.status-badge{--status-color: #ef4444;--status-bg: #3a1414;--status-border: rgba(239, 68, 68, .4);display:inline-flex;align-items:center;gap:.5rem;height:26px;max-width:26px;padding:0 5px;border-radius:50px;border:1px solid transparent;background:transparent;color:var(--status-color);font-family:inherit;font-size:.8rem;font-weight:600;cursor:pointer;overflow:hidden;white-space:nowrap;flex-shrink:0;outline:none;transition:max-width .3s ease,padding .3s ease,background .3s ease,border-color .3s ease}.status-badge:hover,.status-badge:focus-visible,.status-badge.status-badge-expanded{max-width:160px;padding:0 .75rem;background:var(--status-bg);border-color:var(--status-border)}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--status-color);flex-shrink:0}.status-label{opacity:0;transition:opacity .15s ease}.status-badge:hover .status-label,.status-badge:focus-visible .status-label,.status-badge.status-badge-expanded .status-label{opacity:1;transition-delay:.1s}.status-connected{--status-color: #10b981;--status-bg: #0f2e22;--status-border: rgba(16, 185, 129, .4)}.status-connected .status-dot{box-shadow:0 0 8px #10b981;animation:pulse-green 2s infinite}.status-connecting{--status-color: #f59e0b;--status-bg: #3a2a0d;--status-border: rgba(245, 158, 11, .4)}.status-connecting .status-dot{box-shadow:0 0 8px #f59e0b;animation:pulse-orange 2s infinite}.status-disconnected{--status-color: #ef4444;--status-bg: #3a1414;--status-border: rgba(239, 68, 68, .4)}.status-disconnected .status-dot{box-shadow:0 0 8px #ef4444}.signalr-panel-body{display:flex;align-items:center;justify-content:space-around;gap:1.5rem;padding:.5rem 0}@media(max-width:480px){.signalr-panel-body{flex-direction:column;gap:1.25rem}}.progress-gauge-wrapper{position:relative;width:120px;height:120px;display:flex;justify-content:center;align-items:center;flex-shrink:0}.progress-ring{transform:rotate(-90deg)}.progress-ring__circle{transition:stroke-dashoffset .35s cubic-bezier(.4,0,.2,1)}.progress-ring__value{position:absolute;font-size:1.5rem;font-weight:800;color:#f8fafc;background:linear-gradient(135deg,#f8fafc,#cbd5e1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family:Outfit,sans-serif;letter-spacing:-.02em}.signalr-btn{padding:.75rem 1.75rem!important;font-size:.95rem!important;border-radius:14px!important;background:linear-gradient(135deg,#4f46e5,#6366f1)!important;box-shadow:0 4px 12px #6366f133!important;font-weight:600!important;cursor:pointer;white-space:nowrap}.signalr-btn:hover:not(:disabled){background:linear-gradient(135deg,#6366f1,#818cf8)!important;box-shadow:0 6px 16px #6366f14d!important}.signalr-btn:disabled{background:#ffffff0d!important;color:#fff3!important;border:1px solid rgba(255,255,255,.02)!important;box-shadow:none!important}@keyframes pulse-green{0%{box-shadow:0 0 #10b98166}70%{box-shadow:0 0 0 6px #10b98100}to{box-shadow:0 0 #10b98100}}@keyframes pulse-orange{0%{box-shadow:0 0 #f59e0b66}70%{box-shadow:0 0 0 6px #f59e0b00}to{box-shadow:0 0 #f59e0b00}}.PWABadge{position:fixed;right:0;bottom:0;margin:16px;padding:12px;border-radius:8px;z-index:1;text-align:left;box-shadow:3px 4px 5px #00000026}.PWABadge-toast{background-color:#fff;border:1px solid #8885;border-radius:8px;padding:12px}.PWABadge-message{margin-bottom:8px;color:#1e1e38}.PWABadge-buttons{display:flex;justify-content:flex-end;gap:8px}.PWABadge-toast-button{border:1px solid #8885;outline:none;margin-right:5px;border-radius:2px;padding:3px 10px;cursor:pointer}