@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@400;600;800&display=swap";:root{--primary: #2563eb;--primary-hover: #1d4ed8;--bg-gradient: linear-gradient(135deg, #020617 0%, #0c4a6e 100%);--card-bg: rgba(30, 41, 59, .7);--card-border: rgba(56, 189, 248, .2);--text-main: #f0f9ff;--text-muted: #7dd3fc;--success: #22c55e;--error: #f43f5e;--warning: #f59e0b;--accent: #38bdf8}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;background:var(--bg-gradient);color:var(--text-main);min-height:100vh;display:flex;justify-content:center;align-items:center}#root{width:100%;max-width:1200px;padding:2rem}.title{font-family:Outfit,sans-serif;font-size:4rem;font-weight:800;text-align:center;margin-bottom:2rem;background:linear-gradient(to right,#38bdf8,#818cf8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.02em;text-shadow:0 10px 30px rgba(56,189,248,.3)}.glass-card{background:var(--card-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--card-border);border-radius:32px;padding:3rem;box-shadow:0 20px 50px #00000080,inset 0 0 20px #38bdf80d;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.glass-card:hover{transform:translateY(-5px);box-shadow:0 30px 60px #0009,inset 0 0 30px #38bdf81a}.input-area{width:100%;min-height:200px;background:#0003;border:1px solid var(--card-border);border-radius:16px;padding:1.5rem;color:var(--text-main);font-size:1.1rem;line-height:1.6;resize:vertical;margin-bottom:1.5rem;outline:none;transition:border-color .2s}.input-area:focus{border-color:var(--primary)}.controls{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-bottom:2rem}@media(max-width:640px){.controls{grid-template-columns:1fr}}.btn{padding:1rem 2rem;border-radius:9999px;border:none;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .2s}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-2px)}.btn-record{background:var(--error);color:#fff}.btn-record.active{animation:pulse 1.5s infinite}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 #ef4444b3}70%{transform:scale(1.05);box-shadow:0 0 0 10px #ef444400}to{transform:scale(1);box-shadow:0 0 #ef444400}}.results-display{margin-top:2rem;padding:2rem;background:#ffffff08;border-radius:20px;border:1px solid var(--card-border)}.score-badge{font-family:Outfit,sans-serif;font-size:2rem;font-weight:700;text-align:center;margin-bottom:1.5rem}.word-grid{display:flex;flex-wrap:wrap;gap:.5rem;font-size:1.25rem}.word{padding:.2rem .5rem;border-radius:4px;transition:all .2s;cursor:pointer}.word:hover{background:#ffffff1a}.word.correct{color:var(--success);font-weight:600}.word.incorrect{color:var(--error);text-decoration:underline}.word.warning{color:var(--warning);text-decoration:underline;text-decoration-style:dotted}.word.omission{color:var(--text-muted);opacity:.5}.loader{width:24px;height:24px;border:3px solid #FFF;border-bottom-color:transparent;border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}@media(max-width:768px){#root{padding:1rem}.title{font-size:2.5rem}.glass-card{padding:1.5rem;border-radius:20px}.btn{padding:.8rem 1.2rem;font-size:.9rem;justify-content:center}.controls .btn{width:100%}.input-area{padding:1rem;font-size:1rem;min-height:150px}.controls{grid-template-columns:1fr 1fr;gap:.8rem}}.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}.line-clamp-5{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}