:root{--interview-bg-primary:var(--bg-dark);--interview-bg-secondary:var(--bg-card);--interview-bg-tertiary:var(--bg-input);--interview-accent-primary:var(--color-primary);--interview-accent-hover:var(--color-primary-hover);--interview-accent-pressed:hsl(var(--hue-primary),75%,50%);--interview-danger:var(--status-error);--interview-danger-hover:#dd3c3c;--interview-success:var(--status-success);--interview-warning:var(--status-warning);--interview-text-primary:var(--text-main);--interview-text-secondary:var(--text-muted);--interview-text-tertiary:var(--text-dim);--control-bar-bg:#ffffffd9;--control-bar-hover:#f0f0f5e6;--control-bar-border:#0000001a;--status-connected:var(--status-success);--status-connecting:var(--status-warning);--status-disconnected:var(--status-error);--status-idle:var(--text-dim);--control-bar-height:72px;--control-button-size:48px;--control-button-gap:12px;--status-dot-size:8px;--z-base:0;--z-control-bar:1200;--z-modal-backdrop:1300;--z-modal:1400;--z-transcript-popup:1800;--duration-fast:.2s;--duration-normal:.3s;--duration-slow:.5s;--ease-default:cubic-bezier(.4,0,.2,1)}.dark{--interview-bg-tertiary:#1f212e;--control-bar-bg:#2d2d30f2;--control-bar-hover:#3e3e42f2;--control-bar-border:#ffffff1a}.interview-fullscreen{background-color:var(--bg-dark);width:100vw;height:100vh;z-index:var(--z-base);background-image:radial-gradient(circle at 15%,#4c1d9526 0%,#0000 50%),radial-gradient(circle at 85% 30%,#0ea5e926 0%,#0000 50%);background-attachment:fixed;position:fixed;inset:0;overflow:hidden}.interview-container{flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:24px;display:flex;position:relative}.interview-avatar-area{justify-content:center;align-items:center;width:100%;max-width:800px;height:100%;max-height:600px;display:flex;position:relative}.control-bar{height:var(--control-bar-height);background:var(--control-bar-bg);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--control-bar-border);justify-content:center;align-items:center;gap:var(--control-button-gap);z-index:var(--z-control-bar);transition:transform var(--duration-normal)var(--ease-default),opacity var(--duration-normal)var(--ease-default);padding:12px 24px;display:flex;position:fixed;bottom:0;left:0;right:0}.control-bar.auto-hide{opacity:0;pointer-events:none;transform:translateY(100%)}.control-bar.auto-hide.show{opacity:1;pointer-events:auto;transform:translateY(0)}.control-bar.always-visible{opacity:1;transform:translateY(0)}.control-btn{width:var(--control-button-size);height:var(--control-button-size);background:var(--control-bar-hover);color:var(--interview-text-primary);cursor:pointer;transition:all var(--duration-fast)var(--ease-default);border:none;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.control-btn:hover{background:var(--interview-bg-tertiary);transform:scale(1.05)}.control-btn:active{transform:scale(.95)}.control-btn:focus-visible{outline:2px solid var(--interview-accent-primary);outline-offset:2px}.control-btn.danger{background:var(--interview-danger)}.control-btn.danger:hover{background:var(--interview-danger-hover);box-shadow:0 0 20px #f24c2766}.control-btn.primary{background:var(--interview-accent-primary)}.control-btn.primary:hover{background:var(--interview-accent-hover);box-shadow:0 0 20px #0e71eb66}.control-btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.control-btn-label{color:var(--interview-text-secondary);white-space:nowrap;opacity:0;transition:opacity var(--duration-fast)var(--ease-default);pointer-events:none;font-size:10px;position:absolute;bottom:-20px;left:50%;transform:translate(-50%)}.control-btn:hover .control-btn-label{opacity:1}.status-indicator{background:var(--control-bar-bg);-webkit-backdrop-filter:blur(16px);color:var(--interview-text-secondary);border:1px solid var(--control-bar-border);z-index:var(--z-control-bar);border-radius:9999px;align-items:center;gap:8px;padding:8px 12px;font-size:12px;display:inline-flex;position:fixed;top:16px;left:16px}.status-dot{width:var(--status-dot-size);height:var(--status-dot-size);border-radius:50%;flex-shrink:0;animation:2s cubic-bezier(.4,0,.6,1) infinite pulse}.status-dot.connected{background:var(--status-connected)}.status-dot.connecting{background:var(--status-connecting)}.status-dot.disconnected{background:var(--status-disconnected)}.status-dot.idle{background:var(--status-idle)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.interview-timer{background:var(--control-bar-bg);-webkit-backdrop-filter:blur(16px);color:var(--interview-text-primary);font-variant-numeric:tabular-nums;border:1px solid var(--control-bar-border);border-radius:9999px;align-items:center;gap:6px;padding:8px 16px;font-size:14px;font-weight:500;display:inline-flex}.interview-timer.warning{border-color:var(--interview-warning);color:var(--interview-warning);background:#ffb02033}.interview-backdrop{background:var(--bg-dark);z-index:-1;position:absolute;inset:0}.interview-backdrop.gradient-subtle{background:radial-gradient(#0e71eb14 0%,#0000 70%)}.glass-morphism{-webkit-backdrop-filter:blur(16px)saturate(180%);background:#2d2d30cc;border:1px solid #ffffff1a;box-shadow:0 20px 25px -5px #0009,0 10px 10px -5px #0006}.waiting-room{background-color:var(--bg-dark);background-image:radial-gradient(circle at 15%,#4c1d9526 0%,#0000 50%),radial-gradient(circle at 85% 30%,#0ea5e926 0%,#0000 50%);background-attachment:fixed;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.waiting-room-card{background:var(--interview-bg-secondary);border:1px solid var(--control-bar-border);border-radius:16px;width:100%;max-width:600px;padding:48px;box-shadow:0 10px 15px -3px #00000080}.waiting-room-title{color:var(--interview-text-primary);text-align:center;margin-bottom:8px;font-size:24px;font-weight:600}.waiting-room-subtitle{color:var(--interview-text-secondary);text-align:center;margin-bottom:32px;font-size:14px}.mic-test-container{background:var(--interview-bg-tertiary);border-radius:12px;flex-direction:column;gap:16px;margin-bottom:24px;padding:24px;display:flex}.audio-level-bar{background:var(--interview-bg-secondary);border-radius:4px;height:8px;position:relative;overflow:hidden}.audio-level-fill{background:linear-gradient(90deg,var(--interview-success)0%,var(--interview-accent-primary)100%);border-radius:4px;height:100%;transition:width .1s ease-out}.loading-spinner{border:3px solid #fff3;border-top-color:var(--interview-accent-primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.loading-dots{gap:4px;display:inline-flex}.loading-dot{background:var(--interview-text-secondary);border-radius:50%;width:8px;height:8px;animation:1.4s ease-in-out infinite bounce}.loading-dot:first-child{animation-delay:-.32s}.loading-dot:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{opacity:.5;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.interview-modal-backdrop{-webkit-backdrop-filter:blur(4px);z-index:var(--z-modal-backdrop);animation:fadeIn var(--duration-normal)var(--ease-default);background:#000000b3;position:fixed;inset:0}.interview-modal{background:var(--interview-bg-secondary);border:1px solid var(--control-bar-border);width:90%;max-width:480px;z-index:var(--z-modal);animation:slideUp var(--duration-normal)var(--ease-default);border-radius:12px;padding:24px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 20px 25px -5px #0009}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,-40%)}to{opacity:1;transform:translate(-50%,-50%)}}@media (max-width:767px){.hide-mobile{display:none!important}}@media (min-width:768px){.hide-desktop{display:none!important}}@media (max-width:640px){.control-bar{gap:8px;padding:8px 12px}.control-btn{width:40px;height:40px}.control-btn-label{display:none}}.focus-visible:focus-visible{outline:2px solid var(--interview-accent-primary);outline-offset:2px}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transition-all{transition:all var(--duration-normal)var(--ease-default)}.transition-colors{transition:color,background-color,border-color var(--duration-fast)var(--ease-default)}.transition-opacity{transition:opacity var(--duration-normal)var(--ease-default)}.transition-transform{transition:transform var(--duration-normal)var(--ease-default)}.fade-in{animation:fadeIn var(--duration-normal)var(--ease-default)}.fade-out{animation:fadeOut var(--duration-normal)var(--ease-default)}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.no-select{-webkit-user-select:none;user-select:none}.smooth-scroll{scroll-behavior:smooth}.visually-hidden{clip:rect(0,0,0,0)!important;white-space:nowrap!important;border-width:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}@keyframes music-bar{0%,to{height:4px}50%{height:12px}}.animate-music-bar-1{animation:.6s ease-in-out infinite music-bar}.animate-music-bar-2{animation:.6s ease-in-out .2s infinite music-bar}.animate-music-bar-3{animation:.6s ease-in-out .4s infinite music-bar}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.animate-breathe{animation:4s ease-in-out infinite breathe}
