body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background-color:#f4f7f6;color:#333;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;min-height:100vh;margin:0;padding:0;position:relative}.main-header{background-color:#2c3e50;color:#fff;padding:15px 0;text-align:center;width:100%;z-index:10;box-shadow:0 2px 5px rgb(0 0 0 / .2)}.header-content{display:flex;align-items:center;justify-content:center;gap:15px}.header-logo{width:45px;height:45px;flex-shrink:0}.main-header h2{margin:0}.background-pattern{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background-color:#e5ddd5;overflow:hidden;background-image:repeating-linear-gradient(45deg,rgb(0 0 0 / .05) 0,rgb(0 0 0 / .05) 1px,transparent 1px,transparent 20px)}.container{width:85%;max-width:600px;text-align:center;padding:20px;margin-top:30px;background-color:rgb(255 255 255 / .95);border-radius:12px;box-shadow:0 4px 15px rgb(0 0 0 / .15);z-index:1}h1{color:#2c3e50;margin-bottom:30px}.lines-container{display:flex;flex-direction:column;gap:20px;margin-bottom:30px}.pickup-box{background-color:#fff;padding:20px;border-radius:12px;box-shadow:0 4px 15px rgb(0 0 0 / .1);position:relative;overflow:hidden}.cover{position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgb(0 0 0 / .5);backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center;transition:opacity 0.3s ease;z-index:10}.cover.hidden{opacity:0;pointer-events:none}.reveal-button{padding:10px 20px;background-color:#3498db;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:1em;transition:background-color 0.2s}.reveal-button:hover:not(:disabled){background-color:#2980b9}.reveal-button:disabled{background-color:#bdc3c7;cursor:not-allowed}.hook{font-size:1.2em;font-weight:700;color:#e74c3c;margin-bottom:5px}.punch{font-size:1.1em;color:#27ae60;opacity:0;transition:opacity 0.5s ease-in-out}.punch.visible{opacity:1}.progress-bar{position:absolute;bottom:0;left:0;height:5px;background-color:#f1c40f;width:0;transition:width 2.2s linear}.progress-bar.active{width:100%}.controls{text-align:center}#next-button{padding:12px 25px;background-color:#2ecc71;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:1.1em;transition:background-color 0.2s,opacity 0.3s}#next-button:hover:not(:disabled){background-color:#27ad60}#next-button:disabled{opacity:.5;cursor:not-allowed}.like-section{position:absolute;top:10px;right:10px;display:flex;align-items:center;gap:5px;z-index:11;user-select:none}.like-button{cursor:pointer;border:none;background:none;padding:0;display:flex;align-items:center;font-size:1.5rem;color:#ccc;transition:color 0.2s ease,transform 0.1s;outline:none}.like-button:hover{color:#e74c3c}.like-button.liked{color:#e74c3c;transform:scale(1.1);cursor:default}.like-counter{font-size:.9em;font-weight:700;color:#7f8c8d;min-width:15px;text-align:left}@media (max-width:768px){.container{max-width:500px}.pickup-box{padding:15px}h1{font-size:1.5em}.header-logo{width:40px;height:40px}.header-content{gap:12px}}@media (max-width:480px){h1{font-size:1.3em;margin-bottom:20px}.hook{font-size:1.1em}.punch{font-size:1em}.header-logo{width:35px;height:35px}.header-content{gap:10px}.main-header h2{font-size:1.1em}}