.container.svelte-xb7xas{max-width:1200px;margin:0 auto;padding:0 20px}.vlog-header.svelte-xb7xas{background:linear-gradient(135deg,#002b5b,#097fc3);color:#fff;padding:80px 0 50px;text-align:center}.vlog-header.svelte-xb7xas h1:where(.svelte-xb7xas){font-size:3rem;margin-bottom:1rem;font-weight:700}.vlog-header.svelte-xb7xas .subtitle:where(.svelte-xb7xas){font-size:1.2rem;max-width:800px;margin:0 auto;opacity:.9}.vlog-categories.svelte-xb7xas{background-color:#f5f5f5;padding:15px 0;border-bottom:1px solid #e0e0e0;position:sticky;top:0;z-index:10}.category-list.svelte-xb7xas{display:flex;list-style:none;padding:0;margin:0;justify-content:center;flex-wrap:wrap}.category-list.svelte-xb7xas li:where(.svelte-xb7xas){margin:5px}.category-list.svelte-xb7xas button:where(.svelte-xb7xas){background:none;border:none;padding:8px 16px;border-radius:20px;cursor:pointer;font-size:.9rem;transition:all .3s ease;color:#555;font-weight:500}.category-list.svelte-xb7xas button:where(.svelte-xb7xas):hover{background-color:#e0e0e0}.category-list.svelte-xb7xas button.active:where(.svelte-xb7xas){background-color:#ff007f;color:#fff}.vlog-content.svelte-xb7xas{padding:60px 0;background-color:#fafafa;min-height:60vh}.loading-container.svelte-xb7xas{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:50px 0}.loading-spinner.svelte-xb7xas{width:40px;height:40px;border:4px solid rgba(0,43,91,.1);border-radius:50%;border-top-color:#002b5b;animation:svelte-xb7xas-spin 1s ease-in-out infinite;margin-bottom:20px}@keyframes svelte-xb7xas-spin{to{transform:rotate(360deg)}}.empty-state.svelte-xb7xas{text-align:center;padding:40px 0;color:#555}.empty-state.svelte-xb7xas h2:where(.svelte-xb7xas){color:#002b5b;margin-bottom:15px}.error-state.svelte-xb7xas{text-align:center;padding:40px 0;color:#721c24;background-color:#f8d7da;border-radius:8px;margin:20px 0}.error-state.svelte-xb7xas h2:where(.svelte-xb7xas){color:#721c24;margin-bottom:15px}.retry-button.svelte-xb7xas,.reset-filter.svelte-xb7xas{margin-top:20px;background-color:#002b5b;color:#fff;border:none;padding:10px 20px;border-radius:5px;cursor:pointer;font-size:.95rem;transition:background-color .2s ease}.retry-button.svelte-xb7xas:hover,.reset-filter.svelte-xb7xas:hover{background-color:#003b7a}.videos-list.svelte-xb7xas{display:flex;flex-direction:column;gap:30px;margin-bottom:40px}.video-card.svelte-xb7xas{display:flex;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 5px 15px #00000014;transition:transform .3s ease,box-shadow .3s ease;border:1px solid rgba(0,0,0,.05)}.video-card.svelte-xb7xas:hover{transform:translateY(-5px);box-shadow:0 15px 30px #00000026}.video-thumbnail.svelte-xb7xas{flex:0 0 320px;position:relative;overflow:hidden}.thumbnail-link.svelte-xb7xas{display:block;width:100%;height:100%;position:relative}.video-thumbnail.svelte-xb7xas img:where(.svelte-xb7xas){width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.video-card.svelte-xb7xas:hover .video-thumbnail:where(.svelte-xb7xas) img:where(.svelte-xb7xas){transform:scale(1.05)}.play-button.svelte-xb7xas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background-color:#ff007fcc;border-radius:50%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease,transform .3s ease}.video-card.svelte-xb7xas:hover .play-button:where(.svelte-xb7xas){opacity:1;transform:translate(-50%,-50%) scale(1.1)}.video-category.svelte-xb7xas{position:absolute;top:15px;right:15px;background-color:#ff007f;color:#fff;font-size:.75rem;padding:4px 10px;border-radius:20px;font-weight:600;box-shadow:0 2px 5px #0003;z-index:2}.video-content.svelte-xb7xas{flex:1;padding:25px;display:flex;flex-direction:column}.video-title.svelte-xb7xas{font-size:1.35rem;font-weight:700;margin:0 0 15px;line-height:1.3}.video-title.svelte-xb7xas a:where(.svelte-xb7xas){color:#002b5b;text-decoration:none;transition:color .2s ease}.video-title.svelte-xb7xas a:where(.svelte-xb7xas):hover{color:#ff007f}.video-date.svelte-xb7xas{font-size:.85rem;color:#777;margin-bottom:15px;display:flex;align-items:center;gap:5px}.video-description.svelte-xb7xas{color:#555;margin-bottom:20px;line-height:1.6;flex-grow:1;font-size:.95rem}.watch-button.svelte-xb7xas{display:flex;align-items:center;justify-content:center;gap:8px;background-color:#002b5b;color:#fff;text-decoration:none;padding:10px 20px;border-radius:5px;font-weight:600;font-size:.95rem;align-self:flex-start;transition:background-color .2s ease,transform .2s ease}.watch-button.svelte-xb7xas:hover{background-color:#003b7a;transform:translateY(-2px)}.watch-button.svelte-xb7xas svg:where(.svelte-xb7xas){transition:transform .2s ease}.watch-button.svelte-xb7xas:hover svg:where(.svelte-xb7xas){transform:translate(5px)}.pagination.svelte-xb7xas{display:flex;justify-content:center;align-items:center;margin-top:40px;gap:15px}.pagination-btn.svelte-xb7xas{background-color:#002b5b;color:#fff;border:none;padding:8px 16px;border-radius:5px;cursor:pointer;transition:background-color .2s ease;font-weight:500}.pagination-btn.svelte-xb7xas:hover:not([disabled]){background-color:#003b7a}.pagination-btn[disabled].svelte-xb7xas{background-color:#ccc;cursor:not-allowed}.page-numbers.svelte-xb7xas{display:flex;align-items:center;gap:8px}.page-number.svelte-xb7xas{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid #ddd;background-color:#fff;color:#555;font-weight:500;cursor:pointer;transition:all .2s ease}.page-number.active.svelte-xb7xas{background-color:#ff007f;color:#fff;border-color:#ff007f}.page-number.svelte-xb7xas:hover:not(.active){background-color:#f0f0f0}.page-ellipsis.svelte-xb7xas{color:#777;letter-spacing:2px;font-weight:700}@media (max-width: 768px){.video-card.svelte-xb7xas{flex-direction:column}.video-thumbnail.svelte-xb7xas{flex:0 0 auto;height:200px}.video-content.svelte-xb7xas{padding:20px}.watch-button.svelte-xb7xas{align-self:center;width:100%}.vlog-header.svelte-xb7xas h1:where(.svelte-xb7xas){font-size:2.2rem}.vlog-header.svelte-xb7xas .subtitle:where(.svelte-xb7xas){font-size:1rem}.container.svelte-xb7xas{padding:0 15px}.pagination.svelte-xb7xas{flex-wrap:wrap}.page-numbers.svelte-xb7xas{gap:5px}.page-number.svelte-xb7xas{width:32px;height:32px;font-size:.9rem}.pagination-btn.svelte-xb7xas{padding:8px 12px;font-size:.9rem}}
