@import"https://fonts.googleapis.com/css2?family=IM+Fell+DW+Pica:ital@0;1&display=swap";:root{--bg-gradient-start: #fce4ec;--bg-gradient-end: #f3e5f5;--primary-purple: #4a148c;--accent-purple: #8e24aa;--light-purple: #ce93d8;--dark-purple: #6a1b9a;--white: #fff;--green: #2e7d32;--light-green: #c8e6c9;--red: #c62828;--light-red: #ffcdd2;--shadow-soft: 0 2px 5px rgba(219, 112, 147, .2);--shadow-strong: 0 5px 15px rgba(206, 147, 216, .5);--shadow-hover: 0 8px 20px rgba(142, 36, 170, .7);--font-main: "IM Fell Dw Pica", serif}body{margin:0;font-family:var(--font-main);font-style:italic;background:linear-gradient(to right,var(--bg-gradient-start),var(--bg-gradient-end));color:var(--primary-purple);min-height:100vh}.start-screen{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem;text-align:center}.start-screen h1{font-size:3rem;margin-bottom:2rem;text-shadow:1px 1px 5px rgba(219,112,147,.6)}.name-input{width:280px;padding:.8rem 1rem;font-size:1.2rem;border:2px solid var(--light-purple);border-radius:1rem;outline:none;color:var(--primary-purple);transition:border-color .3s ease}.name-input:focus{border-color:var(--accent-purple);box-shadow:0 0 8px var(--accent-purple)}.start-btn{margin-top:1.5rem;background-color:var(--light-purple);color:var(--primary-purple);border:none;padding:.9rem 2rem;font-size:1.3rem;font-weight:700;font-family:var(--font-main);border-radius:1rem;cursor:pointer;box-shadow:var(--shadow-strong);transition:background-color .3s ease,color .3s ease}.start-btn:hover:not(:disabled){background-color:var(--accent-purple);color:var(--white);box-shadow:var(--shadow-hover)}.start-btn:disabled{background-color:#e1bee7;color:#b39ddb;cursor:not-allowed;box-shadow:none}.decor-image{margin-top:3rem;max-width:320px;width:80vw;border-radius:1rem;box-shadow:0 5px 25px #db70934d;filter:drop-shadow(0 0 6px var(--light-purple));-webkit-user-select:none;user-select:none}.game-screen{padding:2rem;max-width:800px;margin:0 auto}.timer{font-size:1.2rem;font-weight:700;margin:10px 0;color:#e60073;animation:pulse 1s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.quiz-card{background:linear-gradient(to right,var(--bg-gradient-start),var(--bg-gradient-end));padding:2rem;border-radius:1.5rem;text-align:center;margin:2rem auto;max-width:600px;box-shadow:0 0 30px #db709366}.quiz-card h3{margin-bottom:1rem}.lyric-line{font-style:italic;font-size:1.3rem;margin:1.5rem 0;color:var(--dark-purple);line-height:1.6;letter-spacing:.03em;border-left:4px solid var(--light-purple);padding-left:1rem;-webkit-user-select:text;user-select:text}.options{list-style:none;padding:0;margin-top:1rem;display:grid;gap:1rem}.option{background-color:var(--white);border:2px solid var(--light-purple);padding:.9rem 1.2rem;border-radius:1rem;cursor:pointer;font-weight:700;color:var(--primary-purple);box-shadow:var(--shadow-soft);transition:.3s ease}.option:hover{background-color:var(--bg-gradient-end);box-shadow:0 4px 10px #db709366}.option.correct{background-color:var(--light-green);border-color:#66bb6a;color:var(--green);box-shadow:0 0 15px #66bb6a}.option.wrong{background-color:var(--light-red);border-color:#ef5350;color:var(--red);box-shadow:0 0 15px #ef5350}.ranking-screen{max-width:500px;margin:3rem auto;padding:2rem;text-align:center;background-color:var(--bg-200);border-radius:1.5rem;box-shadow:0 4px 16px #00000026;animation:fade-in .6s ease-in-out}.ranking-title{font-size:2rem;color:var(--accent-200);margin-bottom:1.5rem}.ranking-list{list-style:none;padding:0;margin:0 auto;text-align:left}.ranking-item{background-color:var(--bg-300);margin-bottom:.8rem;padding:.75rem 1rem;border-radius:.75rem;font-weight:500;display:flex;justify-content:space-between;box-shadow:0 2px 6px #0000001a}.ranking-item:first-child{background-color:var(--accent-100);color:#fff;font-weight:700;border:2px solid var(--accent-200)}.ranking-back-btn{margin-top:1.5rem;background-color:var(--accent-200);color:#fff;padding:.6rem 1.2rem;font-family:var(--font-main);border:none;border-radius:.6rem;cursor:pointer;transition:background-color .3s ease}.ranking-back-btn:hover{background-color:var(--accent-100)}.swiftie-loading,.swiftie-error{font-size:1.1rem;text-align:center;margin:2rem;color:var(--accent-purple);-webkit-user-select:none;user-select:none}.quiz-finished{text-align:center;margin-top:4rem}.quiz-finished button{background-color:var(--accent-purple);color:var(--white);padding:.8rem 1.5rem;border:none;border-radius:1rem;font-size:1.2rem;font-weight:700;cursor:pointer;transition:.3s}.quiz-finished button:hover{background-color:var(--primary-purple)}.fade-in{animation:fadeIn .8s ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}