body,html{overflow:hidden;height:100vh;margin:0;padding:0;font-family:SF Pro Display,sans-serif}.container{height:100vh;background-color:#000;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.background{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.5}.dot{position:absolute;width:8px;height:8px;background-color:#fff;border-radius:50%;box-shadow:0 0 15px #ffffffe6,0 0 30px #fffc,0 0 45px #ffffffb3,0 0 60px #fff9;animation:twinkle 2s infinite}@keyframes twinkle{0%,to{opacity:2}50%{opacity:.5}}@font-face{font-family:SF Pro Display;src:url(src/assets/SF-Pro.ttf)}.content{background-color:#fff;padding:2rem;border-radius:1rem;box-shadow:0 4px 8px #0003;max-width:24rem;width:100%;position:relative;z-index:10;text-align:center}.title{font-size:2rem;font-weight:700;margin-bottom:1.5rem;color:#000}.input-container{display:flex;flex-direction:column;gap:1rem;justify-content:center;align-items:center}.input{width:100%;padding:.5rem 1rem;border-radius:9999px;border:1px solid black}.button-container{display:flex;gap:1rem}.button{flex:1;padding:.75rem 1.5rem;border-radius:9999px;font-weight:700;color:#fff;transition:transform .3s,box-shadow .3s;cursor:pointer}.button.read{background-color:#000}.button.read:hover{background-color:#333;transform:scale(1.05);box-shadow:0 4px 8px #0000004d}.button.podcast{background-color:#4b5563}.button.podcast:hover{background-color:#374151;transform:scale(1.05);box-shadow:0 4px 8px #0000004d}.progress-bar{width:100%;height:6px;background-color:#f0f0f0;border-radius:3px;overflow:hidden;margin:10px 0}.progress{height:100%;background-color:#4caf50;transition:width .1s ease-in-out}.controls{display:flex;justify-content:center;margin-top:15px}.control-button{background:none;border:none;color:#333;font-size:24px;padding:5px;cursor:pointer;transition:color .2s ease}.control-button:hover{color:#4caf50}.text-view{display:flex;flex-direction:column;width:100%;max-width:400px;margin:0 auto;padding:15px;background-color:#f9f9f9;border:1px solid #ddd;border-radius:4px}.text-view .controls{display:flex;gap:10px;margin-bottom:10px}.text-view .button.font-control{padding:5px 10px;font-size:14px;cursor:pointer;background-color:#007bff;color:#fff;border:none;border-radius:3px}.text-view .button.font-control:hover{background-color:#0056b3}.text-view .content{line-height:1.5;padding:10px;background-color:#fff;border-radius:4px;overflow-y:auto;max-height:300px;width:100%;box-sizing:border-box}