:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#132238;background:#f4f7fb}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 80% 0,#dbeafe,transparent 30%),#f4f7fb}main{max-width:1440px;margin:auto;padding:34px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.eyebrow{margin:0 0 8px;color:#58708e;font-size:.72rem;letter-spacing:.13em;font-weight:700}h1{margin:0;font-size:1.7rem}.monitor{padding:11px 15px;border-radius:99px;background:#e8edf5;font-size:.85rem;font-weight:600}.workspace{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(500px,1.55fr);gap:26px;min-height:600px}.instruction,.camera,.ready-screen,.start-screen>div{background:#fff;border:1px solid #e0e8f1;border-radius:26px;box-shadow:0 18px 60px #183b6312}.instruction{padding:48px;display:flex;flex-direction:column;align-items:flex-start}.step-number{color:#1769e0;font-size:1rem;font-weight:800;background:#e8f1ff;border-radius:12px;padding:8px 11px;margin-bottom:42px}h2{font-size:clamp(2rem,3vw,3.35rem);letter-spacing:-.045em;line-height:1.05;margin:0 0 20px}.instruction>p:not(.eyebrow),.start-screen p:not(.eyebrow){font-size:1.08rem;line-height:1.65;color:#53677e;max-width:420px}.progress{display:flex;gap:9px;margin:36px 0}.progress i{display:block;width:31px;height:6px;border-radius:8px;background:#dce5ef}.progress i.done{background:#1468db}.progress i.active{background:#59a2ff}.camera{position:relative;overflow:hidden;background:#0b1420;min-height:500px}video{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transform:scaleX(-1)}.camera-status{position:absolute;bottom:20px;left:20px;padding:9px 12px;border-radius:8px;background:#0b1420c9;color:#dfeeff;font-size:.8rem}.countdown{position:absolute;inset:0;display:grid;place-items:center;background:#07111b70;color:white;font-size:9rem;font-weight:800}.primary,.secondary{border:0;border-radius:12px;padding:15px 22px;font-size:1rem;font-weight:700;cursor:pointer}.primary{background:#1267dc;color:#fff;box-shadow:0 9px 18px #1267dc32}.secondary{margin-top:12px;background:#eef3f8;color:#243851}.feedback{margin-top:auto;width:100%;padding:15px;border-radius:12px;background:#fff2f1;color:#b32318;line-height:1.55}.hidden{display:none!important}.ready-screen{margin:28px auto;padding:55px;text-align:center;max-width:620px}.ready-screen span{display:grid;place-items:center;margin:auto auto 18px;width:65px;height:65px;border-radius:50%;background:#dcfce7;color:#15803d;font-size:2rem}.start-screen{position:fixed;inset:0;z-index:5;display:grid;place-items:center;padding:24px;background:#f4f7fbeb;backdrop-filter:blur(9px)}.start-screen>div{max-width:520px;padding:48px}@media(max-width:850px){main{padding:18px}.workspace{grid-template-columns:1fr}.instruction{padding:32px;min-height:380px}.camera{min-height:420px}header{align-items:flex-start;gap:15px;flex-direction:column}}