:root{font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color:#1a1a2e;background-color:#f5f5f7;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}.app{max-width:480px;margin:0 auto;min-height:100vh;padding:48px 20px 100px;display:flex;flex-direction:column;gap:24px}.header{text-align:center;margin-bottom:8px}.header h1{font-size:2rem;font-weight:700;letter-spacing:-.5px;background:linear-gradient(135deg,#e84393,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header p{color:#888;font-size:.9rem;margin-top:4px}.card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 12px #0000000f}.card h2{font-size:1rem;font-weight:600;margin-bottom:16px;color:#333}.input-group{display:flex;flex-direction:column;gap:12px}.input-field{display:flex;align-items:center;gap:12px}.input-field label{font-size:.85rem;color:#666;min-width:60px}.input-field input{flex:1;padding:12px 16px;border:1.5px solid #e8e8e8;border-radius:12px;font-size:1rem;outline:none;transition:border-color .2s;background:#fafafa;color:#1a1a2e}.input-field input:focus{border-color:#a855f7;background:#fff}.photo-buttons{display:flex;gap:12px;margin-bottom:16px}.photo-btn{flex:1;padding:12px;border:1.5px dashed #d0d0d0;border-radius:12px;background:#fafafa;cursor:pointer;font-size:.85rem;color:#666;display:flex;flex-direction:column;align-items:center;gap:6px;transition:border-color .2s,background .2s}.photo-btn:hover{border-color:#a855f7;background:#fdf4ff}.photo-btn .icon{font-size:1.5rem}.photo-preview{width:100%;border-radius:12px;overflow:hidden}.photo-preview img{width:100%;display:block;border-radius:12px}.cta-container{position:fixed;bottom:0;left:0;right:0;padding:16px 20px;background:linear-gradient(transparent,#f5f5f7 30%)}.cta-btn{display:block;width:100%;max-width:480px;margin:0 auto;padding:16px;border:none;border-radius:14px;font-size:1rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#e84393,#a855f7);cursor:pointer;transition:opacity .2s}.cta-btn:disabled{opacity:.4;cursor:not-allowed}.cta-btn:not(:disabled):hover{opacity:.9}.loading-screen{justify-content:center;align-items:center}.loader{width:48px;height:48px;border:4px solid #e8e8e8;border-top-color:#a855f7;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{margin-top:16px;color:#888;font-size:.95rem}.error-msg{background:#fef2f2;color:#dc2626;padding:12px 16px;border-radius:12px;font-size:.85rem}.score-card{text-align:center;padding:32px 24px}.score-circle{display:flex;flex-direction:column;align-items:center;justify-content:center;width:120px;height:120px;margin:0 auto 16px;border-radius:50%;background:linear-gradient(135deg,#e84393,#a855f7)}.score-value{font-size:2.5rem;font-weight:700;color:#fff;line-height:1}.score-label{font-size:.75rem;color:#fffc;margin-top:4px}.skin-type{font-size:1.1rem;font-weight:600;color:#333}.analysis-grid{display:flex;flex-direction:column;gap:12px}.analysis-card{padding:16px 20px}.analysis-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.analysis-icon{font-size:1.2rem}.analysis-name{font-weight:600;color:#333;flex:1}.analysis-score{font-weight:700;font-size:1.1rem;background:linear-gradient(135deg,#e84393,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.analysis-desc{font-size:.85rem;color:#666;line-height:1.5}.recommendations{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}.recommendations li{padding:12px 16px;background:#fdf4ff;border-radius:10px;font-size:.9rem;color:#555}