body{font-family:Manrope,system-ui,-apple-system,sans-serif;margin:0;padding:0;background:url("data:image/svg+xml,%3csvg%20width='1440'%20height='900'%20viewBox='0%200%201440%20900'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_8150_59)'%3e%3cg%20clip-path='url(%23clip1_8150_59)'%3e%3crect%20width='1440'%20height='900'%20fill='black'/%3e%3c/g%3e%3cg%20filter='url(%23filter0_f_8150_59)'%3e%3ccircle%20cx='262'%20cy='301'%20r='280'%20fill='%231E41EB'/%3e%3c/g%3e%3cg%20filter='url(%23filter1_f_8150_59)'%3e%3ccircle%20cx='1383'%20cy='261'%20r='280'%20fill='%23795DED'/%3e%3c/g%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_f_8150_59'%20x='-1018'%20y='-979'%20width='2560'%20height='2560'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='500'%20result='effect1_foregroundBlur_8150_59'/%3e%3c/filter%3e%3cfilter%20id='filter1_f_8150_59'%20x='103'%20y='-1019'%20width='2560'%20height='2560'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='BackgroundImageFix'%20result='shape'/%3e%3cfeGaussianBlur%20stdDeviation='500'%20result='effect1_foregroundBlur_8150_59'/%3e%3c/filter%3e%3cclipPath%20id='clip0_8150_59'%3e%3crect%20width='1440'%20height='900'%20fill='white'/%3e%3c/clipPath%3e%3cclipPath%20id='clip1_8150_59'%3e%3crect%20width='1440'%20height='900'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e") no-repeat center center fixed;background-size:cover;line-height:1.6;min-height:100vh;width:100vw;overflow-x:hidden;box-sizing:border-box;display:flex;align-items:flex-start;justify-content:center}.container{max-width:1000px;margin:0 auto;padding:20px;position:relative;display:flex;flex-direction:column;min-height:80vh;width:100%;box-sizing:border-box;justify-content:flex-start}header{display:none;align-items:center;margin-bottom:30px;position:relative}.back-button{position:absolute;left:0;top:50%;transform:translateY(-50%);color:#f8fafc;font-size:20px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:#1e293b80;border-radius:50%;text-decoration:none;transition:all .3s ease;box-shadow:0 4px 12px #00000026}.back-button:hover{background-color:#3b82f64d;transform:translateY(-50%) scale(1.05)}.logo-container{display:flex;justify-content:center;width:100%;padding:20px 0}.sagan-logo{height:50px;max-width:200px}.demo-description{text-align:center;margin-bottom:30px;max-width:800px;margin-left:auto;margin-right:auto;border-radius:12px;padding:15px 20px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.demo-description p{margin:0;color:#f8fafc;font-size:16px;line-height:1.6;opacity:.9}.demo-description .header{display:none;font-size:20px}#interview-controls{border-radius:16px;padding:30px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;align-self:center;z-index:10;transition:all .3s ease}.button-container{display:flex;gap:15px;margin-top:10px;justify-content:center}button{cursor:pointer;font-size:14px;border-radius:0;transition:all .2s ease;padding:18px 20px;letter-spacing:2.56px;border:none;position:relative;background-clip:padding-box;z-index:1;border:1px solid white!important}#toggle-interview{position:relative;background-clip:padding-box;z-index:1;border:3px solid white!important}#toggle-interview:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;z-index:-1;background:linear-gradient(45deg,#3b82f6,#8b5cf6,#8b5cf6,#3b82f6);background-size:400% 400%;animation:gradientBorder 6s ease infinite}#toggle-interview-below{position:relative;background-clip:padding-box;z-index:1}@keyframes gradientBorder{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.primary-button{background:transparent;color:#fff;white-space:nowrap;min-width:180px}.primary-button:hover{background:#232749}.primary-button:disabled{background:#3c3c3c;cursor:not-allowed;transform:none}.secondary-button{background:#ea4970cc;color:#fff;white-space:nowrap;min-width:180px}.secondary-button:hover{background:#e76f8b}.secondary-button:disabled{background:#3c3c3c;cursor:not-allowed;transform:none}#interview-panel{margin-top:20px;transition:all .3s ease;display:flex;flex-direction:column;gap:20px;margin-bottom:30px;flex:1;opacity:1;visibility:visible}#controls-below-transcript{margin-top:20px;display:flex;justify-content:center;gap:15px;padding:15px}.download-btn-container{margin-bottom:16px;padding:0 16px;width:100%;box-sizing:border-box}#interview-panel.hidden{opacity:0;visibility:hidden;height:0;margin:0;overflow:hidden}.centered-controls{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.top-controls{position:static;margin-bottom:20px;transform:none;align-self:flex-start;width:100%}#chat-container{box-shadow:0 8px 32px #0003;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid transparent;border-image:linear-gradient(110.72deg,#795ded3d 1.21%,#1e41eb66);border-image-slice:1;overflow:hidden;display:flex;flex-direction:column;height:400px;max-height:400px;flex:1}#chat-header{background:linear-gradient(110.72deg,#795ded3d 1.21%,#1e41eb66);display:flex;justify-content:space-between;align-items:center;padding:15px 20px;border-bottom:1px solid transparent;border-image:linear-gradient(110.72deg,#795ded3d 1.21%,#1e41eb66);border-image-slice:1}#chat-header h3{margin:0;color:#f8fafc;font-weight:500;letter-spacing:2.56px}#chat-text{flex:1;overflow-y:auto;padding:15px;display:flex;flex-direction:column;background-color:transparent;scroll-behavior:smooth;max-height:100%;height:100%}.message-row{display:flex;margin:16px 0;align-items:flex-start;position:relative}.user-row{flex-direction:row-reverse}.avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin:0 12px;overflow:hidden}.user-avatar{background-image:url("data:image/svg+xml,%3csvg%20width='150'%20height='150'%20viewBox='0%200%20150%20150'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3ccircle%20cx='75'%20cy='75'%20r='74'%20fill='%231E41EB'%20stroke='none'/%3e%3cg%20clip-path='url(%23clip0_8555_4782)'%3e%3cpath%20d='M75.5%2072.9131C86.8676%2072.9131%2096.083%2063.7263%2096.083%2052.3938C96.083%2041.0613%2086.8676%2031.8745%2075.5%2031.8745C64.1323%2031.8745%2054.917%2041.0613%2054.917%2052.3938C54.917%2063.7263%2064.1323%2072.9131%2075.5%2072.9131Z'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M71.5384%2073.6629H79.4357C95.8068%2073.6629%20109.094%2086.9092%20109.094%20103.23V118.126H41.8799V103.23C41.8799%2086.9092%2055.1673%2073.6629%2071.5384%2073.6629Z'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_8555_4782'%3e%3crect%20width='71'%20height='90'%20fill='white'%20transform='translate(40%2030)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");background-size:contain;background-position:center;background-repeat:no-repeat;border-radius:50%;overflow:hidden}.bot-avatar{background-image:url("data:image/svg+xml,%3csvg%20width='150'%20height='150'%20viewBox='0%200%20150%20150'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3ccircle%20cx='75'%20cy='75'%20r='74'%20fill='%23795DED'%20stroke='none'/%3e%3cpath%20d='M37.2528%2062.3817C41.2584%2062.3817%2044.5056%2059.1317%2044.5056%2055.1226C44.5056%2051.1135%2041.2584%2047.8635%2037.2528%2047.8635C33.2472%2047.8635%2030%2051.1135%2030%2055.1226C30%2059.1317%2033.2472%2062.3817%2037.2528%2062.3817Z'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M37.2528%2088.6175C41.2584%2088.6175%2044.5056%2085.3675%2044.5056%2081.3584C44.5056%2077.3493%2041.2584%2074.0992%2037.2528%2074.0992C33.2472%2074.0992%2030%2077.3493%2030%2081.3584C30%2085.3675%2033.2472%2088.6175%2037.2528%2088.6175Z'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M44.5059%2081.3583H61.4956'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M55.7842%2032.2592H67.0346V47.0346'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M45.6475%2055.1226H59.7533'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M47.161%2039.5183C51.1666%2039.5183%2054.4138%2036.2682%2054.4138%2032.2591C54.4138%2028.25%2051.1666%2025%2047.161%2025C43.1554%2025%2039.9082%2028.25%2039.9082%2032.2591C39.9082%2036.2682%2043.1554%2039.5183%2047.161%2039.5183Z'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M78.8561%2048.5493H60.0674V81.3583H68.034'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M91.6769%20117.311L93.3045%20124.685H53.043L56.5266%2095.4765L78.8846%2071.6986V35.6029C78.8846%2035.6029%20106.211%2034.8027%20111.865%2060.2954L120.745%2077.2715L111.865%2081.3583V103.936H90.9345C86.9083%20103.936%2083.6246%20100.649%2083.6246%2096.6197V93.9047'%20stroke='white'%20stroke-width='3'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e");background-size:contain;background-position:center;background-repeat:no-repeat;border-radius:50%;overflow:hidden}.user-message{background-color:#19255a;padding:15px;border-radius:18px 4px 18px 18px;line-height:1.5;max-width:75%;position:relative;box-shadow:0 4px 12px #0000001a;color:#f8fafc}.user-message .interim{color:#f8fafcb3;font-style:italic;margin-bottom:5px}.assistant-message{background-color:#1f1450;padding:15px;border-radius:4px 18px 18px;line-height:1.5;max-width:75%;position:relative;box-shadow:0 4px 12px #0000001a;color:#f8fafc}.message-header{font-size:12px;color:#f8fafcb3;font-weight:600;margin-bottom:5px}.user-message .message-header{color:#1e41eb}.assistant-message .message-header{color:#795ded}.message-content{margin-bottom:15px;word-wrap:break-word}.user-message,.assistant-message{position:relative;padding-bottom:20px}.timestamp{position:absolute;bottom:2px;font-size:10px;color:#f8fafc80;padding:2px 5px;opacity:.8}.user-message .timestamp{right:8px}.assistant-message .timestamp{left:8px}#audio-visualizer-container{display:none;justify-content:center;margin:20px 0}#audio-visualizer{width:140px;height:140px;display:flex;justify-content:center;align-items:center;transition:all .3s ease;background-color:#0f172a66;border-radius:50%;padding:10px;box-shadow:0 8px 32px #0003;border:1px solid rgba(255,255,255,.1)}#audio-visualizer.active .circle{animation-play-state:running;opacity:.6}#audio-visualizer:not(.active) .circle{animation-play-state:paused;opacity:.3}.circle-container{position:relative;width:120px;height:120px;display:flex;justify-content:center;align-items:center}.circle{position:absolute;border-radius:50%;background-color:#3b82f6;top:50%;left:50%;transform:translate(-50%,-50%);transition:width .1s ease,height .1s ease,opacity .1s ease;box-shadow:0 0 15px #3b82f680}.circle-1{width:40px;height:40px}.circle-2{width:60px;height:60px}.circle-3{width:80px;height:80px}#audio-visualizer:not(.active) .circle{animation:none}#audio-visualizer.active .circle:not([style]){animation:pulse-circle 1.5s infinite ease-in-out}#audio-visualizer.active .circle-2:not([style]){animation-delay:.3s}#audio-visualizer.active .circle-3:not([style]){animation-delay:.6s}.mic-icon{position:absolute;z-index:10;color:#f8fafc;display:flex;justify-content:center;align-items:center;width:40px;height:40px;background-color:#3b82f6;border-radius:50%;box-shadow:0 0 15px #3b82f680}.mic-icon svg{width:20px;height:20px}#audio-visualizer.active .mic-icon{color:#fff;background-color:#2563eb}@keyframes pulse-circle{0%{transform:translate(-50%,-50%) scale(.8);opacity:.3}50%{transform:translate(-50%,-50%) scale(1);opacity:.5}to{transform:translate(-50%,-50%) scale(.8);opacity:.3}}#loader-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:9999;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}#loader-overlay.active{opacity:1;visibility:visible}#loader-overlay p{color:#f8fafc}.loader-note{font-size:14px;color:#f8fafc;opacity:.8;margin-top:5px;text-align:center}.loader{border:5px solid #f3f3f3;border-top:5px solid #2563eb;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin-bottom:20px}#lottie-container{width:150px;height:150px;margin-bottom:20px;display:flex;justify-content:center;align-items:center;position:relative;background-color:transparent}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.typing-cursor{display:inline-block;width:2px;height:16px;background-color:#f8fafc;margin-left:2px;animation:blink 1s infinite;vertical-align:middle}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}#user-transcription,#bot-transcription{display:none}@media (max-width: 900px){.container{max-width:100vw;padding:8px}#chat-container{padding:4px}.user-message,.assistant-message{max-width:98%;font-size:15px}.button-container{flex-direction:column;gap:10px;width:100%;align-items:stretch}}@media (max-width: 600px){body{align-items:flex-start;width:100vw;overflow-x:hidden}.container{min-width:0;max-width:100vw;width:100vw;overflow-x:hidden;padding:4px}header{flex-direction:column;gap:10px;margin-bottom:10px}.logo-container{padding:10px 0}.sagan-logo{height:38px;max-width:120px}.demo-description{padding:8px 4px;font-size:14px}#interview-controls{padding:12px 4px;gap:16px}#interview-panel{min-height:40vh;max-height:70vh;height:auto;box-sizing:border-box;display:flex;flex-direction:column;gap:10px}#chat-container{height:auto;padding:4px;box-sizing:border-box;overflow-y:auto}.message-row{display:flex;gap:4px;width:100%}.user-message{align-self:flex-end;margin-left:auto;margin-right:0;background-color:#232749;border-radius:18px 4px 18px 18px}.assistant-message{align-self:flex-start;margin-right:auto;margin-left:0;background-color:#1f1450;border-radius:4px 18px 18px}.user-message,.assistant-message{font-size:13px;max-width:95vw;padding:7px 10px;word-break:break-word;box-sizing:border-box}.button-container{flex-direction:column;gap:8px;width:100%;align-items:stretch}button,.primary-button,.secondary-button{font-size:13px;padding:12px 8px;min-width:0}#audio-visualizer{width:80px;height:80px;padding:4px}.circle-container{width:60px;height:60px}.circle-1{width:20px;height:20px}.circle-2{width:32px;height:32px}.circle-3{width:44px;height:44px}.mic-icon{width:20px;height:20px}.mic-icon svg{width:14px;height:14px}#loader-overlay{padding:8px}#lottie-container{width:80px;height:80px}.slider-popup-container{width:98vw;min-width:0;padding:8px 2px;font-size:14px}}@media (max-width: 480px){.container{padding:2px}.demo-description{font-size:12px;padding:4px 2px}#chat-container{padding:2px}.user-message,.assistant-message{font-size:11px;padding:5px 4px;max-width:100%}.button-container{gap:6px}button,.primary-button,.secondary-button{font-size:11px;padding:8px 4px}.user-avatar,.bot-avatar{width:28px;height:28px}.slider-popup-container{font-size:12px;padding:4px 1px;width:100vw}#lottie-container{width:48px;height:48px}}.slider-popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0f172a4d;display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;pointer-events:auto}.slider-popup-overlay.active{opacity:1;visibility:visible}.slider-popup-container{background-color:#1e293be6;border-radius:16px;box-shadow:0 8px 32px #0003;border:1px solid rgba(255,255,255,.1);padding:20px;max-width:90%;width:500px;color:#f8fafc}.slider-title{text-align:center;font-size:18px;font-weight:600;color:#f8fafc;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.slider-container{margin:10px 0;position:relative;padding:0 5px}.slider-labels{display:flex;justify-content:space-between;margin-top:15px;width:100%}.slider-label-container{flex:1;display:flex;justify-content:center;position:relative}.slider-label{text-align:center;font-size:13px;color:#f8fafc;opacity:.8;max-width:100px}.slider-track{width:100%;height:8px;background-color:#94a3b84d;border-radius:4px;position:relative}.slider-input{-webkit-appearance:none;width:100%;height:8px;background:transparent;position:absolute;top:0;left:0;margin:0;z-index:2}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;background:#3b82f6;border-radius:50%;cursor:pointer;box-shadow:0 0 10px #3b82f680;border:2px solid #ffffff}.slider-input::-moz-range-thumb{width:30px;height:30px;background:#3b82f6;border-radius:50%;cursor:pointer;box-shadow:0 0 10px #3b82f680;border:2px solid #ffffff}.slider-ticks{display:flex;justify-content:space-between;position:relative;margin-top:5px;padding-top:15px}.slider-tick{width:2px;height:10px;background-color:#94a3b880;position:relative;display:flex;flex-direction:column;align-items:center}.tick-value{position:absolute;top:12px;font-size:12px;color:#f8fafc;opacity:.8;text-align:center;min-width:20px}.slider-value{position:absolute;top:-40px;left:50%;transform:translate(-50%);background-color:#3b82f6;color:#fff;padding:5px 10px;border-radius:5px;font-size:16px;font-weight:600;display:block;box-shadow:0 2px 8px #0003;min-width:20px;text-align:center;z-index:10}.slider-buttons{display:none}.checkbox-popup-container{max-height:80vh;overflow-y:auto}.checkbox-options-container{display:flex;flex-direction:column;gap:12px;margin:20px 0}.checkbox-option{display:flex;align-items:center;padding:10px;background-color:#ffffff0d;border-radius:8px;cursor:pointer;transition:background-color .2s ease}.checkbox-option:hover{background-color:#ffffff1a}.checkbox-option input[type=checkbox]{margin-right:12px;width:20px;height:20px;accent-color:#3b82f6;cursor:pointer}.checkbox-option label{font-size:16px;color:#f8fafc;cursor:pointer;flex:1}.checkbox-submit-container{display:flex;justify-content:center;margin-top:20px}.checkbox-submit-container button{background-color:#3b82f6;color:#fff;border:none;border-radius:8px;padding:10px 20px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .2s ease}.checkbox-submit-container button:hover{background-color:#2563eb}@media (max-width: 768px){.slider-popup-container{width:90%;padding:15px;max-width:none}.slider-input::-webkit-slider-thumb{width:36px;height:36px}.slider-input::-moz-range-thumb{width:36px;height:36px}.slider-label{font-size:12px}.slider-track,.slider-input{height:10px}.tick-value{font-size:11px;min-width:15px}.checkbox-option{padding:12px 8px}.checkbox-option label{font-size:14px}@media (max-width: 400px){.slider-tick:nth-child(2n) .tick-value{opacity:.3;font-size:9px}}}.mic-instructions-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0f172acc;display:flex;justify-content:center;align-items:center;z-index:2000;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.mic-instructions-content{background-color:#1e293b;border-radius:16px;box-shadow:0 8px 32px #0003;border:1px solid rgba(255,255,255,.1);padding:30px;max-width:90%;width:600px;color:#f8fafc;max-height:90vh;overflow-y:auto}.mic-instructions-content h2{color:#f8fafc;margin-top:0;margin-bottom:20px;font-size:24px;text-align:center;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:15px}.mic-instructions-content p{margin-bottom:15px;line-height:1.5}.mic-instructions-content ol{margin-bottom:20px;padding-left:20px}.mic-instructions-content li{margin-bottom:10px;line-height:1.5}.mic-instructions-content strong{color:#60a5fa;font-weight:600}.mic-instructions-buttons{display:flex;justify-content:center;margin-top:25px}.mic-instructions-buttons button{padding:12px 24px;font-size:16px;cursor:pointer;transition:all .3s ease}@media (max-width: 768px){.mic-instructions-content{padding:20px;width:90%}.mic-instructions-content h2{font-size:20px}}
