:root{color:#22313f;background:#f6f3ec;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}.interview-page{--interview-content-width:980px;background:radial-gradient(circle at 0 0,#578eff38,#0000 34%),linear-gradient(135deg,#f5f7ff 0%,#fff8ef 48%,#effbf4 100%);min-height:100vh;padding:18px}.interview-header{width:min(100%, var(--interview-content-width));max-width:var(--interview-content-width);justify-content:space-between;align-items:center;gap:16px;margin:0 auto 14px;display:flex}.eyebrow{color:#6b7280;text-transform:uppercase;margin:0 0 4px;font-size:13px;font-weight:700}.interview-header h1{color:#1f2937;margin:0;font-size:28px;line-height:1.12}.header-actions{align-items:center;gap:12px;display:flex}.time-pill{color:#374151;background:#ffffffb8;border:1px solid #1f29371f;border-radius:999px;align-items:center;gap:8px;min-height:38px;padding:0 14px;font-weight:700;display:flex}.time-pill span,.status-dot{background:#22c55e;border-radius:999px;width:8px;height:8px}.stop-button{background:#ef4444;border:0;border-radius:999px;width:42px;height:42px;box-shadow:0 10px 24px #ef444447}.stop-button span{background:#fff;border-radius:3px;width:13px;height:13px;margin:auto;display:block}.stop-button:disabled{opacity:.48}.interview-stage-grid{width:min(100%, var(--interview-content-width));max-width:var(--interview-content-width);grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);gap:14px;min-height:400px;margin:0 auto;display:grid}.tutor-stage,.camera-preview{background:#121827;border:1px solid #1f29371a;border-radius:18px;position:relative;overflow:hidden;box-shadow:0 24px 60px #1f293724}.video-shell{height:100%;min-height:400px;position:relative}.tutor-video{object-fit:cover;width:100%;height:100%;min-height:400px;display:block}.speaking-badge{color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff26;border-radius:999px;align-items:center;gap:8px;padding:9px 12px;font-weight:800;display:flex;position:absolute;top:18px;left:18px}.pulse-dot{background:#9ca3af;border-radius:999px;width:9px;height:9px}.pulse-dot.active{background:#34d399;box-shadow:0 0 0 8px #34d39938}.tutor-caption{color:#fff;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#111827a3;border:1px solid #ffffff2e;border-radius:14px;min-height:74px;padding:16px;font-size:17px;line-height:1.45;position:absolute;bottom:18px;left:18px;right:18px}.typing-dots{align-items:center;gap:7px;height:24px;display:inline-flex}.typing-dots i{background:#fff;border-radius:999px;width:8px;height:8px;animation:1s ease-in-out infinite typingDot}.typing-dots i:nth-child(2){animation-delay:.14s}.typing-dots i:nth-child(3){animation-delay:.28s}.camera-preview{background:#101827;min-height:400px}.camera-video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}.camera-shade{pointer-events:none;background:linear-gradient(#0e14210d,#0e142157),linear-gradient(90deg,#00000029,#0000 28% 72%,#0000002e);position:absolute;inset:0}.face-box{position:absolute;transform:scaleX(-1)}.face-box span{color:#fff;white-space:nowrap;background:#10b981eb;border-radius:999px;padding:7px 9px;font-size:12px;font-weight:900;position:absolute;top:-34px;left:10px}.camera-message,.camera-support-message{color:#fff;text-align:center;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#111827bd;border-radius:14px;width:min(320px,100% - 36px);padding:14px 16px;font-weight:800;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.camera-support-message{color:#ffffffe0;font-size:13px;top:auto;bottom:72px}.camera-status{color:#fff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff26;border-radius:999px;align-items:center;gap:8px;padding:10px 12px;font-weight:800;display:flex;position:absolute;bottom:18px;left:18px}.status-dot.live{background:#ef4444;animation:1.2s infinite livePulse}.transcript-panel{width:min(100%, var(--interview-content-width));max-width:var(--interview-content-width);background:#ffffffc7;border:1px solid #1f29371a;border-radius:14px;margin:14px auto 0;padding:14px;box-shadow:0 18px 45px #1f293714}.transcript-panel label{color:#4b5563;margin-bottom:8px;font-weight:800;display:block}.transcript-panel textarea{resize:vertical;color:#1f2937;background:#fff;border:1px solid #1f293724;border-radius:10px;outline:none;width:100%;min-height:94px;padding:12px}.transcript-panel textarea:disabled{color:#6b7280;background:#f3f4f6}.speech-control-wrap{z-index:20;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}.tap-to-speak{color:#fff;background:linear-gradient(145deg,#2f6bff,#7054ff);border:0;border-radius:999px;width:142px;height:142px;box-shadow:0 20px 45px #2f6bff52}.tap-to-speak.listening{background:linear-gradient(145deg,#10b981,#059669)}.tap-to-speak span,.tap-to-speak small{display:block}.tap-to-speak span{font-size:28px;font-weight:900}.tap-to-speak small{margin-top:4px;font-size:14px;font-weight:800}.error-banner{width:min(100%, var(--interview-content-width));max-width:var(--interview-content-width);color:#991b1b;background:#fee2e2;border-radius:10px;margin:14px auto 0;padding:12px 14px}.invalid-link-page{place-items:center;padding:24px;display:grid}.invalid-link-card{text-align:center;background:linear-gradient(#ffffffeb,#ffffffc7),#fff;border:1px solid #7f1d1d1f;border-radius:18px;width:min(520px,100%);padding:34px;box-shadow:0 28px 75px #1f293729}.invalid-link-mark{background:linear-gradient(145deg,#ef4444,#f97316);border-radius:999px;place-items:center;width:72px;height:72px;margin:0 auto 18px;display:grid;box-shadow:0 18px 38px #ef44443d}.invalid-link-mark span{width:30px;height:30px;position:relative}.invalid-link-mark span:before,.invalid-link-mark span:after{content:"";background:#fff;border-radius:999px;width:4px;height:28px;position:absolute;top:1px;left:13px}.invalid-link-mark span:before{transform:rotate(45deg)}.invalid-link-mark span:after{transform:rotate(-45deg)}.invalid-link-card h1{color:#1f2937;margin:0 0 10px;font-size:32px;line-height:1.15}.invalid-link-card p:last-child{color:#4b5563;max-width:420px;margin:0 auto;font-size:17px;font-weight:650;line-height:1.55}.complete-overlay{z-index:50;background:#11182775;place-items:center;display:grid;position:fixed;inset:0}.complete-card{background:#fff;border-radius:18px;width:min(420px,100vw - 32px);padding:24px;box-shadow:0 25px 70px #1118273d}.complete-card h2{margin:0 0 8px}.complete-card p{color:#6b7280;margin:0 0 18px}.complete-card button{color:#fff;background:#2f6bff;border:0;border-radius:10px;min-height:42px;padding:0 18px;font-weight:800}.submitting-overlay{z-index:80;color:#111827;background:#ffffffe6;align-content:center;place-items:center;gap:18px;display:grid;position:fixed;inset:0}.spinner{border:5px solid #2f6bff2e;border-top-color:#2f6bff;border-radius:999px;width:54px;height:54px;animation:.8s linear infinite spin}.submitting-overlay p{margin:0;font-size:22px;font-weight:900}.submission-success-screen{color:#14532d;text-align:center;background:#f0fdf4;align-content:center;place-items:center;gap:14px;min-height:100vh;padding:24px;display:grid}.success-check{background:#22c55e;border-radius:999px;place-items:center;width:74px;height:74px;display:grid;box-shadow:0 18px 40px #22c55e3d}.success-check span{border-bottom:5px solid #fff;border-left:5px solid #fff;width:28px;height:16px;transform:rotate(-45deg)translate(2px,-2px)}.submission-success-screen h1{max-width:720px;margin:0;font-size:32px;line-height:1.2}.submission-success-screen p{color:#166534;margin:0;font-size:20px;font-weight:700}@keyframes typingDot{0%,to{opacity:.28;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}@keyframes livePulse{0%{box-shadow:0 0 #ef444480}to{box-shadow:0 0 0 10px #ef444400}}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=860px){.interview-page{padding:14px}.interview-header{flex-direction:column;align-items:flex-start}.interview-stage-grid{grid-template-columns:1fr;min-height:0}.video-shell,.tutor-video,.camera-preview{min-height:320px}.speech-control-wrap{bottom:18px}.tap-to-speak{width:118px;height:118px}}
