*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:Noto Sans KR,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;background:#eef4fb}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#c8deff,#eef4fb,#d6ead8);padding:16px}.phone-frame{width:100%;max-width:420px;min-height:780px;background:#fff;border-radius:40px;box-shadow:0 24px 80px #1565c02e;overflow:hidden;display:flex;flex-direction:column;position:relative}.screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 32px;gap:24px;text-align:center;min-height:780px}.start-screen{background:linear-gradient(180deg,#eef4fb,#fff 60%)}.app-logo{width:96px;height:96px;background:linear-gradient(135deg,#1565c0,#42a5f5);border-radius:28px;display:flex;align-items:center;justify-content:center;font-size:48px;box-shadow:0 8px 24px #1565c04d;margin-bottom:8px}.app-title{font-size:30px;font-weight:900;color:#1a237e;line-height:1.2}.app-subtitle{font-size:17px;color:#546e7a;line-height:1.6;font-weight:500}.instruction-box{background:#e3f2fd;border-radius:16px;padding:20px 24px;width:100%}.instruction-box p{font-size:17px;color:#1565c0;font-weight:500;line-height:1.6}.instruction-steps{list-style:none;width:100%;display:flex;flex-direction:column;gap:12px}.instruction-steps li{display:flex;align-items:center;gap:14px;background:#f5f7fa;border-radius:14px;padding:14px 18px;font-size:16px;color:#37474f;font-weight:500;text-align:left}.step-num{width:30px;height:30px;background:#1565c0;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex-shrink:0}.recording-screen{background:#fff}.recording-header{display:flex;align-items:center;gap:12px;margin-bottom:8px}.pulse-dot{width:18px;height:18px;background:#e53935;border-radius:50%;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:.6}}.recording-label{font-size:20px;font-weight:700;color:#e53935}.timer{font-size:64px;font-weight:900;color:#1a237e;letter-spacing:2px;font-variant-numeric:tabular-nums;line-height:1}.recording-wave{display:flex;align-items:center;gap:5px;height:48px;margin:8px 0}.wave-bar{width:6px;background:linear-gradient(180deg,#42a5f5,#1565c0);border-radius:3px;animation:wave 1.2s ease-in-out infinite}.wave-bar:nth-child(1){animation-delay:0s}.wave-bar:nth-child(2){animation-delay:.15s}.wave-bar:nth-child(3){animation-delay:.3s}.wave-bar:nth-child(4){animation-delay:.45s}.wave-bar:nth-child(5){animation-delay:.3s}.wave-bar:nth-child(6){animation-delay:.15s}.wave-bar:nth-child(7){animation-delay:0s}@keyframes wave{0%,to{height:8px}50%{height:40px}}.recording-hint{font-size:17px;color:#78909c;font-weight:500;line-height:1.5}.max-time-hint{font-size:14px;color:#b0bec5}.processing-screen{background:linear-gradient(180deg,#e3f2fd,#fff 50%)}.spinner-container{position:relative;width:100px;height:100px}.spinner-ring{width:100px;height:100px;border:6px solid #E3F2FD;border-top-color:#1565c0;border-radius:50%;animation:spin 1s linear infinite}.spinner-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:36px}@keyframes spin{to{transform:rotate(360deg)}}.processing-title{font-size:24px;font-weight:700;color:#1a237e}.processing-sub{font-size:17px;color:#546e7a;line-height:1.6;font-weight:500}.processing-dots{display:flex;gap:8px;margin-top:-8px}.processing-dots span{width:10px;height:10px;background:#1565c0;border-radius:50%;animation:dot-bounce 1.2s ease-in-out infinite}.processing-dots span:nth-child(2){animation-delay:.2s}.processing-dots span:nth-child(3){animation-delay:.4s}@keyframes dot-bounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}.result-screen{background:#f5f7fa;justify-content:flex-start;padding-top:48px;gap:16px}.result-header{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:4px}.result-badge{background:#e8f5e9;color:#2e7d32;font-size:14px;font-weight:700;padding:4px 14px;border-radius:20px}.result-title{font-size:26px;font-weight:900;color:#1a237e}.card{width:100%;background:#fff;border-radius:20px;padding:20px 22px;box-shadow:0 2px 12px #00000012;text-align:left}.card-title{font-size:15px;font-weight:700;color:#546e7a;margin-bottom:10px;display:flex;align-items:center;gap:7px;text-transform:uppercase;letter-spacing:.5px}.card-main{border-left:4px solid #1565C0}.card-main .card-title{color:#1565c0}.card-med{border-left:4px solid #7B1FA2}.card-med .card-title{color:#7b1fa2}.card-visit{border-left:4px solid #00838F}.card-visit .card-title{color:#00838f}.card-caution{border-left:4px solid #E65100}.card-caution .card-title{color:#e65100}.card-text{font-size:18px;color:#263238;font-weight:500;line-height:1.7}.summary-chip{width:100%;background:#1565c0;color:#fff;border-radius:16px;padding:14px 20px;font-size:16px;font-weight:600;line-height:1.5;text-align:center}.error-screen{background:#fff3e0}.error-icon{font-size:72px}.error-title{font-size:26px;font-weight:700;color:#bf360c}.error-message{font-size:17px;color:#5d4037;line-height:1.6;font-weight:500;max-width:280px}.btn{width:100%;padding:20px;border:none;border-radius:18px;font-size:20px;font-weight:700;font-family:inherit;cursor:pointer;transition:transform .1s,box-shadow .1s;letter-spacing:-.3px}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(135deg,#1565c0,#1e88e5);color:#fff;box-shadow:0 8px 24px #1565c066}.btn-primary:hover{box-shadow:0 10px 28px #1565c080}.btn-danger{background:linear-gradient(135deg,#c62828,#e53935);color:#fff;box-shadow:0 8px 24px #c6282866}.btn-secondary{background:#eceff1;color:#37474f;box-shadow:0 4px 12px #00000014}