.voice-player-container{max-width:1248px;margin:0 auto;padding:0 24px;background-color:#fff}.voice-player-header{display:flex;flex-direction:column;gap:16px;margin-bottom:56px;text-align:center}.header-content{display:flex;flex-direction:column;align-items:center;gap:16px}.voice-icon{color:#1d4ed8;background-color:#eff6ff;padding:12px;border-radius:8px}.header-content h3{font-size:36px;font-weight:300;color:#111827;margin:0;line-height:1.25;font-family:Sora,sans-serif}.header-content h3 span{font-weight:600}.header-content p{font-size:16px;color:#6b7280;margin:0;max-width:767px;text-align:center;font-family:Inter,sans-serif}.voice-grid{display:grid;gap:24px;margin-bottom:48px;max-width:100%}.voice-grid.grid-layout{grid-template-columns:repeat(var(--items-per-row, 3),1fr)}.voice-grid.grid-3{grid-template-columns:repeat(3,1fr)}.voice-grid.grid-2{grid-template-columns:repeat(2,1fr)}.voice-grid.grid-4{grid-template-columns:repeat(4,1fr)}@media (max-width: 1024px){.voice-grid.grid-layout,.voice-grid.grid-3,.voice-grid.grid-4{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.voice-grid,.voice-grid.grid-layout,.voice-grid.grid-2,.voice-grid.grid-3,.voice-grid.grid-4{grid-template-columns:1fr;gap:16px}}.voice-carousel{position:relative;overflow:hidden;margin-bottom:48px}.voice-carousel.infinite-scroll{padding:16px 0}.carousel-container{display:flex;transition:transform .5s ease-in-out;gap:24px}.carousel-container.infinite{width:max-content}.carousel-slide{min-width:300px;flex-shrink:0}@media (max-width: 768px){.carousel-slide{min-width:280px}}@media (max-width: 480px){.carousel-slide{min-width:calc(100vw - 64px)}}.voice-card{background-color:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:24px;cursor:pointer;transition:all .2s ease-in-out;position:relative;display:flex;flex-direction:column;gap:16px;height:100%;box-sizing:border-box}.voice-card .voice-card-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.voice-card .voice-info{text-align:left;flex-grow:1}@media (max-width: 768px){.voice-grid{grid-template-columns:1fr;gap:16px}.voice-card .voice-card-header{flex-direction:column;align-items:center;text-align:center;gap:16px}.voice-card .voice-info{text-align:center}}.voice-card:hover{box-shadow:inset 0 0 0 2px #1d4ed8;border-color:#fff}.voice-card.selected{border-color:#1d4ed8;border-width:2px}.voice-card.premium{background:linear-gradient(135deg,#fff,#fef3c7);border-color:#f59e0b}.voice-card.playing{border-color:#dc2626;border-width:2px;background:linear-gradient(135deg,#fff,#fef2f2)}.voice-card.loading{opacity:.7;pointer-events:none}.avatar-container{position:relative;width:48px;height:48px;flex-shrink:0}.voice-avatar{width:100%;height:100%;border-radius:48px;object-fit:cover;border:2px solid #1d4ed8;transition:all .2s ease-in-out}.voice-card:hover .voice-avatar{transform:scale(1.05)}.premium-badge{position:absolute;top:-4px;right:-4px;background:linear-gradient(135deg,#fbbf24,#f59e0b);border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border:2px solid white}.premium-badge svg{color:#92400e}.play-button{width:48px;height:48px;border-radius:48px;border:none;background-color:#000;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;flex-shrink:0}.play-button:hover{background-color:#1d4ed8}.play-button.playing{background-color:#dc2626}.play-button.loading{opacity:.8}.voice-name{font-size:12px;font-weight:400;color:#374151;margin:4px 0 0;line-height:1.4;font-family:Inter,sans-serif}.voice-meta{display:flex;align-items:center;gap:8px;margin-top:4px}.voice-type{font-size:10px;padding:4px 8px;border-radius:4px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.voice-type.free{background-color:#d1fae5;color:#065f46}.voice-type.premium{background-color:#fef3c7;color:#92400e}.selected-indicator{position:absolute;top:16px;right:16px;background-color:#1d4ed8;color:#fff;padding:4px 12px;border-radius:4px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;animation:fadeIn .2s ease}.voice-player-footer{display:flex;justify-content:space-between;align-items:center;padding-top:32px;border-top:1px solid #e5e7eb;font-size:14px;color:#6b7280}.voice-count{margin:0;font-weight:500}.selected-voice-info{background-color:#eff6ff;color:#1d4ed8;padding:8px 16px;border-radius:4px;font-weight:600;border:1px solid #dbeafe}.loading-icon{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 767px){.voice-player-container{padding:0 16px}.voice-player-header{margin-bottom:32px}.header-content h3{font-size:28px}.voice-card{padding:20px 16px}.voice-player-footer{flex-direction:column;gap:16px;align-items:flex-start}.avatar-container,.play-button{width:40px;height:40px}.voice-grid{grid-template-columns:1fr!important}.carousel-slide{min-width:calc(100vw - 48px)!important}.carousel-controls{flex-wrap:wrap;gap:12px}.carousel-button{width:40px;height:40px}}@media (max-width: 767px){.voice-grid.list-layout{display:flex;flex-direction:column;gap:12px}.voice-grid.list-layout .voice-card{flex-direction:row;align-items:center;padding:16px;gap:16px}.voice-grid.list-layout .voice-card-header{flex-direction:row;gap:12px;margin-bottom:0}.voice-grid.list-layout .voice-info{text-align:left;flex-grow:1}.voice-grid.list-layout .selected-indicator{position:static;margin-left:auto;padding:2px 8px;font-size:10px}}.voice-grid.grid-2-columns{grid-template-columns:repeat(2,1fr)}.voice-grid.grid-3-columns{grid-template-columns:repeat(3,1fr)}@media (max-width: 1024px){.voice-grid.grid-3-columns{grid-template-columns:repeat(2,1fr)}}@media (max-width: 767px){.voice-grid.grid-2-columns,.voice-grid.grid-3-columns{grid-template-columns:1fr}}