.stop-page{background:linear-gradient(145deg,#fff5f3 0%,#ffe8e0 30%,#fff 70%,#fff0ed 100%);min-height:100vh;padding:40px 20px 80px;font-family:Inter,sans-serif}.stop-header{text-align:center;margin-bottom:40px;animation:.7s ease-out fadeDown}.stop-header h1{background:linear-gradient(135deg,#d32f2f,#ff6b6b);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:8px;font-size:3rem;font-weight:800}.stop-header p{color:#888;max-width:500px;margin:0 auto;font-size:1.1rem}.stop-badge-new{color:#fff;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#4cd964,#34c759);border-radius:20px;margin-bottom:12px;padding:4px 14px;font-size:.75rem;font-weight:700;display:inline-block;box-shadow:0 2px 8px #4cd9644d}.stop-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:20px;margin-bottom:36px;animation:.7s ease-out .2s backwards fadeUp;display:flex}.stop-letter-display{color:#fff;background:linear-gradient(135deg,#d32f2f,#ff6b6b);border-radius:18px;justify-content:center;align-items:center;width:80px;height:80px;font-size:2.6rem;font-weight:800;transition:transform .3s;display:flex;box-shadow:0 8px 24px #d32f2f40}.stop-letter-display:hover{transform:scale(1.08)rotate(-3deg)}.stop-btn{cursor:pointer;border:none;border-radius:14px;padding:14px 32px;font-size:1rem;font-weight:700;transition:all .3s;box-shadow:0 4px 14px #00000014}.stop-btn-gen{color:#fff;background:linear-gradient(135deg,#d32f2f,#ff6b6b)}.stop-btn-gen:hover{transform:translateY(-2px);box-shadow:0 8px 20px #d32f2f4d}.stop-btn-reset{color:#d32f2f;background:#fff;border:2px solid #ffd5d5}.stop-btn-reset:hover{background:#fff0ed;transform:translateY(-2px)}.stop-timer{font-variant-numeric:tabular-nums;color:#d32f2f;background:#d32f2f14;border-radius:12px;padding:8px 18px;font-size:1.8rem;font-weight:700}.stop-timer.stopped{color:#999;background:#0000000a}.stop-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;max-width:900px;margin:0 auto;animation:.7s ease-out .35s backwards fadeUp;display:grid}.stop-category-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffd9;border:1px solid #d32f2f1a;border-radius:16px;padding:20px 22px;transition:all .3s;box-shadow:0 2px 12px #0000000a}.stop-category-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px #d32f2f1f}.stop-category-card label{text-transform:uppercase;letter-spacing:1px;color:#d32f2f;margin-bottom:10px;font-size:.85rem;font-weight:700;display:block}.stop-category-card input{background:#fff;border:2px solid #ffe0e0;border-radius:10px;outline:none;width:100%;padding:12px 14px;font-family:Inter,sans-serif;font-size:1rem;transition:border-color .3s}.stop-category-card input:focus{border-color:#ff6b6b;box-shadow:0 0 0 4px #ff6b6b1f}.stop-category-card input:disabled{color:#aaa;background:#fafafa;border-color:#eee}.stop-category-card.filled input{background:#f3fff5;border-color:#4cd964}.stop-score{text-align:center;margin-top:36px;animation:.6s ease-out fadeUp}.stop-score-badge{color:#fff;background:linear-gradient(135deg,#d32f2f,#ff6b6b);border-radius:30px;padding:12px 36px;font-size:1.2rem;font-weight:700;display:inline-block;box-shadow:0 6px 20px #d32f2f40}@keyframes fadeDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:600px){.stop-header h1{font-size:2rem}.stop-controls{flex-direction:column}.stop-grid{grid-template-columns:1fr}}