*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,-apple-system,sans-serif}body{background-color:#f5f7fa;color:#222}a{text-decoration:none;color:inherit}.container{max-width:1280px;margin:0 auto;padding:0 16px}.navbar{background:#1a1a2e;color:#fff;padding:14px 0;position:sticky;top:0;z-index:99}.nav-wrap{display:flex;justify-content:space-between;align-items:center}.logo{font-size:24px;font-weight:700;color:#4fd1c5}.nav-links{display:flex;gap:28px}.nav-links a:hover{color:#4fd1c5}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px;padding:30px 0}.video-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 12px #00000014;transition:transform .2s;cursor:pointer}.video-card:hover{transform:translateY(-4px)}.card-cover{width:100%;height:160px;object-fit:cover}.card-body{padding:12px}.card-title{font-weight:600;margin-bottom:6px;font-size:15px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-meta{display:flex;justify-content:space-between;font-size:13px;color:#666;margin-top:8px}.tag{background:#e6f7ff;color:#1890ff;padding:2px 8px;border-radius:4px;font-size:12px;display:inline-block;margin-top:6px}.player-wrap{width:100%;max-width:900px;margin:30px auto}video{width:100%;border-radius:8px;background:#000}.video-info{margin-top:16px}.video-info h2{margin-bottom:12px}.action-buttons{display:flex;gap:12px;margin:16px 0}.btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn:hover{opacity:.8}.btn-primary{background:#1a1a2e;color:#fff}.btn-outline{background:transparent;border:1px solid #1a1a2e;color:#1a1a2e}.form-box{max-width:420px;margin:60px auto;background:#fff;padding:32px;border-radius:10px;box-shadow:0 2px 16px #0000000f}.form-title{text-align:center;font-size:22px;margin-bottom:24px}.input-item{margin-bottom:18px}.input-item label{display:block;margin-bottom:6px;font-size:14px}.input-item input{width:100%;padding:10px;border:1px solid #ddd;border-radius:6px;font-size:14px}.category-tags{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0}.category-tag{padding:8px 16px;background:#fff;border-radius:20px;cursor:pointer;border:1px solid #eee;transition:all .2s}.category-tag:hover{border-color:#1a1a2e}.category-tag.active{background:#1a1a2e;color:#fff;border-color:#1a1a2e}.user-center{max-width:800px;margin:40px auto;background:#fff;padding:30px;border-radius:10px;box-shadow:0 2px 12px #0000000f}.user-head{display:flex;align-items:center;gap:16px;margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #eee}.avatar{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#4fd1c5,#1a1a2e);display:flex;align-items:center;justify-content:center;font-size:30px;color:#fff}.comment-section{margin-top:30px;padding-top:20px;border-top:1px solid #eee}.comment-item{padding:12px;background:#f8f9fa;border-radius:8px;margin-bottom:10px}.comment-meta{font-size:12px;color:#666;margin-bottom:4px}@media (max-width: 768px){.nav-links{gap:14px;font-size:14px}.logo{font-size:18px}.video-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}.card-cover{height:100px}.card-title{font-size:13px}.form-box{margin:30px 16px;padding:20px}.user-center{margin:20px 16px;padding:20px}}