*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;color:#333}a{text-decoration:none;color:inherit}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}@media (max-width: 960px){.container{padding:0 12px}}@media (max-width: 600px){.container{padding:0 8px}}.page-title{margin:24px 0;font-weight:500;color:#333}.card{background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.card:hover{transform:translateY(-4px);box-shadow:0 4px 12px #00000026}.img-container{position:relative;width:100%;padding-top:56.25%;overflow:hidden}.img-container img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.btn{display:inline-block;padding:8px 16px;border-radius:4px;font-weight:500;text-align:center;cursor:pointer;transition:background-color .3s ease,color .3s ease}.btn-primary{background-color:#3f51b5;color:#fff}.btn-primary:hover{background-color:#303f9f}.btn-secondary{background-color:#f50057;color:#fff}.btn-secondary:hover{background-color:#c51162}.form-group{margin-bottom:16px}.form-control{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:16px}.form-control:focus{outline:none;border-color:#3f51b5}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100px}.media-player{width:100%;border-radius:8px;overflow:hidden;margin-bottom:24px}.comment-section{margin-top:32px}.comment-item{padding:16px 0;border-bottom:1px solid #eee}.comment-header{display:flex;justify-content:space-between;margin-bottom:8px}.comment-user{font-weight:500}.comment-date{color:#777;font-size:14px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin:24px 0}@media (max-width: 600px){.grid{grid-template-columns:1fr;gap:16px}}
