*{margin:0;padding:0;box-sizing:border-box}:root{--bg: #ffffff;--bg-secondary: #f5f5f7;--bg-tertiary: #e8e8ed;--text-primary: #1d1d1f;--text-secondary: #6e6e73;--text-tertiary: #86868b;--accent: #0071e3;--accent-hover: #0077ed;--accent-light: rgba(0, 113, 227, .08);--green: #34c759;--yellow: #ff9f0a;--red: #ff3b30;--border: rgba(0, 0, 0, .06);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 12px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12);--radius: 12px;--radius-sm: 8px;--transition: .25s ease;--max-width: 720px;--font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif}html,body{font-family:var(--font);color:var(--text-primary);background:var(--bg-secondary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}.layout{min-height:100vh;display:flex;flex-direction:column}.page-content{flex:1;max-width:var(--max-width);width:100%;margin:0 auto;padding:24px 20px 100px}.page-title{font-size:28px;font-weight:700;letter-spacing:-.5px;margin-bottom:24px;color:var(--text-primary)}.tab-bar{position:fixed;bottom:0;left:0;right:0;background:#ffffffd9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid var(--border);display:flex;justify-content:center;gap:0;padding:8px 0 calc(8px + env(safe-area-inset-bottom));z-index:100}.tab-bar a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 24px;text-decoration:none;color:var(--text-tertiary);font-size:10px;font-weight:500;transition:color var(--transition)}.tab-bar a.active{color:var(--accent)}.tab-bar a svg{width:24px;height:24px}.card{background:var(--bg);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:20px;transition:box-shadow var(--transition),transform var(--transition)}.card:hover{box-shadow:var(--shadow-md)}.card-clickable{cursor:pointer}.card-clickable:hover{transform:translateY(-1px)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 20px;border:none;border-radius:980px;font-size:14px;font-weight:500;font-family:var(--font);cursor:pointer;transition:all var(--transition);line-height:1.2}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{background:var(--bg-tertiary);color:var(--text-tertiary);cursor:not-allowed}.btn-secondary{background:var(--bg-secondary);color:var(--text-primary)}.btn-secondary:hover{background:var(--bg-tertiary)}.btn-danger{background:#ff3b301a;color:var(--red)}.btn-danger:hover{background:#ff3b3026}.btn-small{padding:6px 14px;font-size:13px}.input{width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:15px;font-family:var(--font);background:var(--bg);color:var(--text-primary);transition:border-color var(--transition),box-shadow var(--transition);outline:none}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}textarea.input{min-height:120px;resize:vertical;line-height:1.6}.mode-toggle{display:inline-flex;background:var(--bg-tertiary);border-radius:980px;padding:3px;position:relative}.mode-toggle button{padding:6px 18px;border:none;border-radius:980px;font-size:13px;font-weight:500;font-family:var(--font);cursor:pointer;background:transparent;color:var(--text-secondary);transition:all var(--transition);position:relative;z-index:1}.mode-toggle button.active{color:var(--text-primary);background:var(--bg);box-shadow:var(--shadow-sm)}.progress-bar{height:4px;background:var(--bg-tertiary);border-radius:2px;overflow:hidden}.progress-bar-fill{height:100%;background:var(--accent);border-radius:2px;transition:width var(--transition)}.status-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:980px;font-size:12px;font-weight:500}.status-badge.pending{background:var(--bg-tertiary);color:var(--text-secondary)}.status-badge.analyzed{background:#0071e31a;color:var(--accent)}.status-badge.attempted,.status-badge.in_progress{background:#ff9f0a1a;color:var(--yellow)}.status-badge.scored,.status-badge.completed{background:#34c7591a;color:var(--green)}.score-circle{position:relative;display:inline-flex;align-items:center;justify-content:center}.score-circle svg{transform:rotate(-90deg)}.score-circle .score-value{position:absolute;font-size:20px;font-weight:700;color:var(--text-primary)}.phrase-highlight{background:#0071e31a;border-bottom:2px solid var(--accent);cursor:pointer;position:relative;padding:1px 2px;border-radius:3px;transition:background var(--transition)}.phrase-highlight:hover{background:#0071e333}.phrase-tooltip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:var(--text-primary);color:#fff;padding:10px 14px;border-radius:var(--radius-sm);font-size:13px;white-space:nowrap;z-index:10;box-shadow:var(--shadow-lg)}.phrase-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:var(--text-primary)}.phrase-tooltip .alt-label{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:#fff9;margin-bottom:4px}.phrase-tooltip .alt-item{padding:2px 0}.skeleton{background:linear-gradient(90deg,var(--bg-tertiary) 25%,var(--bg-secondary) 50%,var(--bg-tertiary) 75%);background-size:200% 100%;animation:skeleton-pulse 1.5s ease-in-out infinite;border-radius:var(--radius-sm)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes skeleton-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.feedback-section{margin-top:20px}.feedback-criteria{display:grid;gap:8px;margin-top:12px}.criteria-item{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--bg-secondary);border-radius:var(--radius-sm)}.criteria-name{font-size:13px;font-weight:600;text-transform:capitalize;min-width:100px}.criteria-score{font-size:14px;font-weight:700;min-width:30px}.criteria-comment{font-size:13px;color:var(--text-secondary);flex:1}.suggestions-list,.strengths-list{list-style:none;margin-top:8px}.suggestions-list li,.strengths-list li{padding:6px 0;font-size:14px;color:var(--text-secondary);display:flex;align-items:flex-start;gap:8px}.suggestions-list li:before{content:"→";color:var(--accent);font-weight:600}.strengths-list li:before{content:"✓";color:var(--green);font-weight:600}.empty-state{text-align:center;padding:48px 20px;color:var(--text-secondary)}.empty-state p{font-size:15px;margin-top:8px}.error-message{background:#ff3b3014;color:var(--red);padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;margin-bottom:16px}.example-block{background:#34c7590f;border-left:3px solid var(--green);padding:16px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:16px}.example-block .label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--green);margin-bottom:8px}.example-block p{font-size:15px;line-height:1.6;color:var(--text-primary)}.example-chevron{transition:transform var(--transition);flex-shrink:0}.example-chevron-expanded{transform:rotate(90deg)}.example-body{overflow:hidden;max-height:2000px;opacity:1;transition:max-height .3s ease,opacity .2s ease}.example-body-collapsed{max-height:0;opacity:0}.improved-block{background:#0071e30f;border-left:3px solid var(--accent);padding:16px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-top:16px}.improved-block .label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--accent);margin-bottom:8px}.improved-block p{font-size:15px;line-height:1.6;color:var(--text-primary)}.textarea-wrapper{position:relative}.mic-btn{position:absolute;bottom:10px;right:10px;width:36px;height:36px;border-radius:50%;border:none;background:var(--bg-secondary);color:var(--text-tertiary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition);z-index:2}.mic-btn:hover{background:var(--bg-tertiary);color:var(--text-secondary)}.mic-btn.recording{background:var(--red);color:#fff;animation:mic-pulse 1.5s ease-in-out infinite}.mic-btn.recording:hover{background:#e0342b;color:#fff}.mic-btn:disabled{opacity:.4;cursor:not-allowed;animation:none}@keyframes mic-pulse{0%,to{box-shadow:0 0 #ff3b3066}50%{box-shadow:0 0 0 8px #ff3b3000}}.recording-indicator{position:absolute;bottom:14px;right:54px;display:flex;align-items:center;gap:8px;z-index:2}.recording-timer{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-secondary)}.recording-timer.warning{color:var(--red)}.waveform-canvas{display:block;flex-shrink:0}.play-btn{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border:none;border-radius:980px;background:var(--bg-secondary);color:var(--text-tertiary);font-family:var(--font);font-size:11px;font-variant-numeric:tabular-nums;cursor:pointer;transition:all var(--transition);flex-shrink:0}.play-btn:hover{background:var(--bg-tertiary);color:var(--text-secondary)}.play-btn-error{color:#e55}.play-btn-time{color:var(--text-tertiary);font-weight:500;letter-spacing:.01em}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-20{margin-top:20px}.mt-24{margin-top:24px}.mb-8{margin-bottom:8px}.mb-12{margin-bottom:12px}.mb-16{margin-bottom:16px}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.text-secondary{color:var(--text-secondary)}.text-small{font-size:13px}