*{box-sizing:border-box;margin:0;padding:0}:root{--bg:#faf9f6;--bg-soft:#f5f3ee;--surface:#fff;--border:#ececea;--border-strong:#d8d8d4;--ink-900:#111110;--ink-800:#1c1c1a;--ink-700:#2d2d2a;--ink-600:#44443f;--ink-500:#5e5e57;--ink-400:#8a8a83;--ink-300:#b9b9b3;--ink-200:#d8d8d4;--ink-100:#ececea;--primary:#1d39b8;--primary-strong:#1c2c70;--primary-soft:#eef4ff;--record:#dc2626;--record-strong:#b91c1c;--record-soft:#fef2f2;--success:#047857;--success-soft:#ecfdf5;--warn:#d97706;--warn-strong:#b45309;--warn-soft:#fffbeb;--shadow-soft:0 1px 2px #1c1c1a0a, 0 0 0 1px #1c1c1a0a;--shadow-card:0 2px 8px #1c1c1a0a, 0 1px 2px #1c1c1a0d, 0 0 0 1px #1c1c1a0d;--shadow-pop:0 12px 32px -8px #1c1c1a1f, 0 6px 16px -4px #1c1c1a14, 0 0 0 1px #1c1c1a0d;--radius:.875rem;--radius-sm:.5rem;--radius-pill:999px;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}body{font-family:var(--font-sans);background:var(--bg);color:var(--ink-900);letter-spacing:-.005em;font-feature-settings:"ss01", "cv11", "cv02";justify-content:center;align-items:center;min-height:100vh;padding:2rem 1rem;display:flex;position:relative}body:before{content:"";pointer-events:none;z-index:-1;background:radial-gradient(at 20% -10%,#1d39b80d,#0000 50%),radial-gradient(at 80% 110%,#dc26260a,#0000 50%);position:fixed;inset:0}.container{width:100%;max-width:480px;position:relative}.brand-header{text-align:center;margin-bottom:1.75rem}.brand-mark{background:var(--ink-900);color:#fff;width:3rem;height:3rem;box-shadow:var(--shadow-card);border-radius:.75rem;justify-content:center;align-items:center;margin-bottom:.875rem;display:inline-flex}.brand-mark svg{width:1.75rem;height:1.75rem}h1{letter-spacing:-.025em;color:var(--ink-900);margin-bottom:.5rem;font-size:1.625rem;font-weight:700}#subtitle{color:var(--ink-500);max-width:360px;margin:0 auto;font-size:.9375rem;line-height:1.5}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-soft);margin-bottom:.75rem;padding:1.25rem;transition:border-color .15s,box-shadow .15s}.card-soft{background:linear-gradient(135deg, var(--surface), var(--bg-soft));align-items:flex-start;gap:.875rem;display:flex}.card-icon{background:var(--surface);border:1px solid var(--border);width:2rem;height:2rem;color:var(--ink-700);border-radius:.5rem;flex-shrink:0;justify-content:center;align-items:center;display:flex}.card-icon svg{width:1.125rem;height:1.125rem}.card-soft p{color:var(--ink-600);font-size:.875rem;line-height:1.55}.card-controls{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.btn{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border:1px solid #0000;border-radius:.625rem;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-family:inherit;font-size:.875rem;font-weight:500;line-height:1.25;text-decoration:none;transition:all .15s;display:inline-flex}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--ink-900);color:#fff;flex:1;min-width:200px}.btn-primary:hover:not(:disabled){background:var(--ink-700);box-shadow:var(--shadow-card);transform:translateY(-1px)}.btn-primary .btn-dot{background:var(--record);border-radius:50%;width:.5rem;height:.5rem;animation:1.6s cubic-bezier(.4,0,.6,1) infinite pulse-record;display:inline-block;box-shadow:0 0 #dc262699}.btn-secondary{background:var(--surface);color:var(--ink-800);border-color:var(--border-strong)}.btn-secondary:hover:not(:disabled){background:var(--bg-soft);border-color:var(--ink-300)}.btn-stop{background:var(--record-soft);color:var(--record-strong);border-color:#dc262640}.btn-stop:hover:not(:disabled){background:#dc26261a;border-color:#dc262666}.btn-stop .stop-square{background:var(--record);border-radius:.125rem;width:.625rem;height:.625rem;display:inline-block}.btn-lg{border-radius:.75rem;padding:.875rem 1.25rem;font-size:.9375rem}.btn-ghost{color:var(--ink-500);background:0 0;border:none;font-size:.8125rem;font-weight:400;text-decoration:underline}.btn-ghost:hover:not(:disabled){color:var(--record);background:0 0}@keyframes pulse-record{0%,to{box-shadow:0 0 #dc262699}50%{box-shadow:0 0 0 5px #dc262600}}#status{text-align:center}#status-text{color:var(--ink-500);font-size:.875rem}.status-idle #status-text{color:var(--ink-500)}.status-recording{background:var(--record-soft);border-color:#dc262640}.status-recording #status-text{color:var(--record-strong);font-weight:500}.status-recording #status-text:before{content:"";background:var(--record);vertical-align:middle;border-radius:50%;width:.5rem;height:.5rem;margin-right:.5rem;animation:1.6s cubic-bezier(.4,0,.6,1) infinite pulse-record;display:inline-block}.status-paused{background:var(--warn-soft);border-color:#d9770640}.status-paused #status-text{color:var(--warn-strong);font-weight:500}.status-paused #status-text:before{content:"⏸";margin-right:.5rem}.warning{background:var(--warn-soft);color:var(--warn-strong);border-color:#d9770640;font-size:.875rem}#timer,.timer{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--ink-900);margin-top:.5rem;font-size:2.25rem;font-weight:600;line-height:1.1}.length-warning{color:var(--warn-strong);margin-top:.625rem;font-size:.8125rem;font-weight:500}.hidden{display:none!important}.downloads{flex-direction:column;gap:.5rem;margin-top:1rem;display:flex}.result-icon{background:var(--success-soft);width:2.5rem;height:2.5rem;color:var(--success);border-radius:.625rem;justify-content:center;align-items:center;margin-bottom:.625rem;display:inline-flex}.result-icon svg{width:1.5rem;height:1.5rem}#result-text{color:var(--ink-700);font-size:.9375rem;font-weight:500}.record-again-btn{width:100%;margin-top:.625rem}.brand-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-top:1.5rem;padding-top:1rem;display:flex}.lang-toggle{border:1px solid var(--border);cursor:pointer;color:var(--ink-600);background:0 0;border-radius:.4rem;padding:.4rem .75rem;font-family:inherit;font-size:.75rem;transition:all .15s}.lang-toggle:hover{background:var(--surface);color:var(--ink-900);border-color:var(--ink-300)}.footer-tag{color:var(--ink-400);font-size:.75rem}.footer-tag strong{color:var(--ink-700);font-weight:600}.webcam-card{padding:1rem 1.25rem}.webcam-row{cursor:pointer;align-items:flex-start;gap:.75rem;display:flex}.webcam-checkbox{cursor:pointer;width:1.1rem;height:1.1rem;accent-color:var(--ink-900);margin-top:.25rem}.webcam-label-text{flex-direction:column;gap:.15rem;display:flex}#webcam-label{color:var(--ink-900);font-size:.9375rem;font-weight:500}.webcam-hint{color:var(--ink-500);font-size:.8125rem;line-height:1.45}.webcam-preview{object-fit:cover;border:3px solid #fff;border-radius:50%;width:120px;height:120px;margin-top:.75rem;display:block;transform:scaleX(-1);box-shadow:0 4px 12px #00000026}.webcam-position{border-top:1px solid var(--border);margin-top:1rem;padding-top:.875rem}.webcam-position-label{color:var(--ink-500);margin-bottom:.5rem;font-size:.8125rem}.webcam-position-grid{grid-template-columns:repeat(4,1fr);gap:.5rem;max-width:320px;display:grid}.webcam-corner{cursor:pointer;display:block}.webcam-corner input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.webcam-corner-box{aspect-ratio:4/3;border:1.5px solid var(--border-strong);background:linear-gradient(135deg, var(--bg) 0%, var(--bg-soft) 100%);border-radius:.5rem;width:100%;transition:border-color .15s,background .15s;display:block;position:relative}.webcam-corner:hover .webcam-corner-box{border-color:var(--ink-400)}.webcam-corner input:checked+.webcam-corner-box{border-color:var(--ink-900);background:linear-gradient(135deg,#fff 0%,#f8f7f5 100%)}.webcam-dot{background:var(--ink-900);border:2px solid #fff;border-radius:50%;width:14px;height:14px;position:absolute;box-shadow:0 1px 2px #0003}.webcam-dot.top-left{top:6px;left:6px}.webcam-dot.top-right{top:6px;right:6px}.webcam-dot.bottom-left{bottom:6px;left:6px}.webcam-dot.bottom-right{bottom:6px;right:6px}.mic-picker-label{color:var(--ink-700);margin-bottom:.5rem;font-size:.8125rem;font-weight:500;display:block}.mic-picker{border:1px solid var(--border-strong);width:100%;color:var(--ink-900);cursor:pointer;background:#fff;border-radius:.5rem;padding:.5rem .75rem;font-family:inherit;font-size:.875rem}.mic-picker:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #1d39b81f}.audio-meter{justify-content:center;align-items:center;gap:.625rem;margin-top:.875rem;display:flex}.audio-meter-label{color:var(--ink-500);justify-content:center;align-items:center;display:inline-flex}.audio-meter-track{background:var(--ink-100);border-radius:3px;width:200px;height:6px;overflow:hidden}.audio-meter-fill{background:linear-gradient(to right, var(--success), var(--warn) 80%, var(--record));border-radius:3px;width:0%;height:100%;transition:width 80ms linear}.customer-description-label{color:var(--ink-900);letter-spacing:-.005em;margin-bottom:.625rem;font-size:.9375rem;font-weight:600;display:block}.customer-description-input{border:1px solid var(--border-strong);width:100%;color:var(--ink-900);resize:vertical;background:#fff;border-radius:.5rem;min-height:4.5rem;padding:.625rem .75rem;font-family:inherit;font-size:.875rem;line-height:1.5;transition:border-color .15s,box-shadow .15s}.customer-description-input:focus{border-color:var(--ink-900);outline:none;box-shadow:0 0 0 3px #11111014}.customer-description-hint{color:var(--ink-400);margin-top:.5rem;font-size:.75rem;line-height:1.45}.submit-description-btn{width:100%;margin-top:.875rem}.upload-progress-bar{background:var(--ink-100);border-radius:3px;width:100%;height:6px;margin-top:.625rem;overflow:hidden}.upload-progress-fill{background:linear-gradient(to right, var(--primary), var(--primary-strong));border-radius:3px;width:0%;height:100%;transition:width .2s}.upload-progress-stats{color:var(--ink-400);font-size:.75rem;font-family:var(--font-mono);font-variant-numeric:tabular-nums;margin-top:.5rem}.rec-badge{z-index:999;background:var(--ink-900);color:#fff;border-radius:var(--radius-pill);letter-spacing:.05em;box-shadow:var(--shadow-pop);-webkit-user-select:none;user-select:none;pointer-events:none;align-items:center;gap:.5rem;padding:.5rem .875rem;font-size:.8125rem;font-weight:600;animation:.25s ease-out rec-badge-in;display:inline-flex;position:fixed;top:1rem;right:1rem}@keyframes rec-badge-in{0%{opacity:0;transform:translateY(-8px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.rec-badge-dot{background:var(--record);border-radius:50%;width:.5rem;height:.5rem;animation:1.6s cubic-bezier(.4,0,.6,1) infinite pulse-record;box-shadow:0 0 #dc2626b3}.rec-badge-time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:#fffc;font-size:.75rem;font-weight:500}.countdown-overlay{-webkit-backdrop-filter:blur(12px);z-index:1000;color:#fff;-webkit-user-select:none;user-select:none;background:#111110f0;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.countdown-number{letter-spacing:-.04em;font-variant-numeric:tabular-nums;font-feature-settings:"ss01";font-size:10rem;font-weight:800;line-height:1;animation:1s ease-out infinite countdown-pulse}.countdown-label{opacity:.7;letter-spacing:.01em;margin-top:1.5rem;font-size:1.0625rem}.countdown-skip-hint{color:#fff6;letter-spacing:.02em;font-size:.8125rem;position:absolute;bottom:2rem}@keyframes countdown-pulse{0%{opacity:.6;transform:scale(.85)}50%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.12)}}*{scrollbar-width:thin;scrollbar-color:var(--ink-200) transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--ink-200);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--ink-300)}::selection{background:var(--primary-soft);color:var(--primary-strong)}