@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap";body{margin:0;padding:0;overflow-x:hidden;overflow-y:scroll;scroll-behavior:smooth;font-family:Roboto,sans-serif;background-color:#f0f0f0;height:100%;justify-content:center;align-items:center}.app{width:100%;height:100%;background-color:#fff;box-shadow:0 4px 6px #0000001a;border-radius:0;flex-direction:column;align-items:center;padding:20px;overflow-x:hidden}.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px;max-width:1200px;width:100%;margin-left:auto;margin-right:auto;flex-grow:1;overflow-y:auto}@media (max-width: 992px){.video-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width: 768px){.video-grid{grid-template-columns:1fr}.video-title{font-size:.8rem}}@media (max-width: 480px){.video-grid{grid-template-columns:1fr}.video-title{font-size:.6rem}}.add_video_form{display:flex;flex-direction:column;gap:10px;max-width:400px;margin:0 auto}.add_video_form input{padding:10px;border:1px solid #ccc;border-radius:5px;font-size:1rem}.add_video_form button{padding:10px;background-color:#007bff;color:#fff;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s ease;margin-bottom:2rem}.add_video_form button:hover{background-color:#0056b3}.video-card{perspective:1000px;max-width:100%;box-sizing:border-box}.video-card-inner{max-width:100%;box-sizing:border-box;position:relative;width:100%;height:0;padding-bottom:56.25%;transform-style:preserve-3d;transition:transform .6s}.video-card:hover .video-card-inner{transform:rotateY(180deg)}.video-card-front,.video-card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:10px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center}.video-card-front iframe,.video-card-back{width:100%;height:100%;max-width:100%;max-height:100%;border:0;border-radius:10px;object-fit:cover}.video-card-back{background-color:#f9f9f9;transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px;box-sizing:border-box}.video-title{font-size:1.2rem;margin-bottom:10px;color:#333}.video-link{display:block;margin-bottom:10px;color:#007bff;text-decoration:none}.video-link:hover{text-decoration:underline}.votes-btn-wrap{display:flex;gap:10px;margin-top:10px}.up-vote{background-color:#28a745;color:#fff;padding:10px;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.up-vote:hover{background-color:#218838}.down-vote{background-color:#dc3545;color:#fff;padding:10px;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.down-vote:hover{background-color:#c82333}.delete{background-color:#000;color:#fff;padding:10px;border:none;border-radius:5px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.delete:hover{background-color:#5a6268}.app-header{text-align:center;color:#333;margin-bottom:20px;padding:.5rem;margin:.5rem}h1{font-weight:600;color:#2772db}h3,h4{font-weight:500;background-color:#070f4e;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.footer_segmentation{text-align:center;padding:20px;background-color:#f0f0f0;margin-top:20px;border-top:1px solid #e0e0e0}.footer_segmentation a{color:#007bff;text-decoration:none}.footer_segmentation a:hover{text-decoration:underline}:root{--font-size-base: 16px;--font-size-small: 14px;--font-size-large: 20px;--font-weight-regular: 400;--font-weight-bold: 700;--color-primary: #1d4160;--color-background: #f3ecf1;--color-card-bg: #f9f9f9;--color-card-border: #e0e0e0;--color-card-shadow: rgba(0, 0, 0, .1);--border-radius: 10px}@media (max-width: 992px){:root{--font-size-base: 14px;--font-size-small: 12px;--font-size-large: 18px}}@media (max-width: 768px){:root{--font-size-base: 12px;--font-size-small: 10px;--font-size-large: 16px}}@media (max-width: 480px){:root{--font-size-base: 10px;--font-size-small: 8px;--font-size-large: 14px}}